updata：客服管理流程

src/views/PeopleManage/Customer/CustomerServiceAccount.vue

@@ -64,7 +64,7 @@ export default {
         {prop: "userId", label: "工号"},
         {prop: "receptionist", label: "企微用户"},
         {prop: "dutyCustomer", label: "值班客服"},
-        {prop: "dutyDatetime", label: "值班时间"},
+        {prop: "dutyDatetime", label: "值班时间", minWidth: 200, formatter: this.dutyDatetimeFormatter},
       ],
 
       rules: {
@@ -112,19 +112,53 @@ export default {
     },
     // 删除客服
     deleteCustomer({row}) {
-      this.$api.customerManage.deleteCustomer(row.id).then((res) => {
-        if (res.code === 200) {
-          this.$message("删除成功")
-        }
-      })
+      this.$confirm('此操作将永久删除客服, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$api.customerManage.deleteCustomer(row.id).then((res) => {
+          if (res.code === 200) {
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            });
+            this.queryPage();
+          } else {
+            this.$message.error(res.msg);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消删除'
+        });
+      });
     },
     // 清除值班配置
     clearDutyConfig({row}) {
-      this.$api.customerManage.clearDutyConfig(row.id).then((res) => {
-        if (res.code === 200) {
-          this.$message("清除值班配置成功")
-        }
-      })
+      this.$confirm('此操作将永久清除值班配置, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.$api.customerManage.clearDutyConfig(row.id).then((res) => {
+          if (res.code === 200) {
+            this.$message({
+              type: 'success',
+              message: '清除成功!'
+            });
+            this.queryPage();
+          } else {
+            this.$message.error(res.msg);
+          }
+        })
+      }).catch(() => {
+        this.$message({
+          type: 'info',
+          message: '已取消清除'
+        });
+      });
     },
 
     // 打开弹窗（新增）
