diff --git a/pages/tab/activity.vue b/pages/tab/activity.vue
index faf0f2e08a0e8100912a5047ee216e1a7d38a013..bc260e997d2a9974f01867d5f8c0e49865bb608b 100644
--- a/pages/tab/activity.vue
+++ b/pages/tab/activity.vue
@@ -1,36 +1,47 @@
<template>
<view style="background: #F4F5F9;min-height: 100vh">
-<!-- è½®æ’图 åŽé¢æ”¾banner里的图-->
- <view class="box">
+ <!-- z-paging是一个分页组件-->
+ <z-paging ref="paging" empty-view-text="迈出第一æ¥æ‰æœ‰æ›´å¤šæ•…事å‘生哦"
+ :empty-view-title-style="{
+ 'font-size': '32rpx',
+ 'color': '#C9C9D0',
+ 'position': 'absolute',
+ 'width': '100vw',
+ }" :empty-view-img="baseUrl+'/common/empty.png'" :empty-view-img-style="{
+ 'position': 'absolute',
+ 'top': '210rpx',
+ 'width': '447rpx',
+ 'height': '375rpx'
+ }" v-model="dataList" @query="queryList" :fixed="true" :auto-show-back-to-top="true" :back-to-top-with-animate="false">
+ <view class="box">
<view class="swiper">
<ls-swiper :list="bannerList" imgKey="" :loop="true" :dots="true" :autoplay="true" :height="200" />
</view>
</view>
-<!-- 活动列表-->
- <view class="card" v-for="(item,index) in activityList" :key="index" @click="gotopage(item)">
- <view class="contentBody">
- <view class="leftlist">
- <image :src="item.url" class="leftlistimage"/>
- </view>
- <view class="rightlist">
- <view class="rightlist-title">{{item.title}}</view>
- <view class="rightlist-time">
- <view class="timeicon">
- <u-icon name="clock" color="#666666;" size="15"></u-icon>
- </view>
- <view class="timetext">{{item.publishDate}}</view>
+ <view class="card" v-for="(item,index) in dataList" :key="index" @click="gotopage(item)">
+ <view class="contentBody">
+ <view class="leftlist">
+ <image :src="item.url" class="leftlistimage"/>
</view>
- <view class="rightlist-address">
- <view class="addressicon">
- <u-icon name="tags" color="#D84848;" size="15"></u-icon>
+ <view class="rightlist">
+ <view class="rightlist-title">{{item.title}}</view>
+ <view class="rightlist-time">
+ <view class="timeicon">
+ <u-icon name="clock" color="#666666;" size="15"></u-icon>
+ </view>
+ <view class="timetext">{{item.publishDate}}</view>
+ </view>
+ <view class="rightlist-address">
+ <view class="addressicon">
+ <u-icon name="tags" color="#D84848;" size="15"></u-icon>
+ </view>
+ <view class="addresstext" v-if="item.summary">{{item.summary}}</view>
+ <view class="addresstext" v-else>-</view>
</view>
- <view class="addresstext" v-if="item.summary">{{item.summary}}</view>
- <view class="addresstext" v-else>-</view>
</view>
</view>
</view>
- </view>
- <view style="background: #F4F5F9;" class="bussiness-nomore">~ 没有更多啦 ~</view>
+ </z-paging>
</view>
</template>
@@ -45,6 +56,8 @@ export default {
},
data() {
return {
+ //分页æ’件å˜å‚¨æ•°æ®çš„å˜é‡
+ dataList:[],
//图片路径
baseUrl: this.$IMG_URL,
//分页查询å‚æ•°
@@ -55,101 +68,51 @@ export default {
//bannerè½®æ’图
bannerList:[],
//活动列表
- activityList: [
- {
- name:'测试1',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试2',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试3',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试4',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试5',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试6',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试6',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试6',
- createTime:'2024-10-12',
- address:'天津'
- },
- {
- name:'测试6',
- createTime:'2024-10-12',
- address:'天津'
- }
- ],
- showArrowDown: true,
- showTabbar: true,
- scrollTop: 0,
+ activityList: [],
};
},
onShow() {
this.getBannerList()
- this.getActivityList()
},
methods: {
- //获å–Banner列表
- getBannerList() {
+ queryList(pageNo, pageSize) {
const query = {
- page: this.queryParam.page,
- rows: this.queryParam.rows
+ page:pageNo,
+ rows:pageSize,
+ publishStatus:'1'
}
- bannerList(query).then(res =>{
- let imgList = []
- res.data.data.forEach(item => {
+ activityList(query).then(res =>{
+ this.activityList = res.data.data
+ this.activityList.forEach(item => {
getOssUrl(item.pictureId).then(imgRes => {
if (imgRes.data.data != null) {
imgRes.data.data = imgRes.data.data.replace(/\\/g, "/");
- imgList.push(imgRes.data.data)
+ item.url = imgRes.data.data
}
})
})
- this.bannerList = imgList
+ this.$refs.paging.completeByTotal(this.activityList,res.data.total);
}).catch(e => {
console.log(e)
})
},
- //获å–活动列表
- getActivityList() {
+ //获å–Banner列表
+ getBannerList() {
const query = {
- page:this.queryParam.page,
- rows:this.queryParam.rows,
- publishStatus:'1'
+ page: this.queryParam.page,
+ rows: this.queryParam.rows
}
- activityList(query).then(res =>{
- this.activityList = res.data.data
- this.activityList.forEach(item => {
+ bannerList(query).then(res =>{
+ let imgList = []
+ res.data.data.forEach(item => {
getOssUrl(item.pictureId).then(imgRes => {
if (imgRes.data.data != null) {
imgRes.data.data = imgRes.data.data.replace(/\\/g, "/");
- item.url = imgRes.data.data
+ imgList.push(imgRes.data.data)
}
})
})
+ this.bannerList = imgList
}).catch(e => {
console.log(e)
})
@@ -165,74 +128,6 @@ export default {
</script>
<style lang="scss" scoped>
-.bussiness-nomore{
- text-align: center;
- padding: 42rpx 0;
- font-size: 13px;
- font-family: Source Han Sans CN-Regular, Source Han Sans CN;
- font-weight: 400;
- color: #B9B9B9;
-}
-
-@keyframes leftMove {
- 0% {
- left: -130rpx;
- }
-
- 100% {
- left: 0;
- }
-}
-
-@keyframes rightMove {
- 0% {
- right: -130rpx;
- }
-
- 100% {
- right: 0;
- }
-}
-
-
-@keyframes topHide {
- 0% {
- top: 50%;
- width: 0;
- height: 0;
- }
-
- 70% {
- top: 18%;
- width: 100rpx;
- height: 100rpx;
- }
-
- 80% {
- top: 18%;
- width: 100rpx;
- height: 100rpx;
- }
-
- 90% {
- top: 20%;
- width: 80rpx;
- height: 80rpx;
- }
-
- 100% {
- top: 20%;
- wixdth: 0;
- height: 0;
- }
-}
-
-
-page {
- width: 100%;
- height: 100vh;
-}
-
.card {
background-color: white;
width: 680rpx;
@@ -351,82 +246,7 @@ page {
.box {
.swiper {
position: relative;
-
- .hint {
- position: absolute;
- top: 46rpx;
- right: 34rpx;
- width: 202rpx;
- height: 62rpx;
- background: rgba(255, 255, 255, 0.2);
- border-radius: 34rpx;
- display: flex;
- justify-content: center;
- align-items: center;
-
- image {
- width: 24rpx;
- height: 28rpx;
- }
-
- .t {
- font-size: 28rpx;
- font-weight: 400;
- color: #333333;
- margin-left: 14rpx;
- }
- }
}
-
- .lable {
- display: flex;
- align-items: center;
-
- font-size: 28rpx;
- font-family: PingFang SC-Regular, PingFang SC;
- font-weight: 400;
- color: #434343;
- margin-left: 50rpx;
- margin-top: 48rpx;
-
- .lable-div {
- height: 54rpx;
- background: #e5f4ff;
- border-radius: 28rpx;
- line-height: 54rpx;
- padding: 0 38rpx;
- }
- }
-
- .line {
- width: 636rpx;
- // height: 2rpx;
- // background-color: #c8d3e2;
- // border-bottom: 2rpx dashed #c8d3e2;
- margin: 0 auto;
- margin-top: 44rpx;
- }
-
- .circles {
- background: #f5f6fa;
- width: 44rpx;
- height: 44rpx;
- border-radius: 50%;
- position: absolute;
- right: -22rpx;
- top: 1002rpx;
- }
-
- .circle {
- background: #f5f6fa;
- width: 44rpx;
- height: 44rpx;
- border-radius: 50%;
- position: absolute;
- left: -22rpx;
- top: 1002rpx;
- }
-
width: 686rpx;
margin: 0 auto;
border-radius: 42rpx 42rpx 24rpx 24rpx;
@@ -434,137 +254,8 @@ page {
z-index: 10;
position: relative;
background: #fff;
-
- .ling {
- height: 42rpx;
- display: flex;
- align-items: center;
- margin-left: 58rpx;
- margin-top: 24rpx;
-
- .img {
- height: 42rpx;
- width: 42rpx;
- margin-right: 8rpx;
- }
-
- .text {
- height: 34rpx;
- font-size: 24rpx;
- font-family: PingFang SC-Regular, PingFang SC;
- font-weight: 400;
- color: #333333;
- line-height: 34rpx;
- }
- }
-
- .box-bq {
- height: 40rpx;
- font-size: 28rpx;
- font-family: PingFang SC-Bold, PingFang SC;
- font-weight: bold;
- color: #333333;
- margin-left: 58rpx;
- margin-top: 24rpx;
- line-height: 40rpx;
- display: flex;
- align-items: center;
-
- .xian {
- width: 2rpx;
- height: 20rpx;
- background: #e0e2e8;
- margin: 0 32rpx;
- }
- }
-
- .box-name {
- .simg {
- width: 48rpx;
- height: 48rpx;
- margin-left: 20rpx;
- }
-
- height: 56rpx;
- font-size: 40rpx;
- font-family: PingFang SC-Heavy,
- PingFang SC;
- font-weight: 800;
- color: #4a4a4a;
- line-height: 56rpx;
- margin-left: 58rpx;
- margin-top: 24rpx;
- display: flex;
- align-items: center;
-
- image {
- width: 48rpx;
- height: 48rpx;
- margin-left: 20rpx;
- margin-top: 5rpx;
- }
- }
-
- .box-jj {
- .box-jj-ta {
- width: 618rpx;
- height: 58rpx;
- background: #f5f6fa;
- border-radius: 30rpx 30rpx 30rpx 30rpx;
- margin: 0 auto;
- margin-top: 32rpx;
- display: flex;
- align-items: center;
- justify-content: space-between;
-
- .text2 {
- height: 34rpx;
- font-size: 24rpx;
- font-family: PingFang SC-Regular, PingFang SC;
- font-weight: 400;
- color: #333333;
- line-height: 34rpx;
- margin-right: 28rpx;
- }
-
- .box-jj-ta-left {
- display: flex;
- align-items: center;
-
- .xian {
- width: 2rpx;
- height: 20rpx;
- background: #e0e2e8;
- margin: 0 18rpx;
- }
-
- .te {
- height: 34rpx;
- font-size: 24rpx;
- font-family: PingFang SC-Regular, PingFang SC;
- font-weight: 400;
- color: #333333;
- line-height: 34rpx;
- }
-
- .img {
- width: 24rpx;
- height: 24rpx;
- margin: 0 18rpx 0 26rpx;
- }
- }
- }
-
- width: 100%;
- height: auto;
- background-color: #fff;
- position: relative;
- }
}
-.pageanima {
- position: relative;
-}
.pagePop {
animation-name: pagePop; // 动画å称
@@ -573,17 +264,4 @@ page {
animation-duration: 0.5s; // 动画完æˆæ—¶é—´
}
-@keyframes pagePop {
- 0% {
- top: 100rpx;
- opacity: 0.5;
- }
-
- 100% {
- top: 0;
- opacity: 1;
- }
-}
-
-
</style>
diff --git a/pages/tab/my.vue b/pages/tab/my.vue
index 0ea98e5559301a8712438410d20447366907084b..53fbba465a3e1624fa36db7ca5986e55186cba90 100644
--- a/pages/tab/my.vue
+++ b/pages/tab/my.vue
@@ -44,7 +44,7 @@
<text v-else>0</text>
</view>
<view class="top-tabs">
- <view class="tab-1" @click="gotolike(1,info.meFollowCount)">
+ <view class="tab-1" @click="gotolike(1)">
<view class="tab-1-num">
<text v-if="info.meFollowCount">{{info.meFollowCount}}</text><text v-else>0</text>
</view>
@@ -52,7 +52,7 @@
我喜欢的
</view>
</view>
- <view class="tab-2" style="margin: 0 136rpx;" @click="gotolike(2,info.followMeCount)">
+ <view class="tab-2" style="margin: 0 136rpx;" @click="gotolike(2)">
<view class="tab-2-num">
<text v-if="info.followMeCount">{{info.followMeCount}}</text><text v-else>0</text>
</view>
@@ -60,7 +60,7 @@
喜欢我的
</view>
</view>
- <view class="tab-3" @click="gotolike(3,info.eachFollowCount)">
+ <view class="tab-3" @click="gotolike(3)">
<view class="tab-3-num">
<text v-if="info.eachFollowCount">{{info.eachFollowCount}}</text><text v-else>0</text>
</view>
@@ -385,11 +385,13 @@ import {articleList, getOssUrl} from "../../api/article";
url: "/pagesme/me/doubleauth"
})
},
- gotolike(type,num) { //喜欢三个列表页é¢
+ //跳转我喜欢的 喜欢我的 互相喜欢的三个列表页é¢
+ gotolike(type,num) {
uni.navigateTo({
- url: "/pagesme/me/likeList?type="+type+'&num='+num
+ url: "/pagesme/me/likeList?type="+type
})
},
+ //æ“作项跳转
whether(i) {
if (i == 0) {
uni.navigateTo({
diff --git a/pagesUser/userList.vue b/pagesUser/userList.vue
index 994dec07c18a8afeb31f7c0d789db8279f2db19c..e9e7c7a2d10792728da6b0b3634d3d89a326adf3 100644
--- a/pagesUser/userList.vue
+++ b/pagesUser/userList.vue
@@ -1,6 +1,5 @@
<template>
- <view style="background-color: #F4F5F9;min-height: 100vh;">
- <!-- 页头-->
+ <view class="content">
<u-navbar bgColor="white" :placeholder="true" title="会员信æ¯">
<view class="u-nav-slot" slot="left">
<u-icon name="arrow-left" color="black" size="20" @click="backbar"/>
@@ -10,33 +9,44 @@
</view>
</view>
</u-navbar>
- <view class="recommendation" :style="{'top':navHeight+'px'}">
- <view v-if="isdata" class="nodatacard">
- <view class="text">æš‚æ— æ•°æ®</view>
- </view>
- <view class="card">
- <view class="recommendation-card" v-for="item in userList" @click="gotoDetail(item)">
- <view class="card-image">
- <image class="img" :src="item.avatarUrl"/>
- </view>
- <view class="card-bottom">
- <view class="bottom-left">
- <view class="bottom-info">
- {{item.memNickName}}
- <image v-if="item.memSex == 'ç”·'" class="gender" :src="baseUrl+'/user/male.png'" mode=""/>
- <image v-else class="gender" :src="baseUrl+'/user/famale.png'" mode=""/>
- </view>
- <view class="bottom-info">
- {{ item.memAge }}å²
- <text style="margin-left: 10rpx;margin-right: 10rpx;color: #BBB9B9FF;">|</text>
- {{item.memHeight}}cm
+ <!-- z-paging是一个分页组件-->
+ <z-paging ref="paging" empty-view-text="迈出第一æ¥æ‰æœ‰æ›´å¤šæ•…事å‘生哦"
+ :empty-view-title-style="{
+ 'font-size': '32rpx',
+ 'color': '#C9C9D0',
+ 'position': 'absolute',
+ 'width': '100vw',
+ }" :empty-view-img="baseUrl+'/common/empty.png'" :empty-view-img-style="{
+ 'position': 'absolute',
+ 'top': '210rpx',
+ 'width': '447rpx',
+ 'height': '375rpx'
+ }" v-model="dataList" @query="queryList" :fixed="true" :auto-show-back-to-top="true" :back-to-top-with-animate="false">
+ <view class="recommendation" :style="{'top':navHeight+'px'}">
+ <view class="card">
+ <view class="recommendation-card" v-for="item in dataList" @click="gotoDetail(item)">
+ <view class="card-image">
+ <image class="img" :src="item.avatarUrl"/>
+ </view>
+ <view class="card-bottom">
+ <view class="bottom-left">
+ <view class="bottom-info">
+ {{item.memNickName}}
+ <image v-if="item.memSex == 'ç”·'" class="gender" :src="baseUrl+'/user/male.png'" mode=""/>
+ <image v-else class="gender" :src="baseUrl+'/user/famale.png'" mode=""/>
+ </view>
+ <view class="bottom-info">
+ {{ item.memAge }}å²
+ <text style="margin-left: 10rpx;margin-right: 10rpx;color: #BBB9B9FF;">|</text>
+ {{item.memHeight}}cm
+ </view>
+ <view class="bottom-address">{{item.city}}</view>
</view>
- <view class="bottom-address">{{item.city}}</view>
</view>
</view>
</view>
</view>
- </view>
+ </z-paging>
</view>
</template>
@@ -48,19 +58,14 @@ import {getOssUrl} from "../api/article";
export default {
data() {
return {
+ //分页æ’件å˜å‚¨æ•°æ®çš„å˜é‡
+ dataList:[],
//图片路径
baseUrl: this.$IMG_URL,
- //分页查询å‚æ•°
- queryParam:{
- page:1,
- rows:10
- },
//用户列表
userList:[],
//是å¦æœ‰æ•°æ®
isdata: false,
- //页é¢æ•°æ®çš„æ•°é‡
- num:'',
//è·ç¦»è¡¨å¤´é«˜åº¦
navHeight:'',
menuButtonInfo: '',
@@ -84,53 +89,15 @@ export default {
this.navHeight = (height + statusBarHeight + (margin * 5)) //导航æ 总高
}
})
- //获å–用户信æ¯
- this.getUserList()
},
methods: {
- filterSearch(value) {
- let minHeight = ''
- let maxHeight = ''
- let minWeight = ''
- let maxWeight = ''
- if (value.memHeight != '' && value.memHeight != 'ä¸é™'){
- minHeight = value.memHeight.split('-')[0]
- maxHeight = value.memHeight.split('-')[1]
- }
- if (value.memWeight != '' && value.memWeight != 'ä¸é™'){
- minWeight = value.memWeight.split('-')[0]
- maxWeight = value.memWeight.split('-')[1]
+ //获å–用户信æ¯åˆ—表
+ queryList(pageNo, pageSize) {
+ const params = {
+ page: pageNo,
+ rows: pageSize
}
- console.log('======params======', value)
- this.queryParam = {
- page: 1,
- rows: 10,
- memSex: value.memSex,
- minHeight: minHeight,
- maxHeight: maxHeight,
- minWeight: minWeight,
- maxWeight: maxWeight,
- memResidenceProvince: value.memResidenceProvince,
- memResidenceCity: value.memResidenceCity
- }
- this.getUserList()
- },
- //左上角的æœç´¢
- search() {
- //判æ–当å‰æ˜¯å¦å·²ç™»å½•
- uni.navigateTo({
- url: '/pagesUser/userFilterPage'
- });
- },
- //跳转用户详情
- gotoDetail(item){
- uni.navigateTo({
- url: '/pagesUser/userInfo?memberId='+item.businessId
- })
- },
- //获å–用户列表数æ®
- getUserList() {
- userList(this.queryParam).then(res =>{
+ userList(params).then(res =>{
this.userList = res.data.data
//é历this.userList
this.userList.forEach(item => {
@@ -157,10 +124,24 @@ export default {
item.city = getCity(item.memResidenceProvince,item.memResidenceCity)
}
});
+ this.$refs.paging.completeByTotal(this.userList,res.data.total);
}).catch(e => {
console.log(e)
})
},
+ //左上角的æœç´¢
+ search() {
+ //判æ–当å‰æ˜¯å¦å·²ç™»å½•
+ uni.navigateTo({
+ url: '/pagesUser/userFilterPage'
+ });
+ },
+ //跳转用户详情
+ gotoDetail(item){
+ uni.navigateTo({
+ url: '/pagesUser/userInfo?memberId='+item.businessId
+ })
+ },
//返回按钮
backbar() {
uni.navigateBack({
@@ -172,87 +153,90 @@ export default {
</script>
<style lang="scss" scoped>
-.u-nav-slot {
- display: flex;
- align-items: center;
-
- .text {
- height: 44rpx;
- font-size: 32rpx;
- font-family: PingFang SC-Bold, PingFang SC;
- font-weight: bold;
- color: #000000;
- margin-left: 14rpx;
- line-height: 44rpx;
- }
-
- .img {
- width: 22rpx;
- height: 28rpx;
- margin-left: 32rpx;
- }
-}
-.recommendation {
+.content {
+ min-height: 100vh;
background-color: #F4F5F9;
- position: absolute;
- padding: 0 34rpx;
- .nodatacard{
- height: 100vh;
- display: flex;
- justify-content: center;
- align-items: center;
- flex-direction: column;
- .text{
- text-align: center;
- padding: 42rpx 0;
- font-size: 13px;
- font-family: Source Han Sans CN-Regular, Source Han Sans CN;
- font-weight: 400;
- color: #B9B9B9;
- }
- }
- .recommendation-top {
- display: flex;
- justify-content: space-between;
- margin: 56rpx 0;
-
- .top-title {
- font-size: 19px;
- font-family: Source Han Sans CN-Bold, Source Han Sans CN;
- font-weight: bold;
- color: #222222;
- }
-
- .more {
+ .recommendation {
+ min-height: 100vh;
+ background-color: #F4F5F9;
+ position: absolute;
+ padding: 0 34rpx;
+ .nodatacard{
+ height: 100vh;
display: flex;
-
- .more-title {
- font-size: 17px;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ .text{
+ text-align: center;
+ padding: 42rpx 0;
+ font-size: 13px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
- color: #848484;
- margin-right: 14rpx;
+ color: #B9B9B9;
+ }
+ }
+ .recommendation-top {
+ display: flex;
+ justify-content: space-between;
+ margin: 56rpx 0;
+
+ .top-title {
+ font-size: 19px;
+ font-family: Source Han Sans CN-Bold, Source Han Sans CN;
+ font-weight: bold;
+ color: #222222;
}
- .more-image {
+ .more {
display: flex;
- align-items: center;
- .rightimage {
- width: 7px;
- height: 12px;
+ .more-title {
+ font-size: 17px;
+ font-family: Source Han Sans CN-Regular, Source Han Sans CN;
+ font-weight: 400;
+ color: #848484;
+ margin-right: 14rpx;
+ }
+
+ .more-image {
+ display: flex;
+ align-items: center;
+
+ .rightimage {
+ width: 7px;
+ height: 12px;
+ }
}
}
+
}
}
+ .u-nav-slot {
+ display: flex;
+ align-items: center;
+ .text {
+ height: 44rpx;
+ font-size: 32rpx;
+ font-family: PingFang SC-Bold, PingFang SC;
+ font-weight: bold;
+ color: #000000;
+ margin-left: 14rpx;
+ line-height: 44rpx;
+ }
+ .img {
+ width: 22rpx;
+ height: 28rpx;
+ margin-left: 32rpx;
+ }
+ }
.card {
display: grid;
grid-template-columns: 330rpx 330rpx;
grid-column-gap: 22rpx;
-
.recommendation-card {
width: 330rpx;
margin-bottom: 25rpx;
@@ -307,6 +291,5 @@ export default {
}
}
}
-
}
</style>
diff --git a/pagesme/me/likeList.vue b/pagesme/me/likeList.vue
index 490685de5faea4e241483d4aa0307074c7573017..405f749f0403843356acbcb38b24aff83ad6627b 100644
--- a/pagesme/me/likeList.vue
+++ b/pagesme/me/likeList.vue
@@ -2,34 +2,44 @@
<view style="background-color: #F4F5F9;min-height: 100vh;">
<!-- 页头-->
<u-navbar @leftClick="backbar" bgColor="#F4F5F9" :title="title"></u-navbar>
- <view class="recommendation" :style="{'top':navHeight+'px'}">
- <view v-if="isdata" class="nodatacard">
- <view class="text">æš‚æ— æ•°æ®</view>
- </view>
- <view class="card">
- <view class="recommendation-card" v-for="item in userList">
- <view class="card-image">
- <image @click="gotoDetail(item)" class="img" :src="item.avatarUrl"/>
- </view>
- <view class="card-bottom">
- <view class="bottom-left">
- <view class="bottom-info">
- {{item.memNickName}}
- <image v-if="item.memSex === '0'" class="gender" :src="baseUrl+'/user/male.png'" mode=""/>
- <image v-else class="gender" :src="baseUrl+'/user/famale.png'" mode=""/>
- </view>
- <view class="bottom-info">
- {{item.memAge}}å²
- <text style="margin-left: 10rpx;margin-right: 10rpx;color: #BBB9B9FF;">|</text>
- {{item.memHeight}}cm
+ <z-paging ref="paging" empty-view-text="迈出第一æ¥æ‰æœ‰æ›´å¤šæ•…事å‘生哦"
+ :empty-view-title-style="{
+ 'font-size': '32rpx',
+ 'color': '#C9C9D0',
+ 'position': 'absolute',
+ 'width': '100vw',
+ }" :empty-view-img="baseUrl+'/common/empty.png'" :empty-view-img-style="{
+ 'position': 'absolute',
+ 'top': '210rpx',
+ 'width': '447rpx',
+ 'height': '375rpx'
+ }" v-model="dataList" @query="queryList" :fixed="true" :auto-show-back-to-top="true" :back-to-top-with-animate="false">
+ <view class="recommendation" :style="{'top':navHeight+'px'}">
+ <view class="card">
+ <view class="recommendation-card" v-for="item in userList">
+ <view class="card-image">
+ <image @click="gotoDetail(item)" class="img" :src="item.avatarUrl"/>
+ </view>
+ <view class="card-bottom">
+ <view class="bottom-left">
+ <view class="bottom-info">
+ {{item.memNickName}}
+ <image v-if="item.memSex === '0'" class="gender" :src="baseUrl+'/user/male.png'" mode=""/>
+ <image v-else class="gender" :src="baseUrl+'/user/famale.png'" mode=""/>
+ </view>
+ <view class="bottom-info">
+ {{item.memAge}}å²
+ <text style="margin-left: 10rpx;margin-right: 10rpx;color: #BBB9B9FF;">|</text>
+ {{item.memHeight}}cm
+ </view>
+ <view class="bottom-address">{{item.city}}</view>
</view>
- <view class="bottom-address">{{item.city}}</view>
+ <image v-if="type == '1' || type == '3'" class="cnacleLike" :src="baseUrl+'/user/cancelLike.png'" @click="deleteLike(item.userId)"/>
</view>
- <image v-if="type == '1' || type == '3'" class="cnacleLike" :src="baseUrl+'/user/cancelLike.png'" @click="deleteLike(item.userId)"/>
</view>
</view>
</view>
- </view>
+ </z-paging>
</view>
</template>
@@ -42,6 +52,8 @@ import {calculateAge, parseDate} from "../../common";
export default {
data() {
return {
+ //分页æ’件å˜å‚¨æ•°æ®çš„å˜é‡
+ dataList:[],
//图片路径
baseUrl: this.$IMG_URL,
//用户列表
@@ -56,8 +68,9 @@ export default {
num:'',
//è·ç¦»è¡¨å¤´
navHeight:'',
- share: false,
menuButtonInfo: '',
+ //查询类型 1:我喜欢的 2：喜欢我的 3：互相喜欢的
+ queryType:'',
//分页查询å‚æ•°
queryParam:{
page:1,
@@ -68,7 +81,6 @@ export default {
onLoad(options) {
//设置页头
this.type = options.type;
- this.num = options.num;
//获å–当å‰é¡µé¢çš„页头高度
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
const {
@@ -89,8 +101,13 @@ export default {
this.getUserList()
},
methods: {
- getList(params){
- //我喜欢的
+ //分页查询
+ queryList(pageNo, pageSize) {
+ const params = {
+ page: pageNo,
+ rows: pageSize,
+ queryType:this.queryType
+ }
likeList(params).then(res =>{
this.userList = res.data.data
this.num = this.userList.length
@@ -128,43 +145,29 @@ export default {
getTitle(){
if (this.type == '1'){
//我喜欢的
- this.title = '我喜欢的' + '('+ this.num +')';
+ this.title = '我喜欢的' + '('+this.num+')';
} else if (this.type == '2'){
//喜欢我的
- this.title = '喜欢我的' + '('+ this.num +')';
+ this.title = '喜欢我的'+ '('+this.num+')';
} else if (this.type == '3'){
//互相喜欢
- this.title = '互相喜欢' + '('+ this.num +')';
+ this.title = '互相喜欢'+ '('+this.num+')';
}
},
//获å–用户列表数æ®
getUserList(){
if (this.type == '1'){
//我喜欢的
- const params = {
- page:this.queryParam.page,
- rows:this.queryParam.rows,
- queryType: '1'
- }
- this.getList(params)
+ this.queryType = '1'
} else if(this.type == '2') {
//喜欢我的
- const params = {
- page:this.queryParam.page,
- rows:this.queryParam.rows,
- queryType: '2'
- }
- this.getList(params)
+ this.queryType = '2'
} else if(this.type == '3') {
//互相喜欢的
- const params = {
- page:this.queryParam.page,
- rows:this.queryParam.rows,
- queryType: '3'
- }
- this.getList(params)
+ this.queryType = '3'
}
},
+ //å–消关注
deleteLike(id){
//是å¦ç¡®è®¤
uni.showModal({
@@ -193,6 +196,7 @@ export default {
url: '/pagesUser/userInfo?memberId='+item.businessId
})
},
+ //返回按钮
backbar() {
uni.navigateBack({
delta: 1, //返回层数，2则上上页
@@ -205,7 +209,7 @@ export default {
<style lang="scss" scoped>
.recommendation {
background-color: #F4F5F9;
- position: relative;
+ position: absolute;
padding: 0 34rpx;
.nodatacard{
height: 100vh;