系统管理-菜单管理-列宽可拖拽

jero-web/src/views/system/PermissionDataRuleList.vue

@@ -43,6 +43,7 @@
           ref="table"
           rowKey="id"
           size="middle"
+          :components="drag(columns,'columns')"
           :columns="columns"
           :dataSource="dataSource"
           :loading="loading"
@@ -67,10 +68,11 @@
   import {getPermissionRuleList, queryPermissionRule} from '@/api/api'
   import {JeroListMixin} from '@/mixins/JeroListMixin'
   import PermissionDataRuleModal from './modules/PermissionDataRuleModal'
+  import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
 
   export default {
     name: 'PermissionDataRuleList',
-    mixins: [JeroListMixin],
+    mixins: [JeroListMixin, ResizeHeader, ResizeColumnProvide],
     components: {
       PermissionDataRuleModal
     },
@@ -82,23 +84,27 @@
           {
             title: this.$t('RuleName'),
             dataIndex: 'ruleName',
-            key: 'ruleName'
+            key: 'ruleName',
+            width: 170
           },
           {
             title: this.$t('RuleField'),
             dataIndex: 'ruleColumn',
-            key: 'ruleColumn'
+            key: 'ruleColumn',
+            width: 170
           },
           {
             title: this.$t('RuleValue'),
             dataIndex: 'ruleValue',
-            key: 'ruleValue'
+            key: 'ruleValue',
+            width: 137
           },
           {
             title: this.$t('operation'),
             dataIndex: 'action',
             scopedSlots: {customRender: 'action'},
-            align: 'center'
+            align: 'left',
+            width: 130
           }
         ],
         permId: '',

jero-web/src/views/system/PermissionList.vue

@@ -30,6 +30,7 @@
         :columns="columns"
         :scroll="{x: '100%'}"
         size="middle"
+        :components="drag(columns,'columns')"
         :pagination="false"
         :dataSource="dataSource"
         :loading="loading"
@@ -89,11 +90,12 @@
   import { JeroListMixin } from '@/mixins/JeroListMixin'
   import PermissionDataRuleList from './PermissionDataRuleList'
   import JEllipsis from '@/components/jero/JEllipsis'
+  import { ResizeHeader, ResizeColumnProvide } from '@/mixins/header'
 
 
   export default {
     name: 'PermissionList',
-    mixins: [JeroListMixin],
+    mixins: [JeroListMixin, ResizeHeader, ResizeColumnProvide],
     components: {
       PermissionDataRuleList,
       PermissionModal,