|
@@ -0,0 +1,318 @@
|
|
|
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
|
|
+import styles from './index.module.scss'
|
|
|
+import { A5tableType } from '@/types'
|
|
|
+import ZupOne from '@/components/ZupOne'
|
|
|
+import { Button, Cascader, Input, Modal } from 'antd'
|
|
|
+import { A2_APIgetList1, A2_APIgetList2 } from '@/store/action/A2classify'
|
|
|
+import { useDispatch, useSelector } from 'react-redux'
|
|
|
+import { RootState } from '@/store'
|
|
|
+import { A5selArr1 } from '../data'
|
|
|
+import MyPopconfirm from '@/components/MyPopconfirm'
|
|
|
+import { A5_APIaudit, A5_APIgetInfo } from '@/store/action/A5bookAudit'
|
|
|
+import { MessageFu } from '@/utils/message'
|
|
|
+import A1add from '@/pages/A1manage/A1add'
|
|
|
+const { TextArea } = Input
|
|
|
+
|
|
|
+type Props = {
|
|
|
+ info: A5tableType
|
|
|
+ closeFuOne: () => void
|
|
|
+ editTableFu: () => void
|
|
|
+}
|
|
|
+
|
|
|
+function A5look({ info, closeFuOne, editTableFu }: Props) {
|
|
|
+ const dispatch = useDispatch()
|
|
|
+ // 占位ref
|
|
|
+ const imgRef = useRef<any>(null)
|
|
|
+ const ZupTxtRef = useRef<any>(null)
|
|
|
+
|
|
|
+ // 获取中图法分类 和 展示分类
|
|
|
+ useEffect(() => {
|
|
|
+ dispatch(A2_APIgetList1())
|
|
|
+ dispatch(A2_APIgetList2({ pageNum: 1, pageSize: 9999, searchKey: '' }))
|
|
|
+ }, [dispatch])
|
|
|
+
|
|
|
+ const { treeData: storageArr, tableInfo: exhibitTypeObj } = useSelector(
|
|
|
+ (state: RootState) => state.A2classify
|
|
|
+ )
|
|
|
+
|
|
|
+ const [storageIds, setStorageIds] = useState<any>([])
|
|
|
+
|
|
|
+ // 审核状态外面页面
|
|
|
+ const [auditStatus, setAuditStatus] = useState<'' | 0 | 1 | 2>('')
|
|
|
+
|
|
|
+ const auditStatusTxt = useMemo(() => {
|
|
|
+ let txt = ''
|
|
|
+ let obj = A5selArr1.find(v => v.value === auditStatus)
|
|
|
+ if (obj) txt = obj.label
|
|
|
+ return txt
|
|
|
+ }, [auditStatus])
|
|
|
+
|
|
|
+ // 审核状态-里面
|
|
|
+ const [auditStatus2, setAuditStatus2] = useState<'' | 0 | 1 | 2>('')
|
|
|
+
|
|
|
+ // 审核人
|
|
|
+ const [auditBy, setAuditBy] = useState('')
|
|
|
+
|
|
|
+ // 审核时间
|
|
|
+ const [auditTime, setAuditTime] = useState('')
|
|
|
+
|
|
|
+ // 审核备注
|
|
|
+ const [auditDesc, setAuditDesc] = useState('')
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ // 设置封面图
|
|
|
+ imgRef.current?.setFileComFileFu({
|
|
|
+ fileName: '',
|
|
|
+ filePath: info.thumb
|
|
|
+ })
|
|
|
+
|
|
|
+ // 设置附件
|
|
|
+ ZupTxtRef.current?.setFileComFileFu({
|
|
|
+ fileName: info.fileName,
|
|
|
+ filePath: info.filePath
|
|
|
+ })
|
|
|
+
|
|
|
+ let storageIds: number[] = []
|
|
|
+ if (info.ancestor) storageIds = info.ancestor.split(',').map((v: string) => Number(v))
|
|
|
+ storageIds.push(Number(info.storageId))
|
|
|
+
|
|
|
+ setStorageIds(storageIds)
|
|
|
+
|
|
|
+ // 设置审核状态
|
|
|
+ setAuditStatus(info.auditStatus)
|
|
|
+
|
|
|
+ setAuditBy(info.creatorName)
|
|
|
+ setAuditTime(info.auditTime)
|
|
|
+ setAuditDesc(info.auditDesc)
|
|
|
+ }, [info])
|
|
|
+
|
|
|
+ // 审核页面
|
|
|
+ const [aduitShow, setAduitShow] = useState(false)
|
|
|
+
|
|
|
+ useEffect(() => {
|
|
|
+ if (aduitShow) setAuditStatus2(auditStatus)
|
|
|
+ else setAuditStatus2('')
|
|
|
+ }, [aduitShow, auditStatus, info.auditStatus])
|
|
|
+
|
|
|
+ // 审核点击确定
|
|
|
+ const btnOk = useCallback(async () => {
|
|
|
+ const obj = {
|
|
|
+ id: info.id,
|
|
|
+ auditDesc,
|
|
|
+ auditStatus: auditStatus2
|
|
|
+ }
|
|
|
+ const res = await A5_APIaudit(obj)
|
|
|
+ if (res.code === 0) {
|
|
|
+ MessageFu.success('审核成功!')
|
|
|
+ const res2 = await A5_APIgetInfo(info.id)
|
|
|
+ if (res2.code === 0) {
|
|
|
+ const data: A5tableType = res2.data
|
|
|
+
|
|
|
+ setAuditStatus(data.auditStatus)
|
|
|
+ setAuditBy(data.creatorName)
|
|
|
+ setAuditTime(data.auditTime)
|
|
|
+ setAuditDesc(data.auditDesc)
|
|
|
+ setAduitShow(false)
|
|
|
+
|
|
|
+ editTableFu()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, [auditDesc, auditStatus2, editTableFu, info.id])
|
|
|
+
|
|
|
+ // 点击创建图书
|
|
|
+ const [creatorShow, setCreatorShow] = useState(false)
|
|
|
+
|
|
|
+ return (
|
|
|
+ <div className={styles.A5look}>
|
|
|
+ <div className='A5lMain'>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>书名:</div>
|
|
|
+ <div className='A5lRight'>{info.name || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>简介:</div>
|
|
|
+ <div className='A5lRight'>{info.description || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>作者:</div>
|
|
|
+ <div className='A5lRight'>{info.author || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>出版社:</div>
|
|
|
+ <div className='A5lRight'>{info.press || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow A5lRow2'>
|
|
|
+ <div className='A5lLeft'>出版年份:</div>
|
|
|
+ <div className='A5lRight'>{info.year || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft A5lLeft2'>封面:</div>
|
|
|
+ <div className='A5lRight'>
|
|
|
+ <ZupOne
|
|
|
+ ref={imgRef}
|
|
|
+ isLook={true}
|
|
|
+ fileCheck={false}
|
|
|
+ size={5}
|
|
|
+ dirCode={'A1manage'}
|
|
|
+ myUrl='cms/book/upload'
|
|
|
+ format={['image/jpeg', 'image/png']}
|
|
|
+ formatTxt='png、jpg和jpeg'
|
|
|
+ checkTxt='请上传封面图!'
|
|
|
+ upTxt='最多1张'
|
|
|
+ myType='thumb'
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft A5lLeft2'>中图法分类:</div>
|
|
|
+ <div className='A5lRight'>
|
|
|
+ <Cascader
|
|
|
+ allowClear={false}
|
|
|
+ changeOnSelect
|
|
|
+ style={{ width: 300 }}
|
|
|
+ options={storageArr}
|
|
|
+ fieldNames={{ label: 'name', value: 'id', children: 'children' }}
|
|
|
+ placeholder='请选择'
|
|
|
+ value={storageIds}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>展示分类:</div>
|
|
|
+ <div className='A5lRight'>{info.exhibitTypeName || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>ISBN编号:</div>
|
|
|
+ <div className='A5lRight'>{info.num || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>附件:</div>
|
|
|
+ <div className='A5lRight'>
|
|
|
+ <ZupOne
|
|
|
+ ref={ZupTxtRef}
|
|
|
+ isLook={true}
|
|
|
+ fileCheck={false}
|
|
|
+ size={30}
|
|
|
+ dirCode='A1manage'
|
|
|
+ myUrl='cms/book/upload'
|
|
|
+ format={['']}
|
|
|
+ formatTxt='equb'
|
|
|
+ checkTxt='请上传equb附件!'
|
|
|
+ upTxt='最多1个'
|
|
|
+ myType='equb'
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>提交人:</div>
|
|
|
+ <div className='A5lRight'>{info.wxUserName || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ <div className='A5lRow'>
|
|
|
+ <div className='A5lLeft'>提交时间:</div>
|
|
|
+ <div className='A5lRight'>{info.createTime || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* 右侧按钮 */}
|
|
|
+ <div className='A5lBtn'>
|
|
|
+ 审核状态:{auditStatusTxt}
|
|
|
+ <br /> <br />
|
|
|
+ <Button type='primary' onClick={() => setAduitShow(true)}>
|
|
|
+ 审核
|
|
|
+ </Button>
|
|
|
+ <br /> <br />
|
|
|
+ <Button type='primary' onClick={() => setCreatorShow(true)}>
|
|
|
+ 创建图书
|
|
|
+ </Button>
|
|
|
+ <br /> <br />
|
|
|
+ <Button onClick={closeFuOne}>返回</Button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ {/* 审核出来的页面 */}
|
|
|
+ {aduitShow ? (
|
|
|
+ <Modal
|
|
|
+ wrapClassName={styles.A5lAduit}
|
|
|
+ open={true}
|
|
|
+ title='审核'
|
|
|
+ footer={
|
|
|
+ [] // 设置footer为空,去掉 取消 确定默认按钮
|
|
|
+ }
|
|
|
+ >
|
|
|
+ <div className='formRow'>
|
|
|
+ <div className='formLeft formLeft2'>审核状态:</div>
|
|
|
+ <div className='formRight'>
|
|
|
+ {A5selArr1.filter(v => v.label !== '全部').map(v => (
|
|
|
+ <Button
|
|
|
+ onClick={() => setAuditStatus2(v.value as 0)}
|
|
|
+ type={v.value === auditStatus2 ? 'primary' : 'default'}
|
|
|
+ key={v.value}
|
|
|
+ >
|
|
|
+ {v.label}
|
|
|
+ </Button>
|
|
|
+ ))}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className='formRow'>
|
|
|
+ <div className='formLeft'>
|
|
|
+ <span></span>审核人:
|
|
|
+ </div>
|
|
|
+ <div className='formRight'>{auditBy || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className='formRow'>
|
|
|
+ <div className='formLeft'>
|
|
|
+ <span></span>审核时间:
|
|
|
+ </div>
|
|
|
+ <div className='formRight'>{auditTime || '(空)'}</div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className='formRow'>
|
|
|
+ <div className='formLeft'>
|
|
|
+ <span></span>审核备注:
|
|
|
+ </div>
|
|
|
+ <div className='formRight'>
|
|
|
+ <TextArea
|
|
|
+ value={auditDesc}
|
|
|
+ onChange={e => setAuditDesc(e.target.value)}
|
|
|
+ rows={6}
|
|
|
+ placeholder='请输入内容'
|
|
|
+ maxLength={200}
|
|
|
+ showCount
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div className='A5lAduitBtn'>
|
|
|
+ <Button type='primary' onClick={btnOk}>
|
|
|
+ 提交
|
|
|
+ </Button>
|
|
|
+  
|
|
|
+ <MyPopconfirm txtK='取消' onConfirm={() => setAduitShow(false)} />
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
+ ) : null}
|
|
|
+
|
|
|
+ {/* 点击创建图书 */}
|
|
|
+ {creatorShow ? (
|
|
|
+ <div className='A5Ladd'>
|
|
|
+ <div>
|
|
|
+ <A1add
|
|
|
+ editInfo={{ id: info.id, txt: '编辑' }}
|
|
|
+ closeFu={() => setCreatorShow(false)}
|
|
|
+ addTableFu={() => {}}
|
|
|
+ editTableFu={() => {}}
|
|
|
+ storageArr={storageArr}
|
|
|
+ exhibitTypeArr={exhibitTypeObj.list}
|
|
|
+ isAudit={true}
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ ) : null}
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+}
|
|
|
+
|
|
|
+const MemoA5look = React.memo(A5look)
|
|
|
+
|
|
|
+export default MemoA5look
|