质控结果的布局样式重新修整，适配单链接宽度、根据是否是单链接、质控结果和病例生成动态控制宽度、搜索栏更改样式适配，修复点击不起作用问题

src/views/allcase/components/CaseQualityBox2.vue

@@ -1,6 +1,10 @@
 <template>
 
-<div class="CaseQualityBox2">
+<div class="CaseQualityBox2" :style="{
+    width: $route.path == '/whitelist-caseControl' ? '100%' :
+      tabsActive == 3 ? '400px' :
+      currentTaskName ? '840px' : '400px'
+  }">
   <el-row style="padding: 10px;line-height: 20px;" type="flex" justify="space-between">
     <span><span class="text-bold">病案号：</span>{{baseInfo.AAA28}}</span>
     <span><span class="text-bold">床号：</span>{{baseInfo.CH}}</span>
@@ -14,19 +18,16 @@
   <div v-if="tabsActive == 1" class="tabContent">
     <div 
       class="taskNameListAndMessage"
-      :style="{
-        width: currentTaskName ? '840px' : '340px'
-      }"
-      >
+    >
         <el-menu
             v-if="showTaskNameMenu"
             :default-active="currentTaskName"
             class="el-menu-vertical-demo"
             :style="{
-              width: currentTaskName ? '230px' : '340px'
+              width: currentTaskName ? '230px' : '100%'
             }"
           >
-           <div v-for="item in taskNameList">
+            <div v-for="item in taskNameList">
             <el-submenu :index="`${item.id}`" v-if="item.child">
               <template slot="title">
                 <span style="padding-left:20px">{{item.name}}</span>
@@ -92,7 +93,7 @@
 
   <!--病案首页-->
   <div v-else-if="tabsActive == 3" class="tabContent">
-    <div ref="box" class="box22" :style="{width: width ? width + 'px' : '100%'}" :class="{'nocopy': $route.meta.nocopy}">
+    <div ref="box" class="box22" :style="{width: '100%'}" :class="{'nocopy': $route.meta.nocopy}">
 
       <div class="score-box" :class="scoreLevel == '甲'? 'scoreLevel_1' : ( scoreLevel == '乙'?'scoreLevel_2': (scoreLevel == '丙'?'scoreLevel_3':'' ) ) ">
         <div>病案评分<span class="score-f">{{ data.score  }}分</span></div>
@@ -111,18 +112,23 @@
         <el-tag type="danger" v-if="data.is_case == 1" class="font-size12">质控中</el-tag>
         <el-tag v-if="data.is_case == 2" class="font-size12">已质控</el-tag>
       </el-row>
-      <div class="filterBox" v-if="!filterCollapse">
-        <div v-for="(value, key) in filterList" :class="`${filterFormData.type == key ? 'filterRow selected' : 'filterRow'}`" @click="setFilterForm(key)">
+      <el-row  class="filterBox" v-if="!filterCollapse">
+        <el-col 
+          :span="8" 
+          v-for="(value, key) in filterList" 
+          :class="`${filterFormData.type == key ? 'filterRow selected' : 'filterRow'}`" 
+        >
+        <div class="filterRowContent" @click="setFilterForm(key)">
           <div class="filterLabel text-bold">{{value.label}}</div>
-          <span style="margin-left: 10px">({{data.summary[key] && Array.isArray(data.summary[key]) ? data.summary[key].length : 0}})</span>
+          <span style="margin-left: 10px">({{data.summary && data.summary[key] && Array.isArray(data.summary[key]) ? data.summary[key].length : 0}})</span>
         </div>
-      </div>
+        </el-col>
+      </el-row>
 
 
       <el-scrollbar ref="scrollRef" class="scrollBox" :style="`height: ${scrollHeight}`">
-        <template v-if="(!filterFormData.type? !!(data.data.length) : !!((data.summary)[filterFormData.type].length)) ">
-          <template v-for="(item, index) in (!filterFormData.type? data.data : (data.summary)[filterFormData.type])">
-            <!-- is_appeal: 是否申述 -->
+        <template v-if="(!filterFormData.type? data.data && !!(data.data.length) : data.summary && !!((data.summary[filterFormData.type]).length)) ">
+          <template v-for="(item, index) in (!filterFormData.type? data.data : data.summary[filterFormData.type])">
             <div class="list-box box-card" :key="index">
               <div class="list-score-tips-box">
                 <el-row type="flex" align="middle" justify="space-between" style="margin-bottom: 15px;">
@@ -332,6 +338,7 @@ import { examineAppeal, getAppealData, getBrry } from '@/api/qc';
     },
     methods: {
       setFilterForm(key) {
+        console.log('>>>>>>>',key )
         this.filterFormData.type = key;
         // this.getTableData();
       },
@@ -345,7 +352,7 @@ import { examineAppeal, getAppealData, getBrry } from '@/api/qc';
       getBaseInfo() {
         getBrry({zyh: this.$props.MED_REC_ID}).then(res => {
           if (res.code == 200) {
-           this.baseInfo = res.data || {}
+            this.baseInfo = res.data || {}
           }
         })
       },
@@ -515,21 +522,24 @@ import { examineAppeal, getAppealData, getBrry } from '@/api/qc';
     line-height: 20px;
   }
   .filterBox {
-    padding: 0 5px;
-    display: grid;
-    grid-template-columns: repeat(3, 1fr); /* 创建4列，每列占据可用空间的1份 */   
-    gap: 5px; /* 可选，添加间隙 */  
+    // padding: 0 5px;
+    // display: grid;
+    // grid-template-columns: repeat(3, 1fr); /* 创建4列，每列占据可用空间的1份 */   
+    // gap: 5px; /* 可选，添加间隙 */  
     font-size: 14px;
     line-height: 23px;
     margin-bottom: 10px;
     .filterRow {
-      display: flex;
-      align-items: center;
       cursor: pointer;
-      .filterLabel {
-        width: 56px;
-        white-space: nowrap;
-        text-align: right;
+      line-height: 25px;
+      .filterRowContent {
+        text-align: center;
+        .filterLabel {
+          width: 56px;
+          white-space: nowrap;
+          text-align: right;
+          display: inline-block;
+        }
       }
     }
     .selected {
@@ -547,6 +557,7 @@ import { examineAppeal, getAppealData, getBrry } from '@/api/qc';
   }
 }
 .taskNameListAndMessage {
+  width: 100%;
   height: 100%;
   overflow-y: auto;
   background-color: white;
@@ -683,10 +694,11 @@ import { examineAppeal, getAppealData, getBrry } from '@/api/qc';
     background-position:80% 50%;
   }
 
- 
+  
   .card-box-noStyle {
     background: transparent !important;
     padding: 0px !important;
+    margin-bottom: 8px !important;
   }
   .card-box {
     // height: 175px;