质控

src/views/medicalRecord/components/index/ControlDrawer.vue

@@ -27,13 +27,13 @@
             -{{ item.down }}
           </div>
           <div class="cont-reight-bottom-conter">
-            <p>{{ item.field_name }}</p>
-            <p>{{ item.desc }}</p>
+            <p>字段名称：{{ item.field_name }}</p>
+            <p>缺陷问题：{{ item.desc }}</p>
           </div>
         </div>
         <!-- 质控依据 -->
         <div v-for="(yjItem, yjIndex) of item.basis" :key="'yj'+yjIndex">
-          <div class="zkyj" @click="toJump(yjItem)">{{ yjItem.desc }}</div>
+          <div class="zkyj" @click="toJump(yjItem, item, index)">质控依据：{{ yjItem.desc }}</div>
         </div>
       </div>
     </el-scrollbar>
@@ -73,7 +73,7 @@ export default {
             field_name: '主要诊断编码',
             category: 0,
             down: 0,
-            desc: '诊断编码出现S00-S09，颅内损伤昏迷时间6个空必填一个数字',
+            desc: '诊断编码出现S00-S09，颅内损伤昏迷时间6个空必填一个数字昏迷时间6个空必填一个数字昏迷时间6个空必填一个数字',
             basis: [
               {
                 desc: '诊断编码出现【S00-S09】颅内损伤昏迷时间不能全部为空',
@@ -140,7 +140,8 @@ export default {
       zk_codes: {
         qz: [],
         jy: []
-      }
+      },
+      active_zk_index: 0
     };
   },
   computed: {
@@ -199,33 +200,65 @@ export default {
         })
       })
     })
