<template>
    <div class="h-full flex flex-col diagnose-form">
        <DocNavBar :title="`${id ? '修改' : '新增'}慢病诊断`" class="shrink-0"
            :backFunc="onBack"></DocNavBar>
        <div class="p-4 overflow-y-auto grow" ref="all">
            <DiseaseSelect v-if="step == 1" :excludeType="excludeType" ref="DiseaseSelect"/>
            <archiveCommon :info="baseInfo" v-else-if="step == 2"></archiveCommon>
            <FormCont :diseaseType="innerDiseaseType" v-else-if="step == 3"/>
        </div>
        <div class="shrink-0">
            <div class='bottom-small-line'></div>
            <div class='px-5 py-2 grow flex justify-between'>
                <template v-if='step == 1'>
                    <van-button type='primary' block round
                        @click='toNext'>下一步</van-button>
                </template>
                <template v-else-if="step == 3">
                    <van-button type='primary' block round
                        @click='submit'>提交</van-button>
                </template>
                <template v-else>
                    <van-button type='primary' round plain style='width: 48%'
                        @click='toPrev'>上一步
                    </van-button>
                    <van-button type='primary' round style='width: 48%'
                        @click='toNext'>下一步
                    </van-button>
                </template>
            </div>
        </div>
    </div>
</template>

<script>
import DocNavBar from '@/doctor/components/docNavBar/DocNavBar.vue'
import archiveCommon from '@/doctor/components/archiveCommon/archiveCommon.vue'
import DiseaseSelect from './DiseaseSelect.vue'
import FormCont from './FormCont.vue'
import { getChronicResidentsId } from '@/api/doctor/generalFU'
import { showSuccessToast } from 'vant'

export default {
    components: {
        DocNavBar,
        archiveCommon,
        DiseaseSelect,
        FormCont
    },
    data() {
        return {
            step: 1,
            // 患者基础信息
            baseInfo: {},
            innerDiseaseType: null
        }
    },
    computed: {
        id() {
            return this.$route.query.id
        },
        diseaseType() {
            return this.$route.query.diseaseType
        },
        residentInfoId() {
            return this.$route.query.residentInfoId
        },
        excludeType() {
            const excludeType = this.$route.query.excludeType
            return excludeType && excludeType.split(',').map(e => Number(e))
        }
    },
    created() {
        this.init()
    },
    methods: {
        async init() {
            if (this.id) {

            } else {
                let res = await getChronicResidentsId(this.residentInfoId)
                this.baseInfo = res.data || {}
            }
        },
        submit() {
            showSuccessToast('提交成功')
            setTimeout(() => {
                this.$router.replace({
                    path: '/doctor/workbench'
                })
            }, 600)
        },
        // 上一步
        toPrev() {
            this.onStep(this.step -1)
        },
        async toNext() {
            try {
                if (this.step == 1) {
                    const diseaseType = await this.$refs.DiseaseSelect.submit()
                    console.log(diseaseType)
                    this.innerDiseaseType = diseaseType
                }
            this.onStep(this.step + 1)
            } catch (e) {
                console.warn(e)
            }
        },
        onStep(val) {
            this.$refs.all.scrollTo(0, 0)
            this.step = val
        },
        onBack() {
            if (this.step == 1) {
                this.$router.back()
            } else {
                this.step--
            }
        }
    }
}
</script>

<style lang="less" scoped>

</style>