1.完成生产管理-电量分析静态界面

2.完成综合管理-人员排班管理交互
3.修改部分逻辑和样式

src/views/shengchanManage/powerfenxi/components/duibifenxiBar.vue

@@ -1,6 +1,12 @@
 <template>
   <div class="duibifenxi-bar-container">
-    <div ref="chartRef" class="chart" style="width: 100%; height: 300px;"></div>
+    <div class="title">
+      <TitleComponent title="发电量同比分析" :font-level="2" />
+      <el-select placeholder="请选择线路" style="width: 150px;">
+        <el-option label="A线路" value="all"></el-option>
+      </el-select>
+    </div>
+    <div ref="chartRef" class="chart-container"></div>
   </div>
 </template>
 
@@ -32,17 +38,17 @@ const defaultCompareData: CompareData = {
 // 初始化图表
 const initChart = () => {
   if (!chartRef.value) return
-  
+
   chartInstance = echarts.init(chartRef.value)
   const data = props.compareData || defaultCompareData
-  
+
   const option = {
     tooltip: {
       trigger: 'axis',
       axisPointer: {
         type: 'shadow'
       },
-      formatter: function(params: any) {
+      formatter: function (params: any) {
         const current = params[0]
         const lastYear = params[1]
         let result = `${current.name}<br/>`
@@ -78,16 +84,12 @@ const initChart = () => {
     },
     yAxis: {
       type: 'value',
-      name: 'kwh',
-      nameTextStyle: {
-        color: '#666',
-        padding: [0, 0, 0, 40]
-      },
       axisLine: {
         show: false
       },
       axisLabel: {
-        color: '#666'
+        color: '#666',
+        formatter: '{value} Kwh',
       },
       splitLine: {
         lineStyle: {
@@ -123,7 +125,7 @@ const initChart = () => {
       }
     ]
   }
-  
+
   chartInstance.setOption(option)
 }
 
@@ -147,28 +149,35 @@ onUnmounted(() => {
 
 <style scoped lang="scss">
 .duibifenxi-bar-container {
-  padding: 16px;
+  padding: 10px;
   background: #fff;
-  border-radius: 8px;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
   height: 100%;
   display: flex;
   flex-direction: column;
+  min-height: 300px;
 }
 
-.chart {
-  flex: 1;
-  min-height: 0;
+.title {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 15px;
+  width: 100%;
+}
+.chart-container {
+  width: 100%;
+  height: 100%;
+  min-height: 280px;
 }
-
 // 响应式调整
 @media screen and (max-width: 768px) {
   .duibifenxi-bar-container {
-    padding: 12px;
+    padding: 5px;
+    min-height: 250px;
   }
-  
-  .chart {
-    height: 250px;
+
+  .chart-container {
+    min-height: 230px;
   }
 }
 </style>