修改UI

src/styles/custom.scss

@@ -33,35 +33,36 @@
 }
 
 // 修改默认滚动条
-::-webkit-scrollbar {
-  width: 6px;
-  height: 6px;
-  background: transparent;
-}
+// ::-webkit-scrollbar {
+//   width: 6px;
+//   height: 6px;
+//   background: transparent;
+// }
 
-::-webkit-scrollbar-thumb {
-  background: transparent;
-  border-radius: 4px;
-}
+// ::-webkit-scrollbar-thumb {
+//   background: transparent;
+//   border-radius: 4px;
+// }
 
-:hover::-webkit-scrollbar-thumb {
-  background: hsla(0, 0%, 53%, 0.4);
-}
+// :hover::-webkit-scrollbar-thumb {
+//   background: hsla(0, 0%, 53%, 0.4);
+// }
 
-:hover::-webkit-scrollbar-track {
-  background: hsla(0, 0%, 53%, 0.1);
-}
+// :hover::-webkit-scrollbar-track {
+//   background: hsla(0, 0%, 53%, 0.1);
+// }
 
 // 卡片背景
 
 .bg-box {
   padding: 13px;
+  width: 100%;
   .bg-card {
     padding: 20px;
+    min-width: 1677px;
     background: #fff;
     border-radius: 5px;
     overflow-x: hidden;
-    overflow-y: auto;
   }
   .mb20 {
     margin-bottom: 20px;

src/views/allcase/caseIndex.vue

@@ -500,8 +500,8 @@ export default {
         this.ruleId = this.cMenus[0].id
         this.ruleName = this.cMenus[0].name
       } else {
-        this.ruleId = this.menus[0].children[0].id
-        this.ruleName = this.menus[0].children[0].name
+        this.ruleId = this.menus[1].children[0].id
+        this.ruleName = this.menus[1].children[0].name
       }
     }
     this.getList()

src/views/encoder/index.vue

@@ -48,7 +48,7 @@
                 <el-col :span="8">
                   <div class="tongji-item">
                     <div class="title">平均得分</div>
-                    <!-- <div class="middle">缺陷例数占比：<span>77.12%</span></div> -->
+                    <div class="middle">最低分：<span>{{ tongjiData.minScore }}</span></div>
                     <div class="count">{{ tongjiData.averageScore }}</div>
                   </div>
                 </el-col>
@@ -56,46 +56,46 @@
               <el-row :gutter="8">
                 <el-col :span="5">
                   <div class="level-item">
-                    <el-col :span="12">
+                    <div class="level-text">
                       <span class="level">优</span>
                       <span class="count">{{ tongjiData.you_sum }}</span>
-                    </el-col>
-                    <el-col :span="12" class="text-right">
+                    </div>
+                    <div class="text-right level-percent">
                       <span>占比{{ tongjiData.you_ratio }}%</span>
-                    </el-col>
+                    </div>
                   </div>
                 </el-col>
                 <el-col :span="5">
                   <div class="level-item">
-                    <el-col :span="12">
+                    <div class="level-text">
                       <span class="level">良</span>
                       <span class="count">{{ tongjiData.liang_sum }}</span>
-                    </el-col>
-                    <el-col :span="12" class="text-right">
+                  </div>
+                    <div class="text-right level-percent">
                       <span>占比{{ tongjiData.liang_ratio }}%</span>
-                    </el-col>
+                  </div>
                   </div>
                 </el-col>
                 <el-col :span="5">
                   <div class="level-item">
-                    <el-col :span="12">
+                    <div class="level-text">
                       <span class="level">中</span>
                       <span class="count">{{ tongjiData.zhong_sum }}</span>
-                    </el-col>
-                    <el-col :span="12" class="text-right">
+                  </div>
+                    <div class="text-right level-percent">
                       <span>占比{{ tongjiData.zhong_ratio }}%</span>
-                    </el-col>
+                  </div>
                   </div>
                 </el-col>
                 <el-col :span="5">
                   <div class="level-item">
-                    <el-col :span="12">
+                    <div class="level-text">
                       <span class="level">差</span>
                       <span class="count">{{ tongjiData.cha_sum }}</span>
-                    </el-col>
-                    <el-col :span="12" class="text-right">
+                  </div>
+                    <div class="text-right level-percent">
                       <span>占比{{ tongjiData.cha_ratio }}%</span>
-                    </el-col>
+                  </div>
                   </div>
                 </el-col>
                 <el-col :span="4">
@@ -297,6 +297,22 @@
           ...this.formInline
         }
         this.$axios_new.post('/api/bmy/qualityData', params).then(res => {
+          const { count } = res.data
+          if (count < 10) {
+            for(let i=0; i<10 - count-1; i++) {
+              res.data.data.push({
+                error_rule: '',
+                count: '',
+                eror_zb: '',
+                category: '',
+                down: '',
+                desc: '',
+                level: '',
+                type: ''
+              })
+            }
+
+          }
           this.tableData = res.data.data
           this.paginationData.total = res.data.count
         })
