广州市综治平台前端
liuwh
5 days ago bd4e6eb3d29de84c00f5e448f5839300873a6abe
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;
      }
@@ -1024,6 +1044,7 @@
                        placeholder: '请选择',
                        label: '配合部门',
                     },
                     { type: 'Select', name: 'systemSource', label: '系统来源', placeholder: '请选择', span: 8, selectdata: $$.options.systemSource },
                  ]}
                  handleReset={() => {
                     form.resetFields();
@@ -1082,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"
                     >
                        自行排查
@@ -1096,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>
            )}
@@ -1121,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
@@ -1133,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={() => {
@@ -1169,19 +1422,20 @@
                                 <div style={{ display: 'flex', alignItems: 'center' }}>
                                    <span className="workDash-item-title-green"></span>
                                    <span style={{ color: '#4E5969', fontSize: '14px', display: 'flex', alignItems: 'center' }}>
                                       化解成功:{data?.resolveNum || 0}件 | 成功率:<span style={{ color: '#00B42A' }}>{data?.resolveRate || '0'}%</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 || 0}</div>
                              <div style={{ width: '50px' }}>{data?.finishNum + data?.failNum || 0}</div>
                              <div style={{ width: '36px' }}></div>
                              <Space split={<Divider type="vertical" />}>
                                 <div>
                                    <span className="workDash-item-title-red"></span>
                                    <span style={{ color: '#4E5969', fontSize: '14px' }}>化解不成功:{data?.unResolveNum || 0}件</span>
                                    <span style={{ color: '#4E5969', fontSize: '14px' }}>化解不成功:{data?.failNum || 0}件</span>
                                 </div>
                              </Space>
                           </div>
@@ -1217,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>
@@ -1266,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>
@@ -1315,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>
@@ -1366,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>
@@ -1526,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%' }}>
@@ -1812,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' }}
@@ -1832,7 +1908,7 @@
                              </Option>
                           ))}
                        </Select>
                        <Button type="outline" onClick={downloadAreaXls}>
                        <Button style={{ marginLeft: '12px' }} type="outline" onClick={downloadAreaXls}>
                           导出
                        </Button>
                     </div>
@@ -1997,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}>
                           导出