|
|
@@ -0,0 +1,314 @@
|
|
|
+import { useCallback, useEffect, useMemo, useState } from 'react'
|
|
|
+import styles from './index.module.scss'
|
|
|
+import { selectObj } from '@/utils/dataChange'
|
|
|
+import { useParams } from 'react-router-dom'
|
|
|
+import dayjs from 'dayjs'
|
|
|
+import { Button, Cascader, DatePicker, Input } from 'antd'
|
|
|
+import classNames from 'classnames'
|
|
|
+import TextArea from 'antd/es/input/TextArea'
|
|
|
+import { useInfo } from '../InfoContext'
|
|
|
+import Z3upFiles from '@/components/Z3upFiles'
|
|
|
+import { API_objType } from '@/store/action/Dmanage/D1register'
|
|
|
+import { editPageToTopFu } from '@/utils/authority'
|
|
|
+import { FileUpInfoType } from '../data'
|
|
|
+import SelectGoods from '@/pages/Zother/SelectGoods'
|
|
|
+import { GoodsType } from '../SonGoodsList/data'
|
|
|
+
|
|
|
+export const pageKeyTxtObj = {
|
|
|
+ 1: '新增',
|
|
|
+ 2: '编辑',
|
|
|
+ 3: '审批',
|
|
|
+ 4: '查看'
|
|
|
+}
|
|
|
+
|
|
|
+export const auditBtnArr = [
|
|
|
+ { value: 1, label: '同意' },
|
|
|
+ { value: 2, label: '不同意' }
|
|
|
+]
|
|
|
+
|
|
|
+type Props = {
|
|
|
+ // 顶部信息录入
|
|
|
+ rowArr: any[]
|
|
|
+ // 页面字段
|
|
|
+ pageTxt: string
|
|
|
+ // api
|
|
|
+ APIobj: API_objType
|
|
|
+ // 上传附件的信息
|
|
|
+ fileUpInfo: FileUpInfoType
|
|
|
+}
|
|
|
+
|
|
|
+function EditTopDom({ rowArr, pageTxt, APIobj, fileUpInfo }: Props) {
|
|
|
+ const { info, setInfoFu, snaps, setSnapsFu, timeKey, auditInfo, setAuditInfoFu } = useInfo()
|
|
|
+
|
|
|
+ const { key, id } = useParams<any>()
|
|
|
+ // key:1 新增 2编辑 3审批 4查看
|
|
|
+
|
|
|
+ const isLook = useMemo(() => {
|
|
|
+ return ['3', '4'].includes(key)
|
|
|
+ }, [key])
|
|
|
+
|
|
|
+ // 控制选择藏品弹窗显示
|
|
|
+ const [showChildTable, setShowChildTable] = useState(false)
|
|
|
+
|
|
|
+ // 创建订单
|
|
|
+ const createFu = useCallback(async () => {
|
|
|
+ const res = await APIobj['创建订单']()
|
|
|
+ if (res.code === 0) {
|
|
|
+ setInfoFu(res.data)
|
|
|
+ }
|
|
|
+ }, [APIobj, setInfoFu])
|
|
|
+
|
|
|
+ // 获取详情
|
|
|
+ const getInfoFu = useCallback(
|
|
|
+ async (id: number) => {
|
|
|
+ const res = await APIobj['获取详情'](id)
|
|
|
+ if (res.code === 0) {
|
|
|
+ // 回到顶部
|
|
|
+ editPageToTopFu()
|
|
|
+
|
|
|
+ const data = res.data
|
|
|
+ setInfoFu(data)
|
|
|
+
|
|
|
+ // 设置有关藏品的信息
|
|
|
+ // 藏品清单快照信息id对比
|
|
|
+ const arrTemp: any = []
|
|
|
+ const snapsTemp = data.snaps || []
|
|
|
+ snapsTemp.forEach((v: any, i: number) => {
|
|
|
+ const obj = JSON.parse(v.snap || '{}')
|
|
|
+
|
|
|
+ const flag = v.pageType === 'clue' && !v.clueId
|
|
|
+ if (obj.id === null || obj.isNew || flag) obj.id = Date.now() + i
|
|
|
+
|
|
|
+ obj.idTemp = obj.id
|
|
|
+
|
|
|
+ arrTemp.push(obj)
|
|
|
+ })
|
|
|
+ // console.log('-------', arrTemp)
|
|
|
+
|
|
|
+ setSnapsFu(arrTemp)
|
|
|
+ }
|
|
|
+ },
|
|
|
+ [APIobj, setInfoFu, setSnapsFu]
|
|
|
+ )
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if (key === '1') createFu()
|
|
|
+ else getInfoFu(id)
|
|
|
+ }, [createFu, getInfoFu, id, key, timeKey])
|
|
|
+
|
|
|
+ // 页面最上部文字
|
|
|
+ const pageKeyTxt = useMemo(() => {
|
|
|
+ return Reflect.get(pageKeyTxtObj, key)
|
|
|
+ }, [key])
|
|
|
+
|
|
|
+ // 数据改变
|
|
|
+ const dataChangeFu = useCallback(
|
|
|
+ (val: any, item: any) => {
|
|
|
+ const type = item.type
|
|
|
+ const key = item.key
|
|
|
+
|
|
|
+ if (type === 'DatePicker') {
|
|
|
+ setInfoFu({ ...info, [key]: dayjs(val).format('YYYY-MM-DD') })
|
|
|
+ } else if (['TextArea', 'Input'].includes(type)) {
|
|
|
+ const varRes = item.noNull ? val.replace(/\s+/g, '') : val
|
|
|
+ setInfoFu({
|
|
|
+ ...info,
|
|
|
+ [key]: varRes
|
|
|
+ })
|
|
|
+ } else if (type === 'Cascader') {
|
|
|
+ setInfoFu({ ...info, dictIdApply: val ? val.join(',') : '' })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ [info, setInfoFu]
|
|
|
+ )
|
|
|
+
|
|
|
+ // 订单申请状态
|
|
|
+ const statusTxt = useMemo(() => {
|
|
|
+ let txt = ''
|
|
|
+ const obj = selectObj['订单审批状态'].find(v => v.value === info.status)
|
|
|
+
|
|
|
+ // 新增的时候看不到状态
|
|
|
+ if (key !== '1' && obj) txt = obj.label
|
|
|
+ return txt
|
|
|
+ }, [info.status, key])
|
|
|
+
|
|
|
+ return (
|
|
|
+ <div className={styles.EditTop}>
|
|
|
+ <div className='pageTitle'>
|
|
|
+ {pageTxt}-{pageKeyTxt}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {info.id ? (
|
|
|
+ <>
|
|
|
+ {key === '3' ? (
|
|
|
+ <>
|
|
|
+ <div className='EdTit'>
|
|
|
+ <div>审批信息</div>
|
|
|
+ </div>
|
|
|
+ <div className='Edtop1'>
|
|
|
+ <div className='Edtop1row Edtop1rowFull'>
|
|
|
+ <div className='Edtop1ll'>
|
|
|
+ <span>* </span>审批结果：
|
|
|
+ </div>
|
|
|
+ <div className='Edtop1rr'>
|
|
|
+ {auditBtnArr.map(btn => (
|
|
|
+ <Button
|
|
|
+ key={btn.value}
|
|
|
+ type={btn.value === auditInfo.status ? 'primary' : 'default'}
|
|
|
+ onClick={() => setAuditInfoFu('status', btn.value)}
|
|
|
+ >
|
|
|
+ {btn.label}
|
|
|
+ </Button>
|
|
|
+ ))}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className='Edtop1row Edtop1rowFull'>
|
|
|
+ <div className='Edtop1ll'>审批意见：</div>
|
|
|
+ <div className='Edtop1rr'>
|
|
|
+ <TextArea
|
|
|
+ placeholder='请输入'
|
|
|
+ value={auditInfo.rtfOpinion}
|
|
|
+ onChange={e => setAuditInfoFu('rtfOpinion', e.target.value)}
|
|
|
+ maxLength={500}
|
|
|
+ showCount
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </>
|
|
|
+ ) : null}
|
|
|
+
|
|
|
+ <div className='EdTit'>
|
|
|
+ <div>
|
|
|
+ 申请信息
|
|
|
+ {statusTxt ? (
|
|
|
+ <Button className='EdTitBtn' type='dashed'>
|
|
|
+ {statusTxt}
|
|
|
+ </Button>
|
|
|
+ ) : null}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className='Edtop1'>
|
|
|
+ {rowArr.map((item, index) => (
|
|
|
+ <div
|
|
|
+ key={index}
|
|
|
+ className={classNames('Edtop1row', item.full ? 'Edtop1rowFull' : '')}
|
|
|
+ >
|
|
|
+ <div className='Edtop1ll'>
|
|
|
+ {item.must ? <span>* </span> : null}
|
|
|
+ {item.name}：
|
|
|
+ </div>
|
|
|
+ <div className='Edtop1rr'>
|
|
|
+ {item.type === 'txt' ? (
|
|
|
+ <>
|
|
|
+ {dayjs(info.createTime).format('YYYY年MM月DD日')}-{info.deptName}-
|
|
|
+ {info.creatorName}
|
|
|
+ </>
|
|
|
+ ) : item.type === 'DatePicker' ? (
|
|
|
+ <DatePicker
|
|
|
+ disabled={isLook}
|
|
|
+ allowClear={!item.must}
|
|
|
+ value={dayjs(info[item.key as 'date'])}
|
|
|
+ onChange={e => dataChangeFu(e, item)}
|
|
|
+ disabledDate={current => current && current > dayjs().endOf('day')}
|
|
|
+ />
|
|
|
+ ) : item.type === 'Input' ? (
|
|
|
+ <Input
|
|
|
+ readOnly={isLook}
|
|
|
+ placeholder='请输入'
|
|
|
+ value={info[item.key as 'date']}
|
|
|
+ onChange={e => dataChangeFu(e.target.value, item)}
|
|
|
+ maxLength={item.maxLength || 30}
|
|
|
+ showCount
|
|
|
+ />
|
|
|
+ ) : item.type === 'Cascader' ? (
|
|
|
+ <Cascader
|
|
|
+ disabled={isLook}
|
|
|
+ changeOnSelect
|
|
|
+ options={item.options}
|
|
|
+ placeholder={isLook ? '（空）' : '请选择'}
|
|
|
+ fieldNames={{ label: 'name', value: 'id', children: 'children' }}
|
|
|
+ allowClear={!item.must}
|
|
|
+ value={
|
|
|
+ info[item.key as 'date']
|
|
|
+ ? (info[item.key as 'date'] as string).split(',')
|
|
|
+ : []
|
|
|
+ }
|
|
|
+ onChange={e => dataChangeFu(e, item)}
|
|
|
+ />
|
|
|
+ ) : item.type === 'TextArea' ? (
|
|
|
+ <TextArea
|
|
|
+ readOnly={isLook}
|
|
|
+ placeholder={isLook ? '（空）' : '请输入'}
|
|
|
+ value={info[item.key as 'date']}
|
|
|
+ onChange={e => dataChangeFu(e.target.value, item)}
|
|
|
+ maxLength={item.maxLength || 500}
|
|
|
+ showCount
|
|
|
+ />
|
|
|
+ ) : item.type === 'ChildTable' ? (
|
|
|
+ <>
|
|
|
+ {snaps.length > 0 ? (
|
|
|
+ item.callBackChildren(snaps, setSnapsFu)
|
|
|
+ ) : (
|
|
|
+ <Button
|
|
|
+ type='primary'
|
|
|
+ onClick={() => {
|
|
|
+ setShowChildTable(true)
|
|
|
+ item.func()
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {item.placeHolder}
|
|
|
+ </Button>
|
|
|
+ )}
|
|
|
+
|
|
|
+ {showChildTable && (
|
|
|
+ <SelectGoods
|
|
|
+ myType='藏品'
|
|
|
+ isOne={item.SelectGoodsProps.isOne}
|
|
|
+ API_getList={item.SelectGoodsProps.API_getList}
|
|
|
+ closeFu={() => setShowChildTable(false)}
|
|
|
+ baseFormData={item.SelectGoodsProps.baseFormData}
|
|
|
+ topSelectDom={item.SelectGoodsProps.topSelectDom}
|
|
|
+ columnsTemp={item.SelectGoodsProps.columnsTemp}
|
|
|
+ oldCheckArr={snaps}
|
|
|
+ dataResFu={data => {
|
|
|
+ // 需要过滤掉已经有id的-不替换数据，没有id的替换数据 因为数据可能已经在另外一个弹窗更新了
|
|
|
+ const nowIds = snaps.map(v => v.id)
|
|
|
+ const dataRes: GoodsType[] = data.map((v, i) => {
|
|
|
+ v.idTemp = v.id + 'clue'
|
|
|
+ // 优先使用已存在的snap数据，否则使用新数据
|
|
|
+ const item = nowIds.includes(v.id) ? snaps[i] : v
|
|
|
+ // 如果是线索选择，添加标识
|
|
|
+ // if (isClueSelect) {
|
|
|
+ // // 因为征集和藏品表分开的，所以在藏品里面拿征集信息，自己加上这个标识
|
|
|
+ // return { ...item, pageType: 'clue' }
|
|
|
+ // }
|
|
|
+ return item
|
|
|
+ })
|
|
|
+
|
|
|
+ setSnapsFu(dataRes)
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ )}
|
|
|
+ </>
|
|
|
+ ) : null}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ ))}
|
|
|
+
|
|
|
+ {/* 附件 */}
|
|
|
+ <div className='Edtop1row Edtop1rowFull'>
|
|
|
+ <div className='Edtop1ll'>附件：</div>
|
|
|
+ <div className='Edtop1rr'>
|
|
|
+ <Z3upFiles isLook={isLook} {...fileUpInfo} />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </>
|
|
|
+ ) : null}
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+export default EditTopDom
|
lanxin