病历质控右侧

src/views/allcase/caseViews.vue

@@ -109,7 +109,7 @@
         <!-- 住院病案质控 -->
         <!-- <ErrorMsg v-if="is_active == 0" class="cont-reight" :titleName="titleName" :errorList="errorList" :score="score" @ss="getBlankIndexss"></ErrorMsg>
         <ErrorMsg2 v-if="is_active == 292" class="cont-reight" :titleName="titleName" :errorList="errorList" :score="score"></ErrorMsg2> -->
-        <CaseQualityBox :list="results" />
+        <CaseQualityBox :data="results" />
       </template>
     </div>
   </div>
@@ -268,6 +268,7 @@ export default {
     getCaseQualityResults() {
       const params = {
         id: Number(this.valData),
+        // id: 723957
       };
       this.$axios.post('/get_case_quality', params).then(res => {
         this.results = res.data;

src/views/allcase/components/CaseQualityBox.vue

@@ -1,29 +1,112 @@
 <template>
   <div class="caseQualityBox">
-    <div class="name">病案质控</div>
-    <div class="list-box">
-      <el-card v-for="(item, index) of list" :key="index" class="box-card">
-        <el-descriptions title="" :column="1">
-          <el-descriptions-item label="类型">
-            <el-tag type="danger" size="small">{{ item.error_field }}</el-tag>
-          </el-descriptions-item>
-          <el-descriptions-item label="描述">{{ item.notice }}</el-descriptions-item>
-        </el-descriptions>
-      </el-card>
-      <div class="nodata">暂无数据</div>
-    </div>
+    <el-table
+      :data="tableData"
+      style="width: 100%">
+      <el-table-column type="expand">
+        <template slot-scope="props">
+          <el-card v-for="(item, index) of props.row.children" :key="index" class="box-card" shadow="hover">
+            <el-row>
+              <el-col :span="24">
+                <el-descriptions title="" :column="1">
+                  <el-descriptions-item label="质控项目">{{ item.error_field }}</el-descriptions-item>
+                  <el-descriptions-item label="错误描述">{{ item.notice }}</el-descriptions-item>
+                  <el-descriptions-item label="质控依据">
+                    <span v-for="(yItem, yIndex) of item.basis[0]" :key="yIndex">
+                      <span v-if="yIndex">、</span>
+                      {{ yItem }}
+                    </span>
+                  </el-descriptions-item>
+                  <el-descriptions-item label="分值">-{{ item.score }}</el-descriptions-item>
+              </el-descriptions>
+              </el-col>
+            </el-row>
+          </el-card>
+        </template>
+      </el-table-column>
+      <el-table-column
+        label=""
+        prop="category">
+      </el-table-column>
+    </el-table>
   </div>
 </template>
 
 <script>
   export default {
     props: {
-      list: {
-        type: Array,
+      data: {
+        type: Object,
         default() {
-          return []
+          return {}
         }
       }
+    },
+    data() {
+      return {
+        // data: {
+        //   "病程类": [{
+        //     "id": 8,
+        //     "BLBH": 0,
+        //     "rule_id": 110,
+        //     "notice": "有化疗药****，没有病程记录",
+        //     "created_at": "2023-05-20 18:17:33",
+        //     "code": "hly",
+        //     "error_field": "病程记录",
+        //     "JZHM": "723957",
+        //     "BRBH": "",
+        //     "basis": [
+        //       ["化疗药名称【奥沙利铂注射液(齐敖)(国)】", "开嘱时间【2022-04-28 01:19:30】", "病程记录时间【无】"]
+        //     ],
+        //     "score": 10,
+        //     "category": "病程类"
+        //   },{
+        //     "id": 8,
+        //     "BLBH": 0,
+        //     "rule_id": 110,
+        //     "notice": "有化疗药****，没有病程记录",
+        //     "created_at": "2023-05-20 18:17:33",
+        //     "code": "hly",
+        //     "error_field": "病程记录",
+        //     "JZHM": "723957",
+        //     "BRBH": "",
+        //     "basis": [
+        //       ["化疗药名称【奥沙利铂注射液(齐敖)(国)】", "开嘱时间【2022-04-28 01:19:30】", "病程记录时间【无】"]
+        //     ],
+        //     "score": 10,
+        //     "category": "病程类"
+        //   },{
+        //     "id": 8,
+        //     "BLBH": 0,
+        //     "rule_id": 110,
+        //     "notice": "有化疗药****，没有病程记录",
+        //     "created_at": "2023-05-20 18:17:33",
+        //     "code": "hly",
+        //     "error_field": "病程记录",
+        //     "JZHM": "723957",
+        //     "BRBH": "",
+        //     "basis": [
+        //       ["化疗药名称【奥沙利铂注射液(齐敖)(国)】", "开嘱时间【2022-04-28 01:19:30】", "病程记录时间【无】"]
+        //     ],
+        //     "score": 10,
+        //     "category": "病程类"
+        //   }]
+        // },
+      }
+    },
+    computed: {
+      tableData() {
+        let arr = []
+        const keys = Object.keys(this.data)
+        for(let i=0; i<keys.length; i++) {
+          let obj = {
+            category: keys[i],
+            children: this.data[keys[i]]
+          }
+          arr.push(obj)
+        }
+        return arr
+      }
     }
   }
 </script>
@@ -39,21 +122,14 @@
   border: 1px solid #e2e2e2;
   box-sizing: border-box;
   padding: 0 20px;
-  .name {
-    text-align: center;
-    font-size: 22px;
-    font-weight: bold;
-    line-height: 40px;
-    margin: 10px 0;
+  ::v-deep .el-descriptions-item__container .el-descriptions-item__content {
+    display: block;
   }
-  .box-card {
-    margin-bottom: 16px;
+  ::v-deep .el-descriptions-item__label:not(.is-bordered-label) {
+    font-weight: 600;
   }
-  .nodata {
-    font-size: 16px;
-    color: #C0C4CC;
-    margin-top: 150px;
-    text-align: center;
+  .box-card {
+    margin-bottom: 10px;
   }
 }
 </style>