首页比例换算进度条修改

cpp-ui/src/views/largeScreen/components/left-middle.vue

@@ -10,7 +10,8 @@
         </div>
       </div>
       <div class="flex items-center">
-        <progress-bar :params="{type:0,width:getGeneratingRatio(realGeneratingSum,forecastGeneratingSum)}"/>
+        <progress-bar
+          :params="{type:0,obj:getGeneratingRatio(realGeneratingSum,forecastGeneratingSum)}"/>
         <span class="tb_unit ml-0">200%</span>
       </div>
     </div>
@@ -24,7 +25,7 @@
         </div>
       </div>
       <div class="flex items-center">
-        <progress-bar :params="{type:1,width:getForecastRatio(realPowerSum,theoryPowerSum)}"/>
+        <progress-bar :params="{type:1,obj:getForecastRatio(realPowerSum,theoryPowerSum)}"/>
         <span class="tb_unit ml-0">120%</span>
       </div>
     </div>
@@ -43,7 +44,7 @@ export default {
       realGeneratingSum: 0,
       forecastGeneratingSum: 0,
       realPowerSum: 0,
-      theoryPowerSum: 0
+      theoryPowerSum: 0,
     }
   },
   props: {
@@ -66,14 +67,24 @@ export default {
         return 0
       }
       // 百分之200的比例展示
-      return ((Number(dividend) / Number(divisor * 2)) * 100).toFixed(2)
+      // console.log(dividend)
+      // console.log(divisor)
+      // console.log((Number(dividend) / Number(divisor) * 100).toFixed(2))
+      return {
+        width:(((Number(dividend) / Number(divisor)) * 100) / 2).toFixed(2),
+        text:((Number(dividend) / Number(divisor)) * 100).toFixed(2)
+      }
     },
     getForecastRatio(dividend, divisor) {
       if (Number(divisor) === 0 || Number(dividend) === 0) {
         return 0
       }
       // 百分之120展示
-      return ((Number(dividend) / Number(divisor * 1.2)) * 100).toFixed(2)
+      return {
+        width:(((Number(dividend) / Number(divisor)) * 100) / 1.2).toFixed(2),
+        text:((Number(dividend) / Number(divisor)) * 100).toFixed(2)
+      }
+      // return ((Number(dividend) / Number(divisor * 1.2)) * 100).toFixed(2)
     }
   },
 }

cpp-ui/src/views/largeScreen/components/progress-bar.vue

@@ -38,6 +38,7 @@ export default {
   },
   methods: {
     updateProgress(progress) {
+      console.log(progress)
       // 获取进度条元素和进度文字元素
       // const progressBar = progress.type === 0?document.getElementById('progress'):document.getElementById('progress1');
       let progressBar = document.getElementById('progress');
@@ -47,9 +48,9 @@ export default {
         progressText = document.getElementById('progressText1');
       }
       // 更新进度条和进度文字
-      progressBar.style.width = progress.width + '%';
-      progressText.style.width = progress.width + '%';
-      progressText.textContent = progress.width + '%';
+      progressBar.style.width = progress.obj.width + '%';
+      progressText.style.width = progress.obj.width + '%';
+      progressText.textContent = progress.obj.text + '%';
     }
   }
 }