丁玲 / A6079080424317 · 文件

转到一个项目

审查视图

html/my/my_consumption.html 6.5 KB
原文件 普通视图 历史 永久链接
第三版
c9d473b2
 
dl authored
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <script src="../../assets/js/fontsize.js"></script>
    <link rel="stylesheet" href="../../assets/css/api.css"/>
    <link rel="stylesheet" href="../../assets/css/index.css">
    <link rel="stylesheet" href="../../assets/icon/iconfont.css">
    <title></title>
    <style>
        .cons_top {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 12px;
            padding: 0.25rem 0.55rem 0.25rem 0.48rem;
        }

        .cons_top .cons_top_input {
            background-color: #ebebeb;
            color: #424242;
            font-size: 12px;
            border-radius: 0.4rem;
            padding: 0 0.37rem;
            flex: 1;
        }

        .cons_top .cons_top_input input {
            padding: 0.1rem 0;
            width: 100%;
        }

        .cons_top .cons_top_input input::-webkit-input-placeholder {
            color: #B9B4B4;

        }

        .cons_btn {
            color: #DDBB73;
            font-size: 15px;
            margin-left: 0.12rem;
        }

        .cons_item {
            margin: 0 0.55rem 0.57rem 0.48rem;
            font-size: 12px;
            border-radius: 3px;
            background-color: #D8B25F;
        }

        .cons_item_nouse {
            background-color: #c2c2c2;
        }

        .cons_item_img {
            width: 55px;
            padding: 0.1rem;
        }

        .cons_item_img img, .cons_item_img2 img {
            width: 100%;
        }

        .cons_item_content {
            color: #fff;
            display: flex;
            align-items: center;
        }

        .cons_item_content .rmb {
            font-size: 12px;
        }

        .cons_left {
            padding: 0.17rem 0 0.13rem 0;
            text-align: center;
            flex: 2;
            border-right: 3px #fff solid;
        }

        .cons_right {
            padding: 0.17rem 0 0.13rem 0;
            text-align: center;
            flex: 3;
        }

        .cons_price {
            font-size: 24px;
        }

        .cons_item_bottom {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 10px;
            color: #fff;
            padding: 0.1rem 0.21rem 0.1rem 0.76rem;
        }

        .bottom_btn {
            border: 1px solid #fff;
            text-align: center;
            font-size: 10px;
            padding: 0.03rem 0.17rem;
            border-radius: 0.16rem;
        }
    </style>
</head>
<body>
<div id="loadStart"></div>
<div id="app" v-cloak>
    <div class="cons_top">
        <div class="cons_top_input"><input type="text" placeholder="请输入兑换码" v-model="cons_num"></div>
        <span class="cons_btn">兑换</span>
    </div>
    <!--<div :class="['cons_item',item.able==1?'':'cons_item_nouse']"-->
    <div class='cons_item'
预约模块地址处理
0cc7132d
 
朱振飞 authored
122 
         v-for="(item,index) in getConsumeMoney_data" >
第三版
c9d473b2
 
dl authored
123 124 125 126 127 128 129 130 131 132 133 134 
        <div class="cons_item_img"><img src="../../assets/image/juan_03.jpg" alt=""></div>
        <div class="cons_item_content">
            <div class="cons_left">
                <div class="cons_price"><span class="rmb">￥</span><span>{{item.discount}}</span></div>
                <div class="cons_use">满{{item.discount}}使用</div>
            </div>
            <div class="cons_right">
                <div class="cons_price">{{item.name}}</div>
                <div class="cons_use">有效期至{{item.deadline}}</div>
            </div>
        </div>
        <div class="cons_item_img2"><img src="../../assets/image/line.jpg" alt=""></div>
预约模块地址处理
0cc7132d
 
朱振飞 authored
135 136 137 138 
        <div class="cons_item_bottom">
            <span>{{item.post_title}}</span>
            <!--<span class="bottom_btn" v-if="item.able">去使用</span>-->
            <!--<span class="bottom_btn" v-else>不可使用</span>-->
第三版
c9d473b2
 
dl authored
139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 
        </div>
    </div>
    <!--<div class="cons_item">-->
    <!--<div class="cons_item_img"><img src="../../assets/image/juan_03.jpg" alt=""></div>-->
    <!--<div class="cons_item_content">-->
    <!--<div class="cons_left">-->
    <!--<div class="cons_price"><span class="rmb">￥</span><span>200</span></div>-->
    <!--<div class="cons_use">满100使用</div>-->
    <!--</div>-->
    <!--<div class="cons_right">-->
    <!--<div class="cons_price">活动专享消费金</div>-->
    <!--<div class="cons_use">有效期至2021-09-25</div>-->
    <!--</div>-->
    <!--</div>-->
    <!--<div class="cons_item_img2"><img src="../../assets/image/line.jpg" alt=""></div>-->
    <!--<div class="cons_item_bottom"><span>全场服务专用</span><span class="bottom_btn">去使用</span></div>-->
    <!--</div>-->
</div>
</body>
</html>

<script type="text/javascript" src="../../assets/js/api.js"></script>
<script type="text/javascript" src="../../assets/js/public.js"></script>
<script type="text/javascript" src="../../assets/js/fastclick.js"></script>
<script>
    new FastClick(document.body);
</script>
<script type="text/javascript" src="../../assets/js/vue.min.js"></script>
<script type="text/javascript" src="../../assets/js/axios.min.js"></script>
<script type="text/javascript" src="../../assets/icon/iconfont.js"></script>
<script>
    var app = new Vue({
        el: '#app',
        data: {
            cons_num: '',
            order_id: '',
            getConsumeMoney_data: []
        },
        created: function () {
预约模块地址处理
0cc7132d
 
朱振飞 authored
178 179 
            this.order_id = localStorage.getItem('order_id');
            this.getConsumeMoney();
第三版
c9d473b2
 
dl authored
180 181 182 
        },
        methods: {
            goUse: function () {
预约模块地址处理
0cc7132d
 
朱振飞 authored
183 
                window.location.href = '../common/index_win.html'
第三版
c9d473b2
 
dl authored
184 185 
            },
            getConsumeMoney: function () {
预约模块地址处理
0cc7132d
 
朱振飞 authored
186 
                var app = this;
第三版
c9d473b2
 
dl authored
187 188 189 190 191 192 193 194 195 196 197 198 199 200 
                var post = {
                    order_id: app.order_id
                };
                var header = {
                    "XX-Device-Type": getDevice(),
                    'XX-Token': getToken()
                };
                getRequest('post', 'user/Order/getConsumeMoney', post, header).then(function (res) {
                    if (res.data.code == 1) {
                        app.getConsumeMoney_data = res.data.data;
                    } else {
                    }
                    loadEnd();
                });
预约模块地址处理
0cc7132d
 
朱振飞 authored
201 
            }
第三版
c9d473b2
 
dl authored
202 203 204 
        }
    })
</script>