peisweb/src/components/sumDoctorCheck/SumAsbItemStatus.vue

<template>
  <div style="display: flex;height:90px;">
    <div class="asbitemListClass">
      <div style="margin-top:2px;font-size:9px;color: #F56C6C;">未检组合项目：</div>
      <div style="overflow-y:auto; height:68px;width:100%; margin-top:2px;border: 1px solid;">
        <el-tag type="danger" style="margin-left: 5px;" v-for="item in data.unCheckedAsbitem" :key="item" size="mini">{{
          item }}</el-tag>
      </div>
    </div>
    <div class="asbitemListClass">
      <div style="margin-top:2px;font-size:9px;color: #909399;">弃检组合项目：</div>
      <div style="overflow-y:auto; height:68px;width:100%; margin-top:2px;border: 1px solid;">
        <el-tag type="info" style="margin-left: 5px;" v-for="item in data.giveUpAsbitem" :key="item" size="mini">{{ item
        }}</el-tag>
      </div>
    </div>
    <div class="asbitemListClass">
      <div style="margin-top:2px;font-size:9px;color: #409EFF;">组合项目已检但无值的明细项目：</div>
      <div style="overflow-y:auto; height:68px;width:100%; margin-top:2px;border: 1px solid;">
        <el-tag style="margin-left: 5px;" v-for="item in data.checkedNullValueItem" :key="item" size="mini">{{ item
        }}</el-tag>
      </div>
    </div>
    <div class="asbitemListClass">
      <div style="margin-top:2px;font-size:9px;color: #E6A23C;">组合项目已检但弃检的明细项目：</div>
      <div style="overflow-y:auto; height:68px;width:100%; margin-top:2px;border: 1px solid;">
        <el-tag type="warning" style="margin-left: 5px;" v-for="item in data.checkedGiveUpItem" :key="item" size="mini">{{
          item }}</el-tag>
      </div>
    </div>
  </div>
</template>
<script>
import moment from "moment";
import { mapState } from "vuex";
import { getapi, postapi, putapi, deletapi } from "@/api/api";

export default {
  components: {},
  props: ['patientRegisterId'],
  data() {
    return {
      data: {
        unCheckedAsbitem: [],//['未检项目1','未检项目2','未检项目3','未检项目4','未检项目5','未检项目6','未检项目7','未检项目8'],
        giveUpAsbitem: [],//['弃检1','弃检2'],
        checkedNullValueItem: [],//['无果1','无果2'],
        checkedGiveUpItem: [],//['弃检明细1','弃检明细2'],
      }
    };
  },

  created() { },

  //挂载完成
  mounted() {

    this.getSumAsbItemStatus(this.dataTransOpts.tableS.patient_register.id);

  },

  computed: {
    ...mapState(["window", "dict","dataTransOpts", "doctorCheck", "sumDoctorCheck"]),
    sumHeight() {
      let tempHeight = this.window.pageHeight < 600 ? 600 : this.window.pageHeight
      return tempHeight - 320
    },
  },
  methods: {
    getSumAsbItemStatus(PatientRegisterId) {

      if (!PatientRegisterId) {
        this.data.unCheckedAsbitem = [];
        this.data.giveUpAsbitem = [];
        this.data.checkedNullValueItem = [];
        this.data.checkedGiveUpItem = [];
        return
      }

      getapi(`/api/app/patientregister/getpatientregisteritemstatus?PatientRegisterId=${PatientRegisterId}`).then(res => {
        if (res.code != -1) {
          this.data.unCheckedAsbitem = res.data.unCheckedAsbitem;
          this.data.giveUpAsbitem = res.data.giveUpAsbitem;
          this.data.checkedNullValueItem = res.data.checkedNullValueItem;
          this.data.checkedGiveUpItem = res.data.checkedGiveUpItem;
        }
      });
    }
  },

  //监听事件
  watch: {
    //人员ID切换
    // "patientRegisterId":{
    //   immediate:true,
    //   handler(newVal, oldVal) {
    //     console.log("watch patientRegisterId newVal：", newVal, " oldVal：", oldVal);      
    //     this.getSumAsbItemStatus(newVal);
    //   }
    // },
    // 虚拟表 触发强制刷新 （sumDoctor.M 合并包含：综述、建议、对比、历史等，不包含总检诊断）
    "dataTransOpts.refresh.sumDoctor.M": {
      // immediate:true,
      handler(newVal, oldVal) {
        console.log(`watch 总检--检查状态汇总 newVal: ${newVal}, oldVal: ${oldVal} patientRegisterId: ${this.dataTransOpts.tableS.patient_register.id}`);
        this.getSumAsbItemStatus(this.dataTransOpts.tableS.patient_register.id);
      }
    },

  },

};
</script>
<style scoped>
.asbitemListClass {
  display: block;
  width: v-bind("Math.floor((window.pageWidth - 110 - 15 - 15) / 4) + 'px'");
  margin-left: 3px;
}

.labelClass {
  margin-top: 2px;
  font-size: 8x;
}

.contentClass {
  display: flex;
  height: 52px;
  margin-top: 2px;
  font-size: 8x;
}
</style>