培训看板、设备看板样式修改

src/views/business/deviceManagement/components/entirety.vue

@@ -13,13 +13,16 @@
               </div>
             </div>
             <div>
-              <div>{{captionArr[n]}}</div>
-              <div style="font-size:28px;">{{item}}</div>
+              <div style="font-size:17px;font-weight:600;">{{captionArr[n]}}</div>
+              <div style="font-weight:600;font-size:28px;color: rgb(255,255,0);margin-top: 1vh;text-align: center;">{{item}}</div>
             </div>
           </div>
           <div class="mySty" v-else>
             <div>{{captionArr[i]}}</div>
-            <div v-for="(t, e) in item" :key="'item'+e">{{captionArr[e]}}{{t}}</div>
+            <div v-for="(t, e) in item" :key="'item'+e">
+              <div>{{captionArr[e]}}</div>
+              <div style="color: rgb(255,255,0);font-weight:600;">{{t}}</div>
+            </div>
           </div>
         </div>
       </div>
@@ -139,7 +142,7 @@
           .mySty{
             width: 100%;
             display: flex;
-            justify-content: space-between;
+            justify-content: space-around;
           }
         }
       }

src/views/business/deviceManagement/index.vue

@@ -199,7 +199,7 @@ export default {
                     justify-content: space-evenly;
                     align-content: space-evenly;
                     .area{
-                        width: 30%;
+                        width: 26%;
                         height: 100%;
                         .dv-border-box-7{
                             .border-box-content{
@@ -209,7 +209,7 @@ export default {
                         }
                     }
                     .midArea{
-                        width: 37%;
+                        width: 45%;
                     }
                 }
             }

src/views/business/trainManagement/components/jobPlanChart.vue

@@ -2,19 +2,23 @@
   <div class="statisticsPage" :style="{width:width,height:height}">
     <div style="height:8%;font-size:24px;font-weight: 600;"> {{ title }} </div>
     <div v-show="show" style="height:92%;display:flex">
-      <div style="width:30%;margin: 4% 5% 0 0;">
+      <div style="width:28%;margin: 4% 5% 0 0;">
         <div class="leftSty">
-          <div style="width: 100%;font-size: 2vh;">自动创建培训计划</div>
+          <div class="numSize">手动<div class="numColor"> {{ data.autoNum + ' ' }} ({{calculatedPercentage(data.autoNum, data.total)}}%) </div></div>
+          <div style="flex: 1;"></div>
+          <div class="numSize">自动<div class="numColor" >{{ data.manual + ' ' }} ({{calculatedPercentage(data.manual, data.total)}}%) </div></div>
+          <div style="flex: 6;"><div :id="'jobPie'+id" :style="{height:'8vh',width:'100%'}"/></div>
+          <!-- <div style="width: 100%;font-size: 2vh;">自动创建培训计划</div>
           <div style="display:flex;display: flex;align-items: center;width:100%">
             <div style="width: 46%;display:flex;flex-flow: column;height: 100%;font-size: 2vh;">
               <div style="line-height: 250%;color: rgb(250, 200, 88);">{{data.autoNum}}</div>
               <div style="color: rgb(250, 200, 88);">占比{{data.rate}}%</div>
             </div>
             <div :id="'jobPie'+id" :style="{height:'8vh',width:'64%'}"/>
-          </div>
+          </div> -->
         </div>
       </div>
-      <div :id="'job'+id" :style="{height:'100%',width:'70%'}"/>
+      <div :id="'job'+id" :style="{height:'100%',width:'72%'}"/>
     </div>
     <div v-show="!show" class="nullShow">暂无数据</div>
   </div>
@@ -199,6 +203,9 @@
           ]
        }
        option && jobPie.setOption(option)
+      },
+      calculatedPercentage(up, down){
+        return (up/down).toFixed(2)*100
       }
     }
   }
@@ -214,15 +221,15 @@
     /* background-color: rgba(6, 30, 93, 0.5); */
   }
   .leftSty{
-    width: 100%;
+    width: 90%;
     display:flex;
     background-color: rgba(84, 112, 198, 0.3);
     border-radius: 10px;
-    padding: 5%;
+    padding: 10%;
     /* height: 50%; */
     display: flex;
     align-items: center;
-    flex-flow: column;
+    /* flex-flow: column; */
   }
   .nullShow{
     display: flex;
@@ -231,4 +238,14 @@
     font-size: 18px;
     height: 92%;
   }
+  .numColor{
+    color: rgb(250, 200, 88);
+    margin: 2vh 0;
+    letter-spacing: normal;
+  }
+  .numSize{
+    font-size: 2vh;
+    flex: 5;
+    letter-spacing: 3px;
+  }
 </style>

src/views/business/trainManagement/index.vue

@@ -190,12 +190,12 @@ export default {
                     total: 0
                 },
                 {
-                    title: '本年度培训类别占比',
+                    title: '岗前培训类别占比',
                     numData: data.dataObj,
                     total: 0
                 },
                 {
-                    title: '本年度岗前培训',
+                    title: '岗前培训',
                     numData: data.preData
                 }
             ]
@@ -228,6 +228,7 @@ export default {
         initializeData () {
             const w = window.innerWidth
             const { first = '', second = '' } = this.$store.getters.level || {}
+            let annual = this.hoverClassAdd === 'm' ? this.dateValM.substring(0,4) :this.dateValY 
             this.nowWeekData = []
             this.initData = {}
             this.itemIndex = 0
@@ -257,12 +258,12 @@ export default {
                     total: 0
                 },
                 {
-                    title: '本年度培训类别占比',
+                    title: annual+ '年度岗前培训类别占比',
                     numData: [],
                     total: 0
                 },
                 {
-                    title: '本年度岗前培训',
+                    title: annual + '年度岗前培训',
                     numData: []
                 }
             ]
@@ -291,7 +292,7 @@ export default {
                 this.mergeData[3].title = data.objectDto.remark
                 this.mergeData[3].total = data.objectDto.objectTotal
                 this.mergeData[4].numData = data.yearPreWorkDto.yearProWorkDtoList
-                this.mergeData[4].title = data.yearPreWorkDto.remark
+                // this.mergeData[4].title = data.yearPreWorkDto.remark
                 this.mergeData[4].total = data.yearPreWorkDto.yearPreWorkTotal
                 this.mergeData[2].numData = data.pxrytjqkDtoList
                 this.mergeData[2].perList = data.userRankList