n20-common-lib 3.3.6 → 3.3.7

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n20-common-lib",
-  "version": "3.3.6",
+  "version": "3.3.7",
   "private": false,
   "scripts": {
     "serve": "vue-cli-service serve",

package/src/components/DynamicField/DynamicFieldMixin.js

@@ -1,150 +1,150 @@
-import { $lc } from '../../utils/i18n/index.js'
-const obj = {
-  mounted() {
-    this.setRules()
-  },
-  data() {
-    return {
-      // batch 批处理内部标志：withBatch 包裹期间 _batchDepth>0，
-      // 期间 setType 的 requiredFlag 变更只标记 dirty，不立即 setRules，由批次末尾合并触发一次
-      _batchDepth: 0,
-      _batchRulesDirty: false
-    }
-  },
-  methods: {
-    // 批处理包裹器：可重入。一次用户动作（如 valueChange/setView）内连续多次 setType，
-    // 合并成末尾一次 setRules，避免 O(全表) rules 重建风暴。批次外（含异步逸出的 setType）保持原即时语义。
-    withBatch(fn) {
-      this._batchDepth++
-      try {
-        return fn()
-      } finally {
-        this._batchDepth--
-        if (this._batchDepth === 0 && this._batchRulesDirty) {
-          this._batchRulesDirty = false
-          this.setRules()
-        }
-      }
-    },
-    // 对相关方法进行设置
-    setType(name, value) {
-      this.form.forEach((item) => {
-        for (const key in item.list) {
-          if (item.list && item.list[key].type === 'group-container') {
-            const index = item.list[key].fields.findIndex((id) => {
-              return id.fieldCode === name
-            })
-            if (index !== -1) {
-              item.list[key].fields[index] = { ...item.list[key].fields[index], ...value }
-              return false
-            }
-          }
-        }
-        if (item.list && item.list[name]) {
-          item.list[name] = { ...item.list[name], ...value }
-        }
-      })
-      // 更新rules：批次内只标记 dirty，批次外立即触发
-      if (value.hasOwnProperty('requiredFlag')) {
-        if (this._batchDepth > 0) {
-          this._batchRulesDirty = true
-        } else {
-          this.setRules()
-        }
-      }
-    },
-    // 生成校验rules
-    setRules() {
-      const rules = {}
-      this.form.forEach((item) => {
-        let msg = ''
-        for (const key in item.list) {
-          if (item.list && item.list[key].type === 'group-container') {
-            item.list[key].fields.forEach((item2) => {
-              if (item2.requiredMessage) {
-                msg = item2.requiredMessage
-              } else if (['select', 'date-picker', 'searchSelect', 'daterange'].includes(item2.type)) {
-                msg = $lc('请选择') + item2.label
-              } else {
-                msg = $lc('请输入') + item2.label
-              }
-              rules[item2.fieldCode] = [
-                {
-                  required: item2.requiredFlag && item2.type,
-                  message: msg,
-                  trigger: ['submit', 'change']
-                }
-              ]
-            })
-          } else {
-            if (item.list[key].requiredMessage) {
-              msg = item.list[key].requiredMessage
-            } else if (['select', 'date-picker', 'searchSelect', 'daterange'].includes(item.list[key].type)) {
-              msg = $lc('请选择') + item.list[key].label
-            } else {
-              msg = $lc('请输入') + item.list[key].label
-            }
-            rules[key] = [
-              {
-                required: item.list[key].requiredFlag && item.list[key].type,
-                message: msg,
-                trigger: ['submit', 'change']
-              }
-            ]
-          }
-        }
-      })
-      this.rules = { ...rules, ...this.staticRules }
-      this.$nextTick(() => {
-        this.$refs.form && this.$refs.form.clearValidate()
-      })
-    },
-    // 转换方法
-    transform(value) {
-      // 过滤掉空数据
-      const valueData = value.filter((item) => {
-        return item.fieldGroup && item.fieldType && item.fieldName && item.fieldCode && item.isEnabled
-      })
-      console.log(valueData)
-      let groups = []
-      let form = []
-      let formValue = {}
-      valueData.forEach((item) => {
-        if (!groups.includes(item.fieldGroup)) {
-          groups.push(item.fieldGroup)
-        }
-        // 有默认值的话
-        if (item.defaultValue) {
-          formValue[item.fieldCode] = item.defaultValue
-          // 区间
-        } else if (['input-number-range', 'input-rate-range', 'daterangee'].includes(item.fieldType)) {
-          formValue[item.fieldCode] = {
-            start: '',
-            end: ''
-          }
-          // 字符串
-        } else {
-          formValue[item.fieldCode] = ''
-        }
-      })
-      console.log(groups)
-      groups.forEach((item) => {
-        let list = {}
-        valueData.forEach((item2) => {
-          if (item2.fieldGroup === item) {
-            list[item2.fieldCode] = {
-              type: item2.fieldType,
-              label: item2.fieldName,
-              requiredFlag: item2.isMust,
-              remark: item2.remark,
-              options: item2.fieldValue
-            }
-          }
-        })
-        form.push({ tabName: item, list: list })
-      })
-      return { form: form, formValue: formValue }
-    }
-  }
-}
-export default obj
+import { $lc } from '../../utils/i18n/index.js'
+const obj = {
+  mounted() {
+    this.setRules()
+  },
+  data() {
+    return {
+      // batch 批处理内部标志：withBatch 包裹期间 _batchDepth>0，
+      // 期间 setType 的 requiredFlag 变更只标记 dirty，不立即 setRules，由批次末尾合并触发一次
+      _batchDepth: 0,
+      _batchRulesDirty: false
+    }
+  },
+  methods: {
+    // 批处理包裹器：可重入。一次用户动作（如 valueChange/setView）内连续多次 setType，
+    // 合并成末尾一次 setRules，避免 O(全表) rules 重建风暴。批次外（含异步逸出的 setType）保持原即时语义。
+    withBatch(fn) {
+      this._batchDepth++
+      try {
+        return fn()
+      } finally {
+        this._batchDepth--
+        if (this._batchDepth === 0 && this._batchRulesDirty) {
+          this._batchRulesDirty = false
+          this.setRules()
+        }
+      }
+    },
+    // 对相关方法进行设置
+    setType(name, value) {
+      this.form.forEach((item) => {
+        for (const key in item.list) {
+          if (item.list && item.list[key].type === 'group-container') {
+            const index = item.list[key].fields.findIndex((id) => {
+              return id.fieldCode === name
+            })
+            if (index !== -1) {
+              item.list[key].fields[index] = { ...item.list[key].fields[index], ...value }
+              return false
+            }
+          }
+        }
+        if (item.list && item.list[name]) {
+          item.list[name] = { ...item.list[name], ...value }
+        }
+      })
+      // 更新rules：批次内只标记 dirty，批次外立即触发
+      if (value.hasOwnProperty('requiredFlag')) {
+        if (this._batchDepth > 0) {
+          this._batchRulesDirty = true
+        } else {
+          this.setRules()
+        }
+      }
+    },
+    // 生成校验rules
+    setRules() {
+      const rules = {}
+      this.form.forEach((item) => {
+        let msg = ''
+        for (const key in item.list) {
+          if (item.list && item.list[key].type === 'group-container') {
+            item.list[key].fields.forEach((item2) => {
+              if (item2.requiredMessage) {
+                msg = item2.requiredMessage
+              } else if (['select', 'date-picker', 'searchSelect', 'daterange'].includes(item2.type)) {
+                msg = $lc('请选择') + item2.label
+              } else {
+                msg = $lc('请输入') + item2.label
+              }
+              rules[item2.fieldCode] = [
+                {
+                  required: item2.requiredFlag && item2.type,
+                  message: msg,
+                  trigger: ['submit', 'change']
+                }
+              ]
+            })
+          } else {
+            if (item.list[key].requiredMessage) {
+              msg = item.list[key].requiredMessage
+            } else if (['select', 'date-picker', 'searchSelect', 'daterange'].includes(item.list[key].type)) {
+              msg = $lc('请选择') + item.list[key].label
+            } else {
+              msg = $lc('请输入') + item.list[key].label
+            }
+            rules[key] = [
+              {
+                required: item.list[key].requiredFlag && item.list[key].type,
+                message: msg,
+                trigger: ['submit', 'change']
+              }
+            ]
+          }
+        }
+      })
+      this.rules = { ...rules, ...this.staticRules }
+      this.$nextTick(() => {
+        this.$refs.form && this.$refs.form.clearValidate()
+      })
+    },
+    // 转换方法
+    transform(value) {
+      // 过滤掉空数据
+      const valueData = value.filter((item) => {
+        return item.fieldGroup && item.fieldType && item.fieldName && item.fieldCode && item.isEnabled
+      })
+      console.log(valueData)
+      let groups = []
+      let form = []
+      let formValue = {}
+      valueData.forEach((item) => {
+        if (!groups.includes(item.fieldGroup)) {
+          groups.push(item.fieldGroup)
+        }
+        // 有默认值的话
+        if (item.defaultValue) {
+          formValue[item.fieldCode] = item.defaultValue
+          // 区间
+        } else if (['input-number-range', 'input-rate-range', 'daterangee'].includes(item.fieldType)) {
+          formValue[item.fieldCode] = {
+            start: '',
+            end: ''
+          }
+          // 字符串
+        } else {
+          formValue[item.fieldCode] = ''
+        }
+      })
+      console.log(groups)
+      groups.forEach((item) => {
+        let list = {}
+        valueData.forEach((item2) => {
+          if (item2.fieldGroup === item) {
+            list[item2.fieldCode] = {
+              type: item2.fieldType,
+              label: item2.fieldName,
+              requiredFlag: item2.isMust,
+              remark: item2.remark,
+              options: item2.fieldValue
+            }
+          }
+        })
+        form.push({ tabName: item, list: list })
+      })
+      return { form: form, formValue: formValue }
+    }
+  }
+}
+export default obj

package/src/components/DynamicField/utils.js

@@ -1,36 +1,36 @@
-/**
- * 深度克隆
- * @param target
- * @return {}
- */
-export const deepClone = (target, map = new Map()) => {
-  // 检测数据的类型
-  if (typeof target === 'object' && target !== null) {
-    // 克隆数据之前, 进行判断, 数据之前是否克隆过
-    const cache = map.get(target)
-    if (cache) {
-      return cache
-    }
-    // 判断目标数据的类型
-    const isArray = Array.isArray(target)
-    // 创建一个容器
-    const result = isArray ? [] : {}
-    // 将新的结果存入到容器中
-    map.set(target, result)
-    // 如果目标数据为数组
-    if (isArray) {
-      // forEach 遍历
-      target.forEach((item, index) => {
-        result[index] = deepClone(item, map)
-      })
-    } else {
-      // 如果是对象, 获取所有的键名, 然后 forEach 遍历
-      Object.keys(target).forEach((key) => {
-        result[key] = deepClone(target[key], map)
-      })
-    }
-    return result
-  } else {
-    return target
-  }
-}
+/**
+ * 深度克隆
+ * @param target
+ * @return {}
+ */
+export const deepClone = (target, map = new Map()) => {
+  // 检测数据的类型
+  if (typeof target === 'object' && target !== null) {
+    // 克隆数据之前, 进行判断, 数据之前是否克隆过
+    const cache = map.get(target)
+    if (cache) {
+      return cache
+    }
+    // 判断目标数据的类型
+    const isArray = Array.isArray(target)
+    // 创建一个容器
+    const result = isArray ? [] : {}
+    // 将新的结果存入到容器中
+    map.set(target, result)
+    // 如果目标数据为数组
+    if (isArray) {
+      // forEach 遍历
+      target.forEach((item, index) => {
+        result[index] = deepClone(item, map)
+      })
+    } else {
+      // 如果是对象, 获取所有的键名, 然后 forEach 遍历
+      Object.keys(target).forEach((key) => {
+        result[key] = deepClone(target[key], map)
+      })
+    }
+    return result
+  } else {
+    return target
+  }
+}

package/src/components/ProFilterView/index.vue

@@ -310,9 +310,13 @@ export default {
       viewId: undefined,
       isRefresh: false,
       // 视图类型切换时缓存对方数据
-      savedViewConfigs: {},
-      // 选中第一个视图前的筛选区状态快照，切回"无视图"时用它恢复，避免上一视图条件残留
-      initialDisplaySnapshot: null
+      savedViewConfigs: {},
+      // 选中第一个视图前的筛选区状态快照，切回"无视图"时用它恢复，避免上一视图条件残留
+      initialDisplaySnapshot: null,
+      // 选中第一个视图前的筛选项布局快照，切回"无视图"时恢复
+      initialFilterKeySnapshot: null,
+      // 防止快速切换视图时旧的异步布局任务覆盖新视图
+      filterLayoutSyncKey: 0
     }
   },
   computed: {
@@ -756,11 +760,12 @@ export default {
         this.selectItem = ''
         // 切回"无视图"恢复选中第一个视图前的筛选区状态；
         // 不能用 initialValue 恢复——它是页面实时查询表单，此时已被上一视图的值污染
-        this.searchValue = {
-          ...this.getInitialSearchValue,
-          ...(this.initialDisplaySnapshot || this.initialValue)
-        }
-        this.conditionGroups = []
+        this.searchValue = {
+          ...this.getInitialSearchValue,
+          ...(this.initialDisplaySnapshot || this.initialValue)
+        }
+        this.conditionGroups = []
+        this.syncFilterLayout(this.initialFilterKeySnapshot, true)
         // filterObj 的 extraInitialValues 取自实时 initialValue（已被上一视图污染），
         // 切"无视图"时改用恢复后的 searchValue 整体作为载荷，避免上一视图字段从事件漏出
         this.$emit(
@@ -776,23 +781,44 @@ export default {
         )
         return
       }
-      if (!prevSelectItem?.viewId) {
-        // 从"无视图/初始状态"首次切到具体视图前，快照当前筛选区状态
-        this.initialDisplaySnapshot = { ...this.searchValue }
-      }
+      if (!prevSelectItem?.viewId) {
+        // 从"无视图/初始状态"首次切到具体视图前，快照当前筛选区状态
+        this.initialDisplaySnapshot = { ...this.searchValue }
+        this.initialFilterKeySnapshot = (this.$refs.filter?.GroupData || []).map((filter) => filter.id)
+      }
       if (item.viewType === VIEW_TYPE.BASIC) {
         const config = this.safeParse(item.viewConfig)
         this.searchForm = config
         this.searchValue = { ...this.getInitialSearchValue, ...config }
-      } else if (item.viewType === VIEW_TYPE.ADVANCED) {
-        this.conditionGroups = this.safeParse(item.viewConfig).conditionGroups || []
-        this.searchValue = { ...this.getInitialSearchValue }
-      }
+      } else if (item.viewType === VIEW_TYPE.ADVANCED) {
+        this.conditionGroups = this.safeParse(item.viewConfig).conditionGroups || []
+        this.searchValue = { ...this.getInitialSearchValue }
+      }
+      // 基础视图只展示保存时勾选的字段；高级视图 keyIds 为空，仅保留 static 固定字段
+      this.syncFilterLayout(item.keyIds || [])
       // isViewSwitch 标记本次 filter 事件由视图切换触发。
       // 此前切到"无视图"与"无视图下手动查询"的事件参数完全一致（viewId 均为空），
       // 业务页面无法区分，只能靠额外记录状态判断
-      this.$emit('filter', { ...this.filterObj, isViewSwitch: true }, 'filter')
-    },
+      this.$emit('filter', { ...this.filterObj, isViewSwitch: true }, 'filter')
+    },
+    /**
+     * 按视图保存的 keyIds 同步筛选项布局。
+     * 等 searchValue/initialValue 的监听与自动追加逻辑执行完后再覆盖，避免旧布局残留。
+     */
+    syncFilterLayout(keyIds = [], resetSnapshot = false) {
+      const syncKey = ++this.filterLayoutSyncKey
+      this.$nextTick(() => {
+        this.$nextTick(() => {
+          if (syncKey !== this.filterLayoutSyncKey || !this.$refs.filter) return
+          const filterMap = new Map(this.filterList.map((filter) => [String(filter.id), filter]))
+          const filters = keyIds.map((id) => filterMap.get(String(id))).filter(Boolean)
+          this.$refs.filter.mackData(filters)
+          if (resetSnapshot) {
+            this.initialFilterKeySnapshot = null
+          }
+        })
+      })
+    },
     // 拖动保存视图列表
     handleDragSort(list) {
       console.log($lc('当前list:'), list)
@@ -840,8 +866,10 @@ export default {
       this.conditionGroups = []
       this.filterExpanded = this.defaultExpanded
       this.viewId = undefined
-      this.savedViewConfigs = {}
-      this.initialDisplaySnapshot = null
+      this.savedViewConfigs = {}
+      this.initialDisplaySnapshot = null
+      this.initialFilterKeySnapshot = null
+      this.filterLayoutSyncKey++
     }
   }
 }