web_dist/src/views/examination/InspectionReportIndex.vue

<template>
  <page-layer>
    <template #header>
      <el-select v-model="type" style="width: 100px">
        <el-option v-for="item in types" :key="item.code" :value="item.code" :label="item.name"></el-option>
      </el-select>
      <el-input v-model="content" style="width: 170px" clearable :placeholder="placeHolder"></el-input>
      <el-date-picker
          v-model="datePeriod"
          type="daterange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          :shortcuts="shortcuts"
          style="width: 260px"
      ></el-date-picker>
      <el-button type="primary" icon="Search" style="margin-left: 20px" @click="queryIndex">查询</el-button>
      <el-button type="primary" icon="Printer" @click="doPrint">打印</el-button>
    </template>
    <template #aside>
      <el-table :data="inspectionIndex" :height="tableHeight" stripe highlight-current-row @row-click="queryDetail">
        <el-table-column prop="ordr_CREATE_DATE" label="报告时间" width="130"></el-table-column>
        <el-table-column prop="aply_CTNT" label="检验名称" width="170"></el-table-column>
      </el-table>
    </template>
    <template #main>
      <div id="reportDetail"
           style="position: relative; width: 90%; height: 96%; padding: 0 30px; background-color: white">
        <h3 style="width: 100%; text-align: center; font-weight: bold; height: 30px; line-height: 30px">
          长沙泰和医院检查报告单</h3>
        <div style="display: flex">
          <div style="width: 25%">姓名：{{ inspectionDetail.inspectionHeader.ptnt_NAME }}</div>
          <div style="width: 25%">性别：{{ filterSex(inspectionDetail.inspectionHeader.ptnt_SEX) }}</div>
          <div style="width: 25%">
            年龄：{{ inspectionDetail.inspectionHeader.ptnt_AGE }}
            {{ filterAgeUnit(inspectionDetail.inspectionHeader.ptnt_AGE_UNIT) }}
          </div>
          <div style="width: 25%">
            {{ ptntType }}：
            {{ inspectionDetail.inspectionHeader.ptnt_NO }}
          </div>
        </div>
        <div style="display: flex">
          <div style="width: 25%">科室：{{ inspectionDetail.inspectionHeader.dept_NAME }}</div>
          <div style="width: 25%">床号：{{ inspectionDetail.inspectionHeader.ptnt_BED_NO }}</div>
          <div style="width: 25%">标本类型：{{ inspectionDetail.inspectionHeader.smpl_NAME }}</div>
          <div style="width: 25%">
            <div>申请项目：{{ inspectionDetail.inspectionHeader.aply_CNTN.substring(0, 13) }}</div>
            <div>{{ inspectionDetail.inspectionHeader.aply_CNTN.substring(13) }}</div>
          </div>
        </div>
        <div style="margin: 5px 0; border-top: 1px solid gray"></div>
        <div>
          <div v-if="inspectionDetail.inspectionHeader.info_TYPE === '1'">
            <div style="display: inline-block; width: 49.7%; vertical-align: top">
              <div style="display: flex">
                <div style="width: 25%">检验项目</div>
                <div style="width: 16.66%">结果</div>
                <div style="width: 16.66%">单位</div>
                <div style="width: 16.66%">说明</div>
                <div style="width: 25%">参考值</div>
              </div>
              <div style="margin: 5px 0; border-top: 1px solid gray"></div>
              <div v-for="(item, index) in inspectionDetail.inspectionItems.slice(0, halfSize)" :key="index"
                   style="display: flex">
                <div style="width: 25%">
                  <div>{{ item.itm_NAME.substring(0, 6) }}</div>
                  <div>{{ item.itm_NAME.substring(6) }}</div>
                </div>
                <div style="width: 16.66%">
                  <div>{{ item.itm_VALUE.substring(0, 6) }}</div>
                  <div>{{ item.itm_VALUE.substring(6) }}</div>
                  <div>{{ item.itm_STR_VALUE.substring(0, 6) }}</div>
                  <div>{{ item.itm_STR_VALUE.substring(6) }}</div>
                </div>
                <div style="width: 16.66%">{{ item.itm_UNIT }}</div>
                <div style="width: 16.66%">
                  <span v-html="getItemAlert(item.itm_ALERT, item.itm_STR_VALUE, item.itm_VALUE)"></span>
                </div>
                <div style="width: 25%">{{ item.range }}</div>
              </div>
            </div>
            <div style="display: inline-block; width: 49.7%; vertical-align: top">
              <div style="display: flex">
                <div style="width: 25%">检验项目</div>
                <div style="width: 16.66%">结果</div>
                <div style="width: 16.66%">单位</div>
                <div style="width: 16.66%">说明</div>
                <div style="width: 25%">参考值</div>
              </div>
              <div style="margin: 5px 0; border-top: 1px solid gray"></div>
              <div v-for="(item, index) in inspectionDetail.inspectionItems.slice(halfSize)" :key="index"
                   style="display: flex">
                <div style="width: 25%">
                  <div>{{ item.itm_NAME.substring(0, 6) }}</div>
                  <div>{{ item.itm_NAME.substring(6) }}</div>
                </div>
                <div style="width: 16.66%">
                  <div>{{ item.itm_VALUE.substring(0, 6) }}</div>
                  <div>{{ item.itm_VALUE.substring(6) }}</div>
                  <div>{{ item.itm_STR_VALUE.substring(0, 6) }}</div>
                  <div>{{ item.itm_STR_VALUE.substring(6) }}</div>
                </div>
                <div style="width: 16.66%">{{ item.itm_UNIT }}</div>
                <div style="width: 16.66%">
                  <span v-html="getItemAlert(item.itm_ALERT, item.itm_STR_VALUE, item.itm_VALUE)"></span>
                </div>
                <div style="width: 25%">{{ item.range }}</div>
              </div>
            </div>
          </div>
          <div v-if="inspectionDetail.inspectionHeader.info_TYPE === '2'">
            <div style="display: flex">
              <div style="width: 25%">检验项目</div>
              <div style="width: 75%">结果</div>
            </div>
            <div style="margin: 5px 0; border-top: 1px solid gray"></div>
            <div v-for="(item, index) in inspectionDetail.inspectionItems" :key="index" style="display: flex">
              <div style="width: 25%">{{ item.itm_NAME }}</div>
              <div style="width: 75%">{{ item.itm_STR_VALUE || item.itm_VALUE || bacName }}</div>
            </div>
            <div style="margin: 0 30px" v-if="halfBacSize > 0">
              <div style="display: inline-block; width: 49.7%; vertical-align: top">
                <div style="display: flex">
                  <div style="width: 33.33%">抗菌药物</div>
                  <div style="width: 33.33%">抗菌药物编码</div>
                  <div style="width: 16.66%">MIC值</div>
                  <div style="width: 16.66%">敏感性</div>
                </div>
                <div style="margin: 5px 0; border-top: 1px solid gray"></div>
                <div style="display: flex" v-for="(bac, index) in antibioticResults.slice(0, halfBacSize)" :key="index">
                  <div style="width: 33.33%">
                    <div>{{ bac.anti_NAME_CN.substring(0, 6) }}</div>
                    <div>{{ bac.anti_NAME_CN.substring(6) }}</div>
                  </div>
                  <div style="width: 33.33%">{{ bac.anti_ABB }}</div>
                  <div style="width: 16.66%">{{ bac.anti_MIC }}</div>
                  <div style="width: 16.66%">{{ bac.anti_VALUE }}</div>
                </div>
              </div>
              <div style="display: inline-block; width: 47%; vertical-align: top">
                <div style="display: flex">
                  <div style="width: 33.33%">抗菌药物</div>
                  <div style="width: 33.33%">抗菌药物编码</div>
                  <div style="width: 16.66%">MIC值</div>
                  <div style="width: 16.66%">敏感性</div>
                </div>
                <div style="margin: 5px 0; border-top: 1px solid gray"></div>
                <div style="display: flex" v-for="(bac, index) in antibioticResults.slice(halfBacSize)" :key="index">
                  <div style="width: 33.33%">
                    <div>{{ bac.anti_NAME_CN.substring(0, 6) }}</div>
                    <div>{{ bac.anti_NAME_CN.substring(6) }}</div>
                  </div>
                  <div style="width: 33.33%">{{ bac.anti_ABB }}</div>
                  <div style="width: 16.66%">{{ bac.anti_MIC }}</div>
                  <div style="width: 16.66%">{{ bac.anti_VALUE }}</div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div style="position: absolute; left: 30px; right: 30px; bottom: 0">
          <div style="margin: 5px 0; border-top: 1px solid gray"></div>
          <div style="display: flex">
            <div style="width: 33.33%">接收时间：{{ inspectionDetail.inspectionHeader.aply_DATE }}</div>
            <div style="width: 33.33%">检验时间：{{ inspectionDetail.inspectionHeader.ordr_CREATE_DATE }}</div>
            <div style="width: 33.33%">报告时间：{{ inspectionDetail.inspectionHeader.audt_TIME }}</div>
          </div>
          <div style="display: flex">
            <div style="width: 33.33%">送检医生：{{ inspectionDetail.inspectionHeader.test_USR_NAME }}</div>
            <div style="width: 33.33%">检验人：{{ inspectionDetail.inspectionHeader.ordr_USR_NAME }}</div>
            <div style="width: 33.33%">审核人：{{ inspectionDetail.inspectionHeader.audt_USR_NAME }}</div>
          </div>
          <div style="margin: 5px 0; border-top: 1px solid gray"></div>
          <div style="width: 100%; text-align: center; font-weight: bold; height: 30px; font-size: 12px">
            ***此结果仅对所检测的标本负责***
            <span style="margin-left: 10px; font-size: 12px">备注：升高(↑)，降低(↓)，阳性(+)，阴性(-)</span>
          </div>
        </div>
      </div>
    </template>
  </page-layer>
