From cbbc4c0d5e53ef01639907f8794dbb789b74e0a7 Mon Sep 17 00:00:00 2001
From: xingyu <xingyu4j@vip.qq.com>
Date: Mon, 11 Sep 2023 15:09:59 +0800
Subject: [PATCH] fix: tree select

---
 .vscode/settings.json                          |  1 +
 .../Form/src/components/ApiCascader.vue        | 18 +++++++++---------
 .../Form/src/components/ApiRadioGroup.vue      |  5 +++--
 .../Form/src/components/ApiSelect.vue          | 12 +++++++++---
 src/components/Form/src/components/ApiTree.vue |  8 ++++----
 .../Form/src/components/ApiTreeSelect.vue      | 18 +++++++++---------
 src/components/Modal/src/props.ts              |  2 +-
 src/views/system/dept/DeptModal.vue            |  5 ++++-
 8 files changed, 40 insertions(+), 29 deletions(-)

diff --git a/.vscode/settings.json b/.vscode/settings.json
index adc418f..6f17811 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -121,6 +121,7 @@
     "antv",
     "brotli",
     "browserslist",
+    "Cascader",
     "codemirror",
     "commitlint",
     "cropperjs",
diff --git a/src/components/Form/src/components/ApiCascader.vue b/src/components/Form/src/components/ApiCascader.vue
index e92ef3e..e93cada 100644
--- a/src/components/Form/src/components/ApiCascader.vue
+++ b/src/components/Form/src/components/ApiCascader.vue
@@ -11,14 +11,12 @@ import { useI18n } from '@/hooks/web/useI18n'
 defineOptions({ name: 'ApiCascader' })
 
 const props = defineProps({
-  value: {
-    type: Array,
-  },
+  value: propTypes.array.def([]),
   api: {
     type: Function as PropType<(arg?: Recordable) => Promise<Option[]>>,
     default: null,
   },
-  numberToString: propTypes.bool,
+  numberToString: propTypes.bool.def(false),
   resultField: propTypes.string.def(''),
   labelField: propTypes.string.def('label'),
   valueField: propTypes.string.def('value'),
@@ -55,7 +53,7 @@ const apiData = ref<any[]>([])
 const options = ref<Option[]>([])
 const loading = ref<boolean>(false)
 const emitData = ref<any[]>([])
-const isFirstLoad = ref(true)
+const isFirstLoad = ref(false)
 const { t } = useI18n()
 // Embedded in the form, just use the hook binding to perform form verification
 const [state]: any = useRuleFormItem(props, 'value', 'change', emitData)
@@ -150,10 +148,10 @@ watch(
   () => props.initFetchParams,
   () => {
     if (props.alwaysLoad)
-      !unref(isFirstLoad) && initialFetch()
+      initialFetch()
 
     else
-      initialFetch()
+      !unref(isFirstLoad) && initialFetch()
   },
   { deep: true },
 )
@@ -175,8 +173,10 @@ function handleRenderDisplay({ labels, selectedOptions }) {
 </script>
 
 <template>
-  <Cascader v-model:value="state" :options="options" :load-data="loadData" change-on-select
-    :display-render="handleRenderDisplay" @change="handleChange">
+  <Cascader
+    v-model:value="state" :options="options" :load-data="loadData" change-on-select
+    :display-render="handleRenderDisplay" @change="handleChange"
+  >
     <template v-if="loading" #suffixIcon>
       <LoadingOutlined spin />
     </template>
diff --git a/src/components/Form/src/components/ApiRadioGroup.vue b/src/components/Form/src/components/ApiRadioGroup.vue
index 74bbf1f..8dc49e2 100644
--- a/src/components/Form/src/components/ApiRadioGroup.vue
+++ b/src/components/Form/src/components/ApiRadioGroup.vue
@@ -11,6 +11,7 @@ import { useAttrs } from '@/hooks/core/useAttrs'
 import { propTypes } from '@/utils/propTypes'
 
 defineOptions({ name: 'ApiRadioGroup' })
+
 const props = defineProps({
   api: {
     type: Function as PropType<(arg?: Recordable | string) => Promise<OptionsItem[]>>,
@@ -70,10 +71,10 @@ watch(
   () => props.params,
   () => {
     if (props.alwaysLoad)
-      !unref(isFirstLoad) && fetch()
+      fetch()
 
     else
-      fetch()
+      !unref(isFirstLoad) && fetch()
   },
   { deep: true },
 )
diff --git a/src/components/Form/src/components/ApiSelect.vue b/src/components/Form/src/components/ApiSelect.vue
index f6cb25b..98b0a23 100644
--- a/src/components/Form/src/components/ApiSelect.vue
+++ b/src/components/Form/src/components/ApiSelect.vue
@@ -76,7 +76,11 @@ watch(
 watch(
   () => props.params,
   () => {
-    !unref(isFirstLoad) && fetch()
+    if (props.alwaysLoad)
+      fetch()
+
+    else
+      !unref(isFirstLoad) && fetch()
   },
   { deep: true },
 )
@@ -129,8 +133,10 @@ function handleChange(_, ...args) {
 </script>
 
 <template>
-  <Select v-bind="$attrs" v-model:value="state" :options="getOptions" @dropdown-open-change="handleFetch"
-    @change="handleChange">
+  <Select
+    v-bind="$attrs" v-model:value="state" :options="getOptions" @dropdown-open-change="handleFetch"
+    @change="handleChange"
+  >
     <template v-for="item in Object.keys($slots)" #[item]="data">
       <slot :name="item" v-bind="data || {}" />
     </template>
diff --git a/src/components/Form/src/components/ApiTree.vue b/src/components/Form/src/components/ApiTree.vue
index 665c069..3e30b36 100644
--- a/src/components/Form/src/components/ApiTree.vue
+++ b/src/components/Form/src/components/ApiTree.vue
@@ -39,10 +39,10 @@ watch(
   () => props.params,
   () => {
     if (props.alwaysLoad)
-      !unref(isFirstLoaded) && fetch()
+      fetch()
 
     else
-      fetch()
+      !unref(isFirstLoaded) && fetch()
   },
   { deep: true },
 )
@@ -51,10 +51,10 @@ watch(
   () => props.immediate,
   (v) => {
     if (props.alwaysLoad)
-      v && !isFirstLoaded.value && fetch()
+      v && fetch()
 
     else
-      v && fetch()
+      v && !isFirstLoaded.value && fetch()
   },
 )
 
diff --git a/src/components/Form/src/components/ApiTreeSelect.vue b/src/components/Form/src/components/ApiTreeSelect.vue
index 4064fc6..dcb2123 100644
--- a/src/components/Form/src/components/ApiTreeSelect.vue
+++ b/src/components/Form/src/components/ApiTreeSelect.vue
@@ -12,12 +12,12 @@ defineOptions({ name: 'ApiTreeSelect' })
 const props = defineProps({
   api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> },
   params: { type: Object },
-  immediate: { type: Boolean, default: true },
+  immediate: propTypes.bool.def(true),
   resultField: propTypes.string.def(''),
-  handleTree: { type: String, default: '' },
-  parentId: { type: Number, default: 0 },
-  parentLabel: { type: String, default: '' },
-  parentFiled: { type: String, default: 'name' },
+  handleTree: propTypes.string.def(''),
+  parentId: propTypes.number.def(0),
+  parentLabel: propTypes.string.def(''),
+  parentFiled: propTypes.string.def('name'),
   alwaysLoad: propTypes.bool.def(true),
 })
 const emit = defineEmits(['optionsChange', 'change'])
@@ -41,10 +41,10 @@ watch(
   () => props.params,
   () => {
     if (props.alwaysLoad)
-      !unref(isFirstLoaded) && fetch()
+      fetch()
 
     else
-      fetch()
+      !unref(isFirstLoaded) && fetch()
   },
   { deep: true },
 )
@@ -53,10 +53,10 @@ watch(
   () => props.immediate,
   (v) => {
     if (props.alwaysLoad)
-      v && !isFirstLoaded.value && fetch()
+      v && fetch()
 
     else
-      v && fetch()
+      v && !isFirstLoaded.value && fetch()
   },
 )
 
diff --git a/src/components/Modal/src/props.ts b/src/components/Modal/src/props.ts
index 832bec3..d0ae83e 100644
--- a/src/components/Modal/src/props.ts
+++ b/src/components/Modal/src/props.ts
@@ -52,7 +52,7 @@ export const basicProps = Object.assign({}, modalProps, {
 
   confirmLoading: { type: Boolean },
 
-  destroyOnClose: { type: Boolean },
+  destroyOnClose: { type: Boolean, default: true },
 
   footer: Object as PropType<VueNode>,
 
diff --git a/src/views/system/dept/DeptModal.vue b/src/views/system/dept/DeptModal.vue
index 51bd3ac..1932b5e 100644
--- a/src/views/system/dept/DeptModal.vue
+++ b/src/views/system/dept/DeptModal.vue
@@ -52,7 +52,10 @@ async function handleSubmit() {
 </script>
 
 <template>
-  <BasicModal v-bind="$attrs" :title="isUpdate ? t('action.edit') : t('action.create')" @register="registerModal" @ok="handleSubmit">
+  <BasicModal
+    v-bind="$attrs" :title="isUpdate ? t('action.edit') : t('action.create')" @register="registerModal"
+    @ok="handleSubmit"
+  >
     <BasicForm @register="registerForm" />
   </BasicModal>
 </template>