<template>
    <page-layer>
        <template #header>
            <xc-date-picker v-model="queryParam.applicationTime"/>
            <el-select v-model="queryParam.flag">
                <el-option label="全部" :value="-1"/>
                <el-option label="待审核" :value="0"/>
                <el-option label="通过" :value="1"/>
                <el-option label="不通过" :value="2"/>
            </el-select>
            <el-button icon="Search" @click="queryData()" type="primary">查询</el-button>
            <el-button icon="Download" @click="download" type="primary">导出</el-button>
        </template>

        <template #main>
            <xc-table :data="queryParam" @current-change="currentPage" :final-height="getWindowSize.h / 1.1"
                      open-paging>
                <el-table-column label="住院号" prop="patNo" width="90"/>
                <el-table-column label="次数" prop="times" width="90"/>
                <el-table-column label="申请人" prop="applicantName" width="90"/>
                <el-table-column label="申请时间" prop="applicationTime" width="130"/>
                <el-table-column label="申请权限" prop="unlockJson" width="130"/>
                <el-table-column label="申请编辑" prop="effectiveTime" width="130"/>
                <el-table-column label="申请备注" prop="requestRemarks" width="450"
                                 show-overflow-tooltip
                                 show-tooltip-when-overflow/>
                <el-table-column label="状态" prop="state" width="100">
                    <template #default="{row}">
                        <component :is="stateHtml(row.state)"/>
                    </template>
                </el-table-column>
                <el-table-column label="审核人" prop="approveName" width="90"/>
                <el-table-column label="审核时间" prop="reviewTime" width="130"/>
                <el-table-column label="审核备注" prop="reviewNotes" width="130"/>

                <el-table-column label="操作" width="120" fixed="right">
                    <template #default="{row}">
                        <el-button @click="approved(row)">通过</el-button>
                        <el-button @click="refuseToPass(row)">拒绝</el-button>
                    </template>
                </el-table-column>
            </xc-table>
        </template>

    </page-layer>

</template>

<script setup name='EmrRelieveRule'>
import PageLayer from "@/layout/PageLayer.vue";
import XcDatePicker from "@/components/xiao-chan/date-picker/XcDatePicker.vue";
import {
    getApplicationData,
    reviewMedicalRecordsToUnlock
} from "@/api/zhu-yuan-yi-sheng/emr-control-rule";
import XcTable from "@/components/xiao-chan/xc-table/XcTable.vue";
import {getWindowSize} from "@/utils/window-size";
import {ElMessageBox, ElTag} from "element-plus";
import {clone} from "@/utils/clone";
import {downloadExcel} from "@/utils/excel";

const queryParam = ref({
    applicationTime: '',
    flag: 0,

    currentPage: 1,
    pageSize: 30,
    total: 0,
    data: []
})

const queryData = (total = 0) => {
    queryParam.value.total = total
    console.log(queryParam.value)
    getApplicationData(queryParam.value).then(res => {
        queryParam.value.data = res.records
    })
}

const currentPage = (val) => {
    queryParam.value.currentPage = val
    queryData(queryParam.value.total)
}

const download = () => {
    const tempData = {
        param: queryParam.value,
        url: '/emrControlRule/exportExcelUnlock',
        fileName: '质控解锁导出',
    }
    setTimeout(() => {
        downloadExcel(tempData)
    })
}

const approved = (row) => {
    toExamine(row, 1)
}

const refuseToPass = (row) => {
    ElMessageBox.prompt('审核备注', '提示', {
        inputPattern: /\S/,
        inputErrorMessage: '审核备注不能为空',
    }).then(({value}) => {
        toExamine(row, 2, value)
    })
}

const toExamine = (data, state, reviewNotes = '审核通过') => {
    let temp = clone(data)
    temp.state = state
    temp.reviewNotes = reviewNotes
    reviewMedicalRecordsToUnlock(temp).then(() => {
        queryData()
    })
}


onMounted(() => {
    queryData()
})

const stateHtml = (val) => {
    switch (val) {
        case 0:
            return h(ElTag, {
                    type: 'info'
                },
                {default: () => '待审核'})
        case 1:
            return h(ElTag, {
                    type: 'success'
                },
                {default: () => '审核通过'})
        case 2:
            return h(ElTag, {
                    type: 'danger'
                },
                {default: () => '审核拒绝'})
        case 3:
            return h(ElTag, {
                    type: 'warning'
                },
                {default: () => '申请替换'})
    }
}

</script>

<style scoped lang="scss">

</style>
