Skip to content

E
ElectricitySheep
Commit 9a8824f9 authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent 0d3e91f4
Show whitespace changes
Inline Side-by-side
Showing with 216 additions and 184 deletions
src/components/Forgetpassword.vue
View file @ 9a8824f9
<style> <style>
.Forgetpassword .resHeader{ .Forgetpassword .resHeader {
width:100%; width: 100%;
height:190px; height: 190px;
background-image: url("../assets/img/fpassword.png"); background-image: url("../assets/img/fpassword.png");
} }
.Forgetpassword .resHeader .title{
.Forgetpassword .resHeader .title {
height: 50px; height: 50px;
font-size: 26px; font-size: 26px;
width: 274px; width: 274px;
...@@ -12,41 +13,49 @@ ...@@ -12,41 +13,49 @@
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
} }
.Forgetpassword .resHeader .title div { .Forgetpassword .resHeader .title div {
padding: 0 10px; padding: 0 10px;
width: 125px; width: 125px;
} }
.Forgetpassword .resHeader .title{
.Forgetpassword .resHeader .title {
font-size: 26px; font-size: 26px;
color: #333; color: #333;
padding-top: 75px; padding-top: 75px;
text-align: center; text-align: center;
} }
.Forgetpassword .regisLogo { .Forgetpassword .regisLogo {
float: right; float: right;
height: 50px; height: 50px;
} }
.Forgetpassword .regisLine { .Forgetpassword .regisLine {
height: 25px; height: 25px;
width: 1px!important; width: 1px !important;
background: rgb(68, 68, 68); background: rgb(68, 68, 68);
padding: 0px!important; padding: 0px !important;
margin:21px 0 0 10px; margin: 21px 0 0 10px;
} }
.Forgetpassword .regisWelcome{
padding:0!important; .Forgetpassword .regisWelcome {
margin:14px 0 0 10px; padding: 0 !important;
margin: 14px 0 0 10px;
} }
.Forgetpassword .login { .Forgetpassword .login {
color: #409EFF; color: #409EFF;
cursor: pointer; cursor: pointer;
} }
.Forgetpassword .regisLogin{
.Forgetpassword .regisLogin {
color: rgb(125, 125, 125); color: rgb(125, 125, 125);
text-align:center; text-align: center;
margin-top:15px; margin-top: 15px;
} }
.Forgetpassword .regisMain{
.Forgetpassword .regisMain {
display: block; display: block;
-webkit-box-flex: 1; -webkit-box-flex: 1;
-ms-flex: 1; -ms-flex: 1;
...@@ -56,28 +65,34 @@ ...@@ -56,28 +65,34 @@
overflow: auto; overflow: auto;
box-sizing: border-box; box-sizing: border-box;
padding: 20px; padding: 20px;
flex:1; flex: 1;
} }
.Forgetpassword .box-card{
width:700px; .Forgetpassword .box-card {
margin:40px auto 0; width: 700px;
margin: 40px auto 0;
} }
.Forgetpassword .box-card .el-input .el-input__inner { .Forgetpassword .box-card .el-input .el-input__inner {
height: 45px; height: 45px;
border-radius: 22.5px; border-radius: 22.5px;
} }
.Forgetpassword .box-card .el-form-item__content { .Forgetpassword .box-card .el-form-item__content {
width: 420px; width: 420px;
} }
.Forgetpassword .NextStep{
width:300px; .Forgetpassword .NextStep {
width: 300px;
text-align: left; text-align: left;
margin:40px auto 20px; margin: 40px auto 20px;
} }
.Forgetpassword .box-card .code .el-input__inner { .Forgetpassword .box-card .code .el-input__inner {
border-top-right-radius: 0; border-top-right-radius: 0;
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
} }
.Forgetpassword .box-card .code .el-input-group__append { .Forgetpassword .box-card .code .el-input-group__append {
background-color: #007BFF; background-color: #007BFF;
color: #fff; color: #fff;
...@@ -85,26 +100,29 @@ ...@@ -85,26 +100,29 @@
border-bottom-right-radius: 22.5px; border-bottom-right-radius: 22.5px;
border: 1px solid #007BFF; border: 1px solid #007BFF;
} }
.Forgetpassword .el-footer { .Forgetpassword .el-footer {
color: #ACACAC; color: #ACACAC;
text-align: center; text-align: center;
line-height: 60px; line-height: 60px;
background-color: #F6F6F6; background-color: #F6F6F6;
font-size:14px; font-size: 14px;
} }
.Forgetpassword .forgetBtn{
font-size:16px; .Forgetpassword .forgetBtn {
width:120px; font-size: 16px;
height:45px; width: 120px;
border-radius:23px; height: 45px;
border-radius: 23px;
} }
</style> </style>
<template> <template>
<div class="Forgetpassword"> <div class="Forgetpassword">
<div class="resHeader"> <div class="resHeader">
<div class="title"> <div class="title">
<div> <div>
<img src="../assets/img/logo.png" alt="" class="regisLogo"/> <img src="../assets/img/logo.png" alt="" class="regisLogo" />
</div> </div>
<div class="regisLine"></div> <div class="regisLine"></div>
<div class="regisWelcome">重置密码</div> <div class="regisWelcome">重置密码</div>
...@@ -116,19 +134,19 @@ ...@@ -116,19 +134,19 @@
<div class="regisMain" :style="{minHeight: Height+'px'}"> <div class="regisMain" :style="{minHeight: Height+'px'}">
<div class="box-card"> <div class="box-card">
<el-form :model="msg" :rules="rules" ref="msg" label-width="130px" style="padding:0 50px;"> <el-form :model="msg" :rules="rules" ref="msg" label-width="130px" style="padding:0 50px;">
<el-form-item label="手机号" prop="phone"> <el-form-item label="手机号" prop="MobilePhone">
<el-input type="text" v-model="msg.phone" maxlength="25" placeholder="请输入手机号"/> <el-input type="text" v-model="msg.MobilePhone" maxlength="20" placeholder="请输入手机号" />
</el-form-item> </el-form-item>
<el-form-item label="短信验证码" prop="ValidataCode" class="code"> <el-form-item label="短信验证码" prop="ValidataCode" class="code" style="display:none;">
<el-input v-model="msg.ValidataCode" maxlength="10" type="text"> <el-input v-model="msg.ValidataCode" maxlength="6" type="text">
<template slot="append">获取短信验证码</template> <template slot="append">获取短信验证码</template>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="设置密码" prop="Password"> <el-form-item label="设置密码" prop="Password">
<el-input type="password" v-model="msg.Password" maxlength="25" placeholder="请输入密码"/> <el-input type="password" v-model="msg.Password" maxlength="20" placeholder="请输入密码" />
</el-form-item> </el-form-item>
<el-form-item label="确认密码" prop="Password2"> <el-form-item label="确认密码" prop="Password2">
<el-input type="password" v-model="msg.Password2" maxlength="25" placeholder="请再次输入密码"/> <el-input type="password" v-model="msg.Password2" maxlength="20" placeholder="请再次输入密码" />
</el-form-item> </el-form-item>
</el-form> </el-form>
<div class="NextStep"> <div class="NextStep">
...@@ -145,51 +163,55 @@ ...@@ -145,51 +163,55 @@
export default { export default {
data() { data() {
let validataPwd = (rule, value, callback) => { let validataPwd = (rule, value, callback) => {
if (this.msg.Password =='') { if (this.msg.Password == '') {
return callback(new Error('请输入密码')); return callback(new Error('请输入密码'));
} }
if(this.msg.Password.trim().length<6||this.msg.Password.trim().length>15){ if (this.msg.Password.trim().length < 6 || this.msg.Password.trim().length > 15) {
return callback(new Error('密码应在6至15位之间')); return callback(new Error('密码应在6至15位之间'));
} } else {
else {
callback(); callback();
} }
} }
let validataPwd2 = (rule, value, callback) => { let validataPwd2 = (rule, value, callback) => {
if (this.msg.Password2 =='') { if (this.msg.Password2 == '') {
return callback(new Error('请再次输入密码')); return callback(new Error('请再次输入密码'));
} }
if(this.msg.Password2.trim().length<6||this.msg.Password2.trim().length>15){ if (this.msg.Password2.trim().length < 6 || this.msg.Password2.trim().length > 15) {
return callback(new Error('密码应在6至15位之间')); return callback(new Error('密码应在6至15位之间'));
} }
if(this.msg.Password!=this.msg.Password2){ if (this.msg.Password != this.msg.Password2) {
return callback(new Error('两次输入密码不一致!')); return callback(new Error('两次输入密码不一致!'));
} } else {
else {
callback(); callback();
} }
} }
return { return {
Height:0, Height: 0,
msg:{ msg: {
phone:'', MobilePhone: '',
ValidataCode:'', ValidataCode: '',
Password:'', Password: '',
Password2:'' Password2: ''
}, },
rules: { rules: {
phone: [ MobilePhone: [{
{ required: true, message: "手机号不能为空", trigger: "blur" } required: true,
], message: "手机号不能为空",
ValidataCode: [ trigger: "blur"
{ required: true, message: "手机验证码不能为空", trigger: "blur" } }],
], // ValidataCode: [
Password: [ // { required: true, message: "手机验证码不能为空", trigger: "blur" }
{ validator: validataPwd, trigger: "blur",required: true} // ],
], Password: [{
Password2: [ validator: validataPwd,
{ validator: validataPwd2, trigger: "blur",required: true} trigger: "blur",
] required: true
}],
Password2: [{
validator: validataPwd2,
trigger: "blur",
required: true
}]
}, },
}; };
}, },
...@@ -197,7 +219,7 @@ ...@@ -197,7 +219,7 @@
}, },
methods: { methods: {
submitForm(addMsg){ submitForm(addMsg) {
//提交创建、修改表单 //提交创建、修改表单
this.$refs[addMsg].validate(valid => { this.$refs[addMsg].validate(valid => {
if (valid) { if (valid) {
...@@ -208,8 +230,16 @@ ...@@ -208,8 +230,16 @@
}); });
}, },
//提交重置 //提交重置
resetInfo(){ resetInfo() {
this.apipost("/api/Tenant/UpdateTenantPwd", this.msg, res => {
if (res.data.resultCode == 1) {
this.Success("修改密码成功!");
this.goLogin();
} else {
this.Info(res.data.message);
}
})
}, },
//跳转登录 //跳转登录
goLogin() { goLogin() {
...@@ -224,9 +254,11 @@ ...@@ -224,9 +254,11 @@
}, },
mounted() { mounted() {
this.Height = document.documentElement.clientHeight - 250; this.Height = document.documentElement.clientHeight - 250;
　　//监听浏览器窗口变化　 //监听浏览器窗口变化　
window.onresize = ()=> {this.Height = document.documentElement.clientHeight -250} window.onresize = () => {
this.Height = document.documentElement.clientHeight - 250
}
} }
}; };
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment