基础数据-镀种分类-新增排序/权限

src/views/processManagement/platingAssort.vue

@@ -17,16 +17,24 @@
       @size-change="sizeChange"
       @refresh-change="refreshChange"
       @on-load="onLoad"
+      @sort-change="sortChange"
+      :permission="permissionList"
     >
       <template #menu-left> </template>
 
       <template #menu-right="{ size }"> </template>
       <template #menu="scope">
-        <el-button type="primary" link @click="setCrew(scope.row)">设置人员</el-button>
+        <el-button
+          type="primary"
+          link
+          v-if="permission.platingAssort_setPerson"
+          @click="setCrew(scope.row)"
+          >设置人员</el-button
+        >
       </template>
       <template #bsWorkType.wtName="scope">
         <span>
-          {{ scope.row.bsWorkType ? scope.row.bsWorkType.wtName : "-" }}
+          {{ scope.row.bsWorkType ? scope.row.bsWorkType.wtName : '-' }}
         </span>
       </template>
       <template #name="{ row }">
@@ -39,10 +47,16 @@
         </div>
       </template>
     </avue-crud>
-    <el-dialog class="setAssortCrewBox" title="设置人员" append-to-body v-model="crewDialog" width="60%">
+    <el-dialog
+      class="setAssortCrewBox"
+      title="设置人员"
+      append-to-body
+      v-model="crewDialog"
+      width="60%"
+    >
       <tree-transfer
         class="trans_ware"
-        style="margin-top: 10px;"
+        style="margin-top: 10px"
         ref="transferRef"
         :titleList="['未选择', '已选择']"
         v-model:fromData="noChooseUser"
@@ -57,10 +71,10 @@
         rootPid="0"
       />
       <template #footer>
-          <span class="dialog-footer">
-              <el-button @click="crewDialog = false">取 消</el-button>
-              <el-button type="primary" @click="submitPeople">确 定</el-button>
-          </span>
+        <span class="dialog-footer">
+          <el-button @click="crewDialog = false">取 消</el-button>
+          <el-button type="primary" @click="submitPeople">确 定</el-button>
+        </span>
       </template>
     </el-dialog>
     <!-- 设置人员弹框
@@ -74,25 +88,32 @@
   </basic-container>
 </template>
 <script>
