<!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' v-for="(item,index) in getConsumeMoney_data" > <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> <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>--> </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 () { this.order_id = localStorage.getItem('order_id'); this.getConsumeMoney(); }, methods: { goUse: function () { window.location.href = '../common/index_win.html' }, getConsumeMoney: function () { var app = this; 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(); }); } } }) </script>