From 9f705a54328c4b59ad9566c521bc6e0e7577acb3 Mon Sep 17 00:00:00 2001 From: liuwh <964324856@qq.com> Date: Fri, 13 Sep 2024 19:10:30 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh into master --- gz-customerSystem/src/views/register/index.jsx | 1473 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 1,433 insertions(+), 40 deletions(-) diff --git a/gz-customerSystem/src/views/register/index.jsx b/gz-customerSystem/src/views/register/index.jsx index 2da95a0..c1c0450 100644 --- a/gz-customerSystem/src/views/register/index.jsx +++ b/gz-customerSystem/src/views/register/index.jsx @@ -1,74 +1,1467 @@ -import React from 'react'; +/* + * @Author: dminyi 1301963064@qq.com + * @Date: 2024-09-08 15:14:12 + * @LastEditors: lwh + * @LastEditTime: 2024-09-13 10:35:03 + * @FilePath: \gzDyh\gz-customerSystem\src\views\register\index.jsx + * @Description: 工作台 + */ +import React, { useEffect, useState, useRef } from 'react'; +import { useNavigate } from 'react-router-dom'; +import { tab1, tab2, tab3, tab4, tab5, tab6 } from '@/assets/images' +import TableView from '../../components/TableView'; +import { Space } from 'antd'; +import { Tabs, Typography, Radio, Form, Input, DatePicker, Button, Grid, Modal } from '@arco-design/web-react'; +import * as $$ from '@/utils/utility'; +import './index.less'; + +const FormItem = Form.Item; +const TabPane = Tabs.TabPane; +const { RangePicker } = DatePicker; +const Row = Grid.Row; +const Col = Grid.Col; + +//工作总览数据 +function getCountListApi(data) { + return $$.ax.request({ url: `caseTask/getCountList`, type: 'get', service: 'mediate', data }); +} + +//分派 +function pageMyTaskFpApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskFp`, type: 'get', service: 'mediate', data }); +} + +//签收 +function pageMyTaskQsApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskQs`, type: 'get', service: 'mediate', data }); +} + +//受理 +function pageMyTaskSlApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskSl`, type: 'get', service: 'mediate', data }); +} + +//办理中 +function pageMyTaskBlzApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskBlz`, type: 'get', service: 'mediate', data }); +} + +//办理中->结案申请、已结案接口 +function pageMyTaskBlApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskBl`, type: 'get', service: 'mediate', data }); +} + +//待审核 +function pageMyTaskShApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskSh`, type: 'get', service: 'mediate', data }); +} + +//督办 +function pageMyTaskDbApi(data) { + return $$.ax.request({ url: `caseTask/pageMyTaskDb`, type: 'get', service: 'mediate', data }); +} + +//签收接口 +function signApi(data) { + return $$.ax.request({ url: `caseTask/sign`, type: 'post', service: 'mediate', data }); +} const VisitWorkBench = () => { + const navigate = useNavigate(); + const formRef = useRef(); - const tabsList = [ + // 静态数据 + //分派表头 + const assignColumns = [ { - key: '1', - label: '待分派', - bgColor: '#E8F8FF', - num: 10, + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, }, { - key: '2', - label: '待签收', - bgColor: '#E8FFEA', - num: 30, - + title: '分派时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 190, + render: (text, record, index) => { + return getDiffTime(record.timeLimit) + } }, { - key: '3', - label: '待受理', - bgColor: '#F5E8FF', - num: 50, - + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 80, }, { - key: '4', - label: '办理中', - bgColor: '#E6FFFB', - num: 60, - + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 180, }, { - key: '5', - label: '待审核', - bgColor: '#E8F7FF', - num: 70, - + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 180, }, { - key: '6', - label: '督办', - bgColor: '#FFF7E6', - num: 80, + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, }, ] + //签收表头 + const signForColumns = [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '签收时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 190, + render: (text, record, index) => { + return getDiffTime(record.timeLimit) + } + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 100, + }, + { + 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, + }, + ] + //受理表头 + const acceptColumns = [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '受理时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 190, + render: (text, record, index) => { + return getDiffTime(record.timeLimit) + } + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 100, + }, + { + 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, + }, + ] + //待审核->回退表头 + const backColumn = [ + { + title: '回退时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '回退部门', + dataIndex: 'backUnit', + key: 'backUnit', + width: 150, + }, + { + 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, + }, + ] + //待审核->上报表头 + const upColumns = [ + { + title: '上报时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '上报部门', + dataIndex: 'organizingUnit', + key: 'organizingUnit', + width: 150, + }, + { + 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, + }, + ] + //待审核->结案申请表头 + const finishColumns = [ + { + title: '结案申请时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '申请部门', + dataIndex: 'organizingUnit', + key: 'organizingUnit', + width: 150, + }, + { + title: '化解结果', + dataIndex: 'mediResult', + key: 'mediResult', + width: 100, + }, + { + 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, + }, + ] + //待审核->联合处置表头 + const jointColumns = [ + { + title: '联合处置申请时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '申请部门', + dataIndex: 'organizingUnit', + key: 'organizingUnit', + width: 150, + }, + { + title: '添加配合部门', + dataIndex: 'cooperatingUnit', + key: 'cooperatingUnit', + width: 120, + }, + { + 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, + }, + ] + //工作总览map + const tabsMap = { + '1': { + workTotal: { + label: '待分派', + bgColor: '#E8F8FF', + value: 'waitDisp', + img: tab1 + }, + tabList: [ + { + value: '1', + label: '待分派', + columns: assignColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }]), + }, + { + value: '2', + label: '已分派', + columns: assignColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]), + }, + ], + }, + '2': { + workTotal: { + label: '待签收', + bgColor: '#E8FFEA', + value: 'waitSign', + img: tab2 + }, + tabList: [ + { + value: '1', + label: '待签收', + columns: signForColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => handleSign(record.caseId, record.ownerId)} style={{ cursor: 'pointer' }}>签收</div> + </Space> + ), + }]) + }, + { + value: '2', + label: '已签收', + columns: signForColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]) + }, + ], + }, + '3': { + workTotal: { + label: '待受理', + bgColor: '#F5E8FF', + value: 'waitAccept', + img: tab3 + }, + tabList: [ + { + value: '1', + label: '待受理', + columns: acceptColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>处理</div> + </Space> + ), + }]) + }, + { + value: '2', + label: '已受理', + columns: acceptColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + },]) + }, + ], + }, + '4': { + workTotal: { + label: '办理中', + bgColor: '#E6FFFB', + value: 'processing', + img: tab4 + }, + tabList: [ + { + value: '2', + label: '办理中', + columns: [ + { + title: '流转时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '已办天数', + dataIndex: 'processingDays', + key: 'processingDays', + width: 100, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 100, + }, + { + title: '事项来源', + dataIndex: 'caseSource', + key: 'caseSource', + width: 100, + }, + { + title: '事项类型', + dataIndex: 'caseType', + key: 'caseType', + width: 100, + }, + { + 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: 120, + fixed: 'right', + render: (text, record) => ( + <Space> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer', color: '#1A6FB8' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer', color: '#1A6FB8' }}>处理</div> + </Space> + ), + }, + ] + }, + { + value: '0', + label: '结案申请', + columns: [ + { + title: '结案申请时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 120, + }, + { + 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: 'mediResult', + key: 'mediResult', + width: 100, + }, + { + title: '申请方', + dataIndex: 'plaintiffs', + key: 'plaintiffs', + width: 180, + }, + { + title: '被申请方', + dataIndex: 'defendants', + key: 'defendants', + width: 180, + }, + { + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }, + ] + }, + { + value: '1', + label: '已结案', + columns: [ + { + title: '结案时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 180, + }, + { + title: '事项状态', + dataIndex: 'process', + key: 'process', + width: 120, + }, + { + title: '事项等级', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 120, + }, + { + 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: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }, + ] + }, + ], + }, + '5': { + workTotal: { + label: '待审核', + bgColor: '#E8F7FF', + value: 'waitReview', + img: tab5 + }, + tabList: [ + { + value: '0', + label: '待审核', + columnsMap: { + 1: backColumn.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>审核</div> + </Space> + ), + }]), + 2: upColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/eventFlow?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>审核</div> + </Space> + ), + }]), + 3: finishColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/closingReview?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>审核</div> + </Space> + ), + }]), + 4: jointColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 120, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + <div onClick={() => navigate(`/mediate/visit/handleFeedback?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>审核</div> + </Space> + ), + }]), + } + }, + { + value: '1', + label: '已审核', + columnsMap: { + 1: backColumn.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]), + 2: upColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]), + 3: finishColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]), + 4: jointColumns.concat([{ + title: '操作', + dataIndex: 'actions', + key: 'actions', + width: 80, + fixed: 'right', + render: (text, record) => ( + <Space style={{ color: '#1A6FB8' }}> + <div onClick={() => navigate(`/mediate/visit/fileMessage?caseTaskId=${record.ownerId}&caseId=${record.caseId}`)} style={{ cursor: 'pointer' }}>详情</div> + </Space> + ), + }]), + } + }, + ], + }, + '6': { + workTotal: { + label: '督办', + bgColor: '#FFF7E6', + value: 'supervise', + img: tab6 + }, + tabList: [ + { + value: '0', + label: '督办-未回复', + columns: [ + { + title: '督办时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '回复时限', + dataIndex: 'timeLimit', + key: 'timeLimit', + width: 190, + render: (text, record, index) => { + return getDiffTime(record.timeLimit) + } + }, + { + title: '督办部门', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 80, + }, + { + 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: 80, + fixed: 'right', + render: (text, record) => ( + <Space> + <div>回复</div> + </Space> + ), + }, + ] + }, + { + value: '1', + label: '督办-已回复', + columns: [ + { + title: '督办时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + title: '督办部门', + dataIndex: 'caseGrade', + key: 'caseGrade', + width: 80, + }, + { + title: '督办意见', + dataIndex: 'opinion', + key: 'opinion', + width: 180, + }, + { + title: '督办回复时间', + dataIndex: 'turnaroundTime', + key: 'turnaroundTime', + width: 150, + }, + { + 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: 80, + fixed: 'right', + render: (text, record) => ( + <Space> + <div>详情</div> + </Space> + ), + }, + ] + }, + ], + }, + } + + //响应式State + const [tabActivekey, setTabActivekey] = useState('1') + const [countData, setCountData] = useState({}) + const [tableTab, setTableTab] = useState(tabsMap['1'].tabList)//默认待分派 + const [tableData, setTableData] = useState([])//表格数据 + const [pageData, setPageData] = useState({//页脚数据 + page: 1, + size: 10, + }) + const [searchData, setSearchData] = useState({//查询有关数据 + status: '1', + sortType: 1, + sortColmn: 1, + }) + const [total, setTotal] = useState(0);//表格数据总数量 + const [loading, setLoading] = useState(false);//表格loading + const [selectedRowKeys, setSelectedRowKeys] = useState([]);//批量签收的id + const [selectedRows, setSelectedRows] = useState([]);//批量签收的数据 + + useEffect(() => { + getCountData(); + }, []) + + useEffect(() => { + getTableData(tabActivekey) + }, [searchData, pageData]) + + //批量选择 + const onSelectChange = (newSelectedRowKeys, selectedRows) => { + setSelectedRowKeys(newSelectedRowKeys); + setSelectedRows(selectedRows) + } + + //签收 + const handleSign = async (caseId, ownerId) => { + const res = await signApi([{ caseId: caseId, caseTaskId: ownerId }]) + if (res.type) { + $$.infoSuccess({ content: '签收成功' }); + getCountData(); + getTableData(tabActivekey) + navigate(`/mediate/visit/eventFlow?caseTaskId=${ownerId}&caseId=${caseId}`) + } + } + + //获取表格数据汇总 + const getTableData = async (type) => { + setLoading(true) + let res + switch (type) { + case '1'://待分派 + res = await pageMyTaskFpApi({ + ...pageData, + ...searchData + }) + break; + case '2'://待签收 + res = await pageMyTaskQsApi({ + ...pageData, + ...searchData + }) + break; + case '3'://待受理 + res = await pageMyTaskSlApi({ + ...pageData, + ...searchData + }) + break; + case '4'://办理中 + const { status, ...most } = searchData + if (status && status === '2') { + res = await pageMyTaskBlzApi({ + ...pageData, + ...most + }) + } else { + res = await pageMyTaskBlApi({ + ...pageData, + ...searchData + }) + } + break; + case '5'://待审核 + res = await pageMyTaskShApi({ + ...pageData, + ...searchData + }) + break; + case '6'://督办 + res = await pageMyTaskDbApi({ + ...pageData, + ...searchData + }) + break; + default: + break; + } + if (res.type) { + setLoading(false) + const { data } = res + setTableData(data?.content) + setTotal(data.totalElements) + } + } + + //改变tab + const handleColumnType = (type) => { + setSearchData({ + ...searchData, + status: type + }) + } + + //改变工作总览 + const tabActive = (key, data) => { + //默认第一个tab + if (key == '5') { + setSearchData({ + sortType: 1, + sortColmn: 1, + status: '0', + type: 1 + }) + } else if (key == '4' || key == '6') { + setSearchData({ + sortType: 1, + sortColmn: 1, + status: '2', + }) + } else { + setSearchData({ + sortType: 1, + sortColmn: 1, + status: '1', + }) + } + setTabActivekey(key); + setTableTab(data.tabList) + } + + //获取工作总览数据 + const getCountData = async () => { + const res = await getCountListApi() + if (res.type) { + const data = res.data || {}; + setCountData(data) + } + } + + //获取时间差,返回表格时限组件 + const getDiffTime = (timeLimit) => { + if (timeLimit) { + // 转换为Date对象 + let targetDate = new Date(timeLimit); + // 获取当前时间 + let now = new Date(); + // 计算时间差(毫秒) + let diff = Math.abs(targetDate - now); + // 将时间差转换为小时和分钟 + let hours = Math.floor(diff / (1000 * 60 * 60)); + let minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60)); + // 比较两个时间 + if (targetDate.getTime() <= now.getTime()) { + return <> + <span className='timeTip-red'> + <span className='timeTip-red-drop'></span>{`超${hours}小时${minutes}分钟`} + </span> + <span className='timeTip-red-tips'>督</span> + </> + } else { + return <span className='timeTip-green'><span className='timeTip-green-drop'></span>{`剩${hours}小时${minutes}分钟`}</span> + } + } else { + return <span>-</span> + } + } + + //查询 + const handleSubmit = () => { + const data = formRef.current.getFieldsValue(); + const { time, ...rest } = data + setSearchData({ + ...searchData, + timeStart: time ? time[0] : '', + timeEnd: time ? time[1] : '', + ...rest + }) + } + + //批量签收 + const handleBatchQs = () => { + console.log(selectedRows); + const paramsList = selectedRows.map(item => { + return { + caseId: item.caseId, + caseTaskId: item.ownerId + } + }) + Modal.confirm({ + title: '签收确认', + content: '确认批量签收?', + onOk: async () => { + const res = await signApi(paramsList) + if (res.type) { + $$.infoSuccess({ content: '批量签收成功成功!' }); + getCountData(); + getTableData(tabActivekey) + } + }, + }); + } + + const rowSelection = { + selectedRowKeys: selectedRowKeys, + onChange: onSelectChange, + } + return ( - <div className='VisitWorkBench'> + <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 }}> + Object.keys(tabsMap).map(key => ( + <div + key={key} + className='VisitWorkBench-top-list-tabsItem' + style={{ backgroundColor: tabsMap[key].workTotal.bgColor }} + onClick={() => tabActive(key, tabsMap[key])} + > <div> - <div>{item.label}</div> - <div>{item.num}件</div> + <div>{tabsMap[key].workTotal.label}</div> + <span className='VisitWorkBench-top-list-tabsItem-title'> + {countData[tabsMap[key].workTotal.value] || 0} + </span>件 </div> <div> - <img src={item.img} alt=''/> + <img src={tabsMap[key].workTotal.img} alt='' className='VisitWorkBench-top-list-tabsItem-imgView' /> </div> </div> )) } </div> </div> - <div className='VisitWorkBench-middle'> - 222 + <div + className='VisitWorkBench-middle' + onKeyUp={(e) => { + if (e.key === 'Enter') { + handleSubmit() + } + }} + > + <Tabs + activeTab={searchData.status} + onChange={handleColumnType} + destroyOnHide + > + {tableTab?.map(item => { + return <TabPane + key={item.value} + title={ + <span style={{ fontSize: '15px' }}> + {item.label} + </span> + } + > + <Typography.Paragraph key={item.value}> + {tabActivekey == '5' && + <Radio.Group + type='button' + value={searchData.type} + onChange={(value) => { + setSearchData({ + ...searchData, + type: value + }) + }} + style={{ marginBottom: 16 }} + options={[{ + label: '回退审核', + value: 1 + }, { + label: '上报审核', + value: 2 + }, { + label: '结案申请审核', + value: 3 + }, { + label: '联合处置审核', + value: 4 + }]} + /> + } + <TableView + rowSelection={tabActivekey == '2' && item.value === '1' ? rowSelection : null} + columns={tabActivekey == '5' ? item.columnsMap[searchData.type] : item.columns} + dataSource={tableData} + size="small" + rowKey="caseId" + bordered={true} + isScroll={true}//兼容以前的,当需要表格竖向滚动,请设置这个 + scroll={{ + x: 1300 + }} + offsetHeight={161} + loading={loading} + pagination={{ + current: pageData.page, + pageSize: pageData.size, + total: total, + onChange: (page, pageSize) => { + setPageData({ + ...pageData, + page, + pageSize + }) + }, + }} + /> + </Typography.Paragraph> + { + (tabActivekey == '2' && item.value === '1') && <div className='VisitWorkBench-middle-select'> + <span>已选{selectedRowKeys.length}项</span> + <span className='linkBtnColor' onClick={() => { + setSelectedRowKeys([]) + setSelectedRows([]) + }}>取消</span> + <span className='linkBtnColor' onClick={handleBatchQs}>批量签收</span> + </div> + } + </TabPane> + })} + </Tabs> + <div className='VisitWorkBench-middle-search'> + <Form + ref={formRef} + layout="vertical" + > + <div style={{ display: 'flex' }}> + <FormItem + label=' ' + field='time' + > + <RangePicker + style={{ width: '100%' }} + format='YYYY-MM-DD HH:mm' + showTime={true} + /> + </FormItem> + <FormItem + label=' ' + field='partyName' + > + <Input + allowClear + placeholder='查询申请方/被申请方关键词' + /> + </FormItem> + <Button + type="primary" + className="dialogPrimary" + onClick={handleSubmit} + > + 查询 + </Button> + </div> + </Form> + </div> </div> <div className='VisitWorkBench-bottom'> - 333333 + 群众来访接待 + <div style={{ display: 'flex', justifyContent: 'space-evenly', gap: '24px', marginTop: '16px' }}> + <div className='bottomTab1' onClick={() => navigate(`/mediate/visit`)}> + <div className='VisitWorkBench-bottom-title' 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