diff --git a/src/pages/GlobalModalServices/components/BaseCard/index.tsx b/src/pages/GlobalModalServices/components/BaseCard/index.tsx index 562045cf9a487bce499b3a197d36ba830997b5f5..6c47048f0169dbebfce009b14ca3a994165c32a2 100644 --- a/src/pages/GlobalModalServices/components/BaseCard/index.tsx +++ b/src/pages/GlobalModalServices/components/BaseCard/index.tsx @@ -5,7 +5,7 @@ import styles from './index.less'; interface PropsType { w?: any; h?: any; - title?: string; + title?: any; headerRight?: React.ReactNode; } diff --git a/src/pages/GlobalModalServices/components/TimeSelect/index.less b/src/pages/GlobalModalServices/components/TimeSelect/index.less new file mode 100644 index 0000000000000000000000000000000000000000..0963264dd9e3001220633d6ab3ac790abad3a2e8 --- /dev/null +++ b/src/pages/GlobalModalServices/components/TimeSelect/index.less @@ -0,0 +1,14 @@ +.container { + flex-direction: row; + column-gap: 20; + row-gap: 10; + flex-wrap: wrap; +} + +.item { + background-color: #f7f7f7; + + border-radius: 20px; + border-width: 1; + border-color: transparent; +} diff --git a/src/pages/GlobalModalServices/components/TimeSelect/index.tsx b/src/pages/GlobalModalServices/components/TimeSelect/index.tsx new file mode 100644 index 0000000000000000000000000000000000000000..e192c3343a62c437eaf528350248de477f96eddc --- /dev/null +++ b/src/pages/GlobalModalServices/components/TimeSelect/index.tsx @@ -0,0 +1,113 @@ +import dayjs from 'dayjs'; +import { isEqual } from 'lodash'; +import React, { memo, useEffect, useMemo, useState } from 'react'; +import styles from './index.less'; + +interface PropsType { + value: { label: string; value: any }; + defaultValue?: { label: string; value: any }; + onChange: (value: any) => void; + /** today 今日 | week 本周 | month 本月 | year 本年 | last_month 近一月 | custom 自定义 */ + dateRange: ['today'?, 'week'?, 'month'?, 'year'?, 'last_month'?]; + /** 自定义模式 */ + datePickerMode?: 'date' | 'month' | 'year' | 'dateRange'; + /** showCustom 是否显示自定义 */ + showCustom?: boolean; +} + +/** + * + * 对照表 + * @description 在任意地方获取相同值时，可以从这里获取初始值 + * @exports + * */ +export const DATE_MAPPING = { + today: { + label: '今日', + get: () => ({ + start: dayjs().format('YYYY-MM-DD'), + end: dayjs().format('YYYY-MM-DD'), + }), + }, + week: { + label: '本周', + get: () => ({ + start: dayjs().startOf('week').format('YYYY-MM-DD'), + end: dayjs().endOf('week').format('YYYY-MM-DD'), + }), + }, + month: { + label: '本月', + get: () => ({ + start: dayjs().startOf('month').format('YYYY-MM-DD'), + end: dayjs().endOf('month').format('YYYY-MM-DD'), + }), + }, + year: { + label: '本年', + get: () => ({ + start: dayjs().startOf('year').format('YYYY-MM-DD'), + end: dayjs().endOf('year').format('YYYY-MM-DD'), + }), + }, + last_month: { + label: '近一月', + get: () => ({ + start: dayjs().subtract(1, 'month').format('YYYY-MM-DD'), + end: dayjs().format('YYYY-MM-DD'), + }), + }, +}; + +/** 基础选择器 */ +const TimeSelect: React.FC = memo((props) => { + const { + value, + defaultValue, + dateRange = ['today', 'week', 'month', 'year', 'last_month'], + datePickerMode, + onChange, + } = props; + + const [curVal, setCurVal] = useState(defaultValue); + + const options = useMemo(() => { + return dateRange + .map((item) => { + if (item && item in DATE_MAPPING) { + return { + label: DATE_MAPPING[item].label, + value: DATE_MAPPING[item].get(), + }; + } + return undefined; + }) + .filter((item) => item !== undefined); + }, [dateRange]); + + useEffect(() => { + if (!isEqual(value, curVal)) { + setCurVal(value); + } + }, [value]); + + const clickHandle = (item: any) => { + setCurVal(item); + onChange && onChange(item); + }; + + return ( +
+ {options?.map((item) => { + const isSelected = curVal?.label === item.label; + return ( +
clickHandle(item)}> + {item.label} +
+ ); + })} +
+ ); +}); + +export default TimeSelect; diff --git a/src/pages/GlobalModalServices/index.tsx b/src/pages/GlobalModalServices/index.tsx index a9ffb228d15f7eb5920399edf0f4f770737ca7d5..5a3db4529e7c9a086a61886a7b68fcc1d20579ed 100644 --- a/src/pages/GlobalModalServices/index.tsx +++ b/src/pages/GlobalModalServices/index.tsx @@ -1,5 +1,5 @@ import HncyModal from '@/components/HncyModal'; -import { Flex } from 'antd'; +import { Flex, Space } from 'antd'; import { cloneDeep } from 'lodash'; import React, { cloneElement, @@ -199,33 +199,41 @@ const GlobalModalServices: React.ForwardRefRenderFunction< modalOption: ModalStackType, curThreadNodes: ModalStackType[], ) => { - const { headerLeft } = modalOption; + const { headerLeft, headerRight } = modalOption; return ( - -
- {curThreadNodes?.length && ( - <> - {curThreadNodes.map((item, index: number) => ( - go(item.modalId)} - > - {item.title} - {curThreadNodes.length - 1 !== index && ( - / - )} - - ))} - - )} -
- - {headerLeft - ? typeof headerLeft === 'function' - ? headerLeft() - : headerLeft - : undefined} + + +
+ {curThreadNodes?.length && ( + <> + {curThreadNodes.map((item, index: number) => ( + go(item.modalId)} + > + {item.title} + {curThreadNodes.length - 1 !== index && ( + / + )} + + ))} + + )} +
+ + {headerLeft + ? typeof headerLeft === 'function' + ? headerLeft() + : headerLeft + : undefined} + + + {headerRight ? ( +
+ {typeof headerRight === 'function' ? headerRight() : headerRight} +
+ ) : undefined} ); }; diff --git a/src/pages/GlobalModalServices/modals/DataGovernance/index.tsx b/src/pages/GlobalModalServices/modals/DataGovernance/index.tsx index dc67855a3c1fc704b60a3a889bb641d87b75a0ac..c443fb281ffd6d2bcb4a8d7cca692db0ce478aff 100644 --- a/src/pages/GlobalModalServices/modals/DataGovernance/index.tsx +++ b/src/pages/GlobalModalServices/modals/DataGovernance/index.tsx @@ -1,3 +1,6 @@ +import { Button } from 'antd'; +import { useEffect } from 'react'; +import { ChildrenModalMethods } from '../../type'; import CenterStats from './components/CenterStats'; import DataActivityCard from './components/DataActivityCard'; import DataFlowSection from './components/DataFlowSection'; @@ -5,7 +8,34 @@ import DataQualityCard from './components/DataQualityCard'; import styles from './index.less'; import { governanceData } from './mockData'; -const DataGovernance = () => { +const DataGovernance = ({ + modalDispatch, +}: { + modalDispatch: ChildrenModalMethods; +}) => { + useEffect(() => { + modalDispatch.setOptions({ + headerRight: () => { + return ( + + ); + }, + }); + }, []); return (
diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.less index 6b1434ff567bfdcb49bd9fc490f4c7228bbb36e8..46106322b52a22c6d57195ee735e6a6bf1957f10 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.less +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.less @@ -18,3 +18,17 @@ font-size: 16px; color: #3d4566; } + +.sort { + width: 58px; + height: 31px; + border-radius: 50px; + background: rgba(221, 221, 221, 0.4); + display: flex; + align-items: center; + justify-content: center; + color: #fff; + font-size: 14px; + // align-self: center; + margin: 0 auto; +} diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.tsx index 1ef9196f250481abb56445dd623dd20d5d043025..1d106881db121d3a8c9afdbb6d2d54b1fd9524e4 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/CountyProblem/index.tsx @@ -1,118 +1,123 @@ -import { ConfigProvider, Table } from 'antd'; +import BlueTable from '@/components/BlueTable'; +import services from '@/services'; +import { useSetState } from 'ahooks'; +import { TableProps } from 'antd'; +import { useEffect, useState } from 'react'; import styles from './index.less'; -import BlueTable from '@/components/BlueTable' -export default () => { - const dataSource = [ - { - key: '1', - name: '胡彦斌', - age: 32, - address: '西湖区湖底公园1号', - }, - { - key: '2', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - { - key: '3', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - { - key: '4', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - ]; +export default ({ type }: { type: string }) => { + const [dataSource, setDataSource] = useState([]); + const [pageInfo, setPageInfo] = useSetState({ + page: 1, + pageSize: 6, + total: 0, + }); - const columns: any = [ + const getData = (page: number) => { + const classification = type === 'all' ? undefined : type; + + services.Physicalsign.getDifficultEventsList({ + page: page, + count: 6, + classification, + }).then((res) => { + if (res.code === 200) { + setDataSource(res.data.items); + setPageInfo({ + page: res.data.page, + total: res.data.total, + }); + } + }); + }; + + useEffect(() => { + getData(1); + }, [type]); + + const columns: TableProps['columns'] = [ { title: '排名', - dataIndex: 'name', - key: 'name', - width: 100, + key: 'sort', + render: (text: any, record: any, index: any) => { + return ( +
+ TOP{index + 1 + (pageInfo.page - 1) * pageInfo.pageSize} +
+ ); + }, align: 'center', }, { title: '区市县', - dataIndex: 'age', - key: 'age', - width: 150, + dataIndex: 'areaName', + key: 'areaName', + align: 'center', }, { title: '待解决', - dataIndex: 'address', - key: 'address', - width: 150, + dataIndex: 'pendingCount', + key: 'pendingCount', + render: (text: any) => { + return {text}; + }, align: 'center', }, { title: '共计', - dataIndex: 'address', - key: 'address', - width: 150, + dataIndex: 'totalCount', + key: 'totalCount', + align: 'center', }, { - title: '待解决', - dataIndex: 'address', - key: 'address', - width: 150, + title: '已解决', + dataIndex: 'solvedCount', + key: 'solvedCount', + render: (text: any) => { + return ( + {text ?? '--'} + ); + }, align: 'center', }, { title: '超期100天以上', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdue100DaysPlus', + key: 'overdue100DaysPlus', + align: 'center', }, { title: '超期30-100天', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdue30To100Days', + key: 'overdue30To100Days', + align: 'center', }, { title: '超期30天已内', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdueLessThan30Days', + key: 'overdueLessThan30Days', align: 'center', }, ]; return (
- {/* { - if (index % 2 === 0) { - return styles.rowClassName1; - } else { - return styles.rowClassName; - } - }} - /> */} `共 ${total} 条`, - onChange: (pageNum, pageSize) => { + pageSize: 6, + onChange: (pageNum) => { // setParams({ pageNum, pageSize, type: 'list' }); + getData(pageNum); }, - current: 1, + current: pageInfo.page, }} /> diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.less index 6b1434ff567bfdcb49bd9fc490f4c7228bbb36e8..46106322b52a22c6d57195ee735e6a6bf1957f10 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.less +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.less @@ -18,3 +18,17 @@ font-size: 16px; color: #3d4566; } + +.sort { + width: 58px; + height: 31px; + border-radius: 50px; + background: rgba(221, 221, 221, 0.4); + display: flex; + align-items: center; + justify-content: center; + color: #fff; + font-size: 14px; + // align-self: center; + margin: 0 auto; +} diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.tsx index ce912ff478641303a6c7cefb83cf7156cc30b66d..b848203f2e31cb38c4781b84ff6272ee89a8670b 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/DisposeProblem/index.tsx @@ -1,89 +1,105 @@ -import { ConfigProvider, Table } from 'antd'; +import BlueTable from '@/components/BlueTable'; +import services from '@/services'; +import { useSetState } from 'ahooks'; +import { TableProps } from 'antd'; +import { useEffect, useState } from 'react'; import styles from './index.less'; -import BlueTable from '@/components/BlueTable' -export default () => { - const dataSource = [ - { - key: '1', - name: '胡彦斌', - age: 32, - address: '西湖区湖底公园1号', - }, - { - key: '2', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - { - key: '3', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - { - key: '4', - name: '胡彦祖', - age: 42, - address: '西湖区湖底公园1号', - }, - ]; +export default ({ type }: { type: string }) => { + const [dataSource, setDataSource] = useState([]); + const [pageInfo, setPageInfo] = useSetState({ + page: 1, + pageSize: 6, + total: 0, + }); - const columns = [ + const getData = (page: number) => { + const classification = type === 'all' ? undefined : type; + + services.Physicalsign.getDifficultEventsList({ + page: page, + count: 6, + classification, + by: 'dept', + }).then((res) => { + if (res.code === 200) { + setDataSource(res.data.items); + setPageInfo({ + page: res.data.page, + total: res.data.total, + }); + } + }); + }; + + useEffect(() => { + getData(1); + }, [type]); + + const columns: TableProps['columns'] = [ { title: '排名', - dataIndex: 'name', - key: 'name', - width: 100, + key: 'sort', + render: (text: any, record: any, index: any) => { + return ( +
+ TOP{index + 1 + (pageInfo.page - 1) * pageInfo.pageSize} +
+ ); + }, align: 'center', }, { - title: '处置单位', - dataIndex: 'age', - key: 'age', - width: 150, + title: '区市县', + dataIndex: 'areaName', + key: 'areaName', + align: 'center', }, { title: '待解决', - dataIndex: 'address', - key: 'address', - width: 150, + dataIndex: 'pendingCount', + key: 'pendingCount', + render: (text: any) => { + return {text}; + }, align: 'center', }, { title: '共计', - dataIndex: 'address', - key: 'address', - width: 150, + dataIndex: 'totalCount', + key: 'totalCount', + align: 'center', }, { - title: '待解决', - dataIndex: 'address', - key: 'address', - width: 150, + title: '已解决', + dataIndex: 'solvedCount', + key: 'solvedCount', + render: (text: any) => { + return ( + {text ?? '--'} + ); + }, align: 'center', }, { title: '超期100天以上', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdue100DaysPlus', + key: 'overdue100DaysPlus', + align: 'center', }, { title: '超期30-100天', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdue30To100Days', + key: 'overdue30To100Days', + align: 'center', }, { title: '超期30天已内', - dataIndex: 'address', - key: 'address', - width: 200, + dataIndex: 'overdueLessThan30Days', + key: 'overdueLessThan30Days', align: 'center', }, ]; @@ -95,13 +111,14 @@ export default () => { columns={columns} dataSource={dataSource} pagination={{ - total: 10, - showSizeChanger: true, + total: pageInfo.total, showTotal: (total) => `共 ${total} 条`, - onChange: (pageNum, pageSize) => { + pageSize: 6, + onChange: (pageNum) => { // setParams({ pageNum, pageSize, type: 'list' }); + getData(pageNum); }, - current: 1, + current: pageInfo.page, }} /> diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.less deleted file mode 100644 index e24c4f681376845af827e878180cccd0ea37a01b..0000000000000000000000000000000000000000 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.less +++ /dev/null @@ -1,37 +0,0 @@ -.container { - width: 249px; - height: 41px; - border-radius: 7px; - background: rgba(41, 181, 255, 0.12); - padding: 0 13px; - display: flex; - align-items: center; - justify-content: space-between; - font-family: PingFang SC; - font-weight: 500; - font-size: 14px; - color: #BCCEE9; - margin-bottom: 10px; - - .left { - display: flex; - align-items: center; - - .dot { - width: 7px; - height: 7px; - border-radius: 50%; - } - - span { - margin-left: 5px; - } - } - - .count { - font-family: PingFang SC; - font-weight: 800; - font-size: 18px; - } - -} \ No newline at end of file diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.tsx deleted file mode 100644 index 2d3044dc08c60a575b4f4c95afbe58c0443668b3..0000000000000000000000000000000000000000 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/OutTimeItem/index.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import styles from './index.less'; -export default () => { - return ( -
-
-
- 超期100天以上 -
- 15件 - 33% -
- ); -}; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.less index e0ee1c2ba8be3fb09b8f18f71cd4021eb5cbcd59..d5ec9977e572229006e955d8297c581071412582 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.less +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.less @@ -1,16 +1,34 @@ +.tabItem { + color: rgb(76, 134, 189); + font-family: DingTalk JinBuTi; + font-size: 18px; + font-weight: 400; + cursor: pointer; +} + +.active { + color: rgb(255, 255, 255); + + font-weight: 400; +} + .container { + // -top: 10px; + width: 100%; + height: 100%; +} + +.legendBg { + // width: 244px; + height: 38px; + padding: 8px 14px; border-radius: 7px; - background: rgb(41, 181, 255, 0.12); - padding: 34px 28px; + background: rgba(41, 181, 255, 0.12); +} + +.legendContent { + display: flex; + flex-direction: column; - .title { - font-family: PingFang SC; - font-weight: 800; - font-size: 16px; - color: #3d4566; - line-height: 20px; - } - .content { - display: flex; - } + row-gap: 12px; } diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.tsx index 07fa207a39841b52f475260d579d1d40ea2b37ac..118136dcd1715f0508bfa4bf5c5b38f72cdeedbc 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/index.tsx @@ -1,27 +1,94 @@ -import { Flex } from 'antd' -import PieCharts from '@/components/PieCharts'; +import EmptyWithConditions from '@/components/EmptyWithConditions'; +import BaseCard from '@/pages/GlobalModalServices/components/BaseCard'; +import { Badge, Flex } from 'antd'; +import EChartsReact from 'echarts-for-react'; +import { cloneDeep } from 'lodash'; +import { useLayoutEffect, useMemo, useRef } from 'react'; import styles from './index.less'; -import OutTimeItem from './OutTimeItem'; -import BaseCard from '@/pages/Common/components/BaseCard'; +import pieOption from './option'; -const ExceedTimeCard = () => { +const ExceedTimeCard: React.FC<{ dataSource: any }> = (props) => { + const chartRef = useRef(); + const { dataSource } = props; + const pieData = useMemo(() => { + return [ + { + name: '超期100天以上', + value: dataSource?.expand?.overdueStatistics?.overdue100DaysPlus, + percent: dataSource?.expand?.overdueStatistics?.overdue100DaysPlusRate, + }, + { + name: '超期30-100天', + value: dataSource?.expand?.overdueStatistics?.overdue30To100Days, + percent: dataSource?.expand?.overdueStatistics?.overdue30To100DaysRate, + }, + { + name: '超期30天以内', + value: dataSource?.expand?.overdueStatistics?.overdueLessThan30Days, + percent: + dataSource?.expand?.overdueStatistics?.overdueLessThan30DaysRate, + }, + ]; + }, [props.dataSource]); + const colors = [ + '#F07283', + '#A550FF', + '#5DDDFF', + + '#7664EC', + '#77E67B', + '#35B2FF', + '#FFE335', + '#FF9B5D', + ]; + + const PieOption = useMemo(() => { + const temp = cloneDeep(pieOption) as any; + temp.color = colors; + temp.series[0].data = pieData; + return temp; + }, [pieData]); + + useLayoutEffect(() => { + chartRef.current?.resize(); + }, []); return ( - - - -
- - - -
- + + + +
+ +
+ +
+ {pieData.map((item, index) => { + return ( + + + +
{item.name}
+
{item.value} 个
+
{item.percent} %
+ + ); + })} +
+ + ); }; -export default ExceedTimeCard +export default ExceedTimeCard; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/option.ts b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/option.ts new file mode 100644 index 0000000000000000000000000000000000000000..ae92ed3c326e0a7227f3327174091ec4a398308f --- /dev/null +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ExceedTimeCard/option.ts @@ -0,0 +1,30 @@ +const pieOption = { + series: [ + { + name: 'Access From', + type: 'pie', + radius: ['70%', '90%'], + center: ['50%', '50%'], + avoidLabelOverlap: false, + padAngle: 5, + itemStyle: {}, + label: { + show: false, + position: 'center', + }, + emphasis: { + label: { + show: true, + fontSize: 10, + fontWeight: 'bold', + }, + }, + labelLine: { + show: false, + }, + data: [], + }, + ], +}; + +export default pieOption; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/Chart.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/Chart.tsx deleted file mode 100644 index 379f5a7142706f7f0e0b2bdb0a92f5719788ebc1..0000000000000000000000000000000000000000 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/Chart.tsx +++ /dev/null @@ -1,41 +0,0 @@ -//公用饼图 -import ReactEcharts from 'echarts-for-react'; -import { CSSProperties } from 'react'; -interface ChartProps { - data: any; - style?: CSSProperties; - color: string[]; -} -const Chart: React.FC = ({ data, color, style }) => { - const getOption = () => { - return { - color, - tooltip: { - trigger: 'item', - confine: true, - formatter: '{b0}: {c0}', - }, - series: [ - { - name: '', - type: 'pie', - minAngle: 20, //最小的扇区角度（0 ~ 360），用于防止某个值过小导致扇区太小影响交互。 - radius: ['52%', '94%'], - label: { - show: false, - }, - data: data, - }, - ], - }; - }; - return ( - - ); -}; -export default Chart; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.less deleted file mode 100644 index 58f47b99a750d64437ea0f752052dc2614089cf9..0000000000000000000000000000000000000000 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.less +++ /dev/null @@ -1,41 +0,0 @@ -.label { - width: 100%; - flex: 1; - display: flex; - flex-direction: column; - align-items: center; - color: #666666; - font-size: 16px; - margin-top: 18px; - - .labelItem { - width: 320px; - height: 42px; - background: rgba(255, 255, 255, 0.46); - border-radius: 12px; - padding: 0 15px; - } - - p { - display: flex; - align-items: center; - color: #6a738e; - font-size: 14px; - width: 22%; - display: flex; - justify-content: flex-end; - - b { - font-size: 19px; - color: #32404d; - margin-right: 4px; - } - - &.valueWrap { - flex: 1; - display: flex; - justify-content: flex-end; - padding: 0 20px 0 8px !important; - } - } -} diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.tsx deleted file mode 100644 index 02279c237425a17e3834eadae85f357b4c4cca0e..0000000000000000000000000000000000000000 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/PieChart/index.tsx +++ /dev/null @@ -1,55 +0,0 @@ -//公用饼图 -import DotText from '@/components/DotText'; -import EmptySpace from '@/components/EmptySpace'; -import { Flex } from 'antd'; -import classNames from 'classnames'; -import { CSSProperties } from 'react'; -import Chart from './Chart'; -import styles from './index.less'; -interface PieChartDto { - data?: API.BaseChartInfo[]; //数据源 - labelGap?: number; //label间距 - style?: CSSProperties; //样式 - chartStyle?: CSSProperties; //chartStyle样式 - labelClassName?: string; //label样式 - color?: string[]; //颜色 -} -const PieChart: React.FC = ({ - style, - labelGap = 8, - chartStyle = { width: '260px', height: '300px' }, - data = [], - labelClassName, - color = ['#fd86b1', '#14c3dc', '#ffd28e', '#B5B4FF', '#B5B42F'], -}) => { - return ( - - {data.length > 0 ? ( - <> - -
- {data.map((it, index) => ( - - -

- {it.value} -

-

- {parseFloat(Number(it.percent).toFixed(1))}% -

- - ))} -
- - ) : ( - - )} - - ); -}; -export default PieChart; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemRank/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemRank/index.tsx index 665f33cdea007fe5e3619956025c15b361af04d9..47c36ec35914e73ad19c9301c4f7246d85ae763b 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemRank/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemRank/index.tsx @@ -1,94 +1,73 @@ -import { Flex } from 'antd' +import { Flex, Image } from 'antd'; -import TopSearch from './TopSearch' +import services from '@/services'; +import { useEffect, useState } from 'react'; +import styles from './index.less'; -import styles from './index.less' +const tagColors = ['#FCB129', '#588CF4', '#4BCF81', '#8D9EB6']; +export default ({ type }: { type: string }) => { + const [dataSource, setDataSource] = useState([]); -const tagColors = ['#FCB129', '#588CF4', '#4BCF81', '#8D9EB6'] - -export default () => { - - - const list = [ - { - title: '这里是问题的标题这里是问题的标题', - desc: '发现了问题', - pic: 'https://xct.cdhncy.cn/file/zgf/2024/10/10/e1d7cf31199b47528085fffd93af2bee_1728549037097.jpg', - time: "2024.08.30日 10:00:00发现", - loc: "成都市锦华路二段123号", - tag: 'TOP1', - compAdr: '锦江区', - compName: '成都移动' - }, - { - title: '这里是问题的标题这里是问题的标题', - desc: '发现了问题', - pic: 'https://xct.cdhncy.cn/file/zgf/2024/10/10/e1d7cf31199b47528085fffd93af2bee_1728549037097.jpg', - time: "2024.08.30日 10:00:00发现", - loc: "成都市锦华路二段123号", - tag: 'TOP2', - compAdr: '锦江区', - compName: '成都移动' - }, - { - title: '这里是问题的标题这里是问题的标题', - desc: '发现了问题', - pic: 'https://xct.cdhncy.cn/file/zgf/2024/10/10/e1d7cf31199b47528085fffd93af2bee_1728549037097.jpg', - time: "2024.08.30日 10:00:00发现", - loc: "成都市锦华路二段123号", - tag: 'TOP3', - compAdr: '锦江区', - compName: '成都移动' - }, - { - title: '这里是问题的标题这里是问题的标题', - desc: '发现了问题', - pic: 'https://xct.cdhncy.cn/file/zgf/2024/10/10/e1d7cf31199b47528085fffd93af2bee_1728549037097.jpg', - time: "2024.08.30日 10:00:00发现", - loc: "成都市锦华路二段123号", - tag: 'TOP4', - compAdr: '锦江区', - compName: '成都移动' - } - ] - + const getData = (page: number) => { + const classification = type === 'all' ? undefined : type; + services.Physicalsign.getDifficultEventsTop10({ + page: page, + count: 6, + classification, + }).then((res) => { + if (res.code === 200) { + setDataSource(res.data.items); + } + }); + }; + useEffect(() => { + getData(1); + }, [type]); - return
- -
- { - list.map((item: any, index: number) => { + return ( +
+
+ {dataSource.map((item: any, index: number) => { return ( - +
- -
{item.tag}
+ +
+ TOP{index + 1} +
-
{item.title}
-
- {item.time} -
-
- {item.loc} -
+
{item.standardEventTitle}
+
{item.reportTime}
+
{item.address}
 - +
- {item.compAdr} + {item.districtName}
-
责任单位：{item.compName}
+
责任单位：{item.deptName}
 - ) - }) - } - + ); + })} +
-
-} \ No newline at end of file + ); +}; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/index.tsx index f3476c63f74e08bdd32798dbfcb3ec6c587907bb..666ee3d646f47ec77a1bf666dbc32956cce4486e 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/index.tsx @@ -1,15 +1,53 @@ -import DoubleLineCharts from '@/components/DoubleLineCharts'; -import BaseCard from '@/pages/Common/components/BaseCard'; -import styles from './index.less'; -export default () => { +import EmptyWithConditions from '@/components/EmptyWithConditions'; +import BaseCard from '@/pages/GlobalModalServices/components/BaseCard'; +import dayjs from 'dayjs'; +import EChartsReact from 'echarts-for-react'; +import { cloneDeep } from 'lodash'; +import { useLayoutEffect, useMemo, useRef } from 'react'; +import option from './option'; + +const ProblemTendencyCard = ({ dataSource }: { dataSource: any }) => { + const chartRef = useRef(); + + useLayoutEffect(() => { + chartRef.current?.resize(); + }, []); + + const LineOption = useMemo(() => { + const temp = cloneDeep(option) as any; + const xAxis = + dataSource?.expand?.trendChart?.map((v: any) => + dayjs(v.date).format('MM.DD'), + ) ?? []; + + temp.xAxis[0].data = xAxis; + temp.legend.data = ['新增', '解决']; + + const addData = dataSource?.expand?.trendChart.map( + (v: any) => v.addedCount, + ); + + const solveData = dataSource?.expand?.trendChart.map( + (v: any) => v.solvedCount, + ); + + temp.series[0].data = addData; + temp.series[1].data = solveData; + return temp; + }, [dataSource]); + return ( - -
- -
+ + + + ); }; +export default ProblemTendencyCard; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/option.ts b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/option.ts new file mode 100644 index 0000000000000000000000000000000000000000..04e5cd9e2ad94ea95e5d24e81490ca5821ee6e46 --- /dev/null +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/ProblemTendencyCard/option.ts @@ -0,0 +1,149 @@ +const option = { + color: ['rgb(87, 239, 229)', 'rgb(141, 161, 255)', '#5AFF65'], + tooltip: { + trigger: 'axis', + borderWidth: '0', + backgroundColor: 'rgba(73,81,92,.95)', + + textStyle: { + color: '#CBEDFF', + fontSize: 16, + }, + }, + grid: { + left: '2%', + right: '2%', + bottom: '2%', + top: '0%', + containLabel: true, + }, + legend: { + data: [], + icon: 'circle', + top: 10, + itemGap: 50, + textStyle: { + fontSize: '16px', + color: '#E4EDFF', + }, + }, + xAxis: [ + { + type: 'category', + boundaryGap: true, + axisLine: { + show: false, + }, + axisLabel: { + show: true, + // interval: 0, + textStyle: { + padding: [2, 0, 0, 0], + color: '#CBEDFF', + fontSize: 14, + }, + }, + axisTick: { + show: false, + }, + axisPointer: { + type: 'shadow', + }, + data: [], + }, + ], + yAxis: [ + { + type: 'value', + name: '件', + min: 0, + interval: 10, + axisLabel: { + show: false, + }, + nameTextStyle: { + align: 'left', + color: '#CBEDFF', + padding: [0, 0, 20, -20], + fontSize: 16, + }, + splitLine: { + show: false, + }, + axisLine: { + show: false, + }, + axisTick: { + show: false, + }, + }, + ], + series: [ + { + name: '新增', + type: 'line', + symbol: 'none', + stack: 'Total', + lineStyle: { + color: 'rgb(87, 239, 229)', + width: 3, + }, + + areaStyle: { + color: { + type: 'linear', + x: 0, + y: 0, + x2: 0, + y2: 1, + colorStops: [ + { + offset: 0, + color: 'rgba(141, 161, 255,0.36)', // 0% 处的颜色 + }, + { + offset: 1, + color: 'rgba(141, 161, 255,0)', // 100% 处的颜色 + }, + ], + global: false, // 缺省为 false + }, + }, + data: [], + }, + { + name: '解决', + type: 'line', + symbol: 'none', + stack: 'Total', + lineStyle: { + color: 'rgb(141, 161, 255)', + width: 3, + }, + + areaStyle: { + color: { + type: 'linear', + x: 0, + y: 0, + x2: 0, + y2: 1, + colorStops: [ + { + offset: 0, + color: 'rgba(141, 161, 255,0.36)', // 0% 处的颜色 + }, + { + offset: 1, + color: 'rgba(141, 161, 255,0)', // 100% 处的颜色 + }, + ], + global: false, // 缺省为 false + }, + }, + data: [], + }, + ], +}; + +export default option; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.less b/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.less index 0ac0e1898518f5840e33f493949be5b9325a000c..155c02a6e782171de864572bb98e95c16eb080c8 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.less +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.less @@ -1,5 +1,4 @@ .content { - padding: 20px; } .title { @@ -17,6 +16,7 @@ font-family: PingFang SC; font-weight: 500; font-size: 16px; + margin: 8px 0; color: #fff; .count { @@ -38,7 +38,7 @@ font-family: PingFang SC; font-weight: 500; font-size: 16px; - color: #BCCEE9; + color: #bccee9; .img { margin-top: -3px; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.tsx index 30142c09614b75c4109dd82142d40a7654cbf509..c7b75858efd9092f0babca50e057e43142a30277 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/StatisticsCard/index.tsx @@ -1,21 +1,36 @@ -import { Divider, Flex, Space } from 'antd' -import BaseCard from '@/pages/Common/components/BaseCard' -import styles from './index.less' +import BaseCard from '@/pages/GlobalModalServices/components/BaseCard'; +import { Divider, Flex, Space } from 'antd'; +import styles from './index.less'; -const StatisticsCard = () => { +/** 统计 */ +const StatisticsCard = ({ dataSource }: { dataSource: any }) => { return ( - - + - 当前 160 件疑难问题待解决 + 当前 {dataSource?.currentUnsolvedCount ?? '--'} +  件疑难问题待解决
+ } + > +
- 历史共计 112 件 + 历史共计  + + {dataSource?.totalCount ?? '--'} + +  件 - 已解决 12 件 + 已解决  + + {dataSource?.solvedCount ?? '--'} + +  件
@@ -29,7 +44,7 @@ const StatisticsCard = () => {  今日新增 - 6 + {dataSource?.todayAddedCount ?? '--'} 个 @@ -44,15 +59,14 @@ const StatisticsCard = () => {  今日解决 - 6 + {dataSource?.todaySolvedCount ?? '--'} 个 - - ) -} + ); +}; -export default StatisticsCard \ No newline at end of file +export default StatisticsCard; diff --git a/src/pages/GlobalModalServices/modals/DifficultEvents/index.tsx b/src/pages/GlobalModalServices/modals/DifficultEvents/index.tsx index 71d08dc83e59434f56d809e340096ad371e6c74e..b11a32b2a6594d992ef6fadef0cb2d0a1efcdb5c 100644 --- a/src/pages/GlobalModalServices/modals/DifficultEvents/index.tsx +++ b/src/pages/GlobalModalServices/modals/DifficultEvents/index.tsx @@ -1,58 +1,110 @@ -import { Tabs as AntdTabs, Flex, Space } from 'antd'; +import Tabs from '@/components/Tabs'; import BaseCard from '@/pages/Common/components/BaseCard'; -import Tabs from '@/components/Tabs' -import StatisticsCard from './StatisticsCard'; -import ExceedTimeCard from './ExceedTimeCard'; -import ProblemTendencyCard from './ProblemTendencyCard'; -import styles from './index.less'; +import services from '@/services'; +import { useSetState } from 'ahooks'; +import { Tabs as AntdTabs, Flex, Space } from 'antd'; +import { useEffect, useMemo, useState } from 'react'; +import { ChildrenModalMethods } from '../../type'; import CountyProblem from './CountyProblem'; import DisposeProblem from './DisposeProblem'; +import ExceedTimeCard from './ExceedTimeCard'; import ProblemRank from './ProblemRank'; -import { useRequest } from 'ahooks'; -import services from '@/services'; +import ProblemTendencyCard from './ProblemTendencyCard'; +import StatisticsCard from './StatisticsCard'; +import styles from './index.less'; + +/** @name 疑难问题 */ +const DifficultEvents = (props: { modalDispatch: ChildrenModalMethods }) => { + const { modalDispatch } = props; + const [activeKey, setActiveKey] = useState<'all' | 'city-manage' | 'other'>( + 'all', + ); + const type = activeKey === 'all' ? undefined : activeKey; + const [dataSource, setDataSource] = useSetState<{ + leftData?: any; + rightData?: any; + }>({}); + /** 数据初始化 */ + const getData = () => { + services.Physicalsign.getStatisticsOfDifficultEvent({ + classification: type, + }).then((res) => { + if (res.code === 200) { + setDataSource({ + leftData: res.data, + }); + } + }); + }; + + useEffect(() => { + getData(); + }, [activeKey]); + useEffect(() => { + const tabs = [ + { + key: 'all', + label: '全部', + }, + { + key: 'city-manage', + label: '城市管理类', + }, + { + key: 'other', + label: '其他', + }, + ]; + modalDispatch.setOptions({ + headerLeft: () => { + return ( +
+ { + setActiveKey(type as any); + }} + defaultValue={'all'} + itemkey={'key'} + items={tabs} + /> +
+ ); + }, + }); + }, []); + + const tabItems = useMemo( + () => [ + { + label: `按区市县统计`, + key: '1', + children: , + }, + { + label: `按处置单位统计`, + key: '2', + children: , + }, + { + label: `疑难问题TOP10`, + key: '3', + children: , + }, + ], + [activeKey], + ); -const DifficultEvents = () => { - const tabItems = [ - { - label: `按区市县统计`, - key: '1', - children: , - }, - { - label: `按处置单位统计`, - key: '2', - children: , - }, - { - label: `疑难问题TOP10`, - key: '3', - children: , - }, - ]; - const { data, run } = useRequest(services.Physicalsign.getEventCountForLeft, { - defaultParams:[{difficultFlag:'1'}] - }); return ( - - {}} itemkey={'key'} items={[ - { - key: '0', - label: '全部' - }, - { - key: '1', - label: '城市管理类' - }, - { - key: '2', - label: '其他' - } - ]} /> - - - + + + + diff --git a/src/pages/GlobalModalServices/modals/UrbanLighting/LightingOperationSituation/index.tsx b/src/pages/GlobalModalServices/modals/UrbanLighting/LightingOperationSituation/index.tsx index 8f5fa33485ae08dc6e480ebf909ce7b116d21006..118278fa66b07102174dffcfd2ba861ee9531bb9 100644 --- a/src/pages/GlobalModalServices/modals/UrbanLighting/LightingOperationSituation/index.tsx +++ b/src/pages/GlobalModalServices/modals/UrbanLighting/LightingOperationSituation/index.tsx @@ -1,6 +1,7 @@ import services from '@/services'; +import { QuestionCircleFilled } from '@ant-design/icons'; import { useSetState } from 'ahooks'; -import { Flex } from 'antd'; +import { Flex, Popover, Space } from 'antd'; import dayjs from 'dayjs'; import EChartsReact from 'echarts-for-react'; import { cloneDeep } from 'lodash'; @@ -143,9 +144,12 @@ const LightingOperationSituation: React.FC = () => { h={422} title="市管功能照明运行态势" headerRight={ -
- {`统计时间范围：${dataSource.chartData?.at(-1)?.date}`} -
+ + {`统计时间范围：${dataSource.chartData?.at(-1)?.date ?? '--'}`} + + + + } > diff --git a/src/pages/GlobalModalServices/modals/UrbanLighting/Overview/index.tsx b/src/pages/GlobalModalServices/modals/UrbanLighting/Overview/index.tsx index 82948fe444c9352c723af95b4da5e5f429229bdb..8ee5d13a78f599e699b163f0e08df80e2fdd8ce0 100644 --- a/src/pages/GlobalModalServices/modals/UrbanLighting/Overview/index.tsx +++ b/src/pages/GlobalModalServices/modals/UrbanLighting/Overview/index.tsx @@ -46,7 +46,6 @@ const Overview: React.FC<{ total: number }> = memo((props) => { value: record.led, percent: percent[0], }, - { name: '其他灯盏数', value: record.zmd - record.led, diff --git a/src/pages/GlobalModalServices/registry.tsx b/src/pages/GlobalModalServices/registry.tsx index 9d630c096a04404b85c3f0d65da91a831925831e..30e3cdb5168f1369d1d03aaef74e372b99c521ea 100644 --- a/src/pages/GlobalModalServices/registry.tsx +++ b/src/pages/GlobalModalServices/registry.tsx @@ -6,6 +6,7 @@ import AnalysisCompletionRate from './modals/AnalysisCompletionRate'; import AreaSynergy from './modals/AreaSynergy'; import AreaSynergyDetails from './modals/AreaSynergy/AreaSynergyDetails'; import AreaSynergyList from './modals/AreaSynergy/AreaSynergyList'; +import BridgeMaintenanceList from './modals/BridgeMaintenanceList'; import BridgeManage from './modals/BridgeManage'; import Category from './modals/Category'; import CgftEvent from './modals/CgftEvent'; @@ -27,6 +28,7 @@ import InfluenceSign from './modals/InfluenceSign'; import KeyArea from './modals/KeyArea'; import KeyAreaDetail from './modals/KeyAreaDetail'; import LightingFaultDisposal from './modals/LightingFaultDisposal'; +import LivingGarbage from './modals/LivingGarbage'; import OtherEvent from './modals/OtherEvent'; import PipelinePassage from './modals/PipelinePassage'; import SanitationDisp from './modals/SanitationDisp'; @@ -36,9 +38,7 @@ import SignModel from './modals/SignModel'; import ToDisposed from './modals/ToDisposed'; import UrbanLighting from './modals/UrbanLighting'; import UrbanOperation from './modals/UrbanOperation'; -import BridgeMaintenanceList from './modals/BridgeMaintenanceList'; import type { ModalMapping } from './type'; -import LivingGarbage from './modals/LivingGarbage'; export type ModalKey = keyof typeof Registry.RegistryList; @@ -192,7 +192,7 @@ export default class Registry { DifficultEvents: { defaultConfig: { w: 2000, - h: 846, + h: 800, }, defaultProps: {}, modal: DifficultEvents, @@ -485,7 +485,7 @@ export default class Registry { defaultConfig: { title: '道桥维护信息列表', w: 1480, - h: 858 + h: 858, }, defaultProps: {}, modal: BridgeMaintenanceList, @@ -515,7 +515,7 @@ export default class Registry { defaultConfig: { title: '生活垃圾', w: 2115, - h: 1004 + h: 1004, }, defaultProps: {}, modal: LivingGarbage, diff --git a/src/pages/GlobalModalServices/type.ts b/src/pages/GlobalModalServices/type.ts index 5ea1622812499255855fe9d0ac184891c672408f..03333a748eac9fc33012ec675c9576788ffe0378 100644 --- a/src/pages/GlobalModalServices/type.ts +++ b/src/pages/GlobalModalServices/type.ts @@ -10,7 +10,7 @@ export interface GlobalModalConfig { /** 自定义标题栏左侧内容 */ headerLeft?: React.ReactNode | (() => React.ReactNode); /** 自定义标题栏右侧内容 */ - headerRight?: React.ReactNode; + headerRight?: React.ReactNode | (() => React.ReactNode); /** 自定义弹窗内容 */ /** * @@ -46,7 +46,7 @@ export type GlobalModalServicesModalMethods = { modalKey: ModalKey, config?: GlobalModalConfig, thread?: number, - ) => string; + ) => any; /** * 关闭一个弹窗 diff --git a/src/pages/NewHome/NewLeftSidebar/OperatingSituation/index.tsx b/src/pages/NewHome/NewLeftSidebar/OperatingSituation/index.tsx index 86e8d3d2694e595109b0e31d560efe0518ca7416..754d91010daeb7a7ecf73f14a76b802066352094 100644 --- a/src/pages/NewHome/NewLeftSidebar/OperatingSituation/index.tsx +++ b/src/pages/NewHome/NewLeftSidebar/OperatingSituation/index.tsx @@ -2,13 +2,13 @@ import { useGlobalModalServices } from '@/pages/GlobalModalServices/provider'; import services from '@/services'; import { convertUnits, formatNumber } from '@/utils/ui'; import { useRequest } from 'ahooks'; -import { DatePicker, Progress, Statistic, StatisticProps } from 'antd'; +import { Progress, Statistic, StatisticProps } from 'antd'; import dayjs from 'dayjs'; import { useMemo, useState } from 'react'; import CountUp from 'react-countup'; +import DateSelect from './DateSelect'; import styles from './index.less'; import LineCharts from './LineCharts'; -import DateSelect from './DateSelect'; const formatter: StatisticProps['formatter'] = (value: any) => { return ( { const wnywxt = data?.data?.items?.find( (item: any) => item.code === 'wnywxt', )?.value; + return [ { key: '1', @@ -127,14 +128,6 @@ const OperatingSituation = () => { time: dayjs(searchParams?.time).format('YYYY-MM'), }, }); - // dispatch?.push('PeopleComplaint' as any, { - // title: '12345市民投诉', - // // // props: { - // // type: 'CgftEvent', - // // title: '诚管24高速通道处置情况', - // // singleType: '1', - // // }, - // }); }, }, { @@ -258,38 +251,22 @@ const OperatingSituation = () => {
运行态势
- { - console.log(e) - const currentTime = dayjs().format('HH:mm:ss') - let time = `${e.time} ${currentTime}` - if (e.type === '1') { - time = dayjs(e.time).format('YYYY-01-01') + ' ' + currentTime - } else if (e.type === '2') { - time = dayjs(e.time).format('YYYY-MM-01') + ' ' + currentTime - } - setSearchParams({ - time: time, - type: e.type, - }); - }} /> - {/* { + { console.log(e); - searchParams.time = dayjs(e).format('YYYY-MM-01 HH:mm:ss'); - setSearchParams({ ...searchParams }); + const currentTime = dayjs().format('HH:mm:ss'); + let time = `${e.time} ${currentTime}`; + if (e.type === '1') { + time = dayjs(e.time).format('YYYY-01-01') + ' ' + currentTime; + } else if (e.type === '2') { + time = dayjs(e.time).format('YYYY-MM-01') + ' ' + currentTime; + } + setSearchParams({ + time: time, + type: e.type, + }); }} - picker="month" - /> */} - {/*