<template>
    <page-layer>
        <template #header>
            <el-select v-model="fncode" style="width: 135px">
                <el-option label="科室信息查询" value="5101"></el-option>
                <el-option label="医执人员信息查询" value="5102"></el-option>
            </el-select>&nbsp;&nbsp;
            <span v-show="fncode === '5102'">
                <el-select v-model="staffParams.pracPsnType" style="width: 135px">
                    <el-option label="医师" value="1"></el-option>
                    <el-option label="护士" value="2"></el-option>
                    <el-option label="药师" value="3"></el-option>
                    <el-option label="医技人员" value="4"></el-option>
                </el-select>&nbsp;&nbsp;
                <el-select v-model="staffParams.psnCertType" placeholder="证件类型" clearable style="width: 165px">
                    <el-option v-for="item in allPsnCertTypes" :label="item.name" :value="item.code"></el-option>
                </el-select>&nbsp;&nbsp;
                <el-input v-model="staffParams.certno" placeholder="证件号码" clearable style="width: 170px"></el-input>
            </span>
            <el-divider direction="vertical"></el-divider>
            <el-button type="primary" icon="Search" @click="handleClickSearch">查询</el-button>
        </template>
        <template #main>
            <div v-if="fncode === '5101'">
                <el-table :data="deptList" stripe highlight-current-row :height="tableHeight + 30">
                    <el-table-column prop="hosp_dept_codg" label="医院科室编码"></el-table-column>
                    <el-table-column prop="hosp_dept_name" label="医院科室名称"></el-table-column>
                    <el-table-column prop="begntime" label="开始时间"></el-table-column>
                    <el-table-column prop="endtime" label="结束时间"></el-table-column>
                    <el-table-column prop="itro" label="简介"></el-table-column>
                    <el-table-column prop="dept_resper_name" label="科室负责人姓名"></el-table-column>
                    <el-table-column prop="dept_resper_tel" label="科室负责人电话"></el-table-column>
                    <el-table-column prop="dept_med_serv_scp" label="科室医疗服务范围"></el-table-column>
                    <el-table-column prop="caty" label="科别"></el-table-column>
                    <el-table-column prop="dept_estbdat" label="科室成立日期"></el-table-column>
                    <el-table-column prop="aprv_bed_cnt" label="批准床位数量"></el-table-column>
                    <el-table-column prop="hi_crtf_bed_cnt" label="医保认可床位数"></el-table-column>
                    <el-table-column prop="poolarea_no" label="统筹区编号"></el-table-column>
                    <el-table-column prop="dr_psncnt" label="医师人数"></el-table-column>
                    <el-table-column prop="phar_psncnt" label="药师人数"></el-table-column>
                    <el-table-column prop="nurs_psncnt" label="护士人数"></el-table-column>
                    <el-table-column prop="tecn_psncnt" label="技师人数"></el-table-column>
                    <el-table-column prop="memo" label="备注"></el-table-column>
                </el-table>
            </div>
            <div v-else>
                <el-table :data="staffList.slice((currentStaffPage - 1) * staffPageSize, currentStaffPage * staffPageSize)"
                          stripe highlight-current-row :height="tableHeight">
                    <el-table-column label="人员证件类型">
                        <template #default="scope">
                            {{filterPsnCertType(scope.row.psn_cert_type)}}
                        </template>
                    </el-table-column>
                    <el-table-column prop="certno" label="人员证件号码"></el-table-column>
                    <!--                <el-table-column prop="prac_psn_no" label="执业人员自编号"></el-table-column>-->
                    <el-table-column prop="prac_psn_code" label="执业人员代码"></el-table-column>
                    <el-table-column prop="prac_psn_name" label="人员姓名" width="100"></el-table-column>
                    <el-table-column label="人员分类" width="100">
                        <template #default="scope">
                            {{filterPracPsnTypeName(scope.row.prac_psn_type)}}
                        </template>
                    </el-table-column>
                    <!--                <el-table-column prop="prac_psn_cert" label="资格证书编码"></el-table-column>-->
                    <el-table-column prop="prac_cert_no" label="执业证书编号"></el-table-column>
                    <el-table-column label="医保医师" width="70">
                        <template #default="scope">
                            {{filterHiDrFlag(scope.row.hi_dr_flag)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="开始时间">
                        <template #default="scope">
                            {{formatDateValue(scope.row.begntime)}}
                        </template>
                    </el-table-column>
                    <el-table-column label="结束时间">
                        <template #default="scope">
                            {{formatDateValue(scope.row.endtime)}}
                        </template>
                    </el-table-column>
                    <el-table-column prop="chg_rea" label="变更原因"></el-table-column>
                </el-table>
                <el-pagination
                    :current-page="currentStaffPage"
                    :page-size="staffPageSize"
                    :total="staffList.length"
                    layout="total,prev, pager, next"
                    @current-change="handleCurrentStaffPageChange"
                ></el-pagination>
            </div>
        </template>
    </page-layer>
</template>
<script setup>
import PageLayer from "@/layout/PageLayer.vue";
import {fetchPsnCertTypeDictionary} from '@/api/dictionary/fetch-dictionaries.js'
import {queryDeptInfo, queryMedStaffInfo} from '@/api/medical-insurance/si-manage.js'
import {useStore} from "vuex";

const store = useStore()
const tableHeight = store.state.app.windowSize.h - 50

const fncode = ref('5101')
const allPsnCertTypes = ref([])
const staffParams = reactive({
    pracPsnType: '1',
    psnCertType: '',
    certno: ''
})

const handleClickSearch = () => {
    fncode.value === '5101' ? fetchDeptInfo() : fetchStaffInfo()
}

const deptList = ref([])
const fetchDeptInfo = () => {
    queryDeptInfo().then(res => {
        deptList.value = res
    })
}

const staffList = ref([])
const currentStaffPage = ref(1)
const staffPageSize = 20
const handleCurrentStaffPageChange = (val) => {
    currentStaffPage.value = val
}
const fetchStaffInfo = () => {
    queryMedStaffInfo(staffParams).then(res => {
        staffList.value = res
    }).catch(() => {
        staffList.value = []
    })
}

const filterPsnCertType = (val) => {
    for (let i = 0; i < allPsnCertTypes.value.length; i++) {
        const certType = allPsnCertTypes.value[i]
        if (val === certType.code) {
            return certType.name
        }
    }
    return ''
}

const filterPracPsnTypeName = (val) => {
    switch (val) {
        case '1':
            return '医师'
        case '2':
            return '护士'
        case '3':
            return '药师'
        default:
            return '医技人员'
    }
}

const filterHiDrFlag = (val) => {
    return val === '1' ? '是' : '否'
}

const formatDateValue = (val) => {
    if (!val) {
        return ''
    }
    const date = new Date(val);
    const year = date.getFullYear()
    const month = date.getMonth() + 1
    const day = date.getDate()
    return year + '-' + ('0' + month).slice(-2) + '-' + ('0' + day).slice(-2)
}

onMounted(() => {
    fetchPsnCertTypeDictionary().then(res => {
        allPsnCertTypes.value = res
    })
})

</script>