From e1961f3d69deb7bb75c365748f4726bcedb10dda Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Sat, 31 Aug 2024 15:37:54 +0800 Subject: [PATCH] feat:事件流转 --- gz-customerSystem/src/components/ProgressStep/VisitStep.jsx | 118 ++++++++++------------------------------------------------- 1 files changed, 20 insertions(+), 98 deletions(-) diff --git a/gz-customerSystem/src/components/ProgressStep/VisitStep.jsx b/gz-customerSystem/src/components/ProgressStep/VisitStep.jsx index eb4460a..7af8187 100644 --- a/gz-customerSystem/src/components/ProgressStep/VisitStep.jsx +++ b/gz-customerSystem/src/components/ProgressStep/VisitStep.jsx @@ -16,37 +16,20 @@ import FilesDrawer from '../FilesDrawer'; import './index.less'; -// 获取调度处理进度数据 -function getDispProgressDataApi(caseId) { - return $$.ax.request({ url: 'caseTask/transferRecord?caseId=' + caseId, type: 'get', service: 'mediate' }); -} - -// 获取调解处理进度数据 -function getProgressDataApi(caseId) { - return $$.ax.request({ url: 'caseTask/transferRecord?caseId=' + caseId, type: 'get', service: 'mediate' }); -} -// 获取司法确认处理进度数据 -function getJudicProgressDataApi(caseId) { - return $$.ax.request({ url: 'judicTask/getTaskProcess?caseId=' + caseId, type: 'get', service: 'mediate' }); -} - /** - * caseId:'', // 案件id - * pageFrom:'', // 判断那个页面展示 + * progressData:'', // 流程数据 */ -const ProgressStep = ({ caseId, pageFrom }) => { - const [data, setData] = useState([]); - - // 提交调解 案件调度 案件签收 纠纷调解 指派网格员 +const ProgressStep = ({ progressData }) => { + const iconMap = { + 1: ledger_8, + 2: ledger_7, + } // 已处理列表第一个元素 const dom1 = (x) => ( <div> <div className="myStep-item-p"> <span>{x.handlerUserName || '-'}</span> - {/* <span className={`public-nameCard-tag public-nameCard-tag-grey`}> - {x.canalName || '-'} - </span> */} </div> <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}> <span>操作人:</span> @@ -64,17 +47,19 @@ <div className="myStep-item-p"> <span>{x.handlerUserName || '-'}</span> </div> - <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}> - <span>操作人:</span> - <span>{x.operationName}</span> - </div> + {x.operationName && + <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}> + <span>操作人:</span> + <span>{x.operationName}</span> + </div> + } <div className="myStep-item-p" style={{ color: 'rgba(0,0,0,0.50)' }}> <span>操作时间:</span> <span>{$$.timeFormat(x.finishTime)}</span> </div> { x.handleContent && - <div className='myStep-item-p-yy' style={{width:'200px'}}> + <div className='myStep-item-p-yy' style={{ width: '200px' }}> <span className='myStep-item-p-yy-l'> {x.handleResult == '2' ? <span>退回<Tooltip placement="top" title={x.handleContent || ''}><span>{`(${x.handleContent})` || '-'}</span></Tooltip></span> @@ -101,7 +86,7 @@ const dom3 = (x) => ( <div> <div className="myStep-item-p"> - <span style={{ color: 'rgba(0,0,0,0.50)' }}>办理中</span> + <span style={{ color: 'rgba(0,0,0,0.50)' }}>待受理</span> </div> <div className="myStep-item-p"> <span>{x.handlerUserName}</span> @@ -109,92 +94,29 @@ </div> ); - const fakeData = [ - { - handlerUserName: '天河区棠下街综治中心', - canalName: '来访登记', - finishTime: new Date().getTime() - 24 * 60 * 60 * 1000, // 一天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '来访登记', - mediResult: '22_00025-1', - handleContent: '调解成功,双方达成一致意见。', - operationName: '李晓明' - }, - { - handlerUserName: '天河区棠下街综治中心', - canalName: '事件流转', - finishTime: new Date().getTime() - 12 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '案件调度', - mediResult: '22_00025-1', - handleContent: '自行受理', - operationName: '李晓明' - - }, - { - handlerUserName: '天河区棠下街综治中心', - canalName: '办理反馈', - finishTime: new Date().getTime() - 6 * 60 * 60 * 1000, // 6小时前的时间 - handleResult: '2', - status: '3', - taskNodeName: '案件签收', - mediResult: '22_00025-1', - handleContent: '案件已被签收,准备开始调解。', - operationName: '李晓明' - - }, - ]; - - useEffect(() => { - if (pageFrom === 'dispatchRecord') { - setData(fakeData || []) - } - }, [pageFrom]); - - function splitByLine(str, len = 10) { - let strLen = str.length, - num = 0, - multiple = Math.floor(strLen / len), - arrStr = str.split(''), - space = strLen % len > 0 ? multiple + 1 : multiple - for (let i = 1; i <= space; i++) { - arrStr.splice((len * i + num), 0, '\n') - num++ - } - return arrStr.join('') - } - - return ( <> - {data.length !== 0 - ? data.map((x, t) => { + {progressData.length !== 0 + ? progressData.map((x, t) => { return ( <div key={t + 1}> <div className="myStep-item"> - {t === data.length - 1 ? null : <div className={`${!x.handleContent ? 'myStep-item-divider' : x.fileInfoList?.length > 0 ? 'myStep-item-divider2' : "myStep-item-divider1"} ${x.status === '2' && 'myStep-item-divider-success'}`} />} + {t === progressData.length - 1 ? null : <div className={`${!x.handleContent ? 'myStep-item-divider' : x.fileInfoList?.length > 0 ? 'myStep-item-divider2' : "myStep-item-divider1"} ${x.status === '2' && 'myStep-item-divider-success'}`} />} <div className={`myStep-item-icon1 myStep-item-${x.status === '2' ? 'success1' : 'noStarted1'}`}> - <div className="myStep-item-title">{splitByLine(x.taskNodeName || '', 2)}</div> - <img className='myStep-item-img' src={x.status === '1' ? ledger_8 : (x.handleResult === '2' ? feedback : ledger_7)} alt="" /> - {/* <Icon className='myStep-item-img' component={x.handleResult === '2' ? RollbackOutlined : CheckOutlined} /> */} + <div className="myStep-item-title">{x.taskNodeName}</div> + <img className='myStep-item-img' src={iconMap[x.status]} alt="" /> </div> <div className="myStep-item-right"> - {/* {dom1(x || {})} */} { t === 0 && dom1(x || {}) } { t !== 0 && <> { - x.status === '2' ? dom2(x || {}) : dom3(x || {}) + x.status === '1' ? dom3(x || {}) : dom2(x || {}) } </> } - {/* <div className="myStep-item-title">{x.taskNodeName}</div> */} - {/* { - <StepContent x={x || {}} t={t || 0} />} */} </div> </div> </div> -- Gitblit v1.8.0