产量和效率

src/views/copilot/efficiency/components/sub/std/ProgressBar.vue

@@ -6,7 +6,7 @@
 -->
 
 <template>
-  <div class="progress-bar" :data-title="titleYear" :data-rate="number">
+  <div class="progress-bar" :data-title="title" :data-rate="value + '%'">
     <div class="progress-bar__rate" :style="{ width: dataRate == '-' ? 0 : dataRate }"></div>
   </div>
 </template>
@@ -20,52 +20,25 @@ export default {
       type: Number,
       default: 0,
     },
-    target: {
-      type: Number,
-      default: 0,
-    },
-    goodNumber: {
-      type: Number,
-      default:0
-    },
-    componentYield: {
-      type: Number,
-      default:0
-    },
-    period: {
-      type: String,
-      default:'日',
-    },
+    // total: {
+    //   type: Number,
+    //   default: 0,
+    // },
     title: {
       type: String,
       default: "",
     },
-    city: {
-      type: String,
-      default:""
-    }
   },
   data() {
-    return {
-      number: 0,
-      titleYear:'',
-    };
+    return {};
   },
   computed: {
     dataRate() {
-      if ((this.period === '年' || this.period === '月') && this.target != 0) {
-        // console.log(this.componentYield)
-        this.titleYear = this.title + '  ' + `${(this.target * 100).toFixed(0)}%`
-      } else {
-        this.titleYear = this.title
-      }
-      this.number = this.value == 0
-        ? "-"
-        : `${(this.value * 100).toFixed(0)}%`
-      // console.log(this.period)
       return this.value == 0
         ? "-"
-        : this.value >1 ? 100 + '%' :`${(this.value * 100).toFixed(0)}%`
+        : this.value > 1
+          ?  100 + '%'
+          : `${(parseFloat(this.value)).toFixed(0)}%`;
     },
   },
   methods: {},
@@ -95,7 +68,7 @@ export default {
     color: #fff;
     position: absolute;
     bottom: -200%;
-    right: 10px;
+    right: 0;
     font-size: 12px;
   }
 
@@ -104,6 +77,7 @@ export default {
       color: #11eae3;
     }
   }
+
   &:nth-child(2) {
     &:after {
       color: #0e65fd;
@@ -116,17 +90,20 @@ export default {
     height: 100%;
     width: 0;
     border-radius: 4px;
+     background: linear-gradient(to right,
+          #004c5e11 10%,
+          #004c5e,
+          #0ac0c0,
+          #11eae3);
   }
 
   &:first-child {
     .progress-bar__rate {
-      background: linear-gradient(
-        to right,
-        #004c5e11 10%,
-        #004c5e,
-        #0ac0c0,
-        #11eae3
-      );
+      background: linear-gradient(to right,
+          #004c5e11 10%,
+          #004c5e,
+          #0ac0c0,
+          #11eae3);
     }
   }