forked from ddrilling/asb_cloud_front
51 lines
1.6 KiB
TypeScript
51 lines
1.6 KiB
TypeScript
|
import { memo, ReactNode, useState } from 'react'
|
|||
|
|
import { Button, ButtonProps, Form, FormProps, Popover, PopoverProps } from 'antd'
|
|||
|
|
|
|||
|
|
export type PopromptProps = PopoverProps & {
|
|||
|
|
children?: ReactNode
|
|||
|
|
footer?: ReactNode
|
|||
|
|
text?: string
|
|||
|
|
onDone?: (values: any) => void
|
|||
|
|
formProps?: FormProps
|
|||
|
|
buttonProps?: ButtonProps
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export const Poprompt = memo<PopromptProps>(({ formProps, buttonProps, footer, children, onDone, text, ...other }) => {
|
|||
|
|
const [visible, setVisible] = useState<boolean>(false)
|
|||
|
|
|
|||
|
|
const onFormFinish = (values: any) => {
|
|||
|
|
setVisible(false)
|
|||
|
|
onDone?.(values)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<Popover
|
|||
|
|
content={(
|
|||
|
|
<Form
|
|||
|
|
onFinish={onFormFinish}
|
|||
|
|
autoComplete={'off'}
|
|||
|
|
{...formProps}
|
|||
|
|
>
|
|||
|
|
{children}
|
|||
|
|
<Form.Item style={{ marginBottom: 0 }}>
|
|||
|
|
{footer ?? (
|
|||
|
|
<div style={{ display: 'flex', justifyContent: 'flex-end' }}>
|
|||
|
|
<Button htmlType={'reset'} onClick={() => setVisible(false)}>Отмена</Button>
|
|||
|
|
<Button type={'primary'} htmlType={'submit'} style={{ marginLeft: '8px' }}>ОК</Button>
|
|||
|
|
</div>
|
|||
|
|
)}
|
|||
|
|
</Form.Item>
|
|||
|
|
</Form>
|
|||
|
|
)}
|
|||
|
|
trigger={'click'}
|
|||
|
|
{...other}
|
|||
|
|
visible={visible}
|
|||
|
|
onVisibleChange={(visible) => setVisible(visible)}
|
|||
|
|
>
|
|||
|
|
<Button {...buttonProps}>{text}</Button>
|
|||
|
|
</Popover>
|
|||
|
|
)
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
export default Poprompt
|