@@ -147,6 +181,13 @@ export default {
     imgFormatter(row) {
       return <img src={"" + process.env.BASE_URL + row.avatarUrl + ""} style="width: 74px; height: 74px"></img>;
     },
+    dutyDatetimeFormatter(row) {
+      if (row.dutyDatetime != null && row.dutyDatetime.length > 0) {
+        return row.dutyDatetime.map(x => {
+          return <el-tag>{x} </el-tag>
+        })
+      }
+    },
     // 加载编辑数据
     loadEditData(data) {
       this.loadDepartment()
@@ -169,7 +210,7 @@ export default {
     // 加载后线人员选项
     async loadBackendOptions() {
       if (this.backendOptions.length) return
-      const {data} = await this.$api.user.findBackListByDeptId(99)
+      const {data} = await this.$api.user.findHxUserList()
       this.backendOptions = data
     },
     // 部门加载
@@ -321,8 +362,8 @@ export default {
         customerId: this.formData.customerId,
         dutyCustomerId: this.formData.dutyCustomerId,
         dutyDateTimeList: this.formData.dutyDateTimeList.map(t => ({
-          startTime: dayjs(t.start).format('YYYY-MM-DD HH:mm:ss'),
-          endTime: dayjs(t.end).format('YYYY-MM-DD HH:mm:ss')
+          startTime: dayjs(t.startTime).format('YYYY-MM-DD HH:mm:ss'),
+          endTime: dayjs(t.endTime).format('YYYY-MM-DD HH:mm:ss')
         }))
       }
     },
@@ -333,18 +374,19 @@ export default {
 
       // 提交逻辑（示例）
       this.$api.customerManage.dutyConfig(this.dutyConfigData())
-        .then((res) => {
-          if (res.code === 200) {
-            this.$message.success('保存成功');
-            this.dialogVisibleDuty = false;
+          .then((res) => {
+            if (res.code === 200) {
+              this.$message.success('保存成功');
+              this.dialogVisibleDuty = false;
+              this.queryPage()
+            } else {
+              this.$message.error(res.msg);
+            }
             this.queryPage()
-          } else {
-            this.$message.error(res.msg);
-          }
-        })
-        .catch(error => {
-          this.$message.error(`保存失败: ${error.message}`);
-        });
+          })
+          .catch(error => {
+            this.$message.error(`保存失败: ${error.message}`);
+          });
     },
 
     // 时间有效性校验
@@ -383,11 +425,12 @@ export default {
           </el-col>
         </el-row>
       </el-form>
-      <kt-common-table :showBatchDelete="false" :data="pageResult" :columns="columns" @findPage="findPage"
-                       button2Name="编辑" @handleButton2="handleEdit"
-                       button3Name="删除" @handleButton3="deleteCustomer"
-                       button4Name="值班配置" @handleButton4="openDialog"
-                       button5Name="清除值班配置" @handleButton5="clearDutyConfig"
+      <kt-common-table :showBatchDelete="false" :data="pageResult" :operationWidth="250" :columns="columns"
+                       @findPage="findPage"
+                       button2Name="编辑" @handleButton2="handleEdit" button2Type="text"
+                       button3Name="删除" @handleButton3="deleteCustomer" button3Type="text"
+                       button4Name="值班配置" @handleButton4="openDialog" button4Type="text"
+                       button5Name="清除值班配置" @handleButton5="clearDutyConfig" button5Type="text"
       >
       </kt-common-table>
 
@@ -395,39 +438,39 @@ export default {
 
     <!-- 弹窗主体 -->
     <el-dialog
-      :title="dialogType === 'add' ? '新增客服' : '编辑客服'"
-      :visible.sync="dialogVisible"
-      width="700px"
-      @closed="handleClose">
+        :title="dialogType === 'add' ? '新增客服' : '编辑客服'"
+        :visible.sync="dialogVisible"
+        width="700px"
+        @closed="handleClose">
       <el-form
-        ref="formRef"
-        :model="form"
-        :rules="rules"
-        label-width="100px"
-        label-position="right">
+          ref="formRef"
+          :model="form"
+          :rules="rules"
+          label-width="100px"
+          label-position="right">
 
         <!-- 客服昵称 -->
         <el-form-item label="客服昵称" prop="nickname">
           <el-input
-            v-model="form.nickname"
-            placeholder="请输入2-20个字符"
-            clearable
-            maxlength="20"/>
+              v-model="form.nickname"
+              placeholder="请输入2-20个字符"
+              clearable
+              maxlength="20"/>
         </el-form-item>
 
         <!-- 客服头像 -->
         <el-form-item label="客服头像" prop="avatar">
           <el-upload
-            style="margin-bottom: 10px"
-            class="upload-demo"
-            action="#"
-            :limit="1"
-            accept=".png, .jpg, .jpeg"
-            :auto-upload="false"
-            :on-change="imageUpload"
-            :show-file-list="false"
-            list-type="picture-card"
-            ref="upload1"
+              style="margin-bottom: 10px"
+              class="upload-demo"
+              action="#"
+              :limit="1"
+              accept=".png, .jpg, .jpeg"
+              :auto-upload="false"
+              :on-change="imageUpload"
+              :show-file-list="false"
+              list-type="picture-card"
+              ref="upload1"
           >
             <img v-if="imageUrl" :src="imageUrl" class="avatar" style="width: 148px; height: 148px" alt=""/>
             <i v-else class="el-icon-plus avatar-uploader-icon"></i>
@@ -438,43 +481,43 @@ export default {
         <!-- 后线人员 -->
         <el-form-item label="后线人员" prop="userId">
           <el-select
-            v-model="form.userId"
-            filterable
-            clearable
-            placeholder="请选择后线人员"
-            @focus="loadBackendOptions">
+              v-model="form.userId"
+              filterable
+              clearable
+              placeholder="请选择后线人员"
+              @focus="loadBackendOptions">
             <el-option
-              v-for="item in backendOptions"
-              :key="item.id"
-              :label="item.name"
-              :value="item.id"/>
+                v-for="item in backendOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"/>
           </el-select>
         </el-form-item>
 
         <!-- 企微部门树 -->
         <el-form-item label="企微部门" prop="departmentId">
           <el-tree
-            ref="deptTree"
-            :data="departmentTree"
-            :props="treeProps"
-            node-key="deptId"
-            highlight-current
-            @node-click="handleDeptClick"/>
+              ref="deptTree"
+              :data="departmentTree"
+              :props="treeProps"
+              node-key="deptId"
+              highlight-current
+              @node-click="handleDeptClick"/>
         </el-form-item>
 
         <!-- 企微用户 -->
         <el-form-item label="企微用户" prop="receptionistId">
           <el-select
-            v-model="form.receptionistId"
-            :loading="userLoading"
-            filterable
-            clearable
-            placeholder="请先选择企微用户">
+              v-model="form.receptionistId"
+              :loading="userLoading"
+              filterable
+              clearable
+              placeholder="请先选择企微用户">
             <el-option
-              v-for="user in wecomUsers"
-              :key="user.userId"
-              :label="user.name"
-              :value="user.userId"/>
+                v-for="user in wecomUsers"
+                :key="user.userId"
+                :label="user.name"
+                :value="user.userId"/>
           </el-select>
         </el-form-item>
       </el-form>
@@ -482,9 +525,9 @@ export default {
       <div slot="footer" class="dialog-footer">
         <el-button @click="dialogVisible = false">取 消</el-button>
         <el-button
-          type="primary"
-          :loading="submitting"
-          @click="handleSubmit">
+            type="primary"
+            :loading="submitting"
+            @click="handleSubmit">
           确 定
         </el-button>
       </div>
@@ -502,10 +545,10 @@ export default {
         <el-form-item label="值班客服">
           <el-select v-model="formData.dutyCustomerId" placeholder="请选择">
             <el-option
-              v-for="item in allServiceList"
-              :key="item.id"
-              :label="item.nickname"
-              :value="item.id">
+                v-for="item in allServiceList"
+                :key="item.id"
+                :label="item.nickname"
+                :value="item.id">
             </el-option>
           </el-select>
         </el-form-item>
@@ -513,33 +556,33 @@ export default {
         <!-- 值班时间列表 -->
         <el-form-item label="值班时间" v-for="(time, index) in formData.dutyDateTimeList" :key="index">
           <el-date-picker
-            v-model="time.startTime"
-            type="datetime"
-            format="yyyy-MM-dd HH:mm:ss"
-            placeholder="开始时间">
+              v-model="time.startTime"
+              type="datetime"
+              format="yyyy-MM-dd HH:mm:ss"
+              placeholder="开始时间">
           </el-date-picker>
           <span>至</span>
           <el-date-picker
-            v-model="time.endTime"
-            type="datetime"
-            format="yyyy-MM-dd HH:mm:ss"
-            placeholder="结束时间">
+              v-model="time.endTime"
+              type="datetime"
+              format="yyyy-MM-dd HH:mm:ss"
+              placeholder="结束时间">
           </el-date-picker>
           <!-- 删除按钮（首行隐藏） -->
           <el-button
-            v-if="index !== 0"
-            @click="removeTime(index)"
-            icon="el-icon-close"
-            circle>
+              v-if="index !== 0"
+              @click="removeTime(index)"
+              icon="el-icon-close"
+              circle>
           </el-button>
         </el-form-item>
 
         <!-- 添加按钮（动态隐藏） -->
         <el-button
-          v-if="showAddButton"
-          @click="addTime"
-          type="text"
-          icon="el-icon-plus">
+            v-if="showAddButton"
+            @click="addTime"
+            type="text"
+            icon="el-icon-plus">
           添加值班时间
         </el-button>
       </el-form>