自动补全

src/views/neUser/sub/index.vue

@@ -24,6 +24,7 @@ import {
   resetUDMSub,
   updateUDMSub,
 } from '@/api/neData/udm_sub';
+import { listDept } from '@/api/system/tenant';
 import { uploadFile } from '@/api/tool/file';
 const { t } = useI18n();
 const { getDict } = useDictStore();
@@ -375,6 +376,12 @@ const modalStateFromOption = reactive({
     { label: 'HPLMN specific barring type 7', value: 6 },
     { label: 'HPLMN specific barring type 8', value: 7 },
   ],
+  tenantName: [
+    {
+      label: 'Tenant 1',
+      value: '1',
+    },
+  ],
 });
 
 //新增时初始SM Data
@@ -1210,12 +1217,37 @@ function delBigRow(bigIndex: any) {
   bigRows.value.splice(bigIndex, 1);
 }
 
+//自动完成框不区分大小写
+function filterOption(input: string, option: any) {
+  return option.value.toUpperCase().indexOf(input.toUpperCase()) >= 0;
+}
+
 onMounted(() => {
   // 初始字典数据
-  Promise.allSettled([getDict('udm_sub_cn_type')]).then(resArr => {
+  Promise.allSettled([
+    getDict('udm_sub_cn_type'),
+    listDept({ parentId: 0 }),
+  ]).then(resArr => {
     if (resArr[0].status === 'fulfilled') {
       dict.udmSubCNType = resArr[0].value;
     }
+    if (resArr[1].status === 'fulfilled') {
+      var tenantNameData = resArr[1].value;
+      if (
+        tenantNameData.code === RESULT_CODE_SUCCESS &&
+        Array.isArray(tenantNameData.data)
+      ) {
+        modalStateFromOption.tenantName = []; //上面置为空数组时会报错 故在此
+        tenantNameData.data.forEach((item: any) => {
+          if (item.parentId === '0') {
+            modalStateFromOption.tenantName.push({
+              value: item.tenantName,
+              label: item.tenantName,
+            });
+          }
+        });
+      }
+    }
   });
 
   // 获取网元网元列表
@@ -1305,17 +1337,17 @@ onMounted(() => {
             </a-form-item>
           </a-col>
         </a-row>
-
         <a-row :gutter="16">
           <a-col :lg="6" :md="12" :xs="24">
             <a-form-item
               :label="t('views.neUser.sub.tenantName')"
               name="tenantName "
             >
-              <a-input
+              <a-auto-complete
                 v-model:value="queryParams.tenantName"
-                allow-clear
-              ></a-input>
+                :options="modalStateFromOption.tenantName"
+                :filter-option="filterOption"
+              ></a-auto-complete>
             </a-form-item>
           </a-col>
         </a-row>