pay-company/src/pages/quality/renovation/components/info.tsx

import { MyBetaModalFormProps, renderTextHelper } from '@/common';
import {
  HouseOccupantsCardTypeEnum,
  RenovationAppliesProcessTypeEnum,
  RenovationAppliesRenovationContentEnum,
  RenovationAppliesTypeEnum,
} from '@/gen/Enums';
import { ProCard, ProDescriptions } from '@ant-design/pro-components';
import { Spin } from 'antd';

export default function Info(props: MyBetaModalFormProps) {
  return (
    <div>
      <Spin spinning={props?.item?.loading}>
        <ProCard bordered>
          <ProDescriptions column={3} title="基本信息">
            <ProDescriptions.Item label="房屋信息">
              {props?.item?.asset_house?.full_name || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="装修类型">
              <renderTextHelper.Tag
                Enums={RenovationAppliesTypeEnum}
                value={props?.item?.type}
                key="type"
              />
            </ProDescriptions.Item>
            <ProDescriptions.Item label="办理类型">
              <renderTextHelper.Tag
                Enums={RenovationAppliesProcessTypeEnum}
                value={props?.item?.process_type}
                key="process_type"
              />
            </ProDescriptions.Item>
            <ProDescriptions.Item label="是否有保证金">
              {props?.item?.is_deposit ? '是' : '否'}
            </ProDescriptions.Item>
            {props?.item?.is_deposit && (
              <ProDescriptions.Item label="保证金金额">
                {props?.item?.deposit_amount}
              </ProDescriptions.Item>
            )}
            <ProDescriptions.Item label="装修内容">
              <renderTextHelper.Tag
                Enums={RenovationAppliesRenovationContentEnum}
                value={props?.item?.renovation_content}
                key="renovation_content"
              />
            </ProDescriptions.Item>
            <ProDescriptions.Item label="施工开始时间">
              {props?.item?.construction_start_date || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="施工结束时间">
              {props?.item?.construction_end_date || '-'}
            </ProDescriptions.Item>
          </ProDescriptions>
        </ProCard>

        <ProCard bordered title="业主信息" style={{ marginTop: 16 }}>
          <ProDescriptions column={3}>
            <ProDescriptions.Item label="业主姓名">
              {props?.item?.owner_name || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="业主手机">
              {props?.item?.owner_phone || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="证件类型">
              <renderTextHelper.Tag
                Enums={HouseOccupantsCardTypeEnum}
                value={props?.item?.card_type}
                key="card_type"
              />
            </ProDescriptions.Item>
            <ProDescriptions.Item label="证件号码">
              {props?.item?.owner_id_card || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="证件正面">
              {props?.item?.id_card_front ? '已上传' : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="证件反面">
              {props?.item?.id_card_back ? '已上传' : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="房产证明">
              {props?.item?.property_certificate ? '已上传' : '-'}
            </ProDescriptions.Item>
          </ProDescriptions>
        </ProCard>

        {props?.item?.process_type === 'AgentProcess' && (
          <ProCard bordered title="代理人信息" style={{ marginTop: 16 }}>
            <ProDescriptions column={3}>
              <ProDescriptions.Item label="代理人名称">
                {props?.item?.agent_name || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="代理人手机">
                {props?.item?.agent_phone || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="证件类型">
                <renderTextHelper.Tag
                  Enums={HouseOccupantsCardTypeEnum}
                  value={props?.item?.agent_card_type}
                  key="agent_card_type"
                />
              </ProDescriptions.Item>
              <ProDescriptions.Item label="证件号码">
                {props?.item?.agent_id_card || '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="证件正面">
                {props?.item?.agent_id_card_front ? '已上传' : '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="证件反面">
                {props?.item?.agent_id_card_back ? '已上传' : '-'}
              </ProDescriptions.Item>
              <ProDescriptions.Item label="代理人授权书">
                {props?.item?.power_attorney ? '已上传' : '-'}
              </ProDescriptions.Item>
            </ProDescriptions>
          </ProCard>
        )}

        <ProCard bordered title="施工信息" style={{ marginTop: 16 }}>
          <ProDescriptions column={3}>
            <ProDescriptions.Item label="施工负责人名称">
              {props?.item?.construction_principal_name || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="施工负责人手机">
              {props?.item?.construction_principal_phone || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="证件类型">
              <renderTextHelper.Tag
                Enums={HouseOccupantsCardTypeEnum}
                value={props?.item?.construction_principal_card_type}
                key="construction_principal_card_type"
              />
            </ProDescriptions.Item>
            <ProDescriptions.Item label="施工负责人证件号">
              {props?.item?.construction_principal_id_card || '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="身份证正面">
              {props?.item?.construction_principal_id_card_front
                ? '已上传'
                : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="身份证反面">
              {props?.item?.construction_principal_id_card_back
                ? '已上传'
                : '-'}
            </ProDescriptions.Item>
          </ProDescriptions>
        </ProCard>

        {props?.item?.type === 'RenovationCompany' && (
          <>
            <ProCard bordered title="装修公司信息" style={{ marginTop: 16 }}>
              <ProDescriptions column={3}>
                <ProDescriptions.Item label="公司名称">
                  {props?.item?.company_name || '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="公司负责人">
                  {props?.item?.company_principal_name || '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="负责人手机">
                  {props?.item?.company_principal_phone || '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="营业执照号">
                  {props?.item?.company_business_license_num || '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="营业执照">
                  {props?.item?.company_business_license ? '已上传' : '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="资质证明">
                  {props?.item?.company_asset_certificate ? '已上传' : '-'}
                </ProDescriptions.Item>
                <ProDescriptions.Item label="装修授权书">
                  {props?.item?.company_power_attorney ? '已上传' : '-'}
                </ProDescriptions.Item>
              </ProDescriptions>
            </ProCard>
          </>
        )}

        {props?.item?.major_construction?.length > 0 && (
          <ProCard bordered title="重大施工项目" style={{ marginTop: 16 }}>
            {props.item.major_construction.map(
              (item: any, index: number, arr: any[]) => (
                <div
                  key={index}
                  style={{
                    marginBottom:
                      index < arr.length - 1 ? 16 : 0,
                  }}
                >
                  <div
                    style={{ fontWeight: 'bold', marginBottom: 8 }}
                  >
                    项目 {index + 1}：{item.name || '-'}
                  </div>
                  <ProDescriptions column={3}>
                    <ProDescriptions.Item label="施工图纸">
                      {item.draw ? '已上传' : '-'}
                    </ProDescriptions.Item>
                    <ProDescriptions.Item label="执业证件">
                      {item.certificate ? '已上传' : '-'}
                    </ProDescriptions.Item>
                  </ProDescriptions>
                  {index < arr.length - 1 && (
                    <div
                      style={{
                        borderBottom: '1px solid #f0f0f0',
                        margin: '16px 0',
                      }}
                    />
                  )}
                </div>
              ),
            )}
          </ProCard>
        )}

        <ProCard bordered title="其他附件" style={{ marginTop: 16 }}>
          <ProDescriptions column={3}>
            <ProDescriptions.Item label="施工图">
              {props?.item?.construction_draw ? '已上传' : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="施工承诺书">
              {props?.item?.construction_commitment_letter ? '已上传' : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="其他补充附件">
              {props?.item?.other_attachments ? '已上传' : '-'}
            </ProDescriptions.Item>
            <ProDescriptions.Item label="备注" span={3}>
              {props?.item?.renovation_remark || '-'}
            </ProDescriptions.Item>
          </ProDescriptions>
        </ProCard>
      </Spin>
    </div>
  );
}