修改

src/views/home/components/purchase-Item.vue

@@ -25,7 +25,7 @@
         <!-- 进度条：同步绑定类名 -->
         <div class="progress-group">
           <div class="progress-container">
-            <div class="progress-bar" :style="{ width: item.progress + '%' }" :class="{
+            <div class="progress-bar" :style="{ width: item.progressWidth + '%' }" :class="{
               'bar-exceed': item.currentValue >= item.targetValue,
               'bar-below': item.currentValue < item.targetValue
             }"></div>
@@ -42,7 +42,7 @@
             'percent-exceed': item.currentValue >= item.targetValue,
             'percent-below': item.currentValue < item.targetValue
           }">
-            {{ item.progress }}%
+            {{ item.progressDisplay }}
           </div>
         </div>
       </div>
@@ -88,29 +88,101 @@ export default {
     }
   },
   methods: {
+    // 解析rate字符串，提取百分比数值
+    parseRateString(rateStr) {
+      if (!rateStr || typeof rateStr !== 'string') {
+        return { displayText: '0%', progressValue: 0 };
+      }
+
+      // 尝试匹配百分比数字，如"减亏93%"中的93
+      const match = rateStr.match(/(\d+(\.\d+)?)%/);
+      if (match) {
+        const percentValue = parseFloat(match[1]);
+        return {
+          displayText: rateStr, // 保持原字符串显示
+          progressValue: percentValue // 提取的百分比数值用于进度条
+        };
+      }
+
+      // 如果没有匹配到百分比，尝试解析纯数字
+      const numMatch = rateStr.match(/\d+(\.\d+)?/);
+      if (numMatch) {
+        const numValue = parseFloat(numMatch[0]);
+        return {
+          displayText: rateStr,
+          progressValue: numValue
+        };
+      }
+
+      // 默认返回
+      return {
+        displayText: '0%',
+        progressValue: 0
+      };
+    },
+
     transformData(rawData) {
       // 定义指标映射关系，包括名称、对应的数据键和路由
       const Mapping = [
-        { key: 'operatingRevenue', name: '营业收入·万元', route: '/operatingRevenue/operatingRevenueIndex' },
-        { key: 'operatingIncome', name: '经营性利润·万元', route: '/operatingProfit/operatingProfit' },
-        { key: 'totalProfit', name: '利润总额·万元', route: '/totalProfit/totalProfit' },
-        { key: 'grossMargin', name: '毛利率·%', route: '/grossMargin/grossMargin' }
+        {
+          key: 'operatingRevenue',
+          name: '营业收入·万元',
+          route: '/operatingRevenue/operatingRevenueIndex',
+          isPercentage: true  // 需要加%符号
+        },
+        {
+          key: 'operatingIncome',
+          name: '经营性利润·万元',
+          route: '/operatingProfit/operatingProfit',
+          isPercentage: false  // 不需要加%符号，使用原始rate字符串
+        },
+        {
+          key: 'totalProfit',
+          name: '利润总额·万元',
+          route: '/totalProfit/totalProfit',
+          isPercentage: false  // 不需要加%符号，使用原始rate字符串
+        },
+        {
+          key: 'grossMargin',
+          name: '毛利率·%',
+          route: '/grossMargin/grossMargin',
+          isPercentage: true  // 需要加%符号
+        }
       ];
 
       // 遍历映射关系，转换数据
       return Mapping.map(mappingItem => {
         // 关键修复3：兜底更严谨，避免rawData[mappingItem.key]不存在导致报错
-        const data = rawData[mappingItem.key] || { rate: 0, real: 0, target: 0 };
+        const data = rawData[mappingItem.key] || { rate: '0%', real: 0, target: 0 };
         // 额外兜底：避免data中的属性为undefined
         const target = data.target || 0;
         const real = data.real || 0;
-        const rate = data.rate || 0;
+        const rate = data.rate || '0%';
+
+        // 解析rate字符串
+        const parsedRate = this.parseRateString(rate);
+
+        // 进度条宽度：限制在0-100之间
+        const progressWidth = Math.min(Math.max(parsedRate.progressValue, 0), 100);
+
+        // 显示文本处理
+        let progressDisplay;
+        if (mappingItem.isPercentage) {
+          // 对于需要加%的指标，确保有%符号
+          progressDisplay = parsedRate.displayText.includes('%')
+            ? parsedRate.displayText
+            : `${parsedRate.displayText}%`;
+        } else {
+          // 对于经营性利润和利润总额，直接使用原始rate字符串
+          progressDisplay = parsedRate.displayText;
+        }
 
         return {
           name: mappingItem.name,
           targetValue: target,
           currentValue: real,
-          progress: Math.round(rate), // 将小数率转换为百分比并四舍五入
+          progressWidth: progressWidth, // 用于进度条宽度
+          progressDisplay: progressDisplay, // 用于显示文本
           route: mappingItem.route
         };
       });