chore: 完善字典封装

src/hooks/business/dict.ts

@@ -2,41 +2,55 @@ import { ref } from 'vue';
 import { fetchGetDictDataByType } from '@/service/api';
 import { useDictStore } from '@/store/modules/dict';
 
-export function useDict() {
+export function useDict(dictType: string, immediate: boolean = true) {
   const dictStore = useDictStore();
 
-  async function getDictData(dictType: string) {
+  const data = ref<Api.System.DictData[]>([]);
+  const record = ref<Record<string, string>>({});
+  const options = ref<CommonType.Option[]>([]);
+
+  async function getData() {
     const dicts = dictStore.getDict(dictType);
     if (dicts) {
-      return dicts;
+      data.value = dicts;
+      return;
     }
-    const { data, error } = await fetchGetDictDataByType(dictType);
-    if (error) return [];
-    dictStore.setDict(dictType, data);
-    return data;
+    const { data: dictData, error } = await fetchGetDictDataByType(dictType);
+    if (error) return;
+    dictStore.setDict(dictType, dictData);
+    data.value = dictData;
   }
 
-  function getDictRecord(dictType: string) {
-    const dictRecord = ref<{ [key: string]: string }>({});
-    getDictData(dictType).then(dictData => {
-      dictData.forEach(dict => {
-        dictRecord.value[dict.dictValue!] = dict.dictLabel!;
+  async function getRecord() {
+    if (!data.value.length) {
+      await getData();
+    }
+    data.value.forEach(dict => {
+      record.value[dict.dictValue!] = dict.dictLabel!;
     });
-    });
-    return dictRecord;
   }
 
-  function getDictOptions(dictType: string) {
-    const dictOptions = ref<CommonType.Option[]>([]);
-    getDictData(dictType).then(dictData => {
-      dictOptions.value = dictData.map(dict => ({ label: dict.dictLabel!, value: dict.dictValue! }));
+  async function getOptions() {
+    if (!data.value.length) {
+      await getData();
+    }
+
+    options.value = data.value.map(dict => ({ label: dict.dictLabel!, value: dict.dictValue! }));
+  }
+
+  if (immediate) {
+    getData().then(() => {
+      getRecord();
+      getOptions();
     });
-    return dictOptions;
   }
 
   return {
-    getDictData,
-    getDictRecord,
-    getDictOptions
+    data,
+    record,
+    options,
+    getData,
+    getRecord,
+    getOptions
   };
 }

src/views/system/menu/index.vue

@@ -259,8 +259,7 @@ const btnColumns: DataTableColumns<Api.System.Menu> = [
   }
 ];
 
-const { getDictRecord } = useDict();
-const showHideRecord = getDictRecord('sys_show_hide');
+const { record: showHideRecord } = useDict('sys_show_hide');
 </script>
 
 <template>

src/views/system/menu/modules/menu-operate-drawer.vue

@@ -40,9 +40,8 @@ const visible = defineModel<boolean>('visible', {
   default: false
 });
 
-const { getDictOptions } = useDict();
-const showHideOptions = getDictOptions('sys_show_hide');
-const enableStatusOptions = getDictOptions('sys_normal_disable');
+const { options: showHideOptions, getOptions: getShowHideOptions } = useDict('sys_show_hide', false);
+const { options: enableStatusOptions, getOptions: getNormalDisableOptions } = useDict('sys_normal_disable', false);
 
 const iconType = ref<Api.System.IconType>('1');
 const { formRef, validate, restoreValidation } = useNaiveForm();
@@ -221,6 +220,9 @@ watch(visible, () => {
   if (visible.value) {
     handleInitModel();
     restoreValidation();
+    getShowHideOptions();
+    getShowHideOptions();
+    getNormalDisableOptions();
   }
 });