import { reactive, toRefs } from 'vue';
|
|
import { useDebounceFn } from '@vueuse/core';
|
|
import { getDataInterfaceInfo } from '#/api/systemData/dataInterface';
|
|
export function useField(activeData) {
|
interface State {
|
options: any[];
|
allOptions: any[];
|
}
|
|
const state = reactive<State>({
|
options: [],
|
allOptions: [],
|
});
|
const { options, allOptions } = toRefs(state);
|
const debounceOnSearch = useDebounceFn(onSearch, 300);
|
|
function onSearch(searchText: string) {
|
state.options = state.allOptions.filter((o) => o.value.toLowerCase().includes(searchText.toLowerCase()));
|
}
|
function onFocus(searchText) {
|
onSearch(searchText);
|
}
|
function initFieldData() {
|
const jnpfKey = activeData.__config__.jnpfKey;
|
const list = new Set(['autoComplete', 'popupSelect', 'popupTableSelect']);
|
if (list.has(jnpfKey)) {
|
if (!activeData.interfaceId) return (state.allOptions = []);
|
} else {
|
if (activeData.__config__.dataType !== 'dynamic' || !activeData.__config__.propsUrl) return (state.allOptions = []);
|
}
|
const url = list.has(jnpfKey) ? activeData.interfaceId : activeData.__config__.propsUrl;
|
getDataInterfaceInfo(url).then((res) => {
|
const data = res.data;
|
const list = data.fieldJson ? JSON.parse(data.fieldJson) : [];
|
state.allOptions = list.map((o) => ({ ...o, value: o.defaultValue }));
|
});
|
}
|
|
return {
|
options,
|
allOptions,
|
debounceOnSearch,
|
onFocus,
|
initFieldData,
|
};
|
}
|