import React from 'react';
import { Modal, Row, Col } from 'antd';
import styles from '../BasicInformation.less';

const BasicInfoViewForm = (props) => {
  const { viewModalVisible, handleViewModalVisible, values = {} } = props;

  return (
    <Modal
      width={500}
      bodyStyle={{ minHeight: '180px'}}
      className={styles.createForm}
      centered
      destroyOnClose
      title="详情"
      open={viewModalVisible}
      footer={null}
      onCancel={() => handleViewModalVisible(false)}
    >
      <Row gutter={0} style={{ marginTop: 30 }}>
        <Col span={12} style={{ marginBottom: 18 }}>
          <div className={styles['view-label']}>项目名称</div>
          <div className={styles['view-value']}>{values.projectName || '-'}</div>
        </Col>
        <Col span={12} style={{ marginBottom: 18 }}>
          <div className={styles['view-label']}>地理信息</div>
          <div className={styles['view-value']}>{values.location || '-'}</div>
        </Col>
        <Col span={12} style={{ marginBottom: 18 }}>
          <div className={styles['view-label']}>占地面积</div>
          <div className={styles['view-value']}>
            {values.area ? `${values.area}` : '-'}
          </div>
        </Col>
        <Col span={12} style={{ marginBottom: 18 }}>
          <div className={styles['view-label']}>职业人数</div>
          <div className={styles['view-value']}>{values.staffCount || '-'}</div>
        </Col>
        <Col span={12}>
          <div className={styles['view-label']}>组织机构</div>
          <div className={styles['view-value']}>{values.organization || '-'}</div>
        </Col>
        <Col span={12}>
          <div className={styles['view-label']}>安全等级</div>
          <div className={styles['view-value']}>{values.safetyLevel || '-'}</div>
        </Col>
      </Row>
    </Modal>
  );
};

export default BasicInfoViewForm;