import React, { useState } from 'react';
|
import { Button, Modal, Tabs } from '@arco-design/web-react';
|
import { Space } from 'antd';
|
import ProgressStep from '@/components/ProgressStep/VisitStep';
|
import BackModel from "./BackModel";
|
|
const TabPane = Tabs.TabPane;
|
|
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() - 10 * 60 * 60 * 1000, // 半天前的时间
|
handleResult: '1',
|
status: '3',
|
taskNodeName: '事件回退',
|
mediResult: '22_00025-1',
|
// handleContent: '已签收',
|
operationName: '赵菲菲'
|
},
|
{
|
handlerUserName: '白云区新市街综治中心',
|
finishTime: new Date().getTime() - 9 * 60 * 60 * 1000, // 半天前的时间
|
handleResult: '1',
|
status: '2',
|
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: '李晓明'
|
},
|
];
|
|
export default function EventFlow(props) {
|
const [backVisible, setBackVisible] = useState(false)
|
const tabs = [
|
{ index: '1', label: '流转进度' },
|
{ index: '2', label: '督办信息' },
|
];
|
return (
|
<div className='dataSync'>
|
<div className='dataSync-hasTabPage' >
|
<Tabs defaultActiveTab='1' >
|
<TabPane
|
key='1'
|
title={
|
<span style={{ fontSize: '15px' }}>
|
流转进度
|
</span>
|
}
|
>
|
<div styles={{ height: "400px" }}><ProgressStep progressData={fakeData} /></div>
|
</TabPane>
|
<TabPane
|
key='2'
|
title={
|
<span style={{ fontSize: '15px' }}>
|
督办信息
|
</span>
|
}
|
>
|
</TabPane>
|
</Tabs>
|
|
</div>
|
<div className="dataSync-excel">
|
<Space size="large" style={{ margin: '4px 14px' }}>
|
<Button type="primary" >受理</Button>
|
<Button type="primary" >提交</Button>
|
<Button type="primary" >自行受理</Button>
|
<Button type='outline' status='danger' onClick={() => setBackVisible(true)}>回退</Button>
|
<Button type='outline'>交办</Button>
|
<Button type='outline'>上报</Button>
|
<Button type='secondary' >返回上级页面</Button>
|
</Space>
|
</div>
|
<Modal
|
title='回退'
|
visible={backVisible}
|
onOk={() => setBackVisible(false)}
|
onCancel={() => { setBackVisible(false) }}
|
autoFocus={false}
|
focusLock={true}
|
footer={null}
|
unmountOnExit={true}
|
maskClosable={false}
|
>
|
<BackModel />
|
</Modal>
|
</div>
|
)
|
}
|
