From bd4e6eb3d29de84c00f5e448f5839300873a6abe Mon Sep 17 00:00:00 2001
From: liuwh <964324856@qq.com>
Date: Sat, 21 Jun 2025 16:17:30 +0800
Subject: [PATCH] fix:优化统计功能
---
src/views/workDash/index.jsx | 497 +++++++++++++++++++++++++++++++-----------------------
1 files changed, 286 insertions(+), 211 deletions(-)
diff --git a/src/views/workDash/index.jsx b/src/views/workDash/index.jsx
index ae0547c..f2da821 100644
--- a/src/views/workDash/index.jsx
+++ b/src/views/workDash/index.jsx
@@ -2,7 +2,7 @@
* @Company: hugeInfo
* @Author: lwh
* @Date: 2024-09-14 15:59:17
- * @LastEditTime: 2025-05-09 14:20:13
+ * @LastEditTime: 2025-06-21 11:32:31
* @LastEditors: lwh
* @Version: 1.0.0
* @Description:
@@ -40,6 +40,10 @@
workDash_24,
workDash_25,
workDash_26,
+ workDash_27,
+ workDash_28,
+ workDash_29,
+ workDash_30,
} from '../../assets/images';
import NewPage from '../../components/NewPage/index';
import * as echarts from 'echarts';
@@ -376,6 +380,14 @@
getListData({ ...search, canal: '22_00001-3' }, listDataSearch);
} else if (activeKey === '5') {
getListData({ ...search, canal: '22_00001-4' }, listDataSearch);
+ } else if (activeKey === '6') {
+ getListData({ ...search, canal: '22_00001-3', canalSecond: '22_00003-8' }, listDataSearch);
+ } else if (activeKey === '7') {
+ getListData({ ...search, canal: '22_00001-3', canalSecond: '22_00003-2' }, listDataSearch);
+ } else if (activeKey === '8') {
+ getListData({ ...search, canal: '22_00001-4', canalSecond: '22_00003-1' }, listDataSearch);
+ } else if (activeKey === '9') {
+ getListData({ ...search, canal: '22_00001-4', canalSecond: '22_00003-7' }, listDataSearch);
}
}
}
@@ -783,6 +795,14 @@
return '自行排查';
case '5':
return '协同推送';
+ case '6':
+ return '部门排查';
+ case '7':
+ return '网格排查';
+ case '8':
+ return '非警务纠纷';
+ case '9':
+ return '专项纠纷';
default:
break;
}
@@ -1083,7 +1103,7 @@
{tabKey === '4' && (
<Button
className="source-button source-button-color"
- icon={<img className="source-icon" src={workDash_22} alt="" srcset="" />}
+ icon={<img className="source-icon" src={workDash_29} alt="" srcset="" />}
type="secondary"
>
自行排查
@@ -1097,6 +1117,94 @@
>
协同推送
</Button>
+ )}
+ {tabKey === '6' && (
+ <Space>
+ <Button
+ onClick={() => {
+ tabsOnchange('4');
+ }}
+ className="source-button"
+ icon={<img className="source-icon" src={workDash_28} alt="" srcset="" />}
+ type="secondary"
+ >
+ 自行排查
+ </Button>
+ <IconCaretRight />
+ <Button
+ className="source-button source-button-color"
+ icon={<img className="source-icon" src={workDash_23} alt="" srcset="" />}
+ type="secondary"
+ >
+ 部门排查
+ </Button>
+ </Space>
+ )}
+ {tabKey === '7' && (
+ <Space>
+ <Button
+ onClick={() => {
+ tabsOnchange('4');
+ }}
+ className="source-button"
+ icon={<img className="source-icon" src={workDash_28} alt="" srcset="" />}
+ type="secondary"
+ >
+ 自行排查
+ </Button>
+ <IconCaretRight />
+ <Button
+ className="source-button source-button-color"
+ icon={<img className="source-icon" src={workDash_23} alt="" srcset="" />}
+ type="secondary"
+ >
+ 网格排查
+ </Button>
+ </Space>
+ )}
+ {tabKey === '8' && (
+ <Space>
+ <Button
+ onClick={() => {
+ tabsOnchange('5');
+ }}
+ className="source-button"
+ icon={<img className="source-icon" src={workDash_27} alt="" srcset="" />}
+ type="secondary"
+ >
+ 协同推送
+ </Button>
+ <IconCaretRight />
+ <Button
+ className="source-button1 source-button-color"
+ icon={<img className="source-icon" src={workDash_30} alt="" srcset="" />}
+ type="secondary"
+ >
+ 非警务纠纷
+ </Button>
+ </Space>
+ )}
+ {tabKey === '9' && (
+ <Space>
+ <Button
+ onClick={() => {
+ tabsOnchange('5');
+ }}
+ className="source-button"
+ icon={<img className="source-icon" src={workDash_27} alt="" srcset="" />}
+ type="secondary"
+ >
+ 协同推送
+ </Button>
+ <IconCaretRight />
+ <Button
+ className="source-button source-button-color"
+ icon={<img className="source-icon" src={workDash_23} alt="" srcset="" />}
+ type="secondary"
+ >
+ 专项纠纷
+ </Button>
+ </Space>
)}
</div>
)}
@@ -1122,7 +1230,7 @@
/>
<div style={{ borderBottom: '1px solid #E5E6EB', position: 'absolute', width: '100%' }}></div> */}
<div style={{ marginTop: '16px' }} className="disputeLedger-row">
- <div className="comprehensive-title">数据总览</div>
+ <div className="comprehensive-title">数据总览{tabKey !== '1' && `（${tabKeyTitles(tabKey)}）`}</div>
<div>
<Space className="workDash-d" align="center" split={<Divider type="vertical" style={{ height: '48px' }} />}>
<div
@@ -1134,10 +1242,154 @@
<div className="workDash-item-img">
<img src={workDash_1} alt="" srcset="" />
</div>
- <div className="workDash-item-div">
- <div className="workDash-item-title">总登记</div>
- <div className="workDash-item-value">{data?.totalNum || 0}</div>
- </div>
+ {['1', '2', '3', '6', '7', '8', '9'].includes(tabKey) && (
+ <div className="workDash-item-div">
+ <div className="workDash-item-title">总登记</div>
+ <div className="workDash-item-value">{data?.totalNum || 0}</div>
+ </div>
+ )}
+ {tabKey === '4' && (
+ <div className="workDash-item-div">
+ <div className="workDash-item-title">
+ <div style={{ width: '50px' }}>总登记</div>
+ <div style={{ width: '36px' }}></div>{' '}
+ <Space split={<Divider type="vertical" />}>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <span className="workDash-item-title-blue"></span>
+ <span
+ style={{
+ color: '#4E5969',
+ fontSize: '14px',
+ display: 'flex',
+ alignItems: 'center',
+ display: 'inline-block',
+ width: '150px',
+ }}
+ >
+ 部门排查：{data?.bmpcNum || 0}件
+ </span>
+ <span
+ onClick={() => {
+ tabsOnchange('6');
+ }}
+ style={{
+ color: '#1A6FB8',
+ border: '1px solid #1A6FB8',
+ fontSize: '12px',
+ borderRadius: '2px',
+ padding: '0px 4px',
+ display: 'flex',
+ alignItems: 'center',
+ marginLeft: '12px',
+ }}
+ >
+ 查看
+ </span>
+ </div>
+ </Space>
+ </div>
+ <div className="workDash-item-value" style={{ marginTop: '4px' }}>
+ <div style={{ width: '50px' }}>{data?.totalNum || 0}</div>
+ <div style={{ width: '36px' }}></div>
+ <Space split={<Divider type="vertical" />}>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <span className="workDash-item-title-blue"></span>
+ <span style={{ color: '#4E5969', fontSize: '14px', display: 'inline-block', width: '150px' }}>
+ 网格排查：{data?.wgpcNum || 0}件
+ </span>
+ <span
+ onClick={() => {
+ tabsOnchange('7');
+ }}
+ style={{
+ color: '#1A6FB8',
+ border: '1px solid #1A6FB8',
+ fontSize: '12px',
+ borderRadius: '2px',
+ padding: '0px 4px',
+ display: 'flex',
+ alignItems: 'center',
+ marginLeft: '12px',
+ }}
+ >
+ 查看
+ </span>
+ </div>
+ </Space>
+ </div>
+ </div>
+ )}
+ {tabKey === '5' && (
+ <div className="workDash-item-div">
+ <div className="workDash-item-title">
+ <div style={{ width: '50px' }}>总登记</div>
+ <div style={{ width: '36px' }}></div>{' '}
+ <Space split={<Divider type="vertical" />}>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <span className="workDash-item-title-blue"></span>
+ <span
+ style={{
+ color: '#4E5969',
+ fontSize: '14px',
+ display: 'flex',
+ alignItems: 'center',
+ display: 'inline-block',
+ width: '150px',
+ }}
+ >
+ 非警务纠纷：{data?.fjwjfNum || 0}件
+ </span>
+ <span
+ onClick={() => {
+ tabsOnchange('8');
+ }}
+ style={{
+ color: '#1A6FB8',
+ border: '1px solid #1A6FB8',
+ fontSize: '12px',
+ borderRadius: '2px',
+ padding: '0px 4px',
+ display: 'flex',
+ alignItems: 'center',
+ marginLeft: '12px',
+ }}
+ >
+ 查看
+ </span>
+ </div>
+ </Space>
+ </div>
+ <div className="workDash-item-value" style={{ marginTop: '4px' }}>
+ <div style={{ width: '50px' }}>{data?.totalNum || 0}</div>
+ <div style={{ width: '36px' }}></div>
+ <Space split={<Divider type="vertical" />}>
+ <div style={{ display: 'flex', alignItems: 'center' }}>
+ <span className="workDash-item-title-blue"></span>
+ <span style={{ color: '#4E5969', fontSize: '14px', display: 'inline-block', width: '150px' }}>
+ 专项纠纷：{data?.zxjfNum || 0}件
+ </span>
+ <span
+ onClick={() => {
+ tabsOnchange('9');
+ }}
+ style={{
+ color: '#1A6FB8',
+ border: '1px solid #1A6FB8',
+ fontSize: '12px',
+ borderRadius: '2px',
+ padding: '0px 4px',
+ display: 'flex',
+ alignItems: 'center',
+ marginLeft: '12px',
+ }}
+ >
+ 查看
+ </span>
+ </div>
+ </Space>
+ </div>
+ </div>
+ )}
</div>
<div
onClick={() => {
@@ -1170,14 +1422,15 @@
<div style={{ display: 'flex', alignItems: 'center' }}>
<span className="workDash-item-title-green"></span>
<span style={{ color: '#4E5969', fontSize: '14px', display: 'flex', alignItems: 'center' }}>
- 化解成功：{data?.finishNum || 0}件 | 成功率：<span style={{ color: '#00B42A' }}>{((data?.finishNum*100)/(data?.finishNum+data?.failNum) || 0).toFixed(2)}%</span>
+ 化解成功：{data?.finishNum || 0}件 | 成功率：
+ <span style={{ color: '#00B42A' }}>{((data?.finishNum * 100) / (data?.finishNum + data?.failNum) || 0).toFixed(2)}%</span>
<img style={{ width: '14px', height: '14px', marginLeft: '8px' }} src={workDash_5} alt="" srcset="" />
</span>
</div>
</Space>
</div>
<div className="workDash-item-value">
- <div style={{ width: '50px' }}>{data?.finishNum+data?.failNum || 0}</div>
+ <div style={{ width: '50px' }}>{data?.finishNum + data?.failNum || 0}</div>
<div style={{ width: '36px' }}></div>
<Space split={<Divider type="vertical" />}>
<div>
@@ -1218,13 +1471,13 @@
</div>
<div className="workDash-main-card-one">
<div className="workDash-main-card">
- <div className="workDash-main-card-head">
- <div
- className="workDash-main-card-head-l"
- onClick={() => {
- tabsOnchange('2');
- }}
- >
+ <div
+ className="workDash-main-card-head"
+ onClick={() => {
+ tabsOnchange('2');
+ }}
+ >
+ <div className="workDash-main-card-head-l">
<div className="workDash-main-card-head-l-img">
<img src={workDash_6} alt="" srcset="" />
</div>
@@ -1267,13 +1520,13 @@
</div>
<div className="workDash-main-card">
- <div className="workDash-main-card-head">
- <div
- className="workDash-main-card-head-l workDash-bg_2"
- onClick={() => {
- tabsOnchange('3');
- }}
- >
+ <div
+ className="workDash-main-card-head"
+ onClick={() => {
+ tabsOnchange('3');
+ }}
+ >
+ <div className="workDash-main-card-head-l workDash-bg_2">
<div className="workDash-main-card-head-l-img workDash-bg_2_img">
<img src={workDash_7} alt="" srcset="" />
</div>
@@ -1316,17 +1569,14 @@
</div>
<div className="workDash-main-card">
- <div className="workDash-main-card-head">
+ <div className="workDash-main-card-head" onClick={() => {
+ tabsOnchange('4');
+ }}>
<div className="workDash-main-card-head-l workDash-bg_3">
<div className="workDash-main-card-head-l-img workDash-bg_3_img">
<img src={workDash_8} alt="" srcset="" />
</div>
- <div
- className="workDash-main-card-head-l-img-title"
- onClick={() => {
- tabsOnchange('4');
- }}
- >
+ <div className="workDash-main-card-head-l-img-title">
详情
</div>
</div>
@@ -1367,13 +1617,10 @@
</div>
<div className="workDash-main-card">
- <div className="workDash-main-card-head">
- <div
- className="workDash-main-card-head-l workDash-bg_4"
- onClick={() => {
+ <div className="workDash-main-card-head" onClick={() => {
tabsOnchange('5');
- }}
- >
+ }}>
+ <div className="workDash-main-card-head-l workDash-bg_4">
<div className="workDash-main-card-head-l-img workDash-bg_4_img">
<img src={workDash_9} alt="" srcset="" />
</div>
@@ -1527,178 +1774,6 @@
</div>
)}
- {/* 公安非警务，12345，网格化 */}
- {tabKey === '5' && (
- <div style={{ marginTop: '12px' }}>
- <Row gutter={16}>
- {/* 公安非警务 */}
- <Col span={8}>
- <div className="workDash-public">
- <div className="workDash-public-head">
- <div className="workDash-public-head-l">
- <div className="workDash-public-head-l-img">
- <img src={workDash_24} alt="" srcset="" />
- </div>
- </div>
- <div className="workDash-public-head-r">
- <div className="workDash-public-head-r-title">公安非警务</div>
- <div className="workDash-public-head-r-value">
- <div className="workDash-public-head-r-value-num">
- {data?.oneSecondSource?.caseNum || 0}条 <span className="workDash-public-head-r-value-unit">（工单总数）</span>
- </div>
- </div>
- </div>
- </div>
- <div className="workDash-public-body">
- <Row gutter={[12, 8]}>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解中</div>
- <div className="workDash-public-body-item-value">{data?.oneSecondSource?.resolveingNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">回退</div>
- <div className="workDash-public-body-item-value">{data?.oneSecondSource?.rejectNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功</div>
- <div className="workDash-public-body-item-value">{data?.oneSecondSource?.resolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解不成功</div>
- <div className="workDash-public-body-item-value">{data?.oneSecondSource?.unResolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功率</div>
- <div className="workDash-public-body-item-value">{data?.oneSecondSource?.resolveRate || 0}%</div>
- </div>
- </Col>
- </Row>
- </div>
- </div>
- </Col>
-
- {/* 12345 */}
- <Col span={8}>
- <div className="workDash-public">
- <div className="workDash-public-head">
- <div className="workDash-public-head-l">
- <div className="workDash-public-head-l-img workDash-public-head-l-img-green">
- <img src={workDash_25} alt="" srcset="" />
- </div>
- </div>
- <div className="workDash-public-head-r">
- <div className="workDash-public-head-r-title">12345</div>
- <div className="workDash-public-head-r-value">
- <div className="workDash-public-head-r-value-num">
- {data?.twoSecondSource?.caseNum || 0}条 <span className="workDash-public-head-r-value-unit">（工单总数）</span>
- </div>
- </div>
- </div>
- </div>
- <div className="workDash-public-body">
- <Row gutter={[12, 8]}>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解中</div>
- <div className="workDash-public-body-item-value">{data?.twoSecondSource?.resolveingNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">不予受理</div>
- <div className="workDash-public-body-item-value">{data?.twoSecondSource?.rejectNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功</div>
- <div className="workDash-public-body-item-value">{data?.twoSecondSource?.resolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解不成功</div>
- <div className="workDash-public-body-item-value">{data?.twoSecondSource?.unResolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功率</div>
- <div className="workDash-public-body-item-value">{data?.twoSecondSource?.resolveRate || 0}%</div>
- </div>
- </Col>
- </Row>
- </div>
- </div>
- </Col>
-
- {/* 网格化 */}
- <Col span={8}>
- <div className="workDash-public">
- <div className="workDash-public-head">
- <div className="workDash-public-head-l">
- <div className="workDash-public-head-l-img workDash-public-head-l-img-blue">
- <img src={workDash_26} alt="" srcset="" />
- </div>
- </div>
- <div className="workDash-public-head-r">
- <div className="workDash-public-head-r-title">网格化</div>
- <div className="workDash-public-head-r-value">
- <div className="workDash-public-head-r-value-num">
- {data?.threeSecondSource?.caseNum || 0}条 <span className="workDash-public-head-r-value-unit">（工单总数）</span>
- </div>
- </div>
- </div>
- </div>
- <div className="workDash-public-body">
- <Row gutter={[12, 8]}>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解中</div>
- <div className="workDash-public-body-item-value">{data?.threeSecondSource?.resolveingNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">不予受理</div>
- <div className="workDash-public-body-item-value">{data?.threeSecondSource?.rejectNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功</div>
- <div className="workDash-public-body-item-value">{data?.threeSecondSource?.resolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解不成功</div>
- <div className="workDash-public-body-item-value">{data?.threeSecondSource?.unResolveNum || 0}条</div>
- </div>
- </Col>
- <Col span={12}>
- <div className="workDash-public-body-item">
- <div className="workDash-public-body-item-title">化解成功率</div>
- <div className="workDash-public-body-item-value">{data?.threeSecondSource?.resolveRate || 0}%</div>
- </div>
- </Col>
- </Row>
- </div>
- </div>
- </Col>
- </Row>
- </div>
- )}
-
{/* 纠纷类型 化解状况 事项等级 */}
{tabKey !== '1' && (
<div style={{ marginTop: '12px', width: '100%' }}>
@@ -1813,7 +1888,7 @@
style={{ position: 'absolute', zIndex: '1000', alignItems: 'center', justifyContent: 'space-between', width: '100%' }}
className="big-green-main-title-display"
>
- <div className="disputeLedger-green-title">化解统计</div>
+ <div className="disputeLedger-green-title">化解统计{tabKey !== '1' && `（${tabKeyTitles(tabKey)}）`}</div>
<div style={{ paddingRight: '24px' }}>
<Select
style={{ width: '180px' }}
@@ -1833,7 +1908,7 @@
</Option>
))}
</Select>
- <Button type="outline" onClick={downloadAreaXls}>
+ <Button style={{ marginLeft: '12px' }} type="outline" onClick={downloadAreaXls}>
导出
</Button>
</div>
@@ -1998,7 +2073,7 @@
<div className="workDash-main-flex_1" style={{ marginBottom: '12px' }}>
<div className="big-green-main-title-display-table">
<div className="disputeLedger-green-title" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
- <div>实时动态</div>
+ <div>实时动态{tabKey !== '1' && `（${tabKeyTitles(tabKey)}）`}</div>
{/* 导出 */}
<Button type="outline" onClick={downloadXls}>
导出
--
Gitblit v1.8.0