| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316 | <!DOCTYPE html><html class="remModel"><head>    <meta charset="UTF-8">    <meta http-equiv="Cache-Control" content="no-cache,no-store,no-siteapp,must-revalidate">    <meta http-equiv="pragma" content="no-cache">    <meta http-equiv="expires" content="0">    <meta name="author" content="">    <meta name="description" content=""/>    <meta name="keywords" content="扫码支付,线上投币,运营数据,物联网"/>    <meta name="format-detection" content="telephone=no,email=no">    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">    <title>我的订单</title>    <link rel="stylesheet" href="https://cdn.washpayer.com/components/lib/mui.min.css">    <link rel="stylesheet" href="/components/custom/css/common.css"/>    <link rel="stylesheet" href="/app/css/xyf.common.min.css">    <style>        /**表格*/        .pay-order-list .pullrefresh {            overflow-y: auto;            position: absolute;            top: 44px;            left: 0;            right: 0;            bottom: 0;        }        .pay-order-list .pullrefresh.full {            top: 0;        }        /*卡片布局*/        .pay-order-list .mui-table-view {            background: transparent;        }        .pay-order-list .mui-table-view-cell:after {            left: 0;        }        .pay-order-card {            margin: 10px 0;            background: #fff;            line-height: 1;        }        .pay-order-card .card-top {            border-bottom: 1px dotted #c8c7cc;            padding-bottom: 10px;        }        .pay-order-card .card-bottom {            padding-top: 10px;        }        .pay-order-card .btn-list {            text-align: right;        }        .pay-order-card .btn-list .mui-btn {            margin-left: 10px;        }        .pay-order-card .main-info {            font-size: .3rem;            color: rgba(0, 0, 0, .9);        }        .pay-order-card .totalFee {            text-align: right;        }        .pay-order-card .status-row {            line-height: 34px;            font-size: .26rem;        }    </style></head><body><div class="pay-order-list">    <div class="mui-row ">        <div class="mui-col-sm-12 mui-col-xs-12 mui-input-group mui-reset">            <form class="mui-row" action="">                <div class="mui-col-xs-12 mui-col-sm-12">                    <div class="mui-input-row mui-search">                        <input type="search" class="mui-input-clear" id="searchKey" placeholder="订单信息">                    </div>                </div>            </form>        </div>    </div>    <div id="pullrefresh" class="pullrefresh ">        <div class="scrollloadContainer">            <ul class="mui-table-view scrollload-content">            </ul>        </div>    </div></div><div class="load-mask " id="agreeDialog" style="display: none">    <div class="friendly-dialog">        <div class="friendly-dialog-close iconfont icon-close-dark" onclick="closeAgree()">        </div>        <div class="friendly-dialog-body">            为了防止您遗忘充值,系统建议您将所有设备配置为SIM卡到期自动续费,避免SIM卡过期,业务无法正常运营。        </div>        <div class="friendly-dialog-footer">            <button type="button" onclick="agreeAutoPay()" class="mui-btn mui-btn-primary mui-col-sm-4 mui-col-xs-4">同意            </button>        </div>    </div></div><script type="text/html" id="model">    <li class="mui-table-view-cell pay-order-card">        <div class="mui-row card-top">            <div class="mui-col-sm-10 mui-col-xs-10 card-left">                <p class="main-info name"></p>            </div>            <div class="mui-col-sm-2 mui-col-xs-2">                <p class="main-info totalFee"></p>            </div>        </div>        <div class="mui-row card-bottom">            <div class="mui-col-sm-4 mui-col-xs-4">                <p class="main-info status-row"><span class="payType"></span> <span class="status"></span></p>            </div>            <div class="mui-col-sm-8 mui-col-xs-8 btn-list">                <button type="button" class="mui-btn mui-btn-outlined cancelBtn">取消订单</button>                <button type="button" class="mui-btn mui-btn-danger mui-btn-outlined payBtn">付款</button>            </div>        </div>    </li></script><script src="https://cdn.washpayer.com/components/lib/jquery.min.js"></script><script src="https://res.wx.qq.com/open/js/jweixin-1.1.0.js"></script><script src="https://cdn.washpayer.com/components/lib/mui.min.js"></script><script src="https://cdn.washpayer.com/components/lib/Scrollload.js"></script><script src="/components/custom/js/common.js"></script><script src="/app/js/xyf.common.js"></script><script src="/app/js/pay.js"></script><script>    var inhouseApp = localStorage.getItem("inhouseApp")    $(function () {        $(window).on("resize", function () {            if (scrollload1) {                scrollload1.unLock();            }        });        $("body").on("click", ".pay-order-card", function (e) {            var li = $(this).closest("li");            var orderNo = li.attr("orderNo");            var url = "payOrderDetail.html?orderNo=" + orderNo;            goPage(url);        }).on("click", ".payBtn", function (e) {            e.stopPropagation();//阻止冒泡            var li = $(this).closest("li");            var orderNo = li.attr("orderNo");            var totalFee = parseFloat(li.attr("totalFee"));            var openId = localStorage.getItem("simOpenId")            goPay({"orderNo": orderNo, "totalFee": totalFee, front_url: location.href, openId: openId}, function () {                mui.toast("支付成功");                changeBtnStatus(li, "Paid");                if (inhouseApp === 'true') {                    $('#agreeDialog').addClass('active').show();                }            })        }).on('click', ".cancelBtn", function (e) {            e.stopPropagation();//阻止冒泡            var li = $(this).closest("li");            var orderNo = li.attr("orderNo");            sendRequest({                url: '/dealer/sim/order/cancel',                type: "POST",                data: {orderNo: orderNo},                contentType: "json",                success: function (res) {                    if (res.result === 1) {                        mui.toast("已经取消");                        changeBtnStatus(li, "Cancel");                    } else {                        mui.toast(res.description);                    }                }            });        });    });    var dataPageIndex = 0;    var total = 0;    var pageSize = 10;    var searchKey = "";    //关键字搜索    document.onkeydown = function (ev) {        if (ev.keyCode == 13) {            ev.preventDefault();            search();        }    };    function search() {        dataPageIndex = 0;        $('.scrollload-content').html("");        searchKey = $("#searchKey").val();        scrollload1.refreshData();//重载数据    }    //初始化数据加载组件    var scrollload1 = new Scrollload({        container: $(".scrollloadContainer")[0],        window: $("#pullrefresh")[0],        enablePullRefresh: true,        loadMore: function (slEntity) {            if (dataPageIndex > 0 && dataPageIndex * pageSize >= total) {                slEntity.noMoreData();                return;            }            dataPageIndex++;            pullupRefresh(slEntity, dataPageIndex);//加载更多        },        pullRefresh: function (slEntity) {            slEntity.refreshComplete();//设备数据不会有很快的更新频率,不用下拉刷新        }    });    function pullupRefresh(slEntity, pageIndex) {        var url = "/dealer/sim/order/list?random=" + Math.random() * 1000;        var data = {"pageIndex": pageIndex, "pageSize": pageSize, searchKey: searchKey};        sendRequest(url, "GET", data, function (res) {            var panel = $(slEntity.contentDom);            if (res.result == 1) {                total = res.para.total;                var length = res.para.items.length;                for (var i = 0; i < length; i++) {                    var obj = res.para.items[i];                    var html = $("#model").html();                    html = $(html);                    html.attr("orderNo", obj.orderNo);                    html.attr("totalFee", obj.totalFee);                    html.find(".name").text(obj.name);                    html.find(".totalFee").text("¥" + obj.totalFee);                    changeBtnStatus(html, obj.status);                    obj.setSimChargeAuto && html.find(".payType").text('系统自动充值')                    panel.append(html);                }            } else {                mui.toast(res.description);            }            if (slEntity) {                slEntity.unLock();//每次滚动到底部都会锁定,所以你在loadMoreFn方法中需要解锁,下次滚动到底部才能继续调用loadMoreFn            }        });    }    //修改付款按钮状态    function changeBtnStatus(dom, status) {        var text = "等待支付"        if (status === "Paid") {            dom.find(".payBtn,.cancelBtn").hide();            text = "交易成功"        } else if (status === "Cancel") {            dom.find(".payBtn,.cancelBtn").hide();            text = "订单已取消"        }        dom.find(".status").text(text);    }    // 同意续费,全部设备    function agreeAutoPay() {        sendRequest({            url: '/dealer/setSimChargeAuto',            type: "POST",            data: null,            contentType: "json",            success: function (res) {                if (res.result === 1) {                    mui.toast("设置自动续费成功");                    closeAgree()                } else {                    mui.toast(res.description);                }            }        });    }    function closeAgree(){        $('#agreeDialog').removeClass('active').hide();;    }</script></body></html>
 |