<template>
  <div>
    <el-radio-group v-model="headParam.inOutFlag">
      <el-radio :value="0" size="large">在院病人</el-radio>
      <el-radio :value="1" size="large">出院病人</el-radio>
    </el-radio-group>
    <span style="display: inline-block;width: 100px" ></span>
     <el-tag v-if="cashFlag" size="default" effect="dark"   type="danger" ><el-icon><Select /></el-icon>{{cashName}}</el-tag>
  </div>
  <el-descriptions :column="6" border style="width:100%;" >
    <el-descriptions-item label="住院号">
      <el-popover :visible="visible" :width="700" placement="right-end" trigger="click" @show="clearPatientTable">
        <template #reference>
          <el-input v-model="inpatientParam.inpatientNo"   @click="visible = true" style="width: 100px" @keyup.enter="queryChange" />
        </template>
        <div style="width: 670px;">
          <el-input v-model="headParam.inpatientNo" placeholder="支持住院号/姓名/门诊号查询" clearable @keyup.enter="selectPatientPage" style="width: 170px"></el-input>
          &nbsp;&nbsp;
          <el-button icon="Search" type="primary" @click="selectPatientPage">查询</el-button>
          <span style="display: inline-block;width: 350px" ></span>
          <el-button title="关闭" icon="CloseBold"  @click="visible = false"></el-button>
        </div>
        <div style="width: 670px;">
          <el-table :data="patientList" style="width: 100%" @row-click="fetchPatientData"  height="400">
            <el-table-column  property="inpatientNo" label="住院号" />
            <el-table-column  property="name" label="姓名" />
            <el-table-column width="80" property="admissTimes" label="次数" />
            <el-table-column width="150" property="admissDate"  label="入院日期" />
            <el-table-column width="80" property="bedNo" label="床号" />
            <el-table-column  property="wardName" label="病房" />
            <el-table-column property="responceTypeName" label="身份" />
            <el-table-column  property="balance" label="余额" />
            <el-table-column v-if="headParam.inOutFlag ===1 " width="150" property="disDate" label="出院日期" />
          </el-table>
          <el-pagination
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="headParam.currentPage"
              small="small"
              :page-sizes="[15, 30, 45]"
              :page-size="headParam.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="totalSize"
              style="margin-top: 5px;"
          ></el-pagination>
        </div>
      </el-popover>
    </el-descriptions-item>
    <el-descriptions-item label="姓名">
      {{ patientInfo.name }}
    </el-descriptions-item>
    <el-descriptions-item label="出生日期">
      {{ patientInfo.birthDate }} {{ companyFunc(patientInfo.age, '岁') }}
    </el-descriptions-item>
    <el-descriptions-item label="性别">
      {{ patientInfo.sexName }}
    </el-descriptions-item>
    <el-descriptions-item label="入院日期">
      {{ patientInfo.admissDate }}
    </el-descriptions-item>
    <el-descriptions-item label="住院天数">
      {{ companyFunc(patientInfo.actIptDays,'天') }}
    </el-descriptions-item>
    <el-descriptions-item label="管床医生">
      {{ patientInfo.referPhysicianName }}
    </el-descriptions-item>
    <el-descriptions-item label="病区">
      {{ patientInfo.admissWardName }}
    </el-descriptions-item>
    <el-descriptions-item label="小科室">
      {{ patientInfo.zkWardName }}
    </el-descriptions-item>
    <el-descriptions-item label="身份">
     <span style="color: red">{{ patientInfo.medTypeName }} </span>
    </el-descriptions-item>
    <el-descriptions-item label="总费用">
      {{ patientInfo.totalCharge }}
      &nbsp;&nbsp;&nbsp;
      <span v-if="patientInfo.balance && patientInfo.balance < 0 " style="color: red"> {{ patientInfo.balance }}</span>
      <span v-else > {{ patientInfo.balance }}</span>
    </el-descriptions-item>
  </el-descriptions>
</template>
<script setup >
import {ref} from "vue";
import {stringNotBlank} from "@/utils/blank-utils";
import {queryCashFlag,queryPatientInfoPage} from '@/api/zfsf/cashier-process.js'
import {getPatientBaseInfo} from "@/api/medical-advice/medical-advice-management";
const emit = defineEmits(['selectPatientInfo']);

const  cashFlag = ref(false)

const  cashName = ref('已出纳')

const patientInfo = ref({})
const inpatientParam = ref({
  inpatientNo : "",
  admissTimes : null,
  inOutStatusFlag : ""
})

const clearAllData = ()=>{
  cashFlag.value = false
  patientInfo.value = {}
  inpatientParam.value.inpatientNo = ''
  inpatientParam.value.admissTimes = null
  inpatientParam.value.inOutStatusFlag = ''

}


const headParam = ref({
  inpatientNo : "",
  inOutFlag : 0,
  currentPage:1,
  pageSize:15
})
const totalSize = ref(0)

const visible = ref(false)

const clearPatientTable = ()=>{
  patientList.value = []
  headParam.value.inpatientNo = ""
  headParam.value.currentPage = 1
  headParam.value.pageSize = 15
  totalSize.value = 0
}

const selectPatientPage = ()=>{
  queryPatientInfoPage(headParam.value).then(res=>{
      patientList.value = res.data
      totalSize.value = res.total
  })
}

const queryChange = ()=>{
  headParam.value.inpatientNo =  inpatientParam.value.inpatientNo
  selectPatientPage()
}



const fetchPatientData = (row)=>{
     inpatientParam.value.inpatientNo = row.inpatientNo
     inpatientParam.value.admissTimes = row.admissTimes
     if(row.inOutStatusFlag){
       headParam.value.inOutFlag = Number(row.inOutStatusFlag)
       inpatientParam.value.inOutStatusFlag = row.inOutStatusFlag
     }else {
       inpatientParam.value.inOutStatusFlag = headParam.value.inOutFlag === 0 ? "0" : "1"
     }
     visible.value = false
   getPatientBaseInfo(inpatientParam.value).then(res=>{
     patientInfo.value = res
   })
  queryCashFlag(inpatientParam.value).then(res=>{
    cashFlag.value = res.cashFlag === 1
  })

  emit('selectPatientInfo',inpatientParam.value)
}

const showCashName = (val)=>{
  cashFlag.value = true
  cashName.value = val
}

defineExpose({
  fetchPatientData,
  clearAllData,
  showCashName
})

const handleSizeChange = (val) => {
  headParam.value.pageSize = val
  selectPatientPage()
}
const handleCurrentChange = (val) => {
  headParam.value.currentPage = val
  selectPatientPage()
}

const companyFunc = (val, company) => {
  if (stringNotBlank(val)) {
    return val + company
  } else {
    return ''
  }
}

const patientList = ref([])

</script>
<style scoped >
.el-checkbox__input.is-disabled + .el-checkbox__label {
  color: red !important;
}
</style>