Skip to content

platform / fanxing_new

Go to a project
Commit c0c958d8 by 夏新然
Options

提交

1 parent d60b57e4
Inline Side-by-side
Showing 4 changed files with 97 additions and 64 deletions
src/assets/resetElementCss/index.css
#login .el-input__inner {
background: rgba(255,255,255,.5);
border-radius: 0!important;
border: none!important;
border-bottom: 1px solid #000000!important;
background: #FFFFFF!important;
box-shadow: none;
margin-top: 20px;
height: 40px;
/* line-height: 40px; */
border-radius: 5px;
font-size: 16px;
}
#login .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item{
margin-bottom: 28px!important;
}
.el-main{ .el-main{
padding: 0; padding: 0;
} }
......
src/views/Login.vue
<template> <template>
<div id="login" :style="{height:innerHeight+'px'}"> <div id="login" :style="{height:innerHeight+'px'}">
<div class="box">
<h1>视频分析综合管理平台</h1> <h1>视频分析综合管理平台</h1>
<div class="form-horizontal"> <div style="width: 60%;margin: 0 auto;">
<div class="form-group"> <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="0px" class="demo-ruleForm">
<div class="col-sm-offset-2 col-sm-8"> <el-form-item label=" " prop="username">
<input type="text" class="form-control" v-model="username" id="username" placeholder="请输入用户名"> <el-input v-model="ruleForm.username" placeholder="请输入用户名"></el-input>
</el-form-item>
<el-form-item label=" " prop="password">
<el-input v-model="ruleForm.password" type="password" placeholder="请输入密码"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm')">登 录</el-button>
</el-form-item>
</el-form>
</div> </div>
</div> </div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<input type="password" class="form-control" v-model="password" id="password" placeholder="请输入密码">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<button class="btn" @click.stop="login">登录</button>
</div>
</div>
<!--<div class="form-group">
<div class="col-sm-offset-2 col-sm-8">
<p>北京文安智能技术股份有限公司</p>
<p>v2.0.0.1</p>
</div>
</div>-->
</div>
</div> </div>
</template> </template>
...@@ -33,20 +25,55 @@ import types from '../store/types.js' ...@@ -33,20 +25,55 @@ import types from '../store/types.js'
export default { export default {
name: 'Login', name: 'Login',
data() { data() {
var validatePass = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入密码'));
} else {
callback();
}
};
var validateUser = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入用户名'));
} else {
callback();
}
};
return { return {
username: '', username: '',
password: '', password: '',
innerHeight:0 innerHeight:0,
ruleForm:{
username:'',
password:'',
},
rules: {
password: [
{ validator: validatePass, trigger: 'change' }
],
username: [
{ validator: validateUser, trigger: 'change' }
]
}
} }
}, },
methods: { methods: {
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
this.login();
} else {
return false;
}
});
},
initHeight(){ initHeight(){
this.innerHeight=window.innerHeight; this.innerHeight=window.innerHeight;
}, },
login(){ login(){
this.$api.login.login({ this.$api.login.login({
"username":this.username, "username":this.ruleForm.username,
"password":this.password, "password":this.ruleForm.password,
"user_type": "user" "user_type": "user"
}).then(res => { }).then(res => {
if(!res.ecode){ if(!res.ecode){
...@@ -224,62 +251,38 @@ import types from '../store/types.js' ...@@ -224,62 +251,38 @@ import types from '../store/types.js'
left:50px; left:50px;
top: 16px; top: 16px;
} }
.form-horizontal {
width: 450px;
height: 350px;
background: url(../assets/img/login/233.png) no-repeat;
background-size: 500px 430px;
position: absolute;
left: 58%;
top: 200px;
padding-top:50px;
border-radius: 10px;
}
h1 { h1 {
color: #F5F5F5; color: #000000;
height: 40px; height: 40px;
line-height: 40px; line-height: 40px;
padding: 60px 0px; padding: 60px 0px;
position: absolute; font-size:44px;
left:10%;
top:220px;
font-size:50px;
letter-spacing: 8px;
text-shadow: 5px 5px 5px #000
} }
#login { #login {
text-align: center; text-align: center;
position: relative; position: relative;
background: url(../assets/img/login/2333.png) no-repeat 0 0; background: url(../assets/img/login/background.png) no-repeat 0 0;
background-size:cover background-size:cover
} }
#login input {
color: #fff;
background: rgba(255,255,255,.5);
border-radius: 0;
border: none;
border: 1px solid #86B1DB;
box-shadow: none;
margin-top: 20px;
height: 40px;
/* line-height: 40px; */
border-radius: 5px;
font-size: 16px;
}
#login input:focus { #login input:focus {
outline: none; outline: none;
box-shadow: none; box-shadow: none;
} }
.box{
width: 25%;
position: relative;
left: 52%;
top: 20%;
}
button { button {
width: 60%; width: 100%;
margin-top: 40px; margin-top: 40px;
background: #09cef7; border-radius: 30px;
color: #fff!important; background: #0069FF;
height: 40px; height: 50px;
font-size: 20px; font-size: 20px;
} }
...@@ -288,11 +291,24 @@ import types from '../store/types.js' ...@@ -288,11 +291,24 @@ import types from '../store/types.js'
} }
p { p {
color: #fff;
margin: 0; margin: 0;
} }
p:nth-child(1) { p:nth-child(1) {
padding-top: 15px padding-top: 15px
} }
@media screen and (max-width: 1366px) {
h1 {
height: 40px;
line-height: 40px;
padding: 60px 0px;
font-size:34px;
}
.box{
width: 25%;
position: relative;
left: 57%;
top: 20%;
}
}
</style> </style>
src/views/ops/user_manage.vue
...@@ -99,7 +99,7 @@ ...@@ -99,7 +99,7 @@
<el-input v-model="addForm.password" type="password"></el-input> <el-input v-model="addForm.password" type="password"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="确认新密码" prop="checkPass"> <el-form-item label="确认新密码" prop="checkPass">
<el-input v-model="addForm.checkPass" type="checkPass"></el-input> <el-input v-model="addForm.checkPass" type="password"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -160,9 +160,10 @@ ...@@ -160,9 +160,10 @@
} }
}; };
var validatePass2 = (rule, value, callback) => { var validatePass2 = (rule, value, callback) => {
console.log('aa',this.addForm.password)
if (value === '') { if (value === '') {
callback(new Error('请再次输入密码')); callback(new Error('请再次输入密码'));
} else if (value !== this.editForm.password) { } else if (value !== this.addForm.password) {
callback(new Error('两次输入密码不一致!')); callback(new Error('两次输入密码不一致!'));
} else { } else {
callback(); callback();
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!