feat: 合同回款行编辑添加select选择组件

src/components/OssUpload/index.tsx

@@ -52,11 +52,11 @@ const UploadModal: React.FC<iUploadModalProps> = (props) => {
   }
   // 初始化、获取签名
   const initOssData = async () => {
-    const { code = -1, data = {} } = await getSignature()
+    const { code = -1, data = {}, msg = '获取签名' } = await getSignature()
     if (code === consts.RET_CODE.SUCCESS) {
       setOssData({ ...OSSData, ...data })
     } else {
-      message.error("获取签名失败，请联系管理员")
+      message.error("获取签名失败")
 
     }
   }
@@ -84,10 +84,13 @@ const UploadModal: React.FC<iUploadModalProps> = (props) => {
     }
     const expire = parseInt(OSSData.expire) * 1000
     if (expire < Date.now()) {
-      initOssData()
-      file.status = 'error'
-      message.error('签名已过期，请联系管理员')
-      return reject()
+      try {
+        initOssData()
+      } catch (error) {
+        file.status = 'error'
+        message.error('签名已过期，请联系管理员')
+        return reject()
+      }
     }
 
     const reg = new RegExp(consts.UPLOAD_WHITE)

src/pages/Contract/Content/Income/components/Modal/index.tsx

@@ -1,20 +1,20 @@
 import Authorization from '@/components/Authorization'
 import DatePicker from '@/components/DatePicker'
 import MoneyInput from '@/components/MoneyInput'
-import { contractStore, tenderStore } from '@/store/mobx'
+import { commonStore, contractStore, tenderStore } from '@/store/mobx'
 import { ContractType } from '@/store/mobx/contract'
 import { iModalCommonProps } from '@/types/contract'
 import { apiContractSection } from '@/utils/common/api'
 import { contractTreeBaseId } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
-import { dayjsFormat, formatMoney, handleAutoCode } from '@/utils/util'
+import { dayjsFormat, handleAutoCode } from '@/utils/util'
 import { Button, Form, Input, Modal, Select, TreeSelect } from 'antd'
 import locale from 'antd/es/date-picker/locale/zh_CN'
 import dayjs from 'dayjs'
-import React, { useEffect, useState, useMemo } from 'react'
-import { apiGetReturnWay } from '../Tabs/Receivable/api'
+import React, { useEffect, useState } from 'react'
 import styles from './index.module.scss'
 import { BigNumber } from "bignumber.js"
