[Fx 0000] 修复级联选择器清空、过滤时传递值不正确的问题

src/components/Form/src/jeecg/components/MineCascader/MineCascader.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-cascader
+  <Cascader
     :value="innerValue"
     :options="getDepartTree"
-    :placeholder="placeholder"
+    placeholder="全部"
     :field-names="{
       label: 'departName',
       value: 'id',
@@ -16,20 +16,22 @@
     <template #displayRender="{ labels }">
       {{ labels[labels.length - 1] }}
     </template>
-  </a-cascader>
+  </Cascader>
   <!-- <a-input>{{ shownText }}</a-input> -->
 </template>
 
 <script lang="ts">
   import { last } from 'lodash';
-  import { defineComponent, computed, onUnmounted } from 'vue';
+  import { defineComponent, onUnmounted, h, ref } from 'vue';
   // import { useMessage } from '/@/hooks/web/useMessage';
   import { propTypes } from '/@/utils/propTypes';
-  import { useMineStore } from '/@/store/modules/mine';
+  import { useMineDepartmentStore } from '/@/store/modules/mine';
   import { storeToRefs } from 'pinia';
+  import { Cascader } from 'ant-design-vue';
 
   export default defineComponent({
     name: 'MineCascader',
+    components: { Cascader },
     props: {
       value: propTypes.string.def(''),
       placeholder: propTypes.string.def('全部'),
@@ -38,25 +40,24 @@
       showSearch: propTypes.bool.def(true),
       allowClear: propTypes.bool.def(true),
       changeOnSelect: propTypes.bool.def(true),
-      resetOnDestroy: propTypes.bool.def(true),
+      // clearOnDestroy: propTypes.bool.def(false),
     },
     emits: ['change', 'update:value'],
     setup(props, { emit }) {
       // const { createMessage } = useMessage();
-      const mineStore = useMineStore();
-      const { getDepartPath, getDepartTree, getDepartId, getMineCode } = storeToRefs(mineStore);
+      const mineStore = useMineDepartmentStore();
+      const { getDepartTree, getMineCode } = storeToRefs(mineStore);
 
-      if (props.resetOnDestroy) {
-        const rawID = getDepartId.value;
-        onUnmounted(() => {
-          mineStore.clearDepart();
-          mineStore.setDepartById(rawID);
-        });
-      }
+      // if (props.clearOnDestroy) {
+      //   const raw = getDepartId.value;
+      //   onUnmounted(() => {
+      //     mineStore.setDepartById(raw);
+      //   });
+      // }
 
       if (props.rootId) {
-        mineStore.filterDepartTree((e) => e.id === props.rootId);
         mineStore.clearDepart();
+        mineStore.filterDepartTree((e) => e.parentId === props.rootId);
 
         onUnmounted(() => {
           mineStore.restoreDepartTree();
@@ -64,7 +65,8 @@
       }
 
       // const shownText = computed(() => getDepart.value.departName || '-');
-      const innerValue = computed(() => getDepartPath.value.map((e) => e.id));
+      const innerValue = ref<string[]>([]);
+      // const innerValue = computed(() => getDepartPath.value.map((e) => e.id));
       const options = getDepartTree;
 
       /**
@@ -72,22 +74,26 @@
        * @param e
        */
       function handleChange(value: any[]) {
-        console.log('debug change', value, getMineCode.value);
+        innerValue.value = value;
         mineStore.setDepartById(last(value));
-        console.log('debug aftter', value, getMineCode.value);
 
         const val = getMineCode.value;
         emit('update:value', val);
         emit('change', val);
       }
 
-      handleChange([getDepartId.value]);
+      handleChange([]);
+
+      onUnmounted(() => {
+        mineStore.clearDepart();
+      });
 
       return {
         innerValue,
         options,
         getDepartTree,
         handleChange,
+        h,
       };
     },
   });

src/store/modules/mine.ts

@@ -4,7 +4,7 @@ import { ref, computed } from 'vue';
 import { getEnfMineTree } from '/@/api/sys/menu';
 import { getUserMinePermissionData } from '/@/components/Form/src/jeecg/components/MineCascader/mineData.api';
 import { findNode, findNodeAll, findPath, listToTree, treeToList } from '/@/utils/helper/treeHelper';
-import { isArray, isEmpty, isNil } from 'lodash';
+import { isArray } from 'lodash';
 
 export interface MineDepartment {
   /** 唯一标识 */
@@ -27,15 +27,12 @@ const DEFAULT_CONFIG = {
   children: 'childDepart',
 };
 
-export const useMineStore = defineStore('mine-store', () => {
+export const useMineDepartmentStore = defineStore('mine-department-store', () => {
   // ==================== State 定义 ====================
 
   /** 当前选中的部门，可能是执法处、区或者具体到矿井 */
   const depart = ref<MineDepartment>();
 
-  /** 当前选中的部门ID，可能为空 */
-  const departId = ref<string>();
-
   /** 组织树（经过过滤等处理后的树） */
   const departTree = ref<MineDepartment[]>([]);
 
@@ -55,7 +52,7 @@ export const useMineStore = defineStore('mine-store', () => {
 
   /** 获取当前选中的部门在组织树中的访问路径 */
   const getDepartPath = computed(() => {
-    return findPath(departTree.value, (item) => item.id === departId.value, DEFAULT_CONFIG) || [];
+    return findPath(departTree.value, (item) => item.id === getDepartId.value, DEFAULT_CONFIG) || [];
   });
 
   /**
@@ -65,7 +62,7 @@ export const useMineStore = defineStore('mine-store', () => {
    * - 如果未选择任何节点，返回空字符串
    */
   const getMineCode = computed(() => {
-    const target = departId.value ? [depart.value] : departTree.value;
+    const target = getDepartId.value ? [depart.value] : departTree.value;
     const list = treeToList(target, DEFAULT_CONFIG);
 
     if (isArray(list)) {
@@ -84,9 +81,8 @@ export const useMineStore = defineStore('mine-store', () => {
    * @param dep - 部门对象
    */
   function setDepart(dep: MineDepartment) {
-    if (isNil(dep) || isEmpty(dep)) return;
+    // if (isNil(dep) || isEmpty(dep)) return;
     depart.value = dep;
-    departId.value = dep.id;
   }
 
   /**
@@ -98,16 +94,6 @@ export const useMineStore = defineStore('mine-store', () => {
     setDepart(node);
   }
 
-  /**
-   * 设置组织树并保存原始数据副本
-   * @param tree - 组织树数据
-   */
-  function setDepartTree(tree: MineDepartment[] = []) {
-    departTree.value = tree;
-    // 深拷贝保存原始数据，用于过滤后恢复
-    rawTree.value = JSON.parse(JSON.stringify(tree));
-  }
-
   /**
    * 获取组织树数据（异步）
    * 从两个接口获取数据：
@@ -132,7 +118,9 @@ export const useMineStore = defineStore('mine-store', () => {
       // 合并数据并转换为树形结构
       const tree = listToTree([...r1, ...r2], DEFAULT_CONFIG);
 
-      setDepartTree(tree);
+      departTree.value = tree;
+      // 深拷贝保存原始数据，用于过滤后恢复
+      rawTree.value = JSON.parse(JSON.stringify(tree));
 
       // 如果需要自动选中第一个叶子节点（矿井），可以取消注释以下代码
       /*
@@ -178,7 +166,6 @@ export const useMineStore = defineStore('mine-store', () => {
    */
   function clearDepart() {
     depart.value = undefined;
-    departId.value = undefined;
   }
 
   // ==================== 暴露的属性和方法 ====================
@@ -186,7 +173,6 @@ export const useMineStore = defineStore('mine-store', () => {
   return {
     // --- State（可修改）---
     depart,
-    departId,
     departTree,
     rawTree,