-import treeTransfer from 'tree-transfer-vue3' // 引入
-import { mapGetters } from "vuex";
-import {getList,saveClassify,updateClassify,deleteClassify,getSelectUser,saveUser} from "@/api/basicData/platingAssort"
-import setPersonnel from "@/components/dialogCom/setPersonnel.vue";
+import treeTransfer from 'tree-transfer-vue3'; // 引入
+import { mapGetters } from 'vuex';
+import {
+  getList,
+  saveClassify,
+  updateClassify,
+  deleteClassify,
+  getSelectUser,
+  saveUser,
+} from '@/api/basicData/platingAssort';
+import setPersonnel from '@/components/dialogCom/setPersonnel.vue';
 export default {
   components: {
     setPersonnel,
-    treeTransfer
+    treeTransfer,
   },
   data() {
     return {
       bcId: null,
       setCrewOpen: false,
-      crewDialog:false,
+      crewDialog: false,
       form: {},
       query: {},
       loading: true,
       selectionList: [],
-      parentId: "",
+      parentId: '',
       page: {
         pageSize: 10,
         currentPage: 1,
@@ -101,12 +122,12 @@ export default {
       option: {
         columnSort: true,
         tip: false,
-        height: "auto",
+        height: 'auto',
         calcHeight: 32,
         simplePage: false,
         searchShow: true,
         searchMenuSpan: 18,
-        dialogWidth: "30%",
+        dialogWidth: '30%',
         border: true,
         selection: false,
         viewBtn: true,
@@ -114,92 +135,92 @@ export default {
         dialogClickModal: false,
         excelBtn: true,
         viewBtn: false,
-        addBtnIcon: " ",
-        viewBtnIcon: " ",
-        delBtnIcon: " ",
-        editBtnIcon: " ",
-        editBtnText: "修改",
+        addBtnIcon: ' ',
+        viewBtnIcon: ' ',
+        delBtnIcon: ' ',
+        editBtnIcon: ' ',
+        editBtnText: '修改',
         refreshBtn: true,
         searchShowBtn: false,
         gridBtn: false,
         searchIndex: 3,
         searchIcon: true,
-        searchLabelPosition: "left",
-        searchLabelPosition: "left",
+        searchLabelPosition: 'left',
+        searchLabelPosition: 'left',
         searchGutter: 24,
         searchSpan: 6,
-        menuAlign: "center",
+        menuAlign: 'center',
         gridBtn: false,
-        searchMenuPosition: "right",
-        align: "center",
+        searchMenuPosition: 'right',
+        align: 'center',
         index: true,
         column: [
           {
-            label: "编码",
-            prop: "code",
+            label: '编码',
+            prop: 'code',
             search: false,
             sortable: true,
             overHidden: true,
-            span:24,
+            span: 24,
             rules: [
               {
                 required: true,
-                message: "请输入编码",
-                trigger: "blur",
+                message: '请输入编码',
+                trigger: 'blur',
               },
             ],
           },
           {
-            label: "分类名称",
-            prop: "name",
+            label: '分类名称',
+            prop: 'name',
             search: true,
             sortable: true,
             overHidden: true,
-            span:24,
+            span: 24,
             rules: [
               {
                 required: true,
-                message: "请输入分类名称",
-                trigger: "blur",
+                message: '请输入分类名称',
+                trigger: 'blur',
               },
             ],
           },
           {
-            label: "分类备注",
-            prop: "memo",
+            label: '分类备注',
+            prop: 'memo',
             sortable: true,
             search: false,
-            span:24,
+            span: 24,
             rules: [
               {
                 required: false,
-                message: "请选择分类备注",
-                trigger: "click",
+                message: '请选择分类备注',
+                trigger: 'click',
               },
             ],
           },
         ],
       },
       data: [],
-      checkId:'',
+      checkId: '',
     };
   },
   computed: {
-    ...mapGetters(["userInfo", "permission"]),
+    ...mapGetters(['userInfo', 'permission']),
     permissionList() {
       return {
-        addBtn: this.validData(this.permission.menu_add, false),
-        viewBtn: this.validData(this.permission.menu_view, false),
-        delBtn: this.validData(this.permission.menu_delete, false),
-        editBtn: this.validData(this.permission.menu_edit, false),
+        addBtn: this.validData(this.permission.platingAssort_add, false),
+        viewBtn: this.validData(this.permission.platingAssort_view, false),
+        delBtn: this.validData(this.permission.platingAssort_del, false),
+        editBtn: this.validData(this.permission.platingAssort_edit, false),
       };
     },
     ids() {
       let ids = [];
-      this.selectionList.forEach((ele) => {
+      this.selectionList.forEach(ele => {
         ids.push(ele.id);
       });
-      return ids.join(",");
+      return ids.join(',');
     },
   },
   methods: {
@@ -210,7 +231,7 @@ export default {
 
         const newItem = {
           ...item,
-          parentId // 添加 parentId 字段
+          parentId, // 添加 parentId 字段
           // 注意：保留原有的 pid 字段，除非你不需要
         };
 
@@ -224,14 +245,14 @@ export default {
     },
     // 设置班组人员
     setCrew(row) {
-      this.checkId = row.id
-     getSelectUser({
-      clazzId:row.id
-     }).then(res =>{
-      this.chooseUser = this.processTree(res.data.data.clazzSelects)
-      this.noChooseUser = this.processTree(res.data.data.clazzUnSelects)
-      this.crewDialog = true;
-     })
+      this.checkId = row.id;
+      getSelectUser({
+        clazzId: row.id,
+      }).then(res => {
+        this.chooseUser = this.processTree(res.data.data.clazzSelects);
+        this.noChooseUser = this.processTree(res.data.data.clazzUnSelects);
+        this.crewDialog = true;
+      });
     },
     getLeafIds(nodes) {
       const leafIds = [];
@@ -242,7 +263,7 @@ export default {
         items.forEach(item => {
           // 判断是否为叶子节点
           const hasChildren = Array.isArray(item.children) && item.children.length > 0;
-          
+
           if (!hasChildren) {
             // 是叶子节点，收集 id
             leafIds.push(item.id);
@@ -256,19 +277,19 @@ export default {
       traverse(nodes);
       return leafIds;
     },
-    submitPeople(){
-      let userArr = this.getLeafIds(this.chooseUser).map(item => item.replace('user-',""))
+    submitPeople() {
+      let userArr = this.getLeafIds(this.chooseUser).map(item => item.replace('user-', ''));
       let params = {
-        id:this.checkId,
-        userIds:userArr
-      } 
-      saveUser(params).then(res =>{
-        if(res.data.code === 200){
-          this.$message.success('人员设置成功')
-          this.crewDialog = false
-          this.onLoad()
+        id: this.checkId,
+        userIds: userArr,
+      };
+      saveUser(params).then(res => {
+        if (res.data.code === 200) {
+          this.$message.success('人员设置成功');
+          this.crewDialog = false;
+          this.onLoad();
         }
-      })
+      });
     },
     // 设置班组人员弹框关闭
     setCrewOpeSancel(isRefresh) {
@@ -285,55 +306,59 @@ export default {
     },
     handleAdd(row) {
       this.parentId = row.id;
-      const column = this.findObject(this.option.column, "parentId");
+      const column = this.findObject(this.option.column, 'parentId');
       column.value = row.id;
       column.addDisabled = true;
       this.$refs.crud.rowAdd();
     },
     // 保存
     rowSave(row, done, loading) {
-      console.log('row-------------------',row)
-      saveClassify(row).then(res =>{
-        if(res.data.code == 200){
-          this.$message.success('新增成功!');
-          this.onLoad();
-          done()
-        }
-      }).catch(err =>{
-        done()
-      })
+      console.log('row-------------------', row);
+      saveClassify(row)
+        .then(res => {
+          if (res.data.code == 200) {
+            this.$message.success('新增成功!');
+            this.onLoad();
+            done();
+          }
+        })
+        .catch(err => {
+          done();
+        });
     },
     // 修改
     rowUpdate(row, index, done, loading) {
-      updateClassify(row).then(res =>{
-        if(res.data.code == 200){
-          this.$message.success('修改成功!');
-          this.onLoad();
-          done()
-        }else{
-          this.$message.error('修改失败!');
-        }
-      }).catch(err =>{
-        done()
-      })
+      updateClassify(row)
+        .then(res => {
+          if (res.data.code == 200) {
+            this.$message.success('修改成功!');
+            this.onLoad();
+            done();
+          } else {
+            this.$message.error('修改失败!');
+          }
+        })
+        .catch(err => {
+          done();
+        });
     },
     rowDel(row, index, done) {
-      this.$confirm("确定将选择数据删除?", {
-        confirmButtonText: "确定",
-        cancelButtonText: "取消",
-        type: "warning",
+      this.$confirm('确定将选择数据删除?', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
       }).then(() => {
         deleteClassify({
-          ids:row.id
-        }).then(res =>{
-          if(res.data.code == 200){
+          ids: row.id,
+        }).then(res => {
+          if (res.data.code == 200) {
             this.$message.success('删除成功!');
             this.onLoad();
-          }else{
+          } else {
             this.$message.error('删除失败!');
           }
-        })
-      })
+        });
+      });
     },
     // 重置
     searchReset() {
@@ -344,7 +369,7 @@ export default {
     // 搜索
     searchChange(params, done) {
       this.query = params;
-      this.parentId = "";
+      this.parentId = '';
       this.page.currentPage = 1;
       this.onLoad(this.page, params);
       done();
@@ -377,9 +402,9 @@ export default {
     },
     // 关闭 弹框  关闭表单前会执行beforeClose方法，
     beforeClose(done) {
-      this.parentId = "";
-      const column = this.findObject(this.option.column, "parentId");
-      column.value = "";
+      this.parentId = '';
+      const column = this.findObject(this.option.column, 'parentId');
+      column.value = '';
       column.addDisabled = false;
       done();
     },
@@ -395,20 +420,31 @@ export default {
     refreshChange() {
       this.onLoad(this.page, this.query);
     },
+    // 排序
+    sortChange({ prop, order }) {
+      this.query.descs = undefined;
+      this.query.ascs = undefined;
+      let orderByFieldKey = order === 'descending' ? 'descs' : 'ascs';
+      this.query[orderByFieldKey] = !prop
+        ? undefined
+        : prop.replace(/([a-z])([A-Z0-9])/g, '$1_$2').toUpperCase();
+      // // 重新加载数据
+      this.onLoad(this.page, this.query);
+    },
     // 加载页面数据
     onLoad(page, params = {}) {
       this.loading = true;
 
       getList({
-        descs:'CODE',
-        current:this.page.currentPage,
-        size:this.page.pageSize,
-        ...this.query
-      }).then(res =>{
-        this.data = res.data.data.records
-        this.page.total = res.data.data.total
-        this.loading = false
-      })
+        descs: 'CODE',
+        current: this.page.currentPage,
+        size: this.page.pageSize,
+        ...this.query,
+      }).then(res => {
+        this.data = res.data.data.records;
+        this.page.total = res.data.data.total;
+        this.loading = false;
+      });
 
       // getLazyList(this.parentId, Object.assign(params, this.query)).then(res => {
       // this.data = res.data.data;
@@ -494,11 +530,11 @@ export default {
 </script>
 
 <style lang="scss">
-.setAssortCrewBox{
-  .tree-transfer-vue3{
+.setAssortCrewBox {
+  .tree-transfer-vue3 {
     height: 450px !important;
 
-    .el-tree{
+    .el-tree {
       height: 335px !important;
     }
   }