新增判断q=4，为质量工厂使用

src/App.vue

@@ -1,19 +1,31 @@
 <template>
   <div id="app">
-    <datav   />
+    
+    <datav2 v-if="dataType==4"/>
+    <datav v-else/>
   </div>
 </template>
 
 <script>
-// import datav from './components/baozuo-demo/index.vue' 
+import datav from './components/baozuo-demo/index.vue' 
+import datav2 from './components/baozuo-demo2/index.vue' 
 // import datav from './components/datav/index.vue' 
 // import datav from './components/zidingyi/index.vue' 
-import datav from './components/baozuo-demo2/index.vue' 
 
+const queryParams = new URLSearchParams(window.location.search);
+const dataTypeParam = queryParams.get('q');
 export default {
   name: 'app',
   components: {
-    datav 
+    datav,datav2 
+  },
+  data() {
+    return {
+      dataType: ''
+    }
+  },
+  created() {
+    this.dataType = dataTypeParam;
   },
   computed: { 
   }

src/components/baozuo-demo2/CenterCmp.vue

@@ -1,9 +1,9 @@
 // 修改模板部分
 <template>
-  <div class="center-cmp">
+  <div class="center-cmp2">
     <div class="cc-header"></div>
     <div class="cc-main-container">
-      <div class="ccmc-right">
+      <div class="ccmc-right-new">
         <dv-border-box-1>
           <div class="ccmc-title">
             <span class="title-decoration"></span>
@@ -58,7 +58,7 @@
         <PieChart :dataType="dataType" style="height:500px;"></PieChart>
       </div>
       
-      <div class="ccmc-left">
+      <div class="ccmc-left-new">
         <dv-border-box-1>
           <div class="ccmc-title">
             <span class="title-decoration"></span>
@@ -202,13 +202,13 @@ export default {
       { name: 'W3A', value: 98 },
     ],
     rightChartData: [
-            { name: '注塑件', value: Math.floor(Math.random() * 100) },
-            { name: '五金件', value: Math.floor(Math.random() * 100) },
-            { name: '橡硅胶件', value: Math.floor(Math.random() * 100) },
-            { name: '包材件', value: Math.floor(Math.random() * 100) },
-            { name: '电子件', value: Math.floor(Math.random() * 100) },
-            { name: '组件', value: Math.floor(Math.random() * 100) },
-            { name: '陶瓷', value: Math.floor(Math.random() * 100) }
+            { name: '注塑件', value: 98 },
+            { name: '五金件', value: 99 },
+            { name: '橡硅胶件', value: 100 },
+            { name: '包材件', value: 99 },
+            { name: '电子件', value: 92 },
+            { name: '组件', value: 92 },
+            { name: '陶瓷', value: 94 }
           ],
 
       leftData: this.dataType == '3'?originalLeftData2:originalLeftData,
@@ -489,7 +489,7 @@ export default {
 .middle-top {
   padding-left: 20px;
   margin-top: -50px;
-  // margin-bottom: 30px;
+  margin-bottom: 30px;
   background-image: linear-gradient(
             to bottom,
             rgba(135, 178, 252, 0.04),  /* 蓝色透明度15% */
@@ -551,7 +551,7 @@ export default {
     }
   }
 }
-.center-cmp {
+.center-cmp2 {
   width: 100%;
   height: 100%;
   margin: 0px;
@@ -634,7 +634,7 @@ export default {
       }
     }
 
-    .ccmc-left, .ccmc-right {
+    .ccmc-left-new, .ccmc-right-new {
     
       position: relative;
       width: 30%;
@@ -712,12 +712,12 @@ export default {
      
     }
 
-    .ccmc-left {
+    .ccmc-left-new {
       margin-top: -70px;
       
     }
 
-    .ccmc-right {
+    .ccmc-right-new {
       margin-top: -70px;
     }
   }

src/components/baozuo-demo2/pieChart.vue

@@ -72,7 +72,7 @@
         var myChart = echarts.init(document.getElementById('pieId-new'));
         this.option = {
             title: {
-                text: '当月不良指标数',
+                text: '本月不良指标数',
                 left: 'center',
                 textStyle: {
                     color: '#fff',