<!--报卡详情-->
<template>
    <div class='h-full flex flex-col' >
        <div class='p-3 text-black text-center shrink-0 doc-nav-bar'>
            <span @click='onBack' class='text-12 back-bt'>
                <doc-icon type='doc-left2' />
            </span>
            <span>报卡随访详情</span>
        </div>
        <div class='grow cont-box all-content'>
            <div class='pl-3 pr-3 pb-3 h-full cont-inner list-content'>
                <van-collapse :model-value='activeCollapse' ref='collapse' class='doc-collapse' @change='collapseChange'>
                    <van-collapse-item key='1' title='报卡随访详情' name='1'>
                        <template #right-icon>
                            <doc-icon type='doc-down' />
                        </template>
                        <div class='list'>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访时间</span>
                                <span class='text-end'><span>{{ detailInfo.visitDate || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访方式</span>
                                <span class='text-end'><span>{{ detailInfo.visitModeName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访状态</span>
                                <span class='text-end'><span>{{ detailInfo.visitStatusName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item' v-if="detailInfo.visitStatus===4">
                                <span class='shrink-0 mr-2 label'>死亡日期</span>
                                <span class='text-end'><span>{{ detailInfo.deathDate || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item' v-if="detailInfo.visitStatus===4">
                                <span class='shrink-0 mr-2 label'>死因</span>
                                <span class='text-end'><span>{{ detailInfo.deathReason || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item' v-if="detailInfo.visitStatus===5">
                                <span class='shrink-0 mr-2 label'>失访原因</span>
                                <span class='text-end'><span>{{ detailInfo.lossVisitReasonName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item' v-if="detailInfo.visitStatus===1">
                                <span class='shrink-0 mr-2 label'>治疗状态</span>
                                <span class='text-end'><span>{{ detailInfo.treatmentStatusName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访单位</span>
                                <span class='text-end'><span>{{ detailInfo.visitUnitName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访科室</span>
                                <span class='text-end'><span>{{ detailInfo.visitOfficeName || '-'}}</span></span>
                            </div>
                            <div class='flex justify-between py-1 border-bottom item'>
                                <span class='shrink-0 mr-2 label'>随访医生</span>
                                <span class='text-end'><span>{{ detailInfo.visitDoctorName || '-'}}</span></span>
                            </div>
                        </div>
                    </van-collapse-item>
                </van-collapse>
            </div>
        </div>
    </div>
</template>

<script>
import { fetchCurrencyByUuid } from '@/api/doctor/disease'

export default {
    name: 'CrsVisitDetail',
    props: {
        relationUuid: [String, String]
    },
    data() {
        return {
            activeCollapse: ['1'],
            detailInfo: {}
        }
    },
    created() {
        this.load()
    },
    methods: {
         load() {
            if (!this.relationUuid) {
                this.$message.info('未获取到信息')
                return
            }
            let par = {
                relationUuid: this.relationUuid
            }
            fetchCurrencyByUuid(par).then(res => {
                let result = res.data || {}
                this.detailInfo = result
            }).finally(() => {
            })
        },
        // 折叠面板切换
        collapseChange(val) {
            if (val && val.length <= 2) {
                this.activeCollapse = val.slice(val.length - 1)
            } else {
                if (this.activeCollapse.length > val.length) {
                    this.activeCollapse = val
                }
                if (this.activeCollapse.length < val.length) {
                    this.activeCollapse = val.slice(val.length - 1)
                }
            }
        },
        onBack() {
            this.$router.back()
        }
    }
}
</script>

<style scoped lang='less'>
@import url('../../../utils/common.less');
 .all-content {
     padding: 0px 8px 10px 8px;
     background: #F5F5F5;
     .list-content {
         border-radius: 8px 8px 0px 0px;
         background: #FFFFFF;
     }
 }
</style>