From 4de1dd139b44e0c4c60b6ceeead23cacf775a923 Mon Sep 17 00:00:00 2001
From: king <18310653075@163.com>
Date: 星期三, 03 八月 2022 15:22:26 +0800
Subject: [PATCH] 2022-08-03
---
src/views/signup/mobsignup.vue | 60 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 57 insertions(+), 3 deletions(-)
diff --git a/src/views/signup/mobsignup.vue b/src/views/signup/mobsignup.vue
index 655f97b..d1579c0 100644
--- a/src/views/signup/mobsignup.vue
+++ b/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;
--
Gitblit v1.8.0