312 lines
8.1 KiB
Vue
312 lines
8.1 KiB
Vue
<template>
|
||
<view class="bg">
|
||
<view class="qrcode-box">
|
||
<block>
|
||
<view class="title line-align">
|
||
<view :class="qrcodeType == 0 ? 'active' : ''" @click="onChange(0)">取餐码</view>
|
||
<view :class="qrcodeType == 1 ? 'active' : ''" @click="onChange(1)">邀请码</view>
|
||
</view>
|
||
<view class="qrcode">
|
||
<image :src="qrcode"></image>
|
||
</view>
|
||
<text v-if="qrcodeType == 0" class="desc line-align">将此取餐码分享给微信好友，即可帮你取餐<br>（仅当日有效）</text>
|
||
<text v-if="qrcodeType == 1" class="desc line-align">长按分享此码收集代取餐人员</text>
|
||
</block>
|
||
<block>
|
||
<view class="title">共 {{ userRefereeList.length }} 人</view>
|
||
<view class="user-list" v-if="qrcodeType == 1">
|
||
<view class="item" v-for="(item,index) in userRefereeList" :key="index">
|
||
<view class="info">
|
||
<view class="nick-name">{{ item.nickname }}</view>
|
||
<view class="time">{{ item.createTime }}</view>
|
||
</view>
|
||
<view class="action">
|
||
<u-button shape="circle" type="error" size="mini" plain @click="onRemove(item.id)">移除</u-button>
|
||
</view>
|
||
</view>
|
||
<view class="bottom"></view>
|
||
</view>
|
||
<view class="user-list" v-if="qrcodeType == 0">
|
||
<view class="title line-align" style="padding-top: 10rpx;">
|
||
<button :type="tongjiType == 0 ? 'primary' : ''" size="mini" @click="onChange2(0)">按人员统计</button>
|
||
<button :type="tongjiType == 1? 'primary' : ''" size="mini" @click="onChange2(1)">按菜品统计</button>
|
||
<!-- <u-button size="medium" plain @click="onChange2(1)" class="custom-style" :class="tongjiType == 1 ? 'custom-active-style' : ''">按菜品统计</u-button> -->
|
||
</view>
|
||
<view class="item" v-for="(item,index) in userOrderList" :key="index">
|
||
<view class="info">
|
||
<view class="nick-name">{{ item.nickname }}</view>
|
||
<!-- 按人员统计 -->
|
||
<block v-if="tongjiType == 0">
|
||
<span class="no-buy" v-if="item.order.length == 0">未报餐</span>
|
||
<span class="order-ok" v-else-if="item.order[0].orderStatus == 30">已取餐</span>
|
||
<span class="is-buy" v-else>已报餐</span>
|
||
</block>
|
||
<!-- 按菜品统计 -->
|
||
<block v-if="tongjiType == 1 && item.order.length > 0">
|
||
<block v-for="(goods,index) in item.order[0].goodsList">
|
||
<span class="food">{{ index > 0 ? '、': '' }}</span>
|
||
<span class="food" v-if="goods.deliveryStatus == 10">{{ goods.goodsName }}x{{ goods.totalNum }}</span>
|
||
<span class="line-through" v-else>{{ goods.goodsName }}x{{ goods.totalNum }}</span>
|
||
</block>
|
||
</block>
|
||
</view>
|
||
</view>
|
||
<view class="bottom"></view>
|
||
</view>
|
||
</block>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import store from '@/store/index.js'
|
||
import storage from '@/utils/storage'
|
||
import { ACCESS_TOKEN, USER_ID } from '@/store/mutation-types'
|
||
import { pageAgentUser } from '@/api/apps-bc-agent.js'
|
||
import { getSetting } from '@/api/setting.js'
|
||
import { checkLogin } from '@/core/app.js'
|
||
import * as UserRefereeApi from '@/api/user-referee.js'
|
||
import * as OrderApi from '@/api/order.js'
|
||
import * as UserApi from '@/api/user.js'
|
||
import Empty from '@/components/empty'
|
||
import { userId } from '@/config'
|
||
|
||
export default {
|
||
components: {
|
||
// Search,
|
||
Empty
|
||
},
|
||
data() {
|
||
return {
|
||
options: null,
|
||
title: '代他人取餐',
|
||
// 正在加载中
|
||
isLoading: false,
|
||
// 是否授权了定位权限
|
||
isAuthor: true,
|
||
// 当前选择的门店ID
|
||
selectedId: null,
|
||
// 订单列表数据
|
||
list: [],
|
||
userRefereeList: [],
|
||
userOrderList: [],
|
||
qrcodeType: 0, // 0邀请码 1取餐码
|
||
tongjiType: 0, // 统计类型 0按人员统计 1按菜品统计
|
||
qrcode: ''
|
||
}
|
||
},
|
||
onLoad(options) {
|
||
this.options = options
|
||
this.listUserReferee()
|
||
this.addUserByQrCode()
|
||
this.getOthersOrder()
|
||
this.getMyQrCode()
|
||
},
|
||
onShow() {
|
||
this.getUserInfo()
|
||
},
|
||
methods: {
|
||
navTo(merchantId) {
|
||
const navTo = uni.$u.route()
|
||
navTo('pages/merchant/detail', {
|
||
merchantId
|
||
})
|
||
},
|
||
getUserInfo(){
|
||
if(!uni.setStorageSync('userId')){
|
||
this.$error('请先登录',() => {
|
||
this.$navTo('pages/login/index')
|
||
})
|
||
}
|
||
},
|
||
getMyQrCode(){
|
||
const app = this
|
||
const { qrcodeType } = this
|
||
const userId = uni.getStorageSync('userId')
|
||
|
||
// 取餐码 二维码内容 dqc:代取餐人ID
|
||
if(qrcodeType == 0){
|
||
UserApi.getMyQrCode({
|
||
codeContent: 'dqc:' + userId
|
||
}).then(res => {
|
||
app.qrcode = res.data
|
||
})
|
||
}
|
||
// 邀请码 二维码内容 跳转到带有推荐人ID的网址完成绑定关系
|
||
if(qrcodeType == 1){
|
||
UserApi.getMyQrCode({
|
||
codeContent: 'http://apps.gxwebsoft.com/baocan/#/pages/order/delivery/others?userId=' + userId,
|
||
}).then(res => {
|
||
app.qrcode = res.data
|
||
})
|
||
}
|
||
},
|
||
// 切换类型
|
||
onChange(index){
|
||
this.qrcodeType = index
|
||
this.getMyQrCode()
|
||
this.getOthersOrder()
|
||
},
|
||
// 切换类型
|
||
onChange2(index){
|
||
this.tongjiType = index
|
||
this.getOthersOrder()
|
||
},
|
||
// 查询推荐关系列表
|
||
listUserReferee(){
|
||
const app = this
|
||
const dealerId = uni.getStorageSync('userId')
|
||
UserRefereeApi.listUserReferee({dealerId}).then(res => {
|
||
app.userRefereeList = res.data
|
||
})
|
||
},
|
||
// 查询代取餐人员的订单信息
|
||
getOthersOrder(){
|
||
OrderApi.getOthersOrder().then(resp => {
|
||
console.log("resp: ",resp);
|
||
this.userOrderList = resp.data
|
||
})
|
||
},
|
||
addUserByQrCode(){
|
||
const app = this
|
||
const { userId } = app.options
|
||
const dealerId = uni.getStorageSync('userId')
|
||
if(userId && userId != Number(dealerId)){
|
||
app.qrcodeType = 1
|
||
UserRefereeApi.addUserReferee({
|
||
dealerId,
|
||
userId
|
||
}).then(res => {
|
||
app.$toast(res.message)
|
||
app.listUserReferee()
|
||
})
|
||
}
|
||
},
|
||
onRemove(id){
|
||
const app = this
|
||
UserRefereeApi.removeUserReferee(id).then(()=>{
|
||
app.$toast('移除成功')
|
||
app.listUserReferee()
|
||
})
|
||
}
|
||
|
||
// onAgentBaocan(user){
|
||
// console.log("user收拾收拾: ",user);
|
||
// uni.setStorageSync('catererUser',user)
|
||
// this.$navTo('pages/order/get-food/get-food')
|
||
// },
|
||
|
||
// clearAgentBaocan(){
|
||
// uni.removeStorageSync('catererUser')
|
||
// this.$navTo('pages/order/get-food/get-food')
|
||
// }
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
page{
|
||
background-color: #67e7dd;
|
||
}
|
||
.bg {
|
||
background-image: linear-gradient(#51b2aa, #67e7dd);
|
||
height: calc(100vh - var(--window-top));
|
||
padding: 70rpx 0;
|
||
}
|
||
.qrcode-box{
|
||
width: 660rpx;
|
||
margin: auto;
|
||
background-color: #ffffff;
|
||
border-radius: 20rpx;
|
||
.title{
|
||
padding: 12rpx 0;
|
||
display: flex;
|
||
justify-content: space-around;
|
||
line-height: 80rpx;
|
||
font-size: 34rpx;
|
||
color: #999999;
|
||
.active{
|
||
color: #51b2aa;
|
||
}
|
||
}
|
||
.line-align{
|
||
width: 580rpx;
|
||
margin: auto;
|
||
border-bottom: 1rpx solid #eeeeee;
|
||
}
|
||
.qrcode{
|
||
padding-bottom: 0rpx;
|
||
margin: auto;
|
||
display: flex;
|
||
justify-content: center;
|
||
image{
|
||
width: 360rpx;
|
||
height: 360rpx;
|
||
}
|
||
}
|
||
.desc{
|
||
color: blue;
|
||
display: flex;
|
||
text-align: center;
|
||
justify-content: center;
|
||
padding-bottom: 24rpx;
|
||
}
|
||
.user-list{
|
||
width: 580rpx;
|
||
margin: auto;
|
||
display: flex;
|
||
flex-direction: column;
|
||
.item{
|
||
border-bottom: 1rpx solid #eeeeee;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 10rpx 0;
|
||
.info{
|
||
.food{
|
||
color: #ff0000;
|
||
.goods-name{
|
||
padding-right: 10rpx;
|
||
}
|
||
}
|
||
.line-through{
|
||
text-decoration: line-through;
|
||
color: #666666;
|
||
.goods-name{
|
||
padding-right: 10rpx;
|
||
}
|
||
}
|
||
.is-buy{
|
||
color: #ff0000;
|
||
}
|
||
.no-buy{
|
||
color: #0000ff;
|
||
}
|
||
.order-ok{
|
||
color: #51b2aa;
|
||
}
|
||
}
|
||
.time{
|
||
color: #c2c2c2;
|
||
}
|
||
.remove{
|
||
padding: 0 30rpx;
|
||
}
|
||
}
|
||
.bottom{
|
||
height: 50rpx;
|
||
}
|
||
.custom-style {
|
||
margin: 10rpx 0;
|
||
width: 220rpx;
|
||
}
|
||
.custom-active-style {
|
||
margin: 10rpx 0;
|
||
width: 220rpx;
|
||
color: #ffffff;
|
||
background-color: #51b2aa;
|
||
}
|
||
}
|
||
}
|
||
</style>
|