From a52d2b801ac2aa6148ae78a5306a13a354abf7d2 Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Fri, 13 Sep 2024 18:32:39 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh --- gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx | 281 ++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 214 insertions(+), 67 deletions(-) diff --git a/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx b/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx index 091e29d..47faac2 100644 --- a/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx +++ b/gz-customerSystem/src/views/register/eventFlow/component/EventFlow.jsx @@ -1,77 +1,224 @@ -import React from 'react'; -import { Button } from '@arco-design/web-react'; +import React, { useState, useRef, useEffect, Fragment } from 'react'; +import { Button, Modal, Tabs, Badge, Steps } from '@arco-design/web-react'; import { Space } from 'antd'; import ProgressStep from '@/components/ProgressStep/VisitStep'; +import BackModel from "./BackModel"; +import { Scrollbars } from "react-custom-scrollbars"; +import { getOffset, getSize } from '@/utils/utility'; +import EscalationModel from './EscalationModel'; +import AssignedModel from './AssignedModel'; +import MatterDetail from '../../matterDetail'; +import SupervisingView from "../../matterDetail/Supervising"; +import * as $$ from '@/utils/utility'; +import { useNavigate } from 'react-router-dom'; -const fakeData = [ - { - handlerUserName: '天河区棠下街综治中心', - finishTime: new Date().getTime() - 24 * 60 * 60 * 1000, // 一天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '来访登记', - mediResult: '22_00025-1', - handleContent: '调解成功,双方达成一致意见。', - operationName: '李晓明' - }, - { - handlerUserName: '系统派单', - finishTime: new Date().getTime() - 12 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '派单至:白云区新市街市场监管所', - }, - { - handlerUserName: '白云区新市街市场监管所', - finishTime: new Date().getTime() - 11 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '2', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '已签收', - operationName: '赵菲菲' - }, - { - handlerUserName: '白云区新市街市场监管所', - finishTime: new Date().getTime() - 11 * 60 * 60 * 1000, // 半天前的时间 - handleResult: '1', - status: '3', - taskNodeName: '事件回退', - mediResult: '22_00025-1', - // handleContent: '已签收', - operationName: '赵菲菲' - }, - { - handlerUserName: '天河区棠下街综治中心', - finishTime: new Date().getTime() - 6 * 60 * 60 * 1000, // 6小时前的时间 - handleResult: '2', - status: '1', - taskNodeName: '事件流转', - mediResult: '22_00025-1', - handleContent: '案件已被签收,准备开始调解。', - operationName: '李晓明' - }, -]; +const TabPane = Tabs.TabPane; +const Step = Steps.Step; + +function getListCaseFlow(caseId) { + return $$.ax.request({ url: `caseTask/listCaseFlow?caseId=${caseId}`, type: 'get', service: 'mediate' }); +} + +function accept(data) { + return $$.ax.request({ url: `caseTask/accept`, type: 'post', service: 'mediate', data }); +} export default function EventFlow(props) { - const tabs = [ - { index: '1', label: '承办部门' }, - { index: '2', label: '配合部门' }, - ]; + const myButton = [ + { + label: '受理', + type: 'primary', + click: () => { + Modal.confirm({ + title: '受理确认', + content: '确认受理该事件?', + onOk: async () => { + const res = await accept({ + caseTaskId: props.caseTaskId + }) + if (res.type) { + $$.infoSuccess({ content: '受理成功!' }); + navigate(`/mediate/visit/handleFeedback?caseTaskId=${props.caseTaskId}&caseId=${props.caseId}`) + } + }, + }); + }, + key: 'sl', + }, + { + label: '自行受理', + type: 'primary', + click: () => { }, + key: 'zxsl', + }, + { + label: '回退', + type: 'outline', + click: () => setBackVisible(true), + key: 'ht', + status: 'danger' + }, + { + label: '交办', + type: 'outline', + click: () => setAssignedVisible(true), + key: 'jb', + }, + { + label: '上报', + type: 'outline', + click: () => setEscalationVisible(true), + key: 'sb', + }, + ] + const scrollRef = useRef(null) + const navigate = useNavigate(); + const [backVisible, setBackVisible] = useState(false) + const [height, setHeight] = useState(500) + const [escalationVisible, setEscalationVisible] = useState(false) + const [assignedVisible, setAssignedVisible] = useState(false) + const [staticButtonList, setStaticButtonList] = useState([]) + const [progressData, setProgressData] = useState({}) + + useEffect(() => { + if (props.authorData) { + const { buttonList } = props.authorData; + setStaticButtonList(myButton.filter(item => { + const flag = buttonList.some(result => { + if (result.id === item.key) { + return true + } + }) + return flag + })) + } + }, [props.authorData]) + + useEffect(() => { + getData() + onWindowResize() + window.addEventListener("resize", onWindowResize); + // 返回一个函数,该函数会在组件卸载前执行 + return () => { + // 组件销毁时执行 + window.removeEventListener("resize", onWindowResize); + }; + }, []) + + const onWindowResize = () => { + let offsetTop = 0; + if (scrollRef.current.container) { + offsetTop = getOffset(scrollRef.current.container).top; + } + setHeight(getSize().windowH - offsetTop - 16) + }; + + //获取流程信息 + const getData = async () => { + const res = await getListCaseFlow( + props.caseId + ) + if (res.type) { + setProgressData(res.data) + } + } + + + + return ( - <div className='dataSync'> - <div className='dataSync-hasTabPage' > - <ProgressStep progressData={fakeData} /> + <Fragment> + <div style={{ backgroundColor: '#fff', margin: '0 16px 0px 16px', paddingTop: '16px', paddingLeft: '91px' }}> + <Steps type='navigation' current={2}> + <Step title='来访登记' disabled /> + <Step title='事件流转' disabled /> + <Step title='办理反馈' disabled /> + <Step title='结案审核' disabled /> + <Step title='当事人评价' disabled /> + <Step title='结案归档' disabled /> + </Steps> </div> - <div className="dataSync-excel"> - <Space size="large" style={{ margin: '4px 14px' }}> - <Button type="primary" >受理</Button> - <Button type='outline' status='danger'>回退</Button> - <Button type='secondary' >返回上级页面</Button> - </Space> + + <div className='dataSync' style={{ marginTop: '8px' }}> + <Scrollbars + style={{ height: height }} + ref={scrollRef} + autoHide + > + <MatterDetail caseId={props.caseId} /> + <div className='dataSync-hasTabPage' style={{ marginTop: '-8px', paddingBottom: '64px' }}> + <Tabs defaultActiveTab='1' > + <TabPane + key='1' + title={ + <span style={{ fontSize: '15px' }}> + 流转进度 + </span> + } + > + <ProgressStep progressData={progressData} /> + </TabPane> + <TabPane + key='2' + title={ + <span style={{ fontSize: '15px' }}> + 督办信息 + {/* <Badge maxCount={99} count={1000} /> */} + </span> + } + > + <div style={{ marginBottom: '20px' }}> + <SupervisingView id={''} /> + </div> + </TabPane> + </Tabs> + </div> + </Scrollbars> + <Modal + title='回退' + visible={backVisible} + onOk={() => setBackVisible(false)} + onCancel={() => { setBackVisible(false) }} + footer={null} + unmountOnExit={true} + maskClosable={false} + > + <BackModel caseId={props.caseId} caseTaskId={props.caseTaskId} onCancel={() => { setBackVisible(false) }} /> + </Modal> + <Modal + title='上报' + visible={escalationVisible} + onOk={() => setEscalationVisible(false)} + onCancel={() => { setEscalationVisible(false) }} + footer={null} + unmountOnExit={true} + maskClosable={false} + > + <EscalationModel caseId={props.caseId} caseTaskId={props.caseTaskId} onCancel={() => { setEscalationVisible(false) }} /> + </Modal> + <Modal + title='交办' + visible={assignedVisible} + onOk={() => setAssignedVisible(false)} + onCancel={() => { setAssignedVisible(false) }} + footer={null} + unmountOnExit={true} + maskClosable={false} + autoFocus={false} + focusLock={false} + > + <AssignedModel caseId={props.caseId} caseTaskId={props.caseTaskId} onCancel={() => { setAssignedVisible(false) }} /> + </Modal> + <div className="dataSync-excel"> + <Space size="middle" style={{ margin: '4px 14px' }}> + {staticButtonList?.map(item => { + const { label, key, click, ...rest } = item; + return <Button key={key} onClick={click} {...rest} >{label}</Button> + })} + <Button type='secondary' onClick={() => navigate(-1)}>返回上级页面</Button> + </Space> + </div> </div> - </div> + </Fragment> ) } -- Gitblit v1.8.0