czg_team/cashier-ipad-new
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
YeMingfei666
2025-04-02 10:35:17 +08:00
commit 89db955ec1
701 changed files with 91082 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

358
pageTable/index/components/add-table.vue Normal file
View File

@@ -0,0 +1,358 @@
<template>
<my-model ref="model" :title="title" :borderRadius="16" @confirm="submit" :confirmClickClose="false">
<template #desc>
<view>
<uni-forms ref="refform" label-position="left" :model="form" label-align="left" :label-width="400"
:rules="rules">
<view class="form">
<view class="border-bottom u-p-b-10 u-p-t-10">
<uni-forms-item required label="" name="areaId">
<template #label>
<view class="u-text-left ">
<text class="color-red">*</text>
<text class="color-333 u-font-28">选择区域</text>
</view>
</template>
<picker @change="areaChange"
:value="area.selIndex"
range-key="name" :range="area.list">
<view class=" u-flex u-row-between u-relative ">
<view class="zhezhao u-absolute position-all" style="z-index: 1;"></view>
<view class="u-flex-1">
<uni-easyinput :inputBorder="false" paddingNone v-model="area.sel.name"
placeholder="请选择区域"></uni-easyinput>
</view>
<uni-icons type="right" size="18" color="#999"></uni-icons>
</view>
</picker>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10 u-p-t-10">
<uni-forms-item required label="" name="status">
<template #label>
<view class="u-text-left ">
<!-- <text class="color-red">*</text> -->
<text class="color-333 u-font-28">桌台状态</text>
</view>
</template>
<picker @change="statusChange" range-key="label"
:value="status.selIndex"
:range="status.list">
<view class=" u-flex u-row-between u-relative ">
<view class="zhezhao u-absolute position-all" style="z-index: 1;"></view>
<view class="u-flex-1">
<uni-easyinput :inputBorder="false" paddingNone v-model="status.sel.label"
placeholder="请选择桌台状态"></uni-easyinput>
</view>
<uni-icons type="right" size="18" color="#999"></uni-icons>
</view>
</picker>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10">
<uni-forms-item required label="" name="name">
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">桌台名称</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
placeholder="请输入桌台名称"></uni-easyinput>
</view>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10">
<uni-forms-item required label="" name="maxCapacity">
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">客座数</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<uni-number-box v-model="form.maxCapacity"></uni-number-box>
</view>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10">
<uni-forms-item required label="" name="isPredate">
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">网络预定开关</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1 u-flex u-row-right">
<my-switch v-model="form.isPredate"></my-switch>
</view>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10">
<uni-forms-item required label="" name="types">
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">类型</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<my-tabs @change="tabsChange" :list="tabs.list" v-model="tabs.sel"></my-tabs>
</view>
</uni-forms-item>
</view>
<view class="border-bottom u-p-b-10">
<uni-forms-item required label="" name="types">
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">清台管理</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<my-tabs @change="autoClearsChange" :list="autoClears.list" v-model="form.autoClear"></my-tabs>
</view>
</uni-forms-item>
</view>
<template v-if="tabs.sel==1">
<view class=" u-p-b-10">
<uni-forms-item required label="" >
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">每小时收费</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<uni-easyinput :inputBorder="false" paddingNone v-model="form.perhour" type="number"
placeholder="请输入每小时收费"></uni-easyinput>
</view>
</uni-forms-item>
</view>
</template>
<template v-else>
<view class=" u-p-b-10">
<uni-forms-item required label="" >
<template #label>
<view class="u-text-left">
<text class="color-333 u-font-28">最低消费</text>
<!-- <text class="color-red">*</text> -->
</view>
</template>
<view class="u-flex-1">
<uni-easyinput :inputBorder="false" paddingNone v-model="form.amount" type="number"
placeholder="请输入最低消费"></uni-easyinput>
</view>
</uni-forms-item>
</view>
</template>
</view>
</uni-forms>
</view>
</template>
</my-model>
</template>
<script setup>
import {
$tableArea,$table
} from '@/http/yskApi/table.js'
import {
ref,
reactive,
onMounted
} from 'vue';
import {
$status
} from '@/commons/table-status.js'
import {objToArrary} from '@/commons/utils/returrn-data.js'
import infoBox from '@/commons/utils/infoBox.js'
const emits= defineEmits(['update'])
const tabs=reactive({
list:['低消','计时'],
sel:1
})
//清台管理
const autoClears=reactive({
list:['手动清台','自动清台']
})
function autoClearsChange(i){
form.autoClearsChange=i
}
const status = reactive({
list:objToArrary($status),
sel: '',
selIndex:0
})
console.log(status.list);
const props = defineProps({
title: {
type: String,
default: '编辑桌台'
}
})
const model = ref(null)
const area = reactive({
list: [],
sel: '',
selIndex:0
})
async function getArea() {
const {
content
} = await $tableArea.get({
page: 0,
size: 300
})
area.list = content.map(v => {
return {
...v,
name: v.name,
value: v.id,
label: v.name
}
})
console.log(area.list);
}
function tabsChange(e){
if(e){
form.type=2
}else{
form.type=0
}
}
function statusChange(e){
status.sel = status.list[e.detail.value]
form.status = status.sel.key
}
function areaChange(e) {
console.log(e);
area.sel = area.list[e.detail.value]
form.areaId = area.sel.id
}
onMounted(()=>{
getArea()
})
function open(tableData) {
Object.assign(form,tableData)
getArea()
model.value.open()
if(tableData){//编辑
const {areaId,type}=tableData
area.sel=area.list.find(v=>v.id==areaId)
area.selIndex=area.list.findIndex(v=>v.id==areaId)
status.sel=status.list.find(v=>v.key==tableData.status)
status.selIndex=status.list.findIndex(v=>v.key==tableData.status)
tabs.sel=form.type==2?1:0
}
}
function close() {
model.value.close()
}
defineExpose({
open,
close
})
function unitChange(e) {
units.current = e.detail.value
form.unit = units.list[e.detail.value].name
}
const refform = ref(null)
const form = reactive({
id: '',
name: '',
areaId: '',
status:'',
maxCapacity: 0,
isPredate: 1,
type: 2,
perhour: 0,
amount: 0
})
// 校验规则
const rules = {
areaId: {
rules: [{
required: true,
errorMessage: '请选择区域'
}]
},
name: {
rules: [{
required: true,
errorMessage: '请输入桌台名称'
}]
}
}
function submit() {
refform.value.validate(res => {
console.log(res)
console.log(form);
$table.update({...form,qrcode:form.tableId}).then(Response=>{
infoBox.showSuccessToast('更新成功')
close()
emits('update')
})
}).catch(err => {
console.log(err);
})
}
const page = reactive({
type: 'add'
})
function cancel() {
uni.navigateBack()
}
</script>
<style lang="scss" scoped>
.border-bottom {
padding: 10rpx 0;
}
.form {
margin-top: 32rpx;
background-color: #fff;
padding: 32rpx 24rpx 32rpx 24rpx;
border-radius: 18rpx 18rpx 18rpx 18rpx;
.u-text-left {
min-width: 160rpx;
}
// background-color: transparent;
}
::v-deep.uni-forms-item {
min-height: 80rpx;
}
::v-deep.uni-forms-item .uni-forms-item__label {
font-size: 28rpx !important;
}
::v-deep.uni-easyinput__placeholder-class {
font-size: 28rpx;
}
::v-deep.uni-forms-item__error {
display: none;
}
</style>

