From 8ce15ac064fed0ad0b9f295b7e82a4234bfdc773 Mon Sep 17 00:00:00 2001
From: gaohaifeng <zgaohaifeng@qq.com>
Date: Fri, 5 Sep 2025 13:39:47 +0800
Subject: [PATCH] =?UTF-8?q?refactor(Charts):=20=E7=BB=9F=E4=B8=80=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4=E9=9B=86=E6=88=90=E8=83=BD=E6=BA=90=E5=9B=BE=E8=A1=A8?=
 =?UTF-8?q?=E5=B0=BA=E5=AF=B8=E5=B9=B6=E6=B7=BB=E5=8A=A0=E8=83=8C=E6=99=AF?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将FeeOverview、ConsumptionProportion和ConstructionIndex图表的宽度调整为450，高度调整为320
- 为ConstructionIndex图表添加缺失的attr配置
- 在各图表组件中用Background组件替换原有容器，并添加标题
- 调整ConstructionIndex列表项的样式
---
 .../IntegratedEnergy/ConstructionIndex/config.ts      |  2 ++
 .../IntegratedEnergy/ConstructionIndex/index.vue      | 11 ++++++-----
 .../IntegratedEnergy/ConsumptionProportion/config.ts  |  2 +-
 .../IntegratedEnergy/ConsumptionProportion/index.vue  |  6 +++---
 .../Charts/IntegratedEnergy/FeeOverview/config.ts     |  2 +-
 .../Charts/IntegratedEnergy/FeeOverview/index.vue     |  5 +++--
 6 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/config.ts b/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/config.ts
index bc24166..c6a244e 100644
--- a/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/config.ts
+++ b/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/config.ts
@@ -1,6 +1,7 @@
 import { PublicConfigClass } from '@/packages/public'
 import { CreateComponentType } from '@/packages/index.d'
 import { ConstructionIndexConfig } from './index'
+import { chartInitConfig } from '@/settings/designSetting'
 import cloneDeep from 'lodash/cloneDeep'
 
 //导入数据
@@ -14,4 +15,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
   public key = ConstructionIndexConfig.key
   public chartConfig = cloneDeep(ConstructionIndexConfig)
   public option = cloneDeep(option)
+  public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 320, zIndex: 1 }
 }
diff --git a/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/index.vue b/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/index.vue
index 689d31a..a5948d2 100644
--- a/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/index.vue
+++ b/src/packages/components/Charts/IntegratedEnergy/ConstructionIndex/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="contruction-index">
- <div class="contruction-index-title">
+  <Background title-text="开工指数" :select-option-mode="0">
+  <div class="contruction-index-title">
     <img class="contruction-index-title_tag" src="./assets/tag.png" alt="">
     <div class="contruction-index-title_title">
       <div>开工指数</div>
@@ -26,13 +26,14 @@
       </div>
     </div>
   </div>
-  </div>
+  </Background>
  
 </template>
 
 <script lang="ts" setup>
 import { PropType, computed } from 'vue'
 import { option as configOption } from './config'
+import Background from '../Background/index.vue'
 
 const props = defineProps({
   chartConfig: {
@@ -95,8 +96,8 @@ const calculateWidth = (value: number) => {
   width:90%;
   margin: 0 auto;
   .contruction-index-list_item {
-    height: 30px;
-    margin: 15px 0px;
+    height: 25px;
+    margin-top: 13px;
     display: flex;
     font-size: 12px;
     color: #fff;
diff --git a/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/config.ts b/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/config.ts
index 7eeb9d7..f26d0d3 100644
--- a/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/config.ts
+++ b/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/config.ts
@@ -95,5 +95,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
     public key: string = ConsumptionProportionConfig.key
     public chartConfig = cloneDeep(ConsumptionProportionConfig)
     public option = echartOptionProfixHandle(option, includes)
-    public attr = { ...chartInitConfig, x: 0, y: 0, w: 420, h: 280, zIndex: 1 }
+    public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 320, zIndex: 1 }
 }
\ No newline at end of file
diff --git a/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/index.vue b/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/index.vue
index aa5a93b..0dead8f 100644
--- a/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/index.vue
+++ b/src/packages/components/Charts/IntegratedEnergy/ConsumptionProportion/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="go-border-box">
+    <Background title-text="能耗占比" :select-option-mode="0">
         <!-- <img src="./assets/title.svg" class="svg" />
         <div class="header-title">有限空间分布情况</div> -->
         <div class="title-value">
@@ -7,8 +7,7 @@
             <div class="title-value_unit">/万元</div>
         </div>
         <v-chart ref="vChartRef" autoresize :init-options="initOptions" :theme="themeColor" :option="option"></v-chart>
-    </div>
-
+    </Background>
 </template>
 
 <script setup lang="ts">
@@ -29,6 +28,7 @@ import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore
 import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, TitleComponent } from 'echarts/components'
 import dataJson from './data.json'
 import { getPie3D } from './3dPie'
+import Background from '../Background/index.vue'
 import axiosInstance from '@/api/axios';
 
 const props = defineProps({
diff --git a/src/packages/components/Charts/IntegratedEnergy/FeeOverview/config.ts b/src/packages/components/Charts/IntegratedEnergy/FeeOverview/config.ts
index 1e76a4a..e4bca94 100644
--- a/src/packages/components/Charts/IntegratedEnergy/FeeOverview/config.ts
+++ b/src/packages/components/Charts/IntegratedEnergy/FeeOverview/config.ts
@@ -95,5 +95,5 @@ export default class Config extends PublicConfigClass implements CreateComponent
     public key: string = FeeOverviewConfig.key
     public chartConfig = cloneDeep(FeeOverviewConfig)
     public option = echartOptionProfixHandle(option, includes)
-    public attr = { ...chartInitConfig, x: 0, y: 0, w: 420, h: 280, zIndex: 1 }
+    public attr = { ...chartInitConfig, x: 0, y: 0, w: 450, h: 320, zIndex: 1 }
 }
\ No newline at end of file
diff --git a/src/packages/components/Charts/IntegratedEnergy/FeeOverview/index.vue b/src/packages/components/Charts/IntegratedEnergy/FeeOverview/index.vue
index aa5a93b..e784eab 100644
--- a/src/packages/components/Charts/IntegratedEnergy/FeeOverview/index.vue
+++ b/src/packages/components/Charts/IntegratedEnergy/FeeOverview/index.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="go-border-box">
+    <Background title-text="费用概况" :select-option-mode="0">
         <!-- <img src="./assets/title.svg" class="svg" />
         <div class="header-title">有限空间分布情况</div> -->
         <div class="title-value">
@@ -7,7 +7,7 @@
             <div class="title-value_unit">/万元</div>
         </div>
         <v-chart ref="vChartRef" autoresize :init-options="initOptions" :theme="themeColor" :option="option"></v-chart>
-    </div>
+    </Background>
 
 </template>
 
@@ -29,6 +29,7 @@ import { useChartEditStore } from '@/store/modules/chartEditStore/chartEditStore
 import { DatasetComponent, GridComponent, TooltipComponent, LegendComponent, TitleComponent } from 'echarts/components'
 import dataJson from './data.json'
 import { getPie3D } from './3dPie'
+import Background from '../Background/index.vue'
 import axiosInstance from '@/api/axios';
 
 const props = defineProps({