From 573d395b692d80fab408591ee599f62a922702fa Mon Sep 17 00:00:00 2001
From: billyshen26 <likeboat@163.com>
Date: Fri, 11 Aug 2023 08:39:13 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E8=A7=A3=E5=86=B3ApiTreeSelect=E7=9A=84?=
 =?UTF-8?q?params=E6=9B=B4=E6=96=B0=E5=90=8Efetch=E4=B8=8D=E6=89=A7?=
 =?UTF-8?q?=E8=A1=8C=20(#2954)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* fix: 解决ApiTreeSelect的params更新后fetch不执行

* feat: 优化ApiTreeSelect参数,可自定义value等

---------

Co-authored-by: Billy Shen <shenfangtao@imaodu.com>
---
 .../Form/src/components/ApiTreeSelect.vue     | 27 ++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/components/Form/src/components/ApiTreeSelect.vue b/src/components/Form/src/components/ApiTreeSelect.vue
index 1e8b04c2..3f99c8a3 100644
--- a/src/components/Form/src/components/ApiTreeSelect.vue
+++ b/src/components/Form/src/components/ApiTreeSelect.vue
@@ -1,5 +1,5 @@
 <template>
-  <a-tree-select v-bind="getAttrs" @change="handleChange">
+  <a-tree-select v-bind="getAttrs" @change="handleChange" :field-names="fieldNames">
     <template #[item]="data" v-for="item in Object.keys($slots)">
       <slot :name="item" v-bind="data || {}"></slot>
     </template>
@@ -11,7 +11,16 @@
 
 <script lang="ts">
   import { type Recordable } from '@vben/types';
-  import { type PropType, computed, defineComponent, watch, ref, onMounted, unref } from 'vue';
+  import {
+    type PropType,
+    computed,
+    defineComponent,
+    watchEffect,
+    watch,
+    ref,
+    onMounted,
+    unref,
+  } from 'vue';
   import { TreeSelect } from 'ant-design-vue';
   import { isArray, isFunction } from '/@/utils/is';
   import { get } from 'lodash-es';
@@ -26,6 +35,9 @@
       params: { type: Object },
       immediate: { type: Boolean, default: true },
       resultField: propTypes.string.def(''),
+      labelField: propTypes.string.def('title'),
+      valueField: propTypes.string.def('value'),
+      childrenField: propTypes.string.def('children'),
     },
     emits: ['options-change', 'change'],
     setup(props, { attrs, emit }) {
@@ -38,11 +50,20 @@
           ...attrs,
         };
       });
+      const fieldNames = {
+        children: props.childrenField,
+        value: props.valueField,
+        label: props.labelField,
+      };
 
       function handleChange(...args) {
         emit('change', ...args);
       }
 
+      watchEffect(() => {
+        props.immediate && fetch();
+      });
+
       watch(
         () => props.params,
         () => {
@@ -82,7 +103,7 @@
         isFirstLoaded.value = true;
         emit('options-change', treeData.value);
       }
-      return { getAttrs, loading, handleChange };
+      return { getAttrs, loading, handleChange, fieldNames };
     },
   });
 </script>