<template>
  <el-select v-model="currentWard"
             :clearable="wardsClearable"
             style="width: 150px"
             @change="fetchOverviews">
    <el-option v-for="item in allWards"
               :key="item.code"
               :label="item.name"
               :value="item.code"/>
  </el-select>
  <br>
  <xc-checkbox v-model="myPatient" @change="myPatientChange" label="我的病人"/>
  <el-table :data="cptOverviews"
            height="400"
            @row-click="handleClickOverview"
            ref="elTableRef"
            :row-class-name="rowClass"
            class="remove_hover"
            @row-contextmenu="settingUpAThirdLevelDoctor">
    <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>

  <xc-dialog-v2 v-model="thirdLevelDoctorSetting.dialog" width="450px" title="三级医生设置">
    <el-form label-width="80px">
      <el-form-item label="患者：">
        {{ thirdLevelDoctorSetting.data.name }}
      </el-form-item>
      <el-form-item label="管床医生：">
        <select-staff-code v-model="thirdLevelDoctorSetting.data"
                           :name="['referPhysician', 'referPhysicianName']"
                           dept-code/>
      </el-form-item>
      <el-form-item label="主治医生：">
        <select-staff-code v-model="thirdLevelDoctorSetting.data"
                           :name="['consultPhysician', 'consultPhysicianName']"
                           dept-code/>
      </el-form-item>
      <el-form-item label="主任医生：">

        <select-staff-code v-model="thirdLevelDoctorSetting.data"
                           :name="['deptDirector', 'deptDirectorName']" dept-code/>
      </el-form-item>
      <el-form-item label=" ">
        <el-button @click="submitToTheThirdLevelDoctor">提交</el-button>
      </el-form-item>
    </el-form>
  </xc-dialog-v2>
</template>

<script setup name='PatientList'>
import {computed, onMounted, ref} from "vue";
import {getOverView} from "@/api/inpatient/patient";
import {allWardsVisible} from "@/utils/permission";
import XcCheckbox from "@/components/xiao-chan/checkbox/XcCheckbox";
import {cptSex} from "@/utils/computed";
import {getMyPatient, saveTheThirdLevelDoctor} from "@/api/zhu-yuan-yi-sheng/yi-zhu-lu-ru";
import {clickOnThePatient, huanZheXinXi} from "@/views/hospitalization/zhu-yuan-yi-sheng/public-js/zhu-yuan-yi-sheng";
import XcDialogV2 from "@/components/xiao-chan/dialog/XcDialogV2.vue";
import SelectStaffCode from "@/components/SelectStaffCode.vue";
import {getAllWards} from "@/api/zhu-yuan-yi-sheng/resident-doctor";

const myPatient = ref(false)
const wardsClearable = allWardsVisible()
const allWards = ref([])
const currentWard = ref()
const overviews = ref([])

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

const cptOverviews = computed(() => {
  return overviews.value
})

const elTableRef = ref(null)
const handleClickOverview = (row) => {
  clickOnThePatient(row.inpatientNo)
}

const myPatientChange = () => {
  if (myPatient.value) {
    getMyPatient().then((res) => {
      overviews.value = res
      currentWard.value = ''
    });
  } else {
    currentWard.value = allWards.value[0].code
    fetchOverviews()
  }
};

const rowClass = ({row}) => {
  if (huanZheXinXi.value.inpatientNo === row.inpatientNo) {
    return 'el_table__current'
  }
}

const thirdLevelDoctorSetting = $ref({
  dialog: false,
  data: {},
  deptList: []
})

const settingUpAThirdLevelDoctor = (row, column, event) => {
  event.returnValue = false
  thirdLevelDoctorSetting.dialog = true
  thirdLevelDoctorSetting.data = row
}

const submitToTheThirdLevelDoctor = () => {
  saveTheThirdLevelDoctor(thirdLevelDoctorSetting.data).then(() => {
    thirdLevelDoctorSetting.dialog = false
  })
}

onMounted(() => {
  getAllWards().then((res) => {
    if (res.length > 0) {
      allWards.value = res
      currentWard.value = wardsClearable ? '' : res[0].code
      fetchOverviews()
    }
  })
})
</script>

<style scoped lang="scss">

.el_table__current {
  background-color: #a7d3ff;
}

</style>
