<template> <div> <van-nav-bar :title="routeQuery.id ? '修改专病随访' : '新增专病随访'" left-arrow @click-left="toBack"> </van-nav-bar> <div class="p-4 h-overflow"> <BaseInfo v-if="step === 1" ref="baseInfo"></BaseInfo> <FormCont v-if="step === 2" ref="formCont"></FormCont> </div> <div class="bottom-small-line"></div> <div class="p-4"> <van-button v-if="step === 1" type="primary" block round @click="toNext">下一步</van-button> <van-button v-if="step === 2" type="primary" block round @click="onSubmit">提交</van-button> </div> </div> </template> <script> import BaseInfo from './BaseInfo.vue' import FormCont from './FormCont.vue' export default { components: { BaseInfo, FormCont }, data() { return { step: 1 } }, computed: { routeQuery() { return this.$route.query } }, created() { }, methods: { toBack() { if (this.step === 1) { this.$router.back() } else { this.step = 1 } }, async toNext() { // this.$refs.baseInfo.onSubmit() // console.log(666, obj) this.step = 2 }, onSubmit() { this.$refs.formCont.submit() } } } </script> <style lang="less" scoped> .h-overflow { height: calc(100vh - 124px); overflow: auto; } .bottom-small-line { height: 1px; box-shadow: 0 0.5Px #D7DADE; } </style>