你是喜欢草莓汁,苹果汁,西瓜汁,还是我这个精神小伙子!
<template>
<div>
<header>
</header>
<div class="box" v-show="flag" >
<div class="item-1">
<input type="text" class="txt1" v-model="user" placeholder="请输入手机号">
<span @click="zhup()">获取验证码</span>
</div>
<hr>
<div class="item-1">
<input type="text" class="txt1" v-model="code" placeholder="请输入短信验证码">
</div>
<hr>
<div class="item-2">
<p>未注册手机号自动注册</p>
<span @click="mm()">密码登录</span>
</div>
<!-- 登录提交按钮 -->
<div class="btn1">
<van-button class="sxlp1" @click="dlu" size='large' round>
登录
</van-button>
</div>
</div>
<div class="boxx" v-show="!flag">
<div class="item-1">
<input type="text" class="txt1" v-model="user" placeholder="请输入手机号">
</div>
<hr>
<div class="item-1">
<input type="text" class="txt1" v-model="code" placeholder="请输入密码">
</div>
<hr>
<div class="item-2">
<p>找回密码</p>
<span @click="mm()">验证码登录</span>
</div>
</div>
</div>
</template>
<script>
export default {
name:"Log",
data(){
return{
user:"",
code:"",
flag:true
}
},
methods:{
mm(){
this.flag=!this.flag
},
zhup(){
this.$axios.post("/api/app/smsCode",{mobile:this.user,sms_type:'login'}).then((res)=>{
console.log(res)
})
},
async dlu(){
let {data:res}=await this.$axios.post("/api/app/login",{mobile:this.user,sms_code:this.code,type:2,client:1})
console.log(res)
if(res.code==200){
window.localStorage.setItem("adminToken",res.data.remember_token)
window.localStorage.setItem("userid",res.data.id)
}
console.log(res.data.is_new)
if(res.data.is_new==1){
this.$router.push("/pass")
}else if(res.data.is_new==2){
this.$router.push("/my")
}
},
}
}
</script>
<style lang="scss" scoped>
*{
margin: 0;
padding: 0;
list-style: none;
}
body,h1,h2,h3,h4,h5,h6,p{
margin: 0;
padding: 0;
list-style: none;
}
body,html,#app{
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
header{
width: 7.5rem;
height: 3rem;
background: url("/zh9.png")no-repeat;
background-size: 7.5rem 3rem;
}
.item-1{
width: 7.5rem;
height: 1.2rem;
display: flex;
align-items: center;
.txt1{
width: 4rem;
height: 0.4rem;
font-size: 0.2rem;
border-left: none;
border-top: none;
border-right: none;
border-bottom: none;
margin-left: 1.2rem;
}
span{
width: 1rem;
height: 0.4rem;
font-size: 0.2rem;
color: orangered;
}
}
hr{
display: block;
width: 5rem;
margin-left: 1.2rem;
background: orangered;
}
.item-2{
width: 7.5rem;
height: 1rem;
display: flex;
align-items: center;
p{
width: 3rem;
height: 0.6rem;
font-size: 0.2rem;
margin-left: 1.2rem;
}
span{
display: block;
width: 1.2rem;
height: 0.6rem;
font-size: 0.2rem;
}
}
.sxlp1{
width: 3rem;
height: 1.5rem;
background: rgb(196, 52, 52);
text-align: center;
line-height: 1.5rem;
font-size: 0.4rem;
border-radius: 0.4rem;
margin-left: 2.5rem;
color: white;
}
</style>