You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

125 lines
3.1 KiB

<template>
<view class="login_body">
<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#010101" class="select"></uni-segmented-control>
<view class="body">
<view class="login" v-show="current==0">
<input type="text" class="login_input" placeholder="eamil address">
<input type="text" class="login_input" placeholder="password">
<view class="tips">The email address or password you enterde is incorrect.</view>
<navigator url="/pages/login/verifyEmail" >
<view class="forgot">Forgot your Password?</view>
</navigator>
<button class="login_submit" >SIGN IN</button>
<view class="agreement">
<img src="../../static/img/select2.png" mode="" class="agreement_image"></img>
<view class="">
by continuong, you agree to be <text class="text"> terms of use </text> and <text class="text"> privacy policy</text>.
</view>
</view>
</view>
<view class="login" v-show="current==1">
<input type="text" class="login_input" placeholder="name">
<input type="text" class="login_input" placeholder="eamil address">
<input type="text" class="login_input" placeholder="password">
<button class="login_submit">REGISTER</button>
<view class="agreement">
<img src="../../static/img/select2.png" mode="" class="agreement_image"></img>
<view class="">
by continuong, you agree to be <text class="text"> terms of use </text> and <text class="text"> privacy policy</text>.
</view>
</view>
</view>
<view class="mode">
<view class="mode_title">or continue with</view>
<view class="mode_content">
<image src="/static/img/facebook.png" class="mode_content_image"></image>
<image src="/static/img/gugei.png" class="mode_content_image"></image>
<image src="/static/img/apple.png" class="mode_content_image"></image>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
items: ['SIGN IN', 'REGISTER'],
current: 0,
dynamicFormData:{
email:'',
pwd:''
},
}
},
methods:{
onClickItem(e) {
if (this.current != e.currentIndex) {
this.current = e.currentIndex;
}
}
}
}
</script>
<style lang="scss" scoped>
.login_body{
padding-top: 145.33rpx;
}
.select{
margin-bottom: 80rpx;
font-size: 33.33rpx;
font-weight: bold;
}
.mode{
position: fixed;
bottom: 138.67rpx;
width: 100%;
left: 0;
.mode_title{
font-size: 26.67rpx;
color: #666666;
position: relative;
text-align: center;
width: 100%;
&:before{
content: "";
height: 1px;
width: 89.33rpx;
background-color: #BCBCBC;
position: absolute;
left: 20%;
top: 50%;
}
&:after{
content: "";
height: 1px;
width: 89.33rpx;
background-color: #BCBCBC;
position: absolute;
right: 20%;
top: 50%;
}
}
.mode_content{
display: flex;
align-items: center;
justify-content: center;
margin-top: 50.67rpx;
.mode_content_image{
width: 54.67rpx;
height: 54.67rpx;
margin-right: 49.33rpx;
}
}
}
</style>