Просмотр исходного кода

支持表格列显隐状态记忆

RuoYi 2 месяцев назад
Родитель
Сommit
3b42c7c633
1 измененных файлов с 40 добавлено и 0 удалено
  1. 40 0
      ruoyi-ui/src/components/RightToolbar/index.vue

+ 40 - 0
ruoyi-ui/src/components/RightToolbar/index.vue

@@ -38,6 +38,8 @@
 </template>
 </template>
 
 
 <script>
 <script>
+import cache from '@/plugins/cache'
+
 export default {
 export default {
   name: "RightToolbar",
   name: "RightToolbar",
   data() {
   data() {
@@ -76,6 +78,11 @@ export default {
       type: Number,
       type: Number,
       default: 10
       default: 10
     },
     },
+    /* 列显隐状态记忆的 localStorage key(传入则启用记忆,不传则不记忆) */
+    storageKey: {
+      type: String,
+      default: ""
+    }
   },
   },
   computed: {
   computed: {
     style() {
     style() {
@@ -103,6 +110,23 @@ export default {
     }
     }
   },
   },
   created() {
   created() {
+    // 如果传入了 storageKey,从 localStorage 恢复列显隐状态
+    if (this.storageKey) {
+      try {
+        const saved = cache.local.getJSON(this.storageKey)
+        if (saved && typeof saved === 'object') {
+          if (Array.isArray(this.columns)) {
+            this.columns.forEach((col, index) => {
+              if (saved[index] !== undefined) col.visible = saved[index]
+            })
+          } else {
+            Object.keys(this.columns).forEach(key => {
+              if (saved[key] !== undefined) this.columns[key].visible = saved[key]
+            })
+          }
+        }
+      } catch (e) {}
+    }
     if (this.showColumnsType == 'transfer') {
     if (this.showColumnsType == 'transfer') {
       // transfer穿梭显隐列初始默认隐藏列
       // transfer穿梭显隐列初始默认隐藏列
       if (Array.isArray(this.columns)) {
       if (Array.isArray(this.columns)) {
@@ -168,6 +192,7 @@ export default {
           this.columns[key].visible = !data.includes(index)
           this.columns[key].visible = !data.includes(index)
         })
         })
       }
       }
+      this.saveStorage()
     },
     },
     // 打开显隐列dialog
     // 打开显隐列dialog
     showColumn() {
     showColumn() {
@@ -180,6 +205,7 @@ export default {
       } else {
       } else {
         this.columns[key].visible = event
         this.columns[key].visible = event
       }
       }
+      this.saveStorage()
     },
     },
     // 切换全选/反选
     // 切换全选/反选
     toggleCheckAll() {
     toggleCheckAll() {
@@ -189,6 +215,20 @@ export default {
       } else {
       } else {
         Object.values(this.columns).forEach((col) => (col.visible = newValue))
         Object.values(this.columns).forEach((col) => (col.visible = newValue))
       }
       }
+      this.saveStorage()
+    },
+    // 将当前列显隐状态持久化到 localStorage
+    saveStorage() {
+      if (!this.storageKey) return
+      try {
+        let state = {}
+        if (Array.isArray(this.columns)) {
+          this.columns.forEach((col, index) => { state[index] = col.visible })
+        } else {
+          Object.keys(this.columns).forEach(key => { state[key] = this.columns[key].visible })
+        }
+        cache.local.setJSON(this.storageKey, state)
+      } catch (e) {}
     }
     }
   },
   },
 }
 }