项目展示
<el-steps :active="active" finish-status="success" simple style="margin-top: 20px">
<el-step title="1.开通基础信息"></el-step>
<el-step title="2.开通内容"></el-step>
<el-step title="3.开通产品信息"></el-step>
<el-step title="4.生成订单信息"></el-step>
</el-steps>
<div v-show="active == 1"></div>
<div v-show="active == 2"></div>
<div v-show="active == 3"></div>
<div v-show="active == 4"></div>
<div class="btns">
<el-button size="mini" @click="closeDialog" v-if="active == 1">取消</el-button>
<el-button v-if="active == 2 || 3" type="primary" @click="pre" size="mini">上一步</el-button>
<el-button v-if="active < 3" type="primary" @click="next" size="mini">下一步</el-button>
<el-button v-if="active == 3" type="primary" v-loading.fullscreen.lock="fullscreenLoading":element-loading-text="loadText" @click="confirmOpen" size="mini">确认开通</el-button>
</div>
data() {
active: 1
}
methods: {
next() {
if (this.active++ > 3) this.active = 1
},
pre() {
if (this.active-- < 2) this.active = 1
},
}