转岗管理-培训计划模板-新增排序/权限

src/views/changeJobManagement/trainingPlan.vue

@@ -17,15 +17,18 @@
       @on-load="onLoad"
       @row-update="rowUpdate"
       @row-save="rowSave"
+      @sort-change="sortChange"
+      :permission="permissionList"
     >
       <template #menu-left>
-        <el-button type="danger" @click="handleDelete">删除</el-button>
+        <el-button type="danger" @click="handleDelete" v-if="permissionList.delBtn">删除</el-button>
       </template>
     </avue-crud>
   </basic-container>
 </template>
 <script>
 import { getList, remove, add, update } from '@/api/workLicense/trainingPlan';
+import { mapGetters } from 'vuex';
 
 export default {
   data() {
@@ -39,6 +42,7 @@ export default {
         total: 0,
       },
       selectionList: [],
+      query: {},
       option: {
         columnSort: true,
         tip: false,
@@ -92,6 +96,7 @@ export default {
             labelWidth: 140,
             overflow: true,
             search: true,
+            sortable: 'custom',
             rules: [
               {
                 required: true,
@@ -108,6 +113,7 @@ export default {
             overflow: true,
             search: false,
             type: 'number',
+            sortable: 'custom',
           },
           {
             label: '预警周期(天)',
@@ -117,6 +123,7 @@ export default {
             overflow: true,
             search: false,
             type: 'number',
+            sortable: 'custom',
           },
           {
             label: '备注',
@@ -125,6 +132,7 @@ export default {
             labelWidth: 140,
             overflow: true,
             search: false,
+            sortable: 'custom',
           },
           // {
           //   label: '培训计划资料',
@@ -141,6 +149,16 @@ export default {
       },
     };
   },
+  computed: {
+    ...mapGetters(['permission']),
+    permissionList() {
+      return {
+        addBtn: this.validData(this.permission.trainingPlan_add, false),
+        delBtn: this.validData(this.permission.trainingPlan_del, false),
+        editBtn: this.validData(this.permission.trainingPlan_edit, false),
+      };
+    },
+  },
   mounted() {},
   methods: {
     searchReset() {
@@ -162,6 +180,17 @@ export default {
     sizeChange(pageSize) {
       this.page.pageSize = pageSize;
     },
+    // 排序
+    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);
+    },
     handleDelete() {
       if (this.selectionList.length == 0) {
         this.$message.error('请至少选择一条数据');
@@ -171,11 +200,11 @@ export default {
           cancelButtonText: '取消',
           type: 'warning',
         }).then(() => {
-          let ids=[]
-          this.selectionList.forEach((item) => {
+          let ids = [];
+          this.selectionList.forEach(item => {
             ids.push(item.id);
           });
-          remove(ids.join(',')).then((res) => {
+          remove(ids.join(',')).then(res => {
             this.$message.success('删除成功');
             this.onLoad(this.page);
           });