feat:自提点

src/views/mch/mch-pick-up/form.vue

@@ -22,7 +22,7 @@
 
         <el-col :span="24" class="mb20">
           <el-form-item label="营业时间" prop="businessHoursJson">
-            <el-input v-model="form.businessHoursJson" placeholder="请输入营业时间" />
+            <BusinessHours v-model="form.businessHoursJson" />
           </el-form-item>
         </el-col>
 
@@ -63,10 +63,17 @@
 </template>
 
 <script setup lang="ts" name="MchPickUpDialog">
-import { useDict } from '/@/hooks/dict';
 import { useMessage } from "/@/hooks/message";
 import * as mchPickUpApi from '/@/api/wallet/mch-pick-up'
-import { rule } from '/@/utils/validate';
+import BusinessHours from '/@/components/BusinessHours/index.vue'
+
+// 定义营业时间接口
+interface BusinessHour {
+  id: string
+  title: string
+  startTime: string
+  endTime: string
+}
 const emit = defineEmits(['refresh']);
 
 // 定义变量内容
@@ -86,7 +93,7 @@ const form = reactive({
   latitude: '',
   longitude: '',
   detailAddress: '',
-  businessHoursJson: '',
+  businessHoursJson: [] as BusinessHour[],
   mchIds: [],
 });
 
@@ -95,16 +102,17 @@ const dataRules = ref({
   name: [{ required: true, message: "门店名称不能为空", trigger: "blur" }],
 })
 
+
 // 打开弹窗
 const openDialog = (id: string) => {
   visible.value = true
   form.id = ''
-
   // 重置表单数据
   nextTick(() => {
     dataFormRef.value?.resetFields();
   });
-
+  // 重置营业时间数据
+  form.businessHoursJson = []
   // 获取mchPickUp信息
   if (id) {
     form.id = id
@@ -118,7 +126,11 @@ const onSubmit = async () => {
   if (!valid) return false;
   try {
     loading.value = true;
-    form.id ? await mchPickUpApi.putObj(form) : await mchPickUpApi.addObj(form);
+    const _data: any = { ...form }
+    if (_data.businessHoursJson && _data.businessHoursJson.length) {
+      _data.businessHoursJson = JSON.stringify(_data.businessHoursJson)
+    }
+    form.id ? await mchPickUpApi.putObj(_data) : await mchPickUpApi.addObj(_data);
     useMessage().success(form.id ? '修改成功' : '添加成功');
     visible.value = false;
     emit('refresh');
@@ -136,6 +148,14 @@ const getmchPickUpData = (id: string) => {
   loading.value = true
   mchPickUpApi.getObj(id).then((res: any) => {
     Object.assign(form, res.data)
+    if (res.data.businessHoursJson) {
+      try {
+        form.businessHoursJson = JSON.parse(res.data.businessHoursJson)
+      } catch (error) {
+        console.warn('解析营业时间JSON失败:', error)
+        form.businessHoursJson = []
+      }
+    }
   }).finally(() => {
     loading.value = false
   })

src/views/mch/mch-pick-up/index.vue

@@ -54,7 +54,17 @@
           </template>
         </el-table-column>
         <el-table-column prop="detailAddress" label="门店详细地址" show-overflow-tooltip />
-        <el-table-column prop="businessHoursJson" label="营业时间" show-overflow-tooltip />
+        <el-table-column prop="businessHoursJson" label="营业时间">
+          <template #default="{ row }">
+            <div v-for="v in JSON.parse(row.businessHoursJson)" :key="v">
+              <span>{{ v.title }}</span>
+              <span>:</span>
+              <span>{{ v.startTime }}</span>
+              <span>-</span>
+              <span>{{ v.endTime }}</span>
+            </div>
+          </template>
+        </el-table-column>
         <el-table-column label="操作" width="150">
           <template #default="scope">
             <el-button icon="edit-pen" text type="primary" v-auth="'mch_mchPickUp_edit'"