2022-08-03

king

2022-08-03 4de1dd139b44e0c4c60b6ceeead23cacf775a923

2022-08-03

 src/views/signup/mobsignup.vue

@@ -1,5 +1,15 @@
<template>
    <div class="sign-mob-form-wrap">
        <div v-if="step ==='memberType'" class="member-wrap">
            <div class="member-item personal" @click="changeType('personal')">
                <div class="title">个人版</div>
                <div class="content">限时注册，终身免费使用</div>
            </div>
            <div class="member-item enterprise" @click="changeType('enterprise')">
                <div class="title">企业版</div>
                <div class="content">更多的业务模板，更好的企业服务</div>
            </div>
        </div>
        <div v-if="step ==='signtype'">
            <header>
                <p class="title">明科账号</p>
@@ -9,6 +19,12 @@
            <div class="sign-type">
                <el-button type="danger" @click="step = 'phone';signtype = 'phone'">使用手机号</el-button>
                <el-button plain @click="step = 'email';signtype = 'email'">使用邮箱地址</el-button>
            </div>
            <div class="step-control-wrap">
                <div class="step-control">
                    <el-button size="small" icon="el-icon-arrow-left" @click="prevStep()">上一步</el-button>
                    <el-button size="small" :disabled="nextDisabled" @click="nextStep()">下一步<i class="el-icon-arrow-right el-icon--right"></i></el-button>
                </div>
            </div>
        </div>
        <div v-if="step ==='phone'">
@@ -125,7 +141,7 @@
    export default {
        data() {
            return {
                step: 'signtype',
                step: 'memberType',
                calendarShow: false,
                signtype: '',
                phoneNo: '',
@@ -140,7 +156,8 @@
                confirmPassword: '',
                subdisabled: true,
                pass: false,
                subloading: false
                subloading: false,
                member_type: ''
            }
        },
        methods: {
@@ -153,8 +170,15 @@
                    this.subdisabled = false
                }
            },
            changeType(type) {
                this.member_type = type
                this.step = 'signtype'
                this.nextDisabled = true
            },
            prevStep () {
                if (this.step === 'phone' || this.step === 'email') {
                if (this.step === 'signtype') {
                    this.step = 'memberType'
                } else if (this.step === 'phone' || this.step === 'email') {
                    this.step = 'signtype'
                    this.pass = false
                    this.phoneNo = ''
@@ -412,6 +436,7 @@
                    pwd: this.password,
                    birthday: this.birthday,
                    Type_reg: this.signtype !== 'email' ? 'mob' : 'email',
                    member_type: this.member_type,
                    timestamp: Utils.getCurrentTime()
                }

@@ -449,6 +474,35 @@
</script>

<style lang="less" scoped>
.member-wrap {
        text-align: center;
        padding-top: 20vh;
        .member-item {
            display: inline-block;
            width: 270px;
            border-radius: 4px;
            padding: 40px 0px;
            cursor: pointer;
            height: 200px;
            vertical-align: top;
            color: #ffffff;
        }

        .title {
            font-size: 24px;
            font-weight: bold;
            margin-bottom: 30px;
        }
        .personal {
            background: #1890ff;
            box-shadow: 0 0 4px #1890ff;
        }
        .enterprise {
            margin-top: 40px;
            background: #fa8c16;
            box-shadow: 0 0 4px #fa8c16;
        }
    }
    .sign-mob-form-wrap {
        position: relative;
        width: 100vw;