import { MyBetaModalFormProps, renderTextHelper } from '@/common';
import { MyModal } from '@/components/MyModal';
import { HouseBillsBillStatusEnum, HouseBillsTypeEnum } from '@/gen/Enums';
import { ProCard, ProDescriptions } from '@ant-design/pro-components';
import { Space } from 'antd';

export default function SummaryShow(props: MyBetaModalFormProps) {
  return (
    <MyModal
      title={props.title || '查看'}
      type={props.item?.type || 'primary'}
      width="600px"
      node={
        <Space direction="vertical" style={{ width: '100%' }}>
          <ProCard>
            <ProDescriptions column={1}>
              <ProDescriptions.Item label="房屋名称" span={3}>
                {props?.item?.asset_house?.full_name || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="账单金额">
                <Space>
                  {props?.item?.amount || '-'}
                  <renderTextHelper.Tag
                    Enums={HouseBillsTypeEnum}
                    value={props?.item?.type}
                    key="type"
                  />
                </Space>
              </ProDescriptions.Item>
              <ProDescriptions.Item label="优惠金额">
                {props?.item?.discount_amount || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="滞纳金">
                {props?.item?.late_fee || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="应付金额">
                <Space>
                  {props?.item?.total_payable_amount || '-'}{' '}
                  <renderTextHelper.Tag
                    Enums={HouseBillsBillStatusEnum}
                    value={props?.item?.bill_status}
                    key="bill_status"
                  />
                </Space>
              </ProDescriptions.Item>
              <ProDescriptions.Item label="账单月份">
                <Space>
                  <span>
                    {props?.item?.year || '-'}-
                    {String(props?.item?.month).padStart(2, '0')}月
                  </span>
                  <span>
                    （ {props?.item?.start_date || '-'} 至{' '}
                    {props?.item?.end_date || '-'}）
                  </span>
                </Space>
              </ProDescriptions.Item>
              <ProDescriptions.Item label="收款账号">
                <Space>
                  {props?.item?.receipt_account?.company_name || '-'}
                  {props?.item?.receipt_account?.company_bank || '-'}
                  {props?.item?.receipt_account?.company_account || '-'}
                </Space>
              </ProDescriptions.Item>
            </ProDescriptions>
          </ProCard>
        </Space>
      }
    />
  );
}