diff --git a/config/proxy.ts b/config/proxy.ts index 524faa466980210902c7f76e6c6cc88dfbe532e7..aa749e8739402a8dc21091314da19df15836635e 100644 --- a/config/proxy.ts +++ b/config/proxy.ts @@ -1,16 +1,16 @@ export default { '/apis': { - target: 'http://171.217.92.33:21601', + target: 'http://171.217.92.33:21601', // target: 'http://125.70.11.26:4303', changeOrigin: true, pathRewrite: { '^/apis': '' }, logLevel: 'debug', }, '/sjdz': { - target: 'http://125.70.11.26:4303', + target: 'https://cdcgzgf.cn:13200', changeOrigin: true, pathRewrite: { '^/sjdz': '' }, logLevel: 'debug', + secure: false, }, - } as Record; diff --git a/src/assets/images/SecurityServiceOverview/right/blueBg.png b/src/assets/images/SecurityServiceOverview/right/blueBg.png index 28e0f4e7e4f222e0beb50ef9ed06bbc9ba5b3415..fc227b9e43a095421545e52589f89246d2f3e751 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/blueBg.png and b/src/assets/images/SecurityServiceOverview/right/blueBg.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/blueIcon.png b/src/assets/images/SecurityServiceOverview/right/blueIcon.png index 6e78b96b8792a87495c5ff7c088da9071a7b9495..8dc69fd07dd5da01620de1ac0bec8021a63adaa3 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/blueIcon.png and b/src/assets/images/SecurityServiceOverview/right/blueIcon.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/orangeBg.png b/src/assets/images/SecurityServiceOverview/right/orangeBg.png index 71bbfdb10ecfb64e1fdbef715a0aaa3725c44a58..e19fe0804e967e6b207160142161b723de16b7f6 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/orangeBg.png and b/src/assets/images/SecurityServiceOverview/right/orangeBg.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/orangeIcon.png b/src/assets/images/SecurityServiceOverview/right/orangeIcon.png index 4c4da3d673317fd110d8b0538470be055feb7c9b..dc94e3a97dce53c396054529644c2f52092fe7ad 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/orangeIcon.png and b/src/assets/images/SecurityServiceOverview/right/orangeIcon.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/redBg.png b/src/assets/images/SecurityServiceOverview/right/redBg.png index 1a2b88d25f12039400177cbad9df58ee776a2b0b..4bada3c8a8d090074f463251602f8d33fc63fb99 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/redBg.png and b/src/assets/images/SecurityServiceOverview/right/redBg.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/redIcon.png b/src/assets/images/SecurityServiceOverview/right/redIcon.png index 41062d72b9015e8fd20f77a99b8b9a9e841ffb4f..d44639b8302c00b549194b770116973cb4120ffa 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/redIcon.png and b/src/assets/images/SecurityServiceOverview/right/redIcon.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/yellowBg.png b/src/assets/images/SecurityServiceOverview/right/yellowBg.png index 7d0a8d69ed7a0b88b4e67d36d89dfe04c95ba73f..b83d5f06c7c88f652599779b59c4e27fd3806846 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/yellowBg.png and b/src/assets/images/SecurityServiceOverview/right/yellowBg.png differ diff --git a/src/assets/images/SecurityServiceOverview/right/yellowIcon.png b/src/assets/images/SecurityServiceOverview/right/yellowIcon.png index 6ac81f3f89c464be92779929fdf614b8092c6e4c..3a381a3712e3aa1bb07b6b085c9a069e2e24555a 100644 Binary files a/src/assets/images/SecurityServiceOverview/right/yellowIcon.png and b/src/assets/images/SecurityServiceOverview/right/yellowIcon.png differ diff --git a/src/components/CommonTable/index.less b/src/components/CommonTable/index.less index d3c13dad8ae22fb52ed92a50daf4c807927378dd..59ae7775e9cc01c243cdd8ae3b9cb2e8375989ed 100644 --- a/src/components/CommonTable/index.less +++ b/src/components/CommonTable/index.less @@ -131,6 +131,8 @@ } } } + + .tablewrap { .rowStyle { height: 50px !important; diff --git a/src/components/CommonTable/index.tsx b/src/components/CommonTable/index.tsx index 7fa98831638931009b223ffb04925fab65ca13e5..9335e08fa30b8800bbbee049e28734d29edeef83 100644 --- a/src/components/CommonTable/index.tsx +++ b/src/components/CommonTable/index.tsx @@ -12,6 +12,7 @@ const CommonTable = (props: TableConfig & TableProps) => { headerBg: '#103c62', borderColor: '#103c62', headerSplitColor: '#103c62', + }, }, }} diff --git a/src/components/CooglMap b/src/components/CooglMap index 1f3cb371f05700cca688344ace93a445163dc800..2e4a7a9a3ca2392e958572526106c4669665b04c 160000 --- a/src/components/CooglMap +++ b/src/components/CooglMap @@ -1 +1 @@ -Subproject commit 1f3cb371f05700cca688344ace93a445163dc800 +Subproject commit 2e4a7a9a3ca2392e958572526106c4669665b04c diff --git a/src/components/DescriptionItem/index.tsx b/src/components/DescriptionItem/index.tsx index 93d355424950fe64ce1ae87755842d222893530c..c9c647a8fcb17b75a06b2bca15a541ee0c00c0d4 100644 --- a/src/components/DescriptionItem/index.tsx +++ b/src/components/DescriptionItem/index.tsx @@ -1,5 +1,5 @@ import { Space } from 'antd'; -import React, { CSSProperties } from 'react'; +import React, { CSSProperties, memo } from 'react'; import CountUp from 'react-countup'; import styles from './index.less'; @@ -17,7 +17,7 @@ interface DescriptionItemProps { onClick?: () => void; } -const DescriptionItem: React.FC = (props) => { +const DescriptionItem: React.FC = memo((props) => { const { value, name, @@ -74,6 +74,6 @@ const DescriptionItem: React.FC = (props) => { )} ); -}; +}); export default DescriptionItem; diff --git a/src/components/LabelImgText/index.tsx b/src/components/LabelImgText/index.tsx index 4fe6ee6297daa29f333760315653af378b550380..a76fbfd4c9d5843eeee343ae135d3143df6c3ed1 100644 --- a/src/components/LabelImgText/index.tsx +++ b/src/components/LabelImgText/index.tsx @@ -42,6 +42,7 @@ const LabelImgText: React.FC = (props) => { {value} diff --git a/src/pages/Common/Event/CgftEvent/index.tsx b/src/pages/Common/Event/CgftEvent/index.tsx index 33f7b0603b2990671953c9f9c2e3b0cd919c3c65..52b2d3a13c0047bcb6d8a6744e9d6f1e79979fcc 100644 --- a/src/pages/Common/Event/CgftEvent/index.tsx +++ b/src/pages/Common/Event/CgftEvent/index.tsx @@ -12,7 +12,7 @@ import { useEffect, useRef, useState } from 'react'; import styles from './index.less'; import LineCharts from './LineCharts'; -const CgftEvent = ({singleType}: {singleType: string}) => { +const CgftEvent = ({ singleType }: { singleType: string }) => { // 事件详情弹窗 const [detailModalOpt, setDetailModalOpt] = useState<{ open: boolean; @@ -25,7 +25,8 @@ const CgftEvent = ({singleType}: {singleType: string}) => { }); // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -96,12 +97,16 @@ const CgftEvent = ({singleType}: {singleType: string}) => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); }; @@ -250,10 +255,21 @@ const CgftEvent = ({singleType}: {singleType: string}) => { itemkey={'key'} items={importEventStatistics} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( { }); // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -111,12 +112,16 @@ const CitizenComplaint = ({collectionMode}: {collectionMode: string}) => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); }; @@ -245,10 +250,21 @@ const CitizenComplaint = ({collectionMode}: {collectionMode: string}) => { itemkey={'key'} items={defalutTabItems} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( { - const { type, extra } = props; - - // 事件详情弹窗 - const [detailModalOpt, setDetailModalOpt] = useState<{ - open: boolean; - title: string; - eventId: string; - }>({ - open: false, - title: '', - eventId: '', - }); - - // tabs内容 - const defalutTabItems = [ - { - key: '1', - label: '全部', - }, - { - key: '2', - label: '处置中', - }, - { - key: '3', - label: '已办结', - }, - ]; - - // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 - - // 类别分析参数 - const categoryTopAnalysisParams = { - - } - - const params = { - page: 1, - count: 10, - caseStatus: '', - eventType: '', - isDispose: '1', - }; - - //事件列表 - const [listData, setListData] = useState({ - items: [], - loading: true, - total: 0, - page: 1, - hasNext: false, - }); - - const [fetchParams, setFetchParams] = useState(params); - - const [eventStatistics, setEventStatistics] = useState({}); - const [categoryStatistics, setCategoryStatistics] = useState([]); - const [areaStatistics, setAreaStatistics] = useState([]); - const [importEventStatistics, setImportEventStatistics] = useState([]); - - // 获取左侧顶部事件相关统计 - const getCityStatistics = () => { - const params = { - eventType: '', - type: '', - time: '', - singleType: '', - }; - if (type !== '3') { - params.singleType = type; - } - services.CityProblemApi.getContentStatisticsApi(params).then((res) => { - if (res.code === 200) { - setEventStatistics(res.data); - } - }); - }; - - // 高发类别统计 - const getCategoryAnalysis = (category = 'mainClass') => { - const params = { - category: category, - top: 3, - singleType: '', - }; - if (type !== '3') { - params.singleType = type; - } - services.CityProblemApi.getCategoryTopAnalysisApi(params).then((res) => { - if (res.code === 200) { - setCategoryStatistics(res.data); - } - }); - }; - - const onChangeCategory = (value: string) => { - console.log('onChangeCategory', value); - getCategoryAnalysis(value); - }; - - // 高发类别统计 - const getAreaAnalysis = () => { - const params = { - region: 'district', - type: '', - time: '', - top: 3, - singleType: '', - }; - if (type !== '3') { - params.singleType = type; - } - services.CityProblemApi.getAreaDistribAnalysisApi(params).then((res) => { - if (res.code === 200) { - setAreaStatistics(res.data); - } - }); - }; - - // 事件列表 - const getEventsList = ( - caseStatus = '', - isDispose = '', - eventType = '', - isOther = '', - collectionModel = '', - ) => { - const params = { - page: 1, - count: 10, - singleType: '', - caseStatus: caseStatus, - isDispose: isDispose, - eventType: eventType, - isOther: isOther, - collectionModel, - }; - if (type !== '3') { - params.singleType = type; - } - if (extra?.eventType) { - params.eventType = extra.eventType; - } - if (extra?.isOther) { - params.isOther = extra.isOther; - } - if (extra?.collectionModel) { - params.collectionModel = extra.collectionModel; - } - services.CityProblemApi.getZzEventListApi(params).then((res) => { - if (res.code === 200) { - setListData({ ...res.data, items: res.data.items }); - } - }); - }; - - // 事件统计 - const getImportEventStatistics = () => { - const params = { - singleType: type, - }; - services.CityProblemApi.getImportEventStatisticsApi(params).then((res) => { - if (res.code === 200) { - const result = res.data.map((item:any) => { - return { - label: `${item.case_status_name} ${item.total}`, - key: item.case_status, - }; - }); - setImportEventStatistics(result); - if (type === '3') { - getEventsList(); - } else { - getEventsList(result[0]?.key); - } - } - }); - }; - - const changeListTab = (value: string) => { - console.log(value); - getEventsList(value); - }; - - const changeTab = (value: string) => { - if (value === '1') { - getEventsList(); - } else if (value === '2') { - getEventsList('90'); - } else if (value === '3') { - getEventsList('', '1'); - } - }; - - useEffect(() => { - getCityStatistics(); - getCategoryAnalysis(); - getAreaAnalysis(); - getImportEventStatistics(); - }, []); - - return ( - - - - - - - - {eventStatistics.disposalNum} - - - - 处置中 - - - - - {eventStatistics.caseClosedNum} - - - - 已办结 - - - - {eventStatistics.ratio} - % - - 办结率 - - - - - -
- -
-
- - - } - data={categoryStatistics} - strokeColor={{ - '0%': '#38F2E3', - '100%': '#3DC3FF', - }} - /> - - -
-
- - - {type === '3' ? ( - - ) : ( - - )} - - setViewType(type)} /> - - - {viewType === 'list' ? ( - { - setFetchParams({ - ...fetchParams, - page: data.pageNum, - count: data.pageSize, - }); - }} - handleDetail={(details) => { - setDetailModalOpt({ - open: true, - title: '事件详情', - eventId: details.eventId, - }); - }} - /> - ) : ( - { - setFetchParams({ ...fetchParams, page: data.page }); - }} - handleDetail={(details) => { - setDetailModalOpt({ - open: true, - title: '事件详情', - eventId: details.eventId, - }); - }} - /> - )} -
- - setDetailModalOpt({ open: false, title: '', eventId: '' }) - } - width={'fit-content'} - height={950} - > - - -
- ); -}; - -export default CommonList; diff --git a/src/pages/Common/Event/EventDetail/DirectEventDetail/index.less b/src/pages/Common/Event/EventDetail/DirectEventDetail/index.less index e25868bcb71edfdaf315742ff90bed1119d6e883..43007fdf3e46dedbaac2af54b3454c92b52a78db 100644 --- a/src/pages/Common/Event/EventDetail/DirectEventDetail/index.less +++ b/src/pages/Common/Event/EventDetail/DirectEventDetail/index.less @@ -1,5 +1,6 @@ .wrap { width: 1465px; + height: 100%; } .node { @@ -23,8 +24,8 @@ } .infoWrap { - max-height: 700px; - margin: 27px 0 10px; + height: calc(100% - 93px); + padding-top: 23px; } .info { @@ -104,7 +105,7 @@ line-height: 80px; } - >.item { + > .item { width: 226px; height: 188px; // background: rgba(255, 255, 255, 0.5); @@ -261,4 +262,4 @@ transform: scale(1.1); } } -} \ No newline at end of file +} diff --git a/src/pages/Common/Event/EventDetail/DirectEventDetail/index.tsx b/src/pages/Common/Event/EventDetail/DirectEventDetail/index.tsx index cf8e921fa24e60b050dead7b4c714dd1e434a387..5da3ffb134c34bad35490d63c96964872946cc57 100644 --- a/src/pages/Common/Event/EventDetail/DirectEventDetail/index.tsx +++ b/src/pages/Common/Event/EventDetail/DirectEventDetail/index.tsx @@ -120,6 +120,7 @@ const DirectEventDetail: React.FC = ({ }.png`)} className={styles.icon} /> + = ({ preLabel="处置时限" color="rgb(255, 255, 255)" /> - {/* */} @@ -157,9 +154,6 @@ const DirectEventDetail: React.FC = ({ > {it?.personName && ( <> - {/* - {it.supervisionLevelText} - */} = (props) => {
- - {eventBaseInfo?.standardEventTitle} - - {String(eventBaseInfo?.eventType) == '3' && ( - - - 诚管24 - - )} + +
+ {eventBaseInfo?.standardEventTitle} +
+ {String(eventBaseInfo?.eventType) == '3' && ( + + + 诚管24 + + )} +
{reportShow && (
div { width: 50%; @@ -10,7 +11,7 @@ .transferWrap { height: 100%; - + border-radius: 20px; overflow: hidden; } diff --git a/src/pages/Common/Event/GeneralSituation/index.less b/src/pages/Common/Event/GeneralSituation/index.less index 27b22a20ed7abc5cadfd877ccf7fd63f77779864..9cf89a25d32530440f00b3b7933c61972fb20ed3 100644 --- a/src/pages/Common/Event/GeneralSituation/index.less +++ b/src/pages/Common/Event/GeneralSituation/index.less @@ -25,7 +25,7 @@ } } .right { - flex: 1; + width: calc(100% - 440px); :global { .ant-select-selector { background: rgb(50, 111, 167) !important; diff --git a/src/pages/Common/Event/GeneralSituation/index.tsx b/src/pages/Common/Event/GeneralSituation/index.tsx index cf84733dffef879f6734b7f63e382d8e1c08ec79..2a9ddf6d2d67b8cba37fd4f7ea562309c9e0b28a 100644 --- a/src/pages/Common/Event/GeneralSituation/index.tsx +++ b/src/pages/Common/Event/GeneralSituation/index.tsx @@ -37,7 +37,8 @@ const GeneralSituation = () => { const [eventType, setEventType] = useState() // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -60,12 +61,16 @@ const GeneralSituation = () => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); }; @@ -354,10 +359,21 @@ const GeneralSituation = () => { value={eventType} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( void; +} +const LimitTime: React.FC = (props) => { + const { + endTime, + progressShow = false, + startTime, + timeText, + handleIsTime, + } = props; + const [percent, setPercent] = useState(0); + const formatDate = useRef('mm 分 ss秒'); //时间日期格式 + const [isTimeout, setIsTimeout] = useState(false); //判断是否超时 + let strokeColor = useRef('#87bfff'); + let timer: any; + //根据时间规则显示 + const judeTimer = (stamp: number) => { + if (stamp <= 60) { + //小于1分钟,显示ss秒 + return 'ss秒'; + } + if (stamp > 60 && stamp <= 3600) { + //超过一分钟不足一小时,显示:mm:ss + return 'mm 分 ss秒'; + } + if (stamp > 3600 && stamp <= 86400) { + //超过一小时不足一天,显示:hh:mm + return ' HH 时 mm秒'; + } + if (stamp >= 86400) { + //超过一天,显示:DD:hh + return ' DD 天 HH时'; + } + }; + + useEffect(() => { + let startStamp = new Date(startTime).getTime(); //获取事件开始时间戳 + let endStamp = new Date(endTime).getTime(); //获取事件截止时间戳 + progressAnimation(startStamp, endStamp); + if (progressShow) { + //显示时间动态进度条 + timer = setInterval(() => { + progressAnimation(startStamp, endStamp); + if (percent < 0) { + //进度条为0 + clearInterval(timer); + } + }, 3000); + } + return () => { + clearInterval(timer); + }; + }, [endTime]); + + //进度条计算 + const progressAnimation = (startStamp: number, endStamp: number) => { + //开始日期/结束日期 + let nowStamp = new Date().getTime(); //获取当前时间戳 + let processingTime = endStamp - nowStamp; //剩余处理时间,进度条倒计时间 + let periodTime = endStamp - startStamp; //截止时间-开始时间的时间戳,处理时段 + if (processingTime < 0) { + //已超时 + strokeColor.current = '#f00'; + setIsTimeout(true); + handleIsTime?.(true); + return; + } + setIsTimeout(false); + handleIsTime?.(false); + strokeColor.current = '#0a0'; + setPercent(() => { + let remainderProgress = processingTime / periodTime; //剩余时间,进度条时间比例 + formatDate.current = judeTimer(processingTime * 0.001); //根据时间是规则显示 + const newPercent = remainderProgress * 100; //当前时间/总量时间,划分秒 + if (newPercent < 0) { + return 0; + } + return newPercent; + }); + }; + + //progressShow和普通计时器显示的设定 + let countDownConfig = { + prefixText: '剩余:', + valueStyle: { fontSize: '14px', color: '#0a0' }, + }; + + if (progressShow) { + //详情中展示进度条 + countDownConfig = { + prefixText: `办理截止日期:${endTime} 剩余:`, + valueStyle: { fontSize: '12px', color: '#f1f2f3' }, + }; + } + if (endTime) { + return ( +
+ {progressShow && ( + + )} +
+ {isTimeout ? ( + 已超 {timeText || '1分钟'} + ) : ( + + )} +
+
+ ); + } + return <>; +}; +export default LimitTime; diff --git a/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.less b/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.less new file mode 100644 index 0000000000000000000000000000000000000000..1105222fdcd3272138b066c0ce5ee7ca6e9bba2d --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.less @@ -0,0 +1,256 @@ +.headerTitle { + width: 100%; + height: 58px; + background-size: contain; + + .titleWrap { + color: rgb(179, 214, 247); + font-size: 20px; + font-weight: 700; + margin-left: 8px; + } +} + +.circleIcon { + width: 22px; + margin-right: 6px; +} + +.sortIcon { + font-size: 18px; + width: 32px; + height: 32px; + cursor: pointer; + background: rgba(122, 186, 255, 0.2); + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + + color: #5795cf; +} + +.active { + background: rgba(122, 186, 255, 0.4); + color: #fff; +} + +.culationWrap { + height: 100%; + border-radius: 20px; + padding: 20px; + box-sizing: border-box; + background: rgba(57, 122, 183, 0.238); +} + +.culationContent { + padding: 20px; + max-height: calc(100% - 60px); + overflow: auto; + box-sizing: border-box; + display: flex; + flex-direction: column; + + .result { + color: #fff; + background: rgba(57, 122, 183, 40%); + + border-radius: 16px; + text-align: center; + display: flex; + flex-direction: column; + justify-content: center; + padding: 15px 10px; + + .status { + font-size: 22px; + color: #ffffff; + font-weight: bold; + margin-bottom: 6px; + } + + .timeInfotext { + font-size: 14px; + color: #e0edff; + display: flex; + align-items: center; + + .dept { + flex: 1; + margin-left: 10px; + } + } + } + + .record_item { + display: flex; + flex-direction: column; + + .flow { + display: flex; + justify-content: center; + position: relative; + + img{ + width: 50px; + height: 30px; + margin: 10px 0; + } + .down { + transform: rotateZ(180deg); + } + } + + .timeDes { + display: flex; + text-align: center; + min-width: fit-content; + height: 26px; + top: 50%; + left: 50%; + margin-left: 34px; + margin-top: -14px; + align-items: center; + padding: 4px 6px; + position: absolute; + font-size: 14px; + color: #fff; + background: rgba(133, 158, 255, 0.44); + border-radius: 6px; + + &::before { + position: absolute; + display: inline-block; + content: ''; + width: 0; + height: 0; + border-top: 10px solid transparent; + border-right: 10px solid rgba(133, 158, 255, 0.44); + border-bottom: 10px solid transparent; + left: -10px; + } + } + } + + .culationItems { + padding: 20px; + border-radius: 16px; + background: rgba(57, 122, 183, 30%); + + display: flex; + justify-content: space-between; + align-items: center; + gap: 28px; + + .info { + flex: 1; + line-height: 28px; + } + + .role { + color: rgb(255, 255, 255); + + font-size: 20px; + font-weight: 700; + } + + .time { + font-size: 16px; + color: rgb(255, 255, 255); + + padding: 4px 0; + } + + .speed { + display: inline-block; + width: 185px; + height: 26px; + line-height: 26px; + color: #64a5fb; + font-size: 14px; + padding: 0 10px; + background: #d8ebff; + border-radius: 13px; + } + + .status { + min-height: 36px; + border-radius: 20px; + width: 84px; + line-height: 24px; + padding: 6px 6px; + text-align: center; + background: rgba(129, 193, 255, 23%); + color: rgb(116, 187, 255); + + font-size: 18px; + font-weight: 700; + } + + .deal_evaluate { + min-width: 70%; + background: #cee4ff; + transform: scale(0.9); + transform-origin: 0; + padding: 4px; + border-radius: 10px; + color: #66717f; + cursor: pointer; + } + + .remark { + color: #fff; + font-size: 15px; + } + + .event_attachment { + //办理附件 + display: flex; + align-items: center; + margin-top: 4px; + + .attachment { + color: #fff; + margin-right: 4px; + } + + .icon { + color: #016bff; + font-size: 20px; + margin-left: 6px; + cursor: pointer; + } + } + } +} + +.asc { + //倒叙,默认是按照Z->A,当设置为A->Z,反转flex列 + flex-direction: column-reverse !important; +} + +.eventAttachment { + //办理附件 + display: flex; + align-items: center; + margin-top: 4px; + + .attachment { + color: #fff; + margin-right: 4px; + } + + .icon { + color: #016bff; + font-size: 20px; + margin-left: 6px; + cursor: pointer; + } +} + +.leftIcon { + width: 60px; + border-radius: 50%; + height: 60px; + background: rgba(82, 181, 241, 27%); +} \ No newline at end of file diff --git a/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.tsx b/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.tsx new file mode 100644 index 0000000000000000000000000000000000000000..2da34b1590ebcc29052dc02d8597acf8a2d098c5 --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/Casecirculation/index.tsx @@ -0,0 +1,294 @@ +//案件流转记录(办理经过) +import services from '@/services'; +import { imageOptions } from '@/utils/comm'; +import { getSession, setSession } from '@/utils/session'; +import { IMG_URL } from '@/utils/variables'; +import { + FileWordTwoTone, + SortAscendingOutlined, + SortDescendingOutlined, +} from '@ant-design/icons'; +import { Flex, Image, message, Popover, Space } from 'antd'; +import classNames from 'classnames'; +import { + forwardRef, + useEffect, + useImperativeHandle, + useMemo, + useState, +} from 'react'; +import { propsType } from '..'; +import styles from './index.less'; +import LimitTime from './LimitTime'; + +export type CulationComponentRef = { + queryCirculationRecord: () => void; + getLastCasecirculationId: API.CulationType; //案件流转记录最新 +}; + +interface culationProps { + eventId: string; //案件id + pretreatmentType?: string; + eventType?: propsType['eventType']; + casecirculationRecordData?: any[]; //流转记录 + eventInfo: any +} +export type SortDto = 'asc' | 'des'; //排序方式 +const CulationComponent = forwardRef( + (props, ref) => { + useImperativeHandle(ref, () => ({ + queryCirculationRecord, //查询案件流转 + getLastCasecirculationId: getLastCasecirculationId, + })); + + const { + eventId, + pretreatmentType = '', + eventType, + casecirculationRecordData, + eventInfo + } = props; + const [isTimeout, setIsTimeout] = useState(false); //判断是否超时 + const [casecirculationRecord, setCasecirculationRecord] = useState< + API.CulationType[] + >([]); //案件流转记录 + const [recordSort, setRecordSort] = useState( + getSession('recordSort') || 'des', + ); //流转记录排序 + + useEffect(() => { + if (casecirculationRecordData) { + setCasecirculationRecord(casecirculationRecordData); + } else { + queryCirculationRecord(); + } + }, [casecirculationRecordData]); + + //最新的案件流转记录 + const getLastCasecirculationId = useMemo(() => { + return casecirculationRecord[casecirculationRecord?.length - 1]; + }, [casecirculationRecord]); + + //查询案件流转 + const queryCirculationRecord = () => { + if (eventType === 'pretreatment') { + //预处理 + services.PreEventQuery.getCaseCirculationRecord({ + caseId: String(eventId), + pretreatmentType, + }).then((res) => { + if (res.code === 200) { + setCasecirculationRecord(res.data); + } + }); + } else { + //通用 + services.DealQuery.getCaseCirculationRecord(String(eventId)).then( + (res) => { + if (res.code === 200) { + setCasecirculationRecord(res.data); + } + }, + ); + } + }; + + const caseResult = casecirculationRecord[casecirculationRecord?.length - 1]; //流转结果 + const record = casecirculationRecord + .slice(0, casecirculationRecord?.length - 1) + .reverse(); //流转记录 + //查看文件下载 + const handleFileCheck = (path: string) => { + let btn: any = document.createElement('a'); + btn.target = '_blank'; + btn.download = path; //文件类型 + btn.href = path; + btn.click(); + btn = null; + window.setTimeout(function () { + message.success('下载完成'); + }, 2000); + }; + //设置排序方式 + const handleChangeSort = (type: SortDto) => { + setSession('recordSort', type); //缓存流转记录的排序方式 + setRecordSort(type); + }; + return ( +
+ +
+ 办理经过 +
+ + + {/*
handleChangeSort('asc')} + > + +
+
handleChangeSort('des')} + > + +
*/} +
+
+ +
+ {/*
+ + {eventInfo?.operation ?? eventInfo?.caseStatusName} + + {!caseResult?.operationType && ( + setIsTimeout(flag)} + endTime={caseResult?.disposeDeadline} + progressShow + startTime={caseResult?.createTime} + timeText={caseResult?.remainingTimeText} + /> + )} +

+ 节点耗时:{caseResult?.consumptionTimeText}  + {caseResult?.processingTimeLimitText && ( + <> + 节点办理时限: + {caseResult?.processingTimeLimitText} + + )} + {caseResult?.processingCenter && ( + + + 节点办理单位:{caseResult?.processingCenter} + + + )} +

+
*/} + + {/* 流转 */} + {eventInfo?.eventCirculationRecords && + eventInfo?.eventCirculationRecords.map((item, index) => ( +
+ { +
+ {/* {recordSort === 'asc' ? ( + + ) : ( + + )} */} + {/* {record[index - 1]?.consumptionTimeText && ( + + {record[index - 1]?.consumptionTimeText} + + )} */} + { + index !== 0 && + } +
+ } +
+ + + + + + +
+ {item.person && ( +
+

{item.person}

+
+ )} +

{item?.recTime}

+
+
+ {/* 备注 */} + {item.remarks && ( +
备注:{item.remarks}
+ )} + + {/* 上报不显示附件 */} + {item?.eventAttachmentInfos && + item.operationType !== '上报' && ( +
+ 办理附件: + {item?.eventAttachmentInfos?.map( + (attachment, index: number) => { + if (attachment?.fileType === '图片') { + return ( + + ); + } else { + return ( + + handleFileCheck( + attachment?.attachmentPath, + ) + } + key={index} + /> + ); + } + }, + )} +
+ )} +
+ {item?.operation || item?.caseStatusName} +
+
+ ))} +
+
+ ); + }, +); +export default CulationComponent; diff --git a/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.less b/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.less new file mode 100644 index 0000000000000000000000000000000000000000..837bc71793d4d85789837ff07d4a84fb1bc5876d --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.less @@ -0,0 +1,105 @@ +.leftWrap { + flex: 1; + margin-right: 20px; + display: flex; + margin-right: 15px; + height: 100%; + flex-direction: column; +} + +.picList { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + gap: 10px; + border-radius: 20px; + overflow: hidden; + + > div { + flex: 1; + height: 100%; + position: relative; + overflow: hidden; + } + + .imgTag { + height: 40px; + line-height: 40px; + color: #2e3032; + background: rgba(255, 255, 255, 0.6); + border-radius: 20px; + position: absolute; + bottom: 20px; + left: 15px; + z-index: 222; + font-size: 16px; + padding: 0 10px; + } +} + +.eventPicWrap { + margin-bottom: 15px; + position: relative; + + .sourceLabel { + width: fit-content; + height: 40px; + line-height: 40px; + margin-bottom: 20px; + border-radius: 20px; + background: rgba(44, 106, 163, 0.8); + z-index: 222; + color: #fff; + font-size: 16px; + padding: 0 10px; + position: absolute; + top: 20px; + left: 20px; + } + + .eventImgWrap { + width: 100%; + height: 480px; + border-radius: 20px; + overflow: hidden; + display: flex; + } +} + +.eventInfo { + width: 100%; + min-height: 220px; + padding: 20px; + flex: 1; + border-radius: 20px; + + background: rgba(57, 122, 183, 20%); + + .title { + max-width: 315px; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + font-size: 20px; + color: #fff; + font-weight: 700; + } + + //城管24Tag + .cgtfTag { + display: inline-block; + width: 85px; + height: 30px; + background: linear-gradient(90deg, #fb5e7b 0%, #ff80a0 100%); + border-radius: 8px 2px 8px 8px; + font-size: 16px; + color: #ffffff; + margin-left: 6px; + + img { + width: 28px; + padding-top: 2px; + } + } +} diff --git a/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.tsx b/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.tsx new file mode 100644 index 0000000000000000000000000000000000000000..d6ee8bbf5c22f08f2c2e9cd568d5449e13bf8241 --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/EventLeftInfo/index.tsx @@ -0,0 +1,142 @@ +import LabelImgText from '@/components/LabelImgText'; +import { imageOptions, joinPictureHttp } from '@/utils/comm'; +import { Carousel, Flex, Image } from 'antd'; +import classNames from 'classnames'; +import styles from './index.less'; +type propsType = { + eventInfo: API.EventDetailDto; + reportShow?: boolean; + imgHeight?: number; //图片高度 + setModal?: (flag: boolean) => void; +}; +const EventLeftInfo: React.FC = (props) => { + const { reportShow = true, eventInfo, imgHeight = 560 } = props; + let eventBaseInfo:any = eventInfo; //事件基本信息 + let eventAttachment = eventInfo?.eventAttachment; //事件图片 + const valueStyle = { + color: 'rgb(255, 255, 255)', + fontSize: 16, + }; + console.log(22222222, eventInfo) + return ( +
+
+
+
+ {/* 处置前 */} + {/* {eventAttachment?.preHandleAttachmentInfos?.length > 0 ? ( + + {eventAttachment?.preHandleAttachmentInfos?.map((item) => { + return ( +
+ +
+ ); + })} +
+ ) : ( + + )} */} + +
+ + {eventAttachment?.handledAttachmentInfos?.length > 0 && ( +
+ 处置后 + + {eventAttachment?.handledAttachmentInfos?.map((item) => { + return ( +
+ +
+ ); + })} +
+
+ )} +
+
+
+ +
+ {eventBaseInfo?.standardEventTitle} +
+
+ {reportShow && ( +
+ + + + +
+ )} +
+
+ ); +}; + +export default EventLeftInfo; diff --git a/src/pages/Common/Event/KeyAreaEventDetail/index.less b/src/pages/Common/Event/KeyAreaEventDetail/index.less new file mode 100644 index 0000000000000000000000000000000000000000..7d1b08d2c71a9fd4f2b25464f01ba0890a2aecc4 --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/index.less @@ -0,0 +1,16 @@ +.eventContent { + width: 1100px; + height: 100%; + display: flex; + + > div { + width: 50%; + } + + .transferWrap { + height: 100%; + + border-radius: 20px; + overflow: hidden; + } +} diff --git a/src/pages/Common/Event/KeyAreaEventDetail/index.tsx b/src/pages/Common/Event/KeyAreaEventDetail/index.tsx new file mode 100644 index 0000000000000000000000000000000000000000..5f7d122a93167a8fdb00cd2064ed1c30f1f88664 --- /dev/null +++ b/src/pages/Common/Event/KeyAreaEventDetail/index.tsx @@ -0,0 +1,77 @@ +/** + * 重点区域事件, 事件详情 + */ +import services from '@/services'; +import { + forwardRef, + useEffect, + useImperativeHandle, + useRef, + useState, +} from 'react'; +import Casecirculation, { CulationComponentRef } from './Casecirculation'; +import EventLeftInfo from './EventLeftInfo'; +import styles from './index.less'; +export type propsType = { + eventId: string; + pretreatmentType?: string; //查询预处理案件流转 + eventType?: 'pretreatment' | 'comm'; //区分是预处理还是通用,预处理接口不一样,里面数据一样 +}; + +export type EventDetailRef = { + handleRefresh: () => void; + lastcasecirculationRecord: API.CulationType; +}; + +const KeyAreaEventDetail = forwardRef((props, ref) => { + const { eventId, pretreatmentType, eventType = 'comm' } = props; + const casecirculationRef = useRef(null); + + const [eventDetail, setEventDetail] = useState(); //事件详情 + + //查询事件基本信息 + const queryEventBaseApi = () => { + services.Physicalsign.getKeyAreaEventDetail(eventId).then((res) => { + // @ts-ignore + setEventDetail(res.data); + }); + }; + + //刷新数据 + const handleRefresh = () => { + queryEventBaseApi(); + casecirculationRef.current?.queryCirculationRecord(); //查询流转记录 + }; + + useImperativeHandle(ref, () => ({ + handleRefresh, + lastcasecirculationRecord: casecirculationRef.current + ?.getLastCasecirculationId as API.CulationType, + })); + + + useEffect(() => { + queryEventBaseApi(); + }, [eventId]); + + return ( +
+ {eventDetail && ( + <> + +
+ +
+ + )} +
+ ); +}); + +export default KeyAreaEventDetail; diff --git a/src/pages/Common/Event/OtherEvent/index.tsx b/src/pages/Common/Event/OtherEvent/index.tsx index 167ae866a5bcc5d53a811eb31d9270f029f9a9bb..d8159fcae07b57dd7ef1ad3ab0ac43b00ddb32ee 100644 --- a/src/pages/Common/Event/OtherEvent/index.tsx +++ b/src/pages/Common/Event/OtherEvent/index.tsx @@ -25,7 +25,8 @@ const OtherEvent = ({isOther}: {isOther: string}) => { }); // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -111,12 +112,16 @@ const OtherEvent = ({isOther}: {isOther: string}) => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); }; @@ -245,10 +250,21 @@ const OtherEvent = ({isOther}: {isOther: string}) => { itemkey={'key'} items={defalutTabItems} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( { - - +import { useMemo } from 'react'; +const LineCharts = ({ + data, + orangeData, + yellowData, + ybData, +}: { + data?: any[]; + orangeData?: any[]; + yellowData: any[]; + ybData?: any[]; +}) => { const option = useMemo(() => { - - const showXAis = false + const showXAis = true; return { xAxis: { type: 'category', boundaryGap: false, show: showXAis, - data: showXAis ? data?.map(item=>item.name) : [], + data: showXAis ? data?.map((item) => item.name) : [], axisLabel: { color: '#CBEDFF', - interval: 0 // 设置为0以显示所有坐标点 + interval: 0, // 设置为0以显示所有坐标点 }, axisLine: { show: false, @@ -25,17 +32,17 @@ const LineCharts = ({data}:{data?:any[]}) => { show: false, }, grid: { - left: '5%', // 左边距 + left: '5%', // 左边距 right: '5%', // 右边距 - top: '10%', // 上边距 - bottom: '30%' // 下边距 + top: '10%', // 上边距 + bottom: '30%', // 下边距 }, tooltip: { trigger: 'axis', axisPointer: { type: 'line', lineStyle: { - color: 'rgba(255,255,255,.5)', + color: 'rgba(255,255,255,0.5)', width: 2, }, }, @@ -43,10 +50,100 @@ const LineCharts = ({data}:{data?:any[]}) => { series: [ { data: data, - symbol: "none", + symbol: 'none', + type: 'line', + lineStyle: { + color: 'rgb(235, 106, 106)', + }, + + areaStyle: { + // 区域填充样式。设置后显示成区域面积图。 + color: { + type: 'linear', + x: 0, + y: 1, + x2: 0, + y2: 0.2, + colorStops: [ + { + offset: 0, + color: 'rgba(235, 106, 106, 0)', // 100% 处的颜色 + }, + { + offset: 1, + color: 'rgb(235, 106, 106)', // 0% 处的颜色 + }, + ], + global: false, // 缺省为 false + }, + }, + }, + { + data: orangeData, + symbol: 'none', + type: 'line', + lineStyle: { + color: '#f69552', + }, + + areaStyle: { + // 区域填充样式。设置后显示成区域面积图。 + color: { + type: 'linear', + x: 0, + y: 1, + x2: 0, + y2: 0.2, + colorStops: [ + { + offset: 0, + color: 'rgba(246, 149, 82, 0)', // 100% 处的颜色 + }, + { + offset: 1, + color: 'rgb(246, 149, 82)', // 0% 处的颜色 + }, + ], + global: false, // 缺省为 false + }, + }, + }, + { + data: yellowData, + symbol: 'none', + type: 'line', + lineStyle: { + color: '#f69552', + }, + + areaStyle: { + // 区域填充样式。设置后显示成区域面积图。 + color: { + type: 'linear', + x: 0, + y: 1, + x2: 0, + y2: 0.2, + colorStops: [ + { + offset: 0, + color: 'rgb(240, 200, 94, 0)', // 100% 处的颜色 + }, + { + offset: 1, + color: 'rgb(240, 200, 94)', // 0% 处的颜色 + }, + ], + global: false, // 缺省为 false + }, + }, + }, + { + data: ybData, + symbol: 'none', type: 'line', lineStyle: { - color: "#57EFE5", + color: '#46b2ff', }, areaStyle: { @@ -60,12 +157,11 @@ const LineCharts = ({data}:{data?:any[]}) => { colorStops: [ { offset: 0, - color: 'rgba(87, 239, 229, 0)', // 0% 处的颜色 + color: 'rgb(240, 200, 94, 0)', // 100% 处的颜色 }, - { offset: 1, - color: 'rgba(87, 239, 229, 0.36)', // 100% 处的颜色 + color: '#46b2ff', // 0% 处的颜色 }, ], global: false, // 缺省为 false @@ -73,15 +169,15 @@ const LineCharts = ({data}:{data?:any[]}) => { }, }, ], - } - }, [data]) + }; + }, [data, orangeData, yellowData, ybData]); return ( - ) -} + ); +}; -export default LineCharts \ No newline at end of file +export default LineCharts; diff --git a/src/pages/Common/Event/RiskEvents/index.tsx b/src/pages/Common/Event/RiskEvents/index.tsx index 0b0d27d3d8d0012e93aa7dde150e4ff323d3e993..a95c3485ee9c5be71a744ca55f228a9f38a01765 100644 --- a/src/pages/Common/Event/RiskEvents/index.tsx +++ b/src/pages/Common/Event/RiskEvents/index.tsx @@ -11,15 +11,23 @@ import { colorConfig } from '@/pages/SecurityServiceOverview/SecurityState/Right import services from '@/services'; import { history } from '@umijs/max'; import { useRequest } from 'ahooks'; +import dayjs from 'dayjs'; import { useMemo, useRef, useState } from 'react'; import LineCharts from './LineCharts'; interface RiskEventsProps { statisticsData: any; defaultCategory: string; } - +const map = { + 一般风险: 1, + 黄色风险: 2, + 橙色风险: 4, + 红色风险: 3, +}; const RiskEvents = (props: RiskEventsProps) => { const { statisticsData, defaultCategory } = props; + console.log(statisticsData); + const ref = useRef(); // 事件详情弹窗 const [detailModalOpt, setDetailModalOpt] = useState<{ @@ -31,7 +39,12 @@ const RiskEvents = (props: RiskEventsProps) => { title: '', eventId: '', }); - //事件列表 + const params = { + pageNo: 0, + pageSize: 10, + risklevelid: map[defaultCategory], + }; + const [listData, setListData] = useState({ items: [], loading: true, @@ -39,75 +52,101 @@ const RiskEvents = (props: RiskEventsProps) => { page: 1, hasNext: false, }); - const [fetchParams, setFetchParams] = useState({ - page: 1, - count: 10, - riskLevelCode: defaultCategory, - dateType: 'month', - }); + const [fetchParams, setFetchParams] = useState(params); + const { data } = useRequest( + () => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjxx', + data: { + ...fetchParams, + }, + }), + { + refreshDeps: [fetchParams], + onSuccess: (res) => { + console.log(res?.data?.data); + const data = res?.data?.data; + const list = [ + ...listData?.items, + ...data?.records?.map((item: any) => ({ + ...item, + standardEventTitle: item?.riskdescription, + caseStatusText: item?.status, + reportTime: item?.risktime, + collectionModeName: item?.sourceType, + position: item?.region_name + item?.name, + })), + ]; + + setListData({ + hasNext: list?.length < data?.page?.total, + items: list, + }); + }, + }, + ); const categoryTab = useMemo(() => { return [ { key: 'all', - label: `全部风险 ${statisticsData?.total} 个`, + label: `全部风险 ${statisticsData?.count?.[0]?.num ?? '--'} 个`, }, { key: '红色风险', - label: `红色风险 ${statisticsData?.majorRiskTotal} 个`, + label: `红色风险 ${ + statisticsData?.stat?.find((item) => item?.risklevel === '红色预警') + ?.num || '--' + } 个`, }, { key: '橙色风险', - label: `橙色风险 ${statisticsData?.significantRiskTotal} 个`, + label: `橙色风险 ${ + statisticsData?.stat?.find((item) => item?.risklevel === '橙色预警') + ?.num || '--' + } 个`, }, { key: '黄色风险', - label: `黄色风险 ${statisticsData?.generalRiskTotal} 个`, + label: `黄色风险 ${ + statisticsData?.stat?.find((item) => item?.risklevel === '黄色预警') + ?.num || '--' + } 个`, }, { key: '一般风险', - label: `一般风险 ${statisticsData?.ybfxRiskTotal} 个`, + label: `一般风险 ${ + statisticsData?.stat?.find((item) => item?.risklevel === '一般预警') + ?.num || '--' + } 个`, }, ]; }, [statisticsData]); - //事件列表 - const { data: eventData } = useRequest( - () => services.CityRiskApi.getEventPage(fetchParams), - { - refreshDeps: [fetchParams], - onSuccess: (res) => { - setListData({ - ...res?.data, - items: [ - ...listData.items, - ...res?.data?.items?.map((item: any) => ({ - ...item, - standardEventTitle: item?.eventType, - caseStatusText: item?.currentStatus, - reportTime: item?.warningTime, - collectionModeName: item?.sourceType, - })), - ], - }); + //风险趋势 + const { data: fxqsData } = useRequest(() => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjdjqs', + params: { + startTime: dayjs().format('YYYY-MM-DD'), + endTime: dayjs().subtract(30,'d').format('YYYY-MM-DD'), }, - }, + }), ); - //三十天态势 - const { data: monthLine } = useRequest( - services.CityRiskApi.getStatisticalMonth, + //行业风险数 + const { data: hyfxData } = useRequest(() => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjhytj', + }), ); - - //类别 - const { data: typeData } = useRequest( - services.CityRiskApi.getStatisticalType, - - ); - //区域 - const { data: areaData } = useRequest( - services.CityRiskApi.getStatisticalAreae, + //高发区域 + const { data: gfqyData } = useRequest(() => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjqxtj', + }), ); - const onChangeCategory = (e) => { + console.log(e); + setListData({ items: [], loading: true, @@ -118,49 +157,25 @@ const RiskEvents = (props: RiskEventsProps) => { ref?.current?.resPage(); setFetchParams({ ...fetchParams, - page: 1, - riskLevelCode: e !== 'all' ? e : undefined, + pageNo: 0, + risklevelid: e !== 'all' ? map[e] : undefined, }); }; - const areas = [ - { - name: '高新区', - progress: 50, - value: 300, - rate: 30.6, - }, - { - name: '新都区', - progress: 50, - value: 300, - rate: 30.6, - }, - { - name: '龙泉驿区', - progress: 50, - value: 300, - rate: 30.6, - }, - ]; - /** 标题渲染 */ const titleRender = () => { return ( -
{detailModalOpt?.eventType}
- - {detailModalOpt?.riskLevelName} +
{detailModalOpt?.riskdescription}
+ + + + {detailModalOpt?.industry_name_dl}-{detailModalOpt?.name} - {detailModalOpt?.position}
); }; @@ -186,9 +201,21 @@ const RiskEvents = (props: RiskEventsProps) => {
({ - name: item?.event_date, - value: item?.event_count, + fxqsData?.data?.data?.records?.[0]?.red?.map((item) => ({ + name: item?.sj, + value: item?.num, + })) || [] + } + orangeData={ + fxqsData?.data?.data?.records?.[0]?.orange?.map((item) => ({ + name: item?.sj, + value: item?.num, + })) || [] + } + yellowData={ + fxqsData?.data?.data?.records?.[0]?.yellow?.map((item) => ({ + name: item?.sj, + value: item?.num, })) || [] } /> @@ -196,7 +223,7 @@ const RiskEvents = (props: RiskEventsProps) => { { // /> // } data={ - typeData?.data?.map((item) => { + hyfxData?.data?.data?.records?.[0]?.stat?.map((item) => { return { ...item, - percent: (Number(item?.total) / Number(statisticsData?.total))?.toFixed(2), - value: item?.total + percent: ( + (Number(item?.num) / + Number( + hyfxData?.data?.data?.records?.[0]?.count?.[0]?.num, + )) * + 100 + )?.toFixed(2), + name: item?.industryNameDl, + value: item?.num, }; }) || [] } @@ -247,11 +281,15 @@ const RiskEvents = (props: RiskEventsProps) => { ({ + gfqyData?.data?.data?.records?.[0]?.stat?.map((item) => ({ ...item, - name: item?.areaName, - percent: (Number(item?.total) / Number(statisticsData?.total))?.toFixed(2), - value: item?.total + name: item?.regionName, + percent: ( + (Number(item?.num) / + Number(gfqyData?.data?.data?.records?.[0]?.count)) * + 100 + )?.toFixed(2), + value: item?.num, })) || [] } strokeColor={{ @@ -286,7 +324,7 @@ const RiskEvents = (props: RiskEventsProps) => { setParams={(data) => { console.log(data); - setFetchParams({ ...fetchParams, page: data.current.page }); + setFetchParams({ ...fetchParams, pageNo: data.current.page }); }} handleDetail={(details) => { setDetailModalOpt({ @@ -307,8 +345,8 @@ const RiskEvents = (props: RiskEventsProps) => { eventId: '', }); }} - width={2600} - height={740} + width={2650} + height={900} > {detailModalOpt?.open && ( { detail={detailModalOpt} onChangeOpt={(val) => { console.log(val); - setDetailModalOpt({ ...detailModalOpt, - position: val?.position, - eventType: val?.event_type, + position: val?.region_name, riskLevelName: val?.risklevel, }); }} diff --git a/src/pages/Common/Event/ToDisposed/index.tsx b/src/pages/Common/Event/ToDisposed/index.tsx index 3bcc0a25b2d3158df69c543fbe8d35bf54e5316b..72e38af63bd9d29919560567697c2d55b23875b3 100644 --- a/src/pages/Common/Event/ToDisposed/index.tsx +++ b/src/pages/Common/Event/ToDisposed/index.tsx @@ -33,7 +33,8 @@ const ToDisposed = () => { }) // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -89,12 +90,16 @@ const ToDisposed = () => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); } @@ -240,10 +245,21 @@ const ToDisposed = () => { }} value={searchText} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( { }); // 视图 - const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + // const [viewType, setViewType] = useState<'list' | 'pic'>('pic'); //展示 + const viewType = useRef<'list' | 'pic'>('pic') const fetchParams = useRef({ page: 1, @@ -111,12 +112,16 @@ const UrbanOperation = () => { const getEventsList = () => { services.CityProblemApi.getZzEventListApi(fetchParams.current).then((res) => { if (res.code === 200) { - let result = { - ...res.data, - items: - fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], - }; - setListData(result); + if (viewType.current === 'list') { + setListData(res.data); + } else { + let result = { + ...res.data, + items: + fetchParams.current.page === 1 ? res.data.items : [...listData.items, ...res.data.items], + }; + setListData(result); + } } }); }; @@ -245,10 +250,21 @@ const UrbanOperation = () => { itemkey={'key'} items={defalutTabItems} /> - setViewType(type)} /> + { + viewType.current = type + fetchParams.current.page = 1 + setListData({ + items: [], + loading: true, + total: 0, + page: 1, + hasNext: false, + }) + getEventsList() + }} /> - {viewType === 'list' ? ( + {viewType.current === 'list' ? ( = ({ listData, listHeight, setParams, ha render: (t, record) => }, ]; - return ( {
= (props) => { @@ -20,29 +21,46 @@ const LiveSlideshow: React.FC<{ eventList: any }> = (props) => { eventId: '' }) + return (
实况

轮播
- - { - eventList?.map(item => ( -
{ - // setDetailModalOpt({ open: true, title: '事件详情', eventId: item.eventId }) - }}> - -
5分钟前
-
-
- {item.standardEventTitle} -
-
-
- )) - } -
+ { + eventList?.length ? ( +
+ + { + eventList?.map((item: any) => ( +
{ + setDetailModalOpt({ open: true, title: '事件详情', eventId: item.eventId }) + }}> + +
{item.reportDurationDescription}
+
+
+ {item.standardEventTitle} +
+
+
+ )) + } +
+
+ ) : + } + + {/*


*/} @@ -52,9 +70,9 @@ const LiveSlideshow: React.FC<{ eventList: any }> = (props) => { title={detailModalOpt?.title} onCancel={() => setDetailModalOpt({ open: false, title: '', eventId: '' })} width={1160} - height={950} + height={850} > - +
); diff --git a/src/pages/GlobalModalServices/modals/KeyAreaDetail/Map/index.tsx b/src/pages/GlobalModalServices/modals/KeyAreaDetail/Map/index.tsx index 86e7e8ed5407fa46b2b510f3261810b463bc35b0..7179de60511b3b45137908003c5372fcbe67aae2 100644 --- a/src/pages/GlobalModalServices/modals/KeyAreaDetail/Map/index.tsx +++ b/src/pages/GlobalModalServices/modals/KeyAreaDetail/Map/index.tsx @@ -106,7 +106,7 @@ const Map: React.FC = (props) => { eventStatus: '处置中', keyAreaId: objectId, // objectId dateType: 'monthly', // dateType - limit: 3 + // limit: 3 } const res = await services.Physicalsign.getNormalEventListForKeyAreas(params) if (res.code === 200) { diff --git a/src/pages/GlobalModalServices/modals/KeyAreaDetail/SidebarMenu/index.tsx b/src/pages/GlobalModalServices/modals/KeyAreaDetail/SidebarMenu/index.tsx index bf38d665963952035e39ecb95fec1cffad026451..d350dfd0abeb70efb64644d4913c087259a00d59 100644 --- a/src/pages/GlobalModalServices/modals/KeyAreaDetail/SidebarMenu/index.tsx +++ b/src/pages/GlobalModalServices/modals/KeyAreaDetail/SidebarMenu/index.tsx @@ -1,4 +1,4 @@ -import { getColorByIndex } from '@/utils/ui'; +import { cqiDisplay, getColorByIndex } from '@/utils/ui'; import React, { useMemo } from 'react'; import styles from './index.less'; @@ -17,7 +17,7 @@ const SidebarMenu: React.FC<{ element: (
CQI
-
{cqi}
+
{cqiDisplay(cqi)}
), }, diff --git a/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.tsx b/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.tsx index c7fb59ff0fb4fb13eb586ec3c5c997768f42625c..c089d5cdd6f23b0d6129e96e71b21b2759ada360 100644 --- a/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.tsx +++ b/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.tsx @@ -1,15 +1,19 @@ import Modal from '@/components/HncyModal'; +import { message } from '@/layouts/messageStore'; import QualityModal from '@/pages/Common/Quality/Modal'; import SignModel from '@/pages/Common/Sign/SignModel'; import services from '@/services'; -import { getCqiLineChartStyles, getCqiStatusStyle, getCqiStatusTexts } from '@/utils/ui'; +import { + getCqiLineChartStyles, + getCqiStatusStyle, + getCqiStatusTexts, +} from '@/utils/ui'; import { QuestionCircleFilled } from '@ant-design/icons'; import { useModel } from '@umijs/max'; import { Flex } from 'antd'; import React, { useEffect, useState } from 'react'; import styles from './index.less'; import LineCharts from './LineCharts'; -import { message } from '@/layouts/messageStore'; const CityRealTimeCQI: React.FC = () => { const { initialState } = useModel('@@initialState'); @@ -36,17 +40,29 @@ const CityRealTimeCQI: React.FC = () => { }; services.Physicalsign.getComparisonIndexInstance(params).then((res) => { if (res.code === 200) { - console.log(res.data); - let isAdjust = true; - if (isAdjust && res.data.currentIndex?.indexs) { - const indexs = res.data.currentIndex.indexs.map((item: any) => - item.name === '美观' ? { ...item, value: '--', color: '#57EF58', background: 'rgba(39, 211, 134, 0.2)', } : {...item, ...getCqiStatusStyle(item?.value)} - ).sort((a:any, b:any) => Number(a.id) - Number(b.id)); - const updatedData = { ...res.data, currentIndex: { ...res.data.currentIndex, indexs } }; - setCqiData(updatedData); - } else { - setCqiData(res.data); - } + console.log(res.data); + let isAdjust = true; + if (isAdjust && res.data.currentIndex?.indexs) { + const indexs = res.data.currentIndex.indexs + .map((item: any) => + item.name === '美观' + ? { + ...item, + value: '--', + color: '#57EF58', + background: 'rgba(39, 211, 134, 0.2)', + } + : { ...item, ...getCqiStatusStyle(item?.value) }, + ) + .sort((a: any, b: any) => Number(a.id) - Number(b.id)); + const updatedData = { + ...res.data, + currentIndex: { ...res.data.currentIndex, indexs }, + }; + setCqiData(updatedData); + } else { + setCqiData(res.data); + } } }); }; @@ -54,7 +70,7 @@ const CityRealTimeCQI: React.FC = () => { useEffect(() => { getCqiData(); }, []); -console.log(cqiData); + console.log(cqiData); return (
@@ -81,12 +97,15 @@ console.log(cqiData);
{/* {getCqiStatusTexts(cqiData?.currentIndex?.cqi)?.desc} */} - { cqiData?.currentIndex?.statusDesc} + {cqiData?.currentIndex?.statusDesc}
{getCqiStatusTexts(cqiData?.currentIndex?.cqi)?.text} @@ -94,7 +113,7 @@ console.log(cqiData);
{/*
*/} - @@ -106,12 +125,14 @@ console.log(cqiData); key={item.id} className={styles.dimensionItem} style={{ - background: item?.background ? item?.background : getCqiStatusStyle(item.value)?.background, + background: item?.background + ? item?.background + : getCqiStatusStyle(item.value)?.background, }} onClick={() => { if (item.name === '美观') { - message.warning('指标正在构建中') - return + message.warning('指标正在构建中'); + return; } setModalOpen(true); setModalOpt([{ title: item.name, type: 'category' }]); @@ -124,7 +145,11 @@ console.log(cqiData);
{item.name}
{item.value}
diff --git a/src/pages/NewHome/NewLeftSidebar/CitySecurityInfo/index.tsx b/src/pages/NewHome/NewLeftSidebar/CitySecurityInfo/index.tsx index 746b56d142941e5aeef101cfbc1c77d5c35c319e..fadcced3a204fc7c08ddf56561bedc5f44d9a31c 100644 --- a/src/pages/NewHome/NewLeftSidebar/CitySecurityInfo/index.tsx +++ b/src/pages/NewHome/NewLeftSidebar/CitySecurityInfo/index.tsx @@ -5,6 +5,7 @@ import risk4 from '@/assets/images/centralize/risk4.png'; import Modal from '@/components/HncyModal'; import RiskEvents from '@/pages/Common/Event/RiskEvents'; import services from '@/services'; +import { useRequest } from 'ahooks'; import { useEffect, useMemo, useState } from 'react'; import styles from './index.less'; @@ -19,53 +20,58 @@ const CitySecurityInfo = () => { type: '', }); - const [statisticsData, setStatisticsData] = useState({}); + + //预警数 + const { data: warnCoutnData } = useRequest(() => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjdjtj', + }), + ); + // console.log(warnCoutnData?.data?.data?.records[0]?.stat); const riskData = useMemo(() => { return [ { type: '红色风险', label: '红色风险', - value: statisticsData?.majorRiskTotal, + value: warnCoutnData?.data?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '红色预警', + )?.num || '--', icon: risk1, color: 'linear-gradient(180deg, rgb(255, 138, 138), rgb(208, 62, 62))', }, { type: '橙色风险', label: '橙色风险', - value: statisticsData?.significantRiskTotal, + value: warnCoutnData?.data?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '橙色预警', + )?.num || '--', icon: risk4, color: 'linear-gradient(180deg, rgb(255, 176, 121), rgb(238, 126, 48))', }, { type: '黄色风险', label: '黄色风险', - value: statisticsData?.generalRiskTotal, + value: warnCoutnData?.data?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '黄色预警', + )?.num || '--', icon: risk3, color: 'linear-gradient(180deg, rgb(255, 228, 155), rgb(231, 182, 55))', }, { type: '一般风险', label: '一般风险', - value: statisticsData?.ybfxRiskTotal, + value: warnCoutnData?.data?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '一般预警', + )?.num || '--', icon: risk2, color: 'linear-gradient(to right, rgb(122, 177, 255), rgb(37, 128, 255))', }, ]; - }, [statisticsData]); + }, [warnCoutnData]); - const getStatisticsData = () => { - services.CityRiskApi.queryStatisticalRiskLevel().then((res) => { - if (res.code === 200) { - setStatisticsData(res.data); - } - }); - }; - useEffect(() => { - getStatisticsData(); - }, []); return (
@@ -76,6 +82,7 @@ const CitySecurityInfo = () => {
// setModalOpt({ // open: true, @@ -90,10 +97,9 @@ const CitySecurityInfo = () => { className={styles.num} style={{ background: item.color, backgroundClip: 'text' }} > - {/* {item.value} */} - -- + {item.value} - {/* */} + {item?.value !== '--' && }
{item.label}
@@ -109,7 +115,7 @@ const CitySecurityInfo = () => { height={846} > diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx index a9afbaeb8a563239e7c0a4594aeecb71929fcc7f..1f5828f6985176a5e74a5329b43ed12b39dee5d7 100644 --- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx +++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx @@ -29,7 +29,14 @@ const AreaDistribution: React.FC = () => { } }); if (resp.code === 200) { - setStatisticTotal(resp.data?.data?.records); + const data = resp.data?.data?.records + // 将成都市改为成都城管委 + data.forEach((record: any) => { + if (record.ssqy === '成都市') { + record.ssqy = '市城管委'; + } + }); + setStatisticTotal(data); } }; @@ -54,7 +61,7 @@ const AreaDistribution: React.FC = () => { const renderSummaryContent = () => { // 按数量分类 const categorizeRegions = (data: any[]) => { - const filteredData = data.filter(item => item.ssqy !== "成都市"); + const filteredData = data.filter(item => item.ssqy !== "市城管委"); const above400 = filteredData.filter(item => Number(item.num) >= 400); const above300 = filteredData.filter(item => Number(item.num) >= 300 && Number(item.num) < 400); const between100And300 = filteredData.filter(item => Number(item.num) >= 100 && Number(item.num) < 300); diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/index.less b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/index.less index 46e2c68305e58343db34ffc64151314dd61f61cf..8c9fafbdba9593adf3c27c48c78444fc7064b4fa 100644 --- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/index.less +++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/index.less @@ -18,6 +18,7 @@ font-family: DingTalk JinBuTi; font-size: 30px; font-weight: 400; + cursor: pointer; } .active { diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Advertisement/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Advertisement/index.tsx index 1b6206388014abcd0fb14fe792d5ea9f352ffa66..63d56f39a89839c99e20b16db23cf8e3bb8ff74c 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Advertisement/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Advertisement/index.tsx @@ -1,7 +1,9 @@ import DescriptionItem from '@/components/DescriptionItem'; -import { Flex } from 'antd'; +import { Flex, Space } from 'antd'; import React from 'react'; import styles from './index.less'; +import CountUp from 'react-countup'; +import LineCharts from '../LineCharts'; const Advertisement: React.FC = () => { const commonValueStyle = { @@ -37,33 +39,39 @@ const Advertisement: React.FC = () => { return (
- - - + + + 今日发现问题 + + + 件 + + +
+ +
+ diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.less b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.less index bcd6aa8ff226ce997c6dd6d83ac28d054cf26ef1..1cc6b5c965c614b4d70135bc525c972187ccfbd2 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.less +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.less @@ -1,3 +1,3 @@ .container { - padding: 10px 20px 20px 20px; -} \ No newline at end of file + padding: 10px 20px 20px 20px; +} diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.tsx index 2b2fb43f7b1cf665c70a6b914ffbcd2d0b6e382d..0ef80ec601a9e15d0725045b6002a3b338c33a4c 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/EnvironmentalHealth/index.tsx @@ -1,7 +1,9 @@ import DescriptionItem from '@/components/DescriptionItem'; -import { Flex } from 'antd'; +import { Flex, Space } from 'antd'; import React from 'react'; import styles from './index.less'; +import CountUp from 'react-countup'; +import LineCharts from '../LineCharts'; const EnvironmentalHealth: React.FC = () => { const commonValueStyle = { @@ -9,7 +11,7 @@ const EnvironmentalHealth: React.FC = () => { WebkitBackgroundClip: 'text', WebkitTextFillColor: 'transparent', fontFamily: 'D-DIN', - fontSize: '36px', + fontSize: '30px', fontWeight: 700, lineHeight: 1.1, }; @@ -37,35 +39,41 @@ const EnvironmentalHealth: React.FC = () => { return (
- - - + + + 今日发现问题 + + + 件 + + +
+ +
+
diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.less b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.less index 18b2940206bc13b858516a7e1205c1e60f481c62..e9277a9b71f10a300ae76759d664bf09d8c13386 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.less +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.less @@ -1,3 +1,25 @@ .container { - padding: 10px 20px 20px 20px; -} \ No newline at end of file + padding: 10px 20px 20px 20px; +} + +.val { + background: linear-gradient(180deg, rgb(170, 255, 246), rgb(37, 187, 255)); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; + font-family: D-DIN; + font-size: 36px; +} + +.unit { + color: rgb(188, 206, 233); + font-size: 20px; + margin-left: 8px; + margin-right: 24px; +} + +.label { + color: rgb(188, 206, 233); + font-size: 20px; + font-weight: 400; +} diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.tsx index d3f74fb0429ee7974635939d14f57abdef8fbe8b..dc478b505f5f5c180db590e6aaa030cb04a99ae6 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LawEnforcement/index.tsx @@ -34,33 +34,24 @@ const LawEnforcement: React.FC = () => {
- - +
+ +
1223
+
+
889.9
+
万元
+
+
11月行政处罚信息公示
+
diff --git a/src/pages/Common/Event/CommonList/LineCharts/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LineCharts/index.tsx similarity index 85% rename from src/pages/Common/Event/CommonList/LineCharts/index.tsx rename to src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LineCharts/index.tsx index 7e8cd8640b0788c3917e56b3e0140ebff361cefa..216ec8f3770a01bec2057e9d3f35c7da675f58bd 100644 --- a/src/pages/Common/Event/CommonList/LineCharts/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/LineCharts/index.tsx @@ -3,17 +3,16 @@ import ReactEcharts from 'echarts-for-react'; const LineCharts = ({ data }: { data: any[] }) => { const option = useMemo(() => { - const chartData: any = data?.map(item => item.value) - const showXAis = true + const chartData: any = [10,20,30,20,10,40,50,10,20,30,20,10,40,50] return { - tooltip: { - trigger: 'axis', - }, + // tooltip: { + // trigger: 'axis', + // }, xAxis: { type: 'category', boundaryGap: false, - show: showXAis, - data: showXAis ? data?.map(item => item.name) : [], + show: false, + // data: data?.map(item => item.name), axisLabel: { color: '#CBEDFF', interval: 3 // 设置为0以显示所有坐标点 @@ -63,6 +62,7 @@ const LineCharts = ({ data }: { data: any[] }) => { global: false, // 缺省为 false }, }, + smooth: true }, ], } @@ -71,7 +71,7 @@ const LineCharts = ({ data }: { data: any[] }) => { return ( ) } diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/MunicipalFacilities/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/MunicipalFacilities/index.tsx index 7479c36f4ce1aadf0bc5ceeb19178fdbffc8a8ed..0c56c82aee3c49871eadb32a8eb8f12babb27955 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/MunicipalFacilities/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/MunicipalFacilities/index.tsx @@ -1,7 +1,9 @@ import DescriptionItem from '@/components/DescriptionItem'; -import { Flex } from 'antd'; +import { Flex, Space } from 'antd'; import React from 'react'; import styles from './index.less'; +import CountUp from 'react-countup'; +import LineCharts from '../LineCharts'; const MunicipalFacilities: React.FC = () => { const commonValueStyle = { @@ -32,10 +34,26 @@ const MunicipalFacilities: React.FC = () => { return (
- - + + + 近七日发现道桥病害 + + + 处 + + +
+ +
+ { decimals={0} /> { decimals={0} /> - - - -
); diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/WasteDisposal/index.tsx b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/WasteDisposal/index.tsx index d67f5ec1f07ece9ac5a826329f568c383a61fa52..a9f328e72436452aac045edccb93c36d6db96b83 100644 --- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/WasteDisposal/index.tsx +++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/WasteDisposal/index.tsx @@ -33,35 +33,37 @@ const WasteDisposal: React.FC = () => { return (
- - + +
+ +
); diff --git a/src/pages/NewHome/NewRightContent/ResourceElements/components/PerceptionSource/index.tsx b/src/pages/NewHome/NewRightContent/ResourceElements/components/PerceptionSource/index.tsx index d7845a05ec0385fbe2cdcb0782532287e8a5610f..8e0359fdad6a47c46b3c03a1c4e2dde9f48452e3 100644 --- a/src/pages/NewHome/NewRightContent/ResourceElements/components/PerceptionSource/index.tsx +++ b/src/pages/NewHome/NewRightContent/ResourceElements/components/PerceptionSource/index.tsx @@ -41,8 +41,8 @@ const PerceptionSource: React.FC = () => { unitStyle={commonUnitStyle} /> { }) if (resp.code === 200) { const data = resp.data?.data?.records + // 将成都市改为成都城管委 + data.forEach((record: any) => { + if (record.ssqy === '成都市') { + record.ssqy = '市城管委'; + } + }); setStatisticTotal(data) generateSummary(data) } @@ -37,7 +43,7 @@ const AreaDistribution = () => { const generateSummary = (data: any[]) => { // 按数量分类 const categorizeRegions = (data: any[]) => { - const filteredData = data.filter(item => item.ssqy !== "成都市"); + const filteredData = data.filter(item => item.ssqy !== "市城管委"); const above400 = filteredData.filter(item => Number(item.num) >= 400); const above300 = filteredData.filter(item => Number(item.num) >= 300 && Number(item.num) < 400); const between100And300 = filteredData.filter(item => Number(item.num) >= 100 && Number(item.num) < 300); diff --git a/src/pages/SecurityServiceOverview/SafetyMap/index.tsx b/src/pages/SecurityServiceOverview/SafetyMap/index.tsx index b9c2f74c7e69f06628ba093cec7df7684ec282e3..d7e1025794fca4222317257c9e3119b2593491ec 100644 --- a/src/pages/SecurityServiceOverview/SafetyMap/index.tsx +++ b/src/pages/SecurityServiceOverview/SafetyMap/index.tsx @@ -19,40 +19,45 @@ import classNames from 'classnames'; import BaseInfo from '../components/BaseInfo'; import CheckboxGroup, { items } from './CheckboxGroup'; import styles from './index.less'; +export const colorConfig: Record< +string, +{ + color: CSSProperties['color']; + bg: string; + icon: string; + tag?: string; +} +> = { +红色预警: { + //红色风险 + color: 'rgb(255, 227, 227)', + bg: redBg, + icon: risk1, + tag: require('@/assets/images/SecurityServiceOverview/dtyjtag1.png'), +}, +橙色预警: { + //橙色风险 + color: 'rgb(255, 249, 246)', + bg: orangeBg, + icon: risk2, + tag: require('@/assets/images/SecurityServiceOverview/dtyjtag2.png'), +}, +黄色预警: { + //黄色风险 + color: 'rgb(255, 250, 233)', + bg: yellowBg, + icon: risk3, + tag: require('@/assets/images/SecurityServiceOverview/dtyjtag3.png'), +}, +一般预警: { + //一般风险 + color: 'rgb(220, 241, 255)', + bg: blueBg, + icon: risk4, + tag: require('@/assets/images/SecurityServiceOverview/dtyjtag4.png'), +}, +}; const SafetyMap = () => { - const colorConfig: Record< - string, - { - color: CSSProperties['color']; - bg: string; - icon: string; - } - > = { - 红色预警: { - //红色风险 - color: '#FFBCBC', - bg: redBg, - icon: risk1, - }, - 橙色预警: { - //橙色风险 - color: '#FDDFCE', - bg: orangeBg, - icon: risk2, - }, - 黄色预警: { - //黄色风险 - color: '#FFE892', - bg: yellowBg, - icon: risk3, - }, - 一般预警: { - //一般风险 - color: '#BFE4FF', - bg: blueBg, - icon: risk4, - }, - }; const MapRef = useRef(); const [count, setCount] = useState(0); @@ -158,23 +163,17 @@ const SafetyMap = () => { const titleRender = () => { return ( -
{detailModalOpt?.eventType}
- - {detailModalOpt?.riskLevelName} - - {detailModalOpt?.position} +
{detailModalOpt?.riskdescription}
+ + + {detailModalOpt?.industry_name_dl}-{detailModalOpt?.name}
); }; - const getMap = (data: string) => { try { return JSON.parse(data); @@ -186,11 +185,11 @@ const SafetyMap = () => { }; return (
-
+
@@ -314,9 +313,10 @@ const SafetyMap = () => { setDetailModalOpt({ ...detailModalOpt, - position: val?.position, - eventType: val?.event_type, + position: val?.region_name, + riskLevelName: val?.risklevel, + }); }} /> diff --git a/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.less b/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.less index ef853280edbbce3c707924555b7afb1d70dab42d..b6fcf77067c53d61d342fe6a4d959c675e6f8cb9 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.less @@ -1,6 +1,6 @@ .container { display: flex; - margin-top: 29px; + margin-top: 26px; justify-content: space-between; .riskCount { @@ -18,7 +18,7 @@ .warp { padding: 12px 28px 0 28px; width: 100%; - height: 170px; + height: 190px; overflow: auto; padding-top: 30px; } diff --git a/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.tsx index 93a6f4a2c63cf1869ef6162802b43f381b1eb068..9787b7cde7c9ecd1cbd771d84dc8277564625dfe 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/FacilityWarn/index.tsx @@ -165,7 +165,7 @@ const FacilityWarn = ({ ); })} @@ -200,7 +200,7 @@ const FacilityWarn = ({ ); })} @@ -235,7 +235,7 @@ const FacilityWarn = ({ ); })} @@ -270,7 +270,7 @@ const FacilityWarn = ({ ); })} diff --git a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/DisposeFlow/index.less b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/DisposeFlow/index.less index e02a0d9d2528f914af66f64ec7793b25628c9a98..6614a305ff87060b9a1f059a66a8b009717eb641 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/DisposeFlow/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/DisposeFlow/index.less @@ -9,9 +9,10 @@ font-family: DingTalk JinBuTi; .item{ text-align: center; + font-size: 16px; .icon{ - width: 30px; - height: 30px; + width: 44px; + height: 44px; } .count{ color: rgb(66, 203, 255); diff --git a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/IndustryWiget/index.less b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/IndustryWiget/index.less index c184b2d53df3e5c19eb402e96a139772839baab6..fe9c578537bf9858a5b31f695425331d8e2112d7 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/IndustryWiget/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/IndustryWiget/index.less @@ -36,8 +36,8 @@ .descWarp { - margin-left: 15px; - width: 55%; + margin-left: 8px; + width: 56%; .count { color: rgb(66, 203, 255); diff --git a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.less b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.less index 6c4d1b557c6e11c8b25a271beac4bcf272305f31..cdfbdd705d0c7c80120ff38a8b004f424702ce9f 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.less @@ -1,6 +1,6 @@ .container { display: flex; - margin-top: 29px; + margin-top: 27px; justify-content: space-between; .riskCount { diff --git a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.tsx index 564f720059ea0ad7c4c6509a74ed9bb551950acd..e44f4ec898471b7e7f44d3afec5a2ddc5ff58e41 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/IndustryWarn/index.tsx @@ -132,8 +132,15 @@ const IndustryWarn = ({ parentCode: 'dlql', listTypeCode: 'zzcc-aq-hwgf-fylb', total: gfcz?.data?.records?.[0]?.tmc ?? '--', - factorytypecode:'TMC', - pageNo:0,//数据底座分页接口,有的重0开始有的从1开始 + factorytypecode: 'TMC', + pageNo: 0, //数据底座分页接口,有的重0开始有的从1开始 + columnsFields: { + name: 'name', + type: 'jishuguanlifenlei', + descgldw: 'guanlidanwei', + address: 'address', + status: 'objstate', + }, }, { typeCode: 'dl', @@ -141,7 +148,15 @@ const IndustryWarn = ({ parentCode: 'dlql', listTypeCode: 'zzcc-aq-hwgf-fylb', total: gfcz?.data?.records?.[0]?.fsfdc ?? '--', - factorytypecode:'FSC' + factorytypecode: 'FSC', + pageNo: 0, //数据底座分页接口,有的重0开始有的从1开始 + columnsFields: { + name: 'name', + type: 'jishuguanlifenlei', + descgldw: 'guanlidanwei', + address: 'address', + status: 'objstate', + }, }, { listTypeCode: 'zzcc-aq-hwgf-fylb', @@ -149,7 +164,15 @@ const IndustryWarn = ({ typeName: '餐厨厂', parentCode: 'dlql', total: gfcz?.data?.records?.[0]?.canchu ?? '--', - factorytypecode:'CCC' + factorytypecode: 'CCC', + pageNo: 0, //数据底座分页接口,有的重0开始有的从1开始 + columnsFields: { + name: 'name', + type: 'jishuguanlifenlei', + descgldw: 'guanlidanwei', + address: 'address', + status: 'objstate', + }, }, ], }; @@ -160,11 +183,11 @@ const IndustryWarn = ({ } > @@ -225,7 +248,7 @@ const IndustryWarn = ({ typeCode: hw?.typeCode, parentData: hw, }} - style={{ width: 150 }} + style={{ width: 170 }} /> ); })} @@ -238,13 +261,13 @@ const IndustryWarn = ({ } > @@ -260,7 +283,7 @@ const IndustryWarn = ({ typeCode: gf?.typeCode, parentData: gf, }} - style={{ width: 100 }} + style={item.typeName==='焚烧发电厂'?{ width: 170 }:{}} /> ); })} diff --git a/src/pages/SecurityServiceOverview/SecurityState/MeetSafeguard/index.less b/src/pages/SecurityServiceOverview/SecurityState/MeetSafeguard/index.less index 4ce6f156b3fdf8d75238d9771c43e58f719af9ad..96fba02b1136b0b78154b4cc2b914fbeab18e4ad 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/MeetSafeguard/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/MeetSafeguard/index.less @@ -1,6 +1,6 @@ .container { - height: 310px; - width: 750px; + height: 317px; + width: 782px; border-radius: 20px; background-image: url('../../../../assets/images/SecurityServiceOverview/cardBg2.png'); background-size: 100% 100%; diff --git a/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.less b/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.less index a14604f7f2edb631ad87fc1ff95b9b519c40d378..066c976235da807b4042fc7b854e199c693e79b1 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.less @@ -1,7 +1,7 @@ .riskwrap { margin-top: 20px; width: 324px; - height: 705px; + height: 739px; background-image: url('../../../../../assets/images/SecurityServiceOverview/cardBg1.png'); background-size: 100% 100%; @@ -55,7 +55,7 @@ height: 14px; border-radius: 14px; background: var(--bg); - margin-right: 14px; + margin-right: 5px; } } @@ -67,6 +67,8 @@ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; + padding-left: 19px; + margin-top: 2px; } } } @@ -92,6 +94,7 @@ .title { font-size: 18px; font-family: DingTalk JinBuTi; + margin-bottom: 2px; } .address { @@ -112,7 +115,7 @@ width: 200px; text-align: center; position: absolute; - bottom: -10px; + margin-top: 10px; left: 50%; margin-left: -100px; color: #CADFFC; diff --git a/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.tsx index b1be2fed19254b96c8201b8bf29f1e9e5375bfb9..fd03090b35084419661e246afdeb5fa5fe426721 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/RightLayout/RiskNotice/index.tsx @@ -31,28 +31,28 @@ export const colorConfig: Record< > = { 红色预警: { //红色风险 - color: '#FFBCBC', + color: 'rgb(255, 227, 227)', bg: redBg, icon: 'redIcon', tag: require('@/assets/images/SecurityServiceOverview/dtyjtag1.png'), }, 橙色预警: { //橙色风险 - color: '#FDDFCE', + color: 'rgb(255, 249, 246)', bg: orangeBg, icon: 'orangeIcon', tag: require('@/assets/images/SecurityServiceOverview/dtyjtag2.png'), }, 黄色预警: { //黄色风险 - color: '#FFE892', + color: 'rgb(255, 250, 233)', bg: yellowBg, icon: 'yellowIcon', tag: require('@/assets/images/SecurityServiceOverview/dtyjtag3.png'), }, 一般预警: { //一般风险 - color: '#BFE4FF', + color: 'rgb(220, 241, 255)', bg: blueBg, icon: 'blueIcon', tag: require('@/assets/images/SecurityServiceOverview/dtyjtag4.png'), @@ -70,16 +70,27 @@ const RiskNotice: React.FC = () => { const { data: levelData } = useRequest( services.CityRiskApi.getStatisticalRiskLevel, ); - const { data: eventData } = useRequest(() => - services.CityRiskApi.getEventPage({ page: 1, count: 5 }), + //预警数 + const { data: warnCoutnData } = useRequest( + () => + services.DataBase.getSjdzInfoData({ + typeCode: 'zzcc-aq-yjdjtj', + data: { + regionCode: selectAreaId, + }, + }), + { + refreshDeps: [selectAreaId], + }, ); + //前五个预警 const { data } = useRequest( () => services.DataBase.getSjdzInfoData({ typeCode: 'zzcc-aq-yjxx', data: { regionCode: selectAreaId, - pageNo: 1, + pageNo: 0, pageSize: 5, }, }), @@ -87,7 +98,7 @@ const RiskNotice: React.FC = () => { refreshDeps: [selectAreaId], }, ); - // console.log(data); + // 事件详情弹窗zzcc-aq-yjxx const [detailModalOpt, setDetailModalOpt] = useState<{ @@ -107,25 +118,38 @@ const RiskNotice: React.FC = () => { { label: '红色风险', color: '#DD4646', - num: levelData?.majorRiskTotal, + num: + warnCoutnData?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '红色预警', + )?.num || '--', }, { label: '橙色风险', color: '#FF6F4A', - num: levelData?.significantRiskTotal, + num: + warnCoutnData?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '橙色预警', + )?.num || '--', }, { label: '黄色风险', color: '#FFAF4A', - num: levelData?.generalRiskTotal, + + num: + warnCoutnData?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '黄色预警', + )?.num || '--', }, { label: '一般风险', color: '#46B2FF', - num: levelData?.ybfxRiskTotal, + num: + warnCoutnData?.data?.records?.[0]?.stat?.find( + (item) => item?.risklevel === '一般预警', + )?.num || '--', }, ]; - }, [levelData]); + }, [warnCoutnData]); /** 标题渲染 */ const titleRender = () => { @@ -138,7 +162,9 @@ const RiskNotice: React.FC = () => { style={{ width: 136, height: 30, marginLeft: 36, marginRight: 13 }} /> - {detailModalOpt?.industry_name_dl}-{detailModalOpt?.name} + + {detailModalOpt?.industry_name_dl}-{detailModalOpt?.name} + ); }; @@ -205,7 +231,7 @@ const RiskNotice: React.FC = () => { ))} -

{ setRiskModalOpt({ open: true, title: '风险预警列表' }); @@ -213,7 +239,7 @@ const RiskNotice: React.FC = () => { > 查看全部 -

+

} {/**风险预警 */} { const [selectedCarouselItem, setSelectedCarouselItem] = useState(null); const [isModalOpen, setIsModalOpen] = useState(false); @@ -11,17 +15,57 @@ const WeatherCard = () => { title: string; }>({ open: false, - title: '风险预警列表', + title: '气象预警列表', }); + const list = [ + { + time: '发布时间:2024-10-10 12:20:20', + icon: require('@/assets/images/SecurityServiceOverview/tqlsIc.png'), + name: '简阳市大风蓝色预警', + desc: '简阳市气象台2024年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于500米的大雾,预计未来12小时4年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于', + }, + { + time: '发布时间:2024-10-10 12:20:20', + icon: require('@/assets/images/SecurityServiceOverview/tqlsIc.png'), + name: '简阳市大风蓝色预警', + desc: '简阳市气象台2024年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于500米的大雾,预计未来12小时4年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于', + }, + { + time: '发布时间:2024-10-10 12:20:20', + icon: require('@/assets/images/SecurityServiceOverview/tqlsIc.png'), + name: '简阳市大风蓝色预警', + desc: '简阳市气象台2024年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于500米的大雾,预计未来12小时4年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于', + }, + { + time: '发布时间:2024-10-10 12:20:20', + icon: require('@/assets/images/SecurityServiceOverview/tqlsIc.png'), + name: '简阳市大风蓝色预警', + desc: '简阳市气象台2024年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于500米的大雾,预计未来12小时4年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于', + }, + { + time: '发布时间:2024-10-10 12:20:20', + icon: require('@/assets/images/SecurityServiceOverview/tqlsIc.png'), + name: '简阳市大风蓝色预警', + desc: '简阳市气象台2024年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于500米的大雾,预计未来12小时4年11月29日06时30分发布大雾黄色预警信号0分发布大雾黄色预警信号:目前我市江源、禾丰已经出现能见度小于', + }, + ]; return (
气象预警
11
- {/*
+
{ + setRiskModalOpt({ + ...riskModalOpt, + open: true, + }); + }} + > -
*/} +
{[ @@ -40,12 +84,16 @@ const WeatherCard = () => { title: '简阳市 大风蓝色预警', time: '2024-10-10 12:20:20', }, - ]?.map((item,index:number) => { + ]?.map((item, index: number) => { return ( -
{ - setSelectedCarouselItem(item); - setIsModalOpen(true); - }}> +
{ + setSelectedCarouselItem(item); + setIsModalOpen(true); + }} + >
{item?.title}
@@ -59,21 +107,63 @@ const WeatherCard = () => { { + onCancel={() => { setIsModalOpen(false); setSelectedCarouselItem(null); }} /> )} - {/**风险预警 */} - { + return ( +
+
{riskModalOpt?.title}
+
+ 当前全市共12个预警 +
+
+ ); + }} onCancel={() => setRiskModalOpt({ open: false, title: '' })} - width={1500} - height={846} + width={1033} + height={858} > - +
+ {list?.map((item) => { + return ( +
+ +
+
{item?.name}
+
+ + {item?.desc} + +
+
+{item?.time} +
+
+
+ ); + })} +
); diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/AccidentItem/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/AccidentItem/index.tsx index cc0661df2ee6a27698683045d7c89368c848a85c..2fbf180cf9144e012acf966542951f3c530f08a6 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/AccidentItem/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/AccidentItem/index.tsx @@ -38,7 +38,7 @@ const AccidentItem = ({ data, onClick }: AccidentItemProps) => { suffix: dayjs(data?.publishTime).format('YYYY-MM-DD'), }} title={data?.title} - style={{color:'rgb(140, 170, 212)'}} + style={{color:'rgb(140, 170, 212)',fontSize:16}} > {data?.title} diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.less b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.less index f320f6a5905066d4f87b673c9e6a4527ac46d6bf..c68bedbd0b0b7c706ceeed6508d9fd97c5eed741 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.less @@ -1,6 +1,6 @@ .container { height: 232px; - width: 750px; + width: 782px; border-radius: 20px; // background: linear-gradient(to right, rgba(19, 84, 255, 0.1), rgba(23, 255, 149, 0)); background-image: url('../../../../assets/images/SecurityServiceOverview/cardBg2.png'); diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.tsx index b5ed85843df60227c4764cb7e18a6476b629a2db..f90fea3b7ede8201cf378d680896121339a25a28 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyAccident/index.tsx @@ -4,7 +4,7 @@ import services from '@/services'; import SafetyModal from '../SafetyTips/SafetyModal'; import AccidentItem from './AccidentItem'; import styles from './index.less'; -import { divide } from 'lodash'; + import EmptySpace from '@/components/EmptySpace'; const SafetyAccident = () => { diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.less b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.less index 2c4ffb5afb16150730134b8fbbed2bccda07f03d..5183e7f30845de51e14d0c300779278a9c7995e2 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.less @@ -1,6 +1,6 @@ .container{ width: 100%; - height: 77px; + height: 85px; background-color: rgba(91, 129, 235, 0.157); border-radius: 10px; padding: 0px 10px 0 19px; diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.tsx index fd0cccc44516fc92510e51a9bef69862cd15dad7..6b7be344c7d4c3910e67cfccf9a0304c9b599c0a 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/SafetyTipItem/index.tsx @@ -30,7 +30,7 @@ const SafetyTipItem = ({ data }: { data: any }) => { suffix: ' ' + dayjs(data?.publishTime).format('YYYY-MM-DD'), }} title={data?.title} - style={{ color: 'rgb(202, 223, 252)', fontWeight: 500 }} + style={{ color: 'rgb(202, 223, 252)', fontWeight: 500,fontSize:16}} > {data?.title} diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.less b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.less index d1a577674cfaea266fd9a8368eeb61856fff483a..3bcf5b4d5643a111f63a1482ade8e5c8c49f4c0f 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.less +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.less @@ -1,11 +1,11 @@ .container { - height: 340px; - width: 750px; + height: 380px; + width: 782px; border-radius: 20px; // background: linear-gradient(to right, rgba(19, 84, 255, 0.1), rgba(23, 255, 149, 0)); background-image: url('../../../../assets/images/SecurityServiceOverview/cardBg2.png'); background-size: 100% 100%; - margin-top: 30px; + margin-top: 19px; -webkit-backdrop-filter: blur(5px); /* Safari浏览器兼容 */ backdrop-filter: blur(5px); @@ -27,20 +27,20 @@ .content { padding: 0 20px; margin-top: 22px; - height: 247px; + height: 280px; display: flex; border-radius: 10px; overflow: hidden; .carouselItem { position: relative; - width: 280px; - height: 244px; + width: 270px; + height: 280px; border-radius: 10px; .img { width: 100%; - height: 244px; + height: 280px; border-radius: 10px; } @@ -66,7 +66,7 @@ flex: 1; margin-left: 26px; - height: 247px; + height: 280px; overflow: auto; } diff --git a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.tsx b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.tsx index 076ec0017c4acaec3a629352abca28032141d6c1..f699e1ff491fa47e4521db396495559d679227ba 100644 --- a/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.tsx +++ b/src/pages/SecurityServiceOverview/SecurityState/SafetyTips/index.tsx @@ -51,7 +51,7 @@ const SafetyTips = () => {
安全工作
- + {BigImgData?.data?.records?.map((item: any,index:number) => { return (
= ( ref, ) => { const page = useRef({ - page: 1, + page: 0, }); useImperativeHandle(ref, () => { return { @@ -24,7 +24,7 @@ const EventPicList: React.FC = ( }; }); const resPage = () => { - page.current.page = 1; + page.current.page = 0; }; return ( diff --git a/src/pages/SecurityServiceOverview/components/IndustrySign/index.tsx b/src/pages/SecurityServiceOverview/components/IndustrySign/index.tsx index dd4e613775ad0f753799de8874574eb327e22c8b..af20821c6a7158ffd15f2ae494220951cb130ffc 100644 --- a/src/pages/SecurityServiceOverview/components/IndustrySign/index.tsx +++ b/src/pages/SecurityServiceOverview/components/IndustrySign/index.tsx @@ -44,13 +44,13 @@ const IndustrySign = ({ param }: { param: any }) => { const [fetchParams, setFetchParams] = useState({ typeCode: param?.listTypeCode, data: { - pageNo: param?.pageNo ?? 1, + pageNo:0, pageSize: 10, regionCode: selectAreaId, factorytypecode: param?.factorytypecode, }, }); -console.log( param?.pageNo); + console.log(param?.pageNo); const { data: tableData } = useRequest( () => services.DataBase.getSjdzInfoData(fetchParams), @@ -138,11 +138,8 @@ console.log( param?.pageNo); ellipsis: true, render: (text, record, index) => { // 当前页码减1,乘以每页数量,再加上当前行的索引加1 - - return `${ - (fetchParams?.data?.pageNo - 1) * fetchParams?.data?.pageSize + - (index + 1) - }`; + const num = fetchParams?.data?.pageNo || 1; + return `${(num - 1) * fetchParams?.data?.pageSize + (index + 1)}`; }, }, { @@ -344,7 +341,7 @@ console.log( param?.pageNo); = (props) => { const { data } = props; - - const { dispatch } = useGlobalModalServices(); - return (
- -
-
{data.objectName}
-
CQI
+
+
+
{data.objectName}
+
+
实时CQI
{Number(data?.qualitySign)}
{getCqiStatusTexts(Number(data?.qualitySign))?.desc}
+
+
较5分钟前
+ {data.status === 'up' ? ( + + ) : ( + + )} +
+ {data?.diffValue ?? 0} +
+
-
-
{data?.desc}
-
- - {data.status === 'up' ? ( - - ) : ( - - )} -
- {data?.diffValue} -
-
+
+
+
+
+
+
{data?.eventCount ?? 0}
+
+
+
当前问题总数
-
当前问题总数
- {data?.eventCount} 件 -
-
- 查看详情 +
+
0
+
+
+
安全风险
- -
- + +
+ 查看详情 +
+
+ +
+
-
); }; diff --git a/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/PopoverCardWarn/index.tsx b/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/PopoverCardWarn/index.tsx index 8ca67b5f7130f0ad92a5d3082690b34e7dc54908..eabd76308aac1ec7898e73a241c5777ece4b669e 100644 --- a/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/PopoverCardWarn/index.tsx +++ b/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/PopoverCardWarn/index.tsx @@ -2,9 +2,9 @@ import blueBg from '@/assets/images/SecurityServiceOverview/right/blueBg.png'; import orangeBg from '@/assets/images/SecurityServiceOverview/right/orangeBg.png'; import redBg from '@/assets/images/SecurityServiceOverview/right/redBg.png'; import yellowBg from '@/assets/images/SecurityServiceOverview/right/yellowBg.png'; +import LabelImgText from '@/components/LabelImgText'; import React, { CSSProperties } from 'react'; import styles from './index.less'; -import LabelImgText from '@/components/LabelImgText'; interface PropsType { data: DistrictAPI.RealtimeIndexDTO; } @@ -67,31 +67,27 @@ const PopoverCardWarn: React.FC = (props) => { > {data?.risklevel}
-
- {data?.current_status} +
{data?.current_status}
+
+
+ + +
+
+
+ 查看详情
-
-
- - - -
-
-
- 查看详情 -
-
div { + > div { width: 40px; height: 40px; border-radius: 4px; @@ -294,8 +301,11 @@ transform: translateX(-50%); z-index: 999; } +} +.window1 { + box-sizing: border-box; - &::before { + &::after { position: absolute; content: ''; /**三角形 */ @@ -303,14 +313,13 @@ height: 0; border-style: solid; border-width: 10px 10px 0 10px; - border-color: rgba(64, 146, 217, 0.95) transparent transparent transparent; - bottom: -10px; + border-color: rgb(3, 85, 135) transparent transparent transparent; + bottom: -7px; left: 50%; transform: translateX(-50%); - z-index: 998; + z-index: 999; } } - .modalTitle { .title { background: linear-gradient(180deg, rgb(255, 255, 255), rgb(181, 229, 255)); @@ -327,9 +336,11 @@ width: 83px; height: 24px; border-radius: 12px; - background: linear-gradient(180deg, - rgba(26, 66, 110, 0), - rgb(122, 94, 111) 100%); + background: linear-gradient( + 180deg, + rgba(26, 66, 110, 0), + rgb(122, 94, 111) 100% + ); color: #ff7a7a; text-align: center; font-size: 16px; @@ -342,4 +353,4 @@ font-size: 16px; color: #bccee9; } -} \ No newline at end of file +} diff --git a/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/index.tsx b/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/index.tsx index 0ba046269ae333b02d44729de7b96c2e9044f92c..b36e85251b4f547b586f6f4826fc714f7ac5808b 100644 --- a/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/index.tsx +++ b/src/pages/SecurityServiceOverview/components/MapCantainer/DistrictMap/index.tsx @@ -161,13 +161,18 @@ const DistrictMap: React.FC = () => { if (playingStatus) { // 开始计时任务 intervalId = setInterval(() => { + if (!eventHtmlRef.current) { + clearInterval(intervalId); + } if ( - (eventHtmlRef.current as HTMLDivElement).scrollTop + viewBoxH >= + ((eventHtmlRef.current as HTMLDivElement)?.scrollTop ?? 0) + + viewBoxH >= childrenMaxH * 10 ) { eventHtmlRef.current?.scrollTo({ top: 0, behavior: 'instant' }); return; } + smoothScrollTo(eventHtmlRef.current as HTMLDivElement, 500, speed); }, 500); } else { @@ -331,7 +336,7 @@ const DistrictMap: React.FC = () => { }); }} > -
+
@@ -448,132 +453,149 @@ const DistrictMap: React.FC = () => {
{selectDistrict.objectName}
)}
-
图层图例
-
setLeftTabKey('1')} - > - CQI -
-
-
-
- 应急态 - {/* <60 */} +
+
+
图层图例
+
setLeftTabKey('1')} + > + CQI
-
-
-
-
预警态 <85
-
-
-
-
标准态 85-95
-
-
-
-
理想态 >95
-
-
setLeftTabKey('2')} - > - 风险预警与问题分布 -
- {leftTabKey == '2' && ( - +
+
+ 应急态 + {/* <60 */} +
+
+
+
+
预警态 <85
+
+
+
+
标准态 85-95
+
+
+
+
理想态 >95
+
+
setLeftTabKey('2')} > - { - setCheckedKeys(e); - }} - checkedKeys={checkedKeys} - treeData={[ - { - title: '安全风险', - key: '安全风险', - disabled: true, - children: [ - { - title: ( -
- 红色风险 -
- ), - key: '红色风险', - disabled: true, - }, - { - title: ( -
- 橙色风险 -
- ), - disabled: true, - key: '橙色风险', - }, - { - title: ( -
- 黄色风险 -
- ), - disabled: true, - key: '黄色风险', - }, - { - title: ( -
- 一般风险 -
- ), - disabled: true, - key: '一般风险', - }, - ], - }, - { - title: '城市问题', - key: '城市问题', - children: [ - { - title: ( -
- - 其他问题 -
- ), - key: '其他问题', - }, - { - title: ( -
- - 突出问题 -
- ), - key: '突出问题', - }, - ], + 风险预警与问题分布 +
+ {leftTabKey == '2' && ( + - - )} + }} + > + { + setCheckedKeys(e); + }} + checkedKeys={checkedKeys} + treeData={[ + { + title: '安全风险', + key: '安全风险', + disabled: true, + children: [ + { + title: ( +
+ 红色风险 +
+ ), + key: '红色风险', + disabled: true, + }, + { + title: ( +
+ 橙色风险 +
+ ), + disabled: true, + key: '橙色风险', + }, + { + title: ( +
+ 黄色风险 +
+ ), + disabled: true, + key: '黄色风险', + }, + { + title: ( +
+ 一般风险 +
+ ), + disabled: true, + key: '一般风险', + }, + ], + }, + { + title: '城市问题', + key: '城市问题', + children: [ + { + title: ( +
+ + 其他问题 +
+ ), + key: '其他问题', + }, + { + title: ( +
+ + 突出问题 +
+ ), + key: '突出问题', + }, + ], + }, + ]} + /> + + )} +
diff --git a/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.less b/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.less index 096b4ead30d4696fb76b630578a42396dc67e587..1028a1a92e508ab7c4a48e6066e798e73eb626de 100644 --- a/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.less +++ b/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.less @@ -5,17 +5,17 @@ position: relative; border-radius: 20px; - >img { + > img { cursor: pointer; } - >img:nth-of-type(1) { + > img:nth-of-type(1) { position: absolute; left: 700px; top: 200px; } - >img:nth-of-type(2) { + > img:nth-of-type(2) { position: absolute; left: 1100px; top: 340px; @@ -28,7 +28,7 @@ bottom: 30px; z-index: 1001; - >div { + > div { width: 40px; height: 40px; border-radius: 4px; @@ -48,20 +48,22 @@ position: absolute; top: 10px; right: 10px; - // width: 625px; padding: 20px 20px; z-index: 997; - - border-radius: 10px; - background: rgba(12, 60, 112, 0.7); - // display: flex; - // align-items: center; - // justify-content: center; - color: rgb(203, 227, 240); font-size: 16px; + .menuBg { + background: rgba(12, 60, 112, 0.7); + border-radius: 20px; + backdrop-filter: blur(20px); + background: rgba(12, 60, 112, 0.7); + position: absolute; + inset: 0; + z-index: 100; + } + .title { color: rgb(188, 206, 233); font-size: 18px; @@ -103,8 +105,6 @@ background-color: rgba(12, 60, 112, 0.135) !important; } - - .ant-tree .ant-tree-switcher .ant-tree-switcher-icon { display: none !important; } @@ -115,7 +115,7 @@ } .ant-tree-node-content-wrapper.ant-tree-node-selected, - .ant-tree-checkbox+span.ant-tree-node-selected { + .ant-tree-checkbox + span.ant-tree-node-selected { background-color: rgba(12, 60, 112, 0.197) !important; } } @@ -132,6 +132,7 @@ width: 352px; height: 605px; z-index: 997; + // box-sizing: content-box; border-radius: 20px; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); @@ -139,8 +140,8 @@ position: absolute; left: 10px; top: 100px; + // overflow: auto; padding: 16px 25px; - overflow-y: auto; } .listTitle { @@ -225,7 +226,7 @@ padding: 4px 15px; cursor: pointer; - >span { + > span { font-size: 28px; font-family: D-DIN; margin-left: 12px; @@ -249,8 +250,12 @@ width: 83px; height: 24px; border-radius: 12px; - background: linear-gradient(180.00deg, rgba(26, 66, 110, 0), rgb(122, 94, 111) 100%); - color: #FF7A7A; + background: linear-gradient( + 180deg, + rgba(26, 66, 110, 0), + rgb(122, 94, 111) 100% + ); + color: #ff7a7a; text-align: center; font-size: 16px; line-height: 23px; @@ -260,7 +265,7 @@ .type { font-size: 16px; - color: #BCCEE9; + color: #bccee9; } } @@ -300,4 +305,4 @@ transform: translateX(-50%); z-index: 998; } -} \ No newline at end of file +} diff --git a/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.tsx b/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.tsx index 76538bb0a98a6886dc45322c30233ae4b806ace7..1596524dbc3d646bd47c95e5a7c3430cf48407c4 100644 --- a/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.tsx +++ b/src/pages/SecurityServiceOverview/components/MapCantainer/EmphasisAreaMap/index.tsx @@ -451,7 +451,7 @@ const EmphasisAreaMap: React.FC = () => {
重点区域列表
-
+
{areaList?.map((item: any, index: number) => { return (
@@ -544,129 +544,146 @@ const EmphasisAreaMap: React.FC = () => {
-
图层图例
-
setLeftTabKey('1')} - > - CQI -
-
-
-
应急态 <60
-
-
-
-
预警态 <85
-
-
-
-
标准态 85-95
-
-
-
-
理想态 >95
-
-
setLeftTabKey('2')} - > - 风险预警与问题分布 -
- {leftTabKey == '2' && ( -
+
+
图层图例
+
setLeftTabKey('1')} > - { - setCheckedKeys(e); - }} - checkedKeys={checkedKeys} - treeData={[ - { - title: '安全风险', - key: '安全风险', - disabled: true, - children: [ - { - title: ( -
- 红色风险 -
- ), - key: '红色风险', - disabled: true, - }, - { - title: ( -
- 橙色风险 -
- ), - key: '橙色风险', - disabled: true, - }, - { - title: ( -
- 黄色风险 -
- ), - key: '黄色风险', - disabled: true, - }, - { - title: ( -
- 一般风险 -
- ), - disabled: true, - key: '一般风险', - }, - ], - }, - { - title: '城市问题', - key: '城市问题', - children: [ - { - title: ( -
- - 其他问题 -
- ), - key: '其他问题', - }, - { - title: ( -
- - 突出问题 -
- ), - key: '突出问题', - }, - ], - }, - ]} + CQI +
+
+
- - )} +
应急态 <60
+
+
+
+
预警态 <85
+
+
+
+
标准态 85-95
+
+
+
+
理想态 >95
+
+
setLeftTabKey('2')} + > + 风险预警与问题分布 +
+ {leftTabKey == '2' && ( + + { + setCheckedKeys(e); + }} + checkedKeys={checkedKeys} + treeData={[ + { + title: '安全风险', + key: '安全风险', + disabled: true, + children: [ + { + title: ( +
+ 红色风险 +
+ ), + key: '红色风险', + disabled: true, + }, + { + title: ( +
+ 橙色风险 +
+ ), + key: '橙色风险', + disabled: true, + }, + { + title: ( +
+ 黄色风险 +
+ ), + key: '黄色风险', + disabled: true, + }, + { + title: ( +
+ 一般风险 +
+ ), + disabled: true, + key: '一般风险', + }, + ], + }, + { + title: '城市问题', + key: '城市问题', + children: [ + { + title: ( +
+ + 其他问题 +
+ ), + key: '其他问题', + }, + { + title: ( +
+ + 突出问题 +
+ ), + key: '突出问题', + }, + ], + }, + ]} + /> +
+ )} +
{/* 事件详情 */} void }) => { ({ - ...item, - value: item?.VALUE, - label:item?.name - }))} + options={[{ + value:'人工填报', + label:'人工填报' + }, + { + value:'感知监测', + label:'感知监测' + }]} placeholder="全部来源" allowClear onChange={(e) => { - setSearchParams({ ...searchParams, source: e }); + setSearchParams({ ...searchParams, dateSources: e }); }} />