import {
  MyBetaModalFormProps,
  MyButtons,
  MyModalFormProps,
  rulesHelper,
} from '@/common';
import MyModalsContractsArchivedSelectList from '@/components/ModalsContractsArchivedSelectList';
import { Selects } from '@/components/Select';
import { Apis } from '@/gen/Apis';
import { BetaSchemaForm, ProCard } from '@ant-design/pro-components';
import { Form, message, Space } from 'antd';

export default function Create(props: MyBetaModalFormProps) {
  const [form] = Form.useForm();
  return (
    <BetaSchemaForm<ApiTypes.Contract.ContractArchiveReads.Store>
      {...MyModalFormProps.props}
      title={`添加${props.title}`}
      wrapperCol={{ span: 24 }}
      width="600px"
      key={new Date().getTime()}
      form={form}
      onOpenChange={(open: any) => {
        if (open) {
          form.resetFields(); // 清空表单数据
        }
      }}
      trigger={<MyButtons.Create title={`${props.title}`} />}
      onFinish={async (values: any) => {
        console.log(values, 'values');
        return Apis.Contract.ContractArchiveReads.Store({
          ...values,
          contract_archives_id: values?.contract_archives?.id ?? 0,
          is_need_return: values?.is_need_return || false,
          files: values?.files?.map((item: any) => ({
            contract_archive_files_id: item.id,
            borrow_number: item?.borrow_number,
          })),
        })
          .then(() => {
            props.reload?.();
            message.success('借阅成功！');
            return true;
          })
          .catch(() => false);
      }}
      columns={[
        Selects?.Employees({
          title: '借阅人',
          dataIndex: 'borrower_id',
          key: 'reader_id',
          colProps: { span: 12 },
          formItemProps: { ...rulesHelper.text },
          fieldProps: {
            showSearch: true,
          },
          required: true,
        }),
        {
          key: 'read_date',
          title: '借阅日期',
          dataIndex: 'read_date',
          valueType: 'date',
          formItemProps: { ...rulesHelper.text },
          fieldProps: {
            style: {
              width: '100%',
            },
          },
          colProps: { span: 12 },
        },

        {
          key: 'read_reason',
          title: '借阅原因',
          dataIndex: 'read_reason',
          // valueType: 'textarea',
          colProps: { span: 24 },
        },
        {
          valueType: 'divider',
          fieldProps: {
            orientation: 'left',
            children: '借阅文件',
          },
        },
        {
          colProps: { span: 24 },
          title: '选择归档合同',
          key: 'contract_archives',
          formItemProps: { ...rulesHelper.text },
          renderFormItem: (_, row: any) => {
            return (
              <Space>
                <MyModalsContractsArchivedSelectList
                  onChange={(e: any) => {
                    if (e && e.length > 0) {
                      let res = e[0];
                      form.setFieldsValue({
                        files: res?.contract_archive_files,
                        contract_archives: {
                          id: res?.id,
                          code: res?.code,
                        },
                      });
                    }
                    console.log(e, 'e');
                  }}
                />
                {row?.value?.code && (
                  <span>已选择归档编号: {row?.value?.code}</span>
                )}
              </Space>
            );
          },
        },

        {
          valueType: 'formList',
          dataIndex: 'files',
          title: '',
          formItemProps: {
            ...rulesHelper.array,
            labelCol: { span: 0 },
            wrapperCol: { span: 24 },
          },
          colProps: { span: 24 },
          fieldProps: {
            copyIconProps: false,
            // deleteIconProps: false,
            creatorButtonProps: false,
            itemRender: ({ listDom, action }: any, { index }: any) => {
              return (
                <ProCard
                  bordered
                  extra={action}
                  title={`借阅文件${index + 1}`}
                  style={{
                    marginBlockEnd: 8,
                  }}
                >
                  {listDom}
                </ProCard>
              );
            },
          },

          columns: [
            {
              valueType: 'group',
              colProps: { span: 24 },
              columns: [
                {
                  title: '文件ID',
                  key: 'id',
                  colProps: { span: 6 },
                  fieldProps: {
                    disabled: true,
                  },
                },
                {
                  title: '名称',
                  key: 'name',
                  colProps: { span: 18 },
                  fieldProps: {
                    disabled: true,
                  },
                },
              ],
            },
          ],
        },
      ]}
    />
  );
}
