新增排队叫号功能

2024-12-12 09:33:01 +08:00
parent 0711d4b07d
commit 4b54fdaff1
12 changed files with 17112 additions and 93 deletions
--- a/src/views/queue/components/addTab.vue
+++ b/src/views/queue/components/addTab.vue
@@ -0,0 +1,139 @@
+<template>
+    <el-dialog v-model="showAddTable" :title="addTabForm.id ? '编辑桌型' : '新增桌型'" top="10vh" @closed="addTabFormReset">
+        <el-form ref="AddTabFormRef" :model="addTabForm" :rules="addTabFormRules" label-position="left"
+            label-width="100">
+            <el-form-item label="名称" prop="name">
+                <el-input v-model="addTabForm.name" placeholder="请输入名称" />
+            </el-form-item>
+            <el-form-item label="描述" prop="note">
+                <el-input v-model="addTabForm.note" placeholder="请输入描述，例如1-2人" />
+            </el-form-item>
+            <el-form-item label="等待时间" prop="waitTime">
+                <el-input v-model="addTabForm.waitTime" placeholder="0">
+                    <template #append>分钟/1桌</template>
+                </el-input>
+            </el-form-item>
+            <el-form-item label="号码前缀" prop="prefix">
+                <el-input v-model="addTabForm.prefix" placeholder="请输入英文字母，不支持中文" />
+            </el-form-item>
+            <el-form-item label="开始号码" prop="start">
+                <el-input v-model="addTabForm.start" placeholder="请输入开始号码" />
+            </el-form-item>
+            <el-form-item label="过号保留">
+                <el-input v-model="addTabForm.nearNum" :disabled="!addTabForm.isPostpone" placeholder="临近几桌提醒">
+                    <template #prepend>
+                        <el-checkbox v-model="addTabForm.isPostpone" :true-value="1" :false-value="0" label="开启顺延" />
+                    </template>
+                    <template #append>桌</template>
+                </el-input>
+            </el-form-item>
+        </el-form>
+        <div class="footer" style="display: flex;">
+            <el-button style="width: 100%" @click="showAddTable = false">
+                取消
+            </el-button>
+            <el-button type="primary" style="width: 100%" :loading="addTabFormLoading" @click="addTabConfirmHandle">
+                确认
+            </el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script setup>
+import { ElMessage } from 'element-plus'
+import { ref, onMounted } from 'vue'
+import { addCallTable } from '@/api/queue.js'
+import { useUser } from "@/store/user.js"
+const store = useUser()
+
+const emits = defineEmits(['success'])
+
+const showAddTable = ref(false)
+const addTabFormLoading = ref(false)
+const AddTabFormRef = ref(null)
+const resetAddTabForm = ref({})
+const addTabForm = ref({
+    name: '',
+    note: '',
+    waitTime: '',
+    prefix: '',
+    start: '',
+    isPostpone: 0,
+    nearNum: ''
+})
+
+const addTabFormRules = ref({
+    name: [
+        {
+            required: true,
+            message: ' ',
+            trigger: 'blur',
+        }
+    ],
+    waitTime: [
+        {
+            required: true,
+            message: ' ',
+            trigger: 'blur',
+        }
+    ],
+    prefix: [
+        {
+            required: true,
+            message: ' ',
+            trigger: 'blur',
+        }
+    ],
+    start: [
+        {
+            required: true,
+            message: ' ',
+            trigger: 'blur',
+        }
+    ],
+})
+
+// 初始化
+function addTabFormReset() {
+    addTabForm.value = { ...resetAddTabForm.value }
+    AddTabFormRef.value.resetFields()
+}
+
+// 提交
+function addTabConfirmHandle() {
+    AddTabFormRef.value.validate(async valid => {
+        try {
+            if (valid) {
+                addTabFormLoading.value = true
+                addTabForm.value.shopId = store.userInfo.shopId
+                if (addTabForm.value.id) {
+                    addTabForm.value.callTableId = addTabForm.value.id
+                }
+                const res = await addCallTable(addTabForm.value)
+                addTabFormLoading.value = false
+                showAddTable.value = false
+                ElMessage.success(addTabForm.value.id ? '编辑成功' : '添加成功')
+                emits('success')
+            }
+        } catch (error) {
+            addTabFormLoading.value = false
+            console.log(error);
+        }
+    })
+}
+
+function show(obj) {
+    if (obj && obj.id) {
+        addTabForm.value = { ...obj }
+    }
+    showAddTable.value = true
+}
+
+defineExpose({
+    show
+})
+
+onMounted(() => {
+    resetAddTabForm.value = { ...addTabForm.value }
+})
+</script>