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

留言

Browse Source
This commit is contained in:
zhaofang
2022-09-21 19:59:30 +08:00
parent 6ff4c51444
commit 8dc374cb65
11 changed files with 401 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
src/components/HomePage/followList.vue
View File

@@ -1,19 +1,32 @@
<template>
<div>
<ul class="follow-top-tabs">
<li class="follow-home-title tabs-index" @click="tagTab(1)">他关注的人<span v-if="active == 1" class="line"></span></li>
<li class="follow-home-title tabs-index" @click="tagTab(2)">关注他的人<span v-if="active == 2" class="line"></span></li>
<li class="follow-home-title tabs-index" @click="tagTab(1)">{{userInfo.aid == pageId ?'我关注的人':'他关注的人'}}<span v-if="active == 1" class="line"></span></li>
<li class="follow-home-title tabs-index" @click="tagTab(2)">{{userInfo.aid == pageId ?'关注我的人':'关注他的人'}}<span v-if="active == 2" class="line"></span></li>
</ul>
<div v-if="followList.length > 0">
<div class="follow-list" v-for="item in followList">
<div><img style="width:60px;height:60" src="/images/Avatarwoman.png"/></div>
<div class="follow-list" v-for="item in followList" :key="item.id">
<div style="width:60px;height:60">
<el-avatar shape="circle" style="width:60px;height:60px" size="small" :src="baseUrl+item.authorInfo.avatar" v-if="item.authorInfo.avatar"></el-avatar>
<div v-else class="uavatar">
<div v-if="item.authorInfo.sex == null" style="border-radius: 50%;width: 60px;height: 60px;"></div>
<div v-else>
<div v-if="item.authorInfo.sex === 1 "><img style="width:60px;height:60" src="../../../public/images/Avatarman.png" alt=""></div>
<div v-else><img style="width:60px;height:60" src="../../../public/images/Avatarwoman.png" alt=""></div>
</div>
</div>
<!-- <img style="width:60px;height:60" :src="item.authorInfo.avatar"/> -->
</div>
<div class="follow-center">
<p class="follow-home-title" style="font-size: 20px;margin-bottom: 12px;">小王<img style="width:22px;height:22;vertical-align:middle" src="/images/homeWu/man.png" /></p>
<p class="portal-summary-text">你必须非常努力才能看起来毫不费力</p>
<p class="follow-home-title" style="font-size: 20px;margin-bottom: 12px;">{{item.authorInfo.name}}
<!-- <img style="width:22px;height:22;vertical-align:middle" src="/images/homeWu/man.png" /> -->
</p>
<p class="portal-summary-text">{{item.authorInfo.sign}}</p>
</div>
<div>
<!-- <el-button plain class="btn" icon="el-icon-check">已关注</el-button> -->
<el-button type="primary" class="btn" icon="el-icon-plus">关注他</el-button>
<el-button plain class="btn" icon="el-icon-check" v-if="pageId == userInfo.aid && active == 1" @click="cancel(item)">取消关注</el-button>
<el-button type="primary" class="btn" v-if="active == 2" icon="el-icon-plus">关注他</el-button>
<el-button class="btn" icon="el-icon-plus" v-if="active == 2">已关注</el-button>
</div>
</div>
</div>
@@ -27,6 +40,8 @@
import interactBar from "@/components/Portal/interactBar.vue";
import author from "@/components/Portal/authorInfo.vue";
import apiFollow from "@/api/phase2/userfollow.js"
import { mapGetters,mapActions } from 'vuex';
import apiUser from "@/api/system/user.js";
export default{
name:"articleList",
components: {
@@ -34,13 +49,20 @@ import apiFollow from "@/api/phase2/userfollow.js"
// timeShow,
author
},
computed:{
...mapGetters(['userInfo']),
avatarText(){
return userAvatarText(this.userInfo.name);
}
},
data(){
return{
baseUrl:process.env.VUE_APP_FILE_BASE_URL,
followList:[],
active:1,
pageId:'',
pageList:[],
mypageList:[],
// pageList:[],
// mypageList:[],
page:{
pageIndex:1,
pageSize:10,
@@ -50,20 +72,34 @@ import apiFollow from "@/api/phase2/userfollow.js"
},
mounted() {
this.pageId = this.$route.query.id;
this.getMyPage();
this.getPage();
},
methods:{
cancel(item) {
apiFollow.remove(item.followId).then(res=>{
if(res.status == 200) {
this.getPage()
}
})
},
//展示全部
tagTab(num) {
this.active = num;
if(num == 1) {
this.getPage()
} else {
this.getMyPage()
}
},
getMyPage() {//关注我的，关注他的
this.page.aid = this.pageId;
apiFollow.mypage(this.page).then(res=>{
if(res.status== 200) {
this.count = res.result.count;
this.mypageList = res.result.list;
res.result.list.forEach(item=>{
item.authorInfo = { aid: "",name: "",orgInfo: "",avatar: "",sex: null }
})
this.followList = res.result.list;
this.getUserData(res.result.list);
}
})
},
@@ -72,11 +108,41 @@ import apiFollow from "@/api/phase2/userfollow.js"
apiFollow.page(this.page).then(res=>{
if(res.status== 200) {
this.count = res.result.count;
this.pageList = res.result.list;
res.result.list.forEach(item=>{
item.authorInfo = { aid: "",name: "",orgInfo: "",avatar: "",sex: null }
})
this.followList = res.result.list;
this.getUserData(res.result.list);
}
})
}
},
getUserData(list) {
let ids = [];
if(this.active == 1) {
ids = list.map(item=> item.followId);
} else {
ids = list.map(item=> item.aid);
}
apiUser.getByIds(ids).then(res => {
if (res.status == 200) {
list.forEach((item, index) => {
res.result.some(author => {
if (this.active == 1 && author.aid == item.followId) {
item.authorInfo = author;
return true;
} else if ( this.active == 2 && author.aid == item.aid) {
item.authorInfo = author;
return true;
} else {
return false;
}
});
});
} else {
this.$message.error(res.message);
}
});
},
}
}
</script>