登录 注册
开源 企业版 高校版 私有云 Gitee AI NEW
扫描微信二维码支付
取消
支付完成
Watch
不关注 关注所有动态 仅关注版本发行动态 关注但不提醒动态
2 Star 0 Fork 0

Joyce/web-tour-front

代码 Issues 0 Pull Requests 0 Wiki 统计 流水线
服务
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目，私有仓库也完全免费 ：）
免费加入
文件
该仓库未声明开源许可证文件（LICENSE），使用请关注具体项目描述及其代码上游依赖。
项目仓库所选许可证以仓库主分支所使用许可证为准
克隆/下载
order_wait.html 19.10 KB
一键复制 编辑 原始数据 按行查看 历史
xiaoleiji 提交于 2020-05-20 15:13 . bug logo
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365
<!DOCTYPE html>

<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<meta name="renderer" content="webkit">



<title>收银台</title>

<meta name="keywords" content="">

<meta name="description" content="">

<meta name="viewport" content="width=1190">

<link type="text/css" href="./static/css/tts.css" rel="stylesheet">

<link type="text/css" href="./static/css/orderpay.css" rel="stylesheet">

    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

    <style>

        /* 填写信用卡信息 */

        .checkout-car-box {

            padding: 40px 30px 20px 30px;

            z-index: 100;

        }

        .checkout-car-box.hq-shadow-box label {

            color: #333;

        }

        .checkout-car-box .frame--activated {

            border-color: #e5e5e5;

            box-shadow: none;

        }

        .checkout-car-box .frame--activated.frame--focus {

            border-color: #49f;

            box-shadow: 0px 2px 5px 0px rgba(8, 40, 57, 0.15);

        }

        /* 填写信用卡信息 end */

        .h-lh34 { height:34px; line-height: 34px }

        .pay-split-select li.clicked .pay-card-item-available .pay-card-clicked {display: block;}

        .pay-split-select li:not(.clicked) { border: 1px solid #fff; }

        .pay-split-select .order-pay-card-item {

            padding: 0 0 0 10px;

        }

        .pay-split-select li.clicked .order-pay-card-item {background: #eef6ff;}

        .pay-split-select li.clicked .pay-card-item-available {border: 2px #49f solid;}

        .pay-split-select li .pay-status {

            width: 120px;

        }

    </style>

<script src="./static/js/push.js"></script><script type="text/javascript" src="./static/js/jquery.mini.js"></script>

<script type="text/javascript" src="./static/js/main.js"></script>

<script type="text/javascript" src="./static/js/jquery.cookie.js"></script>

<script type="text/javascript" src="./static/js/jquery.lazyload.js"></script>

<script type="text/javascript" src="./static/js/common_language.js"></script>

<style></style></head>

<body class="bg-fff">

<link rel="stylesheet" type="text/css" href="./static/css/iconfont.css">

<link rel="stylesheet" type="text/css" href="./static/css/global.css">

<div id="tips_bg" class="hide abs" style="height: 927px;">

    <div class="tips_div rel f16">

        <p class="tips_head f16 rel t-fff">提示</p>

        <div class="tips_body clearfix">

            <div class="tips_img fl"><img src="./static/tk_ts_icon_new.svg"></div>

            <div class="tips_conent fl">尊敬的客户，当前浏览器版本过低，将会影响您的预订体验，建议更新版本或更换浏览器使用。</div>

        </div>

        <div class="tips_footer tac">

            <a href="javascript:;" class="tips_button dib J_tips_button">我知道了</a>

        </div>

    </div>

</div>

<div class="header-wrap bg-fff w100p hq_header_wrap">

    <div class="hq_header_top w clearfix h100p">

        <div class="header-logo fl dif aic h100p">

            <a class="J_token logo-href db dif aic" href="/index.html" title="好巧网">

                <img class="db" src="./img/logo.png" height="59">

                <div class="header-logo-spe"></div>

                <span class="header-logo-name f26 t-49f">收银台</span>

            </a>

        </div>

        <div class="fr h100p pr10" style="padding-top: 16px">

        </div>

    </div>

</div>

<script type="text/javascript" src="./static/js/header.js"></script>

<div class="main-pay order-pay-main" style="min-height: 500px;">

    <!-- 订单 -->

    <div class="order-pay-cont">

        <ul class="order-pay-item-box" id="J-order-pay-item-box" style="height: auto;margin-bottom:2px;">

            <!-----酒店（1）----->

            <li class="order-pay-item" data-num="1">

                <h6 class="order-item-title">

                    <span class="order-item-title-cn">{{orderInfo.hotel_name}}</span>

                </h6>

                <div class="order-item-info">

                    <em>订单号：{{orderInfo.dist_order_sn}}</em>

                    <span class="segment-line"></span>

                    <em>费用类型：房费</em>

                    <span class="segment-line"></span>

                    <em>入离日期：{{orderInfo.in_date}}至 {{orderInfo.out_date}}</em>

                    <span class="segment-line"></span>

                </div>

                <div class="order-item-info">

                    <em>房型：{{orderInfo.room_type_name}}&nbsp;/</em>

                    <!--是否包含早餐,1包含,2不包含,3含双早,4含三早,5有(收费)-->

                    <em v-if="orderInfo.has_bread_fast == 1"><i>含餐</i></em>

                    <em v-if="orderInfo.has_bread_fast == 2"><i>不含餐</i></em>

                    <em v-if="orderInfo.has_bread_fast == 3"><i>含双早</i></em>

                    <em v-if="orderInfo.has_bread_fast == 4"><i>含三早</i></em>

                    <em v-if="orderInfo.has_bread_fast == 5"><i>有餐（收费）</i></em>

                    <span class="segment-line"></span>

                    <em>间夜数：x{{params.room_number}}间</em>

                </div>

                <div class="order-item-info" style="cursor: pointer;" v-for="item in orderInfo.stay_person">

                    <em>入住人姓名：</em>

                    <em class="J-pay-card-tip-show">{{item.person_name}}</em>

                    <span class="segment-line"></span>

                    <em>入住人电话：{{item.person_mobile}}</em>

                </div>

                <em class="order-item-total"><span style="color:#666">应付金额：</span>

                    <span class="pay-money-color"> {{orderInfo.price}}元</span>

                </em>

            </li>

        </ul>

        <div class="order-pay-total">

            订单总额：

            <em class="pay-money-color font-bold"> {{orderInfo.price}}元</em>

        </div>

    </div>

    <!-- 订单 end-->

        <!-- time -->

    <div class="order-pay-countdown" style="display: none">

        <i class="order-pay-icon time-count-down-icon"></i>支付剩余有效时间：<span class="color-5256 font-bold J-time-count">14分17秒</span>，请及时完成付款

    </div>

    <!-- time end -->

        <!-- card -->

    <div class="pay-card-cont" style="display: none">

        <form name="pay_form" id="pay_form" action="" method="post">

            <div class="pay-card-inner pay-card-right-off-inner">

                <h6>立即预约</h6>

                <ul class="order-pay-card-list clearfix">

                    <li>

                        <label for="clearing_alipay">

                            <input id="clearing_alipay" type="radio" name="paybank" value="alipay" class="J-paybank-radio hide">

                            <div class="order-pay-card-item pay-card-item-available">

                                <span class="order-pay-card-img">

                                     <span class="order-pay-icon pay-ali"></span>

                                </span>

                                <em class="pay-card-clicked"></em>

                            </div>

                        </label>

                    </li>

                    <li>

                        <label for="clearing_wechatpay">

                            <input id="clearing_wechatpay" type="radio" name="paybank" value="wxpay" class="J-paybank-radio hide">

                            <div class="order-pay-card-item pay-card-item-available">

                                <span class="order-pay-card-img">

                                     <span class="pay-wechat J-pay-wechat"><img src="./static/images/pay_wechat_zh-CN.png"></span>

                                </span>

                                <em class="pay-card-clicked"></em>

                            </div>

                        </label>

                    </li>

                    <li class="J-order-item-tips">

                        <label for="clearing_unionpay">

                            <input id="clearing_unionpay" type="radio" name="paybank" value="unionpay" class="J-paybank-radio J-clearing_unionpay hide">

                            <input type="hidden" id="J_unionpay_type" name="unionpay_type" value="1">

                            <div class="J-pay-card-tip-show order-pay-card-item pay-card-item-available" data-val="                       快捷支付指用户付款时，不需开通网银，只需提供银行卡卡号、户名、手机号码等信息，银行验证手机号码正确性后，第三方支付发送手机动态口令到用户手机号上，用户输入正确的手机动态口令，即可完成支付。                        ">

                                <span class="order-pay-card-img">

                                     <span class="order-pay-icon pay-online-01"></span>

                                </span>

                                <em class="pay-card-clicked"></em>

                                <span class="arrow-up"><i></i></span>

                            </div>

                        </label>

                    </li>

                    <li class="order-pay-card-item-last">

                        <label for="clearing_unionpay_online">

                            <input id="clearing_unionpay_online" type="radio" name="paybank" value="unionpay_online" class="J-paybank-radio hide">

                            <div class="J-pay-card-tip-show order-pay-card-item pay-card-item-available" data-val="使用网上银行支付，银行卡需事先开通网银支付功能，且在支付时完全是在银行网银页面输入银行卡信息并验证支付密码，具有稳定易用，安全可靠的特点。">

                                <span class="order-pay-card-img">

                                     <span class="order-pay-icon pay-unionpay"></span>

                                </span>

                                <em class="pay-card-clicked"></em>

                            </div>

                        </label>

                    </li>

                </ul>

            </div>

        </form>

    </div>

    <!-- card end -->

    <!-- paybtn -->

    <div class="order-pay-btn-cont">

        <a href="javascript:;" class="order-pay-btn" @click="paySubmit">立即预约</a>

        <a :href="'/order.html?orderId='+ orderId +'&room_type_id='+ orderInfo.room_type_id" class="return-back">返回修改订单</a>

        <div class="order-pay-loading" v-show="loading">

            <img src="./static/images/loading_order.gif">

            <span>正在加载支付信息，请稍等···</span>

        </div>

    </div>

    <!-- new end-->

</div>



<div class="order-pay-footer">

    <div class="main">

       <!-- <h6 class="order-pay-qa-title clearfix">常见问题</h6>

        <div class="order-pay-qa-list">

            <dl>

                <dt>1、重复支付多笔订单款怎么办？</dt>

                <dd>答：请您立刻拨打好巧客服核实重复支付情况，一经核实后，好巧网会将多支付款项原路退回。</dd>

                <dt>2、快捷支付失败，提示银行卡限额不足怎么办？</dt>

                <dd>答：银行卡限额是指某银行对该行银行卡单笔单日消费额度的限制，如果您的银行卡限额不足，您可以更换其他支付产品或线下充值好巧网预付款账户完成交易。</dd>

                <dt>3、支付页面打不开，或者打开无法支付，怎么办？</dt>

                <dd>答：由于网络超时或加载问题，请刷新页面重新支付，如果仍然无法支付，则联系好巧客服400-633-2377(仅中国大陆) ，+86 27 59006258(非中国大陆)。</dd>            </dl>

        </div>-->

    </div>

</div>



<div id="bg"></div>



<div class="index-popup new-index-popup-content hide" id="J_popup_timeout">

    <div class="index-popup-title">

        支付超时    </div>

    <div class="index-popup-cont">

        <div class="index-popup-cont-contianer dif jcc">

            <div class="common-remmend-tip dif aic">

                <i class="icon-timer common-va-m"></i>

                <span class="text-con f16 flex-1"> 支付有效时间已过，价格可能发生变化！</span>

            </div>

        </div>

        <div class="index-popup-btn-center order-del-pop-btn order-popup-footer dif jcc">

        </div>

    </div>

</div>

<!-- 套餐库存不足-begin -->

<div class="index-popup new-index-popup-content hide" id="J_popup_room">

    <div class="index-popup-title">

        套餐库存不足    </div>

    <div class="index-popup-cont">

        <div class="index-popup-cont-contianer dif jcc">

            <div class="common-remmend-tip dif aic">

                <i class="icon-timer common-va-t"></i>

                <span class="text-con f16 flex-1">很抱歉，您选择的优惠房型套餐已售罄，<br>请查看其他酒店或房型套餐<br><span class="size-14" id="J_property_noroom_tips"></span></span><br>

            </div>

        </div>

        <div class="index-popup-btn-center order-del-pop-btn order-popup-footer dif jcc">

        </div>

    </div>

</div>

<!-- 套餐库存不足-end -->

<!-- 重复预订提示-begin -->

<div class="index-popup new-index-popup-content hide" id="J_popup_order_repeat">

    <div class="index-popup-title">

        温馨提示    </div>

    <div class="index-popup-cont">

        <div class="index-popup-cont-contianer dif jcc">

            <div class="common-remmend-tip dif aic">

                <i class="icon-timer common-va-t"></i>

                <span class="text-con f16 flex-1">您已提交重复订单，请进入订单管理查看。<br>订单号：<span id="J_order_repeat"></span></span>

            </div>

        </div>

    </div>

    <div class="index-popup-btn-center order-del-pop-btn order-popup-footer dif jcc">

        <a href="javascript:;" class="index-popup-btn common-btn common-cancel-btns m-l-26 J_go_order_edit">返回修改信息</a>

    </div>

</div>

<!-- 重复预订提示-end -->



<!-- new popup-->

<!--wechat-->

<div class="index-popup new-index-popup-content hide" id="J_popup_wxpay" style="width:494px">

    <div class="pay-code-box">

        <div class="pay-code-header">

            <a href="javascript:;" class="close-pay-code-popup J_close_popup"><i class="order-pay-icon pay-close"></i></a>

        </div>

        <div class="pay-code-bd">

            <div class="pay-code-title clearfix">

                <span class="floatL">

                    <i class="pay-wechat"><img src="./static/images/pay_wechat_zh-CN.png"></i>

                </span>

                <span class="pay-code-time">

                    <i class="order-pay-icon time-count-down-icon"></i>剩余扫码有效时间：<span class="color-5256 font-bold J-time-count">14分17秒</span>                </span>

            </div>

            <div class="pay-code-bd-innder">

                <div class="pay-code-code">

                    <img src="https://www.haoqiao.com/cashier?param=-ZDNhN2Y0OGMxMmU2OTdkNSsnbXFhYStaJHgmMC44Nik&amp;order_sn=12004226216138&amp;order_type=1&amp;dud=459P7GcmUl9" alt="刷新页面获取二维码" width="282px" height="282px" id="J_wxpay_qrcode">

                </div>

                <div class="pay-code-foot">

                    <i class="order-pay-icon pay-zk-sq"></i>打开微信，扫一扫付款                </div>

            </div>

        </div>

    </div>

</div>

<!--alipay-->

<div class="index-popup new-index-popup-content hide" id="J_popup_alipay" style="width:494px">

    <div class="pay-code-box">

        <div class="pay-code-header">

            <a href="javascript:;" class="close-pay-code-popup J_close_popup"><i class="order-pay-icon pay-close J_pay_close"></i></a>

        </div>

        <div class="pay-code-bd">

            <div class="pay-code-title clearfix">

                <span class="floatL">

                    <i class="order-pay-icon pay-ali"></i>

                </span>

                <span class="pay-code-time">

                    <i class="order-pay-icon time-count-down-icon"></i>剩余扫码有效时间：<span class="color-5256 font-bold J-time-count">14分17秒</span>

                </span>

            </div>

            <div class="pay-code-bd-innder">

                <div class="pay-code-code">

                    <img src="https://www.haoqiao.com/cashier?param=-ZDNhN2Y0OGMxMmU2OTdkNSsnbXFhYStaJHgmMC44Nik&amp;order_sn=12004226216138&amp;order_type=1&amp;dud=459P7GcmUl9" width="282px" height="282px" id="J_alipay_qrcode">

                </div>

                <div class="pay-code-foot">

                    <i class="order-pay-icon pay-zk-sq"></i>打开手机支付宝，扫一扫付款                </div>

                <div class="pay-code-btn-for-ali-box">

                    支付遇到问题或企业支付宝账户付款<br>请转至<a href="javascript:;" class="pay-code-btn-for-ali">进入支付宝平台支付</a>

                </div>

            </div>

        </div>

    </div>

</div>

<!--timeout-->

<div class="index-popup new-index-popup-content hide" id="J_popup_timeout_02">

    <div class="index-popup-title">

        支付    </div>

    <div class="index-popup-cont">

        <div class="index-popup-cont-contianer dif jcc">

            <div class="common-remmend-tip dif aic">

                <i class="icon-timer common-va-m"></i>

                <span class="text-con f16 flex-1">请到新打开页面完成支付</span>

            </div>

        </div>

        <div class="index-popup-btn-center order-del-pop-btn order-popup-footer dif jcc">

            <a href="javascript:;" class="index-popup-btn common-btn common-confirm-btns" id="J_pay_succ">支付成功</a>

            <a href="javascript:;" class="index-popup-btn common-btn common-cancel-btns m-l-26" id="J_pay_fail">支付失败，继续支付</a>

        </div>

    </div>

</div>

<div class="index-popup new-index-popup-content hide" id="J_popup_nopay">

    <div class="index-popup-title">

        支付    </div>

    <div class="index-popup-cont">

        <div class="index-popup-cont-contianer dif jcc">

            <div>

                <div class="common-remmend-tip dif aic" style="text-align: left">

                    <i class="icon-timer common-va-m"></i>

                    <span class="text-con f16 flex-1">尚未收到银行或者第三方支付平台的支付确认</span>

                </div>

                <div class="pl62 t-666 f14">

                    为避免重复扣款，请您确认银行卡或者平台是否已经扣款<br>

                如果已经扣款，请联系客服。<br>

                •客服电话(仅中国大陆)：<i class="red_color">400-633-2377（7×24小时）</i><br>

                •客服电话(非中国大陆)：<i class="red_color">+86 27 59006258</i>                </div>

            </div>

        </div>

    </div>

    <div class="index-popup-btn-center order-del-pop-btn order-popup-footer dif jcc">

    </div>

</div>

<!--unbind-->



<div class="bg-f543">

    <div class="w">



    </div>

</div>

<script src="./static/js/entrance.js" id="zhichiScript" class="zhiCustomBtn" data-args="manual=true"></script>

<script type="text/javascript" src="./static/js/common.js"></script>

<script src="./js/lib/vue.js" type="text/javascript"></script>

<script src="./js/lib/element-ui/index.js" type="text/javascript"></script>

<script src="./js/order_wait.js" type="text/javascript"></script>

</body>

</html>
Loading...
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
JavaScript
1
https://gitee.com/jiyeye/web-tour-front.git
[email protected]:jiyeye/web-tour-front.git
jiyeye
web-tour-front
web-tour-front
master
点此查找更多帮助

搜索帮助

Git 命令在线学习 如何在 Gitee 导入 GitHub 仓库
Git 仓库基础操作
企业版和社区版功能对比
SSH 公钥设置
如何处理代码冲突
仓库体积过大，如何减小？
如何找回被删除的仓库数据
Gitee 产品配额说明
GitHub仓库快速导入Gitee及同步更新
什么是 Release（发行版）
将 PHP 项目自动发布到 packagist.org
评论
仓库举报
回到顶部