-
{showContent && isInstitution && }
{showContent && isSupervision && }
diff --git a/src/pages/Container/Institution/index.css b/src/pages/Container/Institution/index.css
index f193675..f381e24 100644
--- a/src/pages/Container/Institution/index.css
+++ b/src/pages/Container/Institution/index.css
@@ -53,7 +53,7 @@
.dashboard-block-head > div {
display: flex;
gap: 1.4rem;
- font-size: 0.7rem;
+ font-size: 0.88rem;
color: #64748b;
}
@@ -79,8 +79,8 @@
}
.dashboard-status-grid article > i {
- width: 34px;
- height: 34px;
+ width: 38px;
+ height: 38px;
border-radius: 4px;
display: flex;
align-items: center;
@@ -88,8 +88,8 @@
color: #fff;
font-style: normal;
font-weight: 700;
- font-size: 13px;
- flex: 0 0 34px;
+ font-size: 16px;
+
}
.dashboard-status-grid .blue { background: #4098f7; }
@@ -105,13 +105,13 @@
}
.dashboard-status-grid span {
- font-size: 0.7rem;
+ font-size: 1rem;
color: #64748b;
}
.dashboard-status-grid strong {
- font-size: 1rem;
- margin-top: 0.15rem;
+ font-size: 1.25rem;
+ /* margin-top: 0.15rem; */
color: #1e293b;
}
@@ -149,7 +149,7 @@
color: #fff;
font-style: normal;
font-weight: 700;
- font-size: 13px;
+ font-size: 14px;
flex: 0 0 34px;
}
@@ -163,7 +163,7 @@
}
.dashboard-reminder-grid span {
- font-size: 0.68rem;
+ font-size: 0.88rem;
color: #64748b;
}
@@ -222,7 +222,7 @@
justify-content: center;
gap: 0.8rem;
flex-wrap: wrap;
- font-size: 0.62rem;
+ font-size: 0.88rem;
color: #64748b;
margin-top: 8px;
}
@@ -257,7 +257,7 @@
.dashboard-project-table th,
.dashboard-project-table td {
padding: 0.65rem 0.55rem;
- font-size: 0.7rem;
+ font-size: 0.88rem;
}
.dashboard-project-table th {
@@ -291,7 +291,7 @@
padding: 0.42rem 0.85rem;
border: 1px solid var(--color-border, #e2e8f0);
border-radius: 8px;
- font-size: 0.78rem;
+ font-size: 0.88rem;
font-weight: 500;
cursor: pointer;
transition: all 0.15s ease;
@@ -314,7 +314,7 @@
}
.btn-ghost:hover { background: #f1f5f9; color: #1e293b; }
-.btn-sm { padding: 0.3rem 0.75rem; font-size: 0.7rem; }
+.btn-sm { padding: 0.3rem 0.75rem; font-size: 0.88rem; }
.dashboard-btn-ghost {
display: inline-flex;
@@ -323,7 +323,7 @@
padding: 0.3rem 0.75rem;
border: none;
border-radius: 8px;
- font-size: 0.7rem;
+ font-size: 0.88rem;
font-weight: 500;
cursor: pointer;
background: transparent;
@@ -343,7 +343,7 @@
padding: 0.3rem 0.75rem;
border: none;
border-radius: 8px;
- font-size: 0.7rem;
+ font-size: 0.88rem;
font-weight: 500;
cursor: pointer;
text-decoration: none;
diff --git a/src/pages/Container/Supervision/Cockpit/index.css b/src/pages/Container/Supervision/Cockpit/index.css
index c7ee99a..f657769 100644
--- a/src/pages/Container/Supervision/Cockpit/index.css
+++ b/src/pages/Container/Supervision/Cockpit/index.css
@@ -184,16 +184,16 @@
box-shadow: inset 0 0 14px rgba(46, 204, 255, .34);
}
-.life-stat p { margin: 0 0 3px; color: #cde9ff; font-size: 11px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
-.life-stat strong { color: #20caff; font-size: 13px; font-family: Arial, sans-serif; }
+.life-stat p { margin: 0 0 3px; color: #cde9ff; font-size: 14px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
+.life-stat strong { color: #20caff; font-size: 14px; font-family: Arial, sans-serif; }
.progress-list { padding: 2px 8px 10px; border-top: 1px solid rgba(54, 142, 219, .18); }
-.progress-row { height: 31px; display: grid; grid-template-columns: 122px 1fr 34px; align-items: center; gap: 8px; font-size: 11px; color: #e2f5ff; }
+.progress-row { height: 31px; display: grid; grid-template-columns: 122px 1fr 34px; align-items: center; gap: 8px; font-size: 14px; color: #e2f5ff; }
.progress-track { height: 9px; border-radius: 999px; background: rgba(5, 35, 83, .88); overflow: hidden; box-shadow: inset 0 0 9px rgba(5, 17, 44, .9); }
.progress-track i { display: block; height: 100%; border-radius: inherit; box-shadow: 0 0 8px currentColor; }
-.progress-row b { color: #e8f8ff; font-size: 11px; }
+.progress-row b { color: #e8f8ff; font-size: 14px; }
.industry-chart { height: 178px; }
-.risk-panel h3 { margin: 0 0 8px; color: #eaf9ff; font-size: 12px; font-weight: 700; }
+.risk-panel h3 { margin: 0 0 8px; color: #eaf9ff; font-size: 14px; font-weight: 700; }
.risk-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.risk-item {
min-height: 38px;
@@ -207,7 +207,7 @@
}
.risk-item:nth-child(3), .risk-item:nth-child(4) { border-color: rgba(255, 207, 43, .45); background: linear-gradient(90deg, rgba(116, 89, 15, .54), rgba(6, 32, 73, .62)); }
.risk-item:nth-child(5) { grid-column: 1 / -1; }
-.risk-item span { color: #e8f7ff; font-size: 11px; line-height: 1.3; }
+.risk-item span { color: #e8f7ff; font-size: 14px; line-height: 1.3; }
.risk-item b { color: #21caff; font-size: 17px; }
.risk-pie { height: 118px; }
@@ -220,9 +220,9 @@
box-shadow: inset 0 0 20px rgba(42, 208, 255, .16), 0 0 10px rgba(0, 161, 255, .18);
}
.kpi-card::before { content: ""; position: absolute; top: -1px; left: 28px; width: 54px; height: 4px; background: repeating-linear-gradient(90deg, #2adfff 0 9px, transparent 9px 15px); }
-.kpi-card p { margin: 0 0 6px; text-align: center; color: #d6f7ff; font-weight: 700; font-size: 12px; }
+.kpi-card p { margin: 0 0 6px; text-align: center; color: #d6f7ff; font-weight: 700; font-size: 14px; }
.kpi-card strong { font-size: 22px; color: #fff; letter-spacing: 1px; }
-.kpi-card span { float: right; margin-top: 7px; color: #d9ebff; font-size: 11px; }
+.kpi-card span { float: right; margin-top: 7px; color: #d9ebff; font-size: 14px; }
.kpi-card b { color: #fff; }
.map-shell { flex: 1; min-height: 456px; position: relative; }
@@ -238,12 +238,12 @@
box-shadow: inset 0 0 18px rgba(18, 195, 255, .38), 0 0 10px rgba(0, 132, 255, .34);
}
.map-card strong { display: block; font-size: 14px; margin-bottom: 5px; }
-.map-card span { font-size: 12px; }
+.map-card span { font-size: 14px; }
.map-card--1 { left: 45%; top: 45%; }
.map-card--2 { right: 4%; top: 54%; }
.map-card--3 { left: 42%; bottom: 13%; }
.map-card--4 { right: 13%; bottom: 12%; }
-.map-legend { position: absolute; left: 36px; bottom: 34px; margin: 0; padding: 0; list-style: none; color: #d8ebff; font-size: 12px; }
+.map-legend { position: absolute; left: 36px; top: 34px; margin: 0; padding: 0; list-style: none; color: #d8ebff; font-size: 14px; }
.map-legend li { margin: 7px 0; display: flex; align-items: center; gap: 8px; }
.map-legend li::before { content: ""; width: 12px; height: 4px; background: #c9ec75; }
.map-legend li:nth-child(2)::before { background: #ffe376; }
@@ -253,10 +253,10 @@
.todo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 10px; }
.todo-item { display: grid; grid-template-columns: 34px 1fr; grid-template-rows: 18px 18px; align-items: center; column-gap: 8px; }
.todo-item span { grid-row: 1 / 3; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #fff; font-size: 16px; background: radial-gradient(circle, rgba(73, 198, 255, .5), rgba(7, 51, 112, .95)); border: 1px solid rgba(69, 204, 255, .64); box-shadow: inset 0 0 15px rgba(53, 202, 255, .3); }
-.todo-item p { margin: 0; color: #d8edff; font-size: 11px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
+.todo-item p { margin: 0; color: #d8edff; font-size: 14px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
.todo-item b { color: #13c8ff; font-size: 15px; }
.period-tabs { position: absolute; left: 14px; top: 42px; display: flex; z-index: 2; }
-.period-tabs span { width: 34px; height: 19px; display: grid; place-items: center; color: #d8f2ff; border: 1px solid rgba(46, 159, 232, .48); background: rgba(7, 37, 88, .6); font-size: 11px; cursor: pointer; }
+.period-tabs span { width: 34px; height: 19px; display: grid; place-items: center; color: #d8f2ff; border: 1px solid rgba(46, 159, 232, .48); background: rgba(7, 37, 88, .6); font-size: 14px; cursor: pointer; }
.period-tabs span + span { border-left: none; }
.period-tabs span.active { background: rgba(5, 126, 176, .5); color: #fff; }
.line-chart { height: 176px; }
@@ -264,7 +264,7 @@
.review-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 14px; }
.review-stat { display: flex; align-items: center; gap: 8px; min-width: 0; }
.review-stat span { width: 37px; height: 37px; display: grid; place-items: center; color: #20d3ff; font-size: 17px; border-radius: 50%; background: radial-gradient(circle, rgba(26, 188, 255, .35), rgba(5, 37, 93, .9)); border: 2px solid rgba(35, 210, 255, .65); }
-.review-stat p { margin: 0; color: #e1f5ff; font-size: 12px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
+.review-stat p { margin: 0; color: #e1f5ff; font-size: 14px; white-space: normal; line-height: 1.1; overflow-wrap: anywhere; }
.review-stat b { color: #18c9ff; font-size: 15px; }
.review-stat b.danger { color: #ff3e53; }
.review-pie { height: 144px; }
@@ -272,7 +272,7 @@
.process-grid { height: 128px; display: grid; grid-template-columns: repeat(5, 1fr); grid-template-rows: repeat(2, 52px); gap: 18px 28px; align-content: center; }
.process-node { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; border: 1px solid #078bff; background: linear-gradient(180deg, rgba(12, 71, 150, .72), rgba(2, 24, 69, .85)); box-shadow: inset 0 0 18px rgba(13, 146, 255, .25); }
.process-node strong { color: #16d3ff; font-size: 18px; line-height: 20px; }
-.process-node span { color: #fff; font-size: 12px; }
+.process-node span { color: #fff; font-size: 14px; }
.process-node i { position: absolute; right: -26px; top: 50%; width: 22px; height: 16px; transform: translateY(-50%); background: linear-gradient(90deg, transparent, rgba(25, 210, 255, .85)); clip-path: polygon(0 0, 70% 50%, 0 100%, 30% 50%); }
.process-node:nth-child(5) i { right: 50%; top: 60px; transform: translateX(50%) rotate(90deg); }
.process-node:nth-child(n+6) i { right: auto; left: -26px; transform: translateY(-50%) rotate(180deg); }
@@ -310,7 +310,7 @@
}
.map-summary span {
- font-size: 12px;
+ font-size: 14px;
color: #d9f2ff;
}
diff --git a/src/pages/Container/Supervision/Cockpit/index.js b/src/pages/Container/Supervision/Cockpit/index.js
index a1a9697..f8a1041 100644
--- a/src/pages/Container/Supervision/Cockpit/index.js
+++ b/src/pages/Container/Supervision/Cockpit/index.js
@@ -188,18 +188,18 @@ function LifecyclePanel({ data, loading }) {
const barOption = useMemo(() => ({
color: ['#1aa7ff', '#d7a92c'],
grid: { left: 28, right: 10, top: 20, bottom: 42 },
- legend: { right: 8, top: 0, itemWidth: 10, itemHeight: 6, textStyle: { color: '#b9d8ff', fontSize: 10 } },
+ legend: { right: 8, top: 0, itemWidth: 10, itemHeight: 6, textStyle: { color: '#b9d8ff', fontSize: 14 } },
tooltip: { trigger: 'axis', backgroundColor: 'rgba(3, 25, 66, .92)', borderColor: '#1aa7ff', textStyle: { color: '#dff7ff' } },
xAxis: {
type: 'category',
data: industryList.map(item => item.industryName),
- axisLabel: { color: '#b9cfff', fontSize: 10, interval: 0, rotate: 0, width: 38, overflow: 'break' },
+ axisLabel: { color: '#b9cfff', fontSize: 14, interval: 0, rotate: 0, width: 38, overflow: 'break' },
axisLine: { lineStyle: { color: '#17416e' } },
axisTick: { show: false },
},
yAxis: {
type: 'value', max: 220, splitNumber: 4,
- axisLabel: { color: '#b9cfff', fontSize: 10 },
+ axisLabel: { color: '#b9cfff', fontSize: 14 },
splitLine: { lineStyle: { color: 'rgba(78, 143, 219, .2)', type: 'dashed' } },
},
series: [
@@ -240,7 +240,7 @@ function RiskPanel({ data, loading }) {
const pieOption = useMemo(() => ({
color: ['#5f8cff', '#e96fff', '#5fd8ae', '#b6a0ff'],
tooltip: { trigger: 'item', backgroundColor: 'rgba(3, 25, 66, .92)', borderColor: '#1aa7ff', textStyle: { color: '#dff7ff' } },
- legend: { orient: 'vertical', right: 2, top: 'center', itemWidth: 10, itemHeight: 6, textStyle: { color: '#c6dcff', fontSize: 10 } },
+ legend: { orient: 'vertical', right: 2, top: 'center', itemWidth: 10, itemHeight: 6, textStyle: { color: '#c6dcff', fontSize: 14 } },
series: [{ type: 'pie', radius: ['46%', '70%'], center: ['30%', '55%'], avoidLabelOverlap: true, label: { show: false }, data: data.riskPie }],
}), [data.riskPie]);
@@ -282,7 +282,7 @@ function KpiCards({ data, loading }) {
// ==================== 地图区域分布 ====================
function MapSection({ data, loading }) {
const [selectedAreaName, setSelectedAreaName] = useState('重庆市');
- const zoomRef = useRef(1.1);
+ const zoomRef = useRef(1.3);
const chartInstanceRef = useRef(null);
const { regionList, regionSummary, mapScatterPoints } = data;
@@ -330,14 +330,14 @@ function MapSection({ data, loading }) {
borderColor: '#1aa7ff',
borderWidth: 1,
padding: [8, 10],
- textStyle: { color: '#eaf9ff', fontSize: 12 },
+ textStyle: { color: '#eaf9ff', fontSize: 14 },
formatter: params => {
const item = params.data || statMap.get(params.name);
if (!item) return params.name;
// 随地图缩放比例同步缩放悬浮框字体
const z = zoomRef.current || 1;
- const fs = Math.max(10, Math.round(12 * z));
- const title = Math.round(13 * z);
+ const fs = Math.max(14, Math.round(14 * z));
+ const title = Math.round(14 * z);
return `
${params.name}
评价项目数:${item.evalProjectCount || 0}
@@ -356,7 +356,7 @@ function MapSection({ data, loading }) {
geo: {
map: 'chongqing',
roam: true,
- zoom: 1.1,
+ zoom: 1.0,
top: 10,
bottom: 0,
left: 0,
@@ -376,7 +376,7 @@ function MapSection({ data, loading }) {
label: { show: true, color: '#061a35', fontWeight: 700 },
itemStyle: { areaColor: '#31d6ff', borderColor: '#ffffff', borderWidth: 2.2 },
},
- label: { show: true, color: '#244269', fontSize: 10 },
+ label: { show: true, color: '#244269', fontSize: 14 },
},
series: [
{
@@ -486,10 +486,10 @@ function ReviewLinePanel({ data, period, onPeriodChange, loading }) {
return {
color: ['#0da5ff', '#29e487', '#ffb74d', '#ce93d8', '#4dd0e1', '#f48fb1'],
grid: { left: 34, right: 12, top: 28, bottom: 32 },
- legend: { right: 0, top: 0, itemWidth: 14, itemHeight: 4, textStyle: { color: '#c6dcff', fontSize: 10 } },
+ legend: { right: 0, top: 0, itemWidth: 14, itemHeight: 4, textStyle: { color: '#c6dcff', fontSize: 14 } },
tooltip: { trigger: 'axis', backgroundColor: 'rgba(3, 25, 66, .92)', borderColor: '#1aa7ff', textStyle: { color: '#dff7ff' } },
- xAxis: { type: 'category', boundaryGap: false, data: trendBuckets, axisLabel: { color: '#c6dcff', fontSize: 10 }, axisLine: { lineStyle: { color: '#17416e' } }, axisTick: { show: false } },
- yAxis: { type: 'value', min: 0, max: 100, splitNumber: 5, axisLabel: { color: '#c6dcff', fontSize: 10 }, splitLine: { lineStyle: { color: 'rgba(78, 143, 219, .22)', type: 'dashed' } } },
+ xAxis: { type: 'category', boundaryGap: false, data: trendBuckets, axisLabel: { color: '#c6dcff', fontSize: 14 }, axisLine: { lineStyle: { color: '#17416e' } }, axisTick: { show: false } },
+ yAxis: { type: 'value', min: 0, max: 100, splitNumber: 5, axisLabel: { color: '#c6dcff', fontSize: 14 }, splitLine: { lineStyle: { color: 'rgba(78, 143, 219, .22)', type: 'dashed' } } },
series: seriesConfig,
};
}, [trendBuckets, trendSeries]);
@@ -526,7 +526,7 @@ function ReviewProgressPanel({ data, loading }) {
const pieOption = useMemo(() => ({
color: ['#1677ff', '#00c089', '#ff7a1a', '#f7cb16', '#ab5fde'],
tooltip: { trigger: 'item', backgroundColor: 'rgba(3, 25, 66, .92)', borderColor: '#1aa7ff', textStyle: { color: '#dff7ff' } },
- legend: { orient: 'vertical', right: 0, top: 'center', itemWidth: 10, itemHeight: 8, textStyle: { color: '#c6dcff', fontSize: 10 } },
+ legend: { orient: 'vertical', right: 0, top: 'center', itemWidth: 10, itemHeight: 8, textStyle: { color: '#c6dcff', fontSize: 14 } },
series: [{ type: 'pie', radius: ['32%', '68%'], center: ['28%', '56%'], label: { show: false }, data: reviewPieItems.map(item => ({ name: item.name, value: item.value })) }],
}), [reviewPieItems]);