<!DOCTYPE html>
<html>
<head>
    <:include file="./common/title.html" websiteName="订单详情 - ${website.websiteName}"
              keywords="${website.keywords}" description="${website.description}" favicon="${website.favicon}" shop="${shop}"/>
    <style>
        .order-show {
            margin: 0 auto;
            background-color: #fff;
            padding: 30px;
            border-radius: 5px;
            max-width: 500px;
            box-shadow: 0px 0px 2px rgb(98 124 153 / 10%);
        }
    </style>
</head>
<body class="page-no-scroll">
<div class="page-loading">
    <div class="ball-loader">
        <span></span><span></span><span></span><span></span>
    </div>
</div>
<!-- header -->
<:include file="./common/header.html" websiteName="${website.websiteName}" websiteLogo="${website.websiteLogo}"/>
<!-- goods-card -->
<div class="layui-container body-card">
    <div style="text-align: center; padding-bottom: 25px">
        <h2 style="font-weight: 600; margin-top: 40px; margin-bottom: 10px;">查询该订单需要密码</h2>
        <h3>输入取卡密码才可查看卡密</h3>
    </div>
    <div class="layui-card"
         style="border-radius: 5px; box-shadow: 0px 0px 2px rgb(98 124 153 / 10%); max-width: 500px; margin: 0 auto;">
        <div class="layui-card-header" style="font-size: 18px; color: #fff; font-weight: 600; padding: 0 25px; height: 70px; line-height: 70px; background: url(${ctxPath}/default/images/back_pass.png) no-repeat; background-size: 100% 100%; border-top-left-radius: 5px; border-top-right-radius: 5px;">
            ${member!}
        </div>
        <div class="layui-card-body" style="padding: 50px 30px">
            <dt style="font-weight: 700;padding: 0 0 5px; margin: 0 0 10px; color: #666;">请输入取卡密码：</dt>
            <form id="searchEditForm" lay-filter="searchEditForm" class="layui-form model-form" style="padding: 0;">
                <input name="id" value="${orderId!}" type="hidden"/>
                <div class="layui-form-item">
                    <input name="password" class="layui-input" lay-verify="required" required/>
                </div>
                <div class="layui-form-item" style="margin-bottom: 0px;">
                    <button class="layui-btn" style="width: 100%; border: 1px solid #09AAFF; background: #09AAFF;" lay-filter="searchEditSubmit" lay-submit>提取卡密</button>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- footer -->
<:include file="./common/footer.html" websiteName="${website.websiteName}" beianIcp="${website.beianIcp}" shop="${shop}"/>

<!-- js部分 -->
<:include file="./common/js.html"/>

<script>
    layui.use(['layer', 'form', 'util', 'admin', 'dataGrid', 'admin'], function () {
        var $ = layui.jquery;
        var form = layui.form;
        var layer = layui.layer;

        form.on('submit(searchEditSubmit)', function (data) {
            var loadIndex = layer.load(2);
            $.post('/api/getOrderToken', data.field, function (res) {
                layer.close(loadIndex);
                if (0 === res.code) {
                    window.location.href = '${ctxPath}/api/order?access_token=' + res.data;
                } else {
                    layer.msg(res.msg, {icon: 2, anim: 6});
                }
            });
            return false;
        });

    });
</script>

</body>
</html>