From d178386d1d5b63e2f648f0a637b00fca669cccd1 Mon Sep 17 00:00:00 2001 From: xusd <hugeinfo123> Date: Mon, 09 Sep 2024 22:23:01 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh --- gz-customerSystem/src/views/register/index.jsx | 854 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 840 insertions(+), 14 deletions(-) diff --git a/gz-customerSystem/src/views/register/index.jsx b/gz-customerSystem/src/views/register/index.jsx index 2da95a0..0c63274 100644 --- a/gz-customerSystem/src/views/register/index.jsx +++ b/gz-customerSystem/src/views/register/index.jsx @@ -1,63 +1,809 @@ -import React from 'react'; +/* + * @Author: dminyi 1301963064@qq.com + * @Date: 2024-09-08 15:14:12 + * @LastEditors: dminyi 1301963064@qq.com + * @LastEditTime: 2024-09-09 17:06:20 + * @FilePath: \gzDyh\gz-customerSystem\src\views\register\index.jsx + * @Description: 工作台 + */ +import React, { useEffect, useState } from 'react'; +import { useNavigate } from 'react-router-dom'; +import { tab1, tab2, tab3, tab4, tab5, tab6, visitInto, checkInto } from '@/assets/images' +import TableView from '../../components/TableView'; +import { Space } from 'antd'; +import { Tabs, Typography, Radio } from '@arco-design/web-react'; +import * as $$ from '@/utils/utility'; + +const TabPane = Tabs.TabPane; + +function pageMyTaskBlApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskBl`, type: 'get', service: 'mediate', data }); +} + +function getCountListApi(data) { + return $$.ax.request({ url: `caseTask/getCountList`, type: 'get', service: 'mediate', data }); +} const VisitWorkBench = () => { - + const navigate = useNavigate(); + const [tabActivekey, setTabActivekey] = useState('1') + const [CountList, setCountList] = useState({}) + const [direction, setDirection] = useState('回退审核') const tabsList = [ { key: '1', label: '待分派', bgColor: '#E8F8FF', - num: 10, + num: `${CountList?.waitDisp}`, + img: tab1 }, { key: '2', label: '待签收', bgColor: '#E8FFEA', - num: 30, + num: `${CountList?.waitSign}`, + img: tab2 }, { key: '3', label: '待受理', bgColor: '#F5E8FF', - num: 50, + num: `${CountList?.waitAccept}`, + img: tab3 }, { key: '4', label: '办理中', bgColor: '#E6FFFB', - num: 60, + num: `${CountList?.waitReview}`, + img: tab4 }, { key: '5', label: '待审核', bgColor: '#E8F7FF', - num: 70, + num: `${CountList?.supervise}`, + img: tab5 }, { key: '6', label: '督办', bgColor: '#FFF7E6', - num: 80, + num: `${CountList?.processing}`, + img: tab6 + }, ] + + const fakeData1 = + [ + { + id: 1, + caseNo: 'A20230101', + judicNo: '申请材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 2, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 3, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 4, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 5, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 6, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 7, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 8, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 9, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + { + id: 10, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + + // 更多数据... + ] + + const [columnType, setColumnType] = useState([ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + }, + { + title: '分派时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 60, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }, + ]) + + // 列配置 + const fakeColumns3 = [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + render: (text, record, index) => <span>{index + 1}</span>, + }, + { + title: '分派时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 60, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }, + ]; + const fakeColumns1 = [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + render: (text, record, index) => <span>{index + 1}</span>, + }, + { + title: '签收时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 60, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + <div>签收</div> + </Space> + ), + }, + ]; + const fakeColumns2 = [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + }, + { + title: '受理时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 60, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }, + ]; + + const [column, setColumn] = useState([ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + }, + { + title: '已办天数', + dataIndex: 'processingDays', + key: 'processingDays', + width: 60, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '承办部门', + dataIndex: 'organizingUnit', + key: 'organizingUnit', + width: 180, + }, + { + title: '配合部门', + dataIndex: 'cooperatingUnit', + key: 'cooperatingUnit', + width: 180, + }, + { + title: '经办人', + dataIndex: 'manager', + key: 'manager', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }, + ]) + + const [backColumn, setBackColumn] = useState([ + { + title: '回退时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + }, + { + title: '回退部门', + dataIndex: 'backUnit', + key: 'backUnit', + width: 60, + }, + { + title: '回退理由', + dataIndex: 'reason', + key: 'reason', + width: 180, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>详情</div> + {/* <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> */} + {(direction === '回退审核' || direction === '上报审核') && + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + + } + {(direction === '结案申请审核' || direction === '联合处置审核') && + <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${'1'}&caseId=${'1'}`)} style={{ cursor: 'pointer' }}>处理</div> + } + </Space> + ), + }, + ]) + + const [mangeColumn, setMangeColumn] = useState([ + { + title: '督办时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 100, + render: (text, record, index) => <span>{index + 1}</span>, + }, + { + title: '回复时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 60, + }, + { + title: '督办部门', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '督办意见', + dataIndex: 'opinion', + key: 'opinion', + width: 180, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 180, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 180, + render: (text, record) => ( + <Space> + <div>回复</div> + <div>详情</div> + </Space> + ), + }, + ]) + + + + + const tabActive = (key) => { + console.log(key, 'key') + setTabActivekey(key); + if (key === '1') { + setColumnType(fakeColumns3) + } + if (key === '2') { + setColumnType(fakeColumns1) + } + if (key === '3') { + setColumnType(fakeColumns2) + } + if (key === '4') { + setColumnType(column) + } + if (key === '5') { + setColumnType(backColumn) + } + if (key === '6') { + setColumnType(mangeColumn) + } + } + + const pageMyTaskBl = async () => { + const res = await pageMyTaskBlApi({ page: 1, size: 10, timeStart: '', timeEnd: '', partyName: '', sortType: '', sortColmn: '' }) + if (res.type) { + console.log(res.data, 'res.data') + // setColumn(res.data) + } + } + + const getCountList = async () => { + const res = await getCountListApi() + if (res.type) { + const data = res.data + setCountList(data) + } + } + + + + useEffect(() => { + // pageMyTaskBl(); + getCountList(); + }, [columnType,direction]) + + + return ( <div className='VisitWorkBench'> <div className='VisitWorkBench-top'> - 工作总览 + <span style={{ fontWeight: 600 }}>工作总览</span> <div className='VisitWorkBench-top-list'> { tabsList.map((item, index) => ( - <div key={index} className='VisitWorkBench-top-list-tabsItem' style={{ backgroundColor: item.bgColor }}> + <div key={index} className='VisitWorkBench-top-list-tabsItem' style={{ backgroundColor: item.bgColor }} onClick={() => tabActive(item.key)}> <div> <div>{item.label}</div> - <div>{item.num}件</div> + <span className='VisitWorkBench-top-list-tabsItem-title'>{item.num}</span>件 </div> <div> - <img src={item.img} alt=''/> + <img src={item.img} alt='' className='VisitWorkBench-top-list-tabsItem-imgView' /> </div> </div> )) @@ -65,10 +811,90 @@ </div> </div> <div className='VisitWorkBench-middle'> - 222 + <Tabs defaultActiveTab='1'> + <TabPane + // onChange={handleColumnType} + key='1' + title={ + <span style={{ fontSize: '15px' }}> + {tabActivekey === '1' ? '待分派' : + tabActivekey === '2' ? '待签收' : + tabActivekey === '3' ? '待受理' : + tabActivekey === '4' ? '办理中' : + tabActivekey === '5' ? '待审核' : '督办-未回复' + } + </span> + } + > + <Typography.Paragraph> + {tabActivekey === '5' && + <Radio.Group + type='button' + name='direction' + value={direction} + onChange={(e) => setDirection(e)} + style={{ marginBottom: 16 }} + options={['回退审核', '上报审核', '结案申请审核', '联合处置审核']} + ></Radio.Group> + } + <TableView + columns={columnType} + dataSource={fakeData1} + size="small" + rowKey="id" + bordered={true} + // style={{ marginBottom: '65px', marginTop: '-16px' }} + rowSelection={{ + type: 'Checkbox' + }} + /> + </Typography.Paragraph> + </TabPane> + <TabPane + key='2' + title={ + <span style={{ fontSize: '15px' }}> + {tabActivekey === '1' ? '已分派' : + tabActivekey === '2' ? '已签收' : + tabActivekey === '3' ? '已受理' : + tabActivekey === '4' ? '结案申请' : + tabActivekey === '5' ? '已审核' : '督办-未回复' + } + </span> + } + > + <Typography.Paragraph> + </Typography.Paragraph> + </TabPane> + {tabActivekey === '4' && + <TabPane + key='3' + title={ + <span style={{ fontSize: '15px' }}> + 已结案 + </span> + } + > + <Typography.Paragraph> + </Typography.Paragraph> + </TabPane> + } + + </Tabs> + </div> <div className='VisitWorkBench-bottom'> - 333333 + 自行排查 + <div style={{ display: 'flex', justifyContent: 'space-evenly' }}> + <div className='bottomTab1'> + <div className='VisitWorkBench-bottom-title' onClick={() => navigate(`/mediate/visit`)} style={{ color: '#206BCD' }}>大厅来访</div> + <img src={visitInto} alt='' className='VisitWorkBench-bottom-img' /> + </div> + <div className='bottomTab2'> + <div className='VisitWorkBench-bottom-title' style={{ color: '#D46B08' }}>自行排查</div> + <img src={checkInto} alt='' className='VisitWorkBench-bottom-img' /> + </div> + </div> </div> </div> ) -- Gitblit v1.8.0