Forget.vue
2.3 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
<template>
<div class="forget">
<h2 @click="back"><</h2>
<h1>重置密码</h1>
<input type="tel" v-model="mobile"
pattern="^1[3456789]\d{9}$" required placeholder="请输入手机号"><hr />
<input type="number" v-model="newpassword" placeholder="请输入新密码"><hr />
<input type="number" placeholder="请输入验证码" ><hr />
<p @click="goRegister">去注册</p>
<div class="footer" @click="login">保存</div>
</div>
</template>
<script>
export default {
name: 'home',
components: {
},
data () {
return {
mobile:'',
newpassword:''
}
},
methods: {
back () {
this.$router.go(-1);
},
goRegister () {
this.$router.push('/register');
},
login(){
var params={
'mobile':this.mobile
};
this.axios.post('/api/user/resetpwd',params).then((res)=>{
if(this.mobile=true){
localStorage.setItem('mobile',this.mobile);
}else{
this.mobile=res.data
}
}).catch((error)=>{
console.log(error)
})
}
},
watch: {
// ' phone': function (newValue, oldValue) {
// this.phone = newValue.replace(/[^\d]/g, '').substring(0, 11)
// }
}
}
</script>
<style lang="scss" scoped>
.forget{
width:100%;
height:95%;
background:#11A7FC;
padding-top:5%;
padding-left:5%;
h2{
font-size:.2rem;
color:#fff;
}
h1{
font-size:0.3rem;
color:#fff;
margin:20% 0;
margin-left:5%;
}
input{
width:96%;
margin-left:0%;
height:0.4rem;
font-size:0.2rem;
border:none;//去除边框
display:block;
margin-bottom:0.1rem;
margin-top:.1rem;
font-weight:bold;
padding-left:3%;
background-color:#11A7FC;
color:#fff;
// margin-right:2%;
}
hr{
margin-right:6%;
opacity:0.3;
}
p{
font-size:0.18rem;
color:#fff;
margin-top:5%;
margin-left:80%;
}
.footer{
width:94%;
height:0.48rem;
font-size:.2rem;
background:#fff;
color:#11A7FC;
text-align:center;
line-height:0.48rem;
border-radius:.2rem;
margin-top:.2rem;
}
}
</style>