登录页面优化
parent
9c2b5a8851
commit
8f434ced78
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="login">
|
||||
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
|
||||
<h3 class="title">智能车联后台管理系统</h3>
|
||||
<h3 class="title">企业管理平台</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input
|
||||
v-model="loginForm.username"
|
||||
|
@ -50,43 +50,8 @@
|
|||
<span v-else>登 录 中...</span>
|
||||
</el-button>
|
||||
<div v-if="register" style="float: right;">
|
||||
<router-link :to="'/register'" class="link-type">立即注册</router-link>
|
||||
<router-link :to="'/register'" class="link-type">企业注册</router-link>
|
||||
</div>
|
||||
<br><br>
|
||||
<el-button type="primary" @click="toReg" style="width: 100%">立即注册</el-button>
|
||||
<el-dialog
|
||||
title="提示"
|
||||
:visible.sync="dialogVisible"
|
||||
width="30%"
|
||||
>
|
||||
<el-radio-group v-model="labelPosition" size="small">
|
||||
<el-radio-button label="left">左对齐</el-radio-button>
|
||||
<el-radio-button label="right">右对齐</el-radio-button>
|
||||
<el-radio-button label="top">顶部对齐</el-radio-button>
|
||||
</el-radio-group>
|
||||
<div style="margin: 20px;"></div>
|
||||
<el-form :label-position="labelPosition" label-width="80px" :model="firm">
|
||||
<el-form-item label="用户名">
|
||||
<el-input v-model="firm.username"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码">
|
||||
<el-input v-model="firm.password"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="公司名">
|
||||
<el-input v-model="firm.firmName"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮件地址">
|
||||
<el-input v-model="firm.email"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model="firm.phoneNumber"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="doReg">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<!-- 底部 -->
|
||||
|
@ -97,7 +62,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import {getCodeImg, register} from "@/api/login";
|
||||
import {getCodeImg} from "@/api/login";
|
||||
import Cookies from "js-cookie";
|
||||
import {decrypt, encrypt} from '@/utils/jsencrypt'
|
||||
|
||||
|
@ -105,9 +70,6 @@ export default {
|
|||
name: "Login",
|
||||
data() {
|
||||
return {
|
||||
firm:{},
|
||||
labelPosition: "right",
|
||||
dialogVisible:false,
|
||||
codeUrl: "",
|
||||
loginForm: {
|
||||
username: "admin",
|
||||
|
@ -129,7 +91,7 @@ export default {
|
|||
// 验证码开关
|
||||
captchaEnabled: true,
|
||||
// 注册开关
|
||||
register: false,
|
||||
register: true,
|
||||
redirect: undefined
|
||||
};
|
||||
},
|
||||
|
@ -146,23 +108,6 @@ export default {
|
|||
this.getCookie();
|
||||
},
|
||||
methods: {
|
||||
doReg(){
|
||||
register(this.firm).then(res =>{
|
||||
if (res.code == 200){
|
||||
this.$message.success(res.msg)
|
||||
location.reload()
|
||||
}else{
|
||||
this.$message({
|
||||
type: 'error',
|
||||
message: res.msg
|
||||
})
|
||||
}
|
||||
})
|
||||
this.dialogVisible = false
|
||||
},
|
||||
toReg(){
|
||||
this.dialogVisible = true
|
||||
},
|
||||
getCode() {
|
||||
getCodeImg().then(res => {
|
||||
this.captchaEnabled = res.data.captchaEnabled === undefined ? true : res.data.captchaEnabled;
|
||||
|
|
|
@ -1,47 +1,24 @@
|
|||
<template>
|
||||
<div class="register">
|
||||
<el-form ref="registerForm" :model="registerForm" :rules="registerRules" class="register-form">
|
||||
<h3 class="title">若依后台管理系统</h3>
|
||||
<el-form-item prop="username">
|
||||
<el-input v-model="registerForm.username" auto-complete="off" placeholder="账号" type="text">
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="user"/>
|
||||
</el-input>
|
||||
<h3 class="title">企业注册页面</h3>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.firmName" autocomplete="off" placeholder="企业名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input
|
||||
v-model="registerForm.password"
|
||||
auto-complete="off"
|
||||
placeholder="密码"
|
||||
type="password"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="password"/>
|
||||
</el-input>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.username" autocomplete="off" placeholder="企业登录账号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="confirmPassword">
|
||||
<el-input
|
||||
v-model="registerForm.confirmPassword"
|
||||
auto-complete="off"
|
||||
placeholder="确认密码"
|
||||
type="password"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="password"/>
|
||||
</el-input>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.password" autocomplete="off" placeholder="企业登录密码"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="captchaEnabled" prop="code">
|
||||
<el-input
|
||||
v-model="registerForm.code"
|
||||
auto-complete="off"
|
||||
placeholder="验证码"
|
||||
style="width: 63%"
|
||||
@keyup.enter.native="handleRegister"
|
||||
>
|
||||
<svg-icon slot="prefix" class="el-input__icon input-icon" icon-class="validCode"/>
|
||||
</el-input>
|
||||
<div class="register-code">
|
||||
<img :src="codeUrl" class="register-code-img" @click="getCode"/>
|
||||
</div>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.nickName" autocomplete="off" placeholder="公司注册人"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.email" autocomplete="off" placeholder="企业邮箱"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="pass">
|
||||
<el-input type="text" v-model="registerForm.phonenumber" autocomplete="off" placeholder="企业电话"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item style="width:100%;">
|
||||
<el-button
|
||||
|
|
Loading…
Reference in New Issue