feat: EditFormItem增加disable配置项

src/components/EditableForm/src/editableForm.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { Row } from 'antd'
 import EditableFormItem from './editableFormItem'
+import { isNullOrUnDef } from '@/utils/is'
 
 const EditableForm = ({ dataSource, columns, type, tartgetUrl }) => {
   // console.log(store)
@@ -8,17 +9,17 @@ const EditableForm = ({ dataSource, columns, type, tartgetUrl }) => {
     const newItem = { ...item }
 
     // 控制col span
-    if (!item.span) {
+    if (isNullOrUnDef(item.span)) {
       newItem.span = 24
     }
 
     // 默认编辑
-    if (!item.editable) {
+    if (isNullOrUnDef(item.editable)) {
       newItem.editable = true
     }
 
     // 默认组件
-    if (!item.editCellType) {
+    if (isNullOrUnDef(item.editCellType)) {
       newItem.editCellType = 'input'
     }
 
@@ -33,11 +34,10 @@ const EditableForm = ({ dataSource, columns, type, tartgetUrl }) => {
             key={column.dataIndex}
             label={column.label}
             dataSource={dataSource}
+            editable={column.editable}
+            disable={column.disable}
             dataIndex={column.dataIndex}
-            // record={dataSource[column.dataIndex]}
             span={column.span}
-            // dataId={dataSource.id}
-            editable={column.editable}
             editCellType={column.editCellType}
             customCell={column.customCell}
             requestUrl={tartgetUrl}

src/components/EditableForm/src/editableFormItem.jsx

@@ -3,12 +3,12 @@ import { editFormApi } from '@/services/common'
 import { Input, Row, Col } from 'antd'
 import React, { useState, useEffect, useRef } from 'react'
 import LazyCascader from '../../LazyCascader'
-import { connect } from 'dva'
-import './index.less'
+import { useDispatch } from 'umi'
 import useOptions from './useOptions'
 import ChangeSelect from './components/ChangeSelect'
 import ChangeTreeSelect from './components/ChangeTreeSelect'
 import ChangeDatePicker from './components/ChangeDatePicker'
+import './index.less'
 
 const extraValArr = ['cascader', 'select', 'treeSelect'] // 需要设置ExtraVal的类型
 const EditableFormItem = ({
@@ -17,11 +17,12 @@ const EditableFormItem = ({
   dataSource,
   dataIndex,
   span,
+  editable,
   editCellType,
   requestUrl,
-  customCell,
-  dispatch
+  customCell
 }) => {
+  const dispatch = useDispatch()
   const record = dataSource[dataIndex]
   const dataId = dataSource.id
   const options = useOptions(dataIndex)
@@ -105,6 +106,7 @@ const EditableFormItem = ({
   }, [dataId, record])
 
   const toggleEdit = () => {
+    if (!editable) return
     setEditing(!editing)
   }
 
@@ -198,7 +200,9 @@ const EditableFormItem = ({
     }
 
     cell = (
-      <div className="editable-cell-value-wrap" onClick={toggleEdit}>
+      <div
+        className={['editable-cell-value-wrap', !editable ? 'disable' : ''].join(' ')}
+        onClick={toggleEdit}>
         {content}
       </div>
     )
@@ -216,4 +220,4 @@ const EditableFormItem = ({
   )
 }
 
-export default connect()(EditableFormItem)
+export default EditableFormItem

src/components/EditableForm/src/index.less

@@ -4,8 +4,10 @@
   background: #f7f7f7;
   border: 1px solid #f7f7f7;
   cursor: pointer;
+  &.disable {
+    cursor: no-drop;
+  }
 }
-
 .editable-cell-value-wrap:hover {
   padding: 4px 12px;
   border: 1px solid #d9d9d9;

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

@@ -42,6 +42,7 @@ const EmployeeForm = props => {
     {
       dataIndex: 'hiredate',
       label: '入职时间',
+      editable: false,
       span: 12
     },
     {