249
pageTable/index/components/table-item.vue Normal file
View File

@@ -0,0 +1,249 @@
<template>
<view class="item color-fff border-r-12" :class="[computedClass]" @click="toOrderDetail">
<view class="my-bg-main" :style="{'background-color':returnStutasColor(data.status)}">
<view class="u-flex u-row-between">
<view class="u-font-32">{{data.name}}</view>
<view class="u-flex" @tap.stop="more">
<uni-icons type="more-filled" color="#fff" size="16"></uni-icons>
</view>
</view>
<view class="u-flex u-m-t-10 u-row-between">
<view>{{areaMap[data.areaId]||'' }}</view>
<view class="tag" :style="{color:returnStutasColor(data.status)}">
{{returnStutasText(data.status)}}
</view>
</view>
</view>
<view class="u-flex u-flex-col u-row-center u-col-center bg-fff bottom">
<template v-if="data.status!='using'">
<view class=" u-font-32" :style="{color:returnStutasColor(data.status)}">
{{returnStutasText(data.status)}}~
</view>
</template>
<view class=" w-full u-p-l-16 u-p-r-16 u-p-t-16 u-font-24">
<template v-if="data.status=='using'&& data.orderId">
<view class="color-666 u-text-left u-p-b-20 border-bottom">
<view class=""><text>已点</text><text class="u-m-l-20 color-333">{{data.productNum||0}}件</text>
</view>
<view class="u-m-t-10"><text>金额</text><text class="u-m-l-20 color-333">{{data.totalAmount||0}}
元</text> </view>
<view class="u-m-t-10"><text>待结</text><text class="u-m-l-20 color-333">{{data.totalAmount||0}}
元</text> </view>
</view>
<view class="u-flex u-row-between u-font-20 u-p-b-20 u-p-t-20">
<text class="color-333">开台时间</text>
<text class="color-666"> {{data.useTime}}</text>
</view>
</template>
<template v-else>
<view class="u-flex u-row-center u-m-t-16">
<template v-if="data.tableId">
<template v-if="data.status=='idle'||(data.status=='using'&&!data.orderId) ">
<my-button color="#333" :width="150" :height="56" type="default" @click="diancan">
选择
</my-button>
</template>
<template v-if="data.status=='cleaning' ">
<my-button color="#333" :width="150" :height="56" type="default" @click="qingtai">
清台
</my-button>
</template>
</template>
<my-button v-else :width="150" :height="56" type="default" disabled>
选择
</my-button>
</view>
</template>
</view>
</view>
</view>
</template>
<script setup>
import * as Api from '@/http/yskApi/Instead.js'
import myButton from '@/components/my-components/my-button'
import go from '@/commons/utils/go.js'
import {hasPermission} from '@/commons/utils/hasPermission.js'
import {
$status
} from '@/commons/table-status.js'
import {
computed,
onMounted,
ref
} from 'vue';
import {
$table
} from '@/http/yskApi/table.js'
import infoBox from '@/commons/utils/infoBox.js'
const status = $status
const emits = defineEmits(['more', 'update'])
function returnStutasText(key) {
key = returnIsUseing(key)
const item = status[key]
return item ? item.label : ''
}
const computedClass = computed(() => {
const key = returnIsUseing(props.data.status)
return key
})
function returnIsUseing(key) {
// return key = key == 'using' ? (props.data.orderId ? key : 'idle') : key
return key
}
function returnStutasColor(key) {
// if(key=='using'){
// return 'rgb(250,85,85)'
// }else{
// return ''
// }
key = returnIsUseing(key)
const item = status[key]
return item ? item.type : ''
}
const props = defineProps({
data: {
type: Object,
default: () => {
return {}
}
},
areaMap: {
type: Object,
default: () => {}
}
})
const goodsList = ref([])
const allPrice = computed(() => {
return goodsList.value.reduce((prve, cur) => {
return prve + cur.salePrice * cur.number
}, 0).toFixed(2)
})
const goodsNumber = computed(() => {
let result = 0
result = goodsList.value.reduce((prve, cur) => {
return prve + cur.number
}, 0)
return result
})
onMounted(() => {})
function more() {
if(props.data.status=='closed'){
return uni.showToast({
icon:'none',
title:'桌台关闭中！'
})
}
emits('more')
}
async function diancan() {
hasPermission('允许下单').then(res=>{
if(res){
const useType = props.status == 'using' ? props.data.useType : undefined
go.to('PAGES_CREATE_ORDER', {
tableId: props.data.tableId,
name: props.data.name,
maxCapacity: props.data.maxCapacity,
status: props.data.status,
})
}
})
}
function toOrderDetail() {
if (props.data.status == 'using' && props.data.orderId) {
const {
tableId,
name,
status,
amount,
areaId,
orderId
} = props.data
if (!orderId) {
return uni.showToast({
icon: 'none',
title: '台桌未返回订单id'
})
}
go.to('PAGES_ORDER_DETAIL', {
tableId,
name,
status,
amount,
areaId,
id: orderId
})
}
}
function qingtai() {
const item = props.data
uni.showModal({
title: '提示',
content: '确定要清台：' + props.data.name + '？',
success(res) {
if (res.confirm) {
$table.update({
...item,
status: "idle",
qrcode: item.tableId,
}).then(res => {
infoBox.showToast('清台成功')
emits('update')
})
}
}
})
}
</script>
<style lang="scss" scoped>
.gap-10 {
gap: 10rpx;
}
.item {
width: 330rpx;
box-sizing: border-box;
overflow: hidden;
box-shadow: 1px 1px 0 #eee;
border-color: #eee;
.bottom {
min-height: 224rpx;
}
.my-bg-main {
padding: 32rpx 28rpx;
.tag {
background-color: rgba(255, 255, 255, .7);
font-size: 24rpx;
color: $my-main-color;
border-radius: 8rpx;
padding: 2rpx 10rpx;
}
}
&.using {
.tag {
color: rgb(250, 85, 85);
}
}
}
</style>