<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">
    <title>支付信息</title>
    <style type="text/css">
        html,
        body,
        img {
            margin: 0;
            padding:0;
        }
        html,
        body {
            width: 100%;
            height: 100%;
            background: #F7F7F7;
            font-size: 100%;
            font-family: PingFang SC,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Arial,sans-serif;
        }
        .maincontent {
            width: 100%;
            background: #ffffff;
            padding: 9.6% 0;
        }
        img {
            width: 100%;
            min-width: 100%;
            height: auto;
        }
        .img_box {
            width: 26%;
            margin: 0 auto;
        }
        .status_msg_box {
            width: 75%;
            margin: 6.5% auto 0 auto;
            display: table;
            font-size: 1rem;
        }
        .status_icon {
            display: table-cell;
            width: 12.5%;
            text-align: center;
            vertical-align: middle;
        }
        .status_msg {
            display: table-cell;
            width: 87.5%;
            text-align: center;
            vertical-align: middle;
            color: #333333;
            padding-left: 3.9%;
        }
        .link {
            margin-top: 20%;
            padding: 0 5%;
        }
        .callback_link {
            width: 48%;
            height: 40px;
            line-height: 40px;
            text-align: center;
            border-radius: 5px;
            color: #fff;
            overflow: hidden;
        }
        .link_1 {
            background: #09bb07;
            float: left;
        }
        .link_2 {
            background: #ff4e4e;
            float:right;
        }
        .link_3.callback_link {
            width: 100%;
            background: #09bb07;
        }
        /* iphone5 */
        @media screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2){
            .status_msg_box {
                width: 84%;
            }
        }
    </style>
</head>
<body>

<?php if($output['pay_state'] != 'no_order') { ?>
<div class="maincontent">
    <div class="img_box">
        <img src="<?php echo RESOURCE_SITE_URL; ?>/mobile/cmbpay/images/success_icon.png" alt="支付成功"/>
    </div>
    <div class="status_msg_box">
        <div class="status_icon">
            <img src="<?php echo RESOURCE_SITE_URL; ?>/mobile/cmbpay/images/ok.png" alt="支付成功"/>
        </div>
        <div class="status_msg">
            恭喜您，订单支付成功！我们会尽快将宝贝送达哦！
        </div>
    </div>
    <div class="link">
        <div class="callback_link link_1" id="link_main">返回</div>
        <div class="callback_link link_2" id="link_order">查看订单</div>
    </div>
</div>
<?php } else { ?>
<div class="maincontent">
    <div class="img_box">
        <img src="<?php echo RESOURCE_SITE_URL; ?>/mobile/cmbpay/images/fail_icon.png" alt="支付成功"/>
    </div>
    <div class="status_msg_box">
        <div class="status_icon">
            <img src="<?php echo RESOURCE_SITE_URL; ?>/mobile/cmbpay/images/error.png" alt="支付成功"/>
        </div>
        <div class="status_msg">
            温馨提示：如果您已付款，请稍候前往我的订单查看支付情况!
        </div>
    </div>
    <div class="link">
        <div class="callback_link link_3" id="link_home">返回</div>
    </div>
</div>
<?php }?>
<input type="hidden" value="<?php if($output['pay_state'] != 'no_order') { echo $output['pay_sn']; } ?>" id="pay_sn">
</body>
<script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/mobile/comm/bridge.js"></script>
<script>
    if(isMobile.iOS()) {
        init_ios_bridge(function(bridge) { });
    } else {
        init_android_bridge();
    }

    var link_main=document.getElementById('link_main'),
        link_order=document.getElementById('link_order'),
        link_home=document.getElementById('link_home'),
        pay_sn=document.getElementById('pay_sn').value;

    link_main.addEventListener('click',function(){
        call_native_handler('on_native_click','{"action":"main","params":null}');
    },false);

    link_order.addEventListener('click',function(){
        call_native_handler('on_native_click','{"action":"orderinfo","params":{"pay_sn":"' + pay_sn + '"}}');
    },false);

    link_home.addEventListener('click',function(){
        call_native_handler('on_native_click','{"action":"main","params":null}');
    },false);
</script>
</html>