红点 这找曾

pageD/attention/attention.vue

@@ -1,15 +1,18 @@
 <template>
 	<view class="attention">
 		<view class="attention_box" v-for="(item,index) in attention" :key="index" @click="navto(item.friend_tomid)">
-			<view>
+			<view style="position:relative">
 				<image :src="item.friend_tomavatar" mode="aspectFill"></image>
+				<view class="tishi" v-if="item.unread_message"></view>
 			</view>
 			<view>{{item.friend_tomname}}</view>
 			<view>{{item.live_status ? '正在直播' : '未直播'}}</view>
-			<view  class="cur_two"  @click="tapClick(index)" v-if = "item.about == 1">已关注</view>
-			<view class="cur"   @click="tapClick(index)" v-else = "item.about == 2">未关注</view>
+			<view  class="cur_two"  @click="tapClick(index)">已关注</view>
+			<!-- <view class="cur"   @click="tapClick(index)" v-else = "item.about == 2">未关注</view> -->
 		</view>
+		<u-loadmore :status="status" icon-type="iconType" :load-text="loadText" />
 	</view>
+	
 </template>
 
 <script>
@@ -19,9 +22,20 @@
 			return {
 				rSelect:[],
 				type : '未关注',
-				attention: []
+				attention: [],
+				page:1,
+				status:'loadmore'
 			};
 		},
+		onReachBottom(){
+			if(this.status == 'loading' || this.status == 'nomore'){
+				return ;
+			}else{
+				this.status = "loading"
+				this.page++
+				this.snsfriendList()
+			}
+		},
 		onLoad(){
 			this.snsfriendList()
 		},
@@ -37,8 +51,17 @@
 				}
 			},
 			snsfriendList(){
-				this.$u.api.snsfriendList({}).then((res)=>{
-					this.attention = res.data;
+				this.$u.api.snsfriendList({page:this.page}).then((res)=>{
+					console.log(res)
+					if(this.page > 1){
+						this.attention.push(...res.data.data)
+					}else{
+						this.attention = res.data.data;
+					}
+					this.status = "loadmore"
+					if(res.data.data.length < 15){
+						this.status = "nomore"
+					}
 				})
 			},
 			navto(id){
@@ -58,6 +81,15 @@
 </script>
 
 <style lang="scss" scoped>
+	.tishi{
+		position: absolute;
+		top: 5rpx;
+		left: 80rpx;
+		background-color: #ff5d00;
+		width: 12rpx;
+		height: 12rpx;
+		border-radius: 50%;
+	}
 	.attention {
 		 display: flex;
 		flex-wrap: wrap;