refactor: 合同回款、文件同步收入合同组件的引入

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

@@ -1,7 +1,7 @@
 import Authorization from '@/components/Authorization'
 import DatePicker from '@/components/DatePicker'
 import MoneyInput from '@/components/MoneyInput'
-import { contractPaidStore, contractReturnStore, tenderStore } from '@/store/mobx'
+import { contractReturnStore, tenderStore } from '@/store/mobx'
 import { iModalCommonProps } from '@/types/contract'
 import { apiContractSection } from '@/utils/common/api'
 import { contractTreeBaseId } from '@/utils/common/constStatus'
@@ -10,7 +10,7 @@ import { dayjsFormat, handleAutoCode } from '@/utils/util'
 import { Button, Form, Input, Modal, Select, Tree, TreeSelect } from 'antd'
 import locale from 'antd/es/date-picker/locale/zh_CN'
 import dayjs from 'dayjs'
-import React, { ChangeEvent, useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react'
 import { apiGetReturnWay } from '../Tabs/Receivable/api'
 import styles from './index.module.scss'
 interface ContractSection {
@@ -110,9 +110,9 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
             setOptions(options)
           }
         })
-        form.setFieldsValue({ contractsId: contractType === 'income' ? contractReturnStore.contract.id : contractPaidStore.contract.id })
+        form.setFieldsValue({ contractsId: contractReturnStore.contract.id })
       } else {
-        form.setFieldsValue({ id: contractType === 'income' ? contractReturnStore.contract.id : contractPaidStore.contract.id })
+        form.setFieldsValue({ id: contractReturnStore.contract.id })
       }
     }
   }, [ visible ])
@@ -123,7 +123,7 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
 
   // 处理添加回款的金额不应该超出最大值
   const handleMaxPrice = () => {
-    const maxPrice = parseFloat(contractType === 'income' ? contractReturnStore.contract.price : contractPaidStore.contract.price) - parseFloat(contractType === 'income' ? contractReturnStore.contract.returned : contractPaidStore.contract.paid)
+    const maxPrice = parseFloat(contractReturnStore.contract.price) - parseFloat(contractReturnStore.contract.returned)
     return maxPrice
   }
 

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

@@ -1,8 +1,7 @@
 import Authorization from '@/components/Authorization'
 import { ZhSubmitButton } from '@/components/Button'
 import OssUploadModal from '@/components/OssUpload'
-import { contractPaidStore, contractReturnStore, tenderStore } from '@/store/mobx'
-import { ContractType } from '@/store/mobx/contractReturn'
+import {  contractReturnStore, tenderStore } from '@/store/mobx'
 import { ContractTree, iShowTemplateState, iTemplateState } from '@/types/contract'
 import { iFile } from '@/types/file'
 import { apiSaveFileInfo } from '@/utils/common/api'
@@ -91,8 +90,7 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
           template2: data.sectionTemplate2
         })
       } else {
-        type === 'income' && (contractReturnStore.updateTree(data.sectionTree.children))
-        type === 'expenditure' && (contractPaidStore.updateTree(data.sectionTree.children))
+        contractReturnStore.updateTree(data.sectionTree.children)
       }
     }
     // 初始化时如果id存在说明只是table更新了，那么要将store里面的合同数据也一起更新，防止合同详情不是最新的数据
@@ -234,26 +232,24 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
     const { code = -1, section = {}, contract: newContract = {} } = await apiGetContractWithDetail(id, bid, type)
     if (code === consts.RET_CODE.SUCCESS) {
       setRow(section)
-      type === 'income' && (contractReturnStore.updateContract(newContract))
-      type === 'expenditure' && (contractPaidStore.updateContract(newContract))
+      contractReturnStore.updateContract(newContract)
     }
   }
   const handleRowClass = (record: any) => {
     return record.id === row.id ? 'ant-table-row-selected editable-row' : ''
   }
   const tabOnClick = (key: string) => {
-    type === 'income' && (contractReturnStore.changeUpdate(key))
-    type === 'expenditure' && (contractPaidStore.changeUpdate(key))
+    contractReturnStore.changeUpdate(key)
   }
 
   // 阿里oss上传弹窗
   const onShow = (show: boolean) => setVisible(show)
