no message

components/en-utils/en-nav/en-nav.vue

@@ -130,8 +130,14 @@
     .flexbox {
       display: flex;
       justify-content: space-between;
+	  align-items: center;
       padding: 0 12px;
+	  position: relative;
+	  
       .left-button{
+		 position: absolute;
+		 left: 16rpx;
+		 top: 10rpx;
         .back-img{
           width: 40rpx;
           height: 40rpx;
@@ -141,6 +147,8 @@
         color: #333333;
       }
       .title-text {
+		  width: 100%;
+		  text-align: center;
         font-size: 36rpx;
         font-weight: 600;
       }
@@ -150,8 +158,9 @@
       }
 
       .button {
-        position: relative;
-        z-index: 5;
+        position: absolute;
+		right: 16rpx;
+        // z-index: 5;
         // width: 21px;
         .rightName {
           font-size: 32rpx;

pages.json

@@ -377,6 +377,20 @@
 	    "enablePullDownRefresh": false,
 		"navigationBarTextStyle": "white"
 	  }
+	},
+	{
+	  "path": "pages/wallet/like-user",
+	  "style": {
+	    "navigationBarTitleText": "",
+	    "enablePullDownRefresh": false
+	  }
+	},
+	{
+	  "path": "pages/wallet/visitor",
+	  "style": {
+	    "navigationBarTitleText": "",
+	    "enablePullDownRefresh": false
+	  }
 	}
   ],
   "globalStyle": {

pages/my/index.vue

@@ -41,18 +41,17 @@
                 </view>
                 <view class="statistics-text sys-color-gray-9 sys-weight-400">礼物墙</view>
               </view>
-              <view class="statistics-item">
+              <view class="statistics-item" @click="goToUrl(5)">
                 <view class="statistics-num sys-color-black sys-weight-600">431
                   <view class="statistics-dot sys-color-white">1</view>
                 </view>
                 <view class="statistics-text sys-color-gray-9 sys-weight-400">心动足迹</view>
               </view>
-              <view class="statistics-item">
+              <view class="statistics-item" @click="goToUrl(6)">
                 <view class="statistics-num sys-color-black sys-weight-600">431
                   <view class="statistics-dot sys-color-white">1</view>
                 </view>
                 <view class="statistics-text sys-color-gray-9 sys-weight-400">访客</view>
-
               </view>
               <view class="statistics-item">
                 <view class="statistics-num sys-color-black sys-weight-600">
@@ -151,6 +150,16 @@ export default {
 		  uni.navigateTo({
 		    'url':'/pages/wallet/gift-wall'
 		  })
+	  }else if(type === 5){
+		  // 喜欢的人
+		  uni.navigateTo({
+		    'url':'/pages/wallet/like-user'
+		  })
+	  }else if(type === 6){
+		  // 喜欢的人
+		  uni.navigateTo({
+		    'url':'/pages/wallet/visitor'
+		  })
 	  }
     }
   }

pages/wallet/gift-wall.vue

@@ -3,29 +3,64 @@
 		<Nav title='礼物墙' titleColor='#fff' bgckgroundBox='#141414'></Nav>
 		<view class="info-box box-sizing-border">
 			<view class="box-head">
-				
+				<view class="head-left">
+					<image src="../../static/img/circle/1.png" mode="scaleToFill"></image>
+					<view class="">
+						<view class="sys-size-32 sys-weight-600 sys-color-white sys-webkit-box head-name">1111111111我我我我我我我</view>
+						<view class="">
+							<text class="sys-size-24 sys-color-gray-9">礼物收益：</text>
+							<text class="sys-color-yellow sys-size-24">1波点</text>
+						</view>
+					</view>
+				</view>
+				<view class="head-right sys-size-28 sys-color-gray-3 sys-radius-200 sys-background-yellow">波点兑换</view>
+			</view>
+			<view class="box-nav">
+				<view class="sys-size-32 nav-name" :class="navId === item.id?'s-view':'n-view'"
+				v-for="(item,i) in navList" :key="i" @click="selectFun(item,i)">{{item.name}}</view>
+				<view class="xian" :class="navIndex===0?'left-1':'left-2'"></view>
 			</view>
 			<scroll-view scroll-y="true" class="list-scroll" @scrolltolower="scrolltolower">
-				<view></view>
+				<view class="list-home">
+					<view class="list-box box-sizing-border"
+					v-for="(item,i) in list" :key="i">
+						<image :src="item.url" mode="aspectFill" :class="item.num>0?'':'c-view'"></image>
+						<view class="sys-size-28 sys-color-white" :class="item.num>0?'':'c-view'">心动信号</view>
+						<view class="sys-size-20 sys-color-white" :class="item.num>0?'':'c-view'">x{{item.num}}</view>
+					</view>
+					<view class="list-only" v-if="list.length>3&&list.length%3!=0"></view>
+				</view>
 			</scroll-view>
 		</view>
 	</view>
-</template>
+</template>	
 
 <script>
 	export default {
 		data(){
 			return{
 				info:{},
-				list:[],
+				list:[
+					{'num':1,'url':'/static/img/temporary/gift1.png'},
+					{'num':0,'url':'/static/img/temporary/gift2.png'},
+					{'num':0,'url':'/static/img/temporary/gift3.png'},
+				],
+				
 				total:0,
 				page:1,
+				navList:[{name:'心动礼物',id:1,},{name:'排队礼物',id:2,}],
+				navId:1,
+				navIndex:0,
 			}
 		},
 		methods:{
 			scrolltolower(){
 				console.log('触底');
-			}
+			},
+			selectFun(item,i){
+				this.navId = item.id;
+				this.navIndex = i;
+			},
 		}
 	}
 </script>
@@ -39,7 +74,90 @@
 			display: flex;
 			flex-direction: column;
 			.box-head{
-				
+				display: flex;
+				justify-content: space-between;
+				align-items: center;
+				.head-left{
+					display: flex;
+					align-items: center;
+					image{
+						width: 168rpx;
+						height: 168rpx;
+						border-radius: 50%;
+						margin-right: 34rpx;
+					}
+					.head-name{
+						width: 252rpx;
+						margin-bottom: 10rpx;
+					}
+				}
+				.head-right{
+					width: 142rpx;
+					height: 52rpx;
+					line-height: 52rpx;
+					text-align: center;
+				}
+			}
+			.box-nav{
+				margin-top: 44rpx;
+				display: flex;
+				position: relative;
+				.xian{
+					position: absolute;
+					width: 48rpx;
+					height: 4rpx;
+					background-color: #fff;
+					bottom: 0;
+				}
+				.left-1{
+					left: 40rpx;
+					transition: all 0.5s; 
+				}
+				.left-2{
+					left: 210rpx;
+					transition: all 0.5s; 
+				}
+				.nav-name{
+					margin-right: 40rpx;
+					padding-bottom: 20rpx;
+				}
+				.s-view{
+					color: #fff;
+				}
+				.n-view{
+					color: #707070;
+				}
+			}
+			.list-scroll{
+				height: 100%;
+				overflow: auto;
+				padding-top: 20rpx;
+				.list-home{
+					display: flex;
+					justify-content: space-between;
+					flex-flow: row wrap;
+				}
+				.list-box{
+					width: 212rpx;
+					height: 292rpx;
+					background: #3D3D3D;
+					border-radius: 20rpx;
+					margin-bottom: 34rpx;
+					text-align: center;
+					padding-top: 32rpx;
+					image{
+						width: 120rpx;
+						height: 120rpx;
+						margin-bottom: 20rpx;
+					}
+					.c-view{
+						filter: grayscale(100%);
+					}
+				}
+				.list-only{
+					width: 212rpx;
+					height: 292rpx;
+				}
 			}
 		}
 	}

pages/wallet/like-user.vue

@@ -0,0 +1,157 @@
+<template>
+	<view class="like-user flex-common-css box-sizing-border iPhone-bottom">
+		<Nav title='喜欢的人' titleColor='#333' :rightShow='true' :rightType='2'>
+			<template v-slot:right>
+				<image @click="to(1)" class="nav-img" src="@/static/img/wallet/sd.png" mode="aspectFill"></image>
+			</template>
+		</Nav>
+		<view class="like-text">
+			<image src="@/static/img/wallet/h.png" mode="aspectFill"></image>
+			<text class="sys-size-28 sys-color-gray-3">送出小花，搭讪心仪的他</text>
+		</view>
+		
+		<view v-if="false" class="no-list sys-size-28 sys-color-gray-9">暂无心动</view>
+		<scroll-view v-else scroll-y="true" class="list-scroll box-sizing-border" @scrolltolower="scrolltolower">
+			<view class="list-home">
+				<view class="list-box" v-for="(item,i) in 10" :key="i">
+					<image class="image-bg" src="@/static/img/circle/1.png" mode="scaleToFill"></image>
+					<image class="image-left" src="@/static/img/wallet/note.png" mode="scaleToFill"></image>
+					<!-- <image class="image-type type-1" src="@/static/img/wallet/vip.png" mode="scaleToFill"></image> -->
+					<image class="image-type type-2" src="@/static/img/wallet/svip.png" mode="scaleToFill"></image>
+					
+					<view class="list-info box-sizing-border">
+						<view class="">
+							<view class="info-name sys-size-36 sys-color-white sys-weight-600 sys-webkit-box">仰看辉煌仰看辉煌仰看辉煌</view>
+							<view class="sys-size-24 sys-color-white">18/女/处女座</view>
+						</view>
+						<view class="info-right" @click="to(2)">	
+							<image src="@/static/img/wallet/h.png" mode="aspectFill"></image>
+						</view>
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data(){
+			return{
+				page:1,
+				total:0,
+				list:[],
+			}
+		},
+		methods:{
+			scrolltolower(){
+				// 触底
+			},
+			to(type){
+				if(type === 1){
+					console.log('曝光');
+				}else if(type === 2){
+					// 送花
+				}
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.like-user{
+		.nav-img{
+			width: 52rpx;
+			height: 52rpx;
+		}
+		.like-text{
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			margin: 24rpx 0;
+			image{
+				width: 40rpx;
+				height: 40rpx;
+				margin-right: 12rpx;
+			}
+		}
+		.no-list{
+			margin-top: 100rpx;
+			text-align: center;
+		}
+		.list-scroll{
+			flex: 1;
+			overflow: auto;
+			padding: 0 32rpx;
+			
+			.list-home{
+				display: flex;
+				justify-content: space-between;
+				flex-flow: row wrap;
+			}
+			.list-box{
+				width: 334rpx;
+				height: 504rpx;
+				border-radius: 20rpx;
+				margin-bottom: 18rpx;
+				position: relative;
+				.list-info{
+					width: 334rpx;
+					padding: 24rpx;
+					z-index: 14;
+					position: absolute;
+					bottom: 0;
+					display: flex;
+					justify-content: space-between;
+					.info-name{
+						width: 200rpx;
+						margin-bottom: 4rpx;
+					}
+					.info-right{
+						width: 80rpx;
+						height: 80rpx;
+						background-color: #fff;
+						border-radius: 50%;
+						text-align: center;
+						image{
+							width: 52rpx;
+							height: 52rpx;
+							margin-top: 14rpx;
+						}
+					}
+				}
+				.image-bg{
+					position: absolute;
+					top: 0;
+					left: 0;
+					width: 334rpx;
+					height: 504rpx;
+					border-radius: 20rpx;
+					z-index: 10;
+				}
+				.image-left{
+					position: absolute;
+					top: 0;
+					left: 0;
+					width: 134rpx;
+					height: 44rpx;
+					z-index: 11;
+				}
+				.image-type{
+					position: absolute;
+					top: 0;
+					right: 0;
+					z-index: 12;
+				}
+				.type-1{
+					width: 48rpx;
+					height: 28rpx;
+				}
+				.type-2{
+					width: 64rpx;
+					height: 28rpx;
+				}
+			}
+		}
+	}
+</style>

pages/wallet/visitor.vue

@@ -0,0 +1,101 @@
+<template>
+	<view class="visitor flex-common-css box-sizing-border iPhone-bottom">
+		<Nav title='最近访客' titleColor='#333' :rightShow='true' :rightType='2'>
+			<template v-slot:right>
+				<view class="add-view">
+					<image src="@/static/img/wallet/add.png" mode="aspectFill"></image>
+					<view class="sys-size-24 sys-color-gray-3 sys-weight-600">增加来访</view>
+				</view>
+			</template>
+		</Nav>
+		
+		<view v-if="false" class="no-list sys-size-28 sys-color-gray-9">暂无访客</view>
+		
+		<scroll-view v-else scroll-y="true" class="list-scroll box-sizing-border" @scrolltolower="scrolltolower">
+			<view class="list-home">
+				<view class="list-box box-sizing-border">
+					<view class="box-head">
+						<image src="@/static/img/circle/1.png" mode="aspectFill"></image>
+						<view class="head-icon">√</view>
+					</view>
+					<view class="box-right">
+						
+					</view>
+				</view>
+			</view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		methods:{
+			scrolltolower(){
+				// 触底
+			},
+		},
+	}
+</script>
+
+<style scoped lang="scss">
+	.visitor{
+		.add-view{
+			width: 154rpx;
+			height: 52rpx;
+			background: #F2F2F2;
+			border-radius: 200rpx;
+			display: flex;
+			align-items: center;
+			line-height: 52rpx;
+			image{
+				width: 40rpx;
+				height: 40rpx;
+				margin: 0 4rpx;
+			}
+		}
+		.no-list{
+			margin-top: 100rpx;
+			text-align: center;
+		}
+		.list-scroll{
+			flex: 1;
+			overflow: auto;
+			padding: 32rpx;
+			.list-home{
+				.list-box{
+					display: flex;
+					.box-head{
+						width: 112rpx;
+						height: 112rpx;
+						position: relative;
+						margin-right: 20rpx;	
+						image{
+							width: 112rpx;
+							height: 112rpx;
+							border-radius: 50%;
+						}
+						.head-icon{
+							position: absolute;
+							right: 0;
+							bottom: 0;
+							z-index: 10;
+							width: 25rpx;
+							height: 25rpx;
+							border-radius: 50%;
+							border: 2rpx solid #fff;
+						}
+						.view-1{
+							background: #FEC631;
+						}
+						.view-1{
+							background: #4BC285;
+						}
+					}
+					.box-right{
+						flex: 1;
+					}
+				}
+			}
+		}
+	}
+</style>