8445143359
### What problem does this PR solve? Feat: Add RunSheet component #3221 ### Type of change - [x] New Feature (non-breaking change which adds functionality)
103 lines
2.6 KiB
TypeScript
103 lines
2.6 KiB
TypeScript
import {
|
|
Form,
|
|
FormControl,
|
|
FormField,
|
|
FormItem,
|
|
FormMessage,
|
|
} from '@/components/ui/form';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Popover, PopoverContent } from '@/components/ui/popover';
|
|
import { useParseDocument } from '@/hooks/document-hooks';
|
|
import { IModalProps } from '@/interfaces/common';
|
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
import { PropsWithChildren } from 'react';
|
|
import { useForm } from 'react-hook-form';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { z } from 'zod';
|
|
|
|
const reg =
|
|
/^(((ht|f)tps?):\/\/)?([^!@#$%^&*?.\s-]([^!@#$%^&*?.\s]{0,63}[^!@#$%^&*?.\s])?\.)+[a-z]{2,6}\/?/;
|
|
|
|
const FormSchema = z.object({
|
|
url: z.string(),
|
|
result: z.any(),
|
|
});
|
|
|
|
const values = {
|
|
url: '',
|
|
result: null,
|
|
};
|
|
|
|
export const PopoverForm = ({
|
|
children,
|
|
visible,
|
|
switchVisible,
|
|
}: PropsWithChildren<IModalProps<any>>) => {
|
|
const form = useForm({
|
|
defaultValues: values,
|
|
resolver: zodResolver(FormSchema),
|
|
});
|
|
const { parseDocument, loading } = useParseDocument();
|
|
const { t } = useTranslation();
|
|
|
|
// useResetFormOnCloseModal({
|
|
// form,
|
|
// visible,
|
|
// });
|
|
|
|
async function onSubmit(values: z.infer<typeof FormSchema>) {
|
|
const val = values.url;
|
|
|
|
if (reg.test(val)) {
|
|
const ret = await parseDocument(val);
|
|
if (ret?.data?.code === 0) {
|
|
form.setValue('result', ret?.data?.data);
|
|
}
|
|
}
|
|
}
|
|
|
|
const content = (
|
|
<Form {...form}>
|
|
<form onSubmit={form.handleSubmit(onSubmit)}>
|
|
<FormField
|
|
control={form.control}
|
|
name={`url`}
|
|
render={({ field }) => (
|
|
<FormItem className="flex-1">
|
|
<FormControl>
|
|
<Input
|
|
{...field}
|
|
// onPressEnter={(e) => e.preventDefault()}
|
|
placeholder={t('flow.pasteFileLink')}
|
|
// suffix={
|
|
// <Button
|
|
// type="primary"
|
|
// onClick={onOk}
|
|
// size={'small'}
|
|
// loading={loading}
|
|
// >
|
|
// {t('common.submit')}
|
|
// </Button>
|
|
// }
|
|
/>
|
|
</FormControl>
|
|
<FormMessage />
|
|
</FormItem>
|
|
)}
|
|
/>
|
|
<FormField
|
|
control={form.control}
|
|
name={`result`}
|
|
render={() => <></>}
|
|
/>
|
|
</form>
|
|
</Form>
|
|
);
|
|
|
|
return (
|
|
<Popover open={visible} onOpenChange={switchVisible}>
|
|
{children}
|
|
<PopoverContent>{content}</PopoverContent>
|
|
</Popover>
|
|
);
|
|
};
|