湖里大屏(进度计划):状态统计模块

src/views/projectAdmin/dataBoard/projectHuScreen/jChart/bar/JBarChart.vue

@@ -80,6 +80,7 @@ export default {
         },
         yAxis: {
           type: 'value',
+          splitNumber: 4,
           splitLine: {
             show: true,
             lineStyle: {

src/views/projectAdmin/dataBoard/projectHuScreen/planProgress/centerBottom.vue

@@ -7,7 +7,7 @@
 </template>
 
 <script>
-import conProgress from '../jChart/pie/progress.vue'
+import conProgress from '../components/progress.vue'
 export default {
   components:{conProgress},
   props: {

src/views/projectAdmin/dataBoard/projectHuScreen/planProgress/leftBottom.vue

@@ -4,7 +4,7 @@
     <div class="titleTxt">{{ title }}</div>
     <div class="myChart">
       <problemChart 
-      :title="{ text: 654, subTitle: '本周总任务' }" 
+      :title="{ text: 654, subTitle: '本周总任务' ,y:'35%'}" 
       :color="['#3cabfd','#57ec72','#f294c6','#f43a8d','#6ee4f0']"
       :data="[
             { value: 45, name: '未开始' },
@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import problemChart from '../jChart/pie/problemChart.vue'
+import problemChart from '../jChart/pie/JProblemChart'
 export default {
 components:{problemChart},
   props: {
@@ -51,7 +51,7 @@ components:{problemChart},
   }
   .myChart{
     width: 100%;
-    height: 100%;
+    height: 90%;
   }
 }
 </style>

src/views/projectAdmin/dataBoard/projectHuScreen/planProgress/leftCenter.vue

@@ -1,13 +1,18 @@
 <template>
 <!-- 状态统计 -->
-<div class="container">
+<div class="containerBox">
     <div class="titleTxt">{{ title }}</div>
+    <div class="mychart">
+      <JBarChart :xData="xData" :yData="yData" :color="color" :grid="grid" :title="{ text: '全部' }" />
+    </div>
 
 </div>
 </template>
 
 <script>
+import JBarChart from '../jChart/bar/JBarChart.vue'
 export default {
+  components: { JBarChart },
 
   props: {
     title: {
@@ -17,7 +22,34 @@ export default {
   },
   data() {
     return {
-
+      xData:['未开始','进行中','已完成','延期'],
+      yData:[
+        {
+          value: 170,
+          itemStyle: {
+            color: '#a9adb6'
+          }
+        },
+        {
+          value: 320,
+          itemStyle: {
+            color: '#557dee'
+          }
+        },
+        {
+          value: 270,
+          itemStyle: {
+            color: '#43d7b5'
+          }
+        },
+        {
+          value: 310,
+          itemStyle: {
+            color: '#ff6c7f'
+          }
+        }],
+      color:['#a9adb6','#557dee','#43d7b5','#ff6c7f'],
+      grid:['10%','5%','7%','5%']
     };
   },
 
@@ -26,7 +58,7 @@ export default {
 </script>
 
 <style lang="less" scoped>
-.container {
+.containerBox {
   width: 100%;
   height: 100%;
   border: 1px solid #0081c3;
@@ -37,6 +69,10 @@ export default {
     margin-top: 5px;
     margin-left: 5px;
   }
+  .mychart{
+    width: 100%;
+    height: 95%;
+  }
 }
 </style>
 

src/views/projectAdmin/dataBoard/projectHuScreen/projectHuli/constructProgress.vue

@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import conProgress from '../jChart/pie/progress.vue'
+import conProgress from '../components/progress.vue'
 export default {
   components:{conProgress},
   data() {

src/views/projectAdmin/dataBoard/projectHuScreen/projectHuli/qualityProblem.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-import problemChart from '../jChart/pie/problemChart.vue'
+import problemChart from '../jChart/pie/JProblemChart'
 export default {
   components:{problemChart},
   props: {