zmt
3 years ago
23 changed files with 1683 additions and 168 deletions
-
10src/js/api.js
-
8src/js/once_name.js
-
30src/pages.json
-
25src/pages/employee/manage/manage.vue
-
4src/pages/employee/review_list/review_list.vue
-
2src/pages/index/index.vue
-
480src/pages/site/manage/manage.vue
-
284src/pages/write_off/mall/confirm/confirm.vue
-
237src/pages/write_off/mall/list/list.vue
-
150src/pages/write_off/mall/success/success.vue
-
108src/pages/write_off/menu/menu.vue
-
362src/pages/write_off/number_of_people/number_of_people.vue
-
111src/pages/write_off/operate/operate.vue
-
4src/pages/write_off/search_result/search_result.vue
-
BINsrc/static/images/countdown_bg.png
-
BINsrc/static/images/icon/choose.png
-
BINsrc/static/images/write_off/mall.png
-
BINsrc/static/images/write_off/order.png
-
BINsrc/static/images/write_off/people.png
-
BINsrc/static/images/write_off/site.png
-
24src/store/index.js
-
3src/subpackage/device/components/order/reservation_site_detail/reservation_site_detail.vue
-
7src/subpackage/device/pages/switch_manage/switch_manage.vue
@ -0,0 +1,284 @@ |
|||
<template> |
|||
<view class="mall-ls-confirm"> |
|||
<!-- 20211228 pm 说写死 --> |
|||
<view class="mlc-status">{{ '待发货' }}</view> |
|||
<view class="mlc-main"> |
|||
<view class="mm-top mm-box"> |
|||
<view class="mt-line"> |
|||
<view>下单时间</view> |
|||
<view>{{ orderInfo.success_time || '-' }}</view> |
|||
</view> |
|||
<view class="mt-line"> |
|||
<view>订单编号</view> |
|||
<view>{{ orderInfo.order_no || '-' }}</view> |
|||
<view @click="copyBtn(orderInfo.order_no || '-')">复制</view> |
|||
</view> |
|||
</view> |
|||
<view class="mm-user-info mm-box"> |
|||
<view class="mm-tit">收货人信息</view> |
|||
<view class="mui-info"> |
|||
<view class="mi-line">配送方式：{{ sendMethod }}</view> |
|||
<view class="mi-line">{{ pickupInfo.name || '-' }} {{ pickupInfo.phone || '-' }}</view> |
|||
<view class="mi-line">{{ pickupInfo.store_name || '-' }}</view> |
|||
<view class="mi-addr">{{ pickupInfo.store_addr || '-' }}</view> |
|||
</view> |
|||
<view class="mui-code">取货码：{{ pickupInfo.gcode || '-' }}</view> |
|||
</view> |
|||
<view class="mm-goods" v-if="goodsLs.length"> |
|||
<view class="mm-tit">商品信息</view> |
|||
<view class="mg-ls"> |
|||
<view class="ml-item" v-for="(e, i) in goodsLs" :key="i"> |
|||
<image mode="aspectFill" :src="e.product_imgs || ''"></image> |
|||
<view class="mi-info"> |
|||
<view class="mi-name">{{ e.product_name || '-' }}</view> |
|||
<view class="mi-spec"> |
|||
<view>{{ getSpecTxt(e) }}</view> |
|||
<view>×{{ e.product_nums || 0 }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="mlc-fixd-btn" @click="confirmBtn">确认核销</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../../utils/util'; |
|||
import { API } from '../../../../js/api'; |
|||
import { servers } from '../../../../js/server'; |
|||
import { WRITE_OFF_MALL_ORDER_INFO, WRITE_OFF_MALL_ORDER_SUCCESS } from '../../../../js/once_name'; |
|||
import { mapState } from 'vuex'; |
|||
export default { |
|||
computed: { |
|||
goodsLs(){ |
|||
let { orderInfo } = this; |
|||
if(!orderInfo || !orderInfo.product_order_goods || !orderInfo.product_order_goods.length)return []; |
|||
return orderInfo.product_order_goods || []; |
|||
}, |
|||
setStatusTxt() { |
|||
let { orderInfo } = this; |
|||
if(!orderInfo || orderInfo.pay_status == undefined)return '-'; |
|||
// 0待付款 1待发货 2待收货 3待评价 4交易完成 5订单关闭 6退款中 7退款完成 8退款失败 |
|||
let statusArr = ['待付款', '待发货', '待收货', '交易完成', '交易完成', '订单关闭', '退款中', '退款完成', '退款关闭']; |
|||
return statusArr[orderInfo.pay_status] || '-'; |
|||
}, |
|||
sendMethod(){ |
|||
let { orderInfo } = this; |
|||
if(!orderInfo)return '-'; |
|||
if(orderInfo.product_order_self_pickup == 1)return '自提'; |
|||
if(orderInfo.product_order_self_pickup == 0)return '快递'; |
|||
return '-' |
|||
}, |
|||
pickupInfo(){ |
|||
let { orderInfo } = this; |
|||
if(!orderInfo || !orderInfo.product_order_self_pickup_info)return {}; |
|||
return orderInfo.product_order_self_pickup_info |
|||
}, |
|||
}, |
|||
data(){ |
|||
return { |
|||
orderInfo: { |
|||
product_order_self_pickup_info: {} |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
console.warn(options) |
|||
util.$_once(WRITE_OFF_MALL_ORDER_INFO, data => { |
|||
console.warn(data) |
|||
this.orderInfo = data || { }; |
|||
}) |
|||
}, |
|||
methods: { |
|||
confirmBtn: util.debounce(function(){ |
|||
let { orderInfo, pickupInfo } = this; |
|||
util.showLoad(); |
|||
servers.post({ |
|||
url: API.writeOff.shop2WriteoffSet, |
|||
data: { |
|||
vcode: pickupInfo.gcode, |
|||
brand_id: orderInfo.brand_id, |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
if(res.data.code == 0){ |
|||
let _ls = res.data.data || []; |
|||
util.$_emit(WRITE_OFF_MALL_ORDER_SUCCESS, _ls); |
|||
util.routeTo(`/pages/write_off/mall/success/success`, 'rT') |
|||
}else{ |
|||
util.showNone(res.data.message || '操作失败！') |
|||
} |
|||
}) |
|||
.catch(util.hideLoad) |
|||
}, 200, true), |
|||
copyBtn(data){ |
|||
uni.setClipboardData({ data }); |
|||
}, |
|||
getSpecTxt(e){ |
|||
if( |
|||
e.product_spec_multi == 1&& |
|||
e.product_spec_multi_info&& |
|||
e.product_spec_multi_info.spec_info&& |
|||
e.product_spec_multi_info.spec_info.length){ |
|||
let specStr = (e.product_spec_multi_info.spec_info).join("；") |
|||
return specStr; |
|||
} |
|||
return '-'; |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.mall-ls-confirm{ |
|||
padding-bottom: 132upx; |
|||
padding-bottom: calc( 132upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
padding-bottom: calc( 132upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
} |
|||
.mlc-status{ |
|||
padding: 0 44upx; |
|||
height: 106upx; |
|||
line-height: 106upx; |
|||
font-size: 36upx; |
|||
color: #fff; |
|||
font-weight: 500; |
|||
background-color: $themeColor; |
|||
} |
|||
.mlc-main{ |
|||
padding: 24upx; |
|||
.mm-box{ |
|||
margin-bottom: 24upx; |
|||
padding: 30upx 28upx; |
|||
background-color: #fff; |
|||
border-radius: 10upx; |
|||
} |
|||
.mm-tit{ |
|||
padding-bottom: 20upx; |
|||
line-height: 44upx; |
|||
font-weight: 500; |
|||
font-size: 28upx; |
|||
color: #333; |
|||
border-bottom: 2upx solid #F2F2F7; |
|||
} |
|||
.mm-top{ |
|||
.mt-line{ |
|||
@include centerFlex(flex-start); |
|||
>view{ |
|||
font-size: 28upx; |
|||
line-height: 60upx; |
|||
color: #333; |
|||
&:first-child{ |
|||
margin-right: 60upx; |
|||
flex-shrink: 0; |
|||
flex-grow: 0; |
|||
color: #9A9A9D; |
|||
} |
|||
&:nth-child(2){ |
|||
@include textHide(1); |
|||
} |
|||
&:nth-child(3){ |
|||
margin-left: 30upx; |
|||
flex-shrink: 0; |
|||
color: $themeColor; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.mm-user-info{ |
|||
.mui-info{ |
|||
padding: 20upx 0; |
|||
border-bottom: 2upx solid #F2F2F7; |
|||
.mi-line{ |
|||
margin-bottom: 14upx; |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
color: #333; |
|||
@include textHide(1); |
|||
} |
|||
.mi-addr{ |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
color: #9C9C9F; |
|||
} |
|||
} |
|||
.mui-code{ |
|||
padding-top: 30upx; |
|||
font-weight: 500; |
|||
font-size: 32upx; |
|||
color: #333; |
|||
} |
|||
} |
|||
.mm-goods{ |
|||
padding: 22upx 28upx 0; |
|||
border-radius: 10upx; |
|||
background-color: #fff; |
|||
.mg-ls{ |
|||
.ml-item{ |
|||
padding: 30upx 0upx; |
|||
@include centerFlex(space-between); |
|||
&:not(:last-child){ |
|||
border-bottom: 2upx solid #F2F2F7; |
|||
} |
|||
>image{ |
|||
flex-shrink: 0; |
|||
margin-right: 20upx; |
|||
width: 180upx; |
|||
height: 180upx; |
|||
border-radius: 10upx; |
|||
} |
|||
.mi-info{ |
|||
flex-grow: 1; |
|||
.mi-name{ |
|||
width: 330upx; |
|||
margin-bottom: 12upx; |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
min-height: 80upx; |
|||
color: #333; |
|||
@include textHide(2); |
|||
} |
|||
.mi-spec{ |
|||
width: 100%; |
|||
@include centerFlex(space-between); |
|||
>view{ |
|||
font-size: 24upx; |
|||
line-height: 34upx; |
|||
color: #9A9A9D; |
|||
@include textHide(1); |
|||
&:first-child{ |
|||
flex-grow: 1; |
|||
} |
|||
&+view{ |
|||
flex-shrink: 0; |
|||
margin-left: 20upx; |
|||
max-width: 30%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.mlc-fixd-btn{ |
|||
position: fixed; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
bottom: 10upx; |
|||
bottom: calc( 10upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
bottom: calc( 10upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
width: 622upx; |
|||
height: 112upx; |
|||
line-height: 112upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
border-radius: 10upx; |
|||
color: #fff; |
|||
background-color: $themeColor; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,237 @@ |
|||
<template> |
|||
<view class="mall-order-ls"> |
|||
<view class="mol-date"> |
|||
<view class="md-txt">核销日期</view> |
|||
<view class="md-picker"> |
|||
<picker mode="date" @change="stChange"> |
|||
<view> |
|||
<input :value="startTime" disabled placeholder="请选择时间" /> |
|||
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|||
</view> |
|||
</picker> |
|||
</view> |
|||
<view class="md-txt">至</view> |
|||
<view class="md-picker"> |
|||
<picker mode="date" @change="edChange"> |
|||
<view> |
|||
<input :value="endTime" disabled placeholder="请选择时间" /> |
|||
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|||
</view> |
|||
</picker> |
|||
</view> |
|||
</view> |
|||
<view class="mol-list"> |
|||
<view class="ml-item" v-for="(e, i) in writeOffList" :key="i"> |
|||
<view class="mi-order-no"> |
|||
<view class="mon-num">订单编号：{{ e.product_order_no || '-' }}</view> |
|||
<view class="mon-btn" @click="copyBtn(e.product_order_no || '-')">复制</view> |
|||
</view> |
|||
<view class="mi-info"> |
|||
<view class="mi-line">取货码：{{ e.product_order_no || '-' }}</view> |
|||
<view class="mi-line">取货人：{{ e.product_order_self_pickup_info.name || '-' }} {{ e.product_order_self_pickup_info.phone || '-' }}</view> |
|||
<view class="mi-line">商品：{{ e.product_order_goods.join('；') }}</view> |
|||
<view class="mi-line">核验人：{{ e.optuname }}</view> |
|||
<view class="mi-line">取货时间：{{ e.created_at || '-' }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="mol-fixed"> |
|||
<view @click="toOperate">核销订单</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { API } from '../../../../js/api'; |
|||
import { servers } from '../../../../js/server'; |
|||
import util from '../../../../utils/util'; |
|||
import { mapState } from 'vuex'; |
|||
import { WRITE_OFF_STORE_NAME } from '../../../../js/once_name'; |
|||
export default { |
|||
computed: { |
|||
...mapState([ 'brandInfo' ]), |
|||
|
|||
}, |
|||
data(){ |
|||
return { |
|||
writeOffList: [], |
|||
page: 1, |
|||
startTime: '', |
|||
endTime: '', |
|||
|
|||
} |
|||
}, |
|||
onReachBottom(){ |
|||
let { brandInfo, startTime, endTime, page } = this; |
|||
this.getList({ |
|||
brand_id: brandInfo.brand.id, |
|||
stime: startTime || '', |
|||
etime: endTime || '', |
|||
page: ++page |
|||
}) |
|||
}, |
|||
onLoad(){ |
|||
// 默认显示1个月内的日期 |
|||
let _startDate = util.formatDate({ |
|||
date: new Date().getTime() - 30*24*60*60*1000 |
|||
}).substr(0, 10); |
|||
let _endDate = util.formatDate({ }).substr(0, 10); |
|||
this.startTime = _startDate; |
|||
this.endTime = _endDate; |
|||
// 默认显示1个月内的日期 |
|||
|
|||
this.$nextTick(_=> this.refreshPage()); |
|||
}, |
|||
methods: { |
|||
refreshPage(){ |
|||
let { brandInfo, startTime, endTime } = this; |
|||
this.page = 1; |
|||
this.writeOffList = []; |
|||
this.$nextTick(_=>{ |
|||
this.getList({ |
|||
brand_id: brandInfo.brand.id, |
|||
stime: startTime || '', |
|||
etime: endTime || '', |
|||
}) |
|||
}) |
|||
}, |
|||
copyBtn(data){ |
|||
uni.setClipboardData({ data }) |
|||
}, |
|||
stChange(e){ |
|||
console.warn(e) |
|||
this.startTime = e.detail.value; |
|||
this.$nextTick(_=>this.refreshPage()); |
|||
}, |
|||
edChange(e){ |
|||
this.endTime = e.detail.value; |
|||
this.$nextTick(_=>this.refreshPage()); |
|||
}, |
|||
toOperate(){ |
|||
util.$_emit(WRITE_OFF_STORE_NAME, null); |
|||
util.routeTo(`/pages/write_off/operate/operate?type=mall`, 'nT'); |
|||
}, |
|||
getList({ brand_id, page = 1, page_size = 15, stime = '', etime = '' }){ |
|||
util.showLoad(); |
|||
servers.get({ |
|||
url: API.writeOff.shop2WriteoffList, |
|||
data: { brand_id, page, page_size, stime, etime }, |
|||
failMsg: '加载失败！', |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
this.totalNum = res.total || 0; |
|||
let _list = res.list || []; |
|||
if(page == 1)return this.writeOffList = _list; |
|||
if(!_list.length)return util.showNone('没有更多！'); |
|||
this.page = page; |
|||
this.writeOffList = [...this.writeOffList, ..._list]; |
|||
|
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.mall-order-ls{ |
|||
padding-bottom: 122upx; |
|||
padding-bottom: calc( 122upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
padding-bottom: calc( 122upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
} |
|||
.mol-date{ |
|||
padding: 0 28upx; |
|||
height: 148upx; |
|||
background-color: #fff; |
|||
@include centerFlex(flex-start); |
|||
.md-txt{ |
|||
font-size: 32upx; |
|||
line-height: 44upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.md-picker{ |
|||
margin: 0 20upx; |
|||
width: 226upx; |
|||
border: 2upx solid #D8D8D8; |
|||
border-radius: 10upx; |
|||
overflow: hidden; |
|||
view{ |
|||
padding: 0 10upx; |
|||
height: 88upx; |
|||
background-color: #f2f2f7; |
|||
@include centerFlex(space-between); |
|||
>input{ |
|||
flex-grow: 1; |
|||
height: 100%; |
|||
font-size: 28upx; |
|||
color: #1a1a1a; |
|||
} |
|||
>image{ |
|||
margin-left: 10upx; |
|||
flex-shrink: 0; |
|||
width: 22upx; |
|||
height: 22upx; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.mol-list{ |
|||
padding: 24upx; |
|||
.ml-item{ |
|||
margin-bottom: 24upx; |
|||
padding: 0 24upx; |
|||
background-color: #fff; |
|||
.mi-order-no{ |
|||
padding: 30upx 4upx; |
|||
border-bottom: 2upx solid #f2f2f7; |
|||
@include centerFlex(space-between); |
|||
.mon-num{ |
|||
font-size: 28upx; |
|||
font-weight: 500; |
|||
line-height: 40upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.mon-btn{ |
|||
flex-shrink: 0; |
|||
margin-left: 20upx; |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
color: $themeColor; |
|||
|
|||
} |
|||
} |
|||
.mi-info{ |
|||
padding: 30upx 4upx; |
|||
.mi-line{ |
|||
font-size: 28upx; |
|||
line-height: 52upx; |
|||
color: #9C9C9F; |
|||
@include textHide(1); |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.mol-fixed{ |
|||
position: fixed; |
|||
left: 0; |
|||
bottom: 0; |
|||
width: 100%; |
|||
background-color: #fff; |
|||
padding: 10upx 40upx; |
|||
padding-bottom: calc( 10upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
padding-bottom: calc( 10upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
>view{ |
|||
height: 112upx; |
|||
line-height: 112upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
color: #fff; |
|||
background-color: $themeColor; |
|||
border-radius: 10upx; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,150 @@ |
|||
<template> |
|||
<view class="confirm-success"> |
|||
<view class="cs-tip"> |
|||
<image mode="aspectFit" src="/static/images/icon/success_tip.png"></image> |
|||
<view>核销成功</view> |
|||
</view> |
|||
<view class="cs-goods"> |
|||
<view class="cg-tit">请将以下商品取给客户</view> |
|||
<view class="mm-goods"> |
|||
<view class="mm-tit">商品信息</view> |
|||
<view class="mg-ls"> |
|||
<view class="ml-item" v-for="(e, i) in orderList" :key="i"> |
|||
<image mode="aspectFill" :src="e.imgs || ''"></image> |
|||
<view class="mi-info"> |
|||
<view class="mi-name">{{ e.name || '-' }}</view> |
|||
<view class="mi-spec"> |
|||
<view>{{ e.spec || '-' }}</view> |
|||
<view>×{{ e.nums || 0 }}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="mlc-fixd-btn" @click="backBtn">返回继续核销</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { WRITE_OFF_MALL_ORDER_SUCCESS } from '../../../../js/once_name' |
|||
import util from '../../../../utils/util' |
|||
export default { |
|||
data(){ |
|||
return { |
|||
orderList: [] |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
util.$_once(WRITE_OFF_MALL_ORDER_SUCCESS, list=>{ |
|||
this.orderList = list || []; |
|||
}) |
|||
}, |
|||
methods: { |
|||
backBtn(){ |
|||
util.routeTo(); |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.confirm-success{ |
|||
padding-bottom: 132upx; |
|||
padding-bottom: calc( 132upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
padding-bottom: calc( 132upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
} |
|||
.cs-tip{ |
|||
padding: 84upx 0upx 104upx; |
|||
>image{ |
|||
display: block; |
|||
margin: 0 auto 46upx; |
|||
width: 100upx; |
|||
height: 100upx; |
|||
} |
|||
>view{ |
|||
text-align: center; |
|||
line-height: 66upx; |
|||
font-size: 48upx; |
|||
font-weight: 500; |
|||
color: #333; |
|||
} |
|||
} |
|||
.cs-goods{ |
|||
padding: 0 24upx; |
|||
.cg-tit{ |
|||
margin-bottom: 20upx; |
|||
font-weight: 500; |
|||
font-size: 32upx; |
|||
line-height: 44upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.mm-goods{ |
|||
padding: 22upx 28upx 0; |
|||
border-radius: 10upx; |
|||
background-color: #fff; |
|||
.mg-ls{ |
|||
.ml-item{ |
|||
padding: 30upx 0upx; |
|||
@include centerFlex(space-between); |
|||
&:not(:last-child){ |
|||
border-bottom: 2upx solid #F2F2F7; |
|||
} |
|||
>image{ |
|||
flex-shrink: 0; |
|||
margin-right: 20upx; |
|||
width: 180upx; |
|||
height: 180upx; |
|||
border-radius: 10upx; |
|||
} |
|||
.mi-info{ |
|||
flex-grow: 1; |
|||
.mi-name{ |
|||
width: 330upx; |
|||
margin-bottom: 12upx; |
|||
font-size: 28upx; |
|||
line-height: 40upx; |
|||
color: #333; |
|||
@include textHide(2); |
|||
} |
|||
.mi-spec{ |
|||
width: 100%; |
|||
@include centerFlex(space-between); |
|||
>view{ |
|||
font-size: 24upx; |
|||
line-height: 34upx; |
|||
color: #9A9A9D; |
|||
@include textHide(1); |
|||
&:first-child{ |
|||
flex-grow: 1; |
|||
} |
|||
&+view{ |
|||
flex-shrink: 0; |
|||
margin-left: 20upx; |
|||
max-width: 30%; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
.mlc-fixd-btn{ |
|||
position: fixed; |
|||
left: 50%; |
|||
transform: translateX(-50%); |
|||
bottom: 10upx; |
|||
bottom: calc( 10upx + constant(safe-area-inset-bottom)); /* 兼容 iOS < 11.2 */ |
|||
bottom: calc( 10upx + env(safe-area-inset-bottom)); /* 兼容 iOS >= 11.2 */ |
|||
width: 622upx; |
|||
height: 112upx; |
|||
line-height: 112upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
border-radius: 10upx; |
|||
color: #fff; |
|||
background-color: $themeColor; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,108 @@ |
|||
<template> |
|||
<view class="write-off-menu"> |
|||
<view class="wom-section"> |
|||
<view class="ws-tit">场地订单核销</view> |
|||
<view class="ws-ls"> |
|||
<view class="wl-item" @click="toOperate('site')"> |
|||
<image mode="aspectFit" src="/static/images/write_off/site.png"></image> |
|||
<view>场地订单核销</view> |
|||
</view> |
|||
<view class="wl-item" @click="toSiteList"> |
|||
<image mode="aspectFit" src="/static/images/write_off/order.png"></image> |
|||
<view>场地订单核销记录</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="wom-section"> |
|||
<view class="ws-tit">商城订单核销</view> |
|||
<view class="ws-ls"> |
|||
<view class="wl-item" @click="toOperate('mall')"> |
|||
<image mode="aspectFit" src="/static/images/write_off/mall.png"></image> |
|||
<view>商城订单核销</view> |
|||
</view> |
|||
<view class="wl-item" @click="toMallLs"> |
|||
<image mode="aspectFit" src="/static/images/write_off/order.png"></image> |
|||
<view>商城订单核销记录</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view class="wom-section"> |
|||
<view class="ws-tit">现场散客人数</view> |
|||
<view class="ws-ls"> |
|||
<view class="wl-item" @click="toPeopleNum"> |
|||
<image mode="aspectFit" src="/static/images/write_off/people.png"></image> |
|||
<view>现场散客人数查询</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import util from '../../../utils/util'; |
|||
import { WRITE_OFF_STORE_NAME } from '../../../js/once_name'; |
|||
import { API } from '../../../js/api'; |
|||
import { servers } from '../../../js/server'; |
|||
export default { |
|||
methods: { |
|||
toPeopleNum(){ |
|||
util.routeTo(`/pages/write_off/number_of_people/number_of_people`, 'nT'); |
|||
}, |
|||
toOperate(type){ |
|||
util.$_emit(WRITE_OFF_STORE_NAME, null); |
|||
util.routeTo(`/pages/write_off/operate/operate?type=${type}`, 'nT'); |
|||
}, |
|||
toSiteList(){ |
|||
util.routeTo(`/pages/write_off/search_result/search_result`, 'nT'); |
|||
}, |
|||
toMallLs(){ |
|||
util.routeTo(`/pages/write_off/mall/list/list`, 'nT'); |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
.write-off-menu{ |
|||
padding: 60upx 68upx 0upx; |
|||
.wom-section{ |
|||
margin-bottom: 30upx; |
|||
.ws-tit{ |
|||
margin-bottom: 20upx; |
|||
font-size: 32upx; |
|||
font-weight: 500; |
|||
line-height: 44upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.ws-ls{ |
|||
@include centerFlex(space-between); |
|||
flex-wrap: wrap; |
|||
.wl-item{ |
|||
padding-top: 58upx; |
|||
margin-bottom: 32upx; |
|||
width: 288upx; |
|||
height: 220upx; |
|||
border-radius: 10upx; |
|||
background-color: #fff; |
|||
>image{ |
|||
margin: 0 auto 22upx; |
|||
display: block; |
|||
width: 60upx; |
|||
height: 60upx; |
|||
} |
|||
>view{ |
|||
text-align: center; |
|||
line-height: 40upx; |
|||
font-size: 28upx; |
|||
color: #9c9c9f; |
|||
@include textHide(1); |
|||
} |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,362 @@ |
|||
<template> |
|||
<view class="number-of-people"> |
|||
<view class="nop-store-name"> |
|||
<picker :range="stadiumList" range-key="name" @change="stadiumChange"> |
|||
<view class="nsn-frame"> |
|||
<input placeholder="请选择店铺" :value="curStadium.name" disabled /> |
|||
<image mode="aspectFit" src="/static/images/icon/arrow_c33.png"></image> |
|||
</view> |
|||
</picker> |
|||
</view> |
|||
<view class="nop-main"> |
|||
<view class="nm-date">日期：{{ dateStr || '-' }}</view> |
|||
<view class="nm-tit">现场散客人数</view> |
|||
<view class="nm-num"> |
|||
<image mode="aspectFit" src="/static/images/countdown_bg.png"></image> |
|||
<view class="nn-txt-num">{{peopleInfo.present_person_number || 0}}</view> |
|||
</view> |
|||
<view class="nm-btn" @click="isChangeNum = true">修改人数</view> |
|||
<view class="nm-tip"> |
|||
<text>温馨提示：\n\r修改现场人数可能会影 响现场灯光开关，请谨慎操作！ 如后台有开启散客开关灯功能的，则散客人数达到阶梯最低X人时，对应灯光会自动开灯;少于X人的已开启的灯会自动关闭。</text> |
|||
</view> |
|||
</view> |
|||
<view class="ox-dark-mask" v-if="isChangeNum"> |
|||
<view class="nop-modifies-modal"> |
|||
<image class="nmm-close" @click="isChangeNum = false" src="/static/images/icon/x_close.png"></image> |
|||
<view class="nmm-tit">修改现场散客人数</view> |
|||
<view class="nmm-info"> |
|||
<view class="ni-num">当前现场散客人数为：{{peopleInfo.present_person_number || 0}}</view> |
|||
<view class="ni-ipt"> |
|||
<input placeholder="请输入散客人数" v-model="changeNum" type="number" /> |
|||
</view> |
|||
<view class="ni-tip">修改现场人数可能会影响现场灯光开关，请谨慎操作！</view> |
|||
</view> |
|||
<view class="nmm-btns"> |
|||
<view @click="isChangeNum = false">取消</view> |
|||
<view @click="confirmChange">确认</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { API } from '../../../js/api' |
|||
import { servers } from '../../../js/server' |
|||
import { mapState } from 'vuex'; |
|||
import util from '../../../utils/util'; |
|||
let timer = null; |
|||
export default { |
|||
computed: { |
|||
...mapState([ 'brandInfo' ]), |
|||
}, |
|||
data(){ |
|||
return { |
|||
isChangeNum: false, |
|||
stadiumList: [], |
|||
curStadium: { |
|||
name: '' |
|||
}, |
|||
peopleInfo: {}, |
|||
dateStr: '-', |
|||
changeNum: '', |
|||
} |
|||
}, |
|||
onLoad(options){ |
|||
this.initStore(); |
|||
this.dateStr = util.formatDate({ partition: 'zh' }) || '-'; |
|||
}, |
|||
|
|||
onUnload(){ |
|||
this.clearTime(); |
|||
}, |
|||
methods: { |
|||
confirmChange: util.debounce(function(){ |
|||
let { changeNum } = this; |
|||
if(isNaN(changeNum))return util.showNone('请输入正确人数！'); |
|||
this.isChangeNum = false; |
|||
this.setStadiumPresentNumber(changeNum); |
|||
}, 200, true), |
|||
setStadiumPresentNumber(num){ |
|||
let { curStadium } = this; |
|||
util.showLoad(); |
|||
servers.get({ |
|||
url: API.writeOff.setStadiumPresentNumber, |
|||
data: { |
|||
brand_id: curStadium.curStadium, |
|||
stadium_id: curStadium.id, |
|||
number: +num, |
|||
}, |
|||
isDefaultGet: false, |
|||
}) |
|||
.then(res=>{ |
|||
util.hideLoad(); |
|||
if(res.data.code == 0){ |
|||
util.showNone(res.data.message || '操作成功！'); |
|||
setTimeout(_=>{ |
|||
this.getUserNum({ |
|||
stadium_id: curStadium.id, |
|||
brand_id: curStadium.brand_id |
|||
}) |
|||
this.initInertval(); |
|||
}, 1200) |
|||
}else{ |
|||
util.showNone(res.data.message || '操作失败！'); |
|||
} |
|||
}) |
|||
.catch(util.hideLoad) |
|||
}, |
|||
initInertval(){ |
|||
this.clearTime(); |
|||
let { curStadium } = this; |
|||
if(!curStadium.id || !curStadium.brand_id)return; |
|||
timer = setInterval(_=>{ |
|||
if(!curStadium.id || !curStadium.brand_id)return this.clearTime(); |
|||
this.getUserNum({ |
|||
stadium_id: curStadium.id, |
|||
brand_id: curStadium.brand_id |
|||
}) |
|||
}, 3000); |
|||
}, |
|||
clearTime(){ |
|||
clearInterval(timer); |
|||
timer = null; |
|||
}, |
|||
|
|||
stadiumChange(e){ |
|||
let { stadiumList } = this; |
|||
let _curStadium = stadiumList[e.detail.value] || {}; |
|||
if(!_curStadium.id || !_curStadium.brand_id)return; |
|||
this.curStadium = _curStadium; |
|||
this.getUserNum({ |
|||
stadium_id: _curStadium.id, |
|||
brand_id: _curStadium.brand_id |
|||
}) |
|||
this.initInertval(); |
|||
}, |
|||
async initStore(){ |
|||
let { brandInfo } = this; |
|||
try{ |
|||
util.showLoad(); |
|||
let _storeList = await this.getStoreList({ brand_id: brandInfo.brand.id || '' }); |
|||
if(!_storeList || !_storeList.length)return util.showNone('没有店铺信息'); |
|||
this.stadiumList = _storeList || []; |
|||
let _curStadium = _storeList[0] || {}; |
|||
this.curStadium = _curStadium; |
|||
this.initInertval(); |
|||
this.getUserNum({ |
|||
stadium_id: _curStadium.id, |
|||
brand_id: _curStadium.brand_id |
|||
}) |
|||
util.hideLoad(); |
|||
}catch(err){ |
|||
util.hideLoad(); |
|||
util.showNone('初始化店铺数据失败！'); |
|||
console.warn('加载数据失败！', err); |
|||
} |
|||
}, |
|||
// 获取店铺列表 |
|||
getStoreList({ |
|||
page=1, |
|||
page_size=9999, |
|||
brand_id='', |
|||
}){ |
|||
return servers.get({ |
|||
url: API.stadiumList, |
|||
data: { |
|||
page, |
|||
page_size, |
|||
brand_id, |
|||
}, |
|||
failMsg: '获取列表失败！' |
|||
}) |
|||
.then(res=>{ |
|||
let _list = res.list || []; |
|||
return _list |
|||
}) |
|||
}, |
|||
getUserNum({ |
|||
stadium_id, |
|||
brand_id, |
|||
}){ |
|||
servers.get({ |
|||
url: API.writeOff.timingNumber, |
|||
data: { stadium_id, brand_id }, |
|||
failMsg: '加载现场人数失败！' |
|||
}) |
|||
.then(res=>{ |
|||
this.peopleInfo = res |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
@import '~style/public.scss'; |
|||
page{ |
|||
background-color: #fff; |
|||
} |
|||
.number-of-people{ |
|||
.nop-store-name{ |
|||
height: 144upx; |
|||
@include centerFlex(center); |
|||
.nsn-frame{ |
|||
padding: 0 20upx; |
|||
width: 702upx; |
|||
height: 92upx; |
|||
border-radius: 10upx; |
|||
background-color: #F2F2F7; |
|||
@include centerFlex(space-between); |
|||
>input{ |
|||
flex-grow: 1; |
|||
line-height: 40upx; |
|||
font-size: 28upx; |
|||
color: #1A1A1A; |
|||
} |
|||
>image{ |
|||
flex-shrink: 0; |
|||
margin-left: 20upx; |
|||
width: 28upx; |
|||
height: 28upx; |
|||
} |
|||
} |
|||
} |
|||
.nop-main{ |
|||
padding: 8upx 30upx 0; |
|||
.nm-date{ |
|||
margin-bottom: 86upx; |
|||
line-height: 44upx; |
|||
font-size: 32upx; |
|||
color: #1a1a1a; |
|||
} |
|||
.nm-tit{ |
|||
margin-bottom: 48upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
font-weight: 500; |
|||
} |
|||
.nm-num{ |
|||
position: relative; |
|||
margin: 0 auto 100upx; |
|||
display: block; |
|||
width: 400upx; |
|||
height: 400upx; |
|||
.nn-txt-num{ |
|||
line-height: 400upx; |
|||
text-align: center; |
|||
font-size: 96upx; |
|||
font-weight: 500; |
|||
color: $themeColor; |
|||
} |
|||
>image { |
|||
position: absolute; |
|||
left: 50%; |
|||
top: 50%; |
|||
z-index: -1; |
|||
margin-left: -250upx; |
|||
margin-top: -250upx; |
|||
display: block; |
|||
width: 500upx; |
|||
height: 500upx; |
|||
animation: Rotate 6s linear infinite |
|||
} |
|||
@keyframes Rotate{ |
|||
0% {transform: rotate(360deg);} |
|||
50% {transform: rotate(180deg);} |
|||
100% {transform: rotate(0deg);} |
|||
} |
|||
} |
|||
.nm-btn{ |
|||
margin: 0 auto 106upx; |
|||
width: 618upx; |
|||
line-height: 112upx; |
|||
height: 112upx; |
|||
text-align: center; |
|||
border-radius: 10upx; |
|||
font-size: 38upx; |
|||
color: #fff; |
|||
background-color: $themeColor; |
|||
} |
|||
.nm-tip{ |
|||
margin-bottom: 30upx; |
|||
font-size: 28upx; |
|||
line-height: 52upx; |
|||
color: #9C9C9F; |
|||
} |
|||
|
|||
} |
|||
.nop-modifies-modal{ |
|||
position: absolute; |
|||
left: 50%; |
|||
top: 50%; |
|||
transform: translate(-50%, -50%); |
|||
padding-top: 78upx; |
|||
width: 620upx; |
|||
height: 706upx; |
|||
background-color: #fff; |
|||
border-radius: 10upx; |
|||
.nmm-close{ |
|||
position: absolute; |
|||
right: 30upx; |
|||
top: 30upx; |
|||
width: 34upx; |
|||
height: 34upx; |
|||
} |
|||
.nmm-tit{ |
|||
line-height: 44upx; |
|||
text-align: center; |
|||
font-weight: 500; |
|||
font-size: 32upx; |
|||
color: #1A1A1A; |
|||
} |
|||
.nmm-info{ |
|||
padding: 54upx 80upx 80upx; |
|||
.ni-num{ |
|||
margin-bottom: 30upx; |
|||
font-size: 28upx; |
|||
line-height: 48upx; |
|||
color: #1A1A1A; |
|||
@include textHide(1); |
|||
} |
|||
.ni-ipt{ |
|||
margin-bottom: 26upx; |
|||
padding: 0 20upx; |
|||
height: 88upx; |
|||
border-radius: 10upx; |
|||
border: 2upx solid #D8D8D8; |
|||
>input{ |
|||
flex-grow: 1; |
|||
height: 100%; |
|||
font-size: 28upx; |
|||
color: #1A1A1A; |
|||
} |
|||
} |
|||
.ni-tip{ |
|||
font-size: 24upx; |
|||
line-height: 34upx; |
|||
color: #EA5061; |
|||
} |
|||
} |
|||
.nmm-btns{ |
|||
@include centerFlex(center); |
|||
>view{ |
|||
margin: 0 10upx; |
|||
width: 240upx; |
|||
height: 88upx; |
|||
line-height: 84upx; |
|||
text-align: center; |
|||
font-size: 32upx; |
|||
border-radius: 10upx; |
|||
border: 2upx solid $themeColor; |
|||
color: $themeColor; |
|||
&+view{ |
|||
color: #fff; |
|||
background-color: $themeColor; |
|||
} |
|||
} |
|||
} |
|||
|
|||
} |
|||
} |
|||
</style> |
|||
|
After Width: 700 | Height: 700 | Size: 33 KiB |
|
After Width: 36 | Height: 36 | Size: 392 B |
|
After Width: 128 | Height: 128 | Size: 1.4 KiB |
|
After Width: 128 | Height: 128 | Size: 1.0 KiB |
|
After Width: 128 | Height: 128 | Size: 1.8 KiB |
|
After Width: 120 | Height: 120 | Size: 1.4 KiB |
Write
Preview
Loading…
Cancel
Save
Reference in new issue