</template>

<script>
import {computed, onActivated, reactive, ref} from 'vue'
import {shortcuts} from '@/data/shortcuts'
import {queryInspectionDetail, queryInspectionsIndex} from '@/api/inspections'
import store from '@/store'
import router from '@/router'
import {ElMessage} from 'element-plus'
import {initLodop, getLodop} from '@/utils/c-lodop'
import PageLayer from "@/layout/PageLayer";

export default {
  components: {PageLayer},
  props: {
    patNo: {
      type: String,
      default: null
    },
    start: {
      type: String
    },
    end: {
      type: String
    }
  },
  setup(props) {
    const type = ref(1)
    const types = initTypes()
    const content = ref(null)
    const datePeriod = ref([])
    const placeHolder = computed(() => {
      return '请输入' + ptntType.value
    })
    const ptntType = computed(() => {
      if (type.value === 1) {
        return '住院号'
      } else if (type.value === 0) {
        return '门诊号'
      } else if (type.value === 3) {
        return '体检号'
      }
      return ''
    })
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 45
    const inspectionIndex = ref([])
    const bacName = ref(null)
    const antibioticResults = ref([])
    const inspectionDetail = reactive({
      inspectionHeader: {
        aply_CNTN: '',
      },
      inspectionItems: [],
    })
    const halfSize = ref(0)
    const halfBacSize = ref(0)

    onMounted(() => {
      if (props.patNo && props.start && props.end) {
        type.value = 1
        content.value = props.patNo
        datePeriod.value[0] = props.start
        datePeriod.value[1] = props.end
        queryIndex()
      }
    })

    onActivated(() => {
      const params = router.currentRoute.value.params
      if (params.patNo && params.start && params.end) {
        type.value = 1
        content.value = params.patNo
        datePeriod.value[0] = params.start
        datePeriod.value[1] = params.end
        queryIndex()
      }
    })

    const queryIndex = () => {
      if (!content.value) {
        ElMessage({
          message: '请输入患者' + ptntType.value + '。',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }
      if (!datePeriod.value) {
        ElMessage({
          message: '请选择日期范围。',
          type: 'warning',
          duration: 2000,
          showClose: true,
        })
        return
      }
      const param = {
        type: type.value,
        content: content.value,
        start: datePeriod.value[0],
        end: datePeriod.value[1],
      }
      queryInspectionsIndex(param).then((res) => {
        inspectionIndex.value = res
      })
    }

    // 531127-4
    const queryDetail = (row) => {
      queryInspectionDetail(row.ordr_ID).then((res) => {
        // console.log(res)
        halfSize.value = Math.ceil(res.inspectionItems.length / 2)
        inspectionDetail.inspectionHeader = res.inspectionHeader
        inspectionDetail.inspectionItems = res.inspectionItems
        if (res.inspectionItems.length > 0) {
          res.inspectionItems.forEach((item) => {
            if (item.itm_NAME.indexOf('培养') > -1) {
              bacName.value = item.itm_STR_VALUE
            }
          })
        }
        res.inspectionItems.forEach((item) => {
          if (item.bacteriaResults && item.bacteriaResults.length > 0) {
            if (item.bacteriaResults[0].antibioticResults != null) {
              const bacSize = Math.ceil(item.bacteriaResults[0].antibioticResults.length / 2)
              if (bacSize > halfBacSize.value) {
                halfBacSize.value = bacSize
                antibioticResults.value = item.bacteriaResults[0].antibioticResults
              }
            }
          }
        })
      })
    }

    const doPrint = () => {
      initLodop()
      const printarea = document.getElementById('reportDetail').innerHTML
      const LODOP = getLodop()
      LODOP.PRINT_INIT('')
      LODOP.SET_PRINT_MODE('FULL_WIDTH_FOR_OVERFLOW', true) //宽度溢出缩放
      LODOP.SET_PRINT_PAGESIZE(3, 0, 20, 'A4')
      LODOP.ADD_PRINT_HTM(0, 0, '210mm', '267mm', printarea)
      LODOP.PREVIEW()
    }

    return {
      type,
      types,
      content,
      ptntType,
      placeHolder,
      datePeriod,
      shortcuts,
      halfSize,
      halfBacSize,
      queryIndex,
      tableHeight,
      inspectionIndex,
      inspectionDetail,
      queryDetail,
      antibioticResults,
      filterSex,
      filterAgeUnit,
      bacName,
      getItemAlert,
      doPrint,
    }
  },
}

function initTypes() {
  return [
    {code: 1, name: '住院号'},
    {code: 0, name: '门诊号'},
    {code: 3, name: '体检号'},
  ]
}

function filterSex(val) {
  switch (val) {
    case '0':
      return '未填'
    case '1':
      return '男'
    case '2':
      return '女'
    case '3':
      return '未知'
  }
  return ''
}

function filterAgeUnit(val) {
  switch (val) {
    case '0':
      return '岁'
    case '1':
      return '月'
    case '2':
      return '天'
    case '3':
      return '时'
  }
  return ''
}

function getItemAlert(val, strValue, value) {
  if (strValue !== '' || value === '') return ''
  switch (val) {
    case 'L':
      return '<span style="color:#F56C6C;font-weight:bold">↓</span>'
    case 'H':
      return '<span style="color:#F56C6C;font-weight:bold">↑</span>'
  }
  return '<span style="color:#67C23A;font-weight:bold">正常</span>'
}
</script>