下拉数据仓库

.env.development

@@ -20,8 +20,8 @@ VITE_PROXY=[["/api","http://60.209.125.238:3008"],["/stage-api","https://www.666
 VITE_DROP_CONSOLE = false
 
 # 后台接口父地址(必填)
-VITE_GLOB_API_URL=http://localhost:3008
-# VITE_GLOB_API_URL="/api"   # 开发 测试环境
+# VITE_GLOB_API_URL=http://localhost:3008
+VITE_GLOB_API_URL="/api"   # 开发 测试环境
 
 # File upload address， optional
 #VITE_GLOB_UPLOAD_URL=http://localhost:8091/api/Common/UploadFile

src/components/Form/src/components/ApiCascader.vue

@@ -45,7 +45,7 @@
         type: Array,
       },
       api: {
-        type: Function as PropType<(arg?: Recordable) => Promise<Option[]>>,
+        type: Function as PropType<(arg?: Recordable) => Promise<Option[]>> || Array,
         default: null,
       },
       numberToString: propTypes.bool,

src/components/Form/src/components/ApiRadioGroup.vue

@@ -38,7 +38,7 @@
     },
     props: {
       api: {
-        type: Function as PropType<(arg?: Recordable | string) => Promise<OptionsItem[]>>,
+        type: Function as PropType<(arg?: Recordable | string) => Promise<OptionsItem[]>> || Array,
         default: null,
       },
       params: {

src/components/Form/src/components/ApiSelect.vue

@@ -48,6 +48,12 @@
         type: Function as PropType<(arg?: Recordable) => Promise<OptionsItem[]>>,
         default: null,
       },
+      option: {
+        type: Array,
+        default: () => {
+          return []
+        }
+      },
       // api params
       params: propTypes.any.def({}),
       // support xxx.xxx.xx
@@ -71,7 +77,6 @@
 
       const getOptions = computed(() => {
         const { labelField, valueField, numberToString } = props
-
         return unref(options).reduce((prev, next: Recordable) => {
           if (next) {
             const value = next[valueField]
@@ -106,8 +111,15 @@
 
       async function fetch() {
         const api = props.api
-        if (!api || !isFunction(api)) return
+        const option = props.option
         options.value = []
+        if (option && option.length) {
+          options.value = option
+          console.log(options.value)
+          emitChange()
+          return
+        }
+        if (!api || !isFunction(api)) return
         try {
           loading.value = true
           const res = await api(props.params)

src/components/Form/src/components/ApiTransfer.vue

@@ -25,7 +25,7 @@
     props: {
       value: { type: Array as PropType<Array<string>> },
       api: {
-        type: Function as PropType<(arg?: Recordable) => Promise<TransferItem[]>>,
+        type: Function as PropType<(arg?: Recordable) => Promise<TransferItem[]>> || Array,
         default: null,
       },
       params: { type: Object },

src/components/Form/src/components/ApiTree.vue

@@ -20,7 +20,7 @@
     name: 'ApiTree',
     components: { ATree: Tree, LoadingOutlined },
     props: {
-      api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> },
+      api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> || Array},
       params: { type: Object },
       immediate: { type: Boolean, default: true },
       resultField: propTypes.string.def(''),

src/components/Form/src/components/ApiTreeSelect.vue

@@ -20,7 +20,7 @@
     name: 'ApiTreeSelect',
     components: { ATreeSelect: TreeSelect, LoadingOutlined },
     props: {
-      api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> },
+      api: { type: Function as PropType<(arg?: Recordable) => Promise<Recordable>> || Array},
       params: { type: Object },
       immediate: { type: Boolean, default: true },
       resultField: propTypes.string.def(''),

src/design/public.less

@@ -122,7 +122,7 @@
 
 // basetbale form
 .vben-basic-form {
-  .ant-select-selector, .ant-form-item-control-input, .ant-input-affix-wrapper, .ant-form-item-control-input {
+  .ant-select-selector, .ant-input-number-input-wrap {
     height: 28px!important;
     min-height: 28px!important;
   }

src/store/modules/configOptions.ts

@@ -0,0 +1,25 @@
+import {
+  GetClientSourceSelectList,
+  GetClientStlModeSelectList,
+  GetVesselSelectList
+} from '/@/views/operation/seaexport/api/BookingLedger'
+export default {
+  // 业务来源
+  GetClientSourceSelectList: () => {
+    return GetClientSourceSelectList().then(res => {
+      return res.data
+    })
+  },
+  // 结算方式
+  GetClientStlModeSelectList: () => {
+    return GetClientStlModeSelectList().then(res => {
+      return res.data
+    })
+  },
+  // 船名
+  GetVesselSelectList: () => {
+    return GetVesselSelectList().then(res => {
+      return res.data
+    })
+  }
+}

src/store/modules/options.ts

@@ -0,0 +1,52 @@
+/*
+ * @Author: lijingjia lijj_xl@163.com
+ * @Date: 2024-06-18 09:56:07
+ * @Description: 存储所有下拉接口数据仓库
+ */
+import { defineStore } from 'pinia'
+import { store } from '/@/store'
+import Config from './configOptions'
+
+export const useOptionsStore = defineStore({
+  id: 'ds-options',
+  state: () => ({
+    // 业务来源
+    GetClientSourceSelectList: [],
+    // 结算方式
+    GetClientStlModeSelectList: [],
+    // 船名
+    GetVesselSelectList: [],
+  }),
+  getters: {
+    // 通过code获取下拉字典（code)就是接口尾部单词
+    getOptionsByCode: (store) => (code) => {
+      if (store.$state[code].length) {
+        // 如果state中下拉存储字段有值直接返回
+        return store.$state[code]
+      } else {
+        // 没有值调用接口存数据
+        store.setOptionsByCode(code).then(res => {
+          return res
+        })
+      }
+    }
+  },
+  actions: {
+    /**
+     * 通过code存储字典数据
+     * @param info multilingual info
+     */
+    setOptionsByCode(code) {
+      const options = Config[code]()
+      return options.then(res => {
+        this[code] = res
+        return res
+      })
+    }
+  }
+})
+
+// Need to be used outside the setup
+export function useOptionsStoreWithOut() {
+  return useOptionsStore(store)
+}

src/views/fee/currency/index.vue

@@ -21,8 +21,6 @@
         </template>
       </template>
     </BasicTable>
-     <!-- 应收表格 -->
-    <costEntry></costEntry>
     <Modal @register="registerModal" @success="handleSuccess" />
   </div>
 </template>
@@ -34,8 +32,6 @@
   import Modal from './components/Modal.vue'
   import { columns, searchFormSchema } from './columns'
   const [registerModal, { openModal }] = useModal()
-   // 费用录入组件
-  import costEntry from '/@/components/CostEntry/index.vue'
   const [registerTable, { reload, getForm, getPaginationRef }] = useTable({
     title: '币别设置',
     // api: getSysDictTypeList,

src/views/operation/seaexport/detail/modules/baseInfo.tsx

@@ -7,11 +7,7 @@ import { getDictOption } from '/@/utils/dictUtil'
 import { getOptions } from '/@/hooks/dict'
 import {
   // GetControllerClientList,
-  GetClientSourceSelectList,
   GetClientSourceDetailSelectList,
-  GetClientStlModeSelectList,
-  // GetCarrierlist,
-  // GetAgentCnClientList,
   GetVesselSelectList,
   GetVoynoSelectList,
   GetClientLanesSelectList,
@@ -30,6 +26,8 @@ import {
   GetServiceSelectList,
   GetPackageSelectList,
 } from '/@/views/operation/seaexport/api/BookingLedger'
+import { useOptionsStore } from '/@/store/modules/options'
+const optionsStore = useOptionsStore()
 const LockType = [
   { label: '锁定', value: true },
   { label: '未锁定', value: false },
@@ -238,10 +236,9 @@ export const basicInfoFormSchema: FormSchema[] = [
       return {
         allowClear: true,
         showSearch: true,
-        api: GetClientSourceSelectList,
+        option: optionsStore.getOptionsByCode('GetClientSourceSelectList'),
         labelField: 'sourceName',
         valueField: 'id',
-        resultField: 'data',
         filterOption: (input: string, option: any) => {
           return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
         },
@@ -301,10 +298,9 @@ export const basicInfoFormSchema: FormSchema[] = [
       return {
         allowClear: true,
         showSearch: true,
-        api: GetClientStlModeSelectList,
+        option: optionsStore.getOptionsByCode('GetClientStlModeSelectList'),
         labelField: 'stlName',
         valueField: 'id',
-        resultField: 'data',
         filterOption: (input: string, option: any) => {
           return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
         },
@@ -459,10 +455,9 @@ export const basicInfoFormSchema: FormSchema[] = [
     colProps: { span: 4 },
     componentProps: ({ formModel }) => {
       return {
-        api: GetVesselSelectList,
+        option: optionsStore.getOptionsByCode('GetVesselSelectList'),
         labelField: 'vesselName',
         valueField: 'id',
-        resultField: 'data',
         filterOption: (input: string, option: any) => {
           return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
         },

src/views/operation/seaexport/index.vue

@@ -160,6 +160,8 @@
   import { formatTableData } from '/@/hooks/web/common'
   import { FilterRules } from '/@/components/Condition/index'
   import { Field } from '/@/components/Render/interface'
+  import { useOptionsStore } from '/@/store/modules/options'
+  const optionsStore = useOptionsStore()
   // import { usePermissionStore } from '/@/store/modules/permission'
   // import initData from './modules/initData.js'
   import { useRouter, useRoute } from 'vue-router'
@@ -183,6 +185,10 @@
           item.inspectionDate = formatTableData(item.inspectionDate)
         })
         resolve({ data: [...res.data], total: res.count })
+        // 加载详情需要使用的下拉数据
+        optionsStore.getOptionsByCode('GetVesselSelectList')
+        optionsStore.getOptionsByCode('GetClientStlModeSelectList')
+        optionsStore.getOptionsByCode('GetClientSourceSelectList')
       })
     },
     beforeFetch: () => {