@@ -31,7 +31,8 @@ | |||||
"vant": "^2.10.3", | "vant": "^2.10.3", | ||||
"vue": "^2.6.10", | "vue": "^2.6.10", | ||||
"vue-router": "^3.0.3", | "vue-router": "^3.0.3", | ||||
"vuex": "^3.0.1" | |||||
"vuex": "^3.0.1", | |||||
"moment": "^2.29.1" | |||||
}, | }, | ||||
"devDependencies": { | "devDependencies": { | ||||
"@vue/cli-plugin-babel": "^3.10.0", | "@vue/cli-plugin-babel": "^3.10.0", | ||||
@@ -5,6 +5,21 @@ | |||||
import Vue from 'vue'; | import Vue from 'vue'; | ||||
import Router from 'vue-router'; | import Router from 'vue-router'; | ||||
import marketingClose from "@/views/navigation/accounts/marketingClose" | |||||
import memberCancel from "@/views/navigation/memberCancel" | |||||
import memberGathering from "@/views/navigation/consume/memberGathering" | |||||
import memberIntegral from "@/views/navigation/integral/memberIntegral" | |||||
import memberTicket from "@/views/navigation/ticket/memberTicket" | |||||
import ticketDetails from "@/views/navigation/ticket/ticketDetails" | |||||
import chPhone from "@/views/navigation/ticket/chPhone" | |||||
import details from "@/views/navigation/details" | |||||
import commodity from "@/views/navigation/commodity" | |||||
import accomplish from "@/views/navigation/accomplish" | |||||
import billing from "@/views/navigation/billing" | |||||
import todayConsume from "@/views/navigation/consume/todayConsume" | |||||
import current from "@/views/navigation/consume/current" | |||||
import integralParticulars from "@/views/navigation/integral/integralParticulars" | |||||
import userMessage from "@/views/navigation/integral/userMessage" | |||||
const Login = () => import(/* webpackChunkName: "login" */ '@/views/login'); | const Login = () => import(/* webpackChunkName: "login" */ '@/views/login'); | ||||
const Home = () => import(/* webpackChunkName: "home" */ '@/views/home'); | const Home = () => import(/* webpackChunkName: "home" */ '@/views/home'); | ||||
@@ -80,6 +95,96 @@ const routes = [ | |||||
title: '登陆信息' | title: '登陆信息' | ||||
} | } | ||||
}, | }, | ||||
{ | |||||
path: '/marketingClose',//营销结算 | |||||
name: 'marketingClose', | |||||
component:marketingClose | |||||
}, | |||||
{ | |||||
path: '/memberCancel',//会员核销 | |||||
name: 'memberCancel', | |||||
component:memberCancel | |||||
}, | |||||
{ | |||||
path: '/memberGathering',//消费卡收款 | |||||
name: 'memberGathering', | |||||
component:memberGathering | |||||
}, | |||||
{ | |||||
path: '/memberIntegral',//会员积分integralParticulars | |||||
name: 'memberIntegral', | |||||
component:memberIntegral | |||||
}, | |||||
{ | |||||
path: '/integralParticulars',//会员积分 - 查询详情页 | |||||
name: 'integralParticulars', | |||||
component:integralParticulars | |||||
}, | |||||
{ | |||||
path: '/userMessage',//会员积分 - 查询详情页 -会员详情 | |||||
name: 'userMessage', | |||||
component:userMessage | |||||
}, | |||||
{ | |||||
path: '/memberTicket',//会员赠券 | |||||
name: 'memberTicket', | |||||
component:memberTicket | |||||
}, | |||||
{ | |||||
path: '/chPhone',//会员赠券 - 详情页 | |||||
name: 'chPhone', | |||||
component:chPhone | |||||
}, | |||||
{ | |||||
path: '/ticketDetails',//会员赠券 - 详情页 | |||||
name: 'ticketDetails', | |||||
component:ticketDetails | |||||
}, | |||||
{ | |||||
path: '/details',//手动核销 子页面 | |||||
name: 'details', | |||||
component:details | |||||
}, | |||||
{ | |||||
path: '/commodity',//核销 详情页 | |||||
name: 'commodity', | |||||
component:commodity | |||||
}, | |||||
{ | |||||
path: '/accomplish',//核销 完成返回页面 | |||||
name: 'accomplish', | |||||
component:accomplish | |||||
}, | |||||
{ | |||||
path: '/billing',//核销 账单 | |||||
name: 'billing', | |||||
component:billing | |||||
}, | |||||
{ | |||||
path: '/todayConsume',//消费卡收款 -当日记录 | |||||
name: 'todayConsume', | |||||
component:todayConsume | |||||
}, | |||||
{ | |||||
path: '/current',//消费卡收款 -当日记录 | |||||
name: 'current', | |||||
component:current | |||||
}, | |||||
]; | ]; | ||||
@@ -8,15 +8,15 @@ export const apiUrl = { | |||||
//交易,核销,收银的echarts图表数据 | //交易,核销,收银的echarts图表数据 | ||||
getTabletListOrder: '/api/wxDateAmountRecord/listOrder', | getTabletListOrder: '/api/wxDateAmountRecord/listOrder', | ||||
getTabletListVerify: '/api/wxDateAmountRecord/listVerified', | getTabletListVerify: '/api/wxDateAmountRecord/listVerified', | ||||
getMicroPayAmountOnDate:'/api/wxDateAmountRecord/listMicropay', | |||||
getMicroPayAmountOnDate: '/api/wxDateAmountRecord/listMicropay', | |||||
// 检查用户是否有权限修改收款账户 | // 检查用户是否有权限修改收款账户 | ||||
permitModifiy: "/api/merchant/permitModifiy", | permitModifiy: "/api/merchant/permitModifiy", | ||||
// B端用户详情 | // B端用户详情 | ||||
userDetail: '/api/user/detail', | userDetail: '/api/user/detail', | ||||
//获取积分操作记录 | //获取积分操作记录 | ||||
getCreditList:"/api/credit/list", | |||||
getCreditList: "/api/credit/list", | |||||
//获取会员可赠送的券列表 | //获取会员可赠送的券列表 | ||||
wxMerchantcouponSend:"/api/couponSend/list", | |||||
wxMerchantcouponSend: "/api/couponSend/list", | |||||
// 商户注券记录 | // 商户注券记录 | ||||
wxMerchantcouponStory: "/api/couponSend/actionLog", | wxMerchantcouponStory: "/api/couponSend/actionLog", | ||||
@@ -25,5 +25,11 @@ export const apiUrl = { | |||||
// mock | // mock | ||||
qryPageConfig: '/test/pageConfig', | qryPageConfig: '/test/pageConfig', | ||||
msg: '/index/securityPolicy' | |||||
msg: '/index/securityPolicy', | |||||
// 查询券详情 | |||||
ticketDetails: '/api/couponOrder/detail', | |||||
// 券核销 | |||||
cancel: "/api/couponOrder/verify", | |||||
// 已被核销的券包 | |||||
couponOrderListVerified: '/api/couponOrder/listVerified', | |||||
} | } |
@@ -32,7 +32,7 @@ const instance = axios.create({ | |||||
instance.interceptors.request.use( | instance.interceptors.request.use( | ||||
function(config) { | function(config) { | ||||
config.headers.bid = store.state.token; | config.headers.bid = store.state.token; | ||||
config.headers.token = store.state.token; | |||||
// config.headers.token = store.state.token; | |||||
// 在发送请求之前做处理... | // 在发送请求之前做处理... | ||||
config.headers = Object.assign( | config.headers = Object.assign( | ||||
config.method === "post" | config.method === "post" | ||||
@@ -8,7 +8,16 @@ | |||||
<p>富茂服务商</p> | <p>富茂服务商</p> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="writeOff "> | |||||
<div class="classification " > | |||||
<div v-for="(item,index) in classIfyList" :key="index" class="category" @click="toWriteoff(item.path)"> | |||||
<div hover-class="active" :style="`background:${item.bg}`" > | |||||
<i :class="item.icon"></i> | |||||
</div> | |||||
<span>{{item.text}}</span> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<!-- --> | <!-- --> | ||||
<div class="line-item-box"> | <div class="line-item-box"> | ||||
<!-- 111 --> | <!-- 111 --> | ||||
@@ -67,6 +76,38 @@ export default { | |||||
showJiaoyi: true, | showJiaoyi: true, | ||||
showHexiao: true, | showHexiao: true, | ||||
showShouyin: true, | showShouyin: true, | ||||
classIfyList: [ | |||||
{ | |||||
text: "会员核销", | |||||
icon: "iconfont icon-hexiao", | |||||
id: 0, | |||||
path:"/memberCancel" | |||||
}, | |||||
{ | |||||
text: "消费卡收款", | |||||
icon: "iconfont icon-shouye1", | |||||
id: 1, | |||||
path:"/memberGathering" | |||||
}, | |||||
{ | |||||
text: "会员积分", | |||||
icon: "iconfont icon-jifen", | |||||
id: 4, | |||||
path:"/memberIntegral" | |||||
}, | |||||
{ | |||||
text: "会员赠券", | |||||
icon: "iconfont icon-quan", | |||||
id: 5, | |||||
path:"/memberTicket" | |||||
}, | |||||
{ | |||||
text: "营销结算", | |||||
icon: "iconfont icon-jiesuan", | |||||
id: 6, | |||||
path:"/marketingClose" | |||||
}, | |||||
], | |||||
}; | }; | ||||
}, | }, | ||||
mounted() { | mounted() { | ||||
@@ -76,6 +117,9 @@ export default { | |||||
}, | }, | ||||
methods: { | methods: { | ||||
toWriteoff(path){ | |||||
this.$router.push(path) | |||||
}, | |||||
/** | /** | ||||
* 交易记录 | * 交易记录 | ||||
*/ | */ | ||||
@@ -358,6 +402,29 @@ export default { | |||||
background: #f8f8fa; | background: #f8f8fa; | ||||
margin-bottom: 1.6rem; | margin-bottom: 1.6rem; | ||||
} | } | ||||
.writeOff { | |||||
width: 100%; | |||||
margin-top: 0.1rem; | |||||
} | |||||
.classification { | |||||
position: relative; | |||||
width: 93%; | |||||
height: 3.7rem; | |||||
background: #fff; | |||||
border-radius: .15rem; | |||||
margin: .3rem auto; | |||||
z-index: 1000; | |||||
width: 9.5rem; | |||||
margin: 0 auto; | |||||
display: flex; | |||||
flex-wrap: wrap; | |||||
} | |||||
.category{ | |||||
border: 0.01rem #eee solid; | |||||
padding: 0.2rem; | |||||
width: 25%; | |||||
} | |||||
.header-wrap { | .header-wrap { | ||||
width: 100%; | width: 100%; | ||||
height: 4rem; | height: 4rem; | ||||
@@ -444,4 +511,5 @@ export default { | |||||
height: 4rem; | height: 4rem; | ||||
margin-top: .2rem; | margin-top: .2rem; | ||||
} | } | ||||
</style> | </style> |
@@ -57,14 +57,14 @@ export default { | |||||
data: { | data: { | ||||
phone: val.userName, | phone: val.userName, | ||||
password: val.password, | password: val.password, | ||||
appId: "wxa2c60cdeef4ec602", | |||||
appId: "wx9ff823abeef23b94", | |||||
// latitude: 34.51685, | // latitude: 34.51685, | ||||
// longitude: 110.89456, | // longitude: 110.89456, | ||||
} | } | ||||
}).then(res => { | }).then(res => { | ||||
console.log(res) | console.log(res) | ||||
if (res.code === 200) { | if (res.code === 200) { | ||||
// this.doLogin(res) | |||||
this.doLogin(res) | |||||
this.$router.push({ | this.$router.push({ | ||||
path: '/home' | path: '/home' | ||||
}) | }) | ||||
@@ -0,0 +1,63 @@ | |||||
<template> | |||||
<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> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
methods: { | |||||
lookBilling(){ | |||||
this.$router.push('/billing') | |||||
} | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.succeed { | |||||
width: 3.5rem; | |||||
height: 3.5rem; | |||||
background-color: #52a0fd; | |||||
border-radius: 50%; | |||||
margin-top: 1rem; | |||||
margin-left: auto; | |||||
margin-right: auto; | |||||
font-size: 3rem; | |||||
color: #f5f5f5; | |||||
} | |||||
.succeed_img { | |||||
margin: 0.3rem 0; | |||||
} | |||||
.text { | |||||
font-size: 0.5rem; | |||||
margin-top: 0.3rem; | |||||
} | |||||
.check { | |||||
width: 80%; | |||||
line-height: 1.3rem; | |||||
border: 0.01rem #52a0fd solid; | |||||
border-radius: 0.1rem; | |||||
color: #52a0fd ; | |||||
margin: 3% auto; | |||||
margin-top: 4rem; | |||||
font-size: 0.36rem; | |||||
} | |||||
.active{ | |||||
width: 80%; | |||||
line-height: 1.3rem; | |||||
background: #52a0fd; | |||||
color: #fff; | |||||
margin: 3% auto; | |||||
font-size: 0.36rem; | |||||
border-radius: 0.1rem; | |||||
margin-top: 0.5rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,329 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="navigation"> | |||||
<div | |||||
class="navigation_box" | |||||
v-for="(item, index) in navigation" | |||||
:key="index" | |||||
@click="switchover(index)" | |||||
> | |||||
<div :class="navigationIndex == index ? 'activity' : 'title'"> | |||||
{{ item.name }} | |||||
</div> | |||||
<img | |||||
src="@/assets/images/arrow.png" | |||||
alt="" | |||||
:class="navigationIndex == index ? 'activity_img' : 'title_img'" | |||||
/> | |||||
</div> | |||||
</div> | |||||
<div class="status1_Box" v-if="navigationIndex == 0"> | |||||
<div class="status_1" v-for="item in 4"> | |||||
<div class="numBox"> | |||||
<div class="numBox_left">468663580839145472</div> | |||||
<div class="numBox_right">2020-09-23 16:28:35</div> | |||||
</div> | |||||
<div class="accountBox numBox"> | |||||
<div class="numBox_left">卡消费 自主结算</div> | |||||
<div class="numBox_right" style="color: rgba(255, 106, 106, 1)"> | |||||
应收:400 | |||||
</div> | |||||
</div> | |||||
<div class="backStatus_1">已结算</div> | |||||
</div> | |||||
</div> | |||||
<div class="status2_Box" v-if="navigationIndex == 1"> | |||||
<div class="beginDate" @click="beginDateShow = !beginDateShow"> | |||||
{{ beginDateText }} | |||||
</div> | |||||
<div class="beginText">至</div> | |||||
<div class="beginDate endDate" @click="endDateShow = !endDateShow"> | |||||
{{ endDateText }} | |||||
</div> | |||||
<div class="dateCha">查询</div> | |||||
</div> | |||||
<div class="status3_Box" v-if="navigationIndex == 2"> | |||||
<div :class="status3_index==1?'status3_activity': 'my'" @click="status3_index=1">自主结算</div> | |||||
<div :class="status3_index==2?'status3_activity':'wx'" @click="status3_index=2">微信分账</div> | |||||
</div> | |||||
<div class="status4_Box status3_Box" v-if="navigationIndex == 3"> | |||||
<div :class="status4_index==1?'status3_activity': 'my'" @click="status4_index=1">未结算</div> | |||||
<div :class="status4_index==2?'status3_activity':'wx'" @click="status4_index=2">已结算</div> | |||||
</div> | |||||
<div class="status5_Box status3_Box" v-if="navigationIndex == 4"> | |||||
<div :class="status5_index==1?'status3_activity': 'my'" @click="status5_index=1">未结算</div> | |||||
<div :class="status5_index==2?'status3_activity':'wx'" @click="status5_index=2">已结算</div> | |||||
<div :class="status5_index==3?'status3_activity': 'my'" @click="status5_index=3">未结算</div> | |||||
<div :class="status5_index==4?'status3_activity':'wx'" @click="status5_index=4">已结算</div> | |||||
<div :class="status5_index==5?'status3_activity': 'my'" @click="status5_index=5">未结算</div> | |||||
<div :class="status5_index==6?'status3_activity':'wx'" @click="status5_index=6">已结算</div> | |||||
</div> | |||||
<!-- <div class="noData">暂无数据!</div> --> | |||||
<div class="bott_sum"> | |||||
<div class="text">总计应收</div> | |||||
<div class="sum_num">¥800.00</div> | |||||
</div> | |||||
<van-popup v-model="beginDateShow" position="bottom"> | |||||
<van-datetime-picker | |||||
v-model="deyText" | |||||
type="date" | |||||
title="选择年月日" | |||||
:min-date="minDate" | |||||
:max-date="maxDate" | |||||
@cancel="beginDateShow = !beginDateShow" | |||||
@confirm="setBeginDate" | |||||
/> | |||||
</van-popup> | |||||
<van-popup v-model="endDateShow" position="bottom"> | |||||
<van-datetime-picker | |||||
v-model="deyText" | |||||
type="date" | |||||
title="选择年月日" | |||||
:min-date="endminDate" | |||||
:max-date="endmaxDate" | |||||
@cancel="endDateShow = !endDateShow" | |||||
@confirm="setEndDate" | |||||
/> | |||||
</van-popup> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import { formatDate } from "@/utils/cloud-utils"; | |||||
import Vue from "vue"; | |||||
import { Popup, DatetimePicker } from "vant"; | |||||
Vue.use(DatetimePicker, Popup); | |||||
export default { | |||||
data() { | |||||
return { | |||||
navigation: [ | |||||
{ | |||||
name: "全部", | |||||
}, | |||||
{ | |||||
name: "日期", | |||||
}, | |||||
{ | |||||
name: "类型", | |||||
}, | |||||
{ | |||||
name: "状态", | |||||
}, | |||||
{ | |||||
name: "来源", | |||||
}, | |||||
], | |||||
navigationIndex: 0, | |||||
beginDateShow: false, | |||||
endDateShow: false, | |||||
minDate: new Date(2015, 0, 1), | |||||
maxDate: new Date(2025, 10, 1), | |||||
endminDate: new Date(2015, 0, 1), | |||||
endmaxDate: new Date(2025, 10, 1), | |||||
beginDateText: "开始时间", | |||||
endDateText: "结束时间", | |||||
deyText: new Date(), | |||||
status3_index: 0, | |||||
status4_index:0, | |||||
status5_index:0 | |||||
}; | |||||
}, | |||||
methods: { | |||||
switchover(index) { | |||||
this.navigationIndex = index; | |||||
}, | |||||
setBeginDate(value) { | |||||
this.beginDateText = formatDate(value, "yyyy-MM-dd"); | |||||
this.beginDateShow = !this.beginDateShow; | |||||
console.log(formatDate(value, "yyyy-MM-dd")); | |||||
}, | |||||
setEndDate(value) { | |||||
this.endDateText = formatDate(value, "yyyy-MM-dd"); | |||||
this.endDateShow = !this.endDateShow; | |||||
console.log(formatDate(value, "yyyy-MM-dd")); | |||||
}, | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.navigation { | |||||
overflow: hidden; | |||||
border-bottom: 0.01rem solid #eee; | |||||
background-color: #fff; | |||||
} | |||||
.navigation_box { | |||||
width: 20%; | |||||
float: left; | |||||
overflow: hidden; | |||||
} | |||||
.title_img { | |||||
width: 0.4rem; | |||||
height: 0.2rem; | |||||
float: left; | |||||
margin: 0.5rem 0 0 0.1rem; | |||||
} | |||||
.title { | |||||
line-height: 1.3rem; | |||||
float: left; | |||||
margin-left: 0.2rem; | |||||
} | |||||
.activity { | |||||
line-height: 1.3rem; | |||||
float: left; | |||||
margin-left: 0.2rem; | |||||
color: #52a0fd; | |||||
} | |||||
.activity_img { | |||||
width: 0.4rem; | |||||
height: 0.2rem; | |||||
float: left; | |||||
margin: 0.5rem 0 0 0.1rem; | |||||
transform: rotateX(180deg); | |||||
} | |||||
.status_1 { | |||||
position: relative; | |||||
width: 96%; | |||||
margin: 0 2%; | |||||
height: 2rem; | |||||
background-color: #ffffff; | |||||
border-radius: 0.2rem; | |||||
box-shadow: 0 0.16rem 0.53333rem 0 rgba(0, 0, 0, 0.15); | |||||
margin-top: 0.5rem; | |||||
} | |||||
.numBox { | |||||
overflow: hidden; | |||||
} | |||||
.numBox_left { | |||||
float: left; | |||||
padding: 0.3rem 0.3rem; | |||||
font-size: 0.24rem; | |||||
color: rgba(125, 125, 125, 1); | |||||
} | |||||
.numBox_right { | |||||
float: right; | |||||
padding: 0.3rem 0.3rem; | |||||
color: rgba(125, 125, 125, 1); | |||||
font-size: 0.36rem; | |||||
} | |||||
.backStatus_1 { | |||||
line-height: 0.6rem; | |||||
position: absolute; | |||||
top: 0.5rem; | |||||
left: 3.5rem; | |||||
transform: rotate(-30deg); | |||||
border: 0.01rem solid #ff6a6a; | |||||
border-radius: 0.1rem; | |||||
padding: 0.1rem 0.3rem; | |||||
color: #ff6a6a; | |||||
} | |||||
.backStatus_2 { | |||||
line-height: 0.6rem; | |||||
position: absolute; | |||||
top: 0.5rem; | |||||
left: 3.5rem; | |||||
transform: rotate(-30deg); | |||||
border: 0.01rem solid #659ef6; | |||||
border-radius: 0.1rem; | |||||
padding: 0.1rem 0.3rem; | |||||
color: #659ef6; | |||||
} | |||||
.bott_sum { | |||||
position: fixed; | |||||
line-height: 1.5rem; | |||||
width: 100%; | |||||
bottom: 0; | |||||
left: 0; | |||||
background: #fff; | |||||
z-index: 1000; | |||||
overflow: hidden; | |||||
box-shadow: 1rpx -5rpx 11rpx rgb(202, 201, 201); | |||||
} | |||||
.text { | |||||
float: left; | |||||
padding: 0.3rem 0.3rem; | |||||
} | |||||
.sum_num { | |||||
padding: 0.3rem 0.3rem; | |||||
float: right; | |||||
color: #ff6a6a; | |||||
} | |||||
.status2_Box { | |||||
color: #888; | |||||
overflow: hidden; | |||||
} | |||||
.beginDate { | |||||
float: left; | |||||
line-height: 1rem; | |||||
border-bottom: 0.01rem solid #eee; | |||||
padding: 0.2rem 0.5rem; | |||||
margin-left: 0.2rem; | |||||
} | |||||
.beginText { | |||||
line-height: 1rem; | |||||
padding: 0.2rem 0.2rem; | |||||
float: left; | |||||
} | |||||
.dateCha { | |||||
width: 2rem; | |||||
float: left; | |||||
line-height: 0.5rem; | |||||
padding: 0.2rem 0.5rem; | |||||
margin-left: 0.2rem; | |||||
background-color: #659ef6; | |||||
color: #fff; | |||||
border-radius: 0.2rem; | |||||
margin-left: 0.5rem; | |||||
margin-top: 0.3rem; | |||||
} | |||||
.noData { | |||||
margin-top: 0.6rem; | |||||
} | |||||
.status3_Box { | |||||
color: #888; | |||||
overflow: hidden; | |||||
} | |||||
.my { | |||||
width: 28%; | |||||
float: left; | |||||
line-height: 1rem; | |||||
padding: 0 0.5rem; | |||||
border: 1px solid rgba(234, 234, 234, 1); | |||||
border-radius: 0.1rem; | |||||
margin-top: 0.5rem; | |||||
margin-left: 0.35rem; | |||||
} | |||||
.wx { | |||||
width: 28%; | |||||
float: left; | |||||
float: left; | |||||
line-height: 1rem; | |||||
padding: 0 0.5rem; | |||||
border: 1px solid rgba(234, 234, 234, 1); | |||||
border-radius: 0.1rem; | |||||
margin-top: 0.5rem; | |||||
margin-left: 0.35rem; | |||||
} | |||||
.status3_activity { | |||||
width: 28%; | |||||
float: left; | |||||
float: left; | |||||
line-height: 1rem; | |||||
padding: 0 0.5rem; | |||||
border: 1px solid #659ef6; | |||||
border-radius: 0.1rem; | |||||
margin-top: 0.5rem; | |||||
margin-left: 0.35rem; | |||||
color: #659ef6; | |||||
} | |||||
</style> |
@@ -0,0 +1,164 @@ | |||||
<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="bul_Box"> | |||||
<div class="left">券状态</div> | |||||
<div class="right" style="color:#52A0FD!important">已核销</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">券名称</div> | |||||
<div class="right" style="color: #b8b8b8;" >护肤品通用券(B端)</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">券码</div> | |||||
<div class="right" style="color: #b8b8b8;" >470088618483941376</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">核销时间</div> | |||||
<div class="right" style="color: #b8b8b8;" >2020-09-27 15:26:09</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">购买用户</div> | |||||
<div class="right" style="color: #b8b8b8;" >18872592633</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">核销员</div> | |||||
<div class="right" style="color: #b8b8b8;" >周思琦</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">券面额</div> | |||||
<div class="right" style="color: #b8b8b8;" >0.01元</div> | |||||
</div> | |||||
<div class="bul_Box"> | |||||
<div class="left">券售价</div> | |||||
<div class="right" style="color: #b8b8b8;" >0元</div> | |||||
</div> | |||||
</div> | |||||
<div class="calendar" @click="show = !show"> | |||||
<img src="@/assets/images/calendar.png" alt="" class="calendar_img"> | |||||
</div> | |||||
<van-calendar | |||||
v-model="show" | |||||
color="#52a0fd" | |||||
:min-date="minDate" | |||||
:max-date="maxDate" | |||||
@confirm="onConfirm" | |||||
/> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import { formatDate } from "@/utils/cloud-utils"; | |||||
import Vue from "vue"; | |||||
import { Calendar,Toast } from "vant"; | |||||
Vue.use(Calendar).use(Toast); | |||||
export default { | |||||
data() { | |||||
return { | |||||
thenDate: "", | |||||
show: false, | |||||
minDate: new Date(2015, 0, 1), | |||||
maxDate: new Date(2025, 0, 1), | |||||
pageNum:1, | |||||
pageSize:10, | |||||
pitchTiem:'', | |||||
list:[], | |||||
}; | |||||
}, | |||||
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{ | |||||
Toast(message); | |||||
return; | |||||
} | |||||
}).catch(res=>{ | |||||
Toast(res); | |||||
}) | |||||
}, | |||||
}, | |||||
mounted() { | |||||
this.thenDate = formatDate(new Date(), "yyyy-MM-dd"); | |||||
this.pitchTiem = this.thenDate | |||||
this.getLsit() | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
#Box { | |||||
width: 100%; | |||||
background-color: #f8f8fa; | |||||
} | |||||
.topImgBox { | |||||
position: fixed; | |||||
top: -1.4rem; | |||||
left: 0; | |||||
width: 100%; | |||||
overflow: hidden; | |||||
height: 2.5rem; | |||||
background-image: url("../../assets/images/bannerbg.png"); | |||||
background-size: 100% 2.5rem; | |||||
text-align: center; | |||||
color: #ffffff; | |||||
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; | |||||
} | |||||
.bul_Box{ | |||||
overflow: hidden; | |||||
} | |||||
.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; | |||||
} | |||||
.calendar{ | |||||
width: 2rem; | |||||
height: 2rem; | |||||
background-color: #52a0fd; | |||||
position: fixed; | |||||
border-radius: 50%; | |||||
bottom: 2rem; | |||||
margin-left:40% ; | |||||
} | |||||
.calendar_img{ | |||||
margin: 0.5rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,186 @@ | |||||
<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> | |||||
<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> | |||||
</template> | |||||
<script> | |||||
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); | |||||
}) | |||||
}, | |||||
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; | |||||
} | |||||
</style> |
@@ -0,0 +1,213 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="backBox"> | |||||
<div class="timeBox"> | |||||
<div class="timeBox_left"> | |||||
<div style="color: #999; padding-bottom: 0.5rem">开始时间</div> | |||||
<div @click="startTiemShow=!startTiemShow">{{startTiem}}</div> | |||||
</div> | |||||
<div class="timeBox_centre" style="color: #999">至</div> | |||||
<div class="timeBox_right"> | |||||
<div style="color: #999; padding-bottom: 0.5rem">结束时间</div> | |||||
<div @click="endTiemShow =!endTiemShow">{{endTiem}}</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<div class="inquire">查询</div> | |||||
<div class="acounts"> | |||||
<div class="title">收款总计(元)</div> | |||||
<div class="num">0.2</div> | |||||
<div class="title1">1笔</div> | |||||
<div class="billBox"> | |||||
<div class="billBox_left"> | |||||
<div>已到账(元)</div> | |||||
<div style="color: #333; font-weight: bold; padding-bottom: 0.5rem"> | |||||
0.2 | |||||
</div> | |||||
</div> | |||||
<div class="billBox_right"> | |||||
<div>未到账(元)</div> | |||||
<div | |||||
style="color: #ff6a6a; font-weight: bold; padding-bottom: 0.5rem" | |||||
> | |||||
0 | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<div class="content"> | |||||
<div class="content_left"> | |||||
<div class="content_left_text">2020-09-28 09:47:53</div> | |||||
</div> | |||||
<div class="content_rigth"> | |||||
<div class="price">¥100</div> | |||||
<div style="color: red">实收 ¥0.2</div> | |||||
</div> | |||||
</div> | |||||
<div class="noData">暂无数据</div> | |||||
<van-calendar | |||||
v-model="startTiemShow" | |||||
color="#52a0fd" | |||||
:min-date="startMinDate" | |||||
:max-date="startMaxDate" | |||||
@confirm="onConfirm1" | |||||
/> | |||||
<van-calendar | |||||
v-model="endTiemShow" | |||||
color="#52a0fd" | |||||
:min-date="endMinDate" | |||||
:max-date="endMaxDate" | |||||
@confirm="onConfirm2" | |||||
/> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import { formatDate } from "@/utils/cloud-utils"; | |||||
import Vue from "vue"; | |||||
import { Calendar } from "vant"; | |||||
Vue.use(Calendar); | |||||
export default { | |||||
data() { | |||||
return { | |||||
startTiemShow: 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), | |||||
}; | |||||
}, | |||||
methods: { | |||||
onConfirm1(date){ | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd") | |||||
this.startTiem = tmepTime | |||||
this.startTiemShow = false | |||||
console.log(this.startTiem ,"????"); | |||||
}, | |||||
onConfirm2(date){ | |||||
const tmepTime = formatDate(new Date(date), "yyyy-MM-dd") | |||||
this.endTiem = tmepTime | |||||
this.endTiemShow = false | |||||
console.log(this.endTiem ,"????"); | |||||
} | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.timeBox { | |||||
overflow: hidden; | |||||
} | |||||
.backBox { | |||||
width: 90%; | |||||
margin: 0 5%; | |||||
height: 3rem; | |||||
background-image: url("../../../assets/images/reviveimg.png"); | |||||
background-size: 9rem 3rem; | |||||
background-repeat: no-repeat; | |||||
border-radius: 0.3rem 0.3rem 0 0; | |||||
overflow: hidden; | |||||
} | |||||
.timeBox_left { | |||||
width: 40%; | |||||
float: left; | |||||
padding-top: 1rem; | |||||
} | |||||
.timeBox_centre { | |||||
width: 20%; | |||||
float: left; | |||||
padding-top: 1.5rem; | |||||
} | |||||
.timeBox_right { | |||||
width: 40%; | |||||
float: right; | |||||
padding-top: 1rem; | |||||
} | |||||
.inquire { | |||||
width: 90%; | |||||
margin: 0 5%; | |||||
line-height: 1rem; | |||||
text-align: center; | |||||
background-color: #52a0fd; | |||||
color: #fff; | |||||
border-radius: 0 0 0.3rem 0.3rem; | |||||
} | |||||
.acounts { | |||||
width: 90%; | |||||
margin: 0 5%; | |||||
border: 0.01rem #52a0fd solid; | |||||
border-radius: 0.3rem; | |||||
margin-top: 0.5rem; | |||||
background-color: #fff; | |||||
} | |||||
.title { | |||||
margin-top: 0.3rem; | |||||
line-height: 1rem; | |||||
text-align: center; | |||||
color: rgba(153, 153, 153, 1); | |||||
} | |||||
.title1 { | |||||
width: 80%; | |||||
line-height: 1rem; | |||||
text-align: center; | |||||
color: rgba(153, 153, 153, 1); | |||||
border-bottom: #e3f0ff 0.01rem solid; | |||||
margin: 0 10%; | |||||
} | |||||
.num { | |||||
font-size: 0.84rem; | |||||
font-size: #000; | |||||
line-height: 2rem; | |||||
text-align: center; | |||||
} | |||||
.billBox { | |||||
margin-top: 0.5rem; | |||||
overflow: hidden; | |||||
} | |||||
.billBox_left { | |||||
width: 50%; | |||||
float: left; | |||||
line-height: 0.8rem; | |||||
color: #999; | |||||
} | |||||
.billBox_right { | |||||
width: 50%; | |||||
float: right; | |||||
line-height: 0.8rem; | |||||
color: #999; | |||||
} | |||||
.content { | |||||
overflow: hidden; | |||||
background-color: #fff; | |||||
margin-top: 0.5rem; | |||||
} | |||||
.content_left { | |||||
width: 50%; | |||||
float: left; | |||||
} | |||||
.content_rigth { | |||||
width: 50%; | |||||
float: right; | |||||
text-indent: 1.2rem; | |||||
} | |||||
.price { | |||||
margin-top: 0.5rem; | |||||
margin-bottom: 0.05rem; | |||||
} | |||||
.content_left_text { | |||||
margin-top: 1rem; | |||||
padding: 0.3rem 0; | |||||
color: #999; | |||||
} | |||||
.noData{ | |||||
line-height: 2rem; | |||||
text-align: center; | |||||
} | |||||
</style> |
@@ -0,0 +1,58 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="RqBox"> | |||||
<div class="text">扫描二维码向我付款</div> | |||||
<div class="Rq"></div> | |||||
</div> | |||||
<div class="record" @click="goToday">收款记录</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
methods: { | |||||
goToday(){ | |||||
this.$router.push('/todayConsume') | |||||
} | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background-color: #52a0fd; | |||||
overflow: hidden; | |||||
height: 100vh; | |||||
} | |||||
.RqBox { | |||||
width: 94%; | |||||
height: 10.5rem; | |||||
margin: 0 3%; | |||||
background-color: #ffffff; | |||||
border-radius: 0.3rem; | |||||
} | |||||
.text { | |||||
font-size: 0.42rem; | |||||
text-align: center; | |||||
font-family: PingFang-SC-Medium; | |||||
font-weight: 500; | |||||
padding-top: 1.4rem; | |||||
color: rgba(51, 51, 51, 1); | |||||
} | |||||
.Rq{ | |||||
background-color: bisque; | |||||
width: 6rem; | |||||
height: 5rem; | |||||
margin: 1rem auto; | |||||
} | |||||
.record{ | |||||
width: 94%; | |||||
margin: 0 3%; | |||||
background-color: #ffffff; | |||||
border-radius: 0.2rem; | |||||
color: #52a0fd; | |||||
text-align: center; | |||||
font-size: 0.42rem; | |||||
margin-top: 0.5rem; | |||||
line-height: 1rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,122 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="topbox"> | |||||
<div class="title">今日收款总额(元)</div> | |||||
<div class="num">0.2</div> | |||||
<div class="piece">1 笔</div> | |||||
<div class="intOne"> | |||||
<div class="left"> | |||||
<div class="text1">已到账(元)</div> | |||||
<div class="text" style="color: #fff; font-weight: bold">5</div> | |||||
</div> | |||||
<div class="right"> | |||||
<div class="text1">未到账(元)</div> | |||||
<div class="text" style="color: #fff; font-weight: bold">6</div> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
<div class="clearfix"> | |||||
<div class="clearfix_left">2020-9-28</div> | |||||
<div class="clearfix_right" @click="goCurrent">按日期查询</div> | |||||
</div> | |||||
<div class="contents"> | |||||
<div class="contents_left">2020-09-28 09:47:53</div> | |||||
<div class="contents_right"> | |||||
<div style="color: #000;line-height: 1rem;">¥120</div> | |||||
<div>实收 ¥0.2</div> | |||||
</div> | |||||
</div> | |||||
<div class="noData">暂无数据</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
methods: { | |||||
goCurrent(){ | |||||
this.$router.push('/current') | |||||
} | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
overflow: hidden; | |||||
font-size: 0.42rem; | |||||
} | |||||
.topbox { | |||||
background-color: #52a0fd; | |||||
color: rgba(255, 255, 255, 1); | |||||
} | |||||
.title { | |||||
text-align: center; | |||||
line-height: 1rem; | |||||
} | |||||
.num { | |||||
font-size: 0.86rem; | |||||
text-align: center; | |||||
line-height: 2rem; | |||||
} | |||||
.piece { | |||||
border-bottom: 0.01rem solid rgba(255, 255, 255, 1); | |||||
line-height: 1rem; | |||||
text-align: center; | |||||
} | |||||
.intOne { | |||||
overflow: hidden; | |||||
} | |||||
.left { | |||||
width: 50%; | |||||
float: left; | |||||
} | |||||
.right { | |||||
width: 50%; | |||||
float: right; | |||||
} | |||||
.text { | |||||
line-height: 1.2rem; | |||||
} | |||||
.text1 { | |||||
padding-top: 0.6rem; | |||||
} | |||||
.clearfix { | |||||
padding: 0 0.6rem; | |||||
line-height: 1rem; | |||||
background: #f6f6f6; | |||||
overflow: hidden; | |||||
font-size: 0.42rem; | |||||
font-family: PingFang-SC-Medium; | |||||
font-weight: 500; | |||||
color: rgba(153, 153, 153, 1); | |||||
} | |||||
.clearfix_left { | |||||
float: left; | |||||
} | |||||
.clearfix_right { | |||||
float: right; | |||||
color: #52a0fd; | |||||
} | |||||
.contents { | |||||
padding: 0 0.6rem; | |||||
overflow: hidden; | |||||
font-size: 0.42rem; | |||||
font-family: PingFang-SC-Medium; | |||||
font-weight: 500; | |||||
border-bottom: 0.01rem solid #f6f6f6; | |||||
color: rgba(153, 153, 153, 1); | |||||
padding-top: 0.5rem; | |||||
} | |||||
.contents_left { | |||||
float: left; | |||||
line-height: 1rem; | |||||
} | |||||
.contents_right { | |||||
float: right; | |||||
line-height: 0.8rem; | |||||
padding-bottom: 0.5rem; | |||||
} | |||||
.noData{ | |||||
line-height: 2rem; | |||||
text-align: center; | |||||
} | |||||
</style> |
@@ -0,0 +1,124 @@ | |||||
<template> | |||||
<div class="box"> | |||||
<div class="case"> | |||||
<div class="text">券码</div> | |||||
<span class="line"></span> | |||||
<input | |||||
type="text" | |||||
v-model="codeText" | |||||
class="inp" | |||||
placeholder="请输入券码" | |||||
/> | |||||
<div class="search" @click="search"> | |||||
<img class="searchImg" src="@/assets/images/search.png" alt="" /> | |||||
</div> | |||||
</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import { Toast } from "vant"; | |||||
Vue.use(Toast); | |||||
export default { | |||||
data() { | |||||
return { | |||||
codeText: "", | |||||
list: {}, | |||||
}; | |||||
}, | |||||
methods: { | |||||
search() { | |||||
if (this.codeText == "" || this.codeText.length == 0) { | |||||
Toast("券码不能为空"); | |||||
return; | |||||
} else { | |||||
this.$http | |||||
.ticketDetails({ | |||||
method: "get", | |||||
params: { | |||||
couponOrderId: this.codeText, | |||||
}, | |||||
}) | |||||
.then((res) => { | |||||
const { code, data, message } = res; | |||||
if (code == 200) { | |||||
console.log(data); | |||||
this.$router.push({ | |||||
path: "/commodity", | |||||
query: { | |||||
ticket: JSON.stringify(data), | |||||
}, | |||||
}); | |||||
} else { | |||||
Toast(message); | |||||
return; | |||||
} | |||||
}) | |||||
.catch((res) => { | |||||
Toast(res); | |||||
}); | |||||
} | |||||
//查询卷吗 | |||||
}, | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.box { | |||||
overflow: hidden; | |||||
} | |||||
.case { | |||||
width: 96%; | |||||
margin: 30% 2%; | |||||
height: 2.1rem; | |||||
border-radius: 0.2rem; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
overflow: hidden; | |||||
} | |||||
.text { | |||||
float: left; | |||||
line-height: 2.1rem; | |||||
margin-left: 0.3rem; | |||||
padding-right: 0.3rem; | |||||
} | |||||
.line { | |||||
background: #ccc; | |||||
width: 0.01rem; | |||||
float: left; | |||||
height: 0.9rem; | |||||
margin-top: 0.6rem; | |||||
} | |||||
.inp { | |||||
float: left; | |||||
width: 50%; | |||||
height: 0.8rem; | |||||
margin: 0.6rem 0.3rem; | |||||
color: #bfbfbf; | |||||
font-size: 0.4rem; | |||||
padding: 0.5rem 0; | |||||
} | |||||
input::-webkit-input-placeholder { | |||||
/*WebKit browsers*/ | |||||
color: #bfbfbf; | |||||
} | |||||
.search { | |||||
float: right; | |||||
width: 1.5rem; | |||||
height: 1.5rem; | |||||
background-color: #52a0fd; | |||||
border-radius: 50%; | |||||
margin-right: 0.6rem; | |||||
margin-top: 0.3rem; | |||||
} | |||||
.searchImg { | |||||
width: 70%; | |||||
height: 70%; | |||||
margin: 15%; | |||||
} | |||||
</style> | |||||
@@ -0,0 +1,74 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="inquireBox"> | |||||
<div class="text">手机号</div> | |||||
<input type="text" class="phone" placeholder="请输入" v-model="phone"/> | |||||
</div> | |||||
<div class="but" @click="goUserMessage">提交</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
data() { | |||||
return { | |||||
phone:'', | |||||
} | |||||
}, | |||||
methods: { | |||||
goUserMessage(){ | |||||
this.$router.push('/userMessage') | |||||
} | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.inquireBox { | |||||
width: 96%; | |||||
margin: 0 2%; | |||||
height: 2rem; | |||||
background-color: #ffffff; | |||||
border-radius: 0.2rem; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
margin-top: 0.5rem; | |||||
} | |||||
.text { | |||||
float: left; | |||||
margin-left: 0.3rem; | |||||
line-height: 2rem; | |||||
} | |||||
.phone { | |||||
float: right; | |||||
width: 6rem; | |||||
line-height: 1.26rem; | |||||
font-size: 0.3rem; | |||||
text-align: right; | |||||
margin-top: 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; | |||||
} | |||||
.consumption_num{ | |||||
float: right; | |||||
width: 6rem; | |||||
line-height: 1.26rem; | |||||
font-size: 0.3rem; | |||||
text-align: right; | |||||
margin-top: 0.3rem; | |||||
margin-right: 0.3rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,26 @@ | |||||
<template> | |||||
<div> | |||||
<member-public :data="rule"/> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import memberPublic from '../memberPublic' | |||||
export default { | |||||
components:{memberPublic}, | |||||
data() { | |||||
return { | |||||
rule:{ | |||||
QrText:"识别会员码", | |||||
manuallyText:'查询手机号', | |||||
manuallyClick:this.goDetails | |||||
} | |||||
} | |||||
}, | |||||
methods: { | |||||
goDetails(){ | |||||
this.$router.push('/integralParticulars') | |||||
} | |||||
}, | |||||
} | |||||
</script> |
@@ -0,0 +1,139 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="topBg"></div> | |||||
<div class="textBox"> | |||||
<div class="chieBox"> | |||||
<div class="left">会员姓名(昵称):</div> | |||||
<div class="right">乐</div> | |||||
</div> | |||||
<div class="chieBox"> | |||||
<div class="left">会员等级:</div> | |||||
<div class="right">普通会员</div> | |||||
</div> | |||||
<div class="chieBox"> | |||||
<div class="left">手机号码:</div> | |||||
<div class="right">17671632874</div> | |||||
</div> | |||||
</div> | |||||
<div class="add" v-show="!addFalg" @click="addFalg=!addFalg">新增积分</div> | |||||
<div class="consumption" v-show="addFalg"> | |||||
<div class="text">消费金额</div> | |||||
<div class="consumption_text">元</div> | |||||
<input | |||||
type="text" | |||||
class="consumption_num" | |||||
placeholder="请输入" | |||||
v-model="consumption" | |||||
/> | |||||
</div> | |||||
<div class="integral" v-show="addFalg" >123</div> | |||||
<div class="submit" v-show="addFalg">提交</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
data() { | |||||
return { | |||||
phone: "", | |||||
consumption: "", | |||||
addFalg:false | |||||
}; | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.topBg { | |||||
height: 0.8rem; | |||||
background-image: url("../../../assets/images/bannerbg.png"); | |||||
background-size: 100% 0.8rem; | |||||
} | |||||
.textBox { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
border-radius: 0.2rem; | |||||
border: 1px solid #eaeaea; | |||||
margin-top: -0.2rem; | |||||
z-index: 10; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
} | |||||
.chieBox { | |||||
overflow: hidden; | |||||
background-color: #fff; | |||||
} | |||||
.left { | |||||
float: left; | |||||
color: #999999; | |||||
line-height: 1.25rem; | |||||
padding-left: 0.3rem; | |||||
} | |||||
.right { | |||||
float: right; | |||||
line-height: 1.25rem; | |||||
padding-right: 0.3rem; | |||||
} | |||||
.add { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
border-radius: 0.3rem; | |||||
background-color: #52a0fd; | |||||
box-shadow: 0px 10px 22px 2px rgba(82, 160, 253, 0.51); | |||||
line-height: 1.75rem; | |||||
text-align: center; | |||||
color: #fff; | |||||
margin-top: 2rem; | |||||
} | |||||
.consumption { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
background-color: #ffffff; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
border-radius: 0.2rem; | |||||
overflow: hidden; | |||||
margin-top: 0.5rem; | |||||
} | |||||
.consumption_num { | |||||
height: 2rem; | |||||
float: right; | |||||
text-align: right; | |||||
margin-right: 0.1rem; | |||||
display: block; | |||||
} | |||||
.consumption_text { | |||||
line-height: 2rem; | |||||
color: #000; | |||||
float: right; | |||||
margin-right: 0.5rem; | |||||
} | |||||
.text { | |||||
float: left; | |||||
margin-left: 0.3rem; | |||||
line-height: 2rem; | |||||
} | |||||
.integral { | |||||
width: 95%; | |||||
margin: 1rem 0 1rem 0; | |||||
text-align: right; | |||||
color: red; | |||||
} | |||||
.integral::before { | |||||
content: "本次积分"; | |||||
color: #000; | |||||
} | |||||
.submit { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
border-radius: 0.3rem; | |||||
background-color: #52a0fd; | |||||
box-shadow: 0px 10px 22px 2px rgba(82, 160, 253, 0.51); | |||||
line-height: 1.5rem; | |||||
text-align: center; | |||||
color: #fff; | |||||
margin-top: 1rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,31 @@ | |||||
<template> | |||||
<div> | |||||
<member-public :data="rule"/> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import memberPublic from './memberPublic' | |||||
import http from '../../services/request' | |||||
export default { | |||||
components:{memberPublic}, | |||||
data() { | |||||
return { | |||||
rule:{ | |||||
QrText:"扫码核销、识别会员码", | |||||
manuallyText:'手动核销', | |||||
manuallyClick:this.goDetails, | |||||
} | |||||
} | |||||
}, | |||||
methods: { | |||||
goDetails(){ | |||||
this.$router.push('/details') | |||||
} | |||||
}, | |||||
mounted() { | |||||
}, | |||||
} | |||||
</script> |
@@ -0,0 +1,58 @@ | |||||
<template> | |||||
<div class="box"> | |||||
<div class="content"> | |||||
<img class="backimg" src="@/assets/images/scan.png" alt="" /> | |||||
<button class="btn1" hover-class="active" bindtap="gotoSaoyiSao"> | |||||
{{data.QrText}} | |||||
</button> | |||||
<button class="btn2" hover-class="active" bindtap="aoto" @click="data.manuallyClick">{{data.manuallyText}}</button> | |||||
</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
props:['data'] | |||||
} | |||||
</script> | |||||
<style scoped> | |||||
.box { | |||||
background: #52a0fd; | |||||
height: 100vh; | |||||
} | |||||
.content { | |||||
width: 90%; | |||||
margin: 0 5%; | |||||
height: 12rem; | |||||
background-color: #ffffff; | |||||
border-radius: 0.1rem; | |||||
} | |||||
.backimg { | |||||
width: 90%; | |||||
margin-top: 0.1rem; | |||||
margin-left: 5%; | |||||
margin-right: 5%; | |||||
} | |||||
.btn1 { | |||||
width: 70%; | |||||
margin: 5% 15%; | |||||
background:rgba(255,255,255,1); | |||||
background-color: #52a0fd; | |||||
font-size: 0.5rem; | |||||
border-radius: 0.5rem; | |||||
padding: 0.2rem 0; | |||||
color: rgba(255,255,255,1); | |||||
} | |||||
.btn2{ | |||||
width: 70%; | |||||
margin: 5% 15%; | |||||
color:rgba(81,160,252,1); | |||||
background:rgba(255,255,255,1); | |||||
font-size: 0.5rem; | |||||
border-radius: 0.5rem; | |||||
padding: 0.2rem 0; | |||||
border:1px solid rgba(180,212,249,1); | |||||
} | |||||
</style> |
@@ -0,0 +1,74 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="inquireBox"> | |||||
<div class="text">手机号</div> | |||||
<input type="text" class="phone" placeholder="请输入" v-model="phone"/> | |||||
</div> | |||||
<div class="but" @click="goUserMessage">提交</div> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
export default { | |||||
data() { | |||||
return { | |||||
phone:'', | |||||
} | |||||
}, | |||||
methods: { | |||||
goUserMessage(){ | |||||
this.$router.push('/ticketDetails') | |||||
} | |||||
}, | |||||
} | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.inquireBox { | |||||
width: 96%; | |||||
margin: 0 2%; | |||||
height: 2rem; | |||||
background-color: #ffffff; | |||||
border-radius: 0.2rem; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
margin-top: 0.5rem; | |||||
} | |||||
.text { | |||||
float: left; | |||||
margin-left: 0.3rem; | |||||
line-height: 2rem; | |||||
} | |||||
.phone { | |||||
float: right; | |||||
width: 6rem; | |||||
line-height: 1.26rem; | |||||
font-size: 0.3rem; | |||||
text-align: right; | |||||
margin-top: 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; | |||||
} | |||||
.consumption_num{ | |||||
float: right; | |||||
width: 6rem; | |||||
line-height: 1.26rem; | |||||
font-size: 0.3rem; | |||||
text-align: right; | |||||
margin-top: 0.3rem; | |||||
margin-right: 0.3rem; | |||||
} | |||||
</style> |
@@ -0,0 +1,26 @@ | |||||
<template> | |||||
<div> | |||||
<member-public :data="rule"/> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import memberPublic from '../memberPublic' | |||||
export default { | |||||
components:{memberPublic}, | |||||
data() { | |||||
return { | |||||
rule:{ | |||||
QrText:"识别会员码", | |||||
manuallyText:'查询手机号', | |||||
manuallyClick:this.goDetails | |||||
} | |||||
} | |||||
}, | |||||
methods: { | |||||
goDetails(){ | |||||
this.$router.push('/chPhone') | |||||
} | |||||
}, | |||||
} | |||||
</script> |
@@ -0,0 +1,226 @@ | |||||
<template> | |||||
<div class="Box"> | |||||
<div class="topBg"></div> | |||||
<div class="textBox"> | |||||
<div class="chieBox"> | |||||
<div class="left">会员姓名(昵称):</div> | |||||
<div class="right">乐</div> | |||||
</div> | |||||
<div class="chieBox"> | |||||
<div class="left">会员等级:</div> | |||||
<div class="right">普通会员</div> | |||||
</div> | |||||
<div class="chieBox"> | |||||
<div class="left">手机号码:</div> | |||||
<div class="right">17671632874</div> | |||||
</div> | |||||
</div> | |||||
<div class="noData" v-show="noData"> | |||||
<img src="@/assets/images/jiaoyi.png" alt="" class="noDataImg" /> | |||||
<div style="color: #999">暂无可赠送优惠券</div> | |||||
</div> | |||||
<div class="ticketListBox"> | |||||
<div class="ticketList"> | |||||
<img src="@/assets/images/selected2.png" alt="" class="ticketListImg" /> | |||||
<div class="nameBox"> | |||||
<div class="nameBox_left">蛋糕通用券</div> | |||||
<div class="nameBox_right">库存:9</div> | |||||
</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"> | |||||
<div class="title">会员赠券</div> | |||||
<div class="text_box"> | |||||
<div class="constant">会员:未绑定</div> | |||||
<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> | |||||
</div> | |||||
<div class="operation"> | |||||
<div class="bnt1" @click="show=!show">确认</div> | |||||
<div class="bnt2">取消</div> | |||||
</div> | |||||
</div> | |||||
</van-popup> | |||||
</div> | |||||
</template> | |||||
<script> | |||||
import Vue from "vue"; | |||||
import { Popup } from "vant"; | |||||
Vue.use(Popup); | |||||
export default { | |||||
data() { | |||||
return { | |||||
noData: false, | |||||
show: false, | |||||
}; | |||||
}, | |||||
methods: { | |||||
showPopup() { | |||||
console.log( this.show ,666); | |||||
this.show = true; | |||||
}, | |||||
}, | |||||
}; | |||||
</script> | |||||
<style scoped> | |||||
.Box { | |||||
background: #f6f6f6; | |||||
} | |||||
.topBg { | |||||
height: 0.8rem; | |||||
background-image: url("../../../assets/images/bannerbg.png"); | |||||
background-size: 100% 0.8rem; | |||||
} | |||||
.textBox { | |||||
width: 96; | |||||
margin: 0 2%; | |||||
border-radius: 0.2rem; | |||||
border: 1px solid #eaeaea; | |||||
margin-top: -0.2rem; | |||||
z-index: 10; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.15); | |||||
} | |||||
.chieBox { | |||||
overflow: hidden; | |||||
background-color: #fff; | |||||
} | |||||
.left { | |||||
float: left; | |||||
color: #999999; | |||||
line-height: 1.25rem; | |||||
padding-left: 0.3rem; | |||||
} | |||||
.right { | |||||
float: right; | |||||
line-height: 1.25rem; | |||||
padding-right: 0.3rem; | |||||
} | |||||
.confirm { | |||||
width: 100%; | |||||
border-radius: 0.2rem; | |||||
line-height: 1.3rem; | |||||
text-align: center; | |||||
background-color: #52a0fd; | |||||
color: #fff; | |||||
position: fixed; | |||||
bottom: 2rem; | |||||
} | |||||
.noData { | |||||
} | |||||
.noDataImg { | |||||
width: 2rem; | |||||
height: 2rem; | |||||
margin-top: 2rem; | |||||
margin-bottom: 0.3rem; | |||||
} | |||||
.ticketList { | |||||
position: relative; | |||||
width: 96%; | |||||
margin: 0 2%; | |||||
height: 2rem; | |||||
background-color: #ffffff; | |||||
border-radius: 0.2rem; | |||||
box-shadow: 0 0.16rem 0.53333rem 0 rgba(0, 0, 0, 0.15); | |||||
margin-top: 0.5rem; | |||||
} | |||||
.ticketListImg { | |||||
width: 0.8rem; | |||||
height: 0.8rem; | |||||
position: absolute; | |||||
top: 0; | |||||
right: 0; | |||||
} | |||||
.nameBox { | |||||
overflow: hidden; | |||||
} | |||||
.nameBox_left { | |||||
float: left; | |||||
padding-left: 0.5rem; | |||||
padding-top: 0.5rem; | |||||
} | |||||
.nameBox_right { | |||||
float: right; | |||||
padding-right: 0.5rem; | |||||
padding-top: 0.5rem; | |||||
} | |||||
.validity { | |||||
color: #999999; | |||||
text-align: left; | |||||
padding-left: 0.5rem; | |||||
padding-top: 0.3rem; | |||||
} | |||||
.popupBox { | |||||
width: 8rem; | |||||
border-radius: 0.4rem; | |||||
} | |||||
.title { | |||||
padding: 0.5rem 0; | |||||
} | |||||
.text_box { | |||||
overflow: hidden; | |||||
} | |||||
.constant { | |||||
text-align: left; | |||||
padding: 0.3rem 0.6rem; | |||||
} | |||||
.ticket_Box { | |||||
overflow: scroll; | |||||
height: 4.5rem; | |||||
} | |||||
.discounts { | |||||
color: #fff; | |||||
background-color: #52a0fd; | |||||
border-radius: 0.3rem; | |||||
box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.3); | |||||
width: 90%; | |||||
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; | |||||
} | |||||
</style> |
@@ -20,7 +20,7 @@ module.exports = { | |||||
} | } | ||||
}, | }, | ||||
'/fumao': { | '/fumao': { | ||||
target: 'https://b.malls.iformall.com/B', | |||||
target: 'https://btest.malls.iformall.com/B', | |||||
changeOrigin: true, | changeOrigin: true, | ||||
pathRewrite: { | pathRewrite: { | ||||
'^/fumao': '' | '^/fumao': '' | ||||