-    console.log(this.zk_codes, 'this.zk_codes')
     this.$emit('codes', this.zk_codes)
   },
   methods: {
     // 跳转锚点及高亮
-    toJump(item) {
+    toJump(item, pItem, pIndex) {
+      if (this.active_zk_index !== pIndex) {
+        this.zkcodeIndex = 0
+        this.active_zk_index = pIndex
+      }
       const { user, zd, ss } = item.location
       const arr = []
-      user.map(item => {
+      const { level } = pItem
+      const level_arr = {
+        qz: [],
+        jy: []
+      }
+      user.map(uItem => {
         const obj = {
-          field: item,
+          field: uItem,
           key: 'user'
         }
         arr.push(obj)
+
+        if (level) {
+          // 建议
+          level_arr.jy.push(uItem)
+        } else {
+          // 强制
+          level_arr.qz.push(uItem)
+        }
+
       })
-      zd.map(item => {
-        item.key="zd"
-        arr.push(item)
+      zd.map(zItem => {
+        zItem.key="zd"
+        arr.push(zItem)
+        
+        if (level) {
+          // 建议
+          level_arr.jy.push(zItem.field)
+        } else {
+          // 强制
+          level_arr.qz.push(zItem.field)
+        }
       })
-      ss.map(item => {
-        item.key="ss"
-        arr.push(item)
+      ss.map(sItem => {
+        sItem.key="ss"
+        arr.push(sItem)
+        
+        if (level) {
+          // 建议
+          level_arr.jy.push(sItem.field)
+        } else {
+          // 强制
+          level_arr.qz.push(sItem.field)
+        }
       })
-
+      console.log(level_arr, 'level_arr')
       const maxIndex = arr.length - 1
-      // console.log(arr[this.zkcodeIndex].field, arr[this.zkcodeIndex].key, this.zkcodeIndex)
-      this.$emit('zk', { level: 0, zk: arr[this.zkcodeIndex] })
+      this.$emit('zk', { level: 0, anchor: arr[this.zkcodeIndex], codes: level_arr })
       if (this.zkcodeIndex === maxIndex) {
         this.zkcodeIndex = 0
       } else {

src/views/medicalRecord/index.vue

@@ -10,9 +10,9 @@
       <table class="table">
         <tr>
           <td class="label ZA03" :class="{'jy': hasIntersection(zk_codes.jy, ['ZA03']), 'qz': hasIntersection(zk_codes.qz, ['ZA03'])}">医疗机构</td>
-          <td colspan="5">{{ blInfo.patient_other_info.ZA03 }}</td>
+          <td colspan="5" :class="{'jy_bg': hasIntersection(active_zk_codes.jy, ['ZA03']), 'qz_bg': hasIntersection(active_zk_codes.qz, ['ZA03'])}">{{ blInfo.patient_other_info.ZA03 }}</td>
           <td class="label TYSHXYDM UNT_ID" :class="{'jy': hasIntersection(zk_codes.jy, ['TYSHXYDM', 'UNT_ID']), 'qz': hasIntersection(zk_codes.qz, ['TYSHXYDM', 'UNT_ID'])}">统一社会信用代码</td>
-          <td colspan="5">
+          <td colspan="5" :class="{'jy_bg': hasIntersection(active_zk_codes.jy, ['TYSHXYDM', 'UNT_ID']), 'qz_bg': hasIntersection(active_zk_codes.qz, ['TYSHXYDM', 'UNT_ID'])}">
             <NoValueInputVue :data="blInfo.patient_add.TYSHXYDM" />
             （组织机构机构代码：
             <NoValueInputVue :data="blInfo.patient_other_info.UNT_ID" />
@@ -21,11 +21,11 @@
         </tr>
         <tr>
           <td class="label AAA26C" :class="{'jy': hasIntersection(zk_codes.jy, ['AAA26C']), 'qz': hasIntersection(zk_codes.qz, ['AAA26C'])}">医疗付费方式</td>
-          <td colspan="5">{{ blInfo.patient_info.AAA26C }}</td>
+          <td colspan="5" :class="{'jy_bg': hasIntersection(active_zk_codes.jy, ['AAA26C']), 'qz_bg': hasIntersection(active_zk_codes.qz, ['AAA26C'])}">{{ blInfo.patient_info.AAA26C }}</td>
           <td class="label JKKH" :class="{'jy': hasIntersection(zk_codes.jy, ['JKKH']), 'qz': hasIntersection(zk_codes.qz, ['JKKH'])}">健康卡号</td>
-          <td colspan="3">{{ blInfo.patient_add.JKKH }}</td>
+          <td colspan="3" :class="{'jy_bg': hasIntersection(active_zk_codes.jy, ['JKKH']), 'qz_bg': hasIntersection(active_zk_codes.qz, ['JKKH'])}">{{ blInfo.patient_add.JKKH }}</td>
           <td class="label AAA29" :class="{'jy': hasIntersection(zk_codes.jy, ['AAA29']), 'qz': hasIntersection(zk_codes.qz, ['AAA29'])}">住院次数</td>
-          <td>{{ blInfo.patient_info.AAA29 }}</td>
+          <td :class="{'jy_bg': hasIntersection(active_zk_codes.jy, ['AAA29']), 'qz_bg': hasIntersection(active_zk_codes.qz, ['AAA29'])}">{{ blInfo.patient_info.AAA29 }}</td>
         </tr>
         <tr>
           <td class="label AAA01" :class="{'jy': hasIntersection(zk_codes.jy, ['AAA01']), 'qz': hasIntersection(zk_codes.qz, ['AAA01'])}">姓名</td>
@@ -1309,7 +1309,10 @@ export default {
         qz: [],
         jy: []
       },
-      zk_level: 0
+      active_zk_codes: {
+        qz: [],
+        jy: []
+      }
     };
   },
   computed: {
@@ -1361,16 +1364,16 @@ export default {
     },
     // 质控栏锚点及高亮
     handleZK(val) {
-      const { level, zk } = val
-      const { key, field } = zk
+      console.log(val, 89898)
+      const { anchor, codes } = val
+      const { key, field } = anchor
+      this.active_zk_codes = codes
       if (key === 'user') {
         this.highlight_code = field
-        this.zk_level = level
         document.querySelector(`.${field}`).scrollIntoView({ behavior: 'smooth', block: 'center' })
       }
     },
     handleCodes(codes) {
-      console.log(codes, 'zkcodes')
       this.$set(this, 'zk_codes', codes)
     },
     // 判断两个数组是否存在交际
@@ -1455,6 +1458,12 @@ export default {
     color: #333333;
     padding: 0 12px;
     word-break: break-all;
+    &.jy_bg {
+      background: rgba($color: #178691, $alpha: 0.2);
+    }
+    &.qz_bg {
+      background: rgba($color: #ED3028, $alpha: 0.2);
+    }
   }
   td.label {
     width: 140px;
@@ -1462,12 +1471,28 @@ export default {
     color: #666666;
     background-color: #ebebeb;
     text-align: center;
+    &.jy {
+      color: #178691;
+      font-weight: bold;
+    }
+    &.qz {
+      color: #FB5C4F;
+      font-weight: bold;
+    }
   }
   th.label {
     height: 40px;
     color: #666666;
     background-color: #ebebeb;
     text-align: center;
+    &.jy {
+      color: #178691;
+      font-weight: bold;
+    }
+    &.qz {
+      color: #FB5C4F;
+      font-weight: bold;
+    }
   }
   .center {
     text-align: center;
@@ -1487,13 +1512,6 @@ export default {
   border-radius: 2px;
   vertical-align: middle;
 }
-.jy {
-  color: #178691 !important;
-  font-weight: bold;
-}
-.qz {
-  color: #FB5C4F !important;
-  font-weight: bold;
-}
+
 
 </style>