+
   const onCreate = async (fileList: iFile[]) => {
-    const { code = -1 } = await apiSaveFileInfo(fileList, type === 'income' ? 0 : 1, row.contractId)
+    const { code = -1 } = await apiSaveFileInfo(fileList, type === 'income' ? consts.DATA_TYPE.CONTRACT_RETURN : consts.DATA_TYPE.CONTRACT_PAID, row.contractId)
     if (code === consts.RET_CODE.SUCCESS) {
       setVisible(false)
-      type === 'income' && (contractReturnStore.changeUpdate('3'))
-      type === 'expenditure' && (contractPaidStore.changeUpdate('3'))
+      contractReturnStore.changeUpdate('3')
     }
   }
 
@@ -351,10 +347,10 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
     <div className={styles.spreadContent}>
       <div className={styles.spreadSheets}>
         {
-          (type === ContractType.INCOME && contractReturnStore.showTable || type === ContractType.EXPENDITURE && contractPaidStore.showTable) ?
+          contractReturnStore.showTable ?
             <Table
               components={components}
-              dataSource={type === ContractType.INCOME ? contractReturnStore.tree : contractPaidStore.tree}
+              dataSource={contractReturnStore.tree}
               columns={_tableColumns as ColumnTypes}
               bordered
               pagination={false}
@@ -409,10 +405,10 @@ const GCsheet: React.FC<iTableContentPorps> = ({ changeModalType, row, setRow, h
             <Detail {...contractReturnStore.contract} />
           </TabPane>
           <TabPane key="2" tab="合同回款">
-            <Receivable updateTreeAndContract={initData}/>
+            <Receivable updateTreeAndContract={initData} type={type}/>
           </TabPane>
-          <TabPane key="3" tab="合同文件">
-            <File />
+          <TabPane key="3" tab="合同文件" >
+            <File type={type}/>
           </TabPane>
         </Tabs>
       </div>

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

@@ -15,7 +15,7 @@ interface iFileState {
   createTime: string
 }
 
-const File: React.FC<{}> = () => {
+const File: React.FC<{type: 'income' | 'expenditure'}> = ({ type }) => {
   const [ data, setData ] = useState<Array<iFileState>>([])
   const [ total, setTotal ] = useState<number>(0)
   const [ id, setId ] = useState<string>('')
@@ -32,7 +32,7 @@ const File: React.FC<{}> = () => {
   }, [ contractReturnStore.contract.id, contractReturnStore.shouldUpdate ])
 
   const initData = async (pageNo: number = 1, pageSize: number = 7) => {
-    const { code = -1, data = [], total = 0 } = await apiGetFileList(consts.DATA_TYPE.CONTRACT_RETURN, contractReturnStore.contract.id, pageNo, pageSize)
+    const { code = -1, data = [], total = 0 } = await apiGetFileList(type === 'income' ? consts.DATA_TYPE.CONTRACT_RETURN : consts.DATA_TYPE.CONTRACT_PAID, contractReturnStore.contract.id, pageNo, pageSize)
     if (code === consts.RET_CODE.SUCCESS) {
 
       setData(data)

src/pages/Contract/Content/Income/components/Tabs/Receivable/api.ts

@@ -1,23 +1,28 @@
 import request from '@/utils/common/request'
 
+enum ContractType {
+  income = 'return',
+  expenditure = 'paid'
+}
+
 /**
- * 删除回款
+ * 删除回款(收入/支出)
  * @param id 回款id
  * @param contractsId 合同id
  * @param bidsectionId 标段id
  */
-export async function apiDelReturn(id: string, contractsId: string, bidsectionId: string) {
-  const { data } = await request.del('/api/contract/return/delete', { id, contractsId, bidsectionId })
+export async function apiDelReturn(contractType: 'income' | 'expenditure', id: string, contractsId: string, bidsectionId: string) {
+  const { data } = await request.del(`/api/contract/${ContractType[contractType]}/delete`, { id, contractsId, bidsectionId })
   return data
 }
 
 /**
- * 获取合同回款列表
+ * 获取合同回款列表(收入/支出)
  * @param constractsId 合同id
  * @param bidsectionId 标段id
  */
-export async function apiGetReturns(contractsId: string, bidsectionId: string) {
-  const { data } = await request.get('/api/contract/return/list', { contractsId, bidsectionId, page: 1 })
+export async function apiGetReturns(contractType: 'income' | 'expenditure', contractsId: string, bidsectionId: string) {
+  const { data } = await request.get(`/api/contract/${ContractType[contractType]}/list`, { contractsId, bidsectionId, page: 1 })
   return data
 }
 
@@ -30,10 +35,10 @@ export async function apiGetReturnWay() {
 }
 
 /**
- * 更新回款内容
+ * 更新回款内容(收入/支出)
  * @param payload 载荷
  */
-export async function apiUpdateReturn(payload: object) {
-  const { data } = await request.post('/api/contract/return/update', payload)
+export async function apiUpdateReturn(contractType: 'income' | 'expenditure', payload: object) {
+  const { data } = await request.post(`/api/contract/${ContractType[contractType]}/update`, payload)
   return data
 }

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

@@ -45,8 +45,9 @@ const EditableCell: React.FC<iEditableCellProps> = ({
 
 interface ReceivableProps {
   updateTreeAndContract: () => Promise<void>
+  type : 'income' | 'expenditure'
 }
-const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract }) => {
+const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract, type }) => {
   const [ form ] = Form.useForm()
   const [ data, setData ] = useState<Array<iReceivableState>>([])
   const [ id, setId ] = useState<string>('')
@@ -58,7 +59,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract }) => {
   const [ editingKey, setEditingKey ] = useState<string>('')
 
   const delConfirm = async (id: string, contractsId: string, bidsectionId: string) => {
-    const { code = -1 } = await apiDelReturn(id, contractsId, bidsectionId)
+    const { code = -1 } = await apiDelReturn(type, id, contractsId, bidsectionId)
     if (code === consts.RET_CODE.SUCCESS) {
       const newData = data.filter(item => item.id !== id)
       setData(newData)
@@ -79,7 +80,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract }) => {
   }, [ contractReturnStore.contract.id, contractReturnStore.shouldUpdate ])
 
   const initData = async () => {
-    const { code = -1, data = [] } = await apiGetReturns(contractReturnStore.contract.id, contractReturnStore.contract.bidsectionId)
+    const { code = -1, data = [] } = await apiGetReturns(type, contractReturnStore.contract.id, contractReturnStore.contract.bidsectionId)
     if (code === consts.RET_CODE.SUCCESS) {
       setData(data)
     }
@@ -93,7 +94,7 @@ const Receivable: React.FC<ReceivableProps> = ({ updateTreeAndContract }) => {
       if (index > -1) {
         const item = newData[index]
         const payload = { ...row, time: dayjsFormat(row.time, 'YYYY-MM-DD'), createTime: dayjsFormat(row.createTime, 'YYYY-MM-DD'), id: item.id, bidsectionId: item.bidsectionId, contractsId: item.contractsId }
-        const { code = -1 } = await apiUpdateReturn(payload)
+        const { code = -1 } = await apiUpdateReturn(type, payload)
         if (code === consts.RET_CODE.SUCCESS) {
           newData.splice(index, 1, {
             ...item,

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

@@ -8,7 +8,7 @@ import { ContractTree, iModalProps } from '@/types/contract'
 import { contractTreeBaseId } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
 import { Button, message, Tooltip } from 'antd'
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { apiResfulContract, apiResfulContractTree } from './api'
 import ContractModal from './components/Modal'
 import TableContent from './components/TableContent'
@@ -25,6 +25,9 @@ interface iModal {
 const Income: React.FC<RouteComponentProps> = (props) => {
 
   const { history } = props
+  useEffect(() => {
+    contractReturnStore.resetContractStore()
+  }, [])
   const [ modalObj, setModalObj ] = useState<iModalProps>({
     type: '',
     visible: false,

src/pages/Contract/Content/Spending/index.tsx

@@ -4,12 +4,12 @@ import Slot from '@/components/Header/slot'
 import RuleModal from '@/components/RuleModal'
 import SvgIcon from '@/components/SvgIcon'
 import { apiSaveRule } from '@/pages/Safe/Content/List/api'
-import { contractPaidStore, tenderStore } from '@/store/mobx'
+import { contractReturnStore, tenderStore } from '@/store/mobx'
 import { ContractTree, iModalProps } from '@/types/contract'
 import { contractTreeBaseId } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
 import { Button, message, Tooltip } from 'antd'
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { apiResfulContract } from './api'
 import ContractModal from '@/pages/Contract/Content/Income/components/Modal'
 import TableContent from '../Income/components/TableContent'
@@ -23,11 +23,14 @@ interface iModal {
 }
 
 const Expenditure: React.FC<RouteComponentProps> = ({ history }) => {
+  useEffect(() => {
+    contractReturnStore.resetContractStore()
+  }, [])
   const [ modalObj, setModalObj ] = useState<iModalProps>({
     type: '',
     visible: false,
     confirmLoading: false,
-    contractType: 'spending'
+    contractType: 'expenditure'
   })
   const [ row, setRow ] = useState<ContractTree>({
     elderBrother: false,
@@ -65,10 +68,10 @@ const Expenditure: React.FC<RouteComponentProps> = ({ history }) => {
     })
     const { code = -1, contract = {} } = await apiResfulContract(type, values)
     if (code === consts.RET_CODE.SUCCESS) {
-      contractPaidStore.updateContract(contract)
-      contractPaidStore.resetTree(tenderStore.bid)
+      contractReturnStore.updateContract(contract)
+      contractReturnStore.resetTree(tenderStore.bid)
       if (type === 'paid') {
-        contractPaidStore.changeUpdate('2')
+        contractReturnStore.changeUpdate('2')
       }
     }
     setModalObj({
@@ -88,7 +91,7 @@ const Expenditure: React.FC<RouteComponentProps> = ({ history }) => {
   const treeResfulApiHandler = async (type: string, payload: any) => {
     const { code = -1, section = {} } = await apiResfulContractTree(type, payload, consts.CONTRACT_TREE.PAID)
     if (code === consts.RET_CODE.SUCCESS) {
-      contractPaidStore.resetTree(tenderStore.bid)
+      contractReturnStore.resetTree(tenderStore.bid)
       if (type !== 'add' && type !== 'del') {
         setRow({ ...row, ...section })
       }

src/store/mobx/contractReturn/index.ts

@@ -1,67 +1,41 @@
-import { apiContractTree } from "@/pages/Contract/Content/Income/components/Modal/api"
-import { iContractState, ContractTree } from "@/types/contract"
-import consts from "@/utils/consts"
-import { action, computed, observable } from "mobx"
-const initData = [ {
-  elderBrother: false,
-  isEnd: false,
-  attribsortution: 0,
-  attribution: '',
+import { apiContractTree } from '@/pages/Contract/Content/Income/components/Modal/api'
+import { iContractState, ContractTree } from '@/types/contract'
+import consts from '@/utils/consts'
+import { action, computed, observable } from 'mobx'
+const initData = {
   bidsectionId: '',
-  children: undefined,
   code: '',
-  contractCode: '',
-  contractId: '',
-  contractName: '',
-  contractPrice: '',
-  contractReturned: '',
-  contractStatus: 0,
-  contractsPaid: '',
+  content: '',
+  contractsType: 0,
   createTime: '',
-  depth: 0,
   id: '',
   name: '',
-  operation: '',
-  parentId: '',
+  paid: '0.00',
+  partyA: '',
+  partyASigner: '',
+  partyB: '',
+  partyBSigner: '',
+  price: '0.00',
   projectId: '',
-  serial: 0,
-  templateNumber: 0
-} ]
+  remarks: '',
+  returned: '0.00',
+  signerTime: '',
+  status: 0,
+  treeId: '',
+  updateTime: ''
+}
 
 export enum ContractType {
   INCOME = 'income',
   EXPENDITURE = 'expenditure'
 }
 class Contract {
-
   @observable tree: ContractTree[] = []
-  @observable contract: iContractState = {
-    bidsectionId: "",
-    code: "",
-    content: "",
-    contractsType: 0,
-    createTime: "",
-    id: "",
-    name: "",
-    paid: "0.00",
-    partyA: "",
-    partyASigner: "",
-    partyB: "",
-    partyBSigner: "",
-    price: "0.00",
-    projectId: "",
-    remarks: "",
-    returned: "0.00",
-    signerTime: "",
-    status: 0,
-    treeId: "",
-    updateTime: ""
-  }
+  @observable contract: iContractState = initData
   @observable shouldUpdate: string = ''
 
   @action changeUpdate(i: string) {
     this.shouldUpdate = i
-
   }
   @action updateTree(tree: ContractTree[]) {
     this.tree = tree
@@ -79,6 +53,11 @@ class Contract {
     this.contract = data
   }
 
+  @action resetContractStore() {
+    this.tree = []
+    this.contract = initData
+    this.shouldUpdate = ''
+  }
   // 增加行
   // @action addRowTree(id: string) {
   //   const newTree = lookupNode(id, this.tree)

src/types/contract.d.ts

@@ -59,7 +59,7 @@ export interface iModalProps {
   type: string
   visible: boolean
   confirmLoading: boolean
-  contractType: 'income' | 'spending'
+  contractType: 'income' | 'expenditure'
 }
 export interface iModalCommonProps {
   modalObj: iModalProps