@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>营销结算</span> | |||||
</div> | |||||
<div class="navigation"> | <div class="navigation"> | ||||
<div | <div | ||||
class="navigation_box" | class="navigation_box" | ||||
@@ -17,30 +27,41 @@ | |||||
/> | /> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="status1_Box" v-if="list.length != 0"> | <div class="status1_Box" v-if="list.length != 0"> | ||||
<div class="status_1" v-for="item in list" :key="item.id"> | |||||
<div class="numBox"> | |||||
<div class="numBox_left">{{ item.orderId }}</div> | |||||
<div class="numBox_right"> | |||||
{{ setTiem(item.createDate, "YYYY-MM-DD HH:mm:ss") }} | |||||
<van-list | |||||
v-model="ListLoading" | |||||
:finished="finished" | |||||
finished-text="没有更多了" | |||||
@load="onLoad" | |||||
style="background-color: #f8f8fa" | |||||
> | |||||
<div class="status_1" v-for="item in list" :key="item.id"> | |||||
<div class="numBox"> | |||||
<div class="numBox_left">{{ item.orderId }}</div> | |||||
<div class="numBox_right"> | |||||
{{ setTiem(item.createDate, "YYYY-MM-DD HH:mm:ss") }} | |||||
</div> | |||||
</div> | </div> | ||||
</div> | |||||
<div class="accountBox numBox"> | |||||
<div class="numBox_left"> | |||||
{{ item.sourceStr + " " + item.typeStr }} | |||||
<div class="accountBox numBox"> | |||||
<div class="numBox_left"> | |||||
{{ item.sourceStr + " " + item.typeStr }} | |||||
</div> | |||||
<div class="numBox_right" style="color: rgba(255, 106, 106, 1)"> | |||||
{{ `应收:${item.subsidyStr}` }} | |||||
</div> | |||||
</div> | </div> | ||||
<div class="numBox_right" style="color: rgba(255, 106, 106, 1)"> | |||||
{{ `应收:${item.subsidyStr}` }} | |||||
<div class="backStatus_2" v-if="item.statusStr && item.status == 0"> | |||||
{{ item.statusStr }} | |||||
</div> | |||||
<div class="backStatus_1" v-if="item.statusStr && item.status !== 0"> | |||||
{{ item.statusStr }} | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="backStatus_2" v-if="item.statusStr && item.status == 0"> | |||||
{{ item.statusStr }} | |||||
</div> | |||||
<div class="backStatus_1" v-if="item.statusStr && item.status !== 0"> | |||||
{{ item.statusStr }} | |||||
</div> | |||||
</div> | |||||
</van-list> | |||||
</div> | </div> | ||||
<div class="pad" v-if="list.length!=0"></div> | |||||
<div class="status2_Box" v-if="navigationIndex == 1 && showTiem"> | <div class="status2_Box" v-if="navigationIndex == 1 && showTiem"> | ||||
<div class="beginDate" @click="beginDateShow = !beginDateShow"> | <div class="beginDate" @click="beginDateShow = !beginDateShow"> | ||||
{{ beginDateText }} | {{ beginDateText }} | ||||
@@ -124,7 +145,7 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="noData" v-if="noData">暂无数据!</div> | |||||
<div class="noData" v-if="noData&&list.length==0">暂无数据!</div> | |||||
<div class="bott_sum"> | <div class="bott_sum"> | ||||
<div class="text">总计应收</div> | <div class="text">总计应收</div> | ||||
@@ -164,6 +185,8 @@ Vue.use(DatetimePicker, Popup, Toast); | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
ListLoading: false, | |||||
finished: false, | |||||
navigation: [ | navigation: [ | ||||
{ | { | ||||
name: "全部", | name: "全部", | ||||
@@ -265,14 +288,24 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
methods: { | methods: { | ||||
itiLsitData() {//初始化查询列表参数 | |||||
this.pageNum1 = 1; | |||||
//下拉加载 | |||||
onLoad() { | |||||
this.pageNum += 1; | |||||
this.getLsit(); | |||||
}, | |||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | |||||
itiLsitData() { | |||||
//初始化查询列表参数 | |||||
this.pageNum = 1; | |||||
this.pageSize = 10; | this.pageSize = 10; | ||||
this.beginDateText = ""; | this.beginDateText = ""; | ||||
this.endDateText = ""; | this.endDateText = ""; | ||||
this.source = ""; | this.source = ""; | ||||
this.type = ""; | this.type = ""; | ||||
this.status = ""; | this.status = ""; | ||||
this.list = []; | |||||
}, | }, | ||||
settleWay(value) { | settleWay(value) { | ||||
this.status3_index = value; | this.status3_index = value; | ||||
@@ -295,19 +328,22 @@ export default { | |||||
//第一个参数是时间戳 第二个参数是格式 参考momentJS | //第一个参数是时间戳 第二个参数是格式 参考momentJS | ||||
return moment(Number(temp)).format(format); | return moment(Number(temp)).format(format); | ||||
}, | }, | ||||
//点击却换导航 | |||||
switchover(index) { | switchover(index) { | ||||
this.navigationIndex = index; | this.navigationIndex = index; | ||||
this.list = ""; | this.list = ""; | ||||
switch (index) { | switch (index) { | ||||
case 0: | case 0: | ||||
this.noData = false; | this.noData = false; | ||||
this.search(); | |||||
this.beginDateText = ""; | this.beginDateText = ""; | ||||
this.endDateText = ""; | this.endDateText = ""; | ||||
this.itiLsitData() | |||||
this.search(); | |||||
break; | break; | ||||
case 1: | case 1: | ||||
this.noData = false; | this.noData = false; | ||||
this.showTiem = true; | this.showTiem = true; | ||||
this.itiLsitData() | |||||
this.beginDateText = "开始时间"; | this.beginDateText = "开始时间"; | ||||
this.endDateText = "结束时间"; | this.endDateText = "结束时间"; | ||||
break; | break; | ||||
@@ -316,22 +352,26 @@ export default { | |||||
this.showTiem = true; | this.showTiem = true; | ||||
this.beginDateText = ""; | this.beginDateText = ""; | ||||
this.endDateText = ""; | this.endDateText = ""; | ||||
this.itiLsitData() | |||||
break; | break; | ||||
case 3: | case 3: | ||||
this.noData = false; | this.noData = false; | ||||
this.showTiem = true; | this.showTiem = true; | ||||
this.beginDateText = ""; | this.beginDateText = ""; | ||||
this.endDateText = ""; | this.endDateText = ""; | ||||
this.itiLsitData() | |||||
break; | break; | ||||
case 4: | case 4: | ||||
this.noData = false; | this.noData = false; | ||||
this.showTiem = true; | this.showTiem = true; | ||||
this.beginDateText = ""; | this.beginDateText = ""; | ||||
this.endDateText = ""; | this.endDateText = ""; | ||||
this.itiLsitData() | |||||
break; | break; | ||||
default: | default: | ||||
console.log("全部"); | |||||
this.itiLsitData() | |||||
this.search() | |||||
break; | break; | ||||
} | } | ||||
}, | }, | ||||
@@ -346,6 +386,13 @@ export default { | |||||
console.log(this.endDateText, "结束"); | console.log(this.endDateText, "结束"); | ||||
}, | }, | ||||
getLsit() { | getLsit() { | ||||
Toast.loading({ | |||||
message: "加载中...", | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
forbidClick: true, | |||||
}); | |||||
this.ListLoading = true; | |||||
this.$http | this.$http | ||||
.subsidyList({ | .subsidyList({ | ||||
method: "get", | method: "get", | ||||
@@ -362,9 +409,11 @@ export default { | |||||
.then((res) => { | .then((res) => { | ||||
const { code, data, message } = res; | const { code, data, message } = res; | ||||
if (code == 200) { | if (code == 200) { | ||||
if (data.list.length == 0) { | |||||
if(this.pageNum==1&&data.list.length==0){ | |||||
this.noData = true; | this.noData = true; | ||||
} | } | ||||
Toast.clear(); | |||||
this.ListLoading = false; | |||||
data.list.map((item) => { | data.list.map((item) => { | ||||
item.sourceStr = | item.sourceStr = | ||||
this.auditWayOptions.filter((e) => e.value == item.source) | this.auditWayOptions.filter((e) => e.value == item.source) | ||||
@@ -379,16 +428,17 @@ export default { | |||||
: ""; | : ""; | ||||
item.statusStr = item.status === 0 ? "未结算" : "已结算"; | item.statusStr = item.status === 0 ? "未结算" : "已结算"; | ||||
}); | }); | ||||
this.list = data.list; | |||||
this.itiLsitData() | |||||
this.list.push(...data.list); | |||||
this.finished = data.list.length === 0 ? true : false; | |||||
} else { | } else { | ||||
Toast.clear(); | |||||
Toast(message); | Toast(message); | ||||
this.itiLsitData() | |||||
} | } | ||||
}) | }) | ||||
.catch((res) => { | .catch((res) => { | ||||
Toast.clear(); | |||||
Toast(res); | Toast(res); | ||||
this.itiLsitData() | |||||
}); | }); | ||||
}, | }, | ||||
getTotal() { | getTotal() { | ||||
@@ -431,6 +481,25 @@ export default { | |||||
/* background: #f6f6f6; */ | /* background: #f6f6f6; */ | ||||
overflow: hidden; | overflow: hidden; | ||||
} | } | ||||
.pad{ | |||||
margin-top: 2rem; | |||||
} | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.navigation { | .navigation { | ||||
overflow: hidden; | overflow: hidden; | ||||
border-bottom: 0.01rem solid #eee; | border-bottom: 0.01rem solid #eee; | ||||
@@ -1,13 +1,22 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员核销</span> | |||||
</div> | |||||
<div class="topImgBox">{{ thenDate }}</div> | <div class="topImgBox">{{ thenDate }}</div> | ||||
<div style="margin-top: 1.5rem"></div> | |||||
<van-list | <van-list | ||||
v-model="loading" | v-model="loading" | ||||
:finished="finished" | :finished="finished" | ||||
finished-text="没有更多了" | finished-text="没有更多了" | ||||
@load="onLoad" | @load="onLoad" | ||||
style="background-color: #f8f8fa;" | |||||
style="background-color: #f8f8fa" | |||||
> | > | ||||
<div class="bill" v-for="(item, index) in list" :key="index"> | <div class="bill" v-for="(item, index) in list" :key="index"> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
@@ -21,31 +30,39 @@ | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">券名称</div> | <div class="left">券名称</div> | ||||
<div class="right" style="color: #b8b8b8">{{item.title}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{ item.title }}</div> | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">券码</div> | <div class="left">券码</div> | ||||
<div class="right" style="color: #b8b8b8">{{item.id}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{ item.id }}</div> | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">{{item.couponOrderStatus==1?'核销时间':'退款时间'}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{setTiem(item.updateDate,"YYYY-MM-DD HH:mm:ss")}}</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> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">购买用户</div> | <div class="left">购买用户</div> | ||||
<div class="right" style="color: #b8b8b8">{{item.cuserPhone}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{ item.cuserPhone }}</div> | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">核销员</div> | <div class="left">核销员</div> | ||||
<div class="right" style="color: #b8b8b8">{{item.buserName}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{ item.buserName }}</div> | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">{{item.type==8?'原价':'券面额'}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{item.price/100}}元</div> | |||||
<div class="left">{{ item.type == 8 ? "原价" : "券面额" }}</div> | |||||
<div class="right" style="color: #b8b8b8"> | |||||
{{ item.price / 100 }}元 | |||||
</div> | |||||
</div> | </div> | ||||
<div class="bul_Box"> | <div class="bul_Box"> | ||||
<div class="left">{{item.type==8?'底价':'券售价'}}</div> | |||||
<div class="right" style="color: #b8b8b8">{{item.couponPrice/100}}元</div> | |||||
<div class="left">{{ item.type == 8 ? "底价" : "券售价" }}</div> | |||||
<div class="right" style="color: #b8b8b8"> | |||||
{{ item.couponPrice / 100 }}元 | |||||
</div> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</van-list> | </van-list> | ||||
@@ -53,26 +70,32 @@ | |||||
<div class="calendar" @click="show = !show"> | <div class="calendar" @click="show = !show"> | ||||
<img src="@/assets/images/calendar.png" alt="" class="calendar_img" /> | <img src="@/assets/images/calendar.png" alt="" class="calendar_img" /> | ||||
</div> | </div> | ||||
<van-calendar | |||||
v-model="show" | |||||
color="#52a0fd" | |||||
:min-date="minDate" | |||||
:max-date="maxDate" | |||||
@confirm="onConfirm" | |||||
/> | |||||
<van-popup v-model="show" position="bottom"> | |||||
<van-datetime-picker | |||||
v-model="currentDate" | |||||
color="#52a0fd" | |||||
type="date" | |||||
title="选择年月日" | |||||
:min-date="minDate" | |||||
:max-date="maxDate" | |||||
@confirm="onConfirm" | |||||
@cancel="show = !show" | |||||
/> | |||||
</van-popup> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { formatDate } from "@/utils/cloud-utils"; | import { formatDate } from "@/utils/cloud-utils"; | ||||
import Vue from "vue"; | import Vue from "vue"; | ||||
import { Calendar, Toast, List } from "vant"; | |||||
import { DatetimePicker, Toast, List, Popup } from "vant"; | |||||
import moment from "moment"; | import moment from "moment"; | ||||
Vue.use(Calendar, Toast, List); | |||||
import { fstat } from 'fs'; | |||||
Vue.use(DatetimePicker, Toast, List, Popup); | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
currentDate: new Date(), | |||||
loading: false, | loading: false, | ||||
finished: false, | finished: false, | ||||
thenDate: "", | thenDate: "", | ||||
@@ -109,6 +132,9 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
//时间处理 | //时间处理 | ||||
setTiem(temp, format) { | setTiem(temp, format) { | ||||
//第一个参数是时间戳 第二个参数是格式 参考momentJS | //第一个参数是时间戳 第二个参数是格式 参考momentJS | ||||
@@ -135,7 +161,11 @@ export default { | |||||
onConfirm(date) { | onConfirm(date) { | ||||
let tmepTime = formatDate(new Date(date), "yyyy-MM-dd"); | let tmepTime = formatDate(new Date(date), "yyyy-MM-dd"); | ||||
this.pitchTiem = tmepTime; | this.pitchTiem = tmepTime; | ||||
console.log(this.pitchTiem); | |||||
this.thenDate = tmepTime; | |||||
this.pageNum = 1 ; | |||||
this.list = []; | |||||
this.getLsit(); | |||||
this.show = false; | |||||
//查询 | //查询 | ||||
}, | }, | ||||
getLsit() { | getLsit() { | ||||
@@ -152,9 +182,10 @@ export default { | |||||
.then((res) => { | .then((res) => { | ||||
const { code, data } = res; | const { code, data } = res; | ||||
if (code == 200) { | if (code == 200) { | ||||
this.loading = false; | this.loading = false; | ||||
this.list = this.list.concat(data.list.list); | this.list = this.list.concat(data.list.list); | ||||
this.finished = data.list.list.length === 0; | |||||
this.finished = data.list.list.length === 0?true:false; | |||||
} else { | } else { | ||||
Toast(message); | Toast(message); | ||||
return; | return; | ||||
@@ -179,19 +210,32 @@ export default { | |||||
height: 100%; | height: 100%; | ||||
background-color: #f8f8fa; | background-color: #f8f8fa; | ||||
} | } | ||||
.topImgBox { | |||||
position: fixed; | |||||
top: -1.4rem; | |||||
.back-box { | |||||
left: 0; | left: 0; | ||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | width: 100%; | ||||
overflow: hidden; | |||||
height: 2.5rem; | |||||
background-image: url("../../assets/images/bannerbg.png"); | |||||
background-size: 100% 2.5rem; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | text-align: center; | ||||
color: #ffffff; | |||||
line-height: 3.8rem; | |||||
font-size: 0.5rem; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.topImgBox { | |||||
width: 100%; | |||||
overflow: hidden; | |||||
background-image: url("../../assets/images/bannerbg.png"); | |||||
background-size: 100% 1.2rem; | |||||
text-align: center; | |||||
color: #ffffff; | |||||
line-height: 1.2rem; | |||||
font-size: 0.5rem; | |||||
margin-bottom: 0.2rem; | |||||
} | } | ||||
.bill { | .bill { | ||||
width: 96%; | width: 96%; | ||||
@@ -1,40 +1,52 @@ | |||||
<template> | <template> | ||||
<div id="Box" v-if="list.length != 0"> | <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> | |||||
<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 class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员核销</span> | |||||
</div> | </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 class="lisr_box"> | |||||
<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> | |||||
<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> | ||||
</div> | |||||
<div class="user" @click="ifuse">使用</div> | |||||
<div class="user" @click="ifuse">使用</div> | |||||
</div> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -69,10 +81,13 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | |||||
ifuse() { | ifuse() { | ||||
Toast.loading({ | Toast.loading({ | ||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
message: "加载中...", | message: "加载中...", | ||||
forbidClick: true, | forbidClick: true, | ||||
}); | }); | ||||
@@ -87,15 +102,15 @@ export default { | |||||
.then((res) => { | .then((res) => { | ||||
const { code, message, data } = res; | const { code, message, data } = res; | ||||
if (code == 200) { | if (code == 200) { | ||||
Toast.clear(); | |||||
Toast.clear(); | |||||
this.$router.push("/accomplish"); | this.$router.push("/accomplish"); | ||||
} else { | } else { | ||||
Toast.clear(); | |||||
Toast.clear(); | |||||
Toast(message); | Toast(message); | ||||
} | } | ||||
}) | }) | ||||
.catch((res) => { | .catch((res) => { | ||||
Toast.clear(); | |||||
Toast.clear(); | |||||
Toast(res); | Toast(res); | ||||
}); | }); | ||||
}, | }, | ||||
@@ -125,11 +140,29 @@ export default { | |||||
<style scoped> | <style scoped> | ||||
#Box { | #Box { | ||||
width: 96%; | |||||
margin: 0 2%; | |||||
height: 100%; | height: 100%; | ||||
overflow: hidden; | overflow: hidden; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.lisr_box { | |||||
width: 96%; | |||||
margin: 0 2%; | |||||
} | |||||
.detail_msg { | .detail_msg { | ||||
width: 100%; | width: 100%; | ||||
overflow: hidden; | overflow: hidden; | ||||
@@ -1,28 +1,40 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员核销</span> | |||||
</div> | |||||
<div class="backBox"> | <div class="backBox"> | ||||
<div class="timeBox"> | <div class="timeBox"> | ||||
<div class="timeBox_left"> | <div class="timeBox_left"> | ||||
<div style="color: #999; padding-bottom: 0.5rem">开始时间</div> | <div style="color: #999; padding-bottom: 0.5rem">开始时间</div> | ||||
<div @click="startTiemShow=!startTiemShow">{{startTiem}}</div> | |||||
<div @click="startTiemShow = !startTiemShow">{{ startTiem }}</div> | |||||
</div> | </div> | ||||
<div class="timeBox_centre" style="color: #999">至</div> | <div class="timeBox_centre" style="color: #999">至</div> | ||||
<div class="timeBox_right"> | <div class="timeBox_right"> | ||||
<div style="color: #999; padding-bottom: 0.5rem">结束时间</div> | <div style="color: #999; padding-bottom: 0.5rem">结束时间</div> | ||||
<div @click="endTiemShow =!endTiemShow">{{endTiem}}</div> | |||||
<div @click="endTiemShow = !endTiemShow">{{ endTiem }}</div> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="inquire" @click="search()">查询</div> | <div class="inquire" @click="search()">查询</div> | ||||
<div class="acounts"> | <div class="acounts"> | ||||
<div class="title">收款总计(元)</div> | <div class="title">收款总计(元)</div> | ||||
<div class="num">{{(sum_real_payment1+sum_real_payment2+sum_real_payment3)/100}}</div> | |||||
<div class="title1">{{`${list.length} 笔`}}</div> | |||||
<div class="num"> | |||||
{{ (sum_real_payment1 + sum_real_payment2 + sum_real_payment3) / 100 }} | |||||
</div> | |||||
<div class="title1">{{ `${list.length} 笔` }}</div> | |||||
<div class="billBox"> | <div class="billBox"> | ||||
<div class="billBox_left"> | <div class="billBox_left"> | ||||
<div>已到账(元)</div> | <div>已到账(元)</div> | ||||
<div style="color: #333; font-weight: bold; padding-bottom: 0.5rem"> | <div style="color: #333; font-weight: bold; padding-bottom: 0.5rem"> | ||||
{{(sum_real_payment2+sum_real_payment3)/100}} | |||||
{{ (sum_real_payment2 + sum_real_payment3) / 100 }} | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="billBox_right"> | <div class="billBox_right"> | ||||
@@ -30,181 +42,274 @@ | |||||
<div | <div | ||||
style="color: #ff6a6a; font-weight: bold; padding-bottom: 0.5rem" | style="color: #ff6a6a; font-weight: bold; padding-bottom: 0.5rem" | ||||
> | > | ||||
{{sum_real_payment1/100}} | |||||
{{ sum_real_payment1 / 100 }} | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="content" v-for="(item,index) in list" :key="index"> | |||||
<div class="content_left"> | |||||
<div class="customer">{{item.onickName}}</div> | |||||
<div style="font-size: 0.36rem;">{{setTiem(item.createDate,"YYYY-MM-DD HH:mm:ss")}}</div> | |||||
</div> | |||||
<div class="content_rigth"> | |||||
<div class="price">{{`¥${item.deductionAmount/100}`}}</div> | |||||
<div style="color: red">{{`实收 ¥${item.realPayment/100}`}}</div> | |||||
<van-list | |||||
v-model="ListLoading" | |||||
:finished="finished" | |||||
finished-text="没有更多了" | |||||
@load="onLoad" | |||||
style="background-color: #f8f8fa" | |||||
> | |||||
<div class="content" v-for="(item, index) in list" :key="index"> | |||||
<div class="content_left"> | |||||
<div class="customer">{{ item.onickName }}</div> | |||||
<div style="font-size: 0.36rem"> | |||||
{{ setTiem(item.createDate, "YYYY-MM-DD HH:mm:ss") }} | |||||
</div> | |||||
</div> | |||||
<div class="content_rigth"> | |||||
<div class="price">{{ `¥${item.deductionAmount / 100}` }}</div> | |||||
<div style="color: red">{{ `实收 ¥${item.realPayment / 100}` }}</div> | |||||
</div> | |||||
</div> | </div> | ||||
</div> | |||||
<div class="noData">暂无数据</div> | |||||
<van-calendar | |||||
</van-list> | |||||
<!-- <van-calendar | |||||
v-model="startTiemShow" | v-model="startTiemShow" | ||||
color="#52a0fd" | color="#52a0fd" | ||||
:min-date="startMinDate" | :min-date="startMinDate" | ||||
:max-date="startMaxDate" | :max-date="startMaxDate" | ||||
@confirm="onConfirm1" | @confirm="onConfirm1" | ||||
/> | |||||
<van-calendar | |||||
/> --> | |||||
<van-popup v-model="startTiemShow" position="bottom"> | |||||
<van-datetime-picker | |||||
v-model="currentDate1" | |||||
color="#52a0fd" | |||||
type="date" | |||||
title="选择年月日" | |||||
:min-date="startMinDate" | |||||
:max-date="startMaxDate" | |||||
@confirm="onConfirm1" | |||||
@cancel="startTiemShow = !startTiemShow" | |||||
/> | |||||
</van-popup> | |||||
<van-popup v-model="endTiemShow" position="bottom"> | |||||
<van-datetime-picker | |||||
v-model="currentDate2" | |||||
color="#52a0fd" | |||||
type="date" | |||||
title="选择年月日" | |||||
:min-date="endMinDate" | |||||
:max-date="endMaxDate" | |||||
@confirm="onConfirm2" | |||||
@cancel="endTiemShow = !endTiemShow" | |||||
/> | |||||
</van-popup> | |||||
<!-- <van-calendar | |||||
v-model="endTiemShow" | v-model="endTiemShow" | ||||
color="#52a0fd" | color="#52a0fd" | ||||
:min-date="endMinDate" | :min-date="endMinDate" | ||||
:max-date="endMaxDate" | :max-date="endMaxDate" | ||||
@confirm="onConfirm2" | @confirm="onConfirm2" | ||||
/> | |||||
/> --> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { formatDate } from "@/utils/cloud-utils"; | import { formatDate } from "@/utils/cloud-utils"; | ||||
import moment from "moment"; | import moment from "moment"; | ||||
import Vue from "vue"; | import Vue from "vue"; | ||||
import { Calendar,Toast } from "vant"; | |||||
import{ mapState} from "vuex"; | |||||
Vue.use(Calendar,Toast); | |||||
import { DatetimePicker, Toast, List } from "vant"; | |||||
import { mapState } from "vuex"; | |||||
Vue.use(DatetimePicker, Toast, List); | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
ListLoading: false, | |||||
finished: false, | |||||
currentDate1: new Date(), | |||||
currentDate2: new Date(), | |||||
startTiemShow: false, | startTiemShow: false, | ||||
endTiemShow: false, | endTiemShow: false, | ||||
startTiem: formatDate(new Date() ,"yyyy-MM-dd") , | |||||
endTiem:formatDate(new Date() ,"yyyy-MM-dd"), | |||||
startMinDate:new Date(2015, 0, 1), | |||||
startMaxDate:new Date(2025, 0, 1), | |||||
endMinDate:new Date(2015, 0, 1), | |||||
endMaxDate:new Date(2025, 0, 1), | |||||
startTiem: formatDate(new Date(), "yyyy-MM-dd"), | |||||
endTiem: formatDate(new Date(), "yyyy-MM-dd"), | |||||
startMinDate: new Date(2015, 0, 1), | |||||
startMaxDate: new Date(2025, 0, 1), | |||||
endMinDate: new Date(2015, 0, 1), | |||||
endMaxDate: new Date(2025, 0, 1), | |||||
sum_real_payment1: 0, | sum_real_payment1: 0, | ||||
sum_real_payment2: 0, | sum_real_payment2: 0, | ||||
sum_real_payment3:0, | |||||
pageNum:1, | |||||
pageSize:10, | |||||
list:[], | |||||
startdate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 00:00:00', | |||||
enddate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 23:59:59', | |||||
sum_real_payment3: 0, | |||||
pageNum: 1, | |||||
pageSize: 10, | |||||
list: [], | |||||
startdate: | |||||
moment(new Date().getTime()).format("YYYY-MM-DD") + " 00:00:00", | |||||
enddate: moment(new Date().getTime()).format("YYYY-MM-DD") + " 23:59:59", | |||||
}; | }; | ||||
}, | }, | ||||
computed: { | computed: { | ||||
...mapState(['merchant_id']) | |||||
...mapState(["merchant_id"]), | |||||
}, | }, | ||||
methods: { | methods: { | ||||
//下拉加载 | |||||
onLoad() { | |||||
this.pageNum += 1; | |||||
this.itiSearch(); | |||||
}, | |||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | |||||
//根据时间查找 | //根据时间查找 | ||||
search(){ | |||||
search() { | |||||
this.list = []; | |||||
this.pageNum = 1; | |||||
this.payMum1(); | |||||
this.payMum2(); | |||||
this.payMum3(); | |||||
this.getCardPay(); | this.getCardPay(); | ||||
}, | |||||
//初始化查询表格 | |||||
itiSearch(){ | |||||
this.payMum1(); | this.payMum1(); | ||||
this.payMum2(); | this.payMum2(); | ||||
this.payMum3(); | this.payMum3(); | ||||
this.getCardPay(); | |||||
}, | }, | ||||
//查询消费卡扫码记录列表 | |||||
//查询消费卡扫码记录列表 | |||||
getCardPay() { | getCardPay() { | ||||
this.$http.cardPayList({ | |||||
methods: "get", | |||||
params: { | |||||
pageNum:this.pageNum, | |||||
pageSize:this.pageSize, | |||||
startdate: this.startdate, | |||||
enddate: this.enddate, | |||||
}, | |||||
}).then(res=>{ | |||||
const {code,message,data} = res | |||||
if(code ==200){ | |||||
this.list = data.list | |||||
}else{ | |||||
Toast(message); | |||||
} | |||||
}).catch(res=>{ | |||||
Toast(res); | |||||
}) | |||||
this.ListLoading = true; | |||||
this.$http | |||||
.cardPayList({ | |||||
methods: "get", | |||||
params: { | |||||
pageNum: this.pageNum, | |||||
pageSize: this.pageSize, | |||||
startdate: this.startdate, | |||||
enddate: this.enddate, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, message, data } = res; | |||||
if (code == 200) { | |||||
this.ListLoading = false; | |||||
this.finished = data.list.length === 0?true:false; | |||||
this.list.push(...data.list) ; | |||||
} else { | |||||
Toast(message); | |||||
} | |||||
}) | |||||
.catch((res) => { | |||||
Toast(res); | |||||
}); | |||||
}, | }, | ||||
payMum1(){ | |||||
this.$http.payMum({ | |||||
methods: "get", | |||||
params:{ | |||||
merchantId: this.merchant_id, | |||||
startdate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 00:00:00', | |||||
enddate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 23:59:59', | |||||
payStatus:0 | |||||
} | |||||
}).then(res=>{ | |||||
const{code , data,message}=res | |||||
if(code==200){ | |||||
this.sum_real_payment1= Number(data.length!=0?res.data[0].sum_real_payment:0) | |||||
}else{ | |||||
Toast(message); | |||||
} | |||||
}) | |||||
payMum1() { | |||||
this.$http | |||||
.payMum({ | |||||
methods: "get", | |||||
params: { | |||||
merchantId: this.merchant_id, | |||||
startdate: this.startdate, | |||||
enddate: this.enddate, | |||||
payStatus: 0, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
this.sum_real_payment1 = Number( | |||||
data.length != 0 ? res.data[0].sum_real_payment : 0 | |||||
); | |||||
} else { | |||||
Toast(message); | |||||
} | |||||
}); | |||||
}, | }, | ||||
payMum2(){ | |||||
this.$http.payMum({ | |||||
methods: "get", | |||||
params:{ | |||||
merchantId: this.merchant_id, | |||||
startdate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 00:00:00', | |||||
enddate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 23:59:59', | |||||
payStatus:1 | |||||
} | |||||
}).then(res=>{ | |||||
const{code , data,message}=res | |||||
if(code==200){ | |||||
this.sum_real_payment2= Number(data.length!=0?res.data[0].sum_real_payment:0) | |||||
}else{ | |||||
Toast(message); | |||||
} | |||||
}) | |||||
payMum2() { | |||||
this.$http | |||||
.payMum({ | |||||
methods: "get", | |||||
params: { | |||||
merchantId: this.merchant_id, | |||||
startdate: this.startdate, | |||||
enddate: this.enddate, | |||||
payStatus: 1, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
this.sum_real_payment2 = Number( | |||||
data.length != 0 ? res.data[0].sum_real_payment : 0 | |||||
); | |||||
} else { | |||||
Toast(message); | |||||
} | |||||
}); | |||||
}, | }, | ||||
payMum3(){ | |||||
this.$http.payMum({ | |||||
methods: "get", | |||||
params:{ | |||||
merchantId: this.merchant_id, | |||||
startdate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 00:00:00', | |||||
enddate: moment(new Date().getTime()).format("YYYY-MM-DD")+' 23:59:59', | |||||
payStatus:2 | |||||
} | |||||
}).then(res=>{ | |||||
const{code , data,message}=res | |||||
if(code==200){ | |||||
this.sum_real_payment3= Number(data.length!=0?res.data[0].sum_real_payment:0) | |||||
}else{ | |||||
Toast(message); | |||||
} | |||||
}) | |||||
payMum3() { | |||||
this.$http | |||||
.payMum({ | |||||
methods: "get", | |||||
params: { | |||||
merchantId: this.merchant_id, | |||||
startdate: this.startdate, | |||||
enddate: this.enddate, | |||||
payStatus: 2, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
this.sum_real_payment3 = Number( | |||||
data.length != 0 ? res.data[0].sum_real_payment : 0 | |||||
); | |||||
} else { | |||||
Toast(message); | |||||
} | |||||
}); | |||||
}, | }, | ||||
onConfirm1(date){ | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd") | |||||
this.startTiem = tmepTime | |||||
this.startTiemShow = false | |||||
this.startdate = tmepTime +' 00:00:00' | |||||
console.log(this.startTiem ,"????"); | |||||
onConfirm1(date) { | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd"); | |||||
this.startTiem = tmepTime; | |||||
this.startTiemShow = false; | |||||
this.startdate = tmepTime + " 00:00:00"; | |||||
console.log(this.startTiem, "????"); | |||||
}, | }, | ||||
onConfirm2(date){ | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd") | |||||
this.endTiem = tmepTime | |||||
this.endTiemShow = false | |||||
this.enddate = tmepTime+' 23:59:59' | |||||
console.log(this.endTiem ,"????"); | |||||
onConfirm2(date) { | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd"); | |||||
this.endTiem = tmepTime; | |||||
this.endTiemShow = false; | |||||
this.enddate = tmepTime + " 23:59:59"; | |||||
console.log(this.endTiem, "????"); | |||||
}, | }, | ||||
//时间处理 | //时间处理 | ||||
setTiem(temp,format){//第一个参数是时间戳 第二个参数是格式 参考momentJS | |||||
return moment(Number(temp)).format(format) | |||||
} | |||||
setTiem(temp, format) { | |||||
//第一个参数是时间戳 第二个参数是格式 参考momentJS | |||||
return moment(Number(temp)).format(format); | |||||
}, | |||||
}, | |||||
mounted() { | |||||
this.itiSearch(); | |||||
}, | }, | ||||
mounted(){ | |||||
this.search() | |||||
} | |||||
}; | }; | ||||
</script> | </script> | ||||
<style scoped> | <style scoped> | ||||
.Box { | .Box { | ||||
background: #f6f6f6; | background: #f6f6f6; | ||||
height: 100%; | |||||
} | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | } | ||||
.timeBox { | .timeBox { | ||||
overflow: hidden; | overflow: hidden; | ||||
@@ -307,7 +412,7 @@ export default { | |||||
line-height: 1rem; | line-height: 1rem; | ||||
text-align: left; | text-align: left; | ||||
} | } | ||||
.customer{ | |||||
.customer { | |||||
color: #000; | color: #000; | ||||
font-size: 0.48rem; | font-size: 0.48rem; | ||||
line-height: 0.48rem; | line-height: 0.48rem; | ||||
@@ -325,8 +430,8 @@ export default { | |||||
padding: 0.3rem 0; | padding: 0.3rem 0; | ||||
color: #999; | color: #999; | ||||
} | } | ||||
.noData{ | |||||
line-height: 2rem; | |||||
text-align: center; | |||||
.noData { | |||||
line-height: 2rem; | |||||
text-align: center; | |||||
} | } | ||||
</style> | </style> |
@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>消费卡收款</span> | |||||
</div> | |||||
<div class="RqBox"> | <div class="RqBox"> | ||||
<div class="text">扫描二维码向我付款</div> | <div class="text">扫描二维码向我付款</div> | ||||
<div class="Rq" ref="RqCode"></div> | <div class="Rq" ref="RqCode"></div> | ||||
@@ -21,6 +31,9 @@ export default { | |||||
...mapState(['merchant_id_scan']) | ...mapState(['merchant_id_scan']) | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
goToday() { | goToday() { | ||||
this.$router.push("/todayConsume"); | this.$router.push("/todayConsume"); | ||||
}, | }, | ||||
@@ -46,7 +59,23 @@ export default { | |||||
.Box { | .Box { | ||||
background-color: #52a0fd; | background-color: #52a0fd; | ||||
overflow: hidden; | overflow: hidden; | ||||
height: 100vh; | |||||
height: 100%; | |||||
} | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | } | ||||
.RqBox { | .RqBox { | ||||
width: 94%; | width: 94%; | ||||
@@ -64,7 +93,6 @@ export default { | |||||
color: rgba(51, 51, 51, 1); | color: rgba(51, 51, 51, 1); | ||||
} | } | ||||
.Rq { | .Rq { | ||||
background-color: bisque; | |||||
width: 6rem; | width: 6rem; | ||||
height: 5rem; | height: 5rem; | ||||
margin: 1rem auto; | margin: 1rem auto; | ||||
@@ -1,5 +1,17 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员核销</span> | |||||
</div> | |||||
<div class="topbox"> | <div class="topbox"> | ||||
<div class="title">今日收款总额(元)</div> | <div class="title">今日收款总额(元)</div> | ||||
<div class="num">{{(sum_real_payment1+sum_real_payment2+sum_real_payment3)/100}}</div> | <div class="num">{{(sum_real_payment1+sum_real_payment2+sum_real_payment3)/100}}</div> | ||||
@@ -53,11 +65,20 @@ export default { | |||||
...mapState(['merchant_id']) | ...mapState(['merchant_id']) | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
goCurrent() { | goCurrent() { | ||||
this.$router.push("/current"); | this.$router.push("/current"); | ||||
}, | }, | ||||
//查询消费卡扫码记录列表 | //查询消费卡扫码记录列表 | ||||
getCardPay() { | getCardPay() { | ||||
Toast.loading({ | |||||
message: "加载中...", | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
forbidClick: true, | |||||
}); | |||||
this.$http.cardPayList({ | this.$http.cardPayList({ | ||||
methods: "get", | methods: "get", | ||||
params: { | params: { | ||||
@@ -69,11 +90,14 @@ export default { | |||||
}).then(res=>{ | }).then(res=>{ | ||||
const {code,message,data} = res | const {code,message,data} = res | ||||
if(code ==200){ | if(code ==200){ | ||||
Toast.clear(); | |||||
this.list = data.list | this.list = data.list | ||||
}else{ | }else{ | ||||
Toast.clear(); | |||||
Toast(message); | Toast(message); | ||||
} | } | ||||
}).catch(res=>{ | }).catch(res=>{ | ||||
Toast.clear(); | |||||
Toast(res); | Toast(res); | ||||
}) | }) | ||||
}, | }, | ||||
@@ -148,9 +172,26 @@ export default { | |||||
<style scoped> | <style scoped> | ||||
.Box { | .Box { | ||||
height: 100%; | |||||
overflow: hidden; | overflow: hidden; | ||||
font-size: 0.42rem; | font-size: 0.42rem; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.topbox { | .topbox { | ||||
background-color: #52a0fd; | background-color: #52a0fd; | ||||
color: rgba(255, 255, 255, 1); | color: rgba(255, 255, 255, 1); | ||||
@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div class="box"> | <div class="box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员核销</span> | |||||
</div> | |||||
<div class="case"> | <div class="case"> | ||||
<div class="text">券码</div> | <div class="text">券码</div> | ||||
<span class="line"></span> | <span class="line"></span> | ||||
@@ -18,9 +28,9 @@ | |||||
<script> | <script> | ||||
import Vue from "vue"; | import Vue from "vue"; | ||||
import { Toast } from "vant"; | |||||
import { Toast, Icon } from "vant"; | |||||
Vue.use(Toast); | |||||
Vue.use(Toast, Icon); | |||||
export default { | export default { | ||||
data() { | data() { | ||||
return { | return { | ||||
@@ -29,6 +39,9 @@ export default { | |||||
}; | }; | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
search() { | search() { | ||||
if (this.codeText == "" || this.codeText.length == 0) { | if (this.codeText == "" || this.codeText.length == 0) { | ||||
Toast("券码不能为空"); | Toast("券码不能为空"); | ||||
@@ -74,12 +87,28 @@ export default { | |||||
}; | }; | ||||
</script> | </script> | ||||
<style lang="less" scoped> | |||||
<style scoped> | |||||
.box { | .box { | ||||
// overflow: hidden; | |||||
height: 100%; | height: 100%; | ||||
background: #f6f6f6; | background: #f6f6f6; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.case { | .case { | ||||
width: 96%; | width: 96%; | ||||
margin: 30% 2%; | margin: 30% 2%; | ||||
@@ -1,11 +1,20 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员积分</span> | |||||
</div> | |||||
<div class="inquireBox"> | <div class="inquireBox"> | ||||
<div class="text">手机号</div> | <div class="text">手机号</div> | ||||
<input type="text" class="phone" placeholder="请输入" v-model="phone"/> | |||||
<input type="text" class="phone" placeholder="请输入" v-model="phone" /> | |||||
</div> | </div> | ||||
<div class="but" @click="goUserMessage">提交</div> | <div class="but" @click="goUserMessage">提交</div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
@@ -13,35 +22,82 @@ import Vue from "vue"; | |||||
import { Toast } from "vant"; | import { Toast } from "vant"; | ||||
Vue.use(Toast); | Vue.use(Toast); | ||||
export default { | export default { | ||||
data() { | |||||
return { | |||||
phone:'', | |||||
} | |||||
data() { | |||||
return { | |||||
phone: "", | |||||
}; | |||||
}, | |||||
methods: { | |||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | |||||
goUserMessage() { | |||||
const str = /^1[0-9]{10}$/; | |||||
if (str.test(this.phone)) { | |||||
this.getUserInfo() | |||||
} else { | |||||
Toast("请输入正确手机号!"); | |||||
} | |||||
}, | }, | ||||
methods: { | |||||
goUserMessage(){ | |||||
const str = /^1[0-9]{10}$/ | |||||
if(str.test(this.phone)){ | |||||
this.$router.push({ | |||||
path:"/userMessage", | |||||
query:{ | |||||
phone:this.phone | |||||
} | |||||
}) | |||||
}else{ | |||||
Toast("请输入正确手机号!"); | |||||
getUserInfo() { | |||||
Toast.loading({ | |||||
message: "加载中...", | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
forbidClick: true, | |||||
}); | |||||
this.$http | |||||
.findByPhone({ | |||||
methods: "get", | |||||
params: { | |||||
phone: this.phone, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
Toast.clear(); | |||||
this.$router.push({ | |||||
path: "/userMessage", | |||||
query: { | |||||
phone: this.phone, | |||||
}, | |||||
}); | |||||
} else { | |||||
Toast.clear(); | |||||
Toast(message); | |||||
} | } | ||||
// this.$router.push('/userMessage') | |||||
} | |||||
}) | |||||
.catch((res) => { | |||||
Toast.clear(); | |||||
Toast(res); | |||||
}); | |||||
}, | }, | ||||
} | |||||
}, | |||||
}; | |||||
</script> | </script> | ||||
<style scoped> | <style scoped> | ||||
.Box { | .Box { | ||||
height: 100%; | height: 100%; | ||||
background: #f6f6f6; | background: #f6f6f6; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.inquireBox { | .inquireBox { | ||||
width: 96%; | width: 96%; | ||||
margin: 0 2%; | margin: 0 2%; | ||||
@@ -65,19 +121,19 @@ export default { | |||||
margin-top: 0.3rem; | margin-top: 0.3rem; | ||||
margin-right: 0.3rem; | margin-right: 0.3rem; | ||||
} | } | ||||
.but{ | |||||
width: 96; | |||||
margin: 0 2%; | |||||
text-align: center; | |||||
line-height: 1.3rem; | |||||
border-radius: 0.1rem; | |||||
background: #52a0fd; | |||||
color: #ffffff; | |||||
margin-top: 1.6rem; | |||||
.but { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
text-align: center; | |||||
line-height: 1.3rem; | |||||
border-radius: 0.1rem; | |||||
background: #52a0fd; | |||||
color: #ffffff; | |||||
margin-top: 1.6rem; | |||||
} | } | ||||
.consumption_num{ | |||||
float: right; | |||||
.consumption_num { | |||||
float: right; | |||||
width: 6rem; | width: 6rem; | ||||
line-height: 1.26rem; | line-height: 1.26rem; | ||||
font-size: 0.3rem; | font-size: 0.3rem; | ||||
@@ -85,5 +141,4 @@ float: right; | |||||
margin-top: 0.3rem; | margin-top: 0.3rem; | ||||
margin-right: 0.3rem; | margin-right: 0.3rem; | ||||
} | } | ||||
</style> | </style> |
@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div> | |||||
<div class="Box"> | |||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span >会员积分</span> | |||||
</div> | |||||
<member-public :data="rule"/> | <member-public :data="rule"/> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -18,9 +28,35 @@ export default { | |||||
} | } | ||||
}, | }, | ||||
methods: { | methods: { | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
goDetails(){ | goDetails(){ | ||||
this.$router.push('/integralParticulars') | this.$router.push('/integralParticulars') | ||||
} | } | ||||
}, | }, | ||||
} | } | ||||
</script> | |||||
</script> | |||||
<style scoped> | |||||
.Box{ | |||||
height: 100%; | |||||
} | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
</style> |
@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<p>会员积分</p> | |||||
</div> | |||||
<div class="topBg"></div> | <div class="topBg"></div> | ||||
<div class="textBox"> | <div class="textBox"> | ||||
<div class="chieBox"> | <div class="chieBox"> | ||||
@@ -61,10 +71,19 @@ export default { | |||||
control(data){ | control(data){ | ||||
this.addBackFalg = data | this.addBackFalg = data | ||||
}, | }, | ||||
goBack() { | |||||
this.$router.go(-1) | |||||
}, | |||||
//提交添加积分 | //提交添加积分 | ||||
addIntegral() { | addIntegral() { | ||||
const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | const reg = /(^[1-9]\d*(\.\d{1,2})?$)|(^0(\.\d{1,2})?$)/; | ||||
if (reg.test(this.consumption)) { | if (reg.test(this.consumption)) { | ||||
Toast.loading({ | |||||
message: "加载中...", | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
forbidClick: true, | |||||
}); | |||||
this.$http.addCredit({ | this.$http.addCredit({ | ||||
method: "POST", | method: "POST", | ||||
data: { | data: { | ||||
@@ -79,12 +98,14 @@ export default { | |||||
}).then(res=>{ | }).then(res=>{ | ||||
const {code ,data,message} = res | const {code ,data,message} = res | ||||
if(code == 200){ | if(code == 200){ | ||||
console.log(6666666666); | |||||
Toast.clear(); | |||||
this.addBackFalg = true | this.addBackFalg = true | ||||
}else{ | }else{ | ||||
Toast.clear(); | |||||
Toast(message) | Toast(message) | ||||
} | } | ||||
}).catch(res=>{ | }).catch(res=>{ | ||||
Toast.clear(); | |||||
Toast(res) | Toast(res) | ||||
}) | }) | ||||
} else { | } else { | ||||
@@ -125,11 +146,13 @@ export default { | |||||
}) | }) | ||||
.then((res) => { | .then((res) => { | ||||
const { code, data, message } = res; | const { code, data, message } = res; | ||||
if (code == 200) { | if (code == 200) { | ||||
this.list = data; | this.list = data; | ||||
console.log(data); | |||||
} else { | } else { | ||||
Toast(message); | Toast(message); | ||||
this.goBack() | |||||
} | } | ||||
}) | }) | ||||
.catch((res) => { | .catch((res) => { | ||||
@@ -150,32 +173,53 @@ export default { | |||||
background: #f6f6f6; | background: #f6f6f6; | ||||
height: 100%; | height: 100%; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
overflow: hidden; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.topBg { | .topBg { | ||||
height: 0.8rem; | height: 0.8rem; | ||||
background-image: url("../../../assets/images/bannerbg.png"); | background-image: url("../../../assets/images/bannerbg.png"); | ||||
background-size: 100% 0.8rem; | background-size: 100% 0.8rem; | ||||
} | } | ||||
.textBox { | .textBox { | ||||
width: 96; | |||||
margin: 0 2%; | |||||
width: 96%; | |||||
margin: 0.2rem 2%; | |||||
border-radius: 0.2rem; | border-radius: 0.2rem; | ||||
border: 1px solid #eaeaea; | border: 1px solid #eaeaea; | ||||
margin-top: -0.2rem; | margin-top: -0.2rem; | ||||
z-index: 10; | z-index: 10; | ||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | ||||
margin-top: 0.2rem; | |||||
} | } | ||||
.chieBox { | .chieBox { | ||||
overflow: hidden; | overflow: hidden; | ||||
background-color: #fff; | background-color: #fff; | ||||
height: 1.25rem; | |||||
} | } | ||||
.left { | .left { | ||||
float: left; | float: left; | ||||
color: #999999; | color: #999999; | ||||
height: 1.25rem; | |||||
line-height: 1.25rem; | line-height: 1.25rem; | ||||
padding-left: 0.3rem; | padding-left: 0.3rem; | ||||
} | } | ||||
.right { | .right { | ||||
float: right; | float: right; | ||||
height: 1.25rem; | |||||
line-height: 1.25rem; | line-height: 1.25rem; | ||||
padding-right: 0.3rem; | padding-right: 0.3rem; | ||||
} | } | ||||
@@ -1,11 +1,20 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员赠券</span> | |||||
</div> | |||||
<div class="inquireBox"> | <div class="inquireBox"> | ||||
<div class="text">手机号</div> | <div class="text">手机号</div> | ||||
<input type="text" class="phone" placeholder="请输入" v-model="phone"/> | |||||
<input type="text" class="phone" placeholder="请输入" v-model="phone" /> | |||||
</div> | </div> | ||||
<div class="but" @click="goUserMessage">提交</div> | <div class="but" @click="goUserMessage">提交</div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
@@ -13,35 +22,82 @@ import Vue from "vue"; | |||||
import { Toast } from "vant"; | import { Toast } from "vant"; | ||||
Vue.use(Toast); | Vue.use(Toast); | ||||
export default { | export default { | ||||
data() { | |||||
return { | |||||
phone:'', | |||||
} | |||||
data() { | |||||
return { | |||||
phone: "", | |||||
}; | |||||
}, | |||||
methods: { | |||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | |||||
goUserMessage() { | |||||
const str = /^1[0-9]{10}$/; | |||||
if (str.test(this.phone)) { | |||||
this.getUserInfo(); | |||||
} else { | |||||
Toast("请输入正确手机号!"); | |||||
} | |||||
// this.$router.push('/ticketDetails') | |||||
}, | }, | ||||
methods: { | |||||
goUserMessage(){ | |||||
const str = /^1[0-9]{10}$/ | |||||
if(str.test(this.phone)){ | |||||
this.$router.push({ | |||||
path:"/ticketDetails", | |||||
query:{ | |||||
phone:this.phone | |||||
} | |||||
}) | |||||
}else{ | |||||
Toast("请输入正确手机号!"); | |||||
getUserInfo() { | |||||
Toast.loading({ | |||||
message: "加载中...", | |||||
duration: 0, // 持续展示 toast | |||||
forbidClick: true, | |||||
forbidClick: true, | |||||
}); | |||||
this.$http | |||||
.findByPhone({ | |||||
methods: "get", | |||||
params: { | |||||
phone: this.phone, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
Toast.clear(); | |||||
this.$router.push({ | |||||
path: "/ticketDetails", | |||||
query: { | |||||
phone: this.phone, | |||||
}, | |||||
}); | |||||
} else { | |||||
Toast.clear(); | |||||
Toast(message); | |||||
} | } | ||||
// this.$router.push('/ticketDetails') | |||||
} | |||||
}) | |||||
.catch((res) => { | |||||
Toast.clear(); | |||||
Toast(res); | |||||
}); | |||||
}, | }, | ||||
} | |||||
}, | |||||
}; | |||||
</script> | </script> | ||||
<style scoped> | <style scoped> | ||||
.Box { | .Box { | ||||
height: 100%; | height: 100%; | ||||
background: #f6f6f6; | background: #f6f6f6; | ||||
} | } | ||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
.inquireBox { | .inquireBox { | ||||
width: 96%; | width: 96%; | ||||
margin: 0 2%; | margin: 0 2%; | ||||
@@ -65,19 +121,19 @@ export default { | |||||
margin-top: 0.3rem; | margin-top: 0.3rem; | ||||
margin-right: 0.3rem; | margin-right: 0.3rem; | ||||
} | } | ||||
.but{ | |||||
width: 96; | |||||
margin: 0 2%; | |||||
text-align: center; | |||||
line-height: 1.3rem; | |||||
border-radius: 0.1rem; | |||||
background: #52a0fd; | |||||
color: #ffffff; | |||||
margin-top: 1.6rem; | |||||
.but { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
text-align: center; | |||||
line-height: 1.3rem; | |||||
border-radius: 0.1rem; | |||||
background: #52a0fd; | |||||
color: #ffffff; | |||||
margin-top: 1.6rem; | |||||
} | } | ||||
.consumption_num{ | |||||
float: right; | |||||
.consumption_num { | |||||
float: right; | |||||
width: 6rem; | width: 6rem; | ||||
line-height: 1.26rem; | line-height: 1.26rem; | ||||
font-size: 0.3rem; | font-size: 0.3rem; | ||||
@@ -85,5 +141,4 @@ float: right; | |||||
margin-top: 0.3rem; | margin-top: 0.3rem; | ||||
margin-right: 0.3rem; | margin-right: 0.3rem; | ||||
} | } | ||||
</style> | </style> |
@@ -1,26 +1,60 @@ | |||||
<template> | <template> | ||||
<div> | |||||
<member-public :data="rule"/> | |||||
<div class="Box"> | |||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="goBack" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员赠券</span> | |||||
<member-public :data="rule" /> | |||||
</div> | </div> | ||||
</div> | |||||
</template> | </template> | ||||
<script> | <script> | ||||
import memberPublic from '../memberPublic' | |||||
import memberPublic from "../memberPublic"; | |||||
export default { | export default { | ||||
components:{memberPublic}, | |||||
data() { | |||||
return { | |||||
rule:{ | |||||
QrText:"识别会员码", | |||||
manuallyText:'查询手机号', | |||||
manuallyClick:this.goDetails | |||||
} | |||||
} | |||||
components: { memberPublic }, | |||||
data() { | |||||
return { | |||||
rule: { | |||||
QrText: "识别会员码", | |||||
manuallyText: "查询手机号", | |||||
manuallyClick: this.goDetails, | |||||
}, | |||||
}; | |||||
}, | |||||
methods: { | |||||
goBack() { | |||||
this.$router.go(-1); | |||||
}, | }, | ||||
methods: { | |||||
goDetails(){ | |||||
this.$router.push('/chPhone') | |||||
} | |||||
goDetails() { | |||||
this.$router.push("/chPhone"); | |||||
}, | }, | ||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
height: 100%; | |||||
} | } | ||||
</script> | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | |||||
</style> |
@@ -1,5 +1,15 @@ | |||||
<template> | <template> | ||||
<div class="Box"> | <div class="Box"> | ||||
<div class="back-box"> | |||||
<van-icon | |||||
class="back-icon" | |||||
@click="Back" | |||||
size=".6rem" | |||||
name="arrow-left" | |||||
color="#fff" | |||||
/> | |||||
<span>会员赠券</span> | |||||
</div> | |||||
<div class="topBg"></div> | <div class="topBg"></div> | ||||
<div class="textBox"> | <div class="textBox"> | ||||
<div class="chieBox"> | <div class="chieBox"> | ||||
@@ -19,36 +29,45 @@ | |||||
<img src="@/assets/images/jiaoyi.png" alt="" class="noDataImg" /> | <img src="@/assets/images/jiaoyi.png" alt="" class="noDataImg" /> | ||||
<div style="color: #999">暂无可赠送优惠券</div> | <div style="color: #999">暂无可赠送优惠券</div> | ||||
</div> | </div> | ||||
<div | |||||
class="ticketListBox" | |||||
v-for="(item, index) in ticketList" | |||||
:key="index" | |||||
@click="setSign(index)" | |||||
<van-list | |||||
v-model="ListLoading" | |||||
:finished="finished" | |||||
finished-text="没有更多了" | |||||
@load="onLoad" | |||||
style="background-color: #f8f8fa" | |||||
> | > | ||||
<div class="ticketList"> | |||||
<img | |||||
v-if="item.sign" | |||||
src="@/assets/images/selected2.png" | |||||
alt="" | |||||
class="ticketListImg" | |||||
/> | |||||
<div class="nameBox"> | |||||
<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 | |||||
class="ticketListBox" | |||||
v-for="(item, index) in ticketList" | |||||
:key="index" | |||||
@click="setSign(index)" | |||||
> | |||||
<div class="ticketList"> | |||||
<img | |||||
v-if="item.sign" | |||||
src="@/assets/images/selected2.png" | |||||
alt="" | |||||
class="ticketListImg" | |||||
/> | |||||
<div class="nameBox"> | |||||
<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> | </div> | ||||
</div> | </div> | ||||
</div> | |||||
</van-list> | |||||
<div class="confirm" @click="showPopup">确认</div> | <div class="confirm" @click="showPopup">确认</div> | ||||
<van-popup v-model="show" :round="true"> | <van-popup v-model="show" :round="true"> | ||||
@@ -70,21 +89,23 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</van-popup> | </van-popup> | ||||
<add-end text="赠券成功!" @goBack ="control()" v-if="addFalg"></add-end> | |||||
<add-end text="赠券成功!" @goBack="control()" v-if="addFalg"></add-end> | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import Vue from "vue"; | import Vue from "vue"; | ||||
import { Popup, Toast } from "vant"; | import { Popup, Toast } from "vant"; | ||||
import moment from "moment"; | import moment from "moment"; | ||||
import addEnd from "../integral/AddEnd" | |||||
import addEnd from "../integral/AddEnd"; | |||||
Vue.use(Popup, Toast); | Vue.use(Popup, Toast); | ||||
export default { | export default { | ||||
components:{ | |||||
addEnd | |||||
components: { | |||||
addEnd, | |||||
}, | }, | ||||
data() { | data() { | ||||
return { | return { | ||||
ListLoading: false, | |||||
finished: false, | |||||
noData: false, | noData: false, | ||||
show: false, | show: false, | ||||
list: "", | list: "", | ||||
@@ -92,40 +113,51 @@ export default { | |||||
ticketList: [], | ticketList: [], | ||||
pitcnOn: [], //选中的券列表 | pitcnOn: [], //选中的券列表 | ||||
addFalg: false, | addFalg: false, | ||||
pageNum:1, | |||||
}; | }; | ||||
}, | }, | ||||
methods: { | methods: { | ||||
//下拉加载 | |||||
onLoad() { | |||||
this.pageNum += 1; | |||||
this.getTicketList(); | |||||
}, | |||||
// 接收子组件的值 关闭子组件 | // 接收子组件的值 关闭子组件 | ||||
control(data){ | |||||
this.addFalg = data | |||||
this.show = data | |||||
control(data) { | |||||
this.addFalg = data; | |||||
this.show = data; | |||||
}, | |||||
Back() { | |||||
this.$router.go(-1); | |||||
}, | }, | ||||
//提交 | //提交 | ||||
submit() { | 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); | |||||
}) | |||||
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) { | setTiem(temp, format) { | ||||
@@ -143,11 +175,12 @@ export default { | |||||
this.show = true; | this.show = true; | ||||
}, | }, | ||||
getTicketList() { | getTicketList() { | ||||
this.ListLoading = true; | |||||
this.$http | this.$http | ||||
.wxMerchantcouponSend({ | .wxMerchantcouponSend({ | ||||
methods: "get", | methods: "get", | ||||
params: { | params: { | ||||
pageNum: 1, | |||||
pageNum: this.pageNum, | |||||
pageSize: 6, | pageSize: 6, | ||||
sendType: 7, | sendType: 7, | ||||
expired: 0, | expired: 0, | ||||
@@ -157,10 +190,13 @@ export default { | |||||
.then((res) => { | .then((res) => { | ||||
const { code, data, message } = res; | const { code, data, message } = res; | ||||
if (code == 200) { | if (code == 200) { | ||||
this.ListLoading = false; | |||||
data.list.map((res) => { | data.list.map((res) => { | ||||
res.sign = false; | res.sign = false; | ||||
}); | }); | ||||
this.ticketList = data.list; | |||||
this.ticketList.push(...data.list); | |||||
this.finished = data.list.length === 0?true:false; | |||||
} else { | } else { | ||||
Toast(message); | Toast(message); | ||||
} | } | ||||
@@ -202,6 +238,23 @@ export default { | |||||
<style scoped> | <style scoped> | ||||
.Box { | .Box { | ||||
background: #f6f6f6; | background: #f6f6f6; | ||||
height: 100%; | |||||
} | |||||
.back-box { | |||||
left: 0; | |||||
top: 0; | |||||
z-index: 1000; | |||||
width: 100%; | |||||
height: 1.3rem; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
font-size: 0.43rem; | |||||
text-align: center; | |||||
} | |||||
.back-icon { | |||||
float: left; | |||||
margin: 0.4rem 0 0 0.1rem; | |||||
} | } | ||||
.topBg { | .topBg { | ||||
height: 0.8rem; | height: 0.8rem; | ||||
@@ -209,20 +262,23 @@ export default { | |||||
background-size: 100% 0.8rem; | background-size: 100% 0.8rem; | ||||
} | } | ||||
.textBox { | .textBox { | ||||
width: 96; | |||||
margin: 0 2%; | |||||
width: 96%; | |||||
margin: 0.2rem 2%; | |||||
border-radius: 0.2rem; | border-radius: 0.2rem; | ||||
border: 1px solid #eaeaea; | border: 1px solid #eaeaea; | ||||
margin-top: -0.2rem; | margin-top: -0.2rem; | ||||
z-index: 10; | z-index: 10; | ||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | ||||
margin-top: 0.2rem; | |||||
} | } | ||||
.chieBox { | .chieBox { | ||||
overflow: hidden; | overflow: hidden; | ||||
background-color: #fff; | background-color: #fff; | ||||
height: 1.25rem; | |||||
} | } | ||||
.left { | .left { | ||||
float: left; | float: left; | ||||
height: 1.25rem; | |||||
color: #999999; | color: #999999; | ||||
line-height: 1.25rem; | line-height: 1.25rem; | ||||
padding-left: 0.3rem; | padding-left: 0.3rem; | ||||
@@ -230,6 +286,7 @@ export default { | |||||
.right { | .right { | ||||
float: right; | float: right; | ||||
line-height: 1.25rem; | line-height: 1.25rem; | ||||
height: 1.25rem; | |||||
padding-right: 0.3rem; | padding-right: 0.3rem; | ||||
} | } | ||||
@@ -240,11 +297,8 @@ export default { | |||||
text-align: center; | text-align: center; | ||||
background-color: #52a0fd; | background-color: #52a0fd; | ||||
color: #fff; | color: #fff; | ||||
position: fixed; | |||||
bottom: 2rem; | |||||
} | |||||
.noData { | |||||
} | } | ||||
.noDataImg { | .noDataImg { | ||||
width: 2rem; | width: 2rem; | ||||
height: 2rem; | height: 2rem; | ||||