Skip to content

B
beyond-clouds-front
Commit a10c34cb by yanju
Options

动态的评论 我的粉丝 我的关注

parent e308f355
Showing with 437 additions and 75 deletions
components/common/message/src/main.vue
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
return { return {
visible:false, visible:false,
message:'', message:'',
duration:3000, duration:1000,
type:'info', type:'info',
iconClass:'', iconClass:'',
customClass:'', customClass:'',
......
components/pc/comment/commentCard1.vue
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<transition name="fade" > <transition name="fade" >
<div class="comment-card__wrap"> <div class="comment-card__wrap">
<div class="comment-card1"> <div class="comment-card1" v-if="type!=='dynamic'">
<div class="comment-card1__l"> <div class="comment-card1__l">
<yun-avatar :src="info.userAvatar"></yun-avatar> <yun-avatar :src="info.userAvatar"></yun-avatar>
<p class="abs1" v-if="info.replyStatus===1||solved===true">已采纳</p> <p class="abs1" v-if="info.replyStatus===1||solved===true">已采纳</p>
...@@ -24,7 +24,41 @@ ...@@ -24,7 +24,41 @@
</p> </p>
</div> </div>
<transition name="fade" > <transition name="fade" >
<textarea v-model="commentContent" v-if="showCommentInput" name="" id="" cols="30" rows="10" class="release-area"></textarea> <textarea v-model="commentContent" v-if="showCommentInput" name="" id="card11" cols="30" rows="10" class="release-area"></textarea>
</transition>
<transition name="fade" >
<div class="button-box" v-if="showCommentInput">
<p @click="dataPostComment1">评论</p>
</div>
</transition>
<card2 @listenCommentReget2="dataGetComment" :type="type" :id="id" v-for="(val,index) in commentList" :key="val.commentId" :info="val"></card2>
<p class="comment-more" @click="clickToGetMore" v-if="currentPage<pages">查看更多</p>
</div>
</div>
<div class="comment-card1-dynamic" v-if="type==='dynamic'">
<div class="comment-card1__l">
<yun-avatar :src="info.userAvatar"></yun-avatar>
<p class="abs1" v-if="info.replyStatus===1||solved===true">已采纳</p>
<p class="abs2" @click="dataPostToSolve" v-if="info.replyStatus===0&&questionUser===$store.state.userProfile.userId">采纳</p>
</div>
<div class="comment-card1__r">
<div class="header">
<h6>{{info.userNick}}</h6>
<p>{{floor}}楼</p>
</div>
<p class="comment-box" v-if="type!=='question'">{{info.comment}}</p>
<p class="comment-box" v-if="type==='question'">{{info.reply}}</p>
<div class="footer">
<h6>{{dateConvert2}}</h6>
<p>
<span @click="showCommentInput=!showCommentInput">回复</span>
<span>赞{{likeNum}}</span>
<span @click="dataDeleteComment" v-if="this.info.userId ===$store.state.userProfile.userId">删除</span>
</p>
</div>
<transition name="fade" >
<textarea v-model="commentContent" v-if="showCommentInput" name="" id="card12" cols="30" rows="10" class="release-area"></textarea>
</transition> </transition>
<transition name="fade" > <transition name="fade" >
<div class="button-box" v-if="showCommentInput"> <div class="button-box" v-if="showCommentInput">
...@@ -131,6 +165,11 @@ ...@@ -131,6 +165,11 @@
url = config.api.post.ProjectComment.release+this.id.toString()+'/comment'; url = config.api.post.ProjectComment.release+this.id.toString()+'/comment';
postData.parentId = this.info.commentId; postData.parentId = this.info.commentId;
} }
if(this.type === 'dynamic'){
url = config.api.post.PostComment.release+this.id.toString()+'/comment';
postData.parentId = this.info.commentId;
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.post.QuestionReplyComment.release+this.info.replyId.toString()+'/comment'; url = config.api.post.QuestionReplyComment.release+this.info.replyId.toString()+'/comment';
} }
...@@ -173,6 +212,11 @@ ...@@ -173,6 +212,11 @@
params.parentId = this.info.commentId; params.parentId = this.info.commentId;
} }
if(this.type === 'dynamic'){
url = config.api.get.PostComment.list+this.id.toString()+'/comments';
params.parent_id = this.info.commentId;
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.get.QuestionReplyComment.list+this.info.replyId+'/comments'; url = config.api.get.QuestionReplyComment.list+this.info.replyId+'/comments';
} }
...@@ -208,6 +252,9 @@ ...@@ -208,6 +252,9 @@
if(this.type === 'project'){ if(this.type === 'project'){
url = config.api.delete.ProjectComment.delete+this.info.commentId url = config.api.delete.ProjectComment.delete+this.info.commentId
} }
if(this.type === 'dynamic'){
url = config.api.delete.PostComment.delete+this.info.commentId
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.delete.QuestionReply.delete+this.info.replyId; url = config.api.delete.QuestionReply.delete+this.info.replyId;
} }
...@@ -273,7 +320,6 @@ ...@@ -273,7 +320,6 @@
@extend %flex-row-spb; @extend %flex-row-spb;
align-items: flex-start; align-items: flex-start;
background-color: #fff; background-color: #fff;
.comment-card1__l{ .comment-card1__l{
width:48*$length; width:48*$length;
position:relative; position:relative;
...@@ -334,6 +380,74 @@ ...@@ -334,6 +380,74 @@
} }
} }
.comment-card1-dynamic{
box-sizing:content-box;
padding:21*$length 24*$length 24*$length;
width:768*$length;
border-bottom:1px dashed #EFEFEF;
@extend %flex-row-spb;
align-items: flex-start;
background-color: #fff;
.comment-card1__l{
width:48*$length;
position:relative;
.abs1{
@extend %cursorPointer;
position: absolute;
top:58*$length;
left:5*$length;
@include fontStyle(12,19,500,#75D098,left);
}
.abs2{
@extend %cursorPointer;
position: absolute;
top:58*$length;
left:10*$length;
@include fontStyle(12,19,500,#909399,left);
}
}
.comment-card1__r{
width:700*$length;
.header{
@extend %flex-row-spb;
h6{
@include fontStyle(14,19,500,#666,left)
}
p{
@include fontStyle(12,16,500,#999,left)
}
}
.comment-box{
margin-top:15*$length;
@include fontStyle(14,24,500,#333,left);
height:auto;
}
.footer{
margin:12*$length 0;
@extend %flex-row-spb;
h6{
@include fontStyle(12,16,500,#999,start)
}
p{
@include fontStyle(12,16,500,#999,start);
span{
margin-left:20*$length;
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
color:#00AAE6;
}
}
}
}
}
}
.release-area{ .release-area{
width:100%; width:100%;
padding:14*$length 16*$length; padding:14*$length 16*$length;
......
components/pc/comment/commentCard2.vue
<template> <template>
<transition name="fade" > <div>
<div class="comment-card2" v-if="type!=='dynamic'">
<div class="comment-card2">
<div class="comment-card2__l"> <div class="comment-card2__l">
<yun-avatar :src="info.userAvatar"></yun-avatar> <yun-avatar :src="info.userAvatar"></yun-avatar>
</div> </div>
...@@ -21,7 +20,7 @@ ...@@ -21,7 +20,7 @@
</p> </p>
</div> </div>
<transition name="fade" > <transition name="fade" >
<textarea v-model="commentContent" v-if="showCommentInput" name="" id="" cols="30" rows="10" class="release-area"></textarea> <textarea v-model="commentContent" v-if="showCommentInput" name="" id="card21" cols="30" rows="10" class="release-area"></textarea>
</transition> </transition>
<transition name="fade" > <transition name="fade" >
<div class="button-box" v-if="showCommentInput"> <div class="button-box" v-if="showCommentInput">
...@@ -34,7 +33,40 @@ ...@@ -34,7 +33,40 @@
</div> </div>
</div> </div>
<div class="comment-card2-dynamic" v-if="type==='dynamic'">
<div class="comment-card2__l">
<yun-avatar :src="info.userAvatar"></yun-avatar>
</div>
<div class="comment-card2__r">
<div class="header">
<h6>{{info.userNick}}</h6>
<p>{{floor}}楼</p>
</div>
<p class="comment-box">{{info.comment}}</p>
<div class="footer">
<h6>{{dateConvert2}}</h6>
<p>
<span @click="showCommentInput=!showCommentInput">回复</span>
<span>赞{{likeNum}}</span>
<span @click="dataDeleteComment" v-if="this.info.userId ===$store.state.userProfile.userId">删除</span>
</p>
</div>
<transition name="fade" >
<textarea v-model="commentContent" v-if="showCommentInput" name="" cols="30" rows="10" class="release-area"></textarea>
</transition>
<transition name="fade" >
<div class="button-box" v-if="showCommentInput">
<p @click="dataPostComment2">评论</p>
</div>
</transition> </transition>
<card3 @listenCommentReget3="dataGetComment" :type="type" :id="id" v-for="(val,index) in commentList" :key="val.commentId" :info="val"></card3>
<p class="comment-more" @click="clickToGetMore" v-if="currentPage<pages">查看更多</p>
</div>
</div>
</div>
</template> </template>
...@@ -122,6 +154,10 @@ ...@@ -122,6 +154,10 @@
url = config.api.post.ProjectComment.release+this.id.toString()+'/comment'; url = config.api.post.ProjectComment.release+this.id.toString()+'/comment';
postData.parentId = this.info.commentId; postData.parentId = this.info.commentId;
} }
if(this.type === 'dynamic'){
url = config.api.post.PostComment.release+this.id.toString()+'/comment';
postData.parentId = this.info.commentId;
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.post.QuestionReplyComment.release+this.info.replyId.toString()+'/comment'; url = config.api.post.QuestionReplyComment.release+this.info.replyId.toString()+'/comment';
postData.parentId = this.info.commentId; postData.parentId = this.info.commentId;
...@@ -166,6 +202,11 @@ ...@@ -166,6 +202,11 @@
params.parentId = this.info.commentId; params.parentId = this.info.commentId;
} }
if(this.type === 'dynamic'){
url = config.api.get.PostComment.list+this.id.toString()+'/comments';
params.parent_id = this.info.commentId;
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.get.QuestionReplyComment.list+this.info.replyId+'/comments'; url = config.api.get.QuestionReplyComment.list+this.info.replyId+'/comments';
params.parentId = this.info.commentId; params.parentId = this.info.commentId;
...@@ -204,6 +245,9 @@ ...@@ -204,6 +245,9 @@
if(this.type === 'project'){ if(this.type === 'project'){
url = config.api.delete.ProjectComment.delete+this.info.commentId.toString() url = config.api.delete.ProjectComment.delete+this.info.commentId.toString()
} }
if(this.type === 'dynamic'){
url = config.api.delete.PostComment.delete+this.info.commentId
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.delete.QuestionReplyComment.delete+ this.info.commentId.toString(); url = config.api.delete.QuestionReplyComment.delete+ this.info.commentId.toString();
} }
...@@ -294,6 +338,62 @@ ...@@ -294,6 +338,62 @@
} }
} }
} }
.comment-card2-dynamic{
margin-left:-30*$length;
box-sizing:content-box;
padding:20*$length;
width:700*$length;
border-bottom:1px dashed #e5e5e5;
@extend %flex-row-spb;
align-items: flex-start;
border-radius: 4*$length;
background-color: #F4F8FA;
.comment-card2__l{
width:48*$length;
}
.comment-card2__r{
width:630*$length;
.header{
@extend %flex-row-spb;
h6{
@include fontStyle(14,19,500,#666,left)
}
p{
@include fontStyle(12,16,500,#999,left)
}
}
.comment-box{
margin-top:15*$length;
@include fontStyle(14,24,500,#333,left);
height:auto;
}
.footer{
margin:12*$length 0;
@extend %flex-row-spb;
h6{
@include fontStyle(12,16,500,#999,start)
}
p{
@include fontStyle(12,16,500,#999,start);
span{
margin-left:20*$length;
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
color:#00AAE6;
}
}
}
}
}
}
.release-area{ .release-area{
width:100%; width:100%;
padding:14*$length 16*$length; padding:14*$length 16*$length;
......
components/pc/comment/commentCard3.vue
<template> <template>
<transition name="fade" > <div>
<div class="comment-card3" v-if="type!=='dynamic'">
<div class="comment-card3__l">
<yun-avatar :src="info.userAvatar"></yun-avatar>
</div>
<div class="comment-card3__r">
<div class="header">
<h6>{{info.userNick}}</h6>
<p>{{floor}}楼</p>
</div>
<p class="comment-box" >{{info.comment}}</p>
<div class="footer">
<h6>{{dateConvert2}}</h6>
<p>
<!--<span>回复</span>-->
<span>赞{{likeNum}}</span>
<span @click="dataDeleteComment" v-if="this.info.userId ===$store.state.userProfile.userId">删除</span>
</p>
</div>
</div>
<div class="comment-card3"> </div>
<div class="comment-card3-dynamic" v-if="type==='dynamic'">
<div class="comment-card3__l"> <div class="comment-card3__l">
<yun-avatar :src="info.userAvatar"></yun-avatar> <yun-avatar :src="info.userAvatar"></yun-avatar>
</div> </div>
...@@ -23,7 +44,8 @@ ...@@ -23,7 +44,8 @@
</div> </div>
</div> </div>
</transition> </div>
</template> </template>
...@@ -85,6 +107,9 @@ ...@@ -85,6 +107,9 @@
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.delete.QuestionReplyComment.delete+ this.info.commentId.toString(); url = config.api.delete.QuestionReplyComment.delete+ this.info.commentId.toString();
} }
if(this.type === 'dynamic'){
url = config.api.delete.PostComment.delete+this.info.commentId.toString();
}
this.$axios.$delete(url).then((response)=>{ this.$axios.$delete(url).then((response)=>{
if(response.code===0){ if(response.code===0){
...@@ -167,7 +192,59 @@ ...@@ -167,7 +192,59 @@
} }
} }
} }
.comment-card3-dynamic{
margin-left:-16*$length;
box-sizing:content-box;
padding:10*$length 0 10*$length 16*$length;
width:630*$length;
border-bottom:1px dashed #e5e5e5;
border-left:1px solid #E5E5E5;
@extend %flex-row-spb;
align-items: flex-start;
.comment-card3__l{
width:48*$length;
}
.comment-card3__r{
width:560*$length;
.header{
@extend %flex-row-spb;
h6{
@include fontStyle(14,19,500,#666,left)
}
p{
@include fontStyle(12,16,500,#999,left)
}
}
.comment-box{
margin-top:15*$length;
@include fontStyle(14,24,500,#333,left);
height:auto;
}
.footer{
margin:12*$length 0;
@extend %flex-row-spb;
h6{
@include fontStyle(12,16,500,#999,start)
}
p{
@include fontStyle(12,16,500,#999,start);
span{
margin-left:20*$length;
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
color:#00AAE6;
}
}
}
}
}
}
.release-area{ .release-area{
width:100%; width:100%;
padding:14*$length 16*$length; padding:14*$length 16*$length;
......
components/pc/comment/commentCon.vue
...@@ -97,6 +97,10 @@ ...@@ -97,6 +97,10 @@
url = config.api.post.ProjectComment.release+this.id.toString()+'/comment'; url = config.api.post.ProjectComment.release+this.id.toString()+'/comment';
postData.comment = this.commentContent; postData.comment = this.commentContent;
} }
if(this.type === 'dynamic'){
url = config.api.post.PostComment.release+this.id.toString()+'/comment';
postData.comment = this.commentContent;
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.post.QuestionReply.release+this.id.toString()+'/reply'; url = config.api.post.QuestionReply.release+this.id.toString()+'/reply';
...@@ -131,6 +135,9 @@ ...@@ -131,6 +135,9 @@
if(this.type === 'project'){ if(this.type === 'project'){
url = config.api.get.ProjectComment.list+this.id.toString()+'/comments' url = config.api.get.ProjectComment.list+this.id.toString()+'/comments'
} }
if(this.type === 'dynamic'){
url = config.api.get.PostComment.list+this.id.toString()+'/comments'
}
if(this.type === 'question'){ if(this.type === 'question'){
url = config.api.get.QuestionReply.list+this.id.toString()+'/replies' url = config.api.get.QuestionReply.list+this.id.toString()+'/replies'
} }
...@@ -172,7 +179,7 @@ ...@@ -172,7 +179,7 @@
<style lang="scss"> <style lang="scss">
.article-comment{ .article-comment{
width:938*$length; width:100%;
padding:18*$length 24*$length; padding:18*$length 24*$length;
box-sizing: border-box; box-sizing: border-box;
background-color: #fff; background-color: #fff;
...@@ -181,7 +188,8 @@ ...@@ -181,7 +188,8 @@
margin-top: 16*$length; margin-top: 16*$length;
.release-area{ .release-area{
width:890*$length; width:100%;
margin:0 auto;
padding:14*$length 16*$length; padding:14*$length 16*$length;
background-color: #F4F8FA; background-color: #F4F8FA;
border:1px solid #EFEFEF; border:1px solid #EFEFEF;
......
components/pc/fanCard.vue
<template> <template>
<div class="fan-card__warp" v-if="id&&showCard"> <div class="fan-card__warp" v-if="id&&showCard">
<div class="fan-card"> <div class="fan-card" @click="$router.push('/u/'+id+'/project')">
<div class="fan-card__left"> <div class="fan-card__left">
<div class="left__head-portrait"> <div class="left__head-portrait">
<yun-avatar :src="userAvatar"></yun-avatar> <yun-avatar :src="info.userAvatar"></yun-avatar>
</div> </div>
<div class="left__content"> <div class="left__content">
<div class="content-name"> <div class="content-name">
<span>{{nickName}}</span> <span>{{info.userNick}}</span>
<yun-icon name="sex_man" size="12px" color="#00AAE6" pb="6px" v-if="gender===1"></yun-icon> <yun-icon name="sex_man" size="12px" color="#00AAE6" pb="6px" v-if="gender===1"></yun-icon>
<yun-icon name="sex_woman" size="12px" color="#00AAE6" pb="6px" v-if="gender===2"></yun-icon> <yun-icon name="sex_woman" size="12px" color="#00AAE6" pb="6px" v-if="gender===2"></yun-icon>
</div> </div>
...@@ -16,11 +16,11 @@ ...@@ -16,11 +16,11 @@
<span>人气 <span class="label-number">{{statistics.visitedNum}}</span> · 粉丝 <span class="label-number">{{statistics.fansNum}}</span> · 关注 <span class="label-number">{{statistics.followedNum}}</span></span> <span>人气 <span class="label-number">{{statistics.visitedNum}}</span> · 粉丝 <span class="label-number">{{statistics.fansNum}}</span> · 关注 <span class="label-number">{{statistics.followedNum}}</span></span>
</div> </div>
<div class="content-label__right"> <div class="content-label__right">
<span>项目 <span class="label-number">{{statistics.projectNum}}</span> · 博客 <span>{{statistics.blogNum}}</span> · 回答 <span class="label-number">{{statistics.questionNum}}</span> · 动态 <span class="label-number">12</span></span> <span>项目 <span class="label-number">{{statistics.projectNum}}</span> · 博客 <span>{{statistics.blogNum}}</span> · 回答 <span class="label-number">{{statistics.questionNum}}</span> · 动态 <span class="label-number">{{statistics.postNum}}</span></span>
</div> </div>
</div> </div>
<p class="content-main"> <p class="content-main">
{{signature}} {{info.signature}}
</p> </p>
</div> </div>
</div> </div>
...@@ -31,10 +31,10 @@ ...@@ -31,10 +31,10 @@
<ul > <ul >
<li >添加备注</li> <li >添加备注</li>
<li v-if="cardType==='fans'">移除粉丝</li> <li v-if="cardType==='fans'">移除粉丝</li>
<li v-if="cardType==='fans'" @click="dataPostToFollow">添加关注</li> <li v-if="cardType==='fans'" @click.stop="dataPostToFollow">添加关注</li>
<li v-if="cardType==='follow'" @click="dataPostToCancelFollow">取消关注</li> <li v-if="cardType==='follow'" @click.stop="dataPostToCancelFollow">取消关注</li>
<li v-if="cardType==='follow'||cardType==='fans'" @click="dataPostToBlack">加入黑名单</li> <li v-if="cardType==='follow'||cardType==='fans'" @click.stop="dataPostToBlack">加入黑名单</li>
<li v-if="cardType==='blackList'" @click="dataPostToCancelBlack">移出黑名单</li> <li v-if="cardType==='blackList'" @click.stop="dataPostToCancelBlack">移出黑名单</li>
</ul> </ul>
</div> </div>
</transition> </transition>
...@@ -65,30 +65,15 @@ export default { ...@@ -65,30 +65,15 @@ export default {
}, },
props:{ props:{
id:String, info:Object,
cardType:String cardType:String
}, },
created(){ created(){
if(this.id){ this.id = this.info.userId;
this.dataGetUserInfo(); this.statistics = this.info.statistics || {};
}
}, },
methods:{ methods:{
dataGetUserInfo(){
this.$axios.$get(config.api.get.User.otherInfo+this.id+'/baseinfo').then((response) => {
if(response.code===0){
let data = response.data;
this.nickName=data.nickName;
this.gender= data.gender;
this.signature = data.signature;
this.userAvatar = data.userAvatar;
this.statistics = data.statistics;
}
})
},
dataPostToFollow(){ dataPostToFollow(){
this.$axios.$post(config.api.post.User.follow+this.id+'/follower').then((response)=>{ this.$axios.$post(config.api.post.User.follow+this.id+'/follower').then((response)=>{
if(response.code===0){ if(response.code===0){
......
components/pc/socialContactCard.vue
...@@ -77,25 +77,28 @@ ...@@ -77,25 +77,28 @@
<div class="card-footer"> <div class="card-footer">
<div class="footer-item"> <div class="footer-item1">
<yun-icon name="star" size="12px" color="#ccc" hover-color="#F8A06F"></yun-icon> <yun-icon name="star" size="12px" ></yun-icon>
<p>收藏</p> <p class="star">收藏</p>
</div> </div>
<div class="footer-item"> <div class="footer-item2">
<yun-icon name="share" size="12px" color="#ccc" hover-color="#00AAE6"></yun-icon> <yun-icon name="share" size="12px" ></yun-icon>
<p>转发</p> <p class="share">转发</p>
</div> </div>
<div class="footer-item" > <div class="footer-item3" @click="showCommentCon=!showCommentCon">
<yun-icon name="comment" size="12px" color="#ccc" hover-color="#75D098"></yun-icon> <yun-icon name="comment" size="12px" ></yun-icon>
<p>评论</p> <p class="comment">评论</p>
</div> </div>
<div class="footer-item"> <div class="footer-item4">
<yun-icon name="like1" size="12px" color="#ccc" hover-color="#FF7474"></yun-icon> <yun-icon name="like1" size="12px" ></yun-icon>
<p>收藏</p> <p class="like1"> 收藏</p>
</div> </div>
</div> </div>
</div> </div>
<transition name="fade" >
<comment-con v-if="showCommentCon" :id="postId" type="dynamic"></comment-con>
</transition>
</div> </div>
</transition> </transition>
</template> </template>
...@@ -103,15 +106,15 @@ ...@@ -103,15 +106,15 @@
<script> <script>
import Banner from './banner'; import Banner from './banner';
import Dropdown from '../../components/pc/dropdown' import Dropdown from './dropdown'
import {dateConvert} from "../../action/utils/dataConvert"; import {dateConvert} from "../../action/utils/dataConvert";
import config from '../../action/config'; import config from '../../action/config';
import {globalBus} from '../common/globalBus' import {globalBus} from '../common/globalBus'
import CommentCon from './comment/commentCon';
export default { export default {
name:'socialContactCard', name:'socialContactCard',
components:{ components:{
Banner,Dropdown Banner,Dropdown,CommentCon
}, },
props:{ props:{
...@@ -123,7 +126,6 @@ ...@@ -123,7 +126,6 @@
type:String, type:String,
default:'' default:''
} }
}, },
data(){ data(){
...@@ -151,7 +153,8 @@ ...@@ -151,7 +153,8 @@
userNick:'', userNick:'',
userAvatar:'', userAvatar:'',
followedAuthor:false, followedAuthor:false,
followLoading:false followLoading:false,
showCommentCon:false,
} }
}, },
...@@ -519,14 +522,94 @@ ...@@ -519,14 +522,94 @@
padding:14*$length 0; padding:14*$length 0;
border-top: 1px dashed #EFEFEF; border-top: 1px dashed #EFEFEF;
@extend %flex-row-spb; @extend %flex-row-spb;
.footer-item{ .footer-item1{
@extend %cursorPointer;
width:25%;
@extend %flex-row-center;
&:hover{
i{
color:#F8A06F
}
p{
color:#F8A06F
}
}
p{
margin-left:8*$length;
@include fontStyle(12,16,500,#666,center);
}
i{
color:#ccc;
padding-bottom: 3px;
}
}
.footer-item2{
@extend %cursorPointer;
width:25%;
@extend %flex-row-center;
&:hover{
i{
color:#00AAE6
}
p{
color:#00AAE6
}
}
p{
margin-left:8*$length;
@include fontStyle(12,16,500,#666,center);
}
i{
color:#ccc;
padding-bottom: 3px;
}
}
.footer-item3{
@extend %cursorPointer;
width:25%;
@extend %flex-row-center;
&:hover{
i{
color:#75D098
}
p{
color:#75D098
}
}
p{
margin-left:8*$length;
@include fontStyle(12,16,500,#666,center);
}
i{
color:#ccc;
padding-bottom: 3px;
}
}
.footer-item4{
@extend %cursorPointer; @extend %cursorPointer;
width:25%; width:25%;
@extend %flex-row-center; @extend %flex-row-center;
&:hover{
i{
color:#FF7474
}
p{
color:#FF7474
}
}
p{ p{
margin-left:8*$length; margin-left:8*$length;
@include fontStyle(12,16,500,#666,center); @include fontStyle(12,16,500,#666,center);
} }
i{
color:#ccc;
padding-bottom: 3px;
}
} }
} }
} }
......
components/pc/userCard.vue
...@@ -11,10 +11,10 @@ ...@@ -11,10 +11,10 @@
<nuxt-link tag="div" v-if="from==='my'" class="button" to="/personal-center/account/info">修改资料</nuxt-link> <nuxt-link tag="div" v-if="from==='my'" class="button" to="/personal-center/account/info">修改资料</nuxt-link>
<div v-if="from!=='my'&&isFollow" class="follow1" @click="dataPostToCancelFollow"> <div v-if="from!=='my'&&followedUser" class="follow1" @click="dataPostToCancelFollow">
<yun-icon name="loading" v-if="followLoading"></yun-icon><yun-icon v-if="!followLoading" name="right"></yun-icon>已关注 <yun-icon name="loading" v-if="followLoading"></yun-icon><yun-icon v-if="!followLoading" name="right"></yun-icon>已关注
</div> </div>
<div v-if="from!=='my'&&!isFollow" class="follow2" @click="dataPostToFollow"> <div v-if="from!=='my'&&!followedUser" class="follow2" @click="dataPostToFollow">
<yun-icon name="loading" v-if="followLoading"></yun-icon><span v-if="!followLoading">+</span>关注 <yun-icon name="loading" v-if="followLoading"></yun-icon><span v-if="!followLoading">+</span>关注
</div> </div>
<div class="footer"> <div class="footer">
...@@ -72,7 +72,8 @@ ...@@ -72,7 +72,8 @@
follow:7, follow:7,
fans:7, fans:7,
statistics:{}, statistics:{},
followLoading:false followLoading:false,
followedUser:false,
} }
}, },
props:{ props:{
...@@ -84,20 +85,13 @@ ...@@ -84,20 +85,13 @@
from:{ from:{
type:String, type:String,
default:'', default:'',
},
isFollow:{
type:Boolean,
default:false
} }
}, },
created(){ created(){
if(this.userId){ if(this.userId){
this.dataGetUserInfo(); this.dataGetUserInfo();
} }
console.log(this.isFollow);
}, },
methods:{ methods:{
dataGetUserInfo(){ dataGetUserInfo(){
...@@ -109,8 +103,9 @@ ...@@ -109,8 +103,9 @@
this.gender= data.gender; this.gender= data.gender;
this.signature = data.signature; this.signature = data.signature;
this.userAvatar = data.userAvatar; this.userAvatar = data.userAvatar;
this.statistics = data.statistics; this.statistics = data.statistics || {};
this.followLoading=false; this.followLoading=false;
this.followedUser = data.followedUser;
} }
}) })
}, },
...@@ -131,14 +126,14 @@ ...@@ -131,14 +126,14 @@
}) })
} }
this.followLoading=false; this.followLoading=false;
this.followedUser = true;
}) })
}, },
dataPostToCancelFollow(){ dataPostToCancelFollow(){
this.followLoading=true; this.followLoading=true;
this.$axios.$delete(config.api.delete.User.follow+this.userId+'/follower').then((response)=>{ this.$axios.$delete(config.api.delete.User.unfollow+this.userId+'/follower').then((response)=>{
if(response.code===0){ if(response.code===0){
this.$message({ this.$message({
type:'success', type:'success',
...@@ -151,6 +146,7 @@ ...@@ -151,6 +146,7 @@
}) })
} }
this.followLoading=false; this.followLoading=false;
this.followedUser = false;
}) })
}, },
......
pages/blog/detail/_id.vue
...@@ -139,7 +139,6 @@ ...@@ -139,7 +139,6 @@
}, },
created(){ created(){
console.log(this.articleDetail)
globalBus.$emit(config.event.listenDetailInfo,this.articleDetail.blogTitle,'blog') globalBus.$emit(config.event.listenDetailInfo,this.articleDetail.blogTitle,'blog')
}, },
......
pages/personal-center/account/info.vue
...@@ -90,7 +90,7 @@ ...@@ -90,7 +90,7 @@
signature:null, signature:null,
wxNumber:null, wxNumber:null,
birthday:null, birthday:null,
addFile:{}, addFile:null,
isEdit:false, isEdit:false,
isEdit2:false, isEdit2:false,
} }
......
pages/personal-center/person/black-list.vue
<template> <template>
<div style="min-height:556px"> <div style="min-height:556px">
<fan-card cardType="blackList" v-for="(val,index) in dataList" :key="val.blackedId" :id="val.blackedId"></fan-card> <fan-card cardType="blackList" v-for="(val,index) in dataList" :key="val.userId" :info="val"></fan-card>
<empty-card v-if="dataList.length===0" height="556px"></empty-card> <empty-card v-if="dataList.length===0" height="556px"></empty-card>
<pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination> <pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
......
pages/personal-center/person/following.vue
<template> <template>
<div style="min-height:556px"> <div style="min-height:556px">
<fan-card cardType="follow" v-for="(val,index) in dataList" :key="val.followedId" :id="val.followedId"></fan-card> <fan-card cardType="follow" v-for="(val,index) in dataList" :key="val.userId" :info="val"></fan-card>
<empty-card v-if="dataList.length===0" height="556px"></empty-card> <empty-card v-if="dataList.length===0" height="556px"></empty-card>
<pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination> <pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment