fix: async bugs in BotForm

This commit is contained in:
Junyan Qin
2025-05-08 12:23:24 +08:00
parent 436b45c05c
commit ef6be4dfd9

View File

@@ -100,7 +100,7 @@ export default function BotForm({
const [isLoading, setIsLoading] = useState<boolean>(false); const [isLoading, setIsLoading] = useState<boolean>(false);
useEffect(() => { useEffect(() => {
initBotFormComponent(); initBotFormComponent().then(() => {
// 拉取初始化表单信息 // 拉取初始化表单信息
if (initBotId) { if (initBotId) {
@@ -115,18 +115,31 @@ export default function BotForm({
handleAdapterSelect(val.adapter); handleAdapterSelect(val.adapter);
// dynamicForm.setFieldsValue(val.adapter_config); // dynamicForm.setFieldsValue(val.adapter_config);
}); });
} else { } else {
form.reset(); form.reset();
} }
})
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, []); }, []);
async function initBotFormComponent() { async function initBotFormComponent() {
// 初始化流水线列表
const pipelinesRes = await httpClient.getPipelines();
console.log('rawPipelineList', pipelinesRes);
setPipelineNameList(
pipelinesRes.pipelines.map((item) => {
return {
label: item.name,
value: item.uuid,
};
}),
);
// 拉取adapter // 拉取adapter
const rawAdapterList = await httpClient.getAdapters(); const adaptersRes = await httpClient.getAdapters();
// 初始化适配器选择列表 console.log('rawAdapterList', adaptersRes);
setAdapterNameList( setAdapterNameList(
rawAdapterList.adapters.map((item) => { adaptersRes.adapters.map((item) => {
return { return {
label: item.label.zh_CN, label: item.label.zh_CN,
value: item.name, value: item.name,
@@ -136,7 +149,7 @@ export default function BotForm({
// 初始化适配器图标列表 // 初始化适配器图标列表
setAdapterIconList( setAdapterIconList(
rawAdapterList.adapters.reduce((acc, item) => { adaptersRes.adapters.reduce((acc, item) => {
acc[item.name] = httpClient.getAdapterIconURL(item.name); acc[item.name] = httpClient.getAdapterIconURL(item.name);
return acc; return acc;
}, {} as Record<string, string>), }, {} as Record<string, string>),
@@ -144,27 +157,14 @@ export default function BotForm({
// 初始化适配器描述列表 // 初始化适配器描述列表
setAdapterDescriptionList( setAdapterDescriptionList(
rawAdapterList.adapters.reduce((acc, item) => { adaptersRes.adapters.reduce((acc, item) => {
acc[item.name] = item.description.zh_CN; acc[item.name] = item.description.zh_CN;
return acc; return acc;
}, {} as Record<string, string>), }, {} as Record<string, string>),
); );
if (initBotId) {
// 初始化流水线列表
const rawPipelineList = await httpClient.getPipelines();
setPipelineNameList(
rawPipelineList.pipelines.map((item) => {
return {
label: item.name,
value: item.uuid,
};
}),
);
}
// 初始化适配器表单map // 初始化适配器表单map
rawAdapterList.adapters.forEach((rawAdapter) => { adaptersRes.adapters.forEach((rawAdapter) => {
adapterNameToDynamicConfigMap.set( adapterNameToDynamicConfigMap.set(
rawAdapter.name, rawAdapter.name,
rawAdapter.spec.config.map( rawAdapter.spec.config.map(
@@ -198,7 +198,7 @@ export default function BotForm({
name: bot.name, name: bot.name,
adapter_config: bot.adapter_config, adapter_config: bot.adapter_config,
enable: bot.enable ?? true, enable: bot.enable ?? true,
use_pipeline_uuid: bot.use_pipeline_uuid, use_pipeline_uuid: bot.use_pipeline_uuid ?? '',
}; };
} }
@@ -348,47 +348,47 @@ export default function BotForm({
{/* 是否启用 & 绑定流水线 仅在编辑模式 */} {/* 是否启用 & 绑定流水线 仅在编辑模式 */}
{initBotId && ( {initBotId && (
<div className="flex items-center gap-6"> <div className="flex items-center gap-6">
<FormField <FormField
control={form.control} control={form.control}
name="enable" name="enable"
render={({ field }) => ( render={({ field }) => (
<FormItem className="flex flex-col justify-start gap-[0.8rem] h-[3.8rem]"> <FormItem className="flex flex-col justify-start gap-[0.8rem] h-[3.8rem]">
<FormLabel></FormLabel> <FormLabel></FormLabel>
<FormControl> <FormControl>
<Switch checked={field.value} onCheckedChange={field.onChange} /> <Switch checked={field.value} onCheckedChange={field.onChange} />
</FormControl> </FormControl>
</FormItem> </FormItem>
)} )}
/> />
<FormField <FormField
control={form.control} control={form.control}
name="use_pipeline_uuid" name="use_pipeline_uuid"
render={({ field }) => ( render={({ field }) => (
<FormItem className="flex flex-col justify-start gap-[0.8rem] h-[3.8rem]"> <FormItem className="flex flex-col justify-start gap-[0.8rem] h-[3.8rem]">
<FormLabel>线</FormLabel> <FormLabel>线</FormLabel>
<FormControl> <FormControl>
<Select <Select
onValueChange={field.onChange} onValueChange={field.onChange}
{...field} {...field}
> >
<SelectTrigger> <SelectTrigger>
<SelectValue placeholder="选择流水线" /> <SelectValue placeholder="选择流水线" />
</SelectTrigger> </SelectTrigger>
<SelectContent className="fixed z-[1000]"> <SelectContent className="fixed z-[1000]">
<SelectGroup> <SelectGroup>
{pipelineNameList.map((item) => ( {pipelineNameList.map((item) => (
<SelectItem key={item.value} value={item.value}> <SelectItem key={item.value} value={item.value}>
{item.label} {item.label}
</SelectItem> </SelectItem>
))} ))}
</SelectGroup> </SelectGroup>
</SelectContent> </SelectContent>
</Select> </Select>
</FormControl> </FormControl>
</FormItem> </FormItem>
)} )}
/> />
</div> </div>
)} )}