mirror of
https://github.com/kerwincui/FastBee.git
synced 2025-10-14 04:13:55 +08:00
注册和登录页面修改
This commit is contained in:
kerwincui
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="login">
|
||||
<div class="login">
|
||||
|
||||
<div style="width:520px;padding:20px;">
|
||||
<el-row :gutter="10">
|
||||
@@ -18,60 +18,52 @@
|
||||
</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input v-model="loginForm.username" type="text" auto-complete="off" placeholder="账号">
|
||||
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon"/>
|
||||
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码"
|
||||
@keyup.enter.native="handleLogin">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon"/>
|
||||
<el-input v-model="loginForm.password" type="password" auto-complete="off" placeholder="密码" @keyup.enter.native="handleLogin">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="code" v-if="captchaOnOff">
|
||||
<el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
|
||||
@keyup.enter.native="handleLogin">
|
||||
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon"/>
|
||||
<el-input v-model="loginForm.code" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter.native="handleLogin">
|
||||
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
<div class="login-code">
|
||||
<img :src="codeUrl" @click="getCode" class="login-code-img"/>
|
||||
<img :src="codeUrl" @click="getCode" class="login-code-img" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;color:#000;">记住密码</el-checkbox>
|
||||
<el-form-item style="width:100%;">
|
||||
<el-button v-if="!bindAccount" :loading="loading" size="medium" type="primary" style="width:100%;"
|
||||
@click.native.prevent="handleLogin">
|
||||
<el-button v-if="!bindAccount" :loading="loading" size="medium" type="primary" style="width:100%;" @click.native.prevent="handleLogin">
|
||||
<span v-if="!loading">登 录</span>
|
||||
<span v-else>登 录 中...</span>
|
||||
</el-button>
|
||||
<el-button v-else :loading="loading" size="medium" type="primary" style="width:100%;"
|
||||
@click.native.prevent="handleLogin">
|
||||
<el-button v-else :loading="loading" size="medium" type="primary" style="width:100%;" @click.native.prevent="handleLogin">
|
||||
<span v-if="!loading">绑定</span>
|
||||
<span v-else>绑 定 中...</span>
|
||||
</el-button>
|
||||
<div style="margin-top:20px;" v-if="!bindAccount">
|
||||
<div v-if="!bindAccount" style=";text-align: center ">
|
||||
|
||||
<div style="margin-top:30px;" v-if="!bindAccount">
|
||||
<div v-if="!bindAccount" style="float:left;">
|
||||
<span style="color:#fff;margin-right:10px;">第三方登录</span>
|
||||
<el-button type="success" circle title="微信登录" size="small" @click="authLogin">
|
||||
<svg-icon icon-class="wechat"/>
|
||||
<svg-icon icon-class="wechat" />
|
||||
</el-button>
|
||||
|
||||
<el-button type="danger" circle title="QQ登录" size="small" @click="qqLogin">
|
||||
<svg-icon icon-class="qq"/>
|
||||
<svg-icon icon-class="qq" />
|
||||
</el-button>
|
||||
<el-button type="primary" circle title="支付宝登录" size="small" @click="authLogin">
|
||||
<svg-icon icon-class="zhifubao"/>
|
||||
<svg-icon icon-class="zhifubao" />
|
||||
</el-button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<a style="margin-right:20px;color:#222" target="_blank" href="http://wumei.live">返回官网</a>
|
||||
|
||||
<div style="float: right;margin-top:10px;" v-if="register">
|
||||
|
||||
<router-link style="color:#fff;font-size:16px;" :to='{path:"/register",query: this.$route.query }'>立即注册
|
||||
>>
|
||||
<div style="float:right;" v-if="register">
|
||||
<router-link style="color:#333;font-size:16px;" :to='{path:"/register",query: this.$route.query }'>立即注册>>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
@@ -79,10 +71,9 @@
|
||||
</div>
|
||||
<!-- 底部 -->
|
||||
<div class="el-login-footer">
|
||||
<span>Copyright © 2018-2021 <a target="_blank"
|
||||
href="http://wumei.live">wumei smart</a> All Rights Reserved.</span>
|
||||
</div>
|
||||
<span>Copyright © 2018-2021 <a target="_blank" href="http://wumei.live">wumei smart</a> All Rights Reserved.</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -155,7 +146,6 @@ export default {
|
||||
this.redirectLogin(loginId);
|
||||
}
|
||||
|
||||
|
||||
},
|
||||
methods: {
|
||||
redirectLogin(loginId) {
|
||||
@@ -163,8 +153,7 @@ export default {
|
||||
this.$store.dispatch("RedirectLogin", loginId).then(() => {
|
||||
this.$router.push({
|
||||
path: this.redirect || "/"
|
||||
}).catch(() => {
|
||||
});
|
||||
}).catch(() => {});
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
if (this.captchaOnOff) {
|
||||
@@ -198,8 +187,7 @@ export default {
|
||||
checkErrorMsg() {
|
||||
let errorId = this.$route.query.errorId;
|
||||
if (errorId !== undefined && errorId !== null) {
|
||||
getErrorMsg(errorId).then(res => {
|
||||
}).catch(err => {
|
||||
getErrorMsg(errorId).then(res => {}).catch(err => {
|
||||
this.$router.push({
|
||||
query: {}
|
||||
})
|
||||
@@ -262,8 +250,7 @@ export default {
|
||||
this.$store.dispatch("Login", this.loginForm).then(() => {
|
||||
this.$router.push({
|
||||
path: this.redirect || "/"
|
||||
}).catch(() => {
|
||||
});
|
||||
}).catch(() => {});
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
if (this.captchaOnOff) {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="register">
|
||||
<div class="register">
|
||||
|
||||
<div style="width:520px;padding:20px;">
|
||||
<el-row :gutter="10">
|
||||
@@ -10,78 +10,61 @@
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
|
||||
<el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form"
|
||||
style="z-index:1000">
|
||||
<el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form" style="z-index:1000">
|
||||
<h3 class="title" v-if="!bindAccount">注册账号</h3>
|
||||
<h3 class="title" v-else>注册绑定物美智能账户</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input v-model="registerForm.username" type="text" auto-complete="off" placeholder="账号">
|
||||
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon"/>
|
||||
<svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="phonenumber">
|
||||
<el-input v-model="registerForm.phonenumber" type="text" auto-complete="off" placeholder="手机号码">
|
||||
<svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon"/>
|
||||
<svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input v-model="registerForm.password" type="password" auto-complete="off" placeholder="密码"
|
||||
@keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon"/>
|
||||
<el-input v-model="registerForm.password" type="password" auto-complete="off" placeholder="密码" @keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="confirmPassword">
|
||||
<el-input v-model="registerForm.confirmPassword" type="password" auto-complete="off" placeholder="确认密码"
|
||||
@keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon"/>
|
||||
<el-input v-model="registerForm.confirmPassword" type="password" auto-complete="off" placeholder="确认密码" @keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="code" v-if="captchaOnOff">
|
||||
<el-input v-model="registerForm.code" auto-complete="off" placeholder="验证码" style="width: 63%"
|
||||
@keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon"/>
|
||||
<el-input v-model="registerForm.code" auto-complete="off" placeholder="验证码" style="width: 63%" @keyup.enter.native="handleRegister">
|
||||
<svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
|
||||
</el-input>
|
||||
<div class="register-code">
|
||||
<img :src="codeUrl" @click="getCode" class="register-code-img"/>
|
||||
<img :src="codeUrl" @click="getCode" class="register-code-img" />
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item style="width:100%;">
|
||||
<el-button v-if="!bindAccount" :loading="loading" size="medium" type="primary" style="width:100%;"
|
||||
@click.native.prevent="handleRegister">
|
||||
<el-button v-if="!bindAccount" :loading="loading" size="medium" type="primary" style="width:100%;" @click.native.prevent="handleRegister">
|
||||
<span v-if="!loading">注 册</span>
|
||||
<span v-else>注 册 中...</span>
|
||||
</el-button>
|
||||
<el-button v-else :loading="loading" size="medium" type="primary" style="width:100%;"
|
||||
@click.native.prevent="handleRegister">
|
||||
<el-button v-else :loading="loading" size="medium" type="primary" style="width:100%;" @click.native.prevent="handleRegister">
|
||||
<span v-if="!loading">绑 定</span>
|
||||
<span v-else>绑 定 中...</span>
|
||||
</el-button>
|
||||
<div style="margin-top:20px;">
|
||||
|
||||
<div v-if="!bindAccount" style=" margin-bottom: 10px;text-align: center ">
|
||||
<!-- <span style="color:#fff;margin-right:10px; float: left">快速登录</span>-->
|
||||
|
||||
<div style="margin-top:30px;">
|
||||
<div v-if="!bindAccount" style=" margin-bottom: 10px;text-align: center ;float:left;">
|
||||
<span style="color:#fff;margin-right:10px;">第三方登录</span>
|
||||
<el-button type="success" circle title="微信登录" size="small" @click="authLogin">
|
||||
<svg-icon icon-class="wechat"/>
|
||||
<svg-icon icon-class="wechat" />
|
||||
</el-button>
|
||||
|
||||
<el-button type="danger" circle title="QQ登录" size="small" @click="qqLogin">
|
||||
<svg-icon icon-class="qq"/>
|
||||
<svg-icon icon-class="qq" />
|
||||
</el-button>
|
||||
<el-button type="primary" circle title="支付宝登录" size="small" @click="authLogin">
|
||||
<svg-icon icon-class="zhifubao"/>
|
||||
<svg-icon icon-class="zhifubao" />
|
||||
</el-button>
|
||||
|
||||
|
||||
</div>
|
||||
<router-link style="float:left;color:#fff;font-size:16px;"
|
||||
:to='{path:"/login",query: this.$route.query }'>使用已有账户登录 >>
|
||||
<router-link style="float:right;color:#333;font-size:16px;" :to='{path:"/login",query: this.$route.query }'>已有账户登录 >>
|
||||
</router-link>
|
||||
|
||||
<div style="float: right">
|
||||
<a style="margin-right:20px;" target="_blank" href="http://wumei.live">返回官网</a>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
@@ -91,15 +74,16 @@
|
||||
</div>
|
||||
<!-- 底部 -->
|
||||
<div class="el-register-footer">
|
||||
<span>Copyright © 2018-2021 <a target="_blank"
|
||||
href="http://wumei.live">wumei smart</a> All Rights Reserved.</span>
|
||||
</div>
|
||||
<span>Copyright © 2018-2021 <a target="_blank" href="http://wumei.live">wumei smart</a> All Rights Reserved.</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getCodeImg, checkBindId, bindRegister
|
||||
getCodeImg,
|
||||
checkBindId,
|
||||
bindRegister
|
||||
} from "@/api/login";
|
||||
import {
|
||||
register
|
||||
@@ -269,8 +253,7 @@ export default {
|
||||
type: 'success'
|
||||
}).then(() => {
|
||||
this.$router.push("/login");
|
||||
}).catch(() => {
|
||||
});
|
||||
}).catch(() => {});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user