修改

src/views/home/components/operatingBar.vue

@@ -36,7 +36,7 @@
       </div>
     </div>
     <div class="lineBottom" style="height: 100%; width: 100%">
-      <operatingLineBar :chartData="chartData" style="height: 99%; width: 100%" />
+      <operatingLineBar :chartData="chartD" style="height: 99%; width: 100%" />
     </div>
   </div>
 </template>
@@ -48,18 +48,31 @@ import * as echarts from 'echarts';
 export default {
   name: "Container",
   components: { operatingLineBar },
-  props: ["name", "size", "icon"],
+  props: ["chartData"],
   data() {
     return {
       activeButton: 0,
     };
   },
   computed: {
+    currentDataSource() {
+      console.log('yyyy',this.chartData);
+
+      return this.activeButton === 0 ? this.chartData.sales : this.chartData.grossMargin;
+    },
+    locations() {
+      console.log('this.chartData', this.chartData);
+
+      return this.activeButton === 0 ? this.chartData.salesLocations : this.chartData.grossMarginLocations;
+    },
     // 根据按钮切换生成对应的 chartData
-    chartData() {
+    chartD() {
       // 销量场景数据
+      const data = this.currentDataSource;
+      console.log(this.currentDataSource,'currentDataSource');
+
       const salesData = {
-        allPlaceNames: ['桐城', '合肥', '宜兴', '漳州', '自贡', '洛阳'], // x轴刻度
+        allPlaceNames: this.locations,
         series: [
           // 1. 完成率（折线图）
           {
@@ -83,7 +96,7 @@ export default {
                 { offset: 1, color: 'rgba(40, 138, 255, 0)' }
               ])
             },
-            data: [104, 96.7, 107.3, 97.1, 107.7, 93.8], // 完成率（%）
+            data: data.rates, // 完成率（%）
             symbol: 'circle',
             symbolSize: 6
           },
@@ -105,7 +118,7 @@ export default {
               borderRadius: [4, 4, 0, 0],
               borderWidth: 0
             },
-            data: [50, 60, 55, 70, 65, 80] // 目标销量（万元）
+            data: data.targets // 目标销量（万元）
           },
           // 3. 实际（柱状图，含达标状态）
           {
@@ -116,7 +129,7 @@ export default {
             itemStyle: {
               color: (params) => {
                 // 达标状态：1=达标（绿色），0=未达标（橙色）
-                const safeFlag = [1, 0, 1, 0, 1, 0];
+                const safeFlag = data.flags;
                 const currentFlag = safeFlag[params.dataIndex] || 0;
                 return currentFlag === 1
                   ? {
@@ -139,14 +152,13 @@ export default {
               borderRadius: [4, 4, 0, 0],
               borderWidth: 0
             },
-            data: [52, 58, 59, 68, 70, 75] // 实际销量（万元）
+            data: data.reals // 实际销量（万元）
           }
         ]
       };
 
       // 毛利率场景数据
       const grossProfitData = {
-        allPlaceNames: ['1月', '2月', '3月', '4月', '5月', '6月'],
         series: [
           // 1. 完成率（折线图）
           {