pay-company/src/pages/customer/archive/table/modals/Transfer.tsx

import {
  MyBetaModalFormProps,
  MyButtons,
  MyFormItems,
  MyModalFormProps,
  rulesHelper,
} from '@/common';
import { Apis } from '@/gen/Apis';
import {
  HouseOccupantsCardTypeEnum,
  HouseOccupantsHouseRelationEnum,
} from '@/gen/Enums';
import { BetaSchemaForm, ProCard } from '@ant-design/pro-components';
import { Form, message, Modal } from 'antd';
import { useState } from 'react';

export default function Transfer(props: MyBetaModalFormProps) {
  const [form] = Form.useForm();
  const [open, setOpen] = useState(false);

  const handleOpen = () => {
    const totalPayableSum = props?.item?.total_payable_sum;
    if (totalPayableSum && totalPayableSum > 0) {
      Modal.confirm({
        title: '提示',
        content: `该房屋存在未收取的账单，金额合计： ¥${totalPayableSum} ，是否继续操作过户 ？`,
        okText: '继续过户',
        cancelText: '取消',
        onOk: () => {
          form.resetFields();
          setOpen(true);
        },
        onCancel: () => {
          setOpen(false);
        },
      });
    } else {
      form.resetFields();
      setOpen(true);
    }
  };

  return (
    <>
      <MyButtons.Default
        title={props.title}
        size="middle"
        type="primary"
        disabled={!props.item?.house_occupants?.length}
        onClick={handleOpen}
      />
      <BetaSchemaForm<ApiTypes.Archive.HouseRegisters.Store>
        {...MyModalFormProps.props}
        title={`${props.title}`}
        wrapperCol={{ span: 24 }}
        width="1000px"
        open={open}
        onOpenChange={setOpen}
        key={new Date().getTime()}
        form={form}
        onFinish={async (values) =>
          Apis.Archive.HouseRegisters.Store({
            ...values,
            asset_houses_id: props?.item?.id,
            type: 'Transfer',
            customer_info: values.customer_info?.map((res: any) => {
              return {
                ...res,
                house_relation: 'Owner',
                relation_with_owner: 'Self',
                residential_relation: 'PropertyOwner',
              };
            }),
          })
            .then(() => {
              props.reload?.();
              message.success(props.title + '成功');
              return true;
            })
            .catch(() => false)
        }
        columns={[
          // MyFormItems.EnumRadio({
          //   key: 'house_status',
          //   title: '房屋状态',
          //   colProps: { span: 12 },
          //   valueEnum: HouseRegistersHouseStatusEnum,
          //   formItemProps: { ...rulesHelper.text },
          // }),
          // MyFormItems.EnumRadio({
          //   key: 'house_status',
          //   title: '使用计划',
          //   colProps: { span: 8 },
          //   valueEnum: HouseRegistersUsagePlanEnum,
          //   formItemProps: { ...rulesHelper.text },
          // }),
          // MyFormItems.EnumSelect({
          //   key: 'customer_type',
          //   title: '产权归属',
          //   colProps: { span: 6 },
          //   valueEnum: HouseRegistersCustomerTypeEnum,
          // }),
          MyFormItems.UploadImages({
            key: 'ownership_info',
            title: '产权文件',
            tooltip: '上限9张',
            // uploadType: 'file',
            max: 9,
            colProps: { span: 18 },
            formItemProps: { ...rulesHelper.array },
          }),
          {
            valueType: 'formList',
            dataIndex: 'customer_info',
            colProps: { span: 24 },
            initialValue: [''],
            fieldProps: {
              copyIconProps: false,
              creatorButtonProps: {
                creatorButtonText: '添加业主',
              },
              itemRender: (
                { listDom, action }: any,
                { index }: { index: number },
              ) => {
                return (
                  <ProCard
                    bordered
                    style={{ marginBlockEnd: 0 }}
                    title={`产权人 ${index + 1}`}
                    extra={action}
                    bodyStyle={{ paddingBlockEnd: 0 }}
                  >
                    {listDom}
                  </ProCard>
                );
              },
            },
            columns: [
              {
                valueType: 'group',
                columns: [
                  {
                    title: '名称',
                    dataIndex: 'name',
                    colProps: { span: 5 },
                    formItemProps: { ...rulesHelper.text },
                  },
                  {
                    title: '手机号',
                    dataIndex: 'phone',
                    colProps: { span: 5 },
                    fieldProps: {
                      maxLength: 11,
                    },
                    formItemProps: { ...rulesHelper.phone },
                  },
                  MyFormItems.EnumSelect({
                    key: 'card_type',
                    title: '证件类型',
                    colProps: { span: 6 },
                    valueEnum: HouseOccupantsCardTypeEnum,
                    required: true,
                  }),
                  {
                    title: '证件号码',
                    dataIndex: 'id_card',
                    colProps: { span: 8 },
                    fieldProps: {
                      maxLength: 18,
                    },
                    formItemProps: { ...rulesHelper.text },
                  },
                  MyFormItems.EnumRadio({
                    key: 'house_relation',
                    title: '住户类型',
                    colProps: { span: 6 },
                    valueEnum: HouseOccupantsHouseRelationEnum,
                    fieldProps: {
                      defaultValue: 'Owner',
                    },
                    hideInForm: true,
                  }),
                  {
                    valueType: 'group',
                    columns: [
                      MyFormItems.UploadImages({
                        key: 'card_front_image',
                        title: '证件正面',
                        // uploadType: 'file',
                        required: true,
                        max: 1,
                        colProps: { span: 6 },
                      }),
                      MyFormItems.UploadImages({
                        key: 'card_back_image',
                        title: '证件反面',
                        // uploadType: 'file',
                        required: true,
                        max: 1,
                        colProps: { span: 6 },
                      }),
                      {
                        title: '是否入住',
                        dataIndex: 'is_live_in',
                        colProps: { span: 6 },
                        valueType: 'switch',
                      },
                      {
                        name: ['is_live_in'],
                        valueType: 'dependency',
                        columns: ({ is_live_in }: any) => {
                          return is_live_in
                            ? [
                                {
                                  title: '入住日期',
                                  dataIndex: 'move_in_date',
                                  valueType: 'date',
                                  colProps: { span: 6 },
                                  fieldProps: {
                                    style: { width: '100%' },
                                  },
                                  formItemProps: { ...rulesHelper.text },
                                },
                              ]
                            : [];
                        },
                      },
                    ],
                  },
                ],
              },
            ],
          },
        ]}
      />
    </>
  );
}