GY_ceshi_web/src/views/allcase/components/CaseRecord2.vue

<template>
  <div class="bcjl">
    <div class="title">{{ titleName }}</div>
    <div class="info-header mb40">
      <el-row :gutter="32">
        <el-col :span="6">
          <span class="text-blod">科室：</span>
          <span>{{ data.keshi }}</span>
        </el-col>
        <el-col :span="6">
          <span class="text-blod">姓名：</span>
          <span>{{ data.brxm }}</span>
        </el-col>
        <el-col :span="6">
          <span class="text-blod">床号：</span>
          <span>{{ data.ch }}</span>
        </el-col>
        <el-col :span="6">
          <span class="text-blod">住院号：</span>
          <span>{{ data.brbh }}</span>
        </el-col>
      </el-row>
    </div>
    <div class="info-content">
      <el-row :gutter="32">
        <el-col :span="24" class="mb40">
          <el-row :gutter="32">
            <el-col :span="10">
              <span class="date">{{ data ? data.date : '' }}</span>
            </el-col>
            <el-col :span="8">
              <span class="content-title">{{data ? data.title : '' }}</span>
            </el-col>
          </el-row>
        </el-col>
      </el-row>
      <el-row :gutter="32">
        <!-- type 1为普通病程记录 2. 术前 3术后 4.查房 -->
        <template v-if="data.type === 1">
          <el-col :span="24" class="mb10">
            <span class="text-blod">病历特点：</span>
            <div v-for="(item, index) of data.BLTD" :key="`bltd1${index}`" class="pl76 mb20">{{ item.trim() }}</div>
          </el-col>
          <el-col :span="24" class="mb10">
            <span class="text-blod">初步诊断：</span>
            <div v-for="(item, index) of data.CBZD" :key="`cbzd1${index}`" class="pl76 mb20">{{ item.trim() }}</div>
          </el-col>
          <el-col :span="24" class="mb10">
            <span class="text-blod">诊断依据：</span>
            <div v-for="(item, index) of data.ZDYJ" :key="`zdyj1${index}`" class="pl76 mb20">{{ item.trim() }}</div>
          </el-col>
          <el-col :span="24" class="mb10">
            <span class="text-blod">鉴别诊断：</span>
            <div v-for="(item, index) of data.JBZD" :key="`jbzd1${index}`" class="pl76 mb20">{{ item.trim() }}</div>
          </el-col>
          <el-col :span="24" class="mb10">
            <span class="text-blod">诊疗计划：</span>
            <div v-for="(item, index) of data.ZLJH" :key="`zljh1${index}`" class="pl76 mb20">{{ item.trim() }}</div>
          </el-col>
        </template>
        <!-- type 2术前 -->
        <template v-if="[2].includes(data.type)">
          <el-col :span="24" class="mb10" v-if="data.SSZC">
            <div class="text-blod">术前讨论由<span style="padding: 0 20px; border-bottom: 1px solid #000;">{{ data.SSZC }}</span>医师主持，讨论结论及术前小结记录如下:</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.JYBQ">
            <span class="text-blod">简要病情：</span>
            <div v-for="(item, index) of data.JYBQ" :key="`jybq2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.SSZZ">
            <span class="text-blod">术前诊断：</span>
            <div v-for="(item, index) of data.SSZZ" :key="`sszz2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.SZZY">
            <span class="text-blod">手术指征：</span>
            <div v-for="(item, index) of data.SZZY" :key="`szzz2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.NSSS">
            <span class="text-blod">拟施手术名称和方式：</span>
            <div v-for="(item, index) of data.NSSS" :key="`nsss2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.NSMZ">
            <span class="text-blod">拟施麻醉方式：</span>
            <div v-for="(item, index) of data.NSMZ" :key="`nsmz2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.OTHER">
            <span class="text-blod">术前准备：</span>
            <div v-for="(item, index) of data.OTHER" :key="`other2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.SZZY">
            <span class="text-blod">术中注意事项：</span>
            <div v-for="(item, index) of data.SZZY" :key="`szzz2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.SHCL">
            <span class="text-blod">术后处理：</span>
            <div v-for="(item, index) of data.SHCL" :key="`shcl2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
          <el-col :span="24" class="mb10" v-if="data.desc">
            <span class="text-blod">其他描述：</span>
            <div v-for="(item, index) of data.desc" :key="`desc2${index}`" class="pl76 mb20">{{ item }}</div>
          </el-col>
        </template>
        <!-- type 3术后查房 -->
        <template v-if="[3].includes(data.type)">
          <el-col :span="24" class="mb10" v-if="data.desc">
            <div v-for="(item, index) of data.desc" :key="`bltd3${index}`" class="mb20">{{ item.trim() }}</div>
          </el-col>
        </template>
        <!-- type 4术后查房 -->
        <template v-if="[4].includes(data.type)">
          <el-col :span="24" class="mb10" v-if="data.desc">
            <div v-for="(item, index) of data.desc" :key="`bltd3${index}`" class="mb20">{{ item.trim() }}</div>
          </el-col>
        </template>
        <el-col :span="24" class="mt80">
          <div class="fr" style="margin-right: 100px;">
            <span class="text-blod">医生签名：</span>
            <!-- 接口暂无字段 -->
          </div>
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    data: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  computed: {
    titleName() {
      let str
      const type =  this.data.type
      if (type === 1) {
        str = '首次病程记录'
      } else if (type === 2) {
        str = '术前小结及术前讨论结论记录'
      } else if (type === 3) {
        str = '术后首次病程记录'
      } else if (type === 4) {
        str = '查房记录'
      }
      return str
    }
  }
};
</script>

<style lang="scss" scoped>
.bcjl {
  margin: 0 30px;
  line-height: 1.5;
  padding-bottom: 100px;
  .title {
    font-size: 24px;
    font-weight: bold;
    color: #2c3240;
    text-align: center;
    margin: 20px;
  }
  .mb10 {
    margin-bottom: 10px;
  }
  .mb20 {
    margin-bottom: 20px;
  }
  .mb40 {
    margin-bottom: 40px;
  }
  .mt80 {
    margin-top: 80px;
  }
  .pl76 {
    padding-left: 76px;
  }
  .fr {
    float: right;
  }
  .text-blod {
    font-weight: bold;
  }
  .info-header {
    padding: 20px 0;
    border-bottom: 1.5px solid #e2dfdf;
  }
  .info-content {
    overflow: hidden;
    .date {
      font-weight: 600;
    }
    .content-title {
      font-weight: 600;
    }
  }
}
</style>