fix(dict): Optimized dictionary loading and synchronization of pagina…

…tion size and total.

Refined the dictionary loading logic, fixing an issue where the `pageSize` and `total` properties within the `pageOption` object of `dict` failed to synchronize correctly when using `form-select` and `form-item` components. Enhanced the watcher setup for deep listening, ensuring real-time responses to data changes. Moreover, eliminated unnecessary `setTimeout` for immediate loading.

Affected components: `src/components/ma-crud/components/searchFormItem/form-select.vue` and `src/components/ma-form/formItem/form-select.vue`.

fix: System configuration, radio options not rendering correctly in configuration component.

Added `v-if="isCreateNode"` to `ma-form` for a comprehensive resolution to the rendering issue. Credit to @westng

Closes #191

src/components/ma-crud/components/searchFormItem/form-select.vue

@@ -72,7 +72,7 @@ if ( props.component.multiple === true ) {
 if (isObject(props.component.dict)) {
   props.component.dict.pageOption = {
     page: 1,
-    pageSize: props.component?.dict?.pageSize ?? 15
+    pageSize: props.component?.dict?.pageOption?.pageSize ?? props.component?.dict?.pageSize ?? 15
   }
 }
 
@@ -108,6 +108,9 @@ const handlePage = async (page) => {
 
 watch( () => get(searchForm.value, props.component.dataIndex), vl => value.value = vl )
 watch( () => value.value, v => set(searchForm.value, props.component.dataIndex, v) )
+watch( () => dicts.value[dictIndex] , async v => {
+  dataTotal.value = v?.pageInfo?.total || 0
+})
 
 const handlerChangeeEvent = (value) => {
   handlerCascader(
@@ -116,10 +119,5 @@ const handlerChangeeEvent = (value) => {
 }
 
 onMounted(() => {
-  setTimeout(() => {
-    if (isObject(dicts.value[dictIndex])) {
-      dataTotal.value = dicts.value[dictIndex]?.pageInfo?.total
-    }
-  }, 3000);
 })
 </script>

src/components/ma-form/formItem/form-select.vue

@@ -95,7 +95,7 @@ const props = defineProps({
 if (isObject(props.component.dict)) {
   props.component.dict.pageOption = {
     page: 1,
-    pageSize: props.component?.dict?.pageSize ?? 15
+    pageSize: props.component?.dict?.pageOption?.pageSize ?? props.component?.dict?.pageSize ?? 15
   }
 }
 
@@ -116,6 +116,9 @@ watch( () => value.value, v => {
   set(formModel.value, index, v)
   index.indexOf('.') > -1 && delete formModel.value[index]
 } )
+watch( () => dictList.value[index] , async v => {
+  dataTotal.value = v?.pageInfo?.total || 0
+})
 
 if (value.value === '') {
   value.value = undefined
@@ -170,11 +173,5 @@ const handleCascaderChangeEvent = async (value) => {
 
 rv('onCreated')
 onMounted(() => {
-  setTimeout(() => {
-    if (isObject(dictList.value[index])) {
-      dataTotal.value = dictList.value[index]?.pageInfo?.total
-    }
-  }, 800);
-  rv('onMounted')
 })
 </script>

src/views/setting/config/index.vue

@@ -40,6 +40,7 @@
           :title="item.name"
         >
           <ma-form
+            v-if="isCreateNode"
             v-model="formArray[item.id]"
             :columns="optionsArray[item.id]"
             @submit="submit"