feat: 收入合同剩余接口接入

src/components/FileModal/index.tsx

@@ -2,7 +2,7 @@ import SvgIcon from '@/components/SvgIcon'
 import { apiSaveFileInfo } from '@/pages/Safe/Content/Info/Detail/api'
 import { iFile, iOSSData } from '@/types/file'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { InboxOutlined } from '@ant-design/icons'
 import { message, Modal, Table, Upload } from 'antd'
 import { ColumnsType } from 'antd/lib/table'
@@ -152,7 +152,7 @@ export default function FileModal(props: iFileModalProps) {
       title: "上传时间",
       dataIndex: "createTime",
       // eslint-disable-next-line react/display-name
-      render: text => <span>{dayjsFomrat(text, "YYYY-MM-DD")}</span>
+      render: text => <span>{dayjsFormat(text, "YYYY-MM-DD")}</span>
     },
     {
       title: "操作",

src/components/RuleModal/index.tsx

@@ -3,7 +3,7 @@ import { apiGetRule } from '@/pages/Safe/Content/List/api'
 import { tenderStore } from '@/store/mobx'
 import { ruleOption } from '@/types/rule'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { Form, Input, InputNumber, Modal, Select, Tabs, Tag } from 'antd'
 import { TweenOneGroup } from 'rc-tween-one'
 import React, { useEffect, useState } from 'react'
@@ -86,7 +86,7 @@ const SafeCreateForm: React.FC<iSafeCreateFormProps> = ({
         setRuleArr([ ...ruleArr, { type: 'text', value: form.getFieldValue('ruleText') } ])
         break
       case '2':
-        setRuleArr([ ...ruleArr, { type: 'date', value: dayjsFomrat(new Date(), 'YYYYMM') } ])
+        setRuleArr([ ...ruleArr, { type: 'date', value: dayjsFormat(new Date(), 'YYYYMM') } ])
         break
       default:
         setRuleArr([ ...ruleArr, { type: 'code', value: form.getFieldValue('initCode') } ])

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

@@ -3,7 +3,7 @@ import { apiAutoCode } from '@/pages/Safe/Content/List/api'
 import { contractStore, tenderStore } from '@/store/mobx'
 import { iModalCommonProps } from '@/types/contract'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { Button, Form, Input, Modal, Select } from 'antd'
 import locale from 'antd/es/date-picker/locale/zh_CN'
 import React, { useEffect, useState } from 'react'
@@ -103,13 +103,13 @@ const ContractModal: React.FC<iModalCommonProps> = ({ modalObj: { type, visible,
             form.validateFields().then(values => {
               form.resetFields()
               if (type === 'update') {
-                values.signerTime = dayjsFomrat(values.signerTime, 'YYYY-MM-DD HH:mm:ss')
+                values.signerTime = dayjsFormat(values.signerTime, 'YYYY-MM-DD HH:mm:ss')
               }
               if (type === 'del') {
                 delete values.warningText
               }
               if (type === 'return') {
-                values.time = dayjsFomrat(values.time, 'YYYY-MM-DD HH:mm:ss')
+                values.time = dayjsFormat(values.time, 'YYYY-MM-DD HH:mm:ss')
               }
               onConfirm(values, type)
             }).catch(info => {

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

@@ -1,6 +1,9 @@
 import { ZhSubmitButton } from '@/components/Button'
+import OssUploadModal from '@/components/OssUpload'
+import { apiSaveFileInfo } from '@/pages/Safe/Content/Info/Detail/api'
 import { contractStore, tenderStore } from '@/store/mobx'
 import { iIncomeTree } from '@/types/contract'
+import { iFile } from '@/types/file'
 import { contractConsts } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
 import { Button, Input, message, Radio, Table, Tabs } from 'antd'
@@ -67,6 +70,10 @@ const GCsheet: React.FC<iTableContentPorps> = ({ modalHandler, row, setRow }) =>
       serial: ''
     }
   })
+
+  // 阿里oss弹窗控制器
+  const [ visible, setVisible ] = useState<boolean>(false)
+
   const { TabPane } = Tabs
 
   useEffect(() => {
@@ -271,6 +278,17 @@ const GCsheet: React.FC<iTableContentPorps> = ({ modalHandler, row, setRow }) =>
   const tabOnClick = (key: string) => {
     contractStore.changeUpdate(key)
   }
+
+  // 阿里oss上传弹窗
+  const onShow = (show: boolean) => setVisible(show)
+  const onCreate = async (fileList: iFile[]) => {
+    const { code = -1 } = await apiSaveFileInfo(fileList, consts.DATA_TYPE.CONTRACT, row.contractId)
+    if (code === consts.RET_CODE.SUCCESS) {
+      setVisible(false)
+      contractStore.changeUpdate('3')
+    }
+  }
+
   return sectionTemplate.isShow ?
   <Modal
     visible={sectionTemplate.isShow}
@@ -362,7 +380,7 @@ const GCsheet: React.FC<iTableContentPorps> = ({ modalHandler, row, setRow }) =>
               <>
                 <Button type="primary" size="small" onClick={() => modalHandler('update')} className="pi-mg-right-5">编辑合同</Button>
                 <Button type="primary" size="small" onClick={() => modalHandler('return')} className="pi-mg-right-5">添加回款</Button>
-                <Button type="primary" size="small">上传文件</Button>
+                <Button type="primary" size="small" onClick={() => setVisible(true)}>上传文件</Button>
               </>
               : ''
             }
@@ -389,6 +407,12 @@ const GCsheet: React.FC<iTableContentPorps> = ({ modalHandler, row, setRow }) =>
         </TabPane>
       </Tabs>
     </div>
+    <OssUploadModal
+      visible={visible}
+      onCancel={() => setVisible(false)}
+      onCreate={onCreate}
+      onShow={onShow}
+    ></OssUploadModal>
   </div>
 }
 

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

@@ -1,6 +1,6 @@
 import { iContractState } from '@/types/contract'
 import { contractConsts } from '@/utils/common/constStatus'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import React from 'react'
 import styles from './index.module.scss'
 export default function Detail(props: iContractState) {
@@ -18,7 +18,7 @@ export default function Detail(props: iContractState) {
           </div></td></tr>
         <tr><th>甲方</th><td>{props.partyA}</td><th>甲方签约人</th><td>{props.partyASigner}</td></tr>
         <tr><th>乙方</th><td>{props.partyB}</td><th>乙方签约人</th><td>{props.partyBSigner}</td></tr>
-        <tr><th>签约日期</th><td colSpan={3}>{props.signerTime && dayjsFomrat(props.signerTime, 'YYYY-MM-DD')}</td></tr>
+        <tr><th>签约日期</th><td colSpan={3}>{props.signerTime && dayjsFormat(props.signerTime, 'YYYY-MM-DD')}</td></tr>
         <tr><th>备注</th><td colSpan={3}>{props.remarks}</td></tr>
         </tbody>
       </table>

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

@@ -1,35 +1,97 @@
+import { apiGetFileList } from '@/components/FileModal/api'
+import { contractStore } from '@/store/mobx'
+import { apiDelFile } from '@/utils/common/api'
+import consts from '@/utils/consts'
+import { dayjsFormat } from '@/utils/util'
 import Table, { ColumnsType } from 'antd/lib/table'
-import React from 'react'
+import { observer } from 'mobx-react'
+import React, { useEffect, useState } from 'react'
 
 interface iFileState {
   id: string
-  contractName: string
-  uploader: string
-  uploadTime: Date
+  filename: string
+  filepath: string
+  accountName: string
+  createTime: string
 }
 
-
 const File:React.FC<{}> = () => {
+  const [ data, setData ] = useState<Array<iFileState>>([])
+  const [ total, setTotal ] = useState<number>(0)
+  const [ id, setId ] = useState<string>('')
+  useEffect(() => {
+    if (contractStore.contract.id) {
+      if (contractStore.contract.id !== id) {
+        setId(contractStore.contract.id)
+        initData()
+      } else if (contractStore.shouldUpdate && contractStore.shouldUpdate === '3') {
+        initData()
+      }
+      contractStore.shouldUpdate && (contractStore.changeUpdate(''))
+    }
+  }, [ contractStore.contract.id, contractStore.shouldUpdate ])
+  const initData = async(pageNo: number = 1, pageSize: number = 10) => {
+    const { code = -1, data = [], total = 0 } = await apiGetFileList(consts.DATA_TYPE.CONTRACT, contractStore.contract.id, pageNo, pageSize)
+    if (code === consts.RET_CODE.SUCCESS) {
+      setData(data)
+      setTotal(total)
+    }
+  }
+  const deleteFile = async(id: string) => {
+    const { code = -1 }  = await apiDelFile(id)
+    if (code === consts.RET_CODE.SUCCESS) {
+      const newData = data.filter((file: iFileState) => file.id !== id)
+      setData(newData)
+    }
+  }
   const columns: ColumnsType<iFileState> = [
     {
       dataIndex: 'sort',
       // eslint-disable-next-line react/display-name
-      render: (_:any, record: iFileState, idx: number) => <span>{idx}</span>
+      render: (_:any, record: iFileState, idx: number) => <span>{idx+1}</span>
     },
     {
-      dataIndex: 'contractName'
-      // render: (_: any) => <a href="#" download></a>
+      title: '名称',
+      dataIndex: 'filename',
+      // eslint-disable-next-line react/display-name
+      render: (text: string, record: iFileState) => <a href={consts.OSS_PATH.REVIEW + record.filepath} target="_blank" rel="noopener noreferrer">{text}</a>
     },
     {
-      dataIndex: 'uploader'
+      title: '上传者',
+      dataIndex: 'accountName'
     },
     {
-      dataIndex: 'uploadTime'
+      title: '上传时间',
+      dataIndex: 'createTime',
+      // eslint-disable-next-line react/display-name
+      render: (time: string) => <span>{dayjsFormat(time, 'YYYY-MM-DD')}</span>
+    },
+    {
+      title: '操作',
+      dataIndex: 'opreate',
+      // eslint-disable-next-line react/display-name
+      render:(_: string, record: iFileState) =>
+      <div>
+        <a className="pi-mg-right-5" download href={consts.OSS_PATH.DOWNLOAD + record.filepath}>下载</a>
+        <span className="pi-link-red" onClick={() => deleteFile(record.id)}>删除</span>
+      </div>
     }
   ]
   return (
-    <Table columns={columns} bordered rowKey={record => record.id}></Table>
+    <Table
+      dataSource={data}
+      columns={columns}
+      bordered
+      rowKey={record => record.id}
+      pagination={{
+        hideOnSinglePage: true,
+        size: "small",
+        pageSize: consts.PAGE_SIZE,
+        onChange: (page, pageSize) => initData(page, pageSize),
+        total
+      }}
+      ></Table>
   )
 }
 
-export default File
+export default observer(File)

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

@@ -28,3 +28,12 @@ export async function apiGetReturnWay() {
   const { data } = await request.get('/api/contract/return/way')
   return data
 }
+
+/**
+ * 更新回款内容
+ * @param payload 载荷
+ */
+export async function apiUpdateReturn(payload: object) {
+  const { data } = await request.post('/api/contract/return/update', payload)
+  return data
+}

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

@@ -3,23 +3,30 @@ import FileModal from '@/components/FileModal'
 import { contractStore } from '@/store/mobx'
 import { iFileModal } from '@/types/file'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { DisconnectOutlined } from '@ant-design/icons'
 import { Form, Input, Popconfirm, Table } 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 { apiGetReturns } from './api'
+import React, { useEffect, useMemo, useState } from 'react'
+import { apiDelReturn, apiGetReturns, apiUpdateReturn } from './api'
 
 interface iReceivableState {
-  id: string
-  receDate: Date
-  receAmount: number
-  receWay: string
-  receDesigner: string
-  createTime: Date
-  remark: string
-  attacment: number
+  accountId: string;
+  annexes: number;
+  bidsectionId: string;
+  contractsId: string;
+  createTime: string;
+  createUser: string;
+  fileCounts: number;
+  id: string;
+  page: number;
+  price: string;
+  projectId: string;
+  remarks: string;
+  time: string;
+  way: string;
 }
 interface EditableCellProps extends React.HTMLAttributes<HTMLElement> {
   editing: boolean;
@@ -43,12 +50,15 @@ const EditableCell: React.FC<EditableCellProps> = ({
 }) => {
   // console.log(dataIndex, record)
 
-  const cellNode = cellType === 'text' ? <Input value={dataIndex && record[dataIndex]} size="small" allowClear/> : <DatePicker  value={dataIndex && record[dataIndex]} size="small" allowClear locale={locale} />
+  const cellNode = cellType === 'text' ? <Input size="small" allowClear/> : <DatePicker size="small" allowClear locale={locale} />
 
+  const isDate = useMemo(() => {
+    return dataIndex === 'createTime' || dataIndex === 'time'
+  }, [ dataIndex ])
   return (
     <td {...restProps}>
       {editing ? (
-        <Form.Item name={dataIndex} style={{ margin: 0 }} rules={[ { required: true, message: `请输入${title}!` } ]}>
+        <Form.Item name={dataIndex} initialValue={isDate ? dayjs(record[dataIndex]) : record[dataIndex]} style={{ margin: 0 }} rules={[ dataIndex === 'remarks' ? {} : { required: true, message: `请输入${title}!` } ]}>
           {cellNode}
         </Form.Item>
       ) : (
@@ -70,8 +80,12 @@ const Receivable:React.FC<{}> = () => {
   })
   const [ editingKey, setEditingKey ] = useState<string>('')
 
-  const delConfirm = (key: string) => {
-    console.log(key)
+  const delConfirm = async (id: string, contractsId: string, bidsectionId: string) => {
+    const { code = -1 } = await apiDelReturn(id, contractsId, bidsectionId)
+    if (code === consts.RET_CODE.SUCCESS) {
+      const newData = data.filter(item => item.id !== id)
+      setData(newData)
+    }
   }
 
   useEffect(() => {
@@ -81,9 +95,8 @@ const Receivable:React.FC<{}> = () => {
         initData()
       } else if (contractStore.shouldUpdate && contractStore.shouldUpdate === '2') {
         initData()
-        contractStore.shouldUpdate && contractStore.changeUpdate('')
       }
-
+      contractStore.shouldUpdate && (contractStore.changeUpdate(''))
     }
   }, [ contractStore.contract.id, contractStore.shouldUpdate ])
   const initData = async() => {
@@ -100,17 +113,24 @@ const Receivable:React.FC<{}> = () => {
       const index = newData.findIndex(item => key === item.id)
       if (index > -1) {
         const item = newData[index]
-        newData.splice(index, 1, {
-          ...item,
-          ...row
-        })
-        setData(newData)
-        setEditingKey('')
-      } else {
-        newData.push(row)
-        setData(newData)
-        setEditingKey('')
+        console.log(row)
+        console.log(item)
+        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)
+        if (code === consts.RET_CODE.SUCCESS) {
+          newData.splice(index, 1, {
+            ...item,
+            ...row
+          })
+          setData(newData)
+        }
       }
+      setEditingKey('')
+      // else {
+      //   newData.push(row)
+      //   setData(newData)
+      //   setEditingKey('')
+      // }
     } catch (errInfo) {
       console.log('Validate Failed:', errInfo)
     }
@@ -132,7 +152,7 @@ const Receivable:React.FC<{}> = () => {
       editable: true,
       width: '12%',
       // eslint-disable-next-line react/display-name
-      render: (text: string) => <span>{dayjsFomrat(text, 'YYYY-MM-DD')}</span>
+      render: (text: string) => <span>{dayjsFormat(text, 'YYYY-MM-DD')}</span>
     },
     {
       title: '回款金额',
@@ -160,7 +180,7 @@ const Receivable:React.FC<{}> = () => {
       editable: true,
       width: '12%',
       // eslint-disable-next-line react/display-name
-      render: (text: any) => <span>{dayjsFomrat(text, 'YYYY-MM-DD')}</span>
+      render: (text: any) => <span>{dayjsFormat(text, 'YYYY-MM-DD')}</span>
     },
     {
       title: '备注',
@@ -189,7 +209,7 @@ const Receivable:React.FC<{}> = () => {
             :
             <span className="pi-link-blue" onClick={() => setEditingKey(record.id)}>编辑</span>
           }
-          <Popconfirm title="确认删除?" cancelText="取消" okText="确认" onConfirm={() => delConfirm(record.id)}>
+          <Popconfirm title="确认删除?" cancelText="取消" okText="确认" onConfirm={() => delConfirm(record.id, record.contractsId, record.bidsectionId)}>
             <span className="pi-link-red pi-mg-left-5">删除</span>
           </Popconfirm>
         </div>
@@ -211,7 +231,7 @@ const Receivable:React.FC<{}> = () => {
       ...col,
       onCell: (record: iReceivableState) => ({
         record,
-        cellType: col.dataIndex === 'createTime' || col.dataIndex === 'receDate' ? 'DatePicker' : 'text',
+        cellType: col.dataIndex === 'createTime' || col.dataIndex === 'time' ? 'DatePicker' : 'text',
         dataIndex: col.dataIndex,
         title: col.title,
         editing: isEditing(record)

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

@@ -9,7 +9,7 @@ import { contractTreeBaseId } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
 import { SettingOutlined } from '@ant-design/icons'
 import { Button, message, Tooltip } from 'antd'
-import React, { useState } from 'react'
+import React, { useMemo, useState } from 'react'
 import { apiResfulContract, apiResfulContractTree } from './api'
 import ContractModal from './components/Modal'
 import TableContent from './components/TableContent'
@@ -61,9 +61,10 @@ export default function Income() {
     })
     const { code = -1 } = await apiResfulContract(type, values)
     if (code === consts.RET_CODE.SUCCESS) {
+      // contractStore.updateContract(section)
       contractStore.resetTree(tenderStore.bid)
       if (type === 'return') {
-        contractStore.changeUpdate('return')
+        contractStore.changeUpdate('2')
       }
     }
     setModalObj({
@@ -109,6 +110,10 @@ export default function Income() {
       setModalObj({ ...modalObj, visible: true, type })
     }, 300)
   }
+  const showCBtn = useMemo(() => {
+    return !row.children && !row.contractCode && row.id
+  }, [ row ])
+
   return (
     <div className="wrap-contaniner">
       <Header title="维护项目节：">
@@ -167,7 +172,7 @@ export default function Income() {
         <Slot position="right">
           <Button type="ghost" size="small" icon={<SettingOutlined />} className="pi-mg-right-3" style={{ color: '#007bff' }} onClick={() => setRuleModal({ ...ruleModal, visible: true })}>设置</Button>
           {
-            !row.children && !row.contractCode ? <Button type="primary" size="small" onClick={() => setModalObj({ ...modalObj, type: 'create', visible: true })}>新建收入合同</Button>
+            showCBtn ? <Button type="primary" size="small" onClick={() => setModalObj({ ...modalObj, type: 'create', visible: true })}>新建收入合同</Button>
             : ""
           }
         </Slot>

src/pages/Management/Info/index.tsx

@@ -1,7 +1,7 @@
 import Header from '@/components/Header'
 import Slot from '@/components/Header/slot'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { Button, Form, Input, message } from 'antd'
 import React, { useEffect, useState } from 'react'
 import { apiProjectInfo, apiSaveProjectInfo } from './api'
@@ -29,7 +29,7 @@ const [ loading, setLoading ] = useState<boolean>(false)
   useEffect(() => {
     form.setFieldsValue(
       { ...projectInfo,
-        createTime: dayjsFomrat(projectInfo.createTime, "YYYY-MM-DD"),
+        createTime: dayjsFormat(projectInfo.createTime, "YYYY-MM-DD"),
         mobile: projectInfo.mobile.replace(/(\d{3})(\d{4})(\d{4})/, "$1****$3") +  `  (${projectInfo.name})`
       })
   }, [ projectInfo ])

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

@@ -8,7 +8,7 @@ import SvgIcon from '@/components/SvgIcon'
 import { userStore } from '@/store/mobx'
 import { iFile } from '@/types/file'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { Button, Input, Pagination, Tooltip } from 'antd'
 import locale from 'antd/es/date-picker/locale/zh_CN'
 import dayjs from 'dayjs'
@@ -130,7 +130,7 @@ const Detail:React.FC<RouteComponentProps> = (props) => {
                       <td style={{ width: 383, maxWidth: 383, overflow: 'hidden', whiteSpace: 'nowrap',textOverflow:'ellipsis' }}>
                         <a href={consts.OSS_PATH.REVIEW + file.filepath} target="_blank" rel="noopener noreferrer">{file.filename}</a>
                       </td>
-                      <td className="pi-text-center">{file.accountName}</td><td className="pi-text-center">{dayjsFomrat(file.createTime)}</td>
+                      <td className="pi-text-center">{file.accountName}</td><td className="pi-text-center">{dayjsFormat(file.createTime)}</td>
                       <td className="pi-text-center pi-width-90">
                         <Tooltip title="移除">
                           <Button size="small" type="text" icon={<SvgIcon type="xxh-times-circle1"/>} style={{ color: "#df3f45" }}></Button>

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

@@ -7,7 +7,7 @@ import { tenderStore } from '@/store/mobx'
 import { iCreateSafe } from '@/types/safe'
 import { safeStatus } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { SettingOutlined } from '@ant-design/icons'
 import { Button, message, Table } from 'antd'
 import { ColumnsType } from 'antd/lib/table'
@@ -87,7 +87,7 @@ const SafeList:React.FC<{}> =() => {
       dataIndex: 'create_time',
       // eslint-disable-next-line react/display-name
       render: (text: string) => {
-        return <span>{dayjsFomrat(text, 'YYYY-MM-DD')}</span>
+        return <span>{dayjsFormat(text, 'YYYY-MM-DD')}</span>
       }
     },
     {
@@ -148,7 +148,7 @@ const SafeList:React.FC<{}> =() => {
   }
   const onAddCreate = async (payload: iCreateSafe) => {
     setAddModal({ ...addModal, loading: true })
-    const createTime = dayjsFomrat(payload.createTime)
+    const createTime = dayjsFormat(payload.createTime)
     const { code = -1 } = await apiCreateSafe({ ...payload, createTime })
     if (code === consts.RET_CODE.SUCCESS) {
       initData()

src/pages/Safe/Content/Info/Detail/index.tsx

@@ -7,8 +7,9 @@ import OssUploadModal from '@/components/OssUpload'
 import SvgIcon from '@/components/SvgIcon'
 import { userStore } from '@/store/mobx'
 import { iFile } from '@/types/file'
+import { apiDelFile } from '@/utils/common/api'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { Button, Input, Pagination, Tooltip } from 'antd'
 import locale from 'antd/es/date-picker/locale/zh_CN'
 import dayjs from 'dayjs'
@@ -79,6 +80,14 @@ const Detail:React.FC<RouteComponentProps> = (props) => {
       setDetail({ ...detail, file: { ...detail.file, fileList: data } })
     }
   }
+
+  const delFile = async(id: string) => {
+    const { code = -1 } = await apiDelFile(id)
+    if (code === consts.RET_CODE.SUCCESS) {
+      const newFiles = detail.file.fileList.map(file => file.id !== id)
+      setDetail({ ...detail, file: { ...detail.file, fileList: newFiles } })
+    }
+  }
   return (
     <div className="wrap-contaniner">
       <Header title="安全巡检">
@@ -130,10 +139,10 @@ const Detail:React.FC<RouteComponentProps> = (props) => {
                       <td style={{ width: 383, maxWidth: 383, overflow: 'hidden', whiteSpace: 'nowrap',textOverflow:'ellipsis' }}>
                         <a href={consts.OSS_PATH.REVIEW + file.filepath} target="_blank" rel="noopener noreferrer">{file.filename}</a>
                       </td>
-                      <td className="pi-text-center">{file.accountName}</td><td className="pi-text-center">{dayjsFomrat(file.createTime)}</td>
+                      <td className="pi-text-center">{file.accountName}</td><td className="pi-text-center">{dayjsFormat(file.createTime)}</td>
                       <td className="pi-text-center pi-width-90">
                         <Tooltip title="移除">
-                          <Button size="small" type="text" icon={<SvgIcon type="xxh-times-circle1"/>} style={{ color: "#df3f45" }}></Button>
+                          <Button size="small" type="text" icon={<SvgIcon type="xxh-times-circle1"/>} style={{ color: "#df3f45" }} onClick={() => delFile(file.id)}></Button>
                         </Tooltip>
                       </td>
                     </tr>

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

@@ -8,7 +8,7 @@ import { iFileModal } from '@/types/file'
 import { iCreateSafe } from '@/types/safe'
 import { safeStatus } from '@/utils/common/constStatus'
 import consts from '@/utils/consts'
-import { dayjsFomrat } from '@/utils/util'
+import { dayjsFormat } from '@/utils/util'
 import { SettingOutlined } from '@ant-design/icons'
 import { Button, message, Table } from 'antd'
 import { ColumnsType } from 'antd/lib/table'
@@ -84,7 +84,7 @@ const SafeList:React.FC<{}> =() => {
       dataIndex: 'create_time',
       // eslint-disable-next-line react/display-name
       render: (text: string) => {
-        return <span>{dayjsFomrat(text, 'YYYY-MM-DD')}</span>
+        return <span>{dayjsFormat(text, 'YYYY-MM-DD')}</span>
       }
     },
     {
@@ -145,7 +145,7 @@ const SafeList:React.FC<{}> =() => {
   }
   const onAddCreate = async (payload: iCreateSafe) => {
     setAddModal({ ...addModal, loading: true })
-    const createTime = dayjsFomrat(payload.createTime)
+    const createTime = dayjsFormat(payload.createTime)
     const { code = -1 } = await apiCreateSafe({ ...payload, createTime })
     if (code === consts.RET_CODE.SUCCESS) {
       initData()

src/store/mobx/contract/index.ts

@@ -56,6 +56,7 @@ class Contract {
 
   @action changeUpdate(i: string) {
     this.shouldUpdate = i
+
   }
   @action updateTree(tree: iIncomeTree[]) {
     this.tree = tree

src/utils/common/api.ts

@@ -0,0 +1,10 @@
+import request from "./request"
+
+/**
+ * 删除附件
+ * @param id 附件id
+ */
+export async function apiDelFile(id:string) {
+  const { data } = await request.del('/api/file', { id })
+  return data
+}

src/utils/consts.ts

@@ -11,7 +11,7 @@ export default {
   RET_CODE: { SUCCESS: 0, FAIL: 1, TOKEN_UNDEFINED: 19, TOKEN_EXPIRED: 1 }, // 接口返回状态码
   RETRY: { COUNT: 3, DELAY: 1000 }, // 请求重试次数/间隙
   RULE: { SAFE: 'safeRule', QUALITY: 'qualityRule', CONTRACT: 'contractRule' }, // 编号规则弹窗常量
-  UPLOAD_WHITE: "'.json', '.txt','.xls', '.xlsx','.doc', '.docx','.pdf','.ppt', '.pptx','.png', '.jpg', '.jpeg', '.gif', '.bmp', '.cad', '.dwg','.zip', '.rar', '.7z'", // 上传类型-白名单
+  UPLOAD_WHITE: [ '.json', '.txt','.xls', '.xlsx','.doc', '.docx','.pdf','.ppt', '.pptx','.png', '.jpg', '.jpeg', '.gif', '.bmp', '.cad', '.dwg','.zip', '.rar', '.7z' ], // 上传类型-白名单
   UPLOAD_LIMIT: 30, // 上传限制30MB
   DATA_TYPE: { RETURN: 1, QUALITY: 2, SAFE: 3, CONTRACT: 4 }, // 附件类型
   PAGE_SIZE: 10, // 默认页数

src/utils/util.ts

@@ -83,7 +83,7 @@ const combinationPath = (parentPath: string|undefined, pathOfTargetConfig: strin
  * 日期格式化
  * @param format - 格式
  */
-const dayjsFomrat = (date: dayjs.ConfigType, format: string = 'YYYY-MM-DD HH:mm:ss') => {
+const dayjsFormat = (date: dayjs.ConfigType, format: string = 'YYYY-MM-DD HH:mm:ss') => {
   return dayjs(date).format(format)
 }
 
@@ -107,7 +107,7 @@ export {
   throttle,
   debounce,
   combinationPath,
-  dayjsFomrat,
+  dayjsFormat,
   generatePsw
 }