图表优化

src/components/layouts/stock/Warning.vue

@@ -139,14 +139,14 @@
             </a-statistic>
           </a-card>
         </a-col>
-        <a-col :span="12" style="top: 10px">
+        <a-col :span="24" style="top: 10px">
           <a-card title="任务维度预警图标" :bordered="false">
             <div id="statusRefusePie" ref="statusRefusePie" style="width:100%;height:500px"></div>
           </a-card>
         </a-col>
 
-        <a-col :span="12" style="top: 10px">
-          <a-card title="机构维度预警图标" :bordered="false">
+        <a-col :span="24" style="top: 10px">
+          <a-card title="机构维度预警图标" :bordered="false" style='height: 300px'>
             <div id="statusRefusePieNo" ref="statusRefusePieNo" style="width:100%;height:500px"></div>
           </a-card>
         </a-col>
@@ -1325,11 +1325,10 @@ export default {
       builderJson = {
         all: allCount,
         charts: this.getWarningCountOrg,
-        components: this.warningCountFiled,
         ie: 10
       };
       var downloadJson = this.getWarningCountOrg;
-      var themeJson =  this.warningCountFiled;
+     // var themeJson =  this.warningCountFiled;
       var waterMarkText = '北区稽核';
       var canvas = document.createElement('canvas');
       var ctx = canvas.getContext('2d');
@@ -1350,13 +1349,13 @@ export default {
         tooltip: {},
         title: [
           {
-            text: '预警分布与预警字段',
+            text: '机构维度预警分布 ',
             subtext: '总计 ' + builderJson.all,
             left: '30%',
             textAlign: 'center'
           },
           {
-            text: '码号维度预警占比',
+            text: '机构维度预警占比',
             subtext:
               '总计 ' +
               Object.keys(downloadJson).reduce(function (all, key) {
@@ -1365,17 +1364,17 @@ export default {
             left: '75%',
             textAlign: 'center'
           },
-          {
-            text: '基本信息预警字段占比',
-            subtext:
-              '总计 ' +
-              Object.keys(themeJson).reduce(function (all, key) {
-                return all + themeJson[key];
-              }, 0),
-            left: '75%',
-            top: '50%',
-            textAlign: 'center'
-          }
+          // {
+          //   text: '基本信息预警字段占比',
+          //   subtext:
+          //     '总计 ' +
+          //     Object.keys(themeJson).reduce(function (all, key) {
+          //       return all + themeJson[key];
+          //     }, 0),
+          //   left: '75%',
+          //   top: '50%',
+          //   textAlign: 'center'
+          // }
         ],
         grid: [
           {
@@ -1425,7 +1424,7 @@ export default {
           {
             gridIndex: 1,
             type: 'category',
-            data: Object.keys(builderJson.components),
+
             axisLabel: {
               interval: 0,
               rotate: 30
@@ -1459,33 +1458,8 @@ export default {
               return builderJson.all - builderJson.charts[key];
             })
           },
-          {
-            type: 'bar',
-            stack: 'component',
-            xAxisIndex: 1,
-            yAxisIndex: 1,
-            z: 3,
-            label: {
-              position: 'right',
-              show: true
-            },
-            data: Object.keys(builderJson.components).map(function (key) {
-              return builderJson.components[key];
-            })
-          },
-          {
-            type: 'bar',
-            stack: 'component',
-            silent: true,
-            xAxisIndex: 1,
-            yAxisIndex: 1,
-            itemStyle: {
-              color: '#eee'
-            },
-            data: Object.keys(builderJson.components).map(function (key) {
-              return builderJson.all - builderJson.components[key];
-            })
-          },
+
+
           {
             type: 'pie',
             radius: [0, '30%'],
@@ -1497,17 +1471,17 @@ export default {
               };
             })
           },
-          {
-            type: 'pie',
-            radius: [0, '30%'],
-            center: ['75%', '75%'],
-            data: Object.keys(themeJson).map(function (key) {
-              return {
-                name: key.replace('.js', ''),
-                value: themeJson[key]
-              };
-            })
-          }
+          // {
+          //   type: 'pie',
+          //   radius: [0, '30%'],
+          //   center: ['75%', '75%'],
+          //   data: Object.keys(themeJson).map(function (key) {
+          //     return {
+          //       name: key.replace('.js', ''),
+          //       value: themeJson[key]
+          //     };
+          //   })
+          // }
         ]
       };
       myChart.setOption(option);