<template>
    <div class="h-full flex flex-col screening-second">
        <DocNavBar :title="`${id ? '修改' : '新增'}专病高危筛查`" class="shrink-0" :backFunc="onBack"></DocNavBar>
        <div class="p-4 overflow-y-auto grow" ref="all">
            <archive-common :info='info'
                            v-show='step ==1'
                            ref='baseInfo'
            ></archive-common>
            <DiseaseSelect
                :infoValue='info.diseaseArrays'
                v-show='step == 2'
                ref='diseaseInfo'
            ></DiseaseSelect>
            <form-cont :info='info'
                       :disease-arrays-info='diseaseArraysInfo'
                       v-show='step == 3'
                       ref='formInfo'
            ></form-cont>
            <result :residentInfoId="residentInfoId"
                    v-show='step == 4'
            ></result>
        </div>
        <div class='bottom-small-line'></div>
        <div class='pt-2 pb-2'>
            <div class='px-5  grow flex flex-col justify-end' v-if='step == 1'>
                <van-button type='primary' block round
                            @click='toNext(2)'>下一步
                </van-button>
            </div>

            <div class='px-5  flex align-center justify-around' v-if='step == 2'>
                <van-button type='primary' round plain style='width: 44%'
                            @click='toNext(1)'>上一步
                </van-button>
                <van-button type='primary' round style='width: 44%'
                            @click='toNext(3)'>下一步
                </van-button>
            </div>
            <div class='px-5  flex align-center justify-around' v-if='step == 3'>
                <van-button type='primary' round plain style='width: 44%'
                            @click='toNext(2)'>上一步
                </van-button>
                <van-button type='primary' round style='width: 44%'
                            @click='toNext(4)'>下一步
                </van-button>
            </div>

            <div class='px-5  grow flex flex-col justify-end' v-if='step == 4'>
                <van-button type='primary' block round
                            @click='onsubmit'>提交
                </van-button>
            </div>
        </div>
    </div>
</template>

<script>
import DocNavBar from '@/doctor/components/docNavBar/DocNavBar.vue'
import ArchiveCommon from '@/doctor/components/archiveCommon/archiveCommon'
import { fetchCurrencyById, getChronicResidentsId } from '@/api/doctor/generalFU'
import FormCont from '@/doctor/screening/second/FormCont'
import Result from '@/doctor/screening/second/Result'
import DiseaseSelect from '@/doctor/screening/second/DiseaseSelect'

export default {
    components: {
        DiseaseSelect,
        Result,
        FormCont,
        ArchiveCommon,
        DocNavBar
    },
    data() {
      return {
          step: 1,
          info: {},
          diseaseArraysInfo: []
      }
    },
    computed: {
        id() {
            return this.$route.query.id
        },
        residentInfoId() {
            return this.$route.query.residentInfoId
        }
    },
    created() {
        this.init()
    },
    methods: {
        async init() {
            this.info = {}
            if (this.id) {
                const res = await fetchCurrencyById({ id: this.id })
                let result = res.data || {}
                const { residentsRecord = {} } = result
                const { id, ...others } = residentsRecord
                this.info = {
                    ...others,
                    personId: id,
                    ...result
                }
            } else {
                const res = await getChronicResidentsId(this.residentInfoId)
                const {
                    id,
                    createDate,
                    createDoctorId,
                    createDoctorName,
                    createOfficeId,
                    createOfficeName,
                    createUnitId,
                    createUnitName,
                    updated,
                    ...others
                } = res.data
                this.info = {
                    personId: id,
                    ...others,
                }
            }
        },
        async toNext(val) {
            this.$refs.all.scrollTo(0, 0)
            if (val == 2) {
                 await this.$refs.baseInfo.onSubmit()
            }
            if (val == 3) {
                this.diseaseArraysInfo = await this.$refs.diseaseInfo.onSubmit() || []
            }
            if (val == 4) {
                await this.$refs.formInfo.onSubmit()
            }
            this.step = val
        },
        //提交所有表单
        onsubmit() {

        },

        onBack() {
            if (this.step == 1) {
                this.$router.back()
            } else {
                this.step--
            }
        }
    }
}
</script>

<style lang="less" scoped>

</style>