diff --git a/src/components/ModeSwitch/index.css b/src/components/ModeSwitch/index.css
index 8de9b197f56800d52e18b88feb783c736edd7412..14755e4ad420ea7c58fe095d10f965cdbe03394c 100644
--- a/src/components/ModeSwitch/index.css
+++ b/src/components/ModeSwitch/index.css
@@ -31,7 +31,7 @@
transform: translateX(126px);
}
.container .textWrapper {
- position: relative;
+ position: relaDingTalk JinBuTi
z-index: 1;
width: 100%;
height: 100%;
diff --git a/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.css b/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.css
index 00c6f02b9e9661d702a9456940930e9a1fb5e57e..cba65a70f27d97beda942e34ebac579db835fc5f 100644
--- a/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.css
+++ b/src/pages/NewHome/NewLeftSidebar/CityRealTimeCQI/index.css
@@ -1,9 +1,8 @@
.container {
height: 150px;
- background: rgba(68, 120, 195, 0.2);
+ background: url('@/assets/images/bg.png');
border-radius: 20px;
- border: 2px solid rgba(119, 199, 255, 0.1);
- padding: 20px;
+ padding: 20px 27px 16px 19px;
display: flex;
flex-direction: column;
overflow: hidden;
@@ -34,12 +33,14 @@
font-size: 26px;
font-weight: 400;
line-height: 31px;
+ color: #B3D6F7;
}
.container .header .tip {
font-size: 18px;
+ cursor: pointer;
}
.container .header .icon {
- color: #6194c7;
+ color: #b3d6f7;
font-size: 20px;
cursor: pointer;
margin: 0 10px;
@@ -52,6 +53,7 @@
}
.container .content .scoreSection .desc {
color: #d9d9d9;
+ font-family: DingTalk JinBuTi;
font-size: 18px;
line-height: 1;
font-weight: 400;
@@ -77,7 +79,7 @@
padding: 2px;
}
.container .content .scoreSection .title {
- font-family: '钉钉进步体';
+ font-family: DingTalk JinBuTi;
font-size: 18px;
font-weight: 400;
line-height: 22px;
@@ -87,7 +89,7 @@
}
.container .content .dimensionItem {
width: 90px;
- height: 62px;
+ height: 71px;
border-radius: 14px;
display: flex;
flex-direction: column;
@@ -99,7 +101,7 @@
.container .content .dimensionItem .name {
color: #ffffff;
font-family: '思源黑体';
- font-size: 18px;
+ font-size: 20px;
font-weight: 400;
line-height: 1;
}
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.css b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.css
index 76fbf96b401a33ea698a5bcea13c3222cad0aaca..b116ad2e76be0713e43249363ccf92b32e13383b 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.css
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.css
@@ -1,4 +1,5 @@
.container {
+ margin-top: 12px;
width: 100%;
height: 325px;
}
@@ -9,7 +10,7 @@
}
.container .header .title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -44,6 +45,7 @@
width: 20px;
height: 14px;
cursor: pointer;
+ z-index: 1;
}
.container .progressWrap {
height: calc(100% - 46px);
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.less b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.less
index f23566673e6263c18e10dfa5e00007f5858ce6fc..fc8196a101805784303caedfe02b49b738c10f99 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.less
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.less
@@ -1,5 +1,5 @@
.container {
-// margin-top: 20px;
+ margin-top: 12px;
// padding: 20px;
// background: rgba(8, 24, 63, 0.7);
// border-radius: 15px;
@@ -15,7 +15,7 @@
.title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -52,13 +52,9 @@
width: 20px;
height: 14px;
cursor: pointer;
+ z-index: 1;
}
}
- // .quoteIcon {
- // width: 24px;
- // height: 24px;
- // cursor: pointer;
- // }
}
.progressWrap {
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx
index 8bddfaffca76a81b4dbd078ca5de74fa123deca4..185048ab6874c2f7b7ce305692eb958372cf1484 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/AreaDistribution/index.tsx
@@ -52,7 +52,27 @@ const AreaDistribution: React.FC = () => {
}, []);
const renderSummaryContent = () => {
- // console.log(pieData)
+ // 按数量分类
+ const categorizeRegions = (data: any[]) => {
+ const above400 = data.filter(item => item.num >= 400);
+ const above300 = data.filter(item => item.num >= 300 && item.num < 400);
+ const between100And300 = data.filter(item => item.num >= 100 && item.num < 300);
+ const below100 = data.filter(item => item.num < 100);
+
+ return {
+ above400,
+ above300,
+ between100And300,
+ below100
+ };
+ };
+
+ const regions = categorizeRegions(statisticTotal?.records || []);
+
+ const above300Count = regions.above300.length + regions.above400.length;
+ const above400Names = regions.above400.map(item => item.ssqy).join('和');
+ const below100Names = regions.below100.map(item => item.ssqy).join('、');
+
return (
//
//
@@ -95,8 +115,20 @@ const AreaDistribution: React.FC = () => {
彭州市、大邑县、成都东部新区、蒲江县。
+
//
//
+ //
+ //
区域分布总结
+ //
+ // 从具体区(市)县看,有{above300Count}个区(市)县案件均超过
+ // 300件
+ // {regions.above400.length > 0 && <>,其中{above400Names}超过了400件>};
+ // {regions.between100And300.length}个区(市)县处理投诉案件数在100-300件之间;
+ // 有{regions.below100.length}个区(市)县处理投诉案件少于100件,分别是
+ // {below100Names}。
+ //
+ //
);
};
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.css b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.css
index e7f6a51bcc4820c9fe93f1670b9b636259b68cf4..5f04ea369974fe97a5df96224d10c6134eb4c266 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.css
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.css
@@ -10,7 +10,7 @@
}
.container .header .title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.less b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.less
index afa670effcfc80283258061f167275a1fe6af347..4448fa815d6b00ccfa5d28e6e55f7d4647a57de5 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.less
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/ComplaintTrend/index.less
@@ -15,7 +15,7 @@
.title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/LineCharts/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/LineCharts/index.tsx
index c700ebc3ba730bc4420d210b70eaf61fbb6187d7..7a3eacd45ac25c24999c540c2872b935118bd0b5 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/LineCharts/index.tsx
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/LineCharts/index.tsx
@@ -14,10 +14,15 @@ const LineCharts = ({ dataSource }: { dataSource: any[] }) => {
name: item?.name,
type: 'line',
data: item?.data?.map((v: any) => v.num),
+ lineStyle: {
+ width: 3,
+ },
+ smooth: true, // 使用平滑曲线
+ showSymbol: false, // 不显示数据点
}
})
- console.log(series)
+ // console.log(series)
return {
color: ['#36BD3B', '#FF9743', '#FF67CB', '#9259FF', '#FFE543'],
@@ -39,7 +44,7 @@ const LineCharts = ({ dataSource }: { dataSource: any[] }) => {
left: '0',
right: '0',
bottom: '2%',
- top: '25%',
+ top: '30%',
containLabel: true,
},
legend: {
@@ -109,7 +114,40 @@ const LineCharts = ({ dataSource }: { dataSource: any[] }) => {
},
}
],
- series: series
+ series: series
+ // series: [
+ // {
+ // // name: '投诉量',
+ // // type: 'line',
+ // // smooth: true, // 使用平滑曲线
+ // // showSymbol: false, // 不显示数据点
+ // lineStyle: {
+ // width: 3,
+ // },
+ // // areaStyle: {
+ // // // 添加渐变填充
+ // // opacity: 0.3,
+ // // color: {
+ // // type: 'linear',
+ // // x: 0,
+ // // y: 0,
+ // // x2: 0,
+ // // y2: 1,
+ // // colorStops: [
+ // // {
+ // // offset: 0,
+ // // color: '#3CE88F',
+ // // },
+ // // {
+ // // offset: 1,
+ // // color: 'rgba(60,232,143,0)',
+ // // },
+ // // ],
+ // // },
+ // // },
+ // data: series,
+ // },
+ // ],
}
}, [dataSource])
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.css b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.css
index 21a59ea4ba2c8748a38c42041e32f2a9e6559c6c..e273941ccb1a9bc59f38caf903f85e1596935f63 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.css
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.css
@@ -1,4 +1,5 @@
.container {
+ margin-top: 12px;
width: 100%;
height: 160px;
}
@@ -8,7 +9,7 @@
}
.container .header .title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -42,15 +43,46 @@
.container .header .quoteWrapper .quoteIcon {
width: 20px;
height: 14px;
+ z-index: 1;
}
.container .content {
height: 100%;
}
.summaryPopover :global .ant-popover-inner {
- background: rgba(41, 84, 136, 0.95);
- padding: 20px;
+ background: #08183f !important;
+ border: 1px solid #136596;
+ box-shadow: 0px 0px 20px 0px rgba(19, 101, 150, 0.5);
+ border-radius: 15px;
+ padding: 0;
+}
+.summaryPopover :global .ant-popover-inner-content {
+ padding: 0;
+}
+.summaryPopover :global .ant-popover-arrow {
+ display: none;
+}
+.summaryPopover .content {
+ color: #546aa2;
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
+ padding: 0px 10px;
+}
+.summaryPopover .content p {
+ margin: 0;
+}
+.summaryPopover .title {
+ color: #FFFFFF;
+ font-family: 'DingTalk JinBuTi';
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 24px;
+ margin-bottom: 12px;
+ padding: 0px 10px 0;
}
.summaryPopover .highlight {
- color: #1B90FF;
- font-weight: 700;
+ color: #ffcd4b;
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
}
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.less b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.less
index f4f1744db9693731ffac8a0ed01d205678cf98d6..783b46133ff9756d18d2cdcde12110cb007f7a74 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.less
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.less
@@ -1,5 +1,5 @@
.container {
-// margin-top: 20px;
+ margin-top: 12px;
// padding: 20px;
// background: rgba(8, 24, 63, 0.7);
// border-radius: 15px;
@@ -15,7 +15,7 @@
.title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -47,17 +47,14 @@
box-sizing: border-box;
margin-left: 10px;
cursor: pointer;
-
+
.quoteIcon {
width: 20px;
height: 14px;
+ z-index: 1;
+ // cursor: pointer;
}
}
- // .quoteIcon {
- // width: 24px;
- // height: 14px;
- // cursor: pointer;
- // }
}
.content {
@@ -69,13 +66,46 @@
.summaryPopover {
:global {
.ant-popover-inner {
- background: rgba(41, 84, 136, 0.95);
- padding: 20px;
+ background: rgb(8, 24, 63) !important;
+ border: 1px solid rgb(19, 101, 150);
+ box-shadow: 0px 0px 20px 0px rgba(19, 101, 150, 0.5);
+ border-radius: 15px;
+ padding: 0;
+ }
+ .ant-popover-inner-content {
+ padding: 0;
+ }
+ .ant-popover-arrow {
+ display: none;
+ }
+ }
+
+ .content {
+ color: rgb(84, 106, 162);
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
+ padding: 0px 10px;
+
+ p {
+ margin: 0;
}
}
+ .title {
+ color: #FFFFFF;
+ font-family: 'DingTalk JinBuTi';
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 24px;
+ margin-bottom: 12px;
+ padding: 0px 10px 0;
+ }
+
.highlight {
- color: #1B90FF;
- font-weight: 700;
+ color: rgb(255, 205, 75);
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
}
}
\ No newline at end of file
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.tsx
index fd17290bf4c70d228a861e1ff77c75304703308d..265e55fe5877715cc1c5b288e720ee87b3d69b84 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.tsx
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/HighIncidenceTime/index.tsx
@@ -8,6 +8,7 @@ import quoteIcon from '@/assets/images/newMain/quote.png';
const HighIncidenceTime: React.FC = () => {
const [statisticTotal, setStatisticTotal] = useState([]);
+ const [statisticTotalForCharts, setStatisticTotalForCharts] = useState([]);
const getDate = () => {
const oneMonthAgo = dayjs().subtract(1, 'month');
@@ -26,7 +27,41 @@ const HighIncidenceTime: React.FC = () => {
});
if (resp.code === 200) {
const data = [resp.data?.all, ...resp.data?.data];
+ console.log(data)
setStatisticTotal(data);
+
+ // 处理数据,确保每个时间点都有数据,并按自然顺序排序
+ const processData = (rawData: any) => {
+ // 生成0-23的完整时间序列
+ const fullTimeData = Array.from({ length: 24 }, (_, i) => ({
+ times: i,
+ num: 0
+ }));
+
+ // 用实际数据填充
+ rawData.forEach((item: any) => {
+ const index = item.times;
+ if (index >= 0 && index < 24) {
+ fullTimeData[index].num = item.num;
+ }
+ });
+
+ return fullTimeData;
+ };
+ // setStatisticTotalForCharts(data);
+ // setStatisticTotalForCharts(processData(data));
+
+ const processedData = [
+ { ...resp.data?.all, data: processData(resp.data?.all?.data) },
+ ...resp.data?.data.map((item: any) => ({
+ ...item,
+ data: processData(item.data)
+ }))
+ ];
+ console.log(processedData)
+
+ // setStatisticTotal(resp.data?.all?.data);
+ setStatisticTotalForCharts(processedData);
}
};
@@ -35,13 +70,95 @@ const HighIncidenceTime: React.FC = () => {
}, []);
const getSummaryText = () => {
+ // 找到"整体"数据
+ const overallData = statisticTotal.find((item: any) => item.name === "整体");
+
+ // 获取整体数据中前三高发时段
+ const overallTop3Times = overallData?.data
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3)
+ .map((item: any) => item.times + '点')
+ .join('、');
+
+ // 获取除"整体"外数量最多的前三类型
+ const top3Types = statisticTotal
+ .filter((item: any) => item.name !== "整体")
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3);
+
+ // 获取每个类型的前三高发时段
+ const typeTimesSummary = top3Types.map((type: any) => {
+ const top3Times = type.data
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3)
+ .map((item: any) => item.times + '点')
+ .join('、');
+
+ return {
+ name: type.name,
+ times: top3Times
+ };
+ });
+
+ return (
+
+
高发时间总结
+
+
近一个月投诉主要集中在 {overallTop3Times}。
+
其中市民关注和反映问题较多问题:
+ {typeTimesSummary.map((item: any, index: any) => (
+
+ {item.name}集中在 {item.times}。
+
+ ))}
+
+
+ );
+ };
+
+ const getSummaryText1 = () => {
+ // 找到"整体"数据
+ const overallData = statisticTotal.find((item: any) => item.name === "整体");
+
+ // 获取整体数据中前三高发时段
+ const overallTop3Times = overallData?.data
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3)
+ .map((item: any) => item.times + '点')
+ .join('、');
+
+ // 获取除"整体"外数量最多的前三类型
+ const top3Types = statisticTotal
+ .filter((item: any) => item.name !== "整体")
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3);
+
+ // 获取每个类型的前三高发时段
+ const typeTimesSummary = top3Types.map((type: any) => {
+ const top3Times = type.data
+ .sort((a: any, b: any) => b.num - a.num)
+ .slice(0, 3)
+ .map((item: any) => item.times + '点')
+ .join('、');
+
+ return {
+ name: type.name,
+ times: top3Times
+ };
+ });
+
return (
-
-
今日投诉主要集中在 4点、6点 、10点。
-
其中市民关注和反映问题较多问题:
-
噪音扰民集中在 8点、10点 、12点。
-
占道经营集中在 6点、7点 、21点。
-
油烟扰民集中在12点、17点 、19点。
+
+
高发时间总结
+
+
近一个月投诉主要集中在 {overallTop3Times}。
+
其中市民关注和反映问题较多问题:
+ {typeTimesSummary.map((item: any, index: any) => (
+
+ {item.name}集中在 {item.times}。
+
+ ))}
+
);
};
@@ -55,6 +172,8 @@ const HighIncidenceTime: React.FC = () => {
placement="bottomRight"
trigger="click"
overlayClassName={styles.summaryPopover}
+ // overlayStyle={{ width: 262 }}
+ destroyTooltipOnHide
>

@@ -63,7 +182,7 @@ const HighIncidenceTime: React.FC = () => {
-
+
);
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/LineBarCharts/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/LineBarCharts/index.tsx
index 0b469916b887e04c0fbd9d75ce8673e6312dbe57..732d234be045c05cbaad93456a37d4a2c74713bf 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/LineBarCharts/index.tsx
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/LineBarCharts/index.tsx
@@ -99,7 +99,7 @@ const LineBarCharts = ({ dataSource }: { dataSource: any[] }) => {
valueAnimation: true,
color: '#fff',
fontWeight: 700,
- fontSize: 20
+ fontSize: 14
}
}]
};
@@ -108,7 +108,8 @@ const LineBarCharts = ({ dataSource }: { dataSource: any[] }) => {
return (
);
};
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.css b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.css
index b4b701e9522e40d33bf0412ab9799a5038c7bc65..c99ae2a20498ef052740fa27cd22635e65313dd7 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.css
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.css
@@ -11,7 +11,7 @@
}
.container .header .title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -46,31 +46,36 @@
width: 20px;
height: 14px;
}
-.container .summaryContent {
- padding: 16px;
- background: rgba(41, 84, 136, 0.95);
- border-radius: 4px;
- min-width: 200px;
- width: 552px;
- max-width: 552px;
- padding: 0 20px;
- height: 400px;
+.summaryPopover :global .ant-popover-inner {
+ background: #08183f !important;
+ border: 1px solid #136596;
+ box-shadow: 0px 0px 20px 0px rgba(19, 101, 150, 0.5);
+ border-radius: 15px;
+ padding: 0;
}
-.container .summaryContent .title {
+.summaryPopover :global .ant-popover-inner-content {
+ padding: 0;
+}
+.summaryPopover :global .ant-popover-arrow {
+ display: none;
+}
+.summaryPopover .content {
+ color: #546aa2;
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
+}
+.summaryPopover .title {
color: #FFFFFF;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 20px;
font-weight: 400;
line-height: 24px;
margin-bottom: 12px;
}
-.container .summaryContent .content {
- font-size: 18px;
+.summaryPopover .highlight {
+ color: #ffcd4b;
+ font-size: 16px;
+ line-height: 32px;
font-weight: 400;
- line-height: 2;
- color: #CBEDFF;
-}
-.container .summaryContent .content .highlight {
- color: #1B90FF;
- font-weight: 700;
}
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.less b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.less
index b93a1dd9c9fe9f2512b0433ba8eb24df10b3d29d..8256af172bf178ed7ade1155a8a153ffe00bfee7 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.less
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.less
@@ -15,7 +15,7 @@
.title {
color: #BDCEE9;
- font-family: '钉钉进步体';
+ font-family: 'DingTalk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
@@ -54,44 +54,44 @@
}
}
}
+}
-// .content {
-// flex: 1;
- // margin-top: 10px;
- // height: calc(100% - 46px);
- // height: 100%;
-// }
-
- .summaryContent {
- padding: 16px;
- background: rgba(41, 84, 136, 0.95);
- border-radius: 4px;
- min-width: 200px;
-
- width: 552px;
- max-width: 552px;
- padding: 0 20px;
- height: 400px;
-
- .title {
- color: #FFFFFF;
- font-family: '钉钉进步体';
- font-size: 20px;
- font-weight: 400;
- line-height: 24px;
- margin-bottom: 12px;
+.summaryPopover {
+ :global {
+ .ant-popover-inner {
+ background: rgb(8, 24, 63) !important;
+ // background: rgba(8, 24, 63, 0.9) !important;
+ border: 1px solid rgb(19, 101, 150);
+ box-shadow: 0px 0px 20px 0px rgba(19, 101, 150, 0.5);
+ border-radius: 15px;
+ padding: 0;
}
-
- .content {
- font-size: 18px;
- font-weight: 400;
- line-height: 2;
- color: #CBEDFF;
-
- .highlight {
- color: #1B90FF;
- font-weight: 700;
- }
+ .ant-popover-inner-content {
+ padding: 0;
+ }
+ .ant-popover-arrow {
+ display: none;
}
}
+
+ .content {
+ color: rgb(84, 106, 162);
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
+ }
+ .title {
+ color: #FFFFFF;
+ font-family: 'DingTalk JinBuTi';
+ font-size: 20px;
+ font-weight: 400;
+ line-height: 24px;
+ margin-bottom: 12px;
+ }
+ .highlight {
+ color: rgb(255, 205, 75);
+ font-size: 16px;
+ line-height: 32px;
+ font-weight: 400;
+ }
}
\ No newline at end of file
diff --git a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.tsx b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.tsx
index d1f1e6d6b4195a9fabd5c026cf6c70b44cdfbd00..3d667dc9816d9c065b9e855b24bea9d96d113d66 100644
--- a/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.tsx
+++ b/src/pages/NewHome/NewLeftSidebar/UrbanManagementIssues/PeopleComplaint/TypeDistribution/index.tsx
@@ -41,23 +41,33 @@ const TypeDistribution: React.FC = () => {
// 生成总结文本
const getSummaryText = () => {
+ // 计算总数
+ const total = statisticTotal.reduce((acc, cur) => acc + cur.num, 0);
+
+ // 获取前三名
+ const top3 = statisticTotal.slice(0, 3);
+
+ // 生成类型名称字符串
+ const typeNames = top3.map(item => item.lx).join('、');
+
+ // 生成数值字符串
+ const numbers = top3.map(item => item.num).join('件、') + '件';
+
+ // console.log(statisticTotal, total, top3);
+
+ // 生成比例字符串
+ // const percents = top3.map(item => (item.num / total * 100).toFixed(2) + '%').join('、');
+
return (
大类分布总结
- 今日环境保护、市容秩序与广告招牌、规划执法等3大类型投诉案件数较多,分别为
- 45651件、30407件25481件,占全市总投诉案件的比重分别为
- 37.73%、25.13%、21.06%。
+ 今日{typeNames}
+ 等{top3.length}大类型投诉案件数较多,分别为
+ {numbers}。
+ {/* 占全市总投诉案件的比重分别为 */}
+ {/* {percents}。 */}
-
- {/*
- 从具体区(市)县看,有6个区(市)县案件均超过
- 300件,其中成华区和
- 成都高新区超过了400件;
- 11有个区(市)县处理投诉案件数在100-300件之间;
- 有6个区(市)县处理投诉案件少于100件,分别是青白江区、新津区、
- 彭州市、大邑县、成都东部新区、蒲江县。
-
*/}
);
};
@@ -71,6 +81,8 @@ const TypeDistribution: React.FC = () => {
placement="bottomRight"
trigger="click"
overlayClassName={styles.summaryPopover}
+ overlayStyle={{ width: 262 }}
+ destroyTooltipOnHide
>

diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Card/index.css b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Card/index.css
index f423044b4b88ee7e4014187e59dd247e066474f3..58d1fa58849d17701a2636c09302d4eaafd2b068 100644
--- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Card/index.css
+++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/components/Card/index.css
@@ -6,7 +6,7 @@
}
.container .cardTitle {
color: #bdcee9;
- font-family: 'DingTalk JinBuTi';
+ font-family: 'DingTalk JinBuTialk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;
diff --git a/src/pages/NewHome/NewRightContent/IndustryOperationNew/index.css b/src/pages/NewHome/NewRightContent/IndustryOperationNew/index.css
index fa3dd628d4cca3c4a9c00ffaf07920ca9a4046de..c91ba0b72a5fe584393bffea96d38c9eb44b6ecd 100644
--- a/src/pages/NewHome/NewRightContent/IndustryOperationNew/index.css
+++ b/src/pages/NewHome/NewRightContent/IndustryOperationNew/index.css
@@ -19,7 +19,7 @@
border-radius: 38px 0px 25.5px 0px;
background: rgba(62, 147, 199, 0.3);
color: #ffffff;
- font-family: 'DingTalk JinBuTi';
+ font-family: 'DingTalk JinBuTialk JinBuTi';
font-size: 30px;
font-weight: 400;
line-height: 36px;
diff --git a/src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.css b/src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.css
index 62035f0f0f83d80eeacecb08dce5e7626550ebf3..afee059de6253f5691df74f29f86a1e1d95a935d 100644
--- a/src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.css
+++ b/src/pages/NewHome/NewRightContent/ResourceElements/components/Card/index.css
@@ -6,7 +6,7 @@
}
.container .cardTitle {
color: #bdcee9;
- font-family: 'DingTalk JinBuTi';
+ font-family: 'DingTalk JinBuTialk JinBuTi';
font-size: 22px;
font-weight: 400;
line-height: 26px;