<template>
  <page-layer>
    <template #main>
      <el-table :data="patients.slice((currentPage - 1) * pageSize, currentPage * pageSize)" stripe highlight-current-row :height="tableHeight" size="middle">
        <el-table-column fixed prop="fzNo" label="分诊号" sortable></el-table-column>
        <el-table-column fixed prop="name" label="姓名"></el-table-column>
        <el-table-column prop="patientId" label="id号"></el-table-column>
        <el-table-column prop="deptName" label="科室"></el-table-column>
        <el-table-column prop="roomName" label="诊室"></el-table-column>
        <el-table-column prop="doctorName" label="医生"></el-table-column>
        <el-table-column prop="serialNo" label="流水号" sortable></el-table-column>
        <el-table-column label="状态">
          <template #default="scope">
            {{ statusFlagFilter(scope.row.statusFlag) }}
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作">
          <template #default="scope">
            <el-button type="primary" @click="beforeCancelTriage(scope.row)">取消分诊</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[15, 30, 45, 70, 100]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="patients.length"
          style="margin-top: 5px"
      ></el-pagination>
    </template>
  </page-layer>
</template>

<script>
import { ref } from '@vue/reactivity'
import store from '@/store'
import { cancelTriage, getTriagedPatients } from '@/api/triage/triage'
import { onActivated } from 'vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import PageLayer from "@/layout/PageLayer";
export default {
  components: {PageLayer},
  setup() {
    const windowSize = store.state.app.windowSize
    const tableHeight = windowSize.h - 10
    const patients = ref([])

    const pageSize = ref(30)
    const currentPage = ref(1)
    const handleSizeChange = (val) => {
      pageSize.value = val
    }
    const handleCurrentChange = (val) => {
      currentPage.value = val
    }

    const fetchTriagedPatients = () => {
      getTriagedPatients().then((res) => {
        patients.value = res
      })
    }

    const beforeCancelTriage = (row) => {
      ElMessageBox.confirm('确定重置此患者的分诊信息为空么？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          cancelTriage(row.serialNo).then(() => {
            ElMessage({
              message: '操作成功',
              type: 'success',
              duration: 2000,
              showClose: true,
            })
          })
        })
        .catch(() => {})
    }

    onActivated(() => {
      fetchTriagedPatients()
    })

    return {
      tableHeight,
      statusFlagFilter,
      roomStatusFilter,
      patients,
      pageSize,
      currentPage,
      handleSizeChange,
      handleCurrentChange,
      beforeCancelTriage,
    }
  },
}

function statusFlagFilter(val) {
  switch (val) {
    case '0':
      return '初值'
    case '1':
      return '报到'
    case '2':
      return '可通知'
    case '3':
      return '已通知'
    case '4':
      return '检查'
    case '8':
      return '就诊中'
    case '9':
      return '已就诊'
  }
}
function roomStatusFilter(val) {
  return val === 0 ? '在线' : '离线'
}
</script>
