<template>
|
<div class="leaderLogin-wrap">
|
<div class="leaderLogin-main">
|
<img class="logoImg" src="../../../assets/images/logoImg.png" alt="">
|
<div class="leaderLogin-main-inside">
|
<h1>峰峰矿区综合行政执法局智慧泊车平台</h1>
|
<div class="leaderLogin-content-bj">
|
<h2>用户登录</h2>
|
<div class="zhanghuAndMima-box">
|
<el-form :model="loginForm">
|
<el-form-item>
|
<el-input prefix-icon="el-icon-user-solid" v-model="loginForm.loginName" placeholder="请输入账号">
|
</el-input>
|
</el-form-item>
|
<el-form-item>
|
<el-input type="password" prefix-icon="el-icon-s-cooperation" v-model="loginForm.password" placeholder="请输入密码"></el-input>
|
</el-form-item>
|
<!--<div class="forgetPassWord-box">
|
<el-checkbox v-model="passWordCheck">记住密码</el-checkbox>
|
<div class="forgetPassWord-box-inside">
|
<h2>忘记密码？</h2>
|
</div>
|
</div>-->
|
<el-form-item>
|
<div class="denglu-box">
|
<el-button @click="loginBtn" class="dengluBtn">登 录</el-button>
|
</div>
|
</el-form-item>
|
</el-form>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
</div>
|
</template>
|
|
<script>
|
export default {
|
name: "login",
|
data() {
|
return {
|
pageConfig: {
|
loginDataUrl: this.$systemconfig.basePath + '/user/login'
|
},
|
passWordCheck:false,
|
loginForm:{
|
loginName:'',
|
password:'',
|
}
|
}
|
},
|
methods:{
|
loginBtn() {
|
this.$byutil.postData(this,this.pageConfig.loginDataUrl,this.loginForm,res => {
|
if(res.code == 0) {
|
//this.$message.success(res.message)
|
this.setStore('userinfo',res.data)
|
this.$router.push({
|
path:'/leaderIndex'
|
})
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.zhanghuAndMima-box{
|
.el-input__inner{
|
background:rgba(24,136,203,0.2);
|
border:1px solid #457bff;
|
color:#fff;
|
}
|
.el-checkbox__label{
|
color: #fff;
|
}
|
.el-form-item{
|
margin-top: 0.15625rem /* 30/192 */;
|
}
|
.el-input__prefix{
|
color:#00fffb;
|
}
|
}
|
</style>
|
<style lang="scss" scoped>
|
.leaderLogin-wrap{
|
width: 100%;
|
height: 100%;
|
background:url("../../../assets/images/login-bj.jpg") no-repeat center;
|
background-size: 100% 100%;
|
display: flex;
|
justify-content: center;
|
.leaderLogin-main{
|
width: 60%;
|
display: flex;
|
flex-direction: column;
|
justify-content: center;
|
align-items: center;
|
}
|
.logoImg{
|
width: 0.78125rem /* 150/192 */;
|
height: 0.78125rem /* 150/192 */;
|
}
|
.leaderLogin-main-inside{
|
margin-top: 0.09375rem /* 18/192 */;
|
h1{
|
color: #fff;
|
font-size: 0.1875rem /* 36/192 */;
|
line-height: 2;
|
font-family: '苹方 中等';
|
font-weight: normal;
|
}
|
}
|
|
}
|
.leaderLogin-content-bj{
|
width: 3.28125rem /* 630/192 */;
|
height: 2.28125rem /* 438/192 */;
|
background:url('../../../assets/images/login-main-bj.png');
|
background-size: 100%;
|
margin-top: 0.1042rem /* 20/192 */;
|
padding:0.15625rem /* 30/192 */;
|
box-sizing: border-box;
|
h2{
|
color:#00fffb;
|
font-size:0.1354rem /* 26/192 */;
|
text-align: center;
|
line-height: 2;
|
}
|
}
|
.zhanghuAndMima-box{
|
width: 80%;
|
margin:0 auto;
|
margin-top: 0.1042rem /* 20/192 */;
|
}
|
.denglu-box{
|
width: 80%;
|
margin:0.1042rem /* 20/192 */ auto 0 ;
|
background:transparent;
|
border:1px solid #00fffb;
|
border-radius: 4px;
|
.dengluBtn{
|
background:transparent;
|
border:none;
|
color:#ffffff;
|
font-size:0.1146rem /* 22/192 */;
|
width: 100%;
|
text-align: center;
|
}
|
}
|
.forgetPassWord-box{
|
display: flex;
|
justify-content: space-between;
|
margin-top: 0.0521rem /* 10/192 */;
|
}
|
.forgetPassWord-box-inside{
|
cursor: pointer;
|
h2{
|
font-size: 0.09375rem /* 18/192 */;
|
color: #fff;
|
}
|
}
|
</style>
|
