广州市综治平台前端
xusd
4 days ago 252aa74034db281a07c9fe9df5000cc07ffe4950
fix:修改解纷态势逻辑
1 files modified
232 ■■■■■ changed files
src/views/disputeLedger/index.jsx 232 ●●●●● patch | view | raw | blame | history
src/views/disputeLedger/index.jsx
@@ -9,7 +9,7 @@
 */
import React, { useState, useEffect, useRef, useMemo } from 'react';
import * as $$ from '../../utils/utility';
import { Form, Typography, Row, Col, Space } from 'antd';
import { Form, Typography, Row, Col, Space, Button } from 'antd';
import { useLocation, useNavigate, useSearchParams } from 'react-router-dom';
import { IconUndo } from '@arco-design/web-react/icon';
import {
@@ -28,9 +28,18 @@
    disputeLedger_13,
    disputeLedger_14,
} from '../../assets/images';
import {
    workDash_13,
    workDash_14,
    workDash_16,
    workDash_17,
    workDash_18,
} from '../../assets/images';
import NewPage from '../../components/NewPage/index';
import * as echarts from 'echarts';
import NewTableSearch from '../../components/NewTableSearch';
import TableView from '../../components/TableView';
import MyTabsNew from '../../components/MyTabsNew';
import './index.less';
const { Link } = Typography;
@@ -48,6 +57,11 @@
//
function ledgerCountApi(submitData) {
    return $$.ax.request({ url: 'caseInfo/ledgerCount', type: 'get', data: submitData, service: 'mediate' });
}
// 获取实时动态数据
function getCaseInfoDataApi(submitData) {
    return $$.ax.request({ url: 'caseInfo/pageQueryAll', type: 'get', data: submitData, service: 'mediate' });
}
// 区域字典值
@@ -93,6 +107,11 @@
    const [allData, setAllData] = useState({});
    // 实时动态相关状态
    const [listData, setListData] = useState({ tableData: [] }); //实时动态数据表
    const [listDataSearch, setListDataSearch] = useState({ page: 1, size: 10, sortColmn: '1', sortType: '2' }); //实时动态数据表
    const [tabKey, setTabKey] = useState('1'); // tab切换
    // 搜索 or 重置
    function handleSearch(type, session) {
        if (type === 'reset') {
@@ -113,6 +132,13 @@
                    },
                    activeKey
                );
                // 更新实时动态数据
                getCaseInfoData({
                    [session.key]: session.value[0],
                    createStart: $$.dateFormat(session.createStart),
                    createEnd: $$.dateFormat(session.createEnd),
                    ...listDataSearch
                });
            } else {
                getListData(
                    {
@@ -130,6 +156,13 @@
                    },
                    activeKey
                );
                // 更新实时动态数据
                getCaseInfoData({
                    [normalSearch.key]: normalSearch.value[0],
                    createStart: $$.dateFormat(normalSearch.createStart),
                    createEnd: $$.dateFormat(normalSearch.createEnd),
                    ...listDataSearch
                });
            }
            return;
        }
@@ -141,6 +174,8 @@
            $$.searchCascader(values, 'caseType', 1, ['caseType', 'caseType']);
            getListData({ ...values }, session);
            ledgerCount({ ...values }, session);
            // 更新实时动态数据
            getCaseInfoData({ ...values, ...listDataSearch });
            return;
        }
    }
@@ -149,6 +184,15 @@
    async function getListData(submitData, ledgerType) {
        global.setSpinning(true);
        const res = await getListDataApi({ ...submitData, ledgerType });
        if (ledgerType === 0 || ledgerType === 1) {
            const res1 = await getCaseInfoDataApi({ ...submitData, ...listDataSearch }); //获取实时动态数据
            if (res1.type) {
                setListData({
                    total: res1?.data?.totalElements || 0,
                    tableData: res1?.data?.content || [],
                });
            }
        }
        global.setSpinning(false);
        if (res.type) {
            let nowData = res.data || {};
@@ -156,6 +200,7 @@
            // !allData.hasOwnProperty('sysNum') && ledgerCount(submitData, ledgerType);
            // setSearch(submitData);
        }
    }
    // 饼图点击进入下一层级
@@ -220,8 +265,142 @@
        }
    }
    // 实时动态相关函数
    const columns = () => {
        const columnsData = [
            {
                title: '登记时间',
                width: 120,
                dataIndex: 'createTime',
                render: (text, record, index) => {
                    return (
                        <div style={{ display: 'flex', gap: '8px' }}>
                            <div>{$$.dateFormat(text)}</div>
                            {record?.isRisk === '1' && <div className="public-tag public-tag-tagRed">扬言</div>}
                        </div>
                    );
                },
            },
            { title: '事项来源', width: 100, dataIndex: 'canalName' },
            { title: '事项状态', width: 100, dataIndex: 'statusName' },
            { title: '事项等级', width: 80, dataIndex: 'caseLevel' },
            { title: '事项类型', width: 150, dataIndex: 'caseTypeName' },
            { title: '问题属地', width: 170, dataIndex: 'areaName' },
            { title: '登记机构', width: 130, dataIndex: 'inputUnitName' },
            { title: '承办部门', width: 100, dataIndex: 'mediateUnitName' },
            { title: '办结时间', width: 100, dataIndex: 'closeTime', render: (text) => <span>{$$.dateFormat(text)}</span> },
            {
                title: '化解结果',
                width: 80,
                dataIndex: 'mediResult',
                render: (text) => (
                    <div className={text === '22_00025-1' ? 'comprehensive-green' : text === '22_00025-2' ? 'comprehensive-red' : '-'}>
                        {text === '22_00025-1' ? '化解成功' : text === '22_00025-2' ? '化解不成功' : '-'}
                    </div>
                ),
            },
            {
                title: '操作',
                dataIndex: 'action',
                width: 50,
                render: (_, record) => {
                    return <Link onClick={() => handleJump(record)}>详情</Link>;
                },
            },
        ];
        return columnsData;
    };
    // 跳转详情页
    function handleJump(record) {
        // 仅在gz/index.html路径下生效
        const newWindow = window.open(`${$$.windowUrl}/windowDetail?caseTaskId=${record.caseTaskId}&caseId=${record.id}`);
    }
    // tab标题映射
    function tabKeyTitles(type) {
        switch (type) {
            case '2':
                return '大厅来访';
            case '3':
                return '线上来访';
            case '4':
                return '自行排查';
            case '5':
                return '协同推送';
            case '6':
                return '部门排查';
            case '7':
                return '网格排查';
            case '8':
                return '非警务纠纷';
            case '9':
                return '专项治理';
            default:
                break;
        }
    }
    // 切换tabs页
    function tabsOnchange(activeKey) {
        console.log(activeKey);
        setTabKey(activeKey);
        if (activeKey !== tabKey) {
            if (activeKey === '1') {
                delete normalSearch.canal;
                getCaseInfoData({ ...normalSearch, ...listDataSearch });
            } else if (activeKey === '2') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-1', ...listDataSearch });
            } else if (activeKey === '3') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-2', ...listDataSearch });
            } else if (activeKey === '4') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-3', ...listDataSearch });
            } else if (activeKey === '5') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-4', ...listDataSearch });
            } else if (activeKey === '6') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-3', canalSecond: '22_00003-8', ...listDataSearch });
            } else if (activeKey === '7') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-3', canalSecond: '22_00003-2', ...listDataSearch });
            } else if (activeKey === '8') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-4', canalSecond: '22_00003-1', ...listDataSearch });
            } else if (activeKey === '9') {
                getCaseInfoData({ ...normalSearch, canal: '22_00001-4', canalSecond: '22_00003-7', ...listDataSearch });
            }
        }
    }
    // 页码修改
    function handleChangePage(page, pageSize) {
        let paramsObj = Object.assign({ ...normalSearch, ...listDataSearch }, { page, size: pageSize });
        getCaseInfoData({ ...paramsObj });
    }
    // 获取实时动态数据
    async function getCaseInfoData(submitData) {
        global.setSpinning(true);
        const res = await getCaseInfoDataApi({ ...submitData });
        global.setSpinning(false);
        setListDataSearch({ ...listDataSearch, page: submitData.page, size: submitData.size });
        if (res.type) {
            setListData({
                total: res?.data?.totalElements || 0,
                tableData: res?.data?.content || [],
            });
        }
    }
    // 导出数据
    function downloadXls() {
        const keysToFilter = ['page', 'size'];
        const filteredObj = Object.fromEntries(Object.entries(normalSearch).filter(([key, value]) => value !== undefined && !keysToFilter.includes(key)));
        window.open(`${$$.appUrl.baseUrl}/${$$.appUrl.mediate}/api/web/caseInfo/exportQueryAll?${$$.useQueryParams(filteredObj)}`);
    }
    useEffect(() => {
        treeByUserId();
        // 初始化时获取实时动态数据
        getCaseInfoData({ ...listDataSearch });
    }, []);
    return (
@@ -378,10 +557,28 @@
                                onClick={() => {
                                    setActiveKey(index);
                                    setActiveName(item.title);
                                    if (index === 0) {
                                        handleSearch('search', '');
                                    if (index === 0 || index === 1) {
                                        // 全部和本系统:重新查询数据
                                        if (index === 0) {
                                            handleSearch('search', '');
                                        } else {
                                            handleSearch('search', index);
                                        }
                                    } else {
                                        handleSearch('search', index);
                                        // 12345热线处置的矛盾及其后面的tab:更新统计数据,清空实时动态数据
                                        let values = form.getFieldsValue();
                                        $$.changeTimNeweFormat(values, 'createTime', 'createStart', 'createEnd');
                                        $$.changeTimNeweFormat(values, 'endTime', 'closeStart', 'closeEnd');
                                        $$.searchCascader(values, 'queCode', normalSearch.level, ['queCity', 'queArea', 'queRoad', 'queVillage']);
                                        $$.searchCascader(values, 'caseType', 1, ['caseType', 'caseType']);
                                        // 更新统计图表数据
                                        getListData({ ...values }, index);
                                        ledgerCount({ ...values }, index);
                                        // 清空实时动态数据
                                        setListData({ tableData: [] });
                                        setListDataSearch({ page: 1, size: 10, sortColmn: '1', sortType: '2' });
                                    }
                                }}
                                className={`disputeLedger-card ${activeKey === index ? 'disputeLedger-card-active' : ''}`}
@@ -493,6 +690,33 @@
                        </div>
                    </Space>
                </div>
                {/* 实时动态 */}
                <div style={{ marginTop: '-10px' }}>
                    <div className="workDash-main-flex_1">
                        <div className="big-green-main-title-display-table">
                            <div className="disputeLedger-green-title" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}>
                                <div>实时动态{tabKey !== '1' && `(${tabKeyTitles(tabKey)})`}</div>
                            </div>
                            <div style={{ padding: '4px 16px 16px' }}>
                                <div className="workDash-table">
                                    <TableView
                                        title=""
                                        columns={columns()}
                                        dataSource={listData.tableData}
                                        pagination={{
                                            current: listDataSearch.page,
                                            pageSize: listDataSearch.size,
                                            total: listData.total,
                                            onChange: (page, pageSize) => handleChangePage(page, pageSize),
                                        }}
                                    />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </NewPage>
    );