Commit db60e2e7 by 潘建波

Merge branch 'fanxing' of http://git.keliuyun.com:55676/platform/fanxing_new into fanxing

2 parents 2da19803 fad2f3bd
This diff could not be displayed because it is too large.
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
"js-sha1": "^0.6.0", "js-sha1": "^0.6.0",
"moment": "^2.24.0", "moment": "^2.24.0",
"ol": "^6.1.1", "ol": "^6.1.1",
"particles.js": "^2.0.0",
"vue": "^2.6.10", "vue": "^2.6.10",
"vue-router": "^3.1.3", "vue-router": "^3.1.3",
"vuex": "^3.0.1" "vuex": "^3.0.1"
...@@ -39,6 +40,7 @@ ...@@ -39,6 +40,7 @@
"sass-loader": "^8.0.0", "sass-loader": "^8.0.0",
"stylus": "^0.54.7", "stylus": "^0.54.7",
"stylus-loader": "^3.0.2", "stylus-loader": "^3.0.2",
"vue-particles": "^1.0.9",
"vue-template-compiler": "^2.6.10" "vue-template-compiler": "^2.6.10"
}, },
"eslintConfig": { "eslintConfig": {
......
#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;
} }
......
...@@ -19,6 +19,10 @@ Vue.prototype.$moment = moment; ...@@ -19,6 +19,10 @@ Vue.prototype.$moment = moment;
Vue.prototype.$buildCode = buildCode; Vue.prototype.$buildCode = buildCode;
Vue.prototype.oParse = new XML.ObjTree(); Vue.prototype.oParse = new XML.ObjTree();
Vue.prototype.axios=axios; Vue.prototype.axios=axios;
import VueParticles from 'vue-particles'
Vue.use(VueParticles)
Vue.use(api); Vue.use(api);
Vue.use(ElementUI, { size: "small", zIndex: 3000 }); Vue.use(ElementUI, { size: "small", zIndex: 3000 });
Vue.use(resetCss); Vue.use(resetCss);
......
<template> <template>
<div id="login" :style="{height:innerHeight+'px'}"> <div id="login" :style="{height:innerHeight+'px'}">
<h1>视频分析综合管理平台</h1> <vue-particles
<div class="form-horizontal"> color="#dedede"
<div class="form-group"> :particleOpacity="0.7"
<div class="col-sm-offset-2 col-sm-8"> :particlesNumber="80"
<input type="text" class="form-control" v-model="username" id="username" placeholder="请输入用户名"> shapeType="circle"
:particleSize="4"
linesColor="#dedede"
:linesWidth="1"
:lineLinked="true"
:lineOpacity="0.4"
:linesDistance="150"
:moveSpeed="3"
:hoverEffect="true"
hoverMode="grab"
:clickEffect="true"
clickMode="push"
>
</vue-particles>
<div class="box">
<h1>视频分析综合管理平台</h1>
<div style="width: 60%;margin: 0 auto;">
<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="0px" class="demo-ruleForm">
<el-form-item label=" " prop="username">
<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 +43,55 @@ import types from '../store/types.js' ...@@ -33,20 +43,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){
...@@ -192,6 +237,15 @@ import types from '../store/types.js' ...@@ -192,6 +237,15 @@ import types from '../store/types.js'
<!-- Add "scoped" attribute to limit CSS to this component only --> <!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss"> <style scoped lang="scss">
#particles{
position: absolute;
width: 100%;
height: 100%;
background-color: #b61924;
background-repeat: no-repeat;
background-size: cover;
background-position: 50% 50%;
}
.loginTitle{ .loginTitle{
height:60px; height:60px;
background: #dcdcdc; background: #dcdcdc;
...@@ -224,62 +278,38 @@ import types from '../store/types.js' ...@@ -224,62 +278,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: absolute;
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 +318,24 @@ import types from '../store/types.js' ...@@ -288,11 +318,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: absolute;
left: 57%;
top: 20%;
}
}
</style> </style>
...@@ -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!