制造成本分析修改

src/views/home/electricityCostAnalysisComponents/dataTrendBar.vue

@@ -12,7 +12,7 @@
             </span>
             <span class="legend-item">
               <span class="legend-icon square target"></span>
-              预算
+              目标
             </span>
             <span class="legend-item">
               <span class="legend-icon square achieved"></span>
@@ -59,13 +59,17 @@ export default {
   props: ["chartData"],
   data() {
     return {
-      activeButton: 0,
       isDropdownShow: false,
-      selectedProfit: '营业收入', // 选中的名称，初始为null
+      selectedProfit: '利润总额', // 选中的名称，初始为null
       profitOptions: [
-        '营业收入',
-        '单价',
+        '利润总额',
         '销量',
+        '单价',
+        '制造成本',
+        '管理费用',
+        '销售费用',
+        '财务费用',
+        '非经营性利润',
       ]
     };
   },
@@ -74,19 +78,17 @@ export default {
     //   return this.categoryData.map(item => item.name) || [];
     // },
     currentDataSource() {
-      console.log('yyyy', this.chartData);
-
-      return  this.chartData
+      return this.chartData
     },
     locations() {
-      console.log('this.chartData', this.chartData);
-
-      return this.chartData.months
+      return this.chartData.time
     },
     // 根据按钮切换生成对应的 chartData
     chartD() {
+      // 销量场景数据
       const data = this.currentDataSource;
       console.log(this.currentDataSource, 'currentDataSource');
+      console.log('this.currentDataSource', data);
 
       const salesData = {
         allPlaceNames: this.locations,
@@ -113,7 +115,7 @@ export default {
                 { offset: 1, color: 'rgba(40, 138, 255, 0)' }
               ])
             },
-            data: data.rates, // 完成率（%）
+            data: data.proportion || [], // 完成率（%）
             symbol: 'circle',
             symbolSize: 6
           },
@@ -135,7 +137,7 @@ export default {
               borderRadius: [4, 4, 0, 0],
               borderWidth: 0
             },
-            data: data.budgets // 目标销量（万元）
+            data: data.targetValue || [] // 目标销量（万元）
           },
           // 3. 实际（柱状图，含达标状态）
           {
@@ -152,8 +154,8 @@ export default {
               height: 20,
               // 关键：去掉换行，让文字在一行显示，适配小尺寸
               formatter: (params) => {
-                const diff = data.diffs || [];
-                const flags = data.flags || [];
+                const diff = data.diffValue || [];
+                const flags = data.completed || [];
                 const currentDiff = diff[params.dataIndex] || 0;
                 const currentFlag = flags[params.dataIndex] || 0;
 
@@ -216,7 +218,7 @@ export default {
             itemStyle: {
               color: (params) => {
                 // 达标状态：1=达标（绿色），0=未达标（橙色）
-                const safeFlag = data.flags;
+                const safeFlag = data.completed || [];
                 const currentFlag = safeFlag[params.dataIndex] || 0;
                 return currentFlag === 1
                   ? {
@@ -239,13 +241,10 @@ export default {
               borderRadius: [4, 4, 0, 0],
               borderWidth: 0
             },
-            data: data.reals // 实际销量（万元）
+            data: data.value || [] // 实际销量（万元）
           }
         ]
       };
-
-
-      // 根据按钮状态返回对应数据
       return salesData;
     }
   },
@@ -253,7 +252,7 @@ export default {
     selectProfit(item) {
       this.selectedProfit = item;
       this.isDropdownShow = false;
-      this.$emit("changeItem", item);
+      this.$emit('handleGetItemData', item)
     }
   },
 };
@@ -268,11 +267,11 @@ export default {
 
   // 新增：头部行容器，实现一行排列
   .header-row {
-  display: flex;
-    justify-content: flex-end; // 左右两端对齐
-    align-items: center; // 垂直居中
-    // width: 100%;
-    margin-bottom: 8px; // 与下方图表区保留间距（可根据需求调整）
+    display: flex;
+      justify-content: flex-end; // 左右两端对齐
+      align-items: center; // 垂直居中
+      // width: 100%;
+      margin-bottom: 8px; // 与下方图表区保留间距（可根据需求调整）
   }
 
   // 各基地情况标题样式
@@ -378,7 +377,7 @@ export default {
 
       .dropdown-container {
         position: relative;
-        z-index: 10;
+        z-index: 999; // 提高z-index，确保菜单不被遮挡
       }
 
       .item-button {
@@ -442,18 +441,21 @@ export default {
         transition: transform 0.2s ease;
 
         &.rotate {
-          transform: rotate(90deg);
+          transform: rotate(90deg); // 箭头旋转方向可根据需求调整，比如改为rotate(-90deg)更符合向上展开的视觉
         }
       }
 
       .dropdown-options {
         position: absolute;
-        top: 100%;
+        // 关键修改1：调整top值，让菜单显示在选择框上方，calc(-100% - 2px)表示向上偏移自身100%再加2px间距
+        bottom: 100%;
         right: 0;
-        margin-top: 2px;
+        // 移除多余的margin-top，避免额外间距
+        // margin-top: 2px;
         width: 123px;
         background: #ffffff;
-        border-radius: 8px;
+        // 关键修改2：调整border-radius，让菜单顶部圆角匹配选择框的右上角，底部圆角为0（更美观）
+        border-radius: 8px 8px 0 0;
         box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
         overflow: hidden;