+import { observer, Observer } from 'mobx-react'
 interface ContractSection {
   id: string;
   treeType: number;
@@ -49,7 +49,6 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
   const [ contractSection, setContractSection ] = useState<ContractSection[]>([])
   const [ form ] = Form.useForm()
 
-  const [ options, setOptions ] = useState<string[]>([])
   const modalObj = {
     create: {
       title: '新建合同',
@@ -92,6 +91,7 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
 
   useEffect(() => {
     if (visible) {
+
       form.setFieldsValue({ treeId: row.id, bidsectionId: tenderStore.bid })
 
       if (type === 'create') {
@@ -102,16 +102,7 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
         const { content = '', name = '', price = '', partyA = '', partyB = '', partyASigner = '', partyBSigner = '', signerTime = '', remarks = '' } = contractStore.contract
         form.setFieldsValue({ content, name, price, partyA, partyB, partyASigner, partyBSigner, signerTime: signerTime ? dayjs(signerTime) : '', remarks })
       } else if (type === 'add') {
-        apiGetReturnWay().then(({ code = -1, data = [] }) => {
-          if (code === consts.RET_CODE.SUCCESS) {
-            const options = data.map((item: string) => (
-              <Option key={item} value={item}>
-                {item}
-              </Option>
-            ))
-            setOptions(options)
-          }
-        })
+        commonStore.returnWayOptions && commonStore.queryWayOptions()
         form.setFieldsValue({ contractsId: contractStore.contract.id })
       } else {
         form.setFieldsValue({ id: contractStore.contract.id })
@@ -327,7 +318,14 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
               <MoneyInput  />
             </Form.Item>
             <Form.Item name="way" label={`${contractType === ContractType.INCOME ? '回款' : '支付'}方式`} rules={[ { required: true, message: `请选择${contractType === ContractType.INCOME ? '回款' : '支付'}方式` } ]}>
-              <Select>{options}</Select>
+              <Select>
+                {
+                  commonStore.returnWayOptions.map(item => (
+                  <Option key={item} value={item}>
+                    {item}
+                  </Option>))
+                }
+              </Select>
             </Form.Item>
             <Form.Item name="remarks" label="备注">
               <Input.TextArea maxLength={100} />
@@ -341,4 +339,4 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
   )
 }
 
-export default ContractModal
+export default observer(ContractModal)

src/pages/Contract/Content/Income/components/TableContent/index.tsx

@@ -161,7 +161,7 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
       align: 'right',
       width: '10%',
       // eslint-disable-next-line react/display-name
-      render: (text: any, record: any) => record.contractCode ? <span>{formatMoney(text)}</span> : null
+      render: (text: any) => <span>{formatMoney(text)}</span>
     },
     {
       title: type === ContractType.INCOME ? '回款金额' : '支付金额',
@@ -169,7 +169,7 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
       align: 'right',
       width: '10%',
       // eslint-disable-next-line react/display-name
-      render: (text: any, record: any) => record.contractCode ? <span>{formatMoney(text)}</span> : null
+      render: (text: any) => <span>{formatMoney(text)}</span>
     },
     {
       title: '状态',

src/pages/Contract/Content/Income/components/Tabs/Receivable/index.tsx

@@ -1,6 +1,6 @@
 import DatePicker from '@/components/DatePicker'
 import FileModal from '@/components/FileModal'
-import { contractStore } from '@/store/mobx'
+import { commonStore, contractStore } from '@/store/mobx'
 import { ContractType } from '@/store/mobx/contract'
 import { iReceivableState, iEditableCellProps } from '@/types/contract'
 import { iFileModal } from '@/types/file'
@@ -8,13 +8,13 @@ import { contractConsts } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
 import { dayjsFormat, formatMoney } from '@/utils/util'
 import { DisconnectOutlined } from '@ant-design/icons'
-import { Form, Input, Popconfirm, Table } from 'antd'
+import { Form, Input, Popconfirm, Table, Select } from 'antd'
 // import locale from 'antd/es/date-picker/locale/zh_CN'
 import dayjs from 'dayjs'
 import { observer } from 'mobx-react'
 import React, { useEffect, useState } from 'react'
 import { apiDelReturn, apiGetReturns, apiUpdateReturn } from './api'
-
+const { Option } = Select
 
 const EditableCell: React.FC<iEditableCellProps> = ({
   editing,
@@ -27,7 +27,20 @@ const EditableCell: React.FC<iEditableCellProps> = ({
   ...restProps
 }) => {
 
-  const cellNode = cellType === 'text' ? <Input size="small" allowClear autoComplete="off"/> : <DatePicker size="small" allowClear />
+  let cellNode: React.ReactNode
+  switch (cellType) {
+    case 'text':
+      cellNode = <Input size="small" allowClear autoComplete="off" />
+      break
+    case 'DatePicker':
+      cellNode = <DatePicker size="small" allowClear />
+      break
+    case 'Select':
+      cellNode = <Select size="small">{commonStore.returnWayOptions.map(item => (<Option key={item} value={item}>{item}</Option>))}</Select>
+      break
+    default:
+      break
+  }
 
   // const isDate = useMemo(() => {
   //   return dataIndex === 'createTime' || dataIndex === 'time'
@@ -37,7 +50,7 @@ const EditableCell: React.FC<iEditableCellProps> = ({
   return (
     <td {...restProps}>
       {editing ? (
-        <Form.Item name={dataIndex} style={{ margin: 0 }} rules={[ dataIndex === 'remarks' ? {} : { required: true, message: `请输入${title}!` } ]}>
+        <Form.Item name={dataIndex} style={{ margin: 0 }} rules={[ dataIndex === 'remarks' ? {} : { required: true, message: `请${cellType === 'text' ? '输入' : '选择'}${title}!` } ]}>
           {cellNode}
         </Form.Item>
       ) : (
@@ -49,7 +62,7 @@ const EditableCell: React.FC<iEditableCellProps> = ({
 
 interface ReceivableProps {
   updateTreeAndContract: () => Promise<void>
-  type : 'income' | 'expenditure'
+  type: 'income' | 'expenditure'
 }
 const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type }) => {
   const [ form ] = Form.useForm()
@@ -72,6 +85,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
   }
 
   useEffect(() => {
+    !commonStore.returnWayOptions.length && (commonStore.queryWayOptions())
     if (contractStore.contract.id) {
       if (contractStore.contract.id !== id) {
         setId(contractStore.contract.id)
@@ -133,7 +147,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
       render: (text: string) => <span>{dayjsFormat(text, 'YYYY-MM-DD')}</span>
     },
     {
-      title:  type === ContractType.INCOME ? '回款金额' : '支付金额',
+      title: type === ContractType.INCOME ? '回款金额' : '支付金额',
       dataIndex: 'price',
       editable: true,
       width: '12%',
@@ -141,7 +155,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
       render: (text: string) => <span className="pi-text-right pi-width-100P">{formatMoney(text)}</span>
     },
     {
-      title:  type === ContractType.INCOME ? '回款方式' : '支付方式',
+      title: type === ContractType.INCOME ? '回款方式' : '支付方式',
       dataIndex: 'way',
       editable: true,
       width: '12%'
@@ -170,7 +184,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
       title: '附件',
       dataIndex: 'fileCounts',
       // eslint-disable-next-line react/display-name
-      render: (text: number, record: iReceivableState) => <span className="pi-pointer" onClick={() => setFileModal({ ...fileModal, dataId: record.id, visible: true })}><DisconnectOutlined style={{ color: '#007bff' }}/> {text}</span>
+      render: (text: number, record: iReceivableState) => <span className="pi-pointer" onClick={() => setFileModal({ ...fileModal, dataId: record.id, visible: true })}><DisconnectOutlined style={{ color: '#007bff' }} /> {text}</span>
     },
     {
       title: '操作',
@@ -191,7 +205,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
               <span className="pi-link-red pi-mg-left-5">删除</span>
             </Popconfirm>
           </div>
-        : null
+          : null
       }
     }
   ]
@@ -219,7 +233,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type })
       ...col,
       onCell: (record: iReceivableState) => ({
         record,
-        cellType: col.dataIndex === 'createTime' || col.dataIndex === 'time' ? 'DatePicker' : 'text',
+        cellType: col.dataIndex === 'createTime' || col.dataIndex === 'time' ? 'DatePicker' : col.dataIndex === 'way' ? 'Select' : 'text',
         dataIndex: col.dataIndex,
         title: col.title,
         editing: isEditing(record)

src/pages/Quality/Content/Info/Detail/components/Modal/index.tsx

@@ -254,9 +254,6 @@ const AuditModal: React.FC<iAuditModalProps> = props => {
       <Form form={form} layout="vertical">
         {type === 'back' ? (
           <>
-            <Form.Item name="opinion" label="审批意见">
-              <Input.TextArea rows={5} />
-            </Form.Item>
             {curAuditor.progress !== '1' ? (
               <Popover
                 content={groups.map(item => (
@@ -275,10 +272,15 @@ const AuditModal: React.FC<iAuditModalProps> = props => {
             ) : null}
 
             {user.name ? (
-              <div className="pi-bordered pi-warning">
-                <span>已选择退回流程: </span>
-                <span>{user.name}</span>
-              </div>
+              <>
+                <div className="pi-bordered pi-warning">
+                  <span>已选择退回流程: </span>
+                  <span>{user.name}</span>
+                </div>
+                <Form.Item name="opinion" label="审批意见">
+                  <Input.TextArea rows={5} />
+                </Form.Item>
+              </>
             ) : null}
 
           </>

src/pages/Quality/Content/List/index.tsx

@@ -95,7 +95,7 @@ const QualityList: React.FC<{}> = () => {
       render: (text: string, record) => {
         return (
           <span className="pi-pointer" onClick={() => setState({ ...state, fileModal: { ...state.fileModal, dataId: record.id, visible: true } })}>
-            <SvgIcon type="xxh-paperclip1" style={{ color: '#007bff' }}/> {text}
+            <SvgIcon type="xxh-paperclip1" style={{ color: '#007bff' }} /> {text}
           </span>
         )
       }
@@ -128,7 +128,7 @@ const QualityList: React.FC<{}> = () => {
     if (code === consts.RET_CODE.SUCCESS) {
       initData()
       return message.success('添加新的巡检记录成功')
-    }else {
+    } else {
       setState({ ...state, addModal: { ...state.addModal, loading: false } })
     }
   }
@@ -137,17 +137,15 @@ const QualityList: React.FC<{}> = () => {
     <div className="wrap-contaniner">
       <Header title="质量巡检">
         <Slot position="right">
-          {!state.dataList.length ? (
-            <Button
-              type="ghost"
-              size="small"
-              icon={<SvgIcon type="xxh-cog" />}
-              className="pi-mg-right-3"
-              style={{ color: '#007bff' }}
-              onClick={() => setState({ ...state, ruleModal: { ...state.ruleModal, visible: true } })}>
-              设置
+          <Button
+            type="ghost"
+            size="small"
+            icon={<SvgIcon type="xxh-cog" />}
+            className="pi-mg-right-3"
+            style={{ color: '#007bff' }}
+            onClick={() => setState({ ...state, ruleModal: { ...state.ruleModal, visible: true } })}>
+            设置
             </Button>
-          ) : null}
 
           <Authorization type="quality" auth="add">
             <Button type="primary" size="small" onClick={() => setState({ ...state, addModal: { ...state.addModal, visible: true } })}>

src/pages/Safe/Content/List/index.tsx

@@ -71,7 +71,7 @@ const SafeList: React.FC<{}> = () => {
       render: (text: string, record) => {
         return (
           <span className="pi-pointer" onClick={() => setState({ ...state, fileModal: { ...state.fileModal, dataId: record.id, visible: true } })}>
-            <SvgIcon type="xxh-paperclip1" style={{ color: '#007bff' }}/> {text}
+            <SvgIcon type="xxh-paperclip1" style={{ color: '#007bff' }} /> {text}
           </span>
         )
       }
@@ -119,7 +119,7 @@ const SafeList: React.FC<{}> = () => {
     if (code === consts.RET_CODE.SUCCESS) {
       initData()
       return message.success('添加新的巡检记录成功')
-    }else {
+    } else {
       setState({ ...state, addModal: { ...state.addModal, loading: false } })
     }
   }
@@ -128,17 +128,15 @@ const SafeList: React.FC<{}> = () => {
     <div className="wrap-contaniner">
       <Header title="安全巡检">
         <Slot position="right">
-          {!state.dataList.length ? (
-            <Button
-              type="ghost"
-              size="small"
-              icon={<SvgIcon type="xxh-cog" />}
-              className="pi-mg-right-3"
-              style={{ color: '#007bff' }}
-              onClick={() => setState({ ...state, ruleModal: { ...state.ruleModal, visible: true } })}>
-              设置
+          <Button
+            type="ghost"
+            size="small"
+            icon={<SvgIcon type="xxh-cog" />}
+            className="pi-mg-right-3"
+            style={{ color: '#007bff' }}
+            onClick={() => setState({ ...state, ruleModal: { ...state.ruleModal, visible: true } })}>
+            设置
             </Button>
-          ) : null}
 
           <Authorization type="safe" auth="add">
             <Button type="primary" size="small" onClick={() => setState({ ...state, addModal: { ...state.addModal, visible: true } })}>

src/store/mobx/common/index.ts

@@ -0,0 +1,16 @@
+import { apiGetReturnWay } from '@/pages/Contract/Content/Income/components/Tabs/Receivable/api'
+import consts from '@/utils/consts'
+import { action, observable } from 'mobx'
+
+class Common {
+  @observable returnWayOptions: string[] = []
+
+  @action async queryWayOptions() {
+    const { code = -1, data = [] } = await apiGetReturnWay()
+      if (code === consts.RET_CODE.SUCCESS) {
+        this.returnWayOptions = data
+      }
+  }
+}
+
+export default new Common

src/store/mobx/index.ts

@@ -2,10 +2,12 @@ import contractStore from './contract'
 import frameStore from './frame'
 import tenderStore from './tender'
 import userStore from './user'
+import commonStore from './common'
 export {
   userStore,
   frameStore,
   tenderStore,
-  contractStore
+  contractStore,
+  commonStore
 }
 

src/types/contract.d.ts

@@ -114,7 +114,7 @@ export interface iEditableCellProps extends React.HTMLAttributes<HTMLElement> {
   editing: boolean
   dataIndex: string
   title: any
-  cellType: 'DatePicker' | 'text'
+  cellType: 'DatePicker' | 'text' | 'Select'
   record: iReceivableState
   index: number
   children: React.ReactNode