parent
2481bf1438
commit
ce47d55a1f
@ -0,0 +1,388 @@ |
|||||||
|
<template> |
||||||
|
<view class="all-container pd-main backcor6 font15"> |
||||||
|
<view class=" width100 mart10"> |
||||||
|
<button class="btns icon tianjia" @click.stop="clickToAdd()">生成桌台</button> |
||||||
|
</view> |
||||||
|
<view class="mart20 backcorfff marb20"> |
||||||
|
<view class="dis-flex height40 bor-botm1"> |
||||||
|
<view class="flex-1 fotct fontwig6 ">二维码</view> |
||||||
|
<view class=" fotct fontwig6">桌号</view> |
||||||
|
<view class="flex-1 fotct fontwig6">桌名</view> |
||||||
|
<view class="flex-1 fotct fontwig6">操作</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="dis-flex bor-botm1 paddtop10 paddbotm10 " @click="openTableDetail(item)" v-for="(item,index) in tableList" :key="index"> |
||||||
|
|
||||||
|
<view class="flex-1 fotct"> |
||||||
|
<image :src="item.qrCodeImgUrl" @click.stop="previewImage(item.qrCodeImgUrl)" mode="aspectFit" class="width100 height60 verc"></image> |
||||||
|
</view> |
||||||
|
<view class=" fotct text1"> |
||||||
|
{{item.tableNumber}} |
||||||
|
</view> |
||||||
|
<view class="flex-1 fotct text1"> |
||||||
|
{{item.tableName}} |
||||||
|
</view> |
||||||
|
<view class="flex-1 fotct dis-flex flex-center"> |
||||||
|
|
||||||
|
<view class="marglerig fcorred font13" @click.stop="toDeleteTable(item)"><text |
||||||
|
class="icon shanchu font14 fcorred"></text>删除</view> |
||||||
|
<view class="marglerig fcor41c font13" @click.stop="editTable(item)"><text |
||||||
|
class="icon bianji font14 fcor41c"></text>编辑</view> |
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<!-- 编辑桌台 --> |
||||||
|
<uni-popup ref="popupEditTable" type="center" > |
||||||
|
<view style="width: 80vw;" class="backcorfff border-10r pd-main font16"> |
||||||
|
<view class="dis-flex mart20 marb10 paddbotm10 bor-botm1"> |
||||||
|
<view class=" marRight10 fontwig6 padleft15 paddtright10">桌台编号: |
||||||
|
</view> |
||||||
|
<input type="number" name="name" v-model.trim="tableEditData.tableNumber" placeholder-class="corf6" |
||||||
|
class=" flex-1 " placeholder="请输入桌台编号"> |
||||||
|
</view> |
||||||
|
<view class="dis-flex mart20 marb10 paddbotm10 bor-botm1"> |
||||||
|
<view class=" marRight10 fontwig6 padleft15 paddtright10">桌台名称: |
||||||
|
</view> |
||||||
|
<input type="text" name="name" v-model.trim="tableEditData.tableName" placeholder-class="corf6" |
||||||
|
class=" flex-1 " placeholder="请输入桌台名称"> |
||||||
|
</view> |
||||||
|
<button class="btnw50 " @click.stop="saveEditTable()">保存</button> |
||||||
|
</view> |
||||||
|
</uni-popup> |
||||||
|
<!-- 生成桌台弹窗 --> |
||||||
|
<uni-popup ref="inputDialog" type="dialog"> |
||||||
|
<uni-popup-dialog ref="inputClose" mode="input" title="输入生产数量" :before-close="true" :value="generateNum" placeholder="请输入生产数量" |
||||||
|
@confirm="dialogInputConfirm" @close="close"></uni-popup-dialog> |
||||||
|
</uni-popup> |
||||||
|
|
||||||
|
<!-- 查看详情 --> |
||||||
|
<uni-popup ref="popupDetail" type="bottom" background-color="#ffffff"> |
||||||
|
<view style="height: 60vh;overflow-y: auto;" class="backcorfff border-10r-lr pd-main font16"> |
||||||
|
<view class="pop-contain pd-main"> |
||||||
|
<view class="pop-title fontwig6"><text>详情</text></view> |
||||||
|
<view class="" v-if="tableDetail"> |
||||||
|
<view class="width100 dis-flex bor-botm1 "> |
||||||
|
<view class=" fotct fontwig6 backcor6 titleWidth minheight40">门店名称</view> |
||||||
|
<view class="flex-1 fotct ">{{tableDetail.storeName}}</view> |
||||||
|
</view> |
||||||
|
<view class="width100 dis-flex bor-botm1 "> |
||||||
|
<view class=" fotct fontwig6 backcor6 titleWidth minheight40">桌台编号</view> |
||||||
|
<view class="flex-1 fotct ">{{tableDetail.tableNumber}}</view> |
||||||
|
</view> |
||||||
|
<view class="width100 dis-flex bor-botm1 "> |
||||||
|
<view class=" fotct fontwig6 backcor6 titleWidth minheight40">桌台名称</view> |
||||||
|
<view class="flex-1 fotct ">{{tableDetail.tableName}}</view> |
||||||
|
</view> |
||||||
|
<view class="width100 dis-flex bor-botm1 "> |
||||||
|
<view class=" fotct fontwig6 backcor6 titleWidth minheight40">创建时间</view> |
||||||
|
<view class="flex-1 fotct ">{{tableDetail.createTime | timeFormat}}</view> |
||||||
|
</view> |
||||||
|
<view class="width100 dis-flex "> |
||||||
|
<view class=" fotct fontwig6 backcor6 titleWidth minheight80">二维码</view> |
||||||
|
<view class="flex-1 fotct "> |
||||||
|
<image :src="tableDetail.qrCodeImgUrl" @click.stop="previewImage(tableDetail.qrCodeImgUrl)" mode="aspectFit" class="width100 height60 verc"></image> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</uni-popup> |
||||||
|
</view > |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import {generateTable,getTableList, |
||||||
|
editTable,delTable,getTable |
||||||
|
|
||||||
|
} from '@/Utils/groupBuying.js' |
||||||
|
export default { |
||||||
|
|
||||||
|
data(){ |
||||||
|
return{ |
||||||
|
storeId:'',//门店id |
||||||
|
generateNum:'',//生产数量 |
||||||
|
tableList:[],//列表 |
||||||
|
pageNum:1, |
||||||
|
pageSize:99999, |
||||||
|
tableEditData:{ |
||||||
|
serialNumber:'',//桌台唯一编号 |
||||||
|
tableNumber:'',//桌台编号 |
||||||
|
tableName:'',//桌台名称 |
||||||
|
}, |
||||||
|
tableDetail:null,//详情 |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.storeId = options.storeId; |
||||||
|
this.getTableList(true); |
||||||
|
}, |
||||||
|
methods:{ |
||||||
|
/* 生成桌台 */ |
||||||
|
clickToAdd(){ |
||||||
|
this.generateNum = ''; |
||||||
|
this.$refs.inputDialog.open() |
||||||
|
}, |
||||||
|
dialogInputConfirm(e){ |
||||||
|
let reg = /^\+?[1-9][0-9]*$/; |
||||||
|
if(!reg.test(e)){ |
||||||
|
uni.showToast({ |
||||||
|
title:'请输入数字哦!', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
this.generateNum = e; |
||||||
|
this.generateTable(); |
||||||
|
}, |
||||||
|
/* 生成桌台 */ |
||||||
|
generateTable(){ |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中' |
||||||
|
}) |
||||||
|
let params={ |
||||||
|
"storeId": this.storeId, |
||||||
|
"generateNum": this.generateNum |
||||||
|
} |
||||||
|
generateTable(params).then(res=>{ |
||||||
|
uni.hideLoading(); |
||||||
|
this.$refs.inputDialog.close(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.generateNum = ''; |
||||||
|
this.getTableList(); |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_data, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}).catch(()=>{ |
||||||
|
this.$refs.inputDialog.close(); |
||||||
|
}) |
||||||
|
}, |
||||||
|
close(){ |
||||||
|
this.generateNum = ''; |
||||||
|
this.$refs.inputDialog.close(); |
||||||
|
}, |
||||||
|
/* 查询桌台列表 */ |
||||||
|
getTableList(flag) { |
||||||
|
if (flag) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中' |
||||||
|
}) |
||||||
|
} |
||||||
|
let params = { |
||||||
|
storeId: this.storeId, |
||||||
|
pageNum:this.pageNum, |
||||||
|
pageSize:this.pageSize, |
||||||
|
|
||||||
|
} |
||||||
|
getTableList(params).then(res => { |
||||||
|
if (flag) { |
||||||
|
uni.hideLoading() |
||||||
|
} |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.tableList = res.return_data.list; |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
/* 点击打开详情 */ |
||||||
|
openTableDetail(item){ |
||||||
|
this.tableDetail = null; |
||||||
|
this.getTableDetail(item,(res)=>{ |
||||||
|
this.tableDetail = res.return_data; |
||||||
|
this.$refs.popupDetail.open('bottom'); |
||||||
|
}) |
||||||
|
}, |
||||||
|
/* 查询桌台详情 */ |
||||||
|
getTableDetail(item,callback){ |
||||||
|
let params={ |
||||||
|
serialNumber:item.serialNumber |
||||||
|
} |
||||||
|
getTable(params).then(res=>{ |
||||||
|
if (res.return_code == '000000') { |
||||||
|
callback(res); |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
/* 删除桌台 */ |
||||||
|
toDeleteTable(item){ |
||||||
|
|
||||||
|
let _this = this; |
||||||
|
uni.showModal({ |
||||||
|
title: '提示', |
||||||
|
content: `确定删除‘${item.tableName}’吗?`, |
||||||
|
success: function(res) { |
||||||
|
if (res.confirm) { |
||||||
|
let params = { |
||||||
|
serialNumber: item.serialNumber |
||||||
|
} |
||||||
|
uni.showLoading({ |
||||||
|
title: '删除中' |
||||||
|
}) |
||||||
|
delTable(params).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
let title; |
||||||
|
if (res.return_code == '000000') { |
||||||
|
title = res.return_data; |
||||||
|
_this.getTableList(); |
||||||
|
} else { |
||||||
|
title = res.return_msg; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: title, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
}).catch(()=>{ |
||||||
|
uni.hideLoading(); |
||||||
|
}) |
||||||
|
} else if (res.cancel) { |
||||||
|
|
||||||
|
// console.log('用户点击取消'); |
||||||
|
} |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
/* 点击编辑桌台 */ |
||||||
|
editTable(item){ |
||||||
|
this.formatTableEditData(); |
||||||
|
this.getTableDetail(item,(res)=>{ |
||||||
|
this.tableEditData.serialNumber = res.return_data.serialNumber;//桌台唯一编号 |
||||||
|
this.tableEditData.tableNumber = res.return_data.tableNumber;//桌台编号 |
||||||
|
this.tableEditData.tableName = res.return_data.tableName;//桌台名称 |
||||||
|
this.$refs.popupEditTable.open('center'); |
||||||
|
}) |
||||||
|
}, |
||||||
|
formatTableEditData(){ |
||||||
|
this.tableEditData.serialNumber = '';//桌台唯一编号 |
||||||
|
this.tableEditData.tableNumber = '';//桌台编号 |
||||||
|
this.tableEditData.tableName = '';//桌台名称 |
||||||
|
}, |
||||||
|
//保存编辑桌台信息 |
||||||
|
saveEditTable(){ |
||||||
|
|
||||||
|
if(!this.tableEditData.tableNumber || !this.tableEditData.tableName){ |
||||||
|
uni.showToast({ |
||||||
|
title:'请填写完整哦!', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
return |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
uni.showLoading({ |
||||||
|
title:'保存中...' |
||||||
|
}) |
||||||
|
editTable(this.tableEditData).then(res=>{ |
||||||
|
uni.hideLoading(); |
||||||
|
this.$refs.popupEditTable.close(); |
||||||
|
this.formatTableEditData(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.getTableList(); |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_data, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}).catch(()=>{ |
||||||
|
uni.hideLoading(); |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
// 预览 |
||||||
|
previewImage(img){ |
||||||
|
uni.previewImage({ |
||||||
|
current: 0, |
||||||
|
indicator: "number", |
||||||
|
loop: "true", |
||||||
|
urls:[img] |
||||||
|
}) |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.btns { |
||||||
|
width: 21%; |
||||||
|
height: 35px; |
||||||
|
line-height: 35px; |
||||||
|
background-color: #0083f5; |
||||||
|
color: #FFFFFF; |
||||||
|
font-weight: bold; |
||||||
|
font-size: 12px; |
||||||
|
padding: 0px; |
||||||
|
margin: 0 0 0 auto; |
||||||
|
} |
||||||
|
|
||||||
|
.border-10r{ |
||||||
|
border-radius: 10px; |
||||||
|
} |
||||||
|
.border-10r-lr{ |
||||||
|
border-radius: 10px 10px 0 0 ; |
||||||
|
} |
||||||
|
|
||||||
|
/* 详情弹窗 */ |
||||||
|
.pop-contain { |
||||||
|
text-align: center; |
||||||
|
padding-top: 50px; |
||||||
|
background-color: #ffffff; |
||||||
|
|
||||||
|
.pop-title { |
||||||
|
text-align: center; |
||||||
|
height: 50px; |
||||||
|
line-height: 50px; |
||||||
|
font-size: 18px; |
||||||
|
position: fixed; |
||||||
|
z-index: 10; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
background: #ffffff; |
||||||
|
|
||||||
|
} |
||||||
|
.titleWidth { |
||||||
|
min-width: 80px; |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
|
||||||
|
.minheight40 { |
||||||
|
padding: 15px 0; |
||||||
|
} |
||||||
|
.minheight80{ |
||||||
|
min-height: 80px; |
||||||
|
line-height: 80px; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue