Browse Source

新增消息、登录

master
ltlzx 4 years ago
parent
commit
bfd4d6ede9
  1. 6
      pages.json
  2. 4
      pages/account/index.vue
  3. 65
      pages/account/message.vue
  4. 8
      pages/index/index.vue
  5. 143
      pages/login/index.vue

6
pages.json

@ -64,6 +64,12 @@
"style": {
"titleNView":false
}
},
{
"path": "pages/login/index",
"style": {
"titleNView":false
}
}
],
"globalStyle": {

4
pages/account/index.vue

@ -4,7 +4,7 @@
<img src="/static/img/logo.png" alt="" class="header_img">
<view class="info_name" v-if="!isLogin">
<navigator url="/pages/index/search" >
<navigator url="/pages/login/index" >
LOGIN / SIGUP>
</navigator>
</view>
@ -118,7 +118,7 @@
export default {
data() {
return {
isLogin:true
isLogin:false
}
},
methods:{

65
pages/account/message.vue

@ -1,6 +1,34 @@
<template>
<view>
<uni-nav-bar left-icon="left" :rightText="isDelete?'Done':'Delete'" title="Message" color="#000000" @clickLeft="back" @clickRight="isDelete=!isDelete"/>
<uni-nav-bar left-icon="left" title="Message" color="#000000" rightIcon="info" @clickLeft="back" @clickRight="isDelete=!isDelete" :border="false"/>
<view class="body">
<view class="msg_item">
<view class="msg_time">21/04/2022 14:42:31</view>
<view class="msg_title">Message heading</view>
<view class="msg_content">
estimated to be deliverd on estimated to be deliverd on estim
ated to be deliverd on estimated to be deliverd on
</view>
<view class="msg_img"></view>
</view>
<view class="msg_item">
<view class="msg_time">21/04/2022 14:42:31</view>
<view class="msg_title">Message heading</view>
<view class="msg_content">
estimated to be deliverd on estimated to be deliverd on estim
ated to be deliverd on estimated to be deliverd on
</view>
</view>
<view class="msg_item">
<view class="msg_time">21/04/2022 14:42:31</view>
<view class="msg_title">Message heading</view>
<view class="msg_content">
estimated to be deliverd on estimated to be deliverd on estim
ated to be deliverd on estimated to be deliverd on
</view>
<view class="msg_img"></view>
</view>
</view>
</view>
</template>
@ -25,4 +53,39 @@
font-size: 32rpx;
font-weight: bold;
}
.body{
border-top: 13.33rpx #F7F7F7 solid;
padding:0 26.67rpx;
}
.msg_item{
padding-top: 42.67rpx;
padding-bottom: 28rpx;
border-bottom: 1px solid #E2E2E2;
.msg_time{
font-size: 25.33rpx;
font-weight: 400;
text-align: center;
margin-bottom: 41.33rpx;
}
.msg_title{
font-size: 28rpx;
margin-bottom: 20rpx;
}
.msg_content{
color: #555555;
font-size: 25.33rpx;
font-weight: 400;
}
.msg_img{
margin-top: 37.33rpx;
background-color: #FEF6F4;
width: 100%;
height: 281.33rpx;
}
}
.msg_item:last-child{
border-bottom: none;
}
</style>

8
pages/index/index.vue

@ -5,9 +5,11 @@
<view class="navigation page_padding">
<view class="navigation_title" :class="isScrollShow?'isScrollShow':'' ">
<template v-if="!isScrollShow ">
<uni-badge :text="5" type="error" absolute="rightTop">
<img src="/static/img/msg.png" alt="">
</uni-badge>
<navigator url="/pages/account/message" class="order_info_item">
<uni-badge :text="5" type="error" absolute="rightTop">
<img src="/static/img/msg.png" alt="">
</uni-badge>
</navigator>
<text>Dope plus</text>
</template>

143
pages/login/index.vue

@ -0,0 +1,143 @@
<template>
<view>
<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">
<uni-forms ref="dynamicForm" :rules="dynamicRules" :modelValue="dynamicFormData">
<uni-forms-item label="" name="email">
<input type="text" class="login_input" placeholder="eamil address">
</uni-forms-item>
<uni-forms-item label="" name="pwd">
<input type="text" class="login_input" placeholder="password">
</uni-forms-item>
</uni-forms>
<view class="tips">Forgot your Password?</view>
<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="" v-show="current==1">
</view>
<view class="mode">
<view class="mode_title">or continue with</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
items: ['SIGN IN', 'REGISTER'],
current: 0,
dynamicFormData:{
email:'',
pwd:''
},
dynamicRules: {
email: {
rules: [{
required: false,
errorMessage: '域名不能为空'
}, {
format: 'email',
errorMessage: '域名格式错误'
}]
}
},
}
},
methods:{
onClickItem(e) {
if (this.current != e.currentIndex) {
this.current = e.currentIndex;
}
}
}
}
</script>
<style lang="scss" scoped>
.select{
margin-top: 145.33rpx;
font-size: 33.33rpx;
font-weight: bold;
margin-bottom: 80rpx;
}
.body{
padding: 0 32rpx;
}
.login{
.login_input{
height: 97.33rpx;
border: 1px solid #323333;
border-radius: 48.67rpx;
font-size: 22.67rpx;
padding-left: 33.33rpx;
}
.tips{
font-size: 22.67rpx;
color: #666666;
margin-top: 73.33rpx;
text-align: right;
margin-bottom: 34.67rpx;
}
.login_submit{
width: 100%;
height: 88rpx;
background-color: #000000;
color: white;
border-radius: 6.67rpx;
margin-bottom: 52rpx;
font-weight: bold;
}
.agreement{
display: flex;
// align-items: center;
// padding: 0 33.33rpx;
font-size: 24rpx;
font-weight: bold;
.agreement_image{
width: 24rpx;
height: 24rpx;
margin-right: 13.33rpx;
}
.text{
color: #4F92F1;
}
}
}
.mode{
position: fixed;
bottom: 138.67rpx;
width: 100%;
.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: 50%;
top: 50%;
}
}
}
</style>
Loading…
Cancel
Save