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