From 8d0b878eec9639fb34b86f7b51c68fad9e433ba1 Mon Sep 17 00:00:00 2001
From: xuyuncong <3422692813@qq.com>
Date: Wed, 15 Oct 2025 17:39:54 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/company/businessChannel/index.vue | 891 ++++++++++++++------
 src/views/repair/staff/index.vue            |   5 -
 2 files changed, 611 insertions(+), 285 deletions(-)

diff --git a/src/views/company/businessChannel/index.vue b/src/views/company/businessChannel/index.vue
index c5b220a..5c9d8a2 100644
--- a/src/views/company/businessChannel/index.vue
+++ b/src/views/company/businessChannel/index.vue
@@ -1,296 +1,627 @@
-<template>
-  <div class="app-container">
-    <doc-alert title="功能权限" url="https://doc.iocoder.cn/resource-permission"/>
-    <doc-alert title="菜单路由" url="https://doc.iocoder.cn/vue2/route/"/>
-    <!-- 搜索工作栏 -->
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
-      <el-form-item label="菜单名称" prop="name">
-        <el-input v-model="queryParams.name" placeholder="请输入菜单名称" clearable @keyup.enter.native="handleQuery"/>
-      </el-form-item>
-      <el-form-item>
-        <el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
-        <el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
-      </el-form-item>
-    </el-form>
+  <template>
+    <div class="app-container">
+      <el-card>
+        <!-- 搜索区域 -->
+        <div style="display: flex; justify-content: space-between; align-items: center;">
+          <div class="filter-container">
+            <el-input
+              v-model="listQuery.name"
+              placeholder="业务渠道名称"
+              style="width: 200px;"
+              class="filter-item"
+              @keyup.enter.native="handleFilter"
+            />
+            <el-button
+              class="filter-item"
+              type="primary"
+              icon="el-icon-search"
+              @click="handleFilter"
+            >
+              搜索
+            </el-button>
+            <el-button
+              class="filter-item"
+              style="margin-left: 10px;"
+              type="primary"
+              icon="el-icon-plus"
+              @click="handleAdd"
+            >
+              新增业务渠道
+            </el-button>
+          </div>
+          <div class="filter-container">
+            <el-button
+              class="filter-item"
+              style="margin-left: auto;"
+              icon="el-icon-refresh"
+              :loading="refreshing"
+              :disabled="refreshing"
+              @click="handleRefresh"
+            />
+          </div>
+        </div>
 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增
-        </el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button type="info" plain icon="el-icon-sort" size="mini" @click="toggleExpandAll">展开/折叠</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row>
+        <!-- 表格 -->
+        <el-table
+          :data="menuList"
+          border
+          fit
+          highlight-current-row
+          style="width: 100%; margin-top: 20px;"
+          :expand-row-keys="expandedRows"
+          @expand-change="handleExpandChange"
+        >
+          <el-table-column type="expand">
+            <template slot-scope="{row}">
+              <div class="source-container">
+                <div class="source-header">
+                  <span class="source-title">子项列表</span>
+                  <el-button
+                    type="primary"
+                    size="medium"
+                    icon="el-icon-plus"
+                    @click="handleAddChild(row)"
+                  >
+                    添加子项
+                  </el-button>
+                </div>
+                <el-table
+                  :data="row.children || []"
+                  size="medium"
+                  style="width: 100%; margin-top: 10px;"
+                  v-loading="row.loading"
+                  border
+                >
+                  <el-table-column label="名称" prop="name">
+                    <template slot-scope="{row: child}">
+                      <span class="bold-text">{{ child.name }}</span>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="类型" width="120">
+                    <template slot-scope="{row: child}">
+                      <el-tag 
+                        :type="child.type === 0 ? 'primary' : 'success'" 
+                        size="small"
+                      >
+                        {{ child.type === 0 ? '业务渠道' : '客户来源' }}
+                      </el-tag>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                    <template slot-scope="{row: child}">
+                      <el-button
+                        type="primary"
+                        size="small"
+                        icon="el-icon-edit"
+                        @click="handleUpdate(child)"
+                      >
+                        编辑
+                      </el-button>
+                      <el-button
+                        type="danger"
+                        size="small"
+                        icon="el-icon-delete"
+                        @click="handleDelete(child)"
+                      >
+                        删除
+                      </el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </template>
+          </el-table-column>
 
