import { IPaymentTaskModalProps, PaymentTaskModal } from '@/components';
import {
	FormInstance,
	ProFormSelect,
	ProFormSelectProps,
} from '@ant-design/pro-components';
import { useState } from 'react';

export interface IPaymentTaskSearchProps extends ProFormSelectProps {
	form: FormInstance;
	selectedList?: IPaymentTaskModalProps['selectedList'];
	onFinish?: (paymentTaskVOList: BusinessAPI.PaymentTaskVO[]) => void;
	params: BusinessAPI.PaymentTaskPageQry;
}

export default function PaymentTaskSearch(props: IPaymentTaskSearchProps) {
	const { form, selectedList, onFinish, params, ...rest } = props;

	const [showPaymentTaskModal, setShowPaymentTaskModal] =
		useState<boolean>(false);
	const [paymentTaskList, setPaymentTaskList] =
		useState<(BusinessAPI.PaymentTaskVO | undefined)[]>();

	return (
		<>
			<ProFormSelect
				{...rest}
				fieldProps={{
					open: false,
					onClick: () => {
						setShowPaymentTaskModal(true);
					},
					placeholder: '请选择付款任务',
					options: paymentTaskList?.map(
						(paymentTaskVO?: BusinessAPI.PaymentTaskVO) => {
							console.log('paymentTaskVO', paymentTaskVO);
							return {
								value: paymentTaskVO?.paymentTaskId,
								label: paymentTaskVO?.taskName || paymentTaskVO?.paymentTaskSn,
							};
						},
					),
				}}
			/>
			<PaymentTaskModal
				title={'选择付款任务'}
				open={showPaymentTaskModal}
				onOk={() => setShowPaymentTaskModal(false)}
				onCancel={() => setShowPaymentTaskModal(false)}
				selectedList={selectedList}
				onFinish={async (paymentTaskVOList) => {
					if (paymentTaskVOList.length > 0) {
						const paymentTaskVO = paymentTaskVOList[0];
						form.setFieldsValue({
							paymentTaskId: paymentTaskVO?.paymentTaskId,
							paymentTaskVO: paymentTaskVO,
						});
						form.validateFields(['paymentTaskId', 'paymentTaskVO']);
						setPaymentTaskList(paymentTaskVOList);
						setShowPaymentTaskModal(false);
						onFinish?.(paymentTaskVOList);
					}
				}}
				type={'radio'}
				params={params}
			/>
		</>
	);
}