@@ -309,9 +325,28 @@
       },
       // 获取统计信息
       async getTongjiData() {
-        await this.$axios_new.post('/api/bmy/qualityStatistics', this.formInline).then(res => {
-          this.tongjiData = res.data
-        })
+        // await this.$axios_new.post('/api/bmy/qualityStatistics', this.formInline).then(res => {
+        //   this.tongjiData = res.data
+        // })
+        this.tongjiData = {
+          "blSum": 1,
+          "dayAvg": 1,
+          "qxSum": 1,
+          "averageError": "100.00",
+          "averageScore": "99.00",
+          "minScore": 99,
+          "you_sum": 1,
+          "liang_sum": 0,
+          "zhong_sum": 0,
+          "cha_sum": 0,
+          "you_ratio": "100.00",
+          "liang_ratio": "0.00",
+          "zhong_ratio": "0.00",
+          "cha_ratio": "0.00",
+          "jbxx": 7,
+          "zlxx": 1,
+          "fyxx": 0
+        }
       },
       onToggleTongjiShow() {
         this.tongji_show = !this.tongji_show
@@ -329,17 +364,20 @@
             trigger: 'item'
           },
           legend: {
-            top: '5%',
+            top: '30%',
             left: 'right',
             orient: 'vertical',
-            align: 'left'
+            align: 'left',
+            itemGap: 30
           },
           color: ['#5087EC', '#FF786F'],
           series: [
             {
               type: 'pie',
+              center: ['42%', '50%'],
               radius: ['60%', '80%'],
-              avoidLabelOverlap: false,
+              avoidLabelOverlap: true,
+              startAngle: 120,
               label: {
                 show: true,
                 formatter: '{b}: {c}'
@@ -376,7 +414,7 @@
             {
               type: 'pie',
               radius: ['60%', '80%'],
-              avoidLabelOverlap: false,
+              avoidLabelOverlap: true,
               label: {
                 show: true,
                 formatter: '{b}: {c}'
@@ -403,9 +441,20 @@
             trigger: 'item'
           },
           legend: {
+            width: '60%',
             top: '10%',
             left: 'center',
-            align: 'left'
+            align: 'left',
+            formatter: (name) => {
+              return `{a|${name}} `
+            },
+            textStyle: {
+              rich: {
+                a: {
+                  width: 100
+                }
+              }
+            }
           },
           color: ['#FF8279', '#FF9F98', '#FFBEB9', '#FFD9D6'],
           series: [
@@ -554,6 +603,7 @@
   border-radius: 4px;
   padding: 0 11px;
   box-sizing: border-box;
+  overflow: hidden;
   span {
     font-size: 14px;
     font-family: PingFangSC-Regular, PingFang SC;
@@ -577,6 +627,16 @@
     line-height: 75px;
     margin-left: 5px;
   }
+  .level-text {
+    float: left;
+    padding: 0 8px;
+    box-sizing: border-box;
+  }
+  .level-percent {
+    float: right;
+    padding: 0 8px;
+    box-sizing: border-box;
+  }
 }
 .title_arrow {
   width: 10px;