web_dist/src/components/zhu-yuan-yi-sheng/emr/EmrPatientList.vue

<template>
  <transition name="el-zoom-in-center">
    <div class="drawer" ref="drawer" v-show="props.modelValue">
      <div class="header">
        <div>
          <el-select-v2 v-model="currentWard" :options="allWards" @change="fetchOverviews"/>
        </div>
        <div @click="close" class="icon">
          <el-icon>
            <CloseBold/>
          </el-icon>
        </div>
      </div>
      <el-table :data="overviews"
                :height="400"
                highlight-current-row
                @row-click="rowClick">
        <el-table-column label="床" prop="bedNo" width="30"/>
        <el-table-column label="姓名" width="70" prop="name">
          <template #default="{row}">
        <span>
          {{ row.name }}
        </span>
            <span v-if="row.orderNoCount > 0" style="color: red">
              {{ row.orderNoCount }}
          </span>
          </template>
        </el-table-column>
        <el-table-column label="住院号" prop="inpatientNo" width="65">
          <template #default="{row}">
            <div :style="{color: row.dismissOrder ===1 ? 'red' : '#19e63c'}">
              {{ row.inpatientNo }}
            </div>
          </template>
        </el-table-column>
        <el-table-column label="性别" prop="sex" width="65">
          <template #default="scope">
            {{ cptSex(scope.row.sex) }}
          </template>
        </el-table-column>
      </el-table>
    </div>
  </transition>
</template>

<script setup name='EmrPatientList'>

import {getOverView} from "@/api/inpatient/patient";
import {ref} from "vue";
import {getEmrAllWardsApi} from "@/api/zhu-yuan-yi-sheng/emr-patient";
import {cptSex} from "@/utils/computed";

const props = defineProps({
  modelValue: {
    type: Boolean
  }
})

const emit = defineEmits(['rowClick', 'update:modelValue'])

const allWards = ref([])
const currentWard = ref()
const overviews = ref([])

const fetchOverviews = () => {
  getOverView(currentWard.value).then((res) => {
    overviews.value = res
  })
}

const rowClick = (val) => {
  emit('rowClick', val)
}

const close = () => {
  emit('update:modelValue', false)
}

const drawer = ref()
onMounted(() => {
  nextTick(() => {
    const body = document.querySelector("body");
    if (body.append) {
      body.append(drawer.value);
    } else {
      body.appendChild(drawer.value);
    }
  })

  getEmrAllWardsApi().then(res => {
    allWards.value = res
  })

})

</script>

<style scoped lang="scss">
.drawer {
  width: 18vw;
  height: 100vh;
  border: 1px solid;
  position: fixed;
  top: 0;
  background-color: white;
  left: 0;
  z-index: 9;
}

.header {
  top: 5px;
  display: flex;
  justify-content: space-between;

  .icon {
    cursor: pointer;
    margin-right: 5px;
    display: flex;
    align-items: center;
  }
}

</style>