-    <el-table v-if="refreshTable" v-loading="loading" :data="menuList" row-key="id" :default-expand-all="isExpandAll"
-              :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
-      <el-table-column prop="name" label="名称" :show-overflow-tooltip="true" width="250"></el-table-column>
-      <el-table-column prop="type" label="类型" width="100">
-        <template v-slot="scope">
-          <span>
-            {{ scope.row.type === 0 ? '业务渠道' : scope.row.type === 1 ? '客户来源' : '未知类型' }}
-          </span>
-        </template>
-      </el-table-column>
-      <el-table-column prop="sort" label="排序" width="100">
-        <template v-slot="scope">
-          <el-input v-model="scope.row.sort" @change="updateSort(scope.row)"></el-input>
-        </template>
-      </el-table-column>
+          <el-table-column label="渠道名称" prop="name">
+            <template slot-scope="{row}">
+              <div class="tree-node-content">
+                <!-- 对于顶级业务渠道，添加拖拽手柄 -->
+                <span 
+                  class="drag-handle" 
+                  :draggable="true"
+                  @dragstart="handleDragStart($event, row)"
+                  @dragover="handleDragOver($event)"
+                  @dragenter="handleDragEnter($event)"
+                  @drop="handleDrop($event, row)"
+                  @dragend="handleDragEnd"
+                >
+                  <i class="el-icon-rank"></i>
+                </span>
+                <span class="bold-text">{{ row.name }}</span>
+              </div>
+            </template>
+            <template slot="header">
+              <span class="bold-header">渠道名称</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="类型" width="120">
+            <template slot-scope="{row}">
+              <el-tag 
+                :type="row.type === 0 ? 'primary' : 'success'" 
+                size="small"
+              >
+                {{ row.type === 0 ? '业务渠道' : '客户来源' }}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+            <template slot-scope="{row}">
+              <el-button
+                type="primary"
+                size="small"
+                icon="el-icon-edit"
+                @click="handleUpdate(row)"
+              >
+                编辑
+              </el-button>
+              <el-button
+                type="danger"
+                size="small"
+                icon="el-icon-delete"
+                @click="handleDelete(row)"
+              >
+                删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
 
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-        <template v-slot="scope">
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改
+        <!-- 分页 -->
+        <pagination
+          v-show="total>0"
+          :total="total"
+          :page.sync="listQuery.page"
+          :limit.sync="listQuery.limit"
+          @pagination="getList"
+        />
+      </el-card>
+
+      <!-- 业务渠道对话框 -->
+      <el-dialog
+        :title="dialogTitle"
+        :visible.sync="dialogVisible"
+        width="500px"
+      >
+        <el-form
+          ref="form"
+          :rules="rules"
+          :model="form"
+          label-position="left"
+          label-width="80px"
+          style="width: 400px; margin-left:50px;"
+        >
+          <el-form-item label="名称" prop="name">
+            <el-input v-model="form.name" />
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">
+            取消
           </el-button>
-          <el-button size="mini" v-if="scope.row.pid == 0" type="text" icon="el-icon-plus"
-                     @click="handleAdd(scope.row)">新增
+          <el-button type="primary" @click="save">
+            确认
           </el-button>
-          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除
-          </el-button>
-        </template>
-      </el-table-column>
-    </el-table>
+        </div>
+      </el-dialog>
+    </div>
+  </template>
 
-    <!-- 添加或修改菜单对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="名称" prop="name">
-              <el-input v-model="form.name" placeholder="请输入名称"/>
-            </el-form-item>
-          </el-col>
-<!--          <el-col :span="12" v-if="form.pid !=  0">-->
-<!--            <el-form-item label="人员" prop="postId">-->
-<!--              <el-select multiple filterable v-model="form.userIdList" placeholder="请选择人员">-->
-<!--                <el-option v-for="item in staffList" :key="item.id" :label="item.nickname" :value="item.id"/>-->
-<!--              </el-select>-->
-<!--            </el-form-item>-->
-<!--          </el-col>-->
-        </el-row>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitForm">确 定</el-button>
-        <el-button @click="cancel">取 消</el-button>
-      </div>
-    </el-dialog>
-  </div>
-</template>
+  <script>
+  import Pagination from '@/components/Pagination'
+  import { 
+    listBusiness, 
+    getBusiness, 
+    addBusiness, 
+    updateBusiness, 
+    delBusiness 
+  } from './api'
+  import { getLastPathSegment } from "@/utils/ruoyi"
 
