hospital/admin-ui/src/views/work/visit/search.vue

<template>
  <div class="container" style="height: 80vh; width: 87vw">
    <el-row :gutter="10">
      <el-col :span="5">
        <div class="left-body">
          <el-menu :default-active="activeNow" @open="handleOpen" :unique-opened="true">
            <el-menu-item index="1" @click="activePatient(1)">
              <i class="el-icon-user"></i>
              <span>患者基本信息/亲属</span>
            </el-menu-item>
            <el-submenu index="2">
              <template slot="title">
                <i class="el-icon-document"></i>
                <span>就诊信息</span>
              </template>
              <el-submenu v-for="(mouths, year) in groupedDates" :key="year" :index="year.toString()">
                <template slot="title">
                  <span>{{year}}年</span>
                </template>
                <el-submenu v-for="(days,month) in mouths" :key="month" :index="year.toString() + month.toString()">
                  <template slot="title">
                    <span>{{month}}月</span>
                  </template>
                  <el-menu-item v-for="item in days" @click="getCard(item.id); activePatient(2); getDgList()" :key="item.id" :index="item.id.toString()">
                    {{item.day}}日 {{item.HH}}:{{item.MM}}:{{item.SS}}
                  </el-menu-item>
                </el-submenu>
              </el-submenu>
            </el-submenu>
          </el-menu>
        </div>
      </el-col>
      <el-col :span="19">
        <div class="right-body">
          <div class="patient-info-nk" v-if="active === 1">
            <div class="patient-info">
              <el-descriptions  style="width: 69vw; margin-top: 10px" title="患者信息" :column="3" border>
                <el-descriptions-item label="患者标识符" v-if="patientInfo">{{patientInfo.patientCode}}</el-descriptions-item>
                <el-descriptions-item label="就诊卡号" v-if="patientInfo">{{patientInfo.cardNumber}}</el-descriptions-item>
                <el-descriptions-item label="姓名" v-if="patientInfo">{{patientInfo.name}}</el-descriptions-item>
                <el-descriptions-item label="性别" v-if="patientInfo">
                  <dict-tag :options="dict.type.patient_sex" :value="patientInfo.sex"/>
                </el-descriptions-item>
                <el-descriptions-item label="身份证号" v-if="patientInfo">{{patientInfo.sfzh}}</el-descriptions-item>
                <el-descriptions-item label="出生时间" v-if="patientInfo">{{patientInfo.birthDate}}</el-descriptions-item>
                <el-descriptions-item label="居住地址" v-if="patientInfo">{{patientInfo.address}}</el-descriptions-item>
                <el-descriptions-item label="联系电话" v-if="patientInfo">{{patientInfo.phone}}</el-descriptions-item>
                <el-descriptions-item label="婚姻状况" v-if="patientInfo">
                  <dict-tag :options="dict.type.patient_marital" :value="patientInfo.marital" />
                </el-descriptions-item>
                <el-descriptions-item label="民族" v-if="patientInfo">{{patientInfo.nation}}</el-descriptions-item>
                <el-descriptions-item label="职业" v-if="patientInfo">{{patientInfo.career}}</el-descriptions-item>
                <el-descriptions-item label="国籍" v-if="patientInfo">{{patientInfo.nationality}}</el-descriptions-item>
                <el-descriptions-item label="病历号" v-if="patientInfo">{{patientInfo.blh}}</el-descriptions-item>
                <el-descriptions-item label="病人卡号" v-if="patientInfo">{{patientInfo.brkh}}</el-descriptions-item>
                <el-descriptions-item label="婴儿序号" v-if="patientInfo">{{patientInfo.yexh}}</el-descriptions-item>
              </el-descriptions>
            </div>

            <div class="patient-nk" style="margin-top: 10px">
              <el-table style="width:69vw;" height="calc(75vh - 270px)"  :data="nkList" highlight-current-row>
                <el-table-column label="姓名" align="center" prop="name"></el-table-column>
                <el-table-column label="所属关系" align="center" prop="kinship"></el-table-column>
                <el-table-column label="近亲地址" align="center" prop="address"></el-table-column>
                <el-table-column label="联系电话" align="center" prop="phone"></el-table-column>
                <el-table-column label="工作名称" align="center" prop="workName"></el-table-column>
                <el-table-column label="工作类别" align="center" prop="workCode"></el-table-column>
              </el-table>
              <pagination v-show="totalNk > 0" :total="totalNk" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getNkList" />
            </div>
          </div>

          <div class="dg-info" v-if="active === 2">
            <div class="pv">
              <el-descriptions :column="3" border style="width: 69vw; margin-top: 10px"  title="就诊信息">
                <el-descriptions-item label="患者类别">
                  <dict-tag :options="dict.type.patient_category" :value="pvList.patientCategory"></dict-tag>
                </el-descriptions-item>
                <el-descriptions-item label="所在病区">{{pvList.wardName}}</el-descriptions-item>
                <el-descriptions-item label="主治医生">{{pvList.physician}}</el-descriptions-item>
                <el-descriptions-item label="主管护士">{{pvList.nurseCode}}</el-descriptions-item>
                <el-descriptions-item label="在院状态">
                  <dict-tag :options="dict.type.hospital_status" :value="pvList.hospitalStatus"/>
                </el-descriptions-item>
                <el-descriptions-item label="入院次数">{{pvList.hospitalizedNumber}}</el-descriptions-item>
                <el-descriptions-item label="就诊号码">{{pvList.cardId}}</el-descriptions-item>
                <el-descriptions-item label="出院方式">
                  <dict-tag :options="dict.type.discharge_method" :value="pvList.dischargeMothod"/>
                </el-descriptions-item>
                <el-descriptions-item label="入院时间">{{pvList.admissionTime}}</el-descriptions-item>
                <el-descriptions-item label="出院时间">{{pvList.dischargeTime}}</el-descriptions-item>
                <el-descriptions-item label="危重级别">{{pvList.level}}</el-descriptions-item>
                <el-descriptions-item label="入区时间">{{pvList.entryTime}}</el-descriptions-item>
                <el-descriptions-item label="出区时间">{{pvList.exitTime}}</el-descriptions-item>
                <el-descriptions-item label="出区原因">{{pvList.reasonArea}}</el-descriptions-item>
              </el-descriptions>
            </div>

            <div class="dg" style="margin-top: 10px">
              <el-table style=" width:69vw;" height="calc(75vh - 270px)" :data="dgList" highlight-current-row>
                <el-table-column label="诊断名称" align="center" prop="diagnosticName"></el-table-column>
                <el-table-column label="诊断代码" align="center" prop="diagnosticCode"></el-table-column>
                <el-table-column label="诊断时间" align="center" prop="diagnosisTime"></el-table-column>
                <el-table-column label="诊断类型" align="center" prop="diagnosticType">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.diagnostic_type" :value="scope.row.diagnosticType"/>
                  </template>
                </el-table-column>
                <el-table-column label="诊断类别" align="center" prop="diagnosticCategoryCode">
                  <template slot-scope="scope">
                    <dict-tag :options="dict.type.diagnostic_category_code" :value="scope.row.diagnosticCategoryCode"/>
                  </template>
                </el-table-column>
              </el-table>
              <pagination v-show="totalDg > 0" :total="totalDg" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getDgList" />
            </div>
          </div>
        </div>
      </el-col>
    </el-row>
  </div>
