cldV2react/src/pages/Hr/Employee/components/EmployeeDetail/Form.jsx

import React from 'react'
import { Col, Row } from 'antd'
import EditableForm from '@/components/EditableForm'
import ChangeSupervisor from '@/pages/Hr/Employee/components/ChangeSupervisor'

const EmployeeForm = props => {
  const { staff } = props
  const changeCopInputData = {
    staffName: staff.supervisorName,
    staffId: staff.id,
    clientId: staff.id
  }
  const columns = [
    {
      dataIndex: 'jobNumber',
      label: '工号',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'username',
      label: '姓名',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'departmentId',
      label: '办事处/部门',
      span: 24,
      editCellType: 'treeSelect'
    },
    {
      dataIndex: 'supervisorName',
      label: '部门上司',
      editCellType: 'custom',
      customCell: <ChangeSupervisor dataSource={changeCopInputData} />,
      span: 24
    },
    {
      dataIndex: 'majorName',
      label: '岗位',
      editable: false,
      span: 24
    },
    {
      dataIndex: 'hiredate',
      label: '入职时间',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'telephone',
      label: '手机',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'qq',
      label: 'QQ',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'wecat',
      label: '微信',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'phone',
      label: '电话',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'email',
      label: '邮箱',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'gender',
      label: '性别',
      editCellType: 'select',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'birthday',
      label: '出生日期',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'nation',
      label: '民族',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'marriage',
      label: '婚姻状况',
      editCellType: 'select',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'IDcards',
      label: '身份证',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'IDcardsValidity',
      label: '身份证有效期',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'IDcardsImgA',
      label: '身份证扫描件',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'nativePlace',
      label: '籍贯',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'householdRegistrationType',
      label: '户口类型',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'registeredResidence',
      label: '户口所在地',
      span: 24,
      editable: false,
      editCellType: 'textarea'
    },
    {
      dataIndex: 'living',
      label: '现居住地',
      span: 24,
      editable: false,
      editCellType: 'textarea'
    },
    {
      dataIndex: 'emergencyContacts',
      label: '紧急联系人',
      span: 24,
      editable: false,
      editCellType: 'textarea'
    },
    {
      dataIndex: 'graduateInstitutions',
      label: '毕业院校',
      editable: false,
      span: 24
    },
    {
      dataIndex: 'major',
      label: '所学专业',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'education',
      label: '毕业学历',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'graduationTime',
      label: '毕业时间',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'certificate',
      label: '毕业证书',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'diploma',
      label: '学位证书',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'professionalTitle',
      label: '职称',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'stay',
      label: '个人简历电子档',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'stayName',
      label: '原单位离职证明',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'remittanceName',
      label: '收款人户名',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'salaryBank',
      label: '收款银行',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'bankName',
      label: '收款开户银行名称',
      editable: false,
      span: 24
    },
    {
      dataIndex: 'bankNumber',
      label: '收款帐号',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'coupletNumber',
      label: '联行号',
      editable: false,
      span: 12
    },
    {
      dataIndex: 'salaryCard',
      label: '银行卡号',
      editable: false,
      span: 24
    },
    {
      dataIndex: 'salaryBankName',
      label: '开户行',
      span: 24,
      editable: false,
      editCellType: 'textarea'
    }
  ]
  return (
    <div>
      <Row>
        <Col span={8}>
          <h2 className="text-gray-500">员工详情</h2>
        </Col>
        <Col span={16} className="text-right text-gray-500">
          {staff.username}入职于{staff.hiredate}
        </Col>
        <Col span={22}>
          <h2 className="text-2xl pb-4">{staff.username}</h2>
        </Col>
        <Col span={2} />
      </Row>
      <EditableForm
        columns={columns}
        dataSource={staff}
        type="employee"
        tartgetUrl="/staff/change/department"
      />
    </div>
  )
}

export default EmployeeForm