样式

src/pages/ProdCount2.vue

@@ -143,31 +143,48 @@ export default {
       this.setEchart05()
     },
     setEchart01 () {
-      // let data = [100, 30, 80, 50]
-      let data = []
-      data.push(this.resData.materialTask[0].real_qty)
-      data.push(this.resData.materialTask[0].plan_qty)
+      let data = [
+        {
+          value: Number(this.resData.materialTask[0].plan_qty) - Number(this.resData.materialTask[0].real_qty),
+          name: '未完成重量'
+        },
+        {
+          value: Number(this.resData.materialTask[0].real_qty),
+          name: '已经完成重量'
+        }
+      ]
       var option = {
         legend: {
-          orient: 'vertical',
-          right: 'right',
-          top: '8%',
-          data: ['未完成重量', '已经完成重量', '重量3', '重量4'],
+          orient: 'horizontal',
+          bottom: '6%',
           textStyle: {
-            color: '#ffffff',
-            fontSize: '16'
-          }
+            color: '#fff',
+            fontWeight: 'bold',
+            fontSize: 14
+          },
+          itemGap: 30.86,
+          itemWidth: 14.16,
+          itemHeight: 7.38,
+          data: ['未完成重量', '已经完成重量']
         },
-        color: ['#0966E8', '#07E083', '#00D5FF', '#CC6060'],
+        color: ['#0966E8', '#07E083'],
         series: [
           {
             type: 'pie',
-            radius: ['50%', '70%'],
+            radius: ['43%', '70%'],
             label: {
-              formatter: ''
+              normal: {
+                // position: 'inner',
+                formatter: '{d}%',
+                textStyle: {
+                  color: '#fff',
+                  fontWeight: 'bold',
+                  fontSize: 14
+                }
+              }
             },
             labelLine: {
-              show: false
+              show: true
             },
             data: data
           }