</template>

<script>
export default {
  computed: {
    index() {
      return index
    }
  },
  dicts: ['patient_category','diagnostic_type', 'diagnostic_category_code','hospital_status','discharge_method','patient_sex','patient_marital'],
  data(){
    return{
      activeNow:'1',
      //groupDates的变量
      year:undefined,
      month:undefined,
      day:undefined,
      id:undefined,
      //显示的界面标记
      active:1,
      //获取就诊时间的记录
      timeList:null,
      //处理时间的分组
      groupedDates: {},
      //亲属表数据总条数
      totalNk:0,
      //诊断表数据总条数
      totalDg:0,
      //dg表数据
      dgList:null,
      //pv表数据
      pvList:null,
      //nk表数据
      nkList:null,
      //患者详细信息
      patientInfo:null,
      //就诊详细信息
      pvInfo:null,
      //查询参数
      queryParams:{
        pageNum:1,
        pageSize:10,
        visitId:undefined,
      }
    }
  },
  watch:{
  },
  created() {
    this.getTime();
    this.getNowDg();
    this.getPatient();
    this.getNkList();
  },
  methods:{
    handleOpen(index){
      if(index === "2"){
        this.activeIndex();
      }
    },
    activeIndex(){
      this.activeNow = this.pvList.id.toString()
      this.active = 2
      this.queryParams.visitId = this.pvList.id;
      this.getDgList()
    },
    /** 获取当前选中的就诊记录 */
    getNowDg(){
      this.get({
        url:'work/visit/list',
        data:{
          cardId:this.param.cardId
        }
      }).then((response)=>{
        this.pvList = response.rows[0];
      })
    },
    activePatient(sign) {
      if (sign === 1) {
        this.active = sign;
        this.activeNow = '1';
      }
      if (sign === 2) {
        this.active = sign;
      }
    },
    /** 查询某一次的就诊信息 */
    getCard(id){
      if(id === this.pvList.id){
        return;
      }
      this.queryParams.visitId = id;
      this.get({
        url:'/work/visit/list',
        data:{
          id:id
        }
      }).then((response)=>{
        this.pvList = response.rows[0];
        this.activeNow = this.pvList.id.toString();
        this.getDgList();
      })
    },
    /** 查询某科室某个病人的就诊记录 */
    getTime(){
      this.get({
        url:'/work/visit/list',
        data:{
          patId:this.param.id,
          department:this.param.department,
          pageSize:10000
        }
      }).then( (response) => {
        this.timeList = response.rows;
        console.log(this.timeList)
        this.groupDates(this.timeList);
      })
    },
    groupDates(dates) {
      dates.forEach(date => {
        this.year = date.admissionTime.substring(0, 4);
        this.month = date.admissionTime.substring(5, 7);
        this.day = date.admissionTime.substring(8, 10);
        this.HH = date.admissionTime.substring(11,13);
        this.MM = date.admissionTime.substring(14,16);
        this.SS = date.admissionTime.substring(17,20);
        this.id = date.id;
        if (!this.groupedDates[this.year]) {
          this.groupedDates[this.year] = {};
        }
        if (!this.groupedDates[this.year][this.month]) {
          this.groupedDates[this.year][this.month] = [];
        }
        this.groupedDates[this.year][this.month].push(
          {
            id: this.id,
            day: this.day,
            HH: this.HH,
            MM: this.MM,
            SS: this.SS
          });
      })
      this.$forceUpdate();
    },
    /** 查询患者信息 */
    getPatient(){
      this.get({
        url:'/work/patient/detail/'+this.param.id,
      }).then((response)=>{
        this.patientInfo = response.data;
      })
    },
    /** 查询亲属表 */
    getNkList() {
      this.get({
        url:'/work/nk/list',
        data:{
          patId:this.param.id,
          ...this.queryParams
        }
      }).then((response)=>{
        this.nkList = response.rows;
        this.totalNk = response.total;
      })
    },
    /** 查询诊断记录表 */
    getDgList(){
      this.get({
        url:'/work/diagnosis/list',
        data: this.queryParams
      }).then((response)=>{
        this.dgList = response.rows;
        this.totalDg = response.total;
      })
    }
  }
}
</script>