xx-doctor-web-html/src/components/medical/labs/detail.vue

<template>
  <div class="labs">
    <div class="labs-header">
      <el-descriptions title="基本信息">
        <el-descriptions-item label="报告名称">{{
          data.reportName
        }}</el-descriptions-item>
        <el-descriptions-item label="申请医生">{{
          data.applyDoctorName
        }}</el-descriptions-item>
        <el-descriptions-item label="检验号">{{
          data.applyId
        }}</el-descriptions-item>
        <el-descriptions-item label="样本类型">{{
          data.sampleTypeRaw
        }}</el-descriptions-item>
        <el-descriptions-item label="检查时间">{{
          data.inspectTime
        }}</el-descriptions-item>
        <el-descriptions-item label="报告时间">{{
          data.reportsTime
        }}</el-descriptions-item>
      </el-descriptions>
    </div>
    <div class="labs-bodyer">
      <el-descriptions title="报告详情" />
      <div v-if="data.dwdLaboratoryReportItemVOs" class="table-list">
        <el-table :data="data.dwdLaboratoryReportItemVOs" stripe style="width: 100%">
          <el-table-column prop="nameRaw" label="检验" width="180">
            <template slot-scope="scope">
              <el-button type="text">{{ scope.row.nameRaw }}</el-button>
            </template>
          </el-table-column>
          <el-table-column prop="codeRaw" label="编号" width="100">
            <template slot-scope="scope">
              {{ scope.row.codeRaw }}
            </template>
          </el-table-column>

          <el-table-column prop="codeRaw" label="结果" width="100">
            <template slot-scope="scope">
              <sapn
                v-if="scope.row.abnormal == '0' && (scope.row.resultValueFlag == 'decline' || scope.row.resultValueFlag == 'rise')">
                <span v-if="scope.row.resultValueFlag == 'rise'" style="color: #f56c6c">{{ scope.row.inspectResultRaw }}
                  ↑</span>
                <span v-else-if="scope.row.resultValueFlag == 'decline'" style="color: #f56c6c">{{
                  scope.row.inspectResultRaw
                }} ↓</span>


              </sapn>
              <span v-else-if="scope.row.abnormal == '1'">
                {{
                  scope.row.inspectResultRaw
                }}
                <span v-if="scope.row.abnormalIndicator == '升高' ||  scope.row.abnormalIndicator == '高' ||  scope.row.abnormalIndicator == '高于极限' " style="color: #f56c6c">
                  ↑</span>
                <span v-else-if="scope.row.abnormalIndicator == '降低'  ||  scope.row.abnormalIndicator == '低' ||  scope.row.abnormalIndicator == '低于极限' " style="color: #f56c6c"> ↓</span>

              </span>
              <span v-else>
                {{
                  scope.row.inspectResultRaw
                }}
              </span>

            </template>
          </el-table-column>

          <el-table-column prop="codeRaw" label="参考范围" width="180">
            <template slot-scope="scope">
              {{ scope.row.referenceRaw }}
            </template>
          </el-table-column>

          <el-table-column prop="unitRaw" label="单位" />
          <el-table-column prop="action" label="操作">
            <template slot-scope="scope">
              <el-button type="text" @click="onTap(scope.row)">查看趋势</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </div>
    <el-dialog title="提示" :visible.sync="dialogVisible" modal-append-to-body :modal="false" :lock-scroll="true"
      width="80%">
      <div class="" style="width: 100%">
        <LabsLine :data="chartData" />
      </div>
    </el-dialog>

  </div>
</template>

<script>
import { queryLabsItemByStandardCode } from '@/api/labs'
import LabsLine from '@/components/medical/labs/line'
export default {
  name: 'LabsReports',
  components: { LabsLine },
  props: {
    data: {
      required: true,
      type: Object
    },
    patientId: {
      required: true,
      type: String
    }
  },
  data() {
    return {
      dialogVisible: false,
      tableData: [],
      chartData: []
    }
  },
  watch: {
    data: {
      deep: true,
      handler: function handler() {
        //this.getSize();
      },
    },
  },
  computed: {},
  methods: {
    onTap(item) {
      const params = {
        projectIdStandard: item.projectIdStandard,
        endDate: '',
        startDate: '',
        patientId: this.patientId
      }
      queryLabsItemByStandardCode(params).then((res) => {
        if (res.code === 0 && res.data) {
          this.dialogVisible = true
          const arr = [res.data]
          // console.log(JSON.stringify(arr));
          this.chartData = arr
        } else {
          this.chartData = []
        }
      })
      // console.log(item);
    }
  }
}
</script>

<style scoped>
.labs-bodyer {
  padding-top: 20px;
}
</style>