hz/learning-system-mobile
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-mobile.git synced 2025-12-06 17:36:45 +08:00
Code Issues Packages Projects Releases Wiki Activity

我的关注页面

Browse Source
This commit is contained in:
zhaofang
2022-11-02 17:26:50 +08:00
parent c51efc911b
commit 1e27665607
3 changed files with 186 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
config/index.js
View File

@@ -16,7 +16,7 @@ if(process.env.NODE_ENV === 'development'){
oldApiBaseUrl = '/uboeApi';
statApiBaseUrl='/statApi';
socialApiBaseUrl='/socialApi';
fileUrl = 'http://localhost:9090/cdn/upload';
fileUrl = 'http://192.168.0.11:9090/cdn/upload';
loginPath='/pages/login/login';
}else if(process.env.NODE_ENV === 'preview'){
// 预发布环境，当前配置未使用上

198
pages/my/follow.vue
View File

@@ -1,5 +1,6 @@
<template>
<view class="follow-info-page">
<u-toast ref="messager"></u-toast>
<view class="ub-content">
<view>
<view class="ub-tab" @click="ubtab(1)" :class="tab == 1 ? 'ub-tabactive' : ' ' ">关注我的<text></text></view>
@@ -7,54 +8,219 @@
</view>
</view>
<view class="follow-list-box" v-show="tab == 1">
<view class="follow-info-list" v-for="item in 5">
<view class="follow-info-list" v-for="(item,idx) in followMe.list">
<view class="img-info">
<image style="width:80upx;height:80upx" src="../../static/images/woman.png" mode=""></image>
<author-img :avatar="item.userFollow.authorInfo.avatar" :sex="item.userFollow.authorInfo.sex"></author-img>
</view>
<view class="name-and-sign">
<view class="name-text">李沐沐</view>
<view class="name-sign">相信美好的事情即将发生</view>
<view class="name-text">{{item.userFollow.authorInfo.name}}</view>
<view class="name-sign">{{item.userFollow.authorInfo.sign}}</view>
</view>
<view class="isFollow-btn">
<!-- <view class="on-follow">关注</view> -->
<view class="is-follow">已关注</view>
<view class="is-follow" v-if="item.has" @click="showPopup(item,idx,1)">已关注</view>
<view class="on-follow" v-else @click="toFollow(item,idx)">关注</view>
</view>
</view>
</view>
<view class="follow-list-box" v-show="tab == 2">
<view class="follow-info-list" v-for="item in 5">
<view class="follow-info-list" v-for="(follow,index) in follow.list">
<view class="img-info">
<image style="width:80upx;height:80upx" src="../../static/images/woman.png" mode=""></image>
<author-img :avatar="follow.userFollow.authorInfo.avatar" :sex="follow.userFollow.authorInfo.sex"></author-img>
<!-- <image style="width:80upx;height:80upx" src="../../static/images/woman.png" mode=""></image> -->
</view>
<view class="name-and-sign">
<view class="name-text">李沐沐</view>
<view class="name-sign">相信美好的事情即将发生</view>
<view class="name-text">{{follow.userFollow.authorInfo.name}}</view>
<view class="name-sign">{{follow.userFollow.authorInfo.sign}}</view>
</view>
<view class="isFollow-btn">
<view class="on-follow">关注</view>
<!-- <view class="is-follow">已关注</view> -->
<view class="is-follow" @click="showPopup(follow,index,2)">已关注</view>
<!-- <view class="on-follow" v-else>关注</view> -->
</view>
</view>
</view>
<u-popup :show="show">
<view class="cancel-pop">
<view class="btn" @click="cancel()">
停止关注 {{cancelData.userFollow.authorInfo.name}}
</view>
<view class="btn btn2" @click="show = false">
取消
</view>
</view>
</u-popup>
</view>
</template>
<script>
import apiFollow from "@/api/phase2/userfollow.js"
import apiUser from "@/api/system/user.js";
export default {
data() {
return {
cancelData:{
userFollow:{
authorInfo:{
name:''
}
}
},
cancelIndex:0,
cancelIdx:0,
show:false,
tab:1,
userInfo:{},
followMe:{
aid:'',
pageIndex:1,
pageSize:10,
list:[],
},
follow:{
aid:'',
pageIndex:1,
pageSize:10,
list:[],
}
}
},
onLoad(options) {
this.$store.dispatch('GetUserInfo').then(rs => {
this.userInfo = rs;
this.getMyPage();
this.getPage();
});
},
methods: {
showPopup(item,index,idx) {
this.cancelData = item;
this.cancelIndex = index;
this.cancelIdx = idx;
this.show = true;
},
// index 列表下标
// idx 哪个列表
cancel() {
let $this=this;
let id = '';
if(this.cancelIdx == 1) {
id = this.cancelData.userFollow.aid;
} else {
id = this.cancelData.userFollow.followId;
}
apiFollow.remove(id).then(res=>{
if(res.status == 200) {
this.show = false;
if(this.cancelIdx == 1) {
$this.followMe.list[this.cancelIndex].has = false;
} else {
$this.follow.list.splice(this.cancelIdx,1);
}
this.$refs.messager.show({message:'停止关注成功',type:'success'});
}
})
},
toFollow(item,index) {
let $this=this;
apiFollow.save(item.userFollow.aid).then(res=>{
if(res.status == 200) {
$this.followMe.list[index].has = true;
} else {
this.$message.error(res.message);
}
})
},
ubtab(num){
this.tab = num
}
},
getMyPage() {//关注我的，关注他的
this.followMe.aid = this.userInfo.aid;
let $this=this;
apiFollow.mypage(this.followMe).then(res=>{
if(res.status== 200) {
$this.followMe.count = res.result.count;
res.result.list.forEach(item=>{
item.userFollow.authorInfo = { aid: "",name: "",orgInfo: "",avatar: "",sex: null ,sign:''}
})
this.followMe.list = res.result.list;
this.getUserData(res.result.list,1);
}else{
console.log('加载关注我数据错误:'+res.message);
}
})
},
getPage() { //我关注的，他关注的
this.follow.aid = this.userInfo.aid;
// this.page.aid = this.pageId;
// this.page.pageIndex=this.follow.pageIndex;
// this.page.pageSize=this.follow.pageSize;
let $this=this;
apiFollow.page(this.follow).then(res=>{
if(res.status== 200) {
$this.follow.count = res.result.count;
res.result.list.forEach(item=>{
item.userFollow.authorInfo = { aid: "",name: "",orgInfo: "",avatar: "",sex: null ,sign:''}
})
this.follow.list = res.result.list;
this.getUserData(res.result.list,2);
}
})
},
getUserData(list,tab) {
let ids = [];
if(tab == 1) {
ids = list.map(item=> item.userFollow.aid);
} else {
ids = list.map(item=> item.userFollow.followId);
}
apiUser.getByIds(ids).then(res => {
if (res.status == 200) {
list.forEach((item, index) => {
res.result.some(author => {
if (tab == 2 && author.aid == item.userFollow.followId) {
item.userFollow.authorInfo = author;
return true;
} else if(tab == 1 && author.aid == item.userFollow.aid){
item.userFollow.authorInfo = author;
return true;
} else {
return false;
}
});
});
} else {
this.$message.error(res.message);
}
});
},
}
}
</script>
<style lang="scss" scoped>
.cancel-pop{
// height: 142px;
background: #F8F8F8;
border-radius: 32upx 32upx 0 0;
padding: 44upx 36upx 40upx 36upx;
.btn{
height: 88upx;
font-size: 32upx;
font-weight: 500;
color: #333333;
line-height: 88upx;
box-shadow: 0 4upx 14upx 2upx rgba(104,102,102,0.08);
text-align: center;
}
.btn2{
margin-top: 22upx;
border-radius: 44upx;
}
}
.follow-info-page{
background-color: #fff;
@@ -114,6 +280,11 @@
margin-top: 4upx;
font-size: 24upx;
color: #999999;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
display: -webkit-box;-webkit-line-clamp: 1;
word-break:break-all;
}
}
.isFollow-btn{
@@ -131,6 +302,7 @@
}
.is-follow{
width: 130upx;
// padding: 0 30upx;
height: 52upx;
line-height: 52upx;
border-radius: 26upx;

1
pages/my/rankingList.vue
View File

@@ -200,7 +200,6 @@
onLoad(options) {
this.$store.dispatch('GetUserInfo').then(rs => {
this.userInfo = rs;
console.log(rs,'rs')
this.getExperience();
this.getDuration();
this.getDays();