fix: IDLPAD

apps/web-ele/src/adapter/component/index.ts

@@ -18,6 +18,12 @@ import { ElNotification } from 'element-plus';
 import { Tinymce as RichTextarea } from '#/components/tinymce';
 import { FileUpload, ImageUpload } from '#/components/upload';
 
+const AutoComplete = defineAsyncComponent(() =>
+  Promise.all([
+    import('element-plus/es/components/autocomplete/index'),
+    import('element-plus/es/components/autocomplete/style/css'),
+  ]).then(([res]) => res.ElAutocomplete),
+);
 const ElButton = defineAsyncComponent(() =>
   Promise.all([
     import('element-plus/es/components/button/index'),
@@ -178,6 +184,7 @@ export type ComponentType =
   | 'ApiCascader'
   | 'ApiSelect'
   | 'ApiTreeSelect'
+  | 'AutoComplete'
   | 'Checkbox'
   | 'CheckboxGroup'
   | 'DatePicker'
@@ -243,6 +250,7 @@ async function initComponentAdapter() {
         visibleEvent: 'onVisibleChange',
       },
     ),
+    AutoComplete,
     Checkbox: ElCheckbox,
     CheckboxGroup: (props, { attrs, slots }) => {
       let defaultSlot;

apps/web-ele/src/views/system/menu/data.ts

@@ -166,8 +166,17 @@ export function useFormSchema(): VbenFormSchema[] {
       component: 'AutoComplete',
       componentProps: {
         clearable: true,
-        filterOption(input: string, option: { value: string }) {
+        fetchSuggestions(queryString: string, cb: any) {
-          return option.value.toLowerCase().includes(input.toLowerCase());
+          const options = componentKeys.map((v) => ({ value: v }));
+          const createFilter = (qs: string) => {
+            return (restaurant: any) => {
+              return restaurant.value.toLowerCase().includes(qs.toLowerCase());
+            };
+          };
+          const results = queryString
+            ? options.filter(createFilter(queryString))
+            : options;
+          cb(results);
         },
         placeholder: '请选择组件名称',
         options: componentKeys.map((v) => ({ value: v })),