| @@ -80,4 +80,12 @@ export const apiUrl = { | |||
| * 积分新增 | |||
| */ | |||
| addCredit:"/api/credit/add", | |||
| /** | |||
| * 获取会员可赠送的券列表 | |||
| */ | |||
| wxMerchantcouponSend:"/api/couponSend/list", | |||
| /** | |||
| * 商户注券操作 | |||
| */ | |||
| wxMerchantcouponhandSel: "/api/couponSend/handSel", | |||
| } | |||
| @@ -1,11 +1,11 @@ | |||
| <template> | |||
| <div class="box"> | |||
| <div class="Box"> | |||
| <div class="succeed"> | |||
| <img src="@/assets/images/gou.png" alt="" class="succeed_img" /> | |||
| </div> | |||
| <div class="text">核销成功</div> | |||
| <div class="check" @click="lookBilling">查看订单</div> | |||
| <div class="active">返回首页</div> | |||
| <div class="active" @click="goHome">返回首页</div> | |||
| </div> | |||
| </template> | |||
| @@ -14,12 +14,21 @@ export default { | |||
| methods: { | |||
| lookBilling(){ | |||
| this.$router.push('/billing') | |||
| }, | |||
| goHome(){ | |||
| this.$router.push('/home') | |||
| } | |||
| }, | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .Box{ | |||
| width: 100%; | |||
| overflow: hidden; | |||
| height: 100%; | |||
| } | |||
| .succeed { | |||
| width: 3.5rem; | |||
| height: 3.5rem; | |||
| @@ -1,46 +1,59 @@ | |||
| <template> | |||
| <div id="Box"> | |||
| <div class="topImgBox">{{thenDate}}</div> | |||
| <div style="margin-top: 1.5rem;"></div> | |||
| <div class="bill" v-for="(item,index) in list" :key="index"> | |||
| <div class="Box"> | |||
| <div class="topImgBox">{{ thenDate }}</div> | |||
| <div style="margin-top: 1.5rem"></div> | |||
| <van-list | |||
| v-model="loading" | |||
| :finished="finished" | |||
| finished-text="没有更多了" | |||
| @load="onLoad" | |||
| style="background-color: #f8f8fa;" | |||
| > | |||
| <div class="bill" v-for="(item, index) in list" :key="index"> | |||
| <div class="bul_Box"> | |||
| <div class="left">券状态</div> | |||
| <div class="right" style="color:#52A0FD!important">已核销</div> | |||
| <div class="left">券状态</div> | |||
| <div | |||
| class="right" | |||
| :style="'color:' + setStype(item.couponOrderStatus, 'cl')" | |||
| > | |||
| {{ setStype(item.couponOrderStatus, "name") }} | |||
| </div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">券名称</div> | |||
| <div class="right" style="color: #b8b8b8;" >护肤品通用券(B端)</div> | |||
| <div class="left">券名称</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.title}}</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">券码</div> | |||
| <div class="right" style="color: #b8b8b8;" >470088618483941376</div> | |||
| <div class="left">券码</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.id}}</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">核销时间</div> | |||
| <div class="right" style="color: #b8b8b8;" >2020-09-27 15:26:09</div> | |||
| <div class="left">{{item.couponOrderStatus==1?'核销时间':'退款时间'}}</div> | |||
| <div class="right" style="color: #b8b8b8">{{setTiem(item.updateDate,"YYYY-MM-DD HH:mm:ss")}}</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">购买用户</div> | |||
| <div class="right" style="color: #b8b8b8;" >18872592633</div> | |||
| <div class="left">购买用户</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.cuserPhone}}</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">核销员</div> | |||
| <div class="right" style="color: #b8b8b8;" >周思琦</div> | |||
| <div class="left">核销员</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.buserName}}</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">券面额</div> | |||
| <div class="right" style="color: #b8b8b8;" >0.01元</div> | |||
| <div class="left">{{item.type==8?'原价':'券面额'}}</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.price/100}}元</div> | |||
| </div> | |||
| <div class="bul_Box"> | |||
| <div class="left">券售价</div> | |||
| <div class="right" style="color: #b8b8b8;" >0元</div> | |||
| <div class="left">{{item.type==8?'底价':'券售价'}}</div> | |||
| <div class="right" style="color: #b8b8b8">{{item.couponPrice/100}}元</div> | |||
| </div> | |||
| </div> | |||
| <div class="calendar" @click="show = !show"> | |||
| <img src="@/assets/images/calendar.png" alt="" class="calendar_img"> | |||
| </div> | |||
| </van-list> | |||
| <div class="calendar" @click="show = !show"> | |||
| <img src="@/assets/images/calendar.png" alt="" class="calendar_img" /> | |||
| </div> | |||
| <van-calendar | |||
| v-model="show" | |||
| color="#52a0fd" | |||
| @@ -54,62 +67,116 @@ | |||
| <script> | |||
| import { formatDate } from "@/utils/cloud-utils"; | |||
| import Vue from "vue"; | |||
| import { Calendar,Toast } from "vant"; | |||
| Vue.use(Calendar).use(Toast); | |||
| import { Calendar, Toast, List } from "vant"; | |||
| import moment from "moment"; | |||
| Vue.use(Calendar, Toast, List); | |||
| export default { | |||
| data() { | |||
| return { | |||
| loading: false, | |||
| finished: false, | |||
| thenDate: "", | |||
| show: false, | |||
| minDate: new Date(2015, 0, 1), | |||
| maxDate: new Date(2025, 0, 1), | |||
| pageNum:1, | |||
| pageSize:10, | |||
| pitchTiem:'', | |||
| list:[], | |||
| pageNum: 1, | |||
| pageSize: 10, | |||
| pitchTiem: "", | |||
| list: [], | |||
| scrollTopFalg: "", | |||
| statusList: [ | |||
| { | |||
| value: 0, | |||
| name: "未核销", | |||
| cl: "#FFAE00", | |||
| }, | |||
| { | |||
| value: 1, | |||
| name: "已核销", | |||
| cl: "#52A0FD", | |||
| }, | |||
| { | |||
| value: 2, | |||
| name: "已过期", | |||
| cl: "#FF5700", | |||
| }, | |||
| { | |||
| value: 3, | |||
| name: "已退款", | |||
| cl: "#FF5700", | |||
| }, | |||
| ], | |||
| }; | |||
| }, | |||
| methods: { | |||
| onConfirm(date){ | |||
| let tmepTime = formatDate(new Date(date), "yyyy-MM-dd") | |||
| this.pitchTiem = tmepTime | |||
| console.log(this.pitchTiem); | |||
| //查询 | |||
| }, | |||
| getLsit(){ | |||
| this.$http.couponOrderListVerified({ | |||
| methods:'get', | |||
| params:{ | |||
| date:this.pitchTiem, | |||
| pageNum:1, | |||
| pageSize:10 | |||
| } | |||
| }).then(res=>{ | |||
| const {code,data}= res | |||
| if(code==200){ | |||
| // console.log(data.list.list); | |||
| this.list = data.list.list | |||
| }else{ | |||
| //时间处理 | |||
| setTiem(temp, format) { | |||
| //第一个参数是时间戳 第二个参数是格式 参考momentJS | |||
| return moment(Number(temp)).format(format); | |||
| }, | |||
| //下拉加载 | |||
| onLoad() { | |||
| this.pageNum += 1; | |||
| this.getLsit(); | |||
| }, | |||
| // status 状态值 value 返回类型 | |||
| setStype(status, value) { | |||
| if (value == "cl") { | |||
| return this.statusList.filter((res) => { | |||
| return res.value == status; | |||
| })[0].cl; | |||
| } else { | |||
| return this.statusList.filter((res) => { | |||
| return res.value == status; | |||
| })[0].name; | |||
| } | |||
| }, | |||
| onConfirm(date) { | |||
| let tmepTime = formatDate(new Date(date), "yyyy-MM-dd"); | |||
| this.pitchTiem = tmepTime; | |||
| console.log(this.pitchTiem); | |||
| //查询 | |||
| }, | |||
| getLsit() { | |||
| this.loading = true; | |||
| this.$http | |||
| .couponOrderListVerified({ | |||
| methods: "get", | |||
| params: { | |||
| date: this.pitchTiem, | |||
| pageNum: this.pageNum, | |||
| pageSize: 10, | |||
| }, | |||
| }) | |||
| .then((res) => { | |||
| const { code, data } = res; | |||
| if (code == 200) { | |||
| this.loading = false; | |||
| this.list = this.list.concat(data.list.list); | |||
| this.finished = data.list.list.length === 0; | |||
| } else { | |||
| Toast(message); | |||
| return; | |||
| } | |||
| }).catch(res=>{ | |||
| Toast(res); | |||
| }) | |||
| }, | |||
| .catch((res) => { | |||
| Toast(res); | |||
| }); | |||
| }, | |||
| }, | |||
| mounted() { | |||
| this.thenDate = formatDate(new Date(), "yyyy-MM-dd"); | |||
| this.pitchTiem = this.thenDate | |||
| this.getLsit() | |||
| this.pitchTiem = this.thenDate; | |||
| this.getLsit(); | |||
| }, | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| #Box { | |||
| .Box { | |||
| width: 100%; | |||
| height: 100%; | |||
| background-color: #f8f8fa; | |||
| } | |||
| .topImgBox { | |||
| @@ -126,39 +193,38 @@ export default { | |||
| line-height: 3.8rem; | |||
| font-size: 0.5rem; | |||
| } | |||
| .bill{ | |||
| width: 96%; | |||
| margin: 0 2%; | |||
| background-color: #ffffff; | |||
| border-radius: 0.2rem; | |||
| margin-bottom: 0.5rem; | |||
| .bill { | |||
| width: 96%; | |||
| margin: 0 2%; | |||
| background-color: #ffffff; | |||
| border-radius: 0.2rem; | |||
| margin-bottom: 0.5rem; | |||
| } | |||
| .bul_Box{ | |||
| overflow: hidden; | |||
| .bul_Box { | |||
| overflow: hidden; | |||
| } | |||
| .right{ | |||
| float: right; | |||
| font-size: 0.4rem; | |||
| text-align: right; | |||
| padding: 0.3rem 0.5rem; | |||
| .right { | |||
| float: right; | |||
| font-size: 0.4rem; | |||
| text-align: right; | |||
| padding: 0.3rem 0.5rem; | |||
| } | |||
| .left{ | |||
| float: left; | |||
| font-size: 0.4rem; | |||
| text-align: left; | |||
| padding: 0.3rem 0.5rem; | |||
| .left { | |||
| float: left; | |||
| font-size: 0.4rem; | |||
| text-align: left; | |||
| padding: 0.3rem 0.5rem; | |||
| } | |||
| .calendar{ | |||
| width: 2rem; | |||
| height: 2rem; | |||
| background-color: #52a0fd; | |||
| position: fixed; | |||
| border-radius: 50%; | |||
| bottom: 2rem; | |||
| margin-left:40% ; | |||
| .calendar { | |||
| width: 2rem; | |||
| height: 2rem; | |||
| background-color: #52a0fd; | |||
| position: fixed; | |||
| border-radius: 50%; | |||
| bottom: 2rem; | |||
| margin-left: 40%; | |||
| } | |||
| .calendar_img{ | |||
| margin: 0.5rem; | |||
| .calendar_img { | |||
| margin: 0.5rem; | |||
| } | |||
| </style> | |||
| @@ -1,40 +1,40 @@ | |||
| <template> | |||
| <div id="Box" v-if="list.length!=0"> | |||
| <div class="detail_msg"> | |||
| <img :src="list.coverImg" alt="" class="goodImg"> | |||
| <div class="titleBox"> | |||
| <div class="name">{{list.title}}</div> | |||
| <div class="time">{{`有效期至${createDate}`}}</div> | |||
| </div> | |||
| <div id="Box" v-if="list.length != 0"> | |||
| <div class="detail_msg"> | |||
| <img :src="list.coverImg" alt="" class="goodImg" /> | |||
| <div class="titleBox"> | |||
| <div class="name">{{ list.title }}</div> | |||
| <div class="time">{{ `有效期至${createDate}` }}</div> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime"> 领券时间</div> | |||
| <div class="timeSuffix"> {{expiredTime}}</div> | |||
| </div> | |||
| <div class="ticket tiemBox"> | |||
| <div class="getTime"> 券码</div> | |||
| <div class="timeSuffix"> {{list.id}}</div> | |||
| </div> | |||
| <div class=" tiemBox activity"> | |||
| <div class="getTime"> 活动规则</div> | |||
| <img src="@/assets/images/jian.png" alt="" class="timeSuffix_img"> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime"> 券面额</div> | |||
| <div class="timeSuffix">{{list.price/100}}</div> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime"> 券售价</div> | |||
| <div class="selling timeSuffix">{{list.salePrice/100}}</div> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime"> 券状态</div> | |||
| <div class="timeSuffix sellingStatus">{{gstTicketState(list.couponOrderStatus)}}</div> | |||
| </div> | |||
| <div id="user" @click="ifuse"> | |||
| 使用 | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime">领券时间</div> | |||
| <div class="timeSuffix">{{ expiredTime }}</div> | |||
| </div> | |||
| <div class="ticket tiemBox"> | |||
| <div class="getTime">券码</div> | |||
| <div class="timeSuffix">{{ list.id }}</div> | |||
| </div> | |||
| <div class="tiemBox activity"> | |||
| <div class="getTime">活动规则</div> | |||
| <img src="@/assets/images/jian.png" alt="" class="timeSuffix_img" /> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime">券面额</div> | |||
| <div class="timeSuffix">{{ list.price / 100 }}</div> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime">券售价</div> | |||
| <div class="selling timeSuffix">{{ list.salePrice / 100 }}</div> | |||
| </div> | |||
| <div class="tiemBox"> | |||
| <div class="getTime">券状态</div> | |||
| <div class="timeSuffix sellingStatus"> | |||
| {{ gstTicketState(list.couponOrderStatus) }} | |||
| </div> | |||
| </div> | |||
| <div class="user" @click="ifuse">使用</div> | |||
| </div> | |||
| </template> | |||
| @@ -43,144 +43,161 @@ import Vue from "vue"; | |||
| import { Toast } from "vant"; | |||
| import moment from "moment"; | |||
| export default { | |||
| data() { | |||
| return { | |||
| list:{}, | |||
| createDate :"", | |||
| expiredTime:"", | |||
| stateText:[{ | |||
| val:0, | |||
| name:"未核销" | |||
| },{ | |||
| val:1, | |||
| name:"已核销" | |||
| },{ | |||
| val:2, | |||
| name:"已过期" | |||
| },{ | |||
| val:3, | |||
| name:"已退款" | |||
| },] | |||
| } | |||
| }, | |||
| methods: { | |||
| ifuse(){ | |||
| //调用使用接口 | |||
| this.$http.cancel({ | |||
| method:"post", | |||
| data:{ | |||
| couponOrderId:this.list.id | |||
| } | |||
| }).then(res=>{ | |||
| const {code ,message,data} = res | |||
| if(code==200){ | |||
| this.$router.push('/accomplish') | |||
| }else{ | |||
| Toast(message); | |||
| } | |||
| }).catch(res=>{ | |||
| Toast(res); | |||
| }) | |||
| data() { | |||
| return { | |||
| list: {}, | |||
| createDate: "", | |||
| expiredTime: "", | |||
| stateText: [ | |||
| { | |||
| val: 0, | |||
| name: "未核销", | |||
| }, | |||
| gstTicketState(value){ | |||
| let temp = this.stateText.filter(res=>{ | |||
| return res.val == value | |||
| })[0].name | |||
| // console.log(temp); | |||
| // return temp.name | |||
| } | |||
| { | |||
| val: 1, | |||
| name: "已核销", | |||
| }, | |||
| { | |||
| val: 2, | |||
| name: "已过期", | |||
| }, | |||
| { | |||
| val: 3, | |||
| name: "已退款", | |||
| }, | |||
| ], | |||
| }; | |||
| }, | |||
| methods: { | |||
| ifuse() { | |||
| Toast.loading({ | |||
| duration: 0, // 持续展示 toast | |||
| forbidClick: true, | |||
| message: "加载中...", | |||
| forbidClick: true, | |||
| }); | |||
| //调用使用接口 | |||
| this.$http | |||
| .cancel({ | |||
| method: "post", | |||
| data: { | |||
| couponOrderId: this.list.id, | |||
| }, | |||
| }) | |||
| .then((res) => { | |||
| const { code, message, data } = res; | |||
| if (code == 200) { | |||
| Toast.clear(); | |||
| this.$router.push("/accomplish"); | |||
| } else { | |||
| Toast.clear(); | |||
| Toast(message); | |||
| } | |||
| }) | |||
| .catch((res) => { | |||
| Toast.clear(); | |||
| Toast(res); | |||
| }); | |||
| }, | |||
| mounted() { | |||
| if(this.$route.query.ticket){ | |||
| this.list=JSON.parse(this.$route.query.ticket) | |||
| this.createDate = moment(Number(this.list.createDate)).format("YYYY-MM-DD HH:mm:ss") | |||
| this.expiredTime = moment(Number(this.list.expiredTime)).format("YYYY-MM-DD HH:mm:ss") | |||
| }else{ | |||
| console.log("券详情为空ticket"); | |||
| } | |||
| gstTicketState(value) { | |||
| let temp = this.stateText.filter((res) => { | |||
| return res.val == value; | |||
| })[0].name; | |||
| // console.log(temp); | |||
| // return temp.name | |||
| }, | |||
| } | |||
| }, | |||
| mounted() { | |||
| if (this.$route.query.ticket) { | |||
| this.list = JSON.parse(this.$route.query.ticket); | |||
| this.createDate = moment(Number(this.list.createDate)).format( | |||
| "YYYY-MM-DD HH:mm:ss" | |||
| ); | |||
| this.expiredTime = moment(Number(this.list.expiredTime)).format( | |||
| "YYYY-MM-DD HH:mm:ss" | |||
| ); | |||
| } else { | |||
| console.log("券详情为空ticket"); | |||
| } | |||
| }, | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| #Box{ | |||
| width: 96%; | |||
| margin: 0 2%; | |||
| } | |||
| .detail_msg{ | |||
| width: 100%; | |||
| overflow: hidden; | |||
| } | |||
| .goodImg{ | |||
| width: 3.6rem; | |||
| height: 2.6rem; | |||
| float: left; | |||
| border-radius: 0.3rem; | |||
| margin: 0.3rem 0.3rem 0.3rem 0; | |||
| } | |||
| .titleBox{ | |||
| float: left; | |||
| margin-top: 0.3rem; | |||
| text-align: left; | |||
| } | |||
| .name{ | |||
| font-size: 0.4rem; | |||
| font-weight: 800; | |||
| margin-top: 0.2rem; | |||
| } | |||
| .time{ | |||
| margin-top: 0.7rem; | |||
| text-align: left ; | |||
| } | |||
| .tiemBox{ | |||
| height: 1.2rem; | |||
| border-top: 0.01rem #f5f5f5 solid; | |||
| overflow: hidden; | |||
| } | |||
| .getTime{ | |||
| line-height: 1.2rem; | |||
| float: left; | |||
| } | |||
| .timeSuffix{ | |||
| float: right; | |||
| line-height: 1.2rem; | |||
| color: #b8b8b8; | |||
| } | |||
| .timeSuffix_img{ | |||
| width: 0.8rem; | |||
| height: 0.8rem; | |||
| float: right; | |||
| line-height: 1.2rem; | |||
| color: #b8b8b8; | |||
| } | |||
| .activity{ | |||
| margin-top: 0.5rem; | |||
| } | |||
| .selling{ | |||
| color:#ff3434; | |||
| } | |||
| .selling::after{ | |||
| content: "元"; | |||
| color: #b8b8b8; | |||
| } | |||
| .sellingStatus{ | |||
| color: #ffae00; | |||
| } | |||
| #user{ | |||
| position: fixed; | |||
| border-radius: 0.2rem; | |||
| width: 90%; | |||
| background: #52a0fd; | |||
| height: 1.3rem; | |||
| line-height: 1.3rem; | |||
| color: #fff; | |||
| bottom: 3rem; | |||
| left: 0.5rem; | |||
| #Box { | |||
| width: 96%; | |||
| margin: 0 2%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| .detail_msg { | |||
| width: 100%; | |||
| overflow: hidden; | |||
| } | |||
| .goodImg { | |||
| width: 3.6rem; | |||
| height: 2.6rem; | |||
| float: left; | |||
| border-radius: 0.3rem; | |||
| margin: 0.3rem 0.3rem 0.3rem 0; | |||
| } | |||
| .titleBox { | |||
| float: left; | |||
| margin-top: 0.3rem; | |||
| text-align: left; | |||
| } | |||
| .name { | |||
| font-size: 0.4rem; | |||
| font-weight: 800; | |||
| margin-top: 0.2rem; | |||
| } | |||
| .time { | |||
| margin-top: 0.7rem; | |||
| text-align: left; | |||
| } | |||
| .tiemBox { | |||
| height: 1.2rem; | |||
| border-top: 0.01rem #f5f5f5 solid; | |||
| overflow: hidden; | |||
| } | |||
| .getTime { | |||
| line-height: 1.2rem; | |||
| float: left; | |||
| } | |||
| .timeSuffix { | |||
| float: right; | |||
| line-height: 1.2rem; | |||
| color: #b8b8b8; | |||
| } | |||
| .timeSuffix_img { | |||
| width: 0.8rem; | |||
| height: 0.8rem; | |||
| float: right; | |||
| line-height: 1.2rem; | |||
| color: #b8b8b8; | |||
| } | |||
| .activity { | |||
| margin-top: 0.5rem; | |||
| } | |||
| .selling { | |||
| color: #ff3434; | |||
| } | |||
| .selling::after { | |||
| content: "元"; | |||
| color: #b8b8b8; | |||
| } | |||
| .sellingStatus { | |||
| color: #ffae00; | |||
| } | |||
| .user { | |||
| position: fixed; | |||
| border-radius: 0.2rem; | |||
| width: 90%; | |||
| background: #52a0fd; | |||
| height: 1.3rem; | |||
| line-height: 1.3rem; | |||
| color: #fff; | |||
| bottom: 3rem; | |||
| left: 0.5rem; | |||
| } | |||
| </style> | |||
| @@ -34,6 +34,12 @@ export default { | |||
| Toast("券码不能为空"); | |||
| return; | |||
| } else { | |||
| Toast.loading({ | |||
| message: "加载中...", | |||
| duration: 0, // 持续展示 toast | |||
| forbidClick: true, | |||
| forbidClick: true, | |||
| }); | |||
| this.$http | |||
| .ticketDetails({ | |||
| method: "get", | |||
| @@ -44,7 +50,7 @@ export default { | |||
| .then((res) => { | |||
| const { code, data, message } = res; | |||
| if (code == 200) { | |||
| console.log(data); | |||
| Toast.clear(); | |||
| this.$router.push({ | |||
| path: "/commodity", | |||
| query: { | |||
| @@ -52,11 +58,13 @@ export default { | |||
| }, | |||
| }); | |||
| } else { | |||
| Toast.clear(); | |||
| Toast(message); | |||
| return; | |||
| } | |||
| }) | |||
| .catch((res) => { | |||
| Toast.clear(); | |||
| Toast(res); | |||
| }); | |||
| } | |||
| @@ -79,6 +87,7 @@ export default { | |||
| border-radius: 0.2rem; | |||
| box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||
| overflow: hidden; | |||
| background-color: #fff; | |||
| } | |||
| .text { | |||
| float: left; | |||
| @@ -5,20 +5,37 @@ | |||
| <img src="@/assets/images/tick.png" alt="" class="succeedBox_left" /> | |||
| <div class="succeedBox_right">操作成功</div> | |||
| </div> | |||
| <div class="succeedBox_Bot">{{ `本次积分:+100 ` }}</div> | |||
| <div class="succeedBox_Bot">{{ text }}</div> | |||
| </div> | |||
| <div class="backBox"> | |||
| <div class="goNo">继续</div> | |||
| <div class="goBack">返回首页</div> | |||
| <div class="goNo" @click="goBack">继续</div> | |||
| <div class="goBack" @click="goHome">返回首页</div> | |||
| </div> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| export default { | |||
| props: ["text"], | |||
| methods: { | |||
| goBack() { | |||
| this.$emit("goBack", false); | |||
| }, | |||
| goHome() { | |||
| this.$router.push("/home"); | |||
| }, | |||
| }, | |||
| }; | |||
| </script> | |||
| <style scoped> | |||
| .Box { | |||
| width: 100%; | |||
| height: 100%; | |||
| background: #f6f6f8; | |||
| position: fixed; | |||
| top: 0; | |||
| left: 0; | |||
| } | |||
| .succeedBox { | |||
| width: 80%; | |||
| @@ -31,13 +31,18 @@ | |||
| </div> | |||
| <div class="integral" v-show="addFalg">{{ integral }}</div> | |||
| <div class="submit" v-show="addFalg" @click="addIntegral">提交</div> | |||
| <add-end text="添加成功!" @goBack ="control()" v-if="addBackFalg"></add-end> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import Vue from "vue"; | |||
| import { mapState } from "vuex"; | |||
| import addEnd from "./AddEnd" | |||
| import { Toast } from "vant"; | |||
| export default { | |||
| components:{ | |||
| addEnd | |||
| }, | |||
| data() { | |||
| return { | |||
| phone: "", | |||
| @@ -45,12 +50,17 @@ export default { | |||
| addFalg: false, | |||
| list: "", | |||
| integral: 0, | |||
| addBackFalg: false, | |||
| }; | |||
| }, | |||
| computed: { | |||
| ...mapState(["merchant_id"]), | |||
| }, | |||
| methods: { | |||
| // 接收子组件的值 关闭子组件 | |||
| control(data){ | |||
| this.addBackFalg = data | |||
| }, | |||
| //提交添加积分 | |||
| addIntegral() { | |||
| const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | |||
| @@ -64,12 +74,13 @@ export default { | |||
| operatorType: 3, | |||
| receiptUrl:"", | |||
| spendStr: this.integral, | |||
| tags:[] | |||
| tags:[], | |||
| }, | |||
| }).then(res=>{ | |||
| const {code ,data,message} = res | |||
| if(code == 200){ | |||
| Toast('操作成功') | |||
| console.log(6666666666); | |||
| this.addBackFalg = true | |||
| }else{ | |||
| Toast(message) | |||
| } | |||
| @@ -137,6 +148,7 @@ export default { | |||
| <style scoped> | |||
| .Box { | |||
| background: #f6f6f6; | |||
| height: 100%; | |||
| } | |||
| .topBg { | |||
| height: 0.8rem; | |||
| @@ -39,6 +39,7 @@ export default { | |||
| <style lang="less" scoped> | |||
| .page-home { | |||
| height: 100%; | |||
| text-align: left; | |||
| .back-box { | |||
| position: absolute; | |||
| @@ -4,15 +4,15 @@ | |||
| <div class="textBox"> | |||
| <div class="chieBox"> | |||
| <div class="left">会员姓名(昵称):</div> | |||
| <div class="right">乐</div> | |||
| <div class="right">{{ list.name != undefined ? list.name : "" }}</div> | |||
| </div> | |||
| <div class="chieBox"> | |||
| <div class="left">会员等级:</div> | |||
| <div class="right">普通会员</div> | |||
| <div class="right">{{ list.level != undefined ? list.level : "" }}</div> | |||
| </div> | |||
| <div class="chieBox"> | |||
| <div class="left">手机号码:</div> | |||
| <div class="right">17671632874</div> | |||
| <div class="right">{{ phone }}</div> | |||
| </div> | |||
| </div> | |||
| <div class="noData" v-show="noData"> | |||
| @@ -20,16 +20,36 @@ | |||
| <div style="color: #999">暂无可赠送优惠券</div> | |||
| </div> | |||
| <div class="ticketListBox"> | |||
| <div | |||
| class="ticketListBox" | |||
| v-for="(item, index) in ticketList" | |||
| :key="index" | |||
| @click="setSign(index)" | |||
| > | |||
| <div class="ticketList"> | |||
| <img src="@/assets/images/selected2.png" alt="" class="ticketListImg" /> | |||
| <img | |||
| v-if="item.sign" | |||
| src="@/assets/images/selected2.png" | |||
| alt="" | |||
| class="ticketListImg" | |||
| /> | |||
| <div class="nameBox"> | |||
| <div class="nameBox_left">蛋糕通用券</div> | |||
| <div class="nameBox_right">库存:9</div> | |||
| <div class="nameBox_left">{{ item.title }}</div> | |||
| <div class="nameBox_right">{{ "库存:" + item.merchantRemain }}</div> | |||
| </div> | |||
| <div class="validity"> | |||
| {{ | |||
| item.validStartDate != undefined | |||
| ? `有效期:${setTiem( | |||
| item.validStartDate, | |||
| "YYYY-MM-DD HH:mm:ss" | |||
| )}至${setTiem(item.validEndDate, "YYYY-MM-DD HH:mm:ss")}` | |||
| : "有效期:自领取后" + item.validDays + "日内有效" | |||
| }} | |||
| </div> | |||
| <div class="validity">有效期:2020-09-25至2020-09-30</div> | |||
| </div> | |||
| </div> | |||
| <div class="confirm" @click="showPopup">确认</div> | |||
| <van-popup v-model="show" :round="true"> | |||
| <div class="popupBox"> | |||
| @@ -39,36 +59,142 @@ | |||
| <div class="constant">手机号:12345644564</div> | |||
| </div> | |||
| <div class="ticket_Box"> | |||
| <div class="discounts" v-for="item in 4" > | |||
| <div class="name">红烧肉20元通用券</div> | |||
| <div class="tiem">有效期:自领取后1日内有效</div> | |||
| <div class="discounts" v-for="item in pitcnOn" :key="item.id"> | |||
| <div class="name">红烧肉20元通用券</div> | |||
| <div class="tiem">有效期:自领取后1日内有效</div> | |||
| </div> | |||
| </div> | |||
| <div class="operation"> | |||
| <div class="bnt1" @click="show=!show">确认</div> | |||
| <div class="bnt2">取消</div> | |||
| <div class="bnt1" @click="submit">确认</div> | |||
| <div class="bnt2" @click="show = !show">取消</div> | |||
| </div> | |||
| </div> | |||
| </van-popup> | |||
| <add-end text="赠券成功!" @goBack ="control()" v-if="addFalg"></add-end> | |||
| </div> | |||
| </template> | |||
| <script> | |||
| import Vue from "vue"; | |||
| import { Popup } from "vant"; | |||
| Vue.use(Popup); | |||
| import { Popup, Toast } from "vant"; | |||
| import moment from "moment"; | |||
| import addEnd from "../integral/AddEnd" | |||
| Vue.use(Popup, Toast); | |||
| export default { | |||
| components:{ | |||
| addEnd | |||
| }, | |||
| data() { | |||
| return { | |||
| noData: false, | |||
| show: false, | |||
| list: "", | |||
| phone: "", | |||
| ticketList: [], | |||
| pitcnOn: [], //选中的券列表 | |||
| addFalg: false, | |||
| }; | |||
| }, | |||
| methods: { | |||
| // 接收子组件的值 关闭子组件 | |||
| control(data){ | |||
| this.addFalg = data | |||
| this.show = data | |||
| }, | |||
| //提交 | |||
| submit() { | |||
| let arr = [] | |||
| this.pitcnOn.map(item=>{ | |||
| arr.push(item.id) | |||
| }) | |||
| this.$http.wxMerchantcouponhandSel({ | |||
| method: "post", | |||
| data: { | |||
| cUserId: this.list.id, | |||
| wxCouponSendIds: arr, | |||
| }, | |||
| }).then(res=>{ | |||
| const {code ,data,message} = res | |||
| if(code == 200){ | |||
| this.show = !this.show | |||
| this.addFalg = true | |||
| }else{ | |||
| this.show = !this.show | |||
| Toast(message); | |||
| } | |||
| }).catch(res=>{ | |||
| this.show = !this.show | |||
| Toast(res); | |||
| }) | |||
| }, | |||
| //时间处理 | |||
| setTiem(temp, format) { | |||
| //第一个参数是时间戳 第二个参数是格式 参考momentJS | |||
| return moment(Number(temp)).format(format); | |||
| }, | |||
| //改变选中状态展示图片 | |||
| setSign(index) { | |||
| this.ticketList[index].sign = !this.ticketList[index].sign; | |||
| }, | |||
| showPopup() { | |||
| console.log( this.show ,666); | |||
| this.pitcnOn = this.ticketList.filter((item) => { | |||
| return item.sign == true; | |||
| }); | |||
| this.show = true; | |||
| }, | |||
| getTicketList() { | |||
| this.$http | |||
| .wxMerchantcouponSend({ | |||
| methods: "get", | |||
| params: { | |||
| pageNum: 1, | |||
| pageSize: 6, | |||
| sendType: 7, | |||
| expired: 0, | |||
| status: 0, | |||
| }, | |||
| }) | |||
| .then((res) => { | |||
| const { code, data, message } = res; | |||
| if (code == 200) { | |||
| data.list.map((res) => { | |||
| res.sign = false; | |||
| }); | |||
| this.ticketList = data.list; | |||
| } else { | |||
| Toast(message); | |||
| } | |||
| }) | |||
| .catch((res) => { | |||
| Toast(res); | |||
| }); | |||
| }, | |||
| getUserInfo() { | |||
| this.$http | |||
| .findByPhone({ | |||
| methods: "get", | |||
| params: { | |||
| phone: this.phone, | |||
| }, | |||
| }) | |||
| .then((res) => { | |||
| const { code, data, message } = res; | |||
| if (code == 200) { | |||
| this.list = data; | |||
| } else { | |||
| Toast(message); | |||
| } | |||
| }) | |||
| .catch((res) => { | |||
| Toast(res); | |||
| }); | |||
| }, | |||
| }, | |||
| mounted() { | |||
| this.phone = this.$route.query.phone; | |||
| this.getUserInfo(); | |||
| this.getTicketList(); | |||
| }, | |||
| }; | |||
| </script> | |||
| @@ -189,38 +315,37 @@ export default { | |||
| margin: 0 5%; | |||
| text-align: left; | |||
| margin-bottom: 0.5rem; | |||
| } | |||
| .name{ | |||
| font-size: 0.36rem; | |||
| padding: 0.3rem 0.2rem; | |||
| } | |||
| .tiem{ | |||
| font-size: 0.26rem; | |||
| padding: 0.3rem 0.2rem; | |||
| } | |||
| .operation{ | |||
| overflow: hidden; | |||
| } | |||
| .bnt1{ | |||
| width: 2rem; | |||
| line-height: 1rem; | |||
| background-color: #52a0fd; | |||
| color: #fff; | |||
| margin-left: 1.3rem; | |||
| margin-top: 0.5rem; | |||
| border-radius: 0.2rem; | |||
| margin-bottom: 0.5rem; | |||
| float: left; | |||
| } | |||
| .bnt2{ | |||
| width: 2rem; | |||
| line-height: 1rem; | |||
| margin-left: 1.3rem; | |||
| border-radius: 0.2rem; | |||
| float: left; | |||
| margin-top: 0.5rem; | |||
| margin-bottom: 0.5rem; | |||
| border: #999999 0.01rem solid; | |||
| } | |||
| .name { | |||
| font-size: 0.36rem; | |||
| padding: 0.3rem 0.2rem; | |||
| } | |||
| .tiem { | |||
| font-size: 0.26rem; | |||
| padding: 0.3rem 0.2rem; | |||
| } | |||
| .operation { | |||
| overflow: hidden; | |||
| } | |||
| .bnt1 { | |||
| width: 2rem; | |||
| line-height: 1rem; | |||
| background-color: #52a0fd; | |||
| color: #fff; | |||
| margin-left: 1.3rem; | |||
| margin-top: 0.5rem; | |||
| border-radius: 0.2rem; | |||
| margin-bottom: 0.5rem; | |||
| float: left; | |||
| } | |||
| .bnt2 { | |||
| width: 2rem; | |||
| line-height: 1rem; | |||
| margin-left: 1.3rem; | |||
| border-radius: 0.2rem; | |||
| float: left; | |||
| margin-top: 0.5rem; | |||
| margin-bottom: 0.5rem; | |||
| border: #999999 0.01rem solid; | |||
| } | |||
| </style> | |||