【修改】JTable的代码逻辑调整

jero-web/src/components/jero/JTable.vue

@@ -14,7 +14,7 @@
       </template>
 
       <span :slot="a.slots.title" v-for="a in aColumns" :key="a.dataIndex">
-          {{ a.title }}
+          {{ a.slots.title }}
           <a-dropdown :trigger="['click']">
             <a class="ant-dropdown-link" @click="(e) => e.preventDefault()">
               <!-- 操作 -->
@@ -53,55 +53,51 @@ import { Table } from 'ant-design-vue'
 
 export default {
   name: 'JTable',
-  props: Object.assign(
-    {
-      isShowPage: {
-        type: Boolean,
-        default() {
-          return true
-        },
-      },
-      isCheck: {
-        type: Boolean,
-        default() {
-          return true
-        },
-      },
-      isShowDropdown: {
-        type: Boolean,
-        default() {
-          return true
-        },
+  props: {
+    ...Table.props,
+    isShowPage: {
+      type: Boolean,
+      default() {
+        return true
       },
     },
-    Table.props,
-    {
-      rowSelection: {
-        type: Object,
-        default() {
-          return {
-            type: 'checkbox',
-          }
-        },
+    isCheck: {
+      type: Boolean,
+      default() {
+        return true
       },
-      pagination: {
-        type: Object,
-        default() {
-          return {
-            current: 1,
-            pageSize: 10,
-            pageSizeOptions: ['10', '20', '30'],
-            showTotal: (total, range) => {
-              return range[0] + '-' + range[1] + ' 共' + total + '条'
-            },
-            showQuickJumper: true,
-            showSizeChanger: true,
-            total: 0,
-          }
-        },
+    },
+    isShowDropdown: {
+      type: Boolean,
+      default() {
+        return true
       },
-    }
-  ),
+    },
+    rowSelection: {
+      type: Object,
+      default() {
+        return {
+          type: 'checkbox',
+        }
+      },
+    },
+    pagination: {
+      type: Object,
+      default() {
+        return {
+          current: 1,
+          pageSize: 10,
+          pageSizeOptions: ['10', '20', '30'],
+          showQuickJumper: true,
+          showSizeChanger: true,
+          total: 0,
+          showTotal: (total, range) => {
+            return range[0] + '-' + range[1] + ' 共' + total + '条'
+          }
+        }
+      },
+    },
+  },
   data() {
     return {
       aColumns: this.columns,
@@ -147,14 +143,11 @@ export default {
     }
   },
   mounted() {
-    // console.log(this.aColumns)
-    // console.log(this.columns)
-    console.log(this.$attrs)
     // 遍历出筛选列头的所有选项
     this.columns.forEach((item) => {
       let colItem = {
-        value: item.title,
-        label: item.title,
+        value: item.slots.title,
+        label: item.slots.title,
         disabled: false,
       }
       this.plainOptions.push(colItem)
@@ -168,7 +161,7 @@ export default {
     }
     // 遍历出筛选列头中的已选项
     this.aColumns.forEach((item) => {
-      this.checkedList.push(item.title)
+      this.checkedList.push(item.slots.title)
     })
   },
   methods: {
@@ -193,7 +186,7 @@ export default {
       //转换为dataIndex
       for (let i = 0; i < e.length; i++) {
         this.columns.find((item) => {
-          if (item.title === e[i]) {
+          if (item.slots.title === e[i]) {
             trfList.push(item.dataIndex)
           }
         })
@@ -210,7 +203,6 @@ export default {
         localStorage.setItem('pro__Cloumns', JSON.stringify(this.aColumns))
         return
       }
-      // TODO midColumns这个变量应该声明为局部变量，作为全局变量但没有全局使用是不合理的
       let midColumns = this.columns
       for (let i = 0; i < diffList.length; i++) {
         midColumns = midColumns.filter((item) => item.dataIndex !== diffList[i])
@@ -218,7 +210,6 @@ export default {
       this.aColumns = midColumns
 
       localStorage.setItem('pro__Cloumns', JSON.stringify(this.aColumns))
-      // console.log(JSON.parse(localStorage.getItem("pro__Cloumns")))
     },
     // 比较两个数组之间的不同,生成新数组
     getArrDifference(arr1, arr2) {
@@ -227,7 +218,11 @@ export default {
       })
     },
     fixedChange(e, dataIndex) {
-      // console.log(e.target.value, dataIndex)
+      // 冻结列头的参数
+      // 1为左侧冻结
+      // 2为右侧冻结
+      // 3为不冻结或解冻
+
       if (e.target.value === 1) {
         //左侧冻结
         this.aColumns.find((item) => {
@@ -244,7 +239,6 @@ export default {
           }
         }
         this.aColumns.unshift(arr[0])
-        // console.log(this.aColumns)
       } else if (e.target.value === 2) {
         //右侧冻结
         this.aColumns.find((item) => {
@@ -273,7 +267,6 @@ export default {
     },
     // 列头重新排序
     diffColunms() {
-      // console.log(dataIndex)
       let newColumnsList = [] //没有fixed属性的List
       let newFixedLeftList = [] //fixed=left的List
       let newFixedRightList = [] //fixed=right的List