修改样式

src/views/screen/Dashboard.vue

@@ -126,6 +126,7 @@
               <div class="header-left">
                 <img src="./dashboard/dp_icon4.png" alt="icon" />
                 <span class="header-left-text">乡镇瞬时热量【实时】</span>
+                <span class="header-left-text" style="margin-left: 140px;">单位：kw</span>
               </div>
             </div>
             <div class="area-body"></div>
@@ -135,6 +136,7 @@
               <div class="header-left">
                 <img src="./dashboard/dp_icon4.png" alt="icon" />
                 <span class="header-left-text">乡镇瞬时流量【实时】</span>
+                <span class="header-left-text" style="margin-left: 130px;">单位：m³/h</span>
               </div>
             </div>
             <div class=" area-body"></div>
@@ -332,7 +334,7 @@ function updateChartMain() {
         return content;
       },
     },
-    xAxis: { type: 'category', data: names, axisLabel: { rotate: 0, interval: 0, color: jbztys.value }, axisTick: { show: false }, axisLine: { show: true, lineStyle: { color: jbzbzys.value } } },
+    xAxis: { type: 'category', data: names, axisLabel: { fontSize: 16,rotate: 0, interval: 0, color: jbztys.value }, axisTick: { show: false }, axisLine: { show: true, lineStyle: { color: jbzbzys.value } } },
     yAxis: { type: 'value', axisLabel: { color: jbztys.value, margin: 8 }, axisTick: { show: false }, axisLine: { show: true, lineStyle: { color: jbzbzys.value } }, splitLine: { show: false } },
     series: [
       { type: 'bar', barWidth: '15px', data: names.map(() => maxVal), barGap: '-100%', itemStyle: { color: { type: 'linear', x: 0, y: 0, x2: 0, y2: 1, colorStops: [{ offset: 0, color: 'rgba(106,211,255,0.06)' }, { offset: 1, color: 'rgba(106,211,255,0.01)' }] } }, z: 1, silent: true },
@@ -452,7 +454,7 @@ function updateChartCounty() {
   const maxVal = values.length ? Math.max(...values) * 1.15 : 100;
 
   chartCounty.setOption({
-    grid: { left: 10, right: 40, bottom: 14, top: 28, containLabel: true },
+    grid: { left: 10, right: 60, bottom: 14, top: 28, containLabel: true },
     tooltip: {
       trigger: 'axis',
       axisPointer: {
@@ -482,7 +484,7 @@ function updateChartCounty() {
     yAxis: {
       type: 'category',
       data: names,
-      axisLabel: { color: jbztys.value, interval: 0 },
+      axisLabel: { color: jbztys.value, interval: 0,fontSize: 18,  },
       axisTick: { show: false },
       axisLine: { show: false }
     },
@@ -503,9 +505,10 @@ function updateChartCounty() {
           show: true,
           position: 'right',
           distance: 0,
+          fontSize: 16, // 添加这行来设置文字大小
           align: 'left',
           color: '#ffffff',
-          formatter: (params: any) => `{icon|} ${values[params.dataIndex]}`+ 'kw', // 数值左边加图标
+          formatter: (params: any) => `{icon|} ${values[params.dataIndex]}`, // 数值左边加图标
           rich: {
             icon: {
               height: 14,           // 图标高度
@@ -526,7 +529,7 @@ function updateChartCounty() {
 // area-7 的雷达图更新函数
 function updateRadarChart() {
   if (!chartRadar) return;
-  const names = countyList.value.map(i => i.raw?.view028.replace('锅炉房', '') + '\n' + i.raw?.view037 + 'm³/h');
+  const names = countyList.value.map(i => i.raw?.view028.replace('锅炉房', '') + '\n' + i.raw?.view037 );
   const values = countyList.value.map(i => (i.raw?.view037 ? Number(i.raw.view037) : 0));
   const maxVal = values.length ? Math.max(...values) * 1.15 : 100;
 
@@ -561,22 +564,22 @@ function updateRadarChart() {
       splitNumber: 0,
       center: ['50%', '45%'],
       radius: '68%',
-      nameGap:40,
+      nameGap:30,
       name: {
         rich: {
-          padding: [20, 20, 20, 20]
+          padding: [20, 20, 10, 20]
         },
         offset: 15,
         textStyle: {
           color: '#f4f4f4',
-          fontSize: 12,
+          fontSize: 18,
           borderRadius: 3,
           padding: [3, 5],
           align: 'center',
           verticalAlign: 'middle',
           distance: 20
         },
-        lineHeight: 14
+        lineHeight: 20
       },
       splitLine: { lineStyle: { color: 'rgba(50,150,200,0.3)' } },
       splitArea: { show: true, areaStyle: { color: ['rgba(15,40,70,0.5)', 'rgba(20,50,80,0.3)'] } },
@@ -648,7 +651,7 @@ function updateChartArea8() {
       type: 'category',
       boundaryGap: false,
       data: names,
-      axisLabel: { rotate: 0, interval: 0, color: jbztys.value },
+      axisLabel: { rotate: 0, interval: 0, color: jbztys.value ,fontSize: 16},
       axisLine: { lineStyle: { color: jbzbzys.value } },
       axisTick: { show: false },
       splitLine: { show: false }
@@ -1235,7 +1238,7 @@ function closeModal3() {
   padding: 0;
   line-height: 1;
   font-weight: 600;
-  font-size: 15px;
+  font-size: 16px;
 }
 
 
@@ -1369,7 +1372,7 @@ function closeModal3() {
 
 /* 左侧文字样式（按需改色）*/
 .header-left-text {
-  font-size: 16px;
+  font-size: 18px;
   font-weight: 500;
   line-height: 1;
   color: #fff;
@@ -1452,7 +1455,7 @@ function closeModal3() {
   justify-content: space-between;
   background-color: rgba(19, 23, 34, 0.05); // #131722 几乎透明
   color: #fff;
-  font-size: 16px;
+  font-size: 18px;
   height: 30px;
   padding: 0 8px;
   gap: 8px;
@@ -1481,10 +1484,10 @@ function closeModal3() {
   justify-content: space-between;
   background-color: rgba(19, 23, 34, 0.4); // #131722 半透明
   color: #fff;
-  font-size: 14px;
+  font-size: 18px;
   margin: 5px 0; // 行间距 2px
   padding: 0 30px;
-  height: 28px;
+  height: 40px;
   box-sizing: border-box;
 }