-<script>
-import Treeselect from "@riophae/vue-treeselect";
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";
-import IconSelect from "@/components/IconSelect";
-
-import {getDictDatas, DICT_TYPE} from '@/utils/dict'
-import {
-  addBusiness,
-  delBusiness,
-  getBusiness,
-  listBusiness,
-  updateBusiness
-} from "@/views/company/businessChannel/api";
-import {listUser} from "@/views/inspection/staff/api/staff";
-import {getLastPathSegment} from "@/utils/ruoyi";
-
-export default {
-  name: "BusinessChannel",
-  components: {Treeselect, IconSelect},
-  data() {
-    return {
-      // 遮罩层
-      loading: true,
-      // 显示搜索条件
-      showSearch: true,
-      // 菜单表格树数据
-      menuList: [],
-      staffList: [],
-      // 菜单树选项
-      menuOptions: [],
-      // 弹出层标题
-      title: "",
-      // 是否显示弹出层
-      open: false,
-      // 是否展开，默认全部折叠
-      isExpandAll: false,
-      // 重新渲染表格状态
-      refreshTable: true,
-      // 查询参数
-      queryParams: {
-        name: undefined,
-        visible: undefined,
-        systemCode: undefined
-      },
-      // 表单参数
-      form: {},
-      // 表单校验
-      rules: {
-      },
-      // 数据字典
-      menuTypeDictDatas: getDictDatas(DICT_TYPE.SYSTEM_MENU_TYPE),
-      statusDictDatas: getDictDatas("ins_business")
-    };
-  },
-  created() {
-    const servicePackageId = getLastPathSegment(this.$route.path); // 默认为最后一段
-    console.log('服务套餐', servicePackageId)
-    this.queryParams.systemCode = servicePackageId;
-    this.getList();
-    this.getStaff();
-  },
-  methods: {
-    // 选择图标
-    selected(name) {
-      this.form.icon = name;
-    },
-    /** 查询菜单列表 */
-    getList() {
-      this.loading = true;
-      listBusiness(this.queryParams).then(response => {
-        this.menuList = this.handleTree(response.data, "id", "pid");
-        this.loading = false;
-      });
-    },
-    getStaff() {
-      const params = {
-        pageNo: 1,
-        pageSize: 99999
+  export default {
+    name: 'BusinessChannel',
+    components: { Pagination },
+    filters: {
+      parseTime(time) {
+        if (!time) return ''
+        return new Date(time).toLocaleString()
       }
-      listUser(params).then(response => {
-        this.staffList = response.data.records;
-      });
     },
-    /** 转换菜单数据结构 */
-    normalizer(node) {
-      if (node.children && !node.children.length) {
-        delete node.children;
-      }
+    data() {
       return {
-        id: node.id,
-        label: node.name,
-        children: node.children
-      };
-    },
-    /** 查询菜单下拉树结构 */
-    getTreeselect() {
-      listBusiness().then(response => {
-        this.menuOptions = [];
-        const menu = {id: 0, name: '主类目', children: []};
-        if (!Array.isArray(response.data)) {
-          console.warn("handleTree error: data 不是数组", response.data);
-          return;
-        }
-
-        if (response.data.length === 0) {
-          console.warn("handleTree warning: data 是空数组");
-          return;
-        }
-
-// data 合法，继续处理
-        debugger
-        menu.children = this.handleTree(response.data, "id", 'pid');
-        this.menuOptions.push(menu);
-
-      });
-    },
-    // 修改排序
-    updateSort(data) {
-      updateBusiness(data).then(response => {
-        this.$modal.msgSuccess("修改成功");
-        this.getList();
-      });
-    },
-    // 取消按钮
-    cancel() {
-      this.open = false;
-      this.reset();
-    },
-    // 表单重置
-    reset() {
-      this.form = {
-        id: undefined,
-        pid: 0,
-        name: undefined,
-        type: undefined,
-      };
-      this.resetForm("form");
-    },
-    /** 搜索按钮操作 */
-    handleQuery() {
-      this.getList();
-    },
-    /** 重置按钮操作 */
-    resetQuery() {
-      this.resetForm("queryForm");
-      this.handleQuery();
-    },
-    /** 展开/折叠操作 */
-    toggleExpandAll() {
-      this.refreshTable = false;
-      this.isExpandAll = !this.isExpandAll;
-      this.$nextTick(() => {
-        this.refreshTable = true;
-      });
-    },
-    /** 新增按钮操作 */
-    handleAdd(row) {
-      this.reset();
-      this.getTreeselect();
-      if (row != null && row.id) {
-        this.form.pid = row.id;
-        this.form.type = 1;
-        this.title = "添加客户来源";
-      } else {
-        this.form.pid = 0;
-        this.form.type = 0;
-        this.title = "添加业务渠道";
+        // 列表数据
+        list: [],
+        menuList: [],
+        total: 0,
+        listQuery: {
+          page: 1,
+          limit: 20,
+          name: undefined,
+          systemCode: undefined
+        },
+        // 展开行
+        expandedRows: [],
+        // 表单数据
+        form: {
+          id: undefined,
+          pid: 0,
+          name: '',
+          type: 0
+        },
+        // 对话框状态
+        dialogVisible: false,
+        dialogTitle: '',
+        refreshing: false,
+        loading: false,
+        // 表单验证规则
+        rules: {
+          name: [{ required: true, message: '名称不能为空', trigger: 'blur' }]
+        },
+        // 拖拽相关
+        dragNode: null,
+        dragState: 'normal',
+        dragTargetNode: null
       }
-      this.open = true;
     },
-    /** 修改按钮操作 */
-    handleUpdate(row) {
-      this.reset();
-      this.getTreeselect();
-      getBusiness(row.id).then(response => {
-        this.form = response.data;
-        this.open = true;
-        this.title = "修改";
-      });
+    created() {
+      const servicePackageId = getLastPathSegment(this.$route.path);
+      this.listQuery.systemCode = servicePackageId;
+      this.getList()
     },
-    /** 提交按钮 */
-    submitForm: function () {
-      this.$refs["form"].validate(valid => {
-        this.form.systemCode = this.queryParams.systemCode;
-        if (valid) {
-          // 提交
-          if (this.form.id !== undefined) {
-            updateBusiness(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
-              this.open = false;
-              this.getList();
-            });
-          } else {
-            addBusiness(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
-              this.open = false;
-              this.getList();
-            });
-          }
+    methods: {
+      // 获取数据列表
+      async getList() {
+        this.loading = true
+        try {
+          const response = await listBusiness(this.listQuery)
+          this.menuList = this.handleTree(response.data, "id", "pid")
+          this.total = response.data.length || 0
+          console.log('menuList:', this.menuList);
+          
+          // 确保所有展开行都被关闭
+          this.expandedRows = []
+        } catch (error) {
+          console.error('获取列表失败:', error)
+        } finally {
+          this.loading = false
         }
-      });
-    },
-    /** 删除按钮操作 */
-    handleDelete(row) {
-      this.$modal.confirm('是否确认删除名称为"' + row.name + '"的数据项?').then(function () {
-        return delBusiness(row.id);
-      }).then(() => {
-        this.getList();
-        this.$modal.msgSuccess("删除成功");
-      }).catch(() => {
-      });
+      },
+      
+      // // 处理树形结构
+      // handleTree(data, id, parentId, children) {
+      //   const result = [];
+      //   const hash = {};
+      //   const len = data.length;
+
+      //   for (let i = 0; i < len; i++) {
+      //     hash[data[i][id]] = data[i];
+      //   }
+
+      //   for (let i = 0; i < len; i++) {
+      //     const parent = hash[data[i][parentId]];
+      //     if (parent) {
+      //       !parent[children] && (parent[children] = []);
+      //       parent[children].push(data[i]);
+      //     } else {
+      //       result.push(data[i]);
+      //     }
+      //   }
+      //   return result;
+      // },
+
+      // 展开/折叠事件处理
+      handleExpandChange(row, expandedRows) {
+        // 可以在这里添加加载子项的逻辑
+      },
+      
+      // 搜索
+      handleFilter() {
+        this.listQuery.page = 1
+        // 关闭所有展开行
+        this.expandedRows = []
+        this.getList()
+      },
+      
+      // 刷新
+      async handleRefresh() {
+        this.refreshing = true
+        try {
+          await this.getList()
+          this.$message.success('刷新成功')
+        } catch (error) {
+          console.error('刷新失败:', error)
+        } finally {
+          this.refreshing = false
+        }
+      },
+      
+      // 新增业务渠道
+      handleAdd() {
+        this.form = {
+          id: undefined,
+          pid: 0,
+          name: '',
+          type: 0
+        }
+        this.dialogTitle = '新增业务渠道'
+        this.dialogVisible = true
+        this.$nextTick(() => {
+          this.$refs.form?.clearValidate()
+        })
+      },
+      
+      // 新增子项
+      handleAddChild(row) {
+        this.form = {
+          id: undefined,
+          pid: row.id,
+          name: '',
+          type: 1
+        }
+        this.dialogTitle = '添加子项'
+        this.dialogVisible = true
+        this.$nextTick(() => {
+          this.$refs.form?.clearValidate()
+        })
+      },
+      
+      // 编辑
+      handleUpdate(row) {
+        this.form = { ...row }
+        this.dialogTitle = '编辑'
+        this.dialogVisible = true
+        this.$nextTick(() => {
+          this.$refs.form?.clearValidate()
+        })
+      },
+      
+      // 保存
+      async save() {
+        this.$refs.form.validate(async(valid) => {
+          if (valid) {
+            try {
+              this.form.systemCode = this.listQuery.systemCode;
+              if (this.form.id) {
+                await updateBusiness(this.form)
+              } else {
+                await addBusiness(this.form)
+              }
+              this.dialogVisible = false
+              this.$message.success('保存成功')
+              this.getList()
+            } catch (error) {
+              console.error('保存失败:', error)
+            }
+          }
+        })
+      },
+      
+      // 删除
+      async handleDelete(row) {
+        this.$confirm(`确定要删除"${row.name}"吗?`, '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(async() => {
+          try {
+            await delBusiness(row.id)
+            this.$message.success('删除成功!')
+            this.getList()
+          } catch (error) {
+            console.error('删除失败:', error)
+          }
+        }).catch(() => {})
+      },
+      
+      // 处理拖拽开始
+      handleDragStart(event, row) {
+        // 保存被拖拽的节点信息
+        this.dragNode = row
+        this.dragState = 'dragging'
+        // 设置拖拽数据
+        event.dataTransfer.setData('application/json', JSON.stringify(row))
+        // 设置拖拽效果
+        event.dataTransfer.effectAllowed = 'move'
+        // 添加拖动中的样式
+        setTimeout(() => {
+          if (event.target) {
+            event.target.classList.add('dragging')
+          }
+        }, 0)
+      },
+
+      // 处理拖拽结束
+      handleDragEnd(event) {
+        // 移除拖动中的样式
+        if (event.target) {
+          event.target.classList.remove('dragging')
+        }
+        
+        // 重置拖拽状态
+        setTimeout(() => {
+          this.dragNode = null
+          this.dragTargetNode = null
+          this.dragState = 'normal'
+        }, 300)
+      },
+
+      // 处理拖拽放置
+      handleDrop(event, targetRow) {
+        // 防止默认行为和冒泡
+        event.preventDefault()
+        event.stopPropagation()
+        
+        // 确保只处理顶级节点间的拖拽（pid === 0）
+        if (targetRow.pid !== 0 || !this.dragNode || this.dragNode.id === targetRow.id) {
+          return
+        }
+        
+        try {
+          this.dragTargetNode = targetRow
+          
+          // 获取拖拽节点和目标节点在数组中的位置
+          const dragIndex = this.menuList.findIndex(item => item.id === this.dragNode.id)
+          const targetIndex = this.menuList.findIndex(item => item.id === targetRow.id)
+          
+          if (dragIndex === -1 || targetIndex === -1) return
+          
+          // 重新排序数据
+          const newList = [...this.menuList]
+          newList.splice(dragIndex, 1)
+          newList.splice(targetIndex, 0, this.dragNode)
+          
+          // 更新排序值，使用10的倍数以便后续插入
+          const updateList = newList.map((item, index) => ({
+            id: item.id,
+            sort: (index + 1) * 10,
+            // 保留其他必要字段
+            pid: item.pid,
+            name: item.name,
+            type: item.type,
+            systemCode: this.listQuery.systemCode
+          }))
+          
+          // 批量更新排序
+          this.batchUpdateSort(updateList)
+          
+          this.dragState = 'success'
+        } catch (error) {
+          console.error('拖拽排序出错:', error)
+          this.dragState = 'error'
+          this.$message.error('排序失败，请重试')
+        }
+      },
+
+      // 处理拖拽经过事件
+      handleDragOver(event) {
+        event.preventDefault()
+        event.dataTransfer.dropEffect = 'move'
+      },
+
+      // 处理拖拽进入事件
+      handleDragEnter(event) {
+        event.preventDefault()
+      },
+
+      // 批量更新排序
+      batchUpdateSort(updateList) {
+        this.loading = true
+        const promises = updateList.map(item => updateBusiness(item))
+        
+        Promise.all(promises)
+          .then(() => {
+            this.$message.success("排序更新成功")
+            this.getList()
+          })
+          .catch(error => {
+            console.error('批量更新排序失败:', error)
+            this.$message.error("排序更新失败")
+            this.getList()
+          })
+          .finally(() => {
+            // 确保在任何情况下都重置loading状态
+            this.loading = false
+          })
+      }
     }
   }
-};
-</script>
+  </script>
+
+  <style scoped>
+  .filter-container {
+    margin-bottom: 20px;
+  }
+  .filter-item {
+    margin-right: 10px;
+  }
+
+  /* 加粗样式 */
+  .bold-header {
+    font-weight: bold;
+    font-size: 14px;
+    color: black;
+  }
+
+  .bold-text {
+    font-weight: bold;
+    color: black;
+  }
+
+  /* 来源容器样式 */
+  .source-container {
+    padding: 10px;
+    background: #fafafa;
+  }
+
+  .source-header {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin-bottom: 10px;
+  }
+
+  .source-title {
+    font-weight: bold;
+    color: #606266;
+  }
+
+  /* 树形节点内容 */
+  .tree-node-content {
+    display: flex;
+    align-items: center;
+  }
+
+  /* 拖拽样式 */
+  .drag-handle {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 24px;
+    height: 24px;
+    margin-right: 8px;
+    cursor: move;
+    color: #909399;
+    border-radius: 4px;
+    transition: all 0.3s;
+    user-select: none;
+  }
+
+  .drag-handle:hover {
+    background-color: #ecf5ff;
+    color: #409eff;
+  }
+
+  .drag-handle.dragging {
+    background-color: #409eff;
+    color: white;
+    opacity: 0.8;
+  }
+
+  /* 排序数字样式 */
+  .sort-number {
+    display: inline-block;
+    padding: 2px 8px;
+    background-color: #ecf5ff;
+    color: #409eff;
+    border-radius: 4px;
+    font-size: 12px;
+    font-weight: 500;
+  }
+
+  .sub-sort-number {
+    display: inline-block;
+    padding: 2px 8px;
+    background-color: #f0f9eb;
+    color: #67c23a;
+    border-radius: 4px;
+    font-size: 12px;
+  }
+
+  /* 全局样式，确保表头也加粗 */
+  .el-table .bold-header {
+    font-weight: bold !important;
+  }
+
+  .el-table .bold-text {
+    font-weight: bold !important;
+  }
+  </style>
diff --git a/src/views/repair/staff/index.vue b/src/views/repair/staff/index.vue
index 7f31775..16e03a8 100644
--- a/src/views/repair/staff/index.vue
+++ b/src/views/repair/staff/index.vue
@@ -121,11 +121,6 @@
               <el-input v-model="form.mobile" placeholder="请输入手机号码" maxlength="11"/>
             </el-form-item>
           </el-col>
-          <el-col :span="12">
-            <el-form-item label="邮箱" prop="email">
-              <el-input v-model="form.email" placeholder="请输入邮箱" maxlength="50"/>
-            </el-form-item>
-          </el-col>
         </el-row>
         <el-row>
           <el-col :span="12">