updata：客服管理流程

src/views/PeopleManage/Customer/CustomerServiceAccount.vue

@@ -18,9 +18,10 @@ export default {
       dialogVisible: false,
       dialogType: 'add',
       uploadProgress: 0,
-      submitting: false,
       userLoading: false,
       defaultId: "",
+      //提交
+      submitLoading: false,
       // 表单数据
       form: {
         id: null,
@@ -38,7 +39,7 @@ export default {
       formData: {
         nickname: '',
         customerId: '',
-        dutyCustomerId: '',
+        dutyCustomerId: null,
         dutyDateTimeList: [{
           startTime: new Date().setHours(8, 30, 0),
           endTime: new Date().setHours(18, 30, 0)
@@ -70,7 +71,7 @@ export default {
       rules: {
         nickname: [
           {required: true, message: '请输入客服昵称', trigger: 'blur'},
-          {min: 2, max: 20, message: '长度在2到20个字符', trigger: 'blur'}
+          {min: 2, max: 16, message: '长度在2到16个字符', trigger: 'blur'}
         ],
         userId: [
           {required: true, message: '请选择后线人员', trigger: 'change'},
@@ -98,21 +99,19 @@ export default {
           this.pageResult = res.data
           this.queryCondition.pageNum = res.data.pageNum
           this.queryCondition.pageSize = res.data.pageSize
+        } else {
+          this.$message.error(res.msg)
         }
       })
     },
     findPage(data) {
-      if (data && data.pageRequest) {
+      if (data.pageRequest.pageNum !== this.queryCondition.pageNum) {
         this.queryCondition.pageNum = data.pageRequest.pageNum;
+      }
+      if (data.pageRequest.pageSize !== this.queryCondition.pageSize) {
         this.queryCondition.pageSize = data.pageRequest.pageSize;
       }
-      this.$api.customerManage.pageQuery(this.queryCondition).then((res) => {
-        if (res.code === 200) {
-          this.pageResult = res.data;
-        } else {
-          this.$message.error(res.msg)
-        }
-      });
+      this.queryPage();
     },
     // 删除客服
     deleteCustomer({row}) {
@@ -164,7 +163,14 @@ export default {
         });
       });
     },
-
+    handleClick() {
+      if (this.submitLoading) return;
+      this.submitLoading = true;
+      setTimeout(() => {
+        this.handleSubmit();
+        this.submitLoading = false;
+      }, 3000);
+    },
     // 打开弹窗（新增）
     handleAdd() {
       this.dialogType = 'add'
@@ -234,6 +240,11 @@ export default {
       try {
         const {data} = await this.$api.customerManage.getDeptUser(departmentId)
         this.wecomUsers = data
+        const isReceptionistId = this.wecomUsers.some(user => user.userId === this.form.receptionistId);
+        if (!isReceptionistId) {
+          this.form.receptionistId = null;
+          this.form.receptionist = null;
+        }
       } finally {
         this.userLoading = false
       }
@@ -290,32 +301,30 @@ export default {
       if (this.form.avatar == null || this.form.avatar.length === 0) {
         this.form.avatar = this.defaultId
       }
-        this.submitting = true
-        this.form.receptionist = this.wecomUsers.filter((item) => item.userId == this.form.receptionistId)[0].name
-        if (this.dialogType === 'add') {
-          this.$api.customerManage.addCustomer(this.form).then(res => {
-            if (res.code === 200) {
-              this.$message.success('操作成功')
-              this.$emit('success')
-              this.dialogVisible = false
-              this.queryPage()
-            } else {
-              this.$message.error(res.msg);
-            }
-          })
-        } else if (this.dialogType === 'edit') {
-          this.$api.customerManage.reviseCustomer(this.form.id, this.form).then(res => {
-            if (res.code === 200) {
-              this.$message.success('操作成功')
-              this.$emit('success')
-              this.dialogVisible = false
-              this.queryPage()
-            } else {
-              this.$message.error(res.msg);
-            }
-          })
-        }
-        this.submitting = false
+      this.form.receptionist = this.wecomUsers.filter((item) => item.userId == this.form.receptionistId)[0].name
+      if (this.dialogType === 'add') {
+        this.$api.customerManage.addCustomer(this.form).then(res => {
+          if (res.code === 200) {
+            this.$message.success('操作成功')
+            this.$emit('success')
+            this.dialogVisible = false
+            this.queryPage()
+          } else {
+            this.$message.error(res.msg);
+          }
+        })
+      } else if (this.dialogType === 'edit') {
+        this.$api.customerManage.reviseCustomer(this.form.id, this.form).then(res => {
+          if (res.code === 200) {
+            this.$message.success('操作成功')
+            this.$emit('success')
+            this.dialogVisible = false
+            this.queryPage()
+          } else {
+            this.$message.error(res.msg);
+          }
+        })
+      }
     },
     // 重置表单
     resetForm() {
@@ -336,7 +345,7 @@ export default {
       this.formData = {
         nickname: '',
         customerId: '',
-        dutyCustomerId: '',
+        dutyCustomerId: null,
         dutyDateTimeList: [{
           startTime: new Date().setHours(8, 30, 0),
           endTime: new Date().setHours(18, 30, 0)
@@ -358,11 +367,17 @@ export default {
     // 获取详情数据
     getDutyConfig(customerId) {
       this.$api.customerManage.getDutyConfig(customerId).then(res => {
-        this.formData.dutyCustomerId = Number(res.data.dutyCustomerId)
-        res.data.dutyDateTimeList.map(item => {
-          this.startTime = dayjs(item.startTime).valueOf()
-          this.endTime = dayjs(item.endTime).valueOf()
-        })
+        if (res.code === 200) {
+          const isReceptionistId = this.allServiceList.some(service => service.id === Number(res.data.dutyCustomerId));
+          if (isReceptionistId) {
+            this.formData.dutyCustomerId = Number(res.data.dutyCustomerId)
+          }
+
+          res.data.dutyDateTimeList.map(item => {
+            this.startTime = dayjs(item.startTime).valueOf()
+            this.endTime = dayjs(item.endTime).valueOf()
+          })
+        }
         this.formData.dutyDateTimeList = res.data.dutyDateTimeList
       })
     },
@@ -405,7 +420,6 @@ export default {
     handleConfirm() {
       // 数据校验
       if (!this.validateTime()) return;
-
       // 提交逻辑（示例）
       this.$api.customerManage.dutyConfig(this.dutyConfigData())
         .then((res) => {
@@ -425,6 +439,14 @@ export default {
     // 时间有效性校验
     validateTime() {
       for (const time of this.formData.dutyDateTimeList) {
+        if(time.startTime === null){
+          this.$message.error('开始时间必填');
+          return false;
+        }
+        if(time.endTime === null){
+          this.$message.error('结束时间必填');
+          return false;
+        }
         if (new Date(time.startTime) >= new Date(time.endTime)) {
           this.$message.error('结束时间必须晚于开始时间');
           return false;
@@ -559,15 +581,16 @@ export default {
         <el-button @click="dialogVisible = false">取 消</el-button>
         <el-button
           type="primary"
-          :loading="submitting"
-          @click="handleSubmit">
+          :disabled="submitLoading"
+          @click="handleClick">
           确 定
         </el-button>
       </div>
     </el-dialog>
 
     <!-- 值班客服配置 -->
-    <el-dialog :visible.sync="dialogVisibleDuty" title="值班配置" :close-on-click-modal="false">
+    <el-dialog :visible.sync="dialogVisibleDuty" title="值班配置"
+               :close-on-click-modal="false">
       <el-form :model="formData" label-width="100px" label-position="right">
         <!-- 当前客服（只读） -->
         <el-form-item label="当前客服">