Skip to content

B
beyond-clouds-front
Commit 475571dc by xuebiao
Options

提交

parents 5128bd61 e308f355
Showing with 804 additions and 975 deletions
action/config.js
......@@ -37,6 +37,7 @@ export default {
otherInfo:'/api/user/' , //获取ta的信息 +{userId}/baseinfo
otherFans: '/api/user/', //获取ta的粉丝(列表) +{userId}/fans
otherFollowing: '/api/user/', //获取ta的关注（列表） +{userId}/follower
blacklist: '/api/my/blacklist/', //获取黑名单 +{userId}
},
......@@ -51,12 +52,13 @@ export default {
Topic:{
myList:'/api/my/topic/created',//我的话题列表
myfollowedList:'/api/my/topic/followed',//我关注的话题
detail:'/api/topic/' ,//话题详情 +{topicId}
detail:'/api/topic/' ,//话题详情 +{topicName}
topicFollowerList:'/api/topic/' ,//话题关注者列表 + {topicId}/follower
search:'/api/topic/search',//检索话题
list:'/api/topics' , //话题列表
postList:'/api/topic/' ,//获取话题下的所有动态 +{topicName}/posts
hotList:'/api/topic/hots',//获取热门动态
},
Question:{
myParticipated:'/api/my/question/participated' ,//我参与的问答列表
myCreated:'/api/my/questions' ,//我创建的问答列表
......@@ -163,6 +165,7 @@ export default {
User:{
unfollow:'/api/user/',//取消关注 +{userId}/follower
blacklist:'/api/my/blacklist/',//取消拉黑 +{userId}
},
Question:{
......@@ -221,7 +224,8 @@ export default {
listenProjectCardUpdate:'listenProjectCardUpdate',
listenCommentReget1:'listenCommentReget1',
listenCommentReget2:'listenCommentReget2',
listenCommentReget3:'listenCommentReget3'
listenCommentReget3:'listenCommentReget3',
listenDetailInfo:'listenDetailInfo',
},
......
assets/font/iconfont.eot
No preview for this file type
assets/font/iconfont.ttf
No preview for this file type
components/common/avatar/avatar.vue
......@@ -48,9 +48,9 @@
if(!this.userId){
return ''
}else if(this.userId===this.$store.state.userProfile.userId){
return '/personal-center/home/project?user='+this.userId
return '/personal-center/home/project'
}else{
return '/personal-center/u/project?user='+this.userId
return '/u/'+this.userId+'/project'
}
}
}
......
components/common/globalBus/index.js 0 → 100644
import Vue from 'vue';
export const globalBus= new Vue();
components/pc/comment/commentCard1.vue
......@@ -32,7 +32,7 @@
</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>
......@@ -87,15 +87,20 @@
floor:'',
likeNum:'',
solved:false,
currentPage:1,
pages:1,
}
},
created(){
this.dataGetComment();
},
watch:{
currentPage(){
this.dataGetComment()
}
},
methods:{
dataPostComment1(){
if(!this.$store.state.auth.token){
this.$message({
......@@ -116,6 +121,7 @@
let postData = {
comment:this.commentContent,
};
this.currentPage = 1;
if(this.type === 'blog'){
url = config.api.post.BlogComment.release+this.id.toString()+'/comment';
......@@ -148,14 +154,13 @@
})
},
dataGetComment(){
if(!this.id){
return false
}
let url;
let params = {
page:1,
page:this.currentPage,
size:6
}
if(this.type === 'blog'){
......@@ -175,11 +180,19 @@
params
}).then((response)=>{
if(response.code===0){
this.commentList =response.data.dataList;
if(this.currentPage===1){
this.commentList = response.data.dataList;
this.pages = response.data.totalPage;
}else{
let list = response.data.dataList;
for(let i = 0;i<list.length;i++){
this.commentList.push(list[i]);
}
this.pages = response.data.totalPage;
}
}
})
},
dataDeleteComment(){
if(!this.$store.state.auth.token){
this.$message({
......@@ -214,7 +227,6 @@
}
})
},
dataPostToSolve(){
this.$axios.$put(config.api.put.QuestionReply.adopt+this.info.replyId+'/adoption'+'?questionId='+this.info.questionId).then((response)=>{
if(response.code===0){
......@@ -232,7 +244,15 @@
}
})
},
clickToGetMore(){
if(this.currentPage<this.pages){
this.currentPage = this.currentPage+1;
}else{
}
}
}
......@@ -347,4 +367,16 @@
}
}
.comment-more{
@include fontStyle(12,78,500,#A7A7A7,center);
background-color: #F4F8FA;
@extend %cursorPointer;
@extend %animate-transition;
border-bottom-left-radius: 4*$length;
border-bottom-right-radius: 4*$length;
&:hover{
color:#00AAE6;
}
}
</style>
components/pc/comment/commentCard2.vue
......@@ -29,6 +29,8 @@
</div>
</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>
......@@ -74,12 +76,20 @@
commentContent:'',
floor:'',
likeNum:'',
currentPage:1,
pages:1
}
},
created(){
this.dataGetComment();
},
watch:{
currentPage(){
this.dataGetComment()
}
},
methods:{
dataPostComment2(){
......@@ -97,6 +107,7 @@
});
return false;
}
this.currentPage = 1;
let url;
let postData = {
......@@ -143,7 +154,7 @@
}
let url;
let params = {
page:1,
page:this.currentPage,
size:6
}
if(this.type === 'blog'){
......@@ -164,7 +175,16 @@
params
}).then((response)=>{
if(response.code===0){
this.commentList =response.data.dataList;
if(this.currentPage===1){
this.commentList = response.data.dataList;
this.pages = response.data.totalPage;
}else{
let list = response.data.dataList;
for(let i = 0;i<list.length;i++){
this.commentList.push(list[i]);
}
this.pages = response.data.totalPage;
}
}
})
},
......@@ -202,11 +222,20 @@
});
}
})
},
clickToGetMore(){
if(this.currentPage<this.pages){
this.currentPage = this.currentPage+1;
}else{
}
}
}
}
</script>
......@@ -298,4 +327,16 @@
}
}
.comment-more{
@include fontStyle(12,78,500,#A7A7A7,center);
background-color: #F4F8FA;
@extend %cursorPointer;
@extend %animate-transition;
border-bottom-left-radius: 4*$length;
border-bottom-right-radius: 4*$length;
&:hover{
color:#00AAE6;
}
}
</style>
components/pc/comment/commentCon.vue
......@@ -20,6 +20,8 @@
</div>
</div>
<card :questionUser="questionUser" @listenCommentReget1="dataGetComment" :type="type" :id="id" v-for="(val,index) in commentList" :key="val.commentId||val.replyId" :info="val"></card>
<p class="comment-more" @click="clickToGetMore" v-if="currentPage<pages">查看更多</p>
<p class="comment-more" v-if="commentList.length===0">暂无评论</p>
</div>
</template>
......@@ -33,6 +35,8 @@
return{
commentList:[],
commentContent:'',
currentPage:1,
pages:1,
}
},
components:{
......@@ -53,11 +57,15 @@
}
},
created(){
this.dataGetComment();
},
watch:{
currentPage(){
this.dataGetComment()
}
},
methods:{
dataPostComment(){
......@@ -75,6 +83,7 @@
});
return false;
}
this.currentPage = 1;
let url;
let postData={
......@@ -128,16 +137,34 @@
this.$axios.$get(url,{
params:{
page:1,
page:this.currentPage,
size:6
}
}).then((response)=>{
if(response.code===0){
this.commentList =response.data.dataList;
if(this.currentPage===1){
this.commentList = response.data.dataList;
this.pages = response.data.totalPage;
}else{
let list = response.data.dataList;
for(let i = 0;i<list.length;i++){
this.commentList.push(list[i]);
}
this.pages = response.data.totalPage;
}
}
})
},
clickToGetMore(){
if(this.currentPage<this.pages){
this.currentPage = this.currentPage+1;
}else{
}
}
}
}
</script>
......@@ -216,5 +243,18 @@
}
.comment-more{
@include fontStyle(12,78,500,#A7A7A7,center);
background-color: #fff;
@extend %cursorPointer;
@extend %animate-transition;
border-bottom-left-radius: 4*$length;
border-bottom-right-radius: 4*$length;
&:hover{
color:#00AAE6;
}
}
</style>
components/pc/fanCard.vue
<template>
<div class="fan-card__warp">
<div class="fan-card__warp" v-if="id&&showCard">
<div class="fan-card">
<div class="fan-card__left">
<div class="left__head-portrait">
<yun-avatar :src="src"></yun-avatar>
<yun-avatar :src="userAvatar"></yun-avatar>
</div>
<div class="left__content">
<div class="content-name">
<span>hhhh</span>
<yun-icon name="sex_man" size="12px" color="#00AAE6" pb="6px"></yun-icon>
<span>{{nickName}}</span>
<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>
</div>
<div class="content-label">
<div class="content-label__left">
<span>人气 <span class="label-number">123123</span> · 粉丝 <span class="label-number">231</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 class="content-label__right">
<span>项目 <span class="label-number">23</span> · 博客 <span>6</span> · 回答 <span class="label-number">12</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">12</span></span>
</div>
</div>
<p class="content-main">
哈哈哈哈哈哈我很低调
{{signature}}
</p>
</div>
</div>
<div class="fan-card__right" v-if="!isBlacklist">
<span @click="handleChange" v-if="isFocus" style="color: #55B946">+关注</span>
<span @click="handleChange" v-if="!isFocus" >互相关注</span>
<yun-icon class="icon-menu" name="down_arrow" size="8px" @mouseover.native="isShow=true"></yun-icon>
<yun-icon class="icon-menu" name="down_arrow" size="8px" @mouseover.native="changeStateMenu1" @mouseleave.native="changeStateMenu2"></yun-icon>
<transition name="fade">
<div class="fan-card__right-menu" v-if="isShow">
<ul @mouseover="isShow=true" @mouseleave="isShow=false">
<li>添加备注</li>
<li>移除粉丝</li>
<li>加入黑名单</li>
<div class="fan-card__right-menu" @mouseover="changeStateMenu1" @mouseleave="changeStateMenu2" v-if="showMenu">
<ul >
<li >添加备注</li>
<li v-if="cardType==='fans'">移除粉丝</li>
<li v-if="cardType==='fans'" @click="dataPostToFollow">添加关注</li>
<li v-if="cardType==='follow'" @click="dataPostToCancelFollow">取消关注</li>
<li v-if="cardType==='follow'||cardType==='fans'" @click="dataPostToBlack">加入黑名单</li>
<li v-if="cardType==='blackList'" @click="dataPostToCancelBlack">移出黑名单</li>
</ul>
</div>
</transition>
......@@ -43,21 +45,130 @@
</template>
<script>
import config from "../../action/config";
export default {
name: 'fanCard',
data () {
return {
src: 'http://i1.sinaimg.cn/ent/d/2008-06-04/U105P28T3D2048907F326DT20080604225106.jpg',
isFocus: true,
isShow: false,
isBlacklist: false
showMenu: false,
isBlacklist: false,
showCard:true,
userAvatar:'',
nickName:'',
gender:'',
signature:'',
statistics:{},
}
},
props:{
id:String,
cardType:String
},
created(){
if(this.id){
this.dataGetUserInfo();
}
},
methods:{
handleChange(){
this.isFocus = !this.isFocus;
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(){
this.$axios.$post(config.api.post.User.follow+this.id+'/follower').then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
dataPostToCancelFollow(){
this.$axios.$delete(config.api.delete.User.unfollow+this.id+'/follower').then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
this.showCard = false;
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
dataPostToBlack(){
this.$axios.$post(config.api.post.User.shielding+this.id).then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
dataPostToCancelBlack(){
this.$axios.$delete(config.api.delete.User.blacklist+this.id).then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
this.showCard = false;
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
changeStateMenu1(){
clearTimeout(this.menuTime);
this.showMenu = true
},
changeStateMenu2(){
clearTimeout(this.menuTime);
this.menuTime = setTimeout(()=>{
this.showMenu = false
},200)
}
},
}
</script>
......@@ -112,6 +223,7 @@ export default {
width: 120*$length;
flex-shrink:0;
@extend %flex-row-spb;
justify-content: flex-end;
>span{
@include fontStyle(14,20,500,#999,left);
}
......@@ -124,9 +236,9 @@ export default {
top: 30*$length;
right: 0;
width: 136*$length;
height: 138*$length;
box-shadow: 0 6*$length 20*$length rgba(0,0,0,.08);
@include border-radius(4*$length);
z-index: 100;
li{
@extend %animate-transition;
@include fontStyle(14,20,500,#666,center);
......
components/pc/pageHeader.vue
<template>
<div class="bc-layout-container-header">
<div class="nuxt-progress" v-if="progressShow"></div>
<div class="container-header">
<div class="container-header" v-if="!showDetailHead">
<div class="header-center">
<div class="header-center-l">
<div class="logo__wrap" >
......@@ -89,7 +89,7 @@
</ul>
<ul class="abs-box abs-box2" v-if="showHideBox2" @mouseover="changeStateShowBox(2)" @mouseleave="changeStateHideBox(2)">
<li>
<nuxt-link tag="span" :to="'/personal-center/home/project?user='+$store.state.userProfile.userId">我的主页</nuxt-link>
<nuxt-link tag="span" to="/personal-center/home/project">我的主页</nuxt-link>
</li>
<li>
<nuxt-link tag="span" to="/personal-center/like/support">我的喜欢</nuxt-link>
......@@ -115,7 +115,22 @@
</div>
</div>
<div class="detail-header" v-if="showDetailHead">
<div class="detail-header__center">
<nuxt-link tag="p" to="/">首页</nuxt-link>
<yun-icon size="12px" color="#999" pb="3px" name="left_arrow"></yun-icon>
<nuxt-link tag="p" to="/blog" v-if="detailType==='blog'">博客</nuxt-link>
<nuxt-link tag="p" to="/project" v-if="detailType==='project'">项目</nuxt-link>
<nuxt-link tag="p" to="/answer" v-if="detailType==='answer'">问答</nuxt-link>
<yun-icon size="12px" color="#999" pb="3px" name="left_arrow"></yun-icon>
<nuxt-link tag="p" to="">{{detailTitle}}</nuxt-link>
</div>
</div>
<div class="container-header-pad"></div>
<div class="click-top" v-if="showToTop" @click="clickToTop">
<div class="click-top__triangle"></div>
</div>
</div>
</template>
......@@ -124,6 +139,7 @@
<script>
import AlertsCard from './alertsMessage/alertsCard';
import {globalBus} from '../common/globalBus'
import config from '../../action/config';
const Cookie = process.client ? require('js-cookie') : null
import Logo from '../../assets/svg/logo.svg'
......@@ -142,7 +158,12 @@
hideBox3Time:null,
route:'home',
progressShow:false,
BCLogo:null
BCLogo:null,
detailType:'',
detailTitle:'',
showDetailHead:false,
showToTop:false,
timer:null,
}
},
......@@ -156,16 +177,21 @@
setTimeout(()=>{
this.progressShow = false;
},900);
this.BCLogo = Logo
this.BCLogo = Logo;
globalBus.$on(config.event.listenDetailInfo,(title,type,id)=>{
this.detailTitle = title;
this.detailType = type;
})
this.changeHeader();
},
watch:{
$route(route){
this.route = route.name;
this.progressShow = true;
this.changeHeader();
setTimeout(()=>{
this.progressShow = false;
},900)
}
},
......@@ -195,19 +221,19 @@
clearTimeout(this.hideBox1Time);
this.hideBox1Time = setTimeout(()=>{
this.showHideBox1=false
},800)
},300)
}
if(arg.indexOf(2)===0){
clearTimeout(this.hideBox2Time);
this.hideBox2Time = setTimeout(()=>{
this.showHideBox2=false
},800)
},300)
}
if(arg.indexOf(3)===0){
clearTimeout(this.hideBox3Time);
this.hideBox3Time = setTimeout(()=>{
this.showHideBox3=false
},800)
},300)
}
},
......@@ -237,15 +263,63 @@
this.$router.push('/');
},
getUserInfo(){
this.$axios.$get(config.api.get.User.myInfo).then((response)=>{
if(data.code === 0){
this.$store.commit('userProfile/setUser', `${response.data}`)
changeHeader(){
let path = this.$route.path;
let index = path.lastIndexOf('/');
let route = path.substring(0,index);
if(route==='/blog/detail'||route==='/blog/detail'||route==='/blog/detail'){
if(process.browser){
document.removeEventListener('scroll',this.listenScroll2)
document.addEventListener('scroll',this.listenScroll1)
}
}else{
this.$store.commit('auth/logout')
this.$store.commit('userProfile/removeUser')
if(process.browser){
document.removeEventListener('scroll',this.listenScroll1)
document.addEventListener('scroll',this.listenScroll2)
}
})
}
},
listenScroll1(){
let scrollTop = document.documentElement.scrollTop ||document.body.scrollTop;
this.showDetailHead = scrollTop >= 400;
this.showToTop = scrollTop >= 800;
},
listenScroll2(){
let scrollTop = document.documentElement.scrollTop ||document.body.scrollTop;
this.showToTop = scrollTop >= 800;
},
clickToTop(){
clearInterval(this.timer)
this.changeStyleToTop(30);
},
changeStyleToTop(time){
if(process.browser){
let top = document.documentElement.scrollTop;
let scrollNum = top/100;
let time2 =time/scrollNum/1000;
let that = this;
if(top<5000){
this.timer = setInterval(function () {
if(document.documentElement.scrollTop>0){
document.documentElement.scrollTop-=100
}else{
clearInterval(that.timer)
}
},time2)
}else{
document.documentElement.scrollTop=0;
}
}
}
},
}
......@@ -281,6 +355,68 @@
transition: width 0.28s;
}
.click-top{
position:fixed;
bottom:300*$length;
right:calc((100% - 1256px)/2 - 56px);
height:40*$length;
width:40*$length;
border-radius: 4*$length;
background-color: #fff;
overflow: hidden;
@extend %cursorPointer;
@extend %animate-transition;
.click-top__triangle{
@extend %animate-transition;
margin:8*$length auto 0;
border-bottom:8.5*$length solid #00AAE6;
border-left:5*$length solid transparent;
border-right:5*$length solid transparent;
border-top:8.5*$length solid transparent;
height:0;
width:0;
}
&:hover{
background-color: #00AAE6;
.click-top__triangle{
margin:3*$length auto 0;
border-bottom:8.5*$length solid #fff;
}
}
}
.detail-header{
position:fixed;
top:0;
left:0;
right:0;
height:66*$length;
background-color: #fff;
z-index: 7000;
.detail-header__center{
width:$pageWidth;
margin:0 auto;
@include fontStyle(17,66,500,#333,start);
@extend %flex-row-spb;
justify-content: flex-start;
p{
@extend %cursorPointer;
@extend %animate-transition;
&:hover{
color:#00AAE6;
}
}
i{
margin:0 20*$length;
}
}
}
.container-header{
position:fixed;
top:0;
......
components/pc/projectCard.vue
......@@ -57,14 +57,14 @@
</div>
<div class="project-card__abs" v-if="isMy">
<div class="container__abs">
<div class="deleteButton" @click="dataDeleteItem(cardId)">
<yun-icon name="close1" size="12px" pb="3px"></yun-icon>
<div class="deleteButton" @click="showAlert(cardId)">
<yun-icon name="delete" size="12px" pb="3px"></yun-icon>
</div>
<nuxt-link v-if="cardType===2" :to="{path:'/blog/release',query:{id:cardId}}" tag="div" class="editButton">
<yun-icon name="project" size="12px"></yun-icon>
<yun-icon name="edit" size="12px"></yun-icon>
</nuxt-link>
<nuxt-link v-if="cardType===1" :to="{path:'/project/release',query:{id:cardId}}" tag="div" class="editButton">
<yun-icon name="project" size="12px"></yun-icon>
<yun-icon name="edit" size="12px"></yun-icon>
</nuxt-link>
</div>
......@@ -139,6 +139,16 @@
}
},
showAlert(id){
this.$alert('确认删除？', '', {
confirmButtonText: '确定',
callback: action => {
this.dataDeleteItem(id)
}
});
},
dataDeleteItem(id){
if(this.cardType===1){
......@@ -312,6 +322,7 @@
@extend %flex-row-spb;
justify-content: flex-start;
> p{
margin-bottom: 8*$length;
margin-right:10*$length;
padding:2*$length 8*$length;
background-color: #F4F8FA;
......@@ -374,7 +385,7 @@
@extend %flex-row-spb;
justify-content: flex-start;
> p{
margin-top: 8*$length;
margin-bottom: 8*$length;
margin-right:10*$length;
padding:2*$length 8*$length;
background-color: #F4F8FA;
......
components/pc/releaseCard.vue
......@@ -55,7 +55,7 @@
<transition name="fade">
<div class="func-item__abs" v-if="showTopicCard" ref="topicCard">
<yun-input style="border:1px solid #EFEFEF;margin-top:12px" iconName="search" width='270px' placeholder="搜索话题" v-model="TopicValue"></yun-input>
<yun-input style="border:1px solid #EFEFEF;margin-top:12px" iconName="search" width='270px' @keydown.enter.native="clickToOpenPopup" @change="dataGetSearchTopic" placeholder="搜索话题" v-model="TopicValue"></yun-input>
<div class="topic-content">
<div class="topic-content__c" v-for="(val,index) in topicList" :key="val.topicId" @click="clickToAddTopic(val.topicId,val.topicName)">
<p>#{{val.topicName}}#</p>
......@@ -124,32 +124,9 @@
<video controls :src="video"></video>
<p class="cancel-video" @click="video=''">取消上传</p>
</div>
<!--<div class="video-upload" >-->
<!--<div class="video-upload__word">-->
<!--<p>{{videoName}}</p>-->
<!--<h6>上传中55%</h6>-->
<!--</div>-->
<!--<div class="video-upload__progress">-->
<!--<p></p>-->
<!--</div>-->
<!--</div>-->
<!--<p class="add-box" v-if="!showCoverUploadP">上传封面-->
<!--<input type="file" @change="e=>changeToUploadCover(e)">-->
<!--</p>-->
<!--<div class="video-upload" v-if="showCoverUploadP">-->
<!--<div class="video-upload__word">-->
<!--<p>文件名.mp4</p>-->
<!--<h6>上传中55%</h6>-->
<!--</div>-->
<!--<div class="video-upload__progress">-->
<!--<p></p>-->
<!--</div>-->
<!--</div>-->
</div>
</div>
</transition>
</div>
</template>
......@@ -191,10 +168,16 @@
},
watch:{
showTopicCard(val){
if(val===true){
this.dataGetTopicList();
}else{
this.TopicValue = '';
}
}
},
created(){
this.dataGetTopicList();
if(process.browser){
document.addEventListener('click',(e)=>{
if(this.$refs.topicCard){
......@@ -243,6 +226,27 @@
clickToOpenPopup(){
if(this.TopicValue){
this.$axios.$post(config.api.post.Topic.release,{
topicName:this.TopicValue
}).then((res)=>{
console.log(res);
if(res.code===0){
this.releaseWord = this.releaseWord +"#"+this.TopicValue+"#";
this.dataGetTopicList();
this.$message({
type:'success',
message:'话题发布成功!'
})
}else{
this.$message({
type:'warning',
message:res.msg
})
}
})
}else{
this.$popupbox({
title:'发布话题',
name:'',
......@@ -275,6 +279,8 @@
}
})
}
},
dataGetTopicList(){
......@@ -289,6 +295,19 @@
})
},
dataGetSearchTopic(e){
this.$axios.$get(config.api.get.Topic.search,{
params:{
page:1,
size:10,
keywords:e,
}
}).then((response)=>{
this.topicList = response.data.dataList;
this.pages = response.data.totalPage;
})
},
clickToAddTopic(id,name){
this.releaseWord = this.releaseWord +"#"+name+"#";
this.showTopicCard = false;
......
components/pc/socialContactCard.vue
......@@ -9,8 +9,11 @@
<div class="header-l__info">
<div class="header-l__info-top">
<p class="name">{{userNick}}</p>
<p class="follow">
+关注
<p class="follow1" v-if="followedAuthor&&$store.state.userProfile.userId!==userId" >
<yun-icon name="right"></yun-icon>已关注
</p>
<p class="follow2" v-if="!followedAuthor" @click="dataPostFollowUser">
<yun-icon name="loading" v-if="followLoading"></yun-icon><span v-if="!followLoading">+</span>关注
</p>
</div>
......@@ -103,6 +106,7 @@
import Dropdown from '../../components/pc/dropdown'
import {dateConvert} from "../../action/utils/dataConvert";
import config from '../../action/config';
import {globalBus} from '../common/globalBus'
export default {
name:'socialContactCard',
......@@ -145,7 +149,9 @@
showBanner:false,
currentImg:0,
userNick:'',
userAvatar:''
userAvatar:'',
followedAuthor:false,
followLoading:false
}
},
......@@ -218,6 +224,11 @@
})
}
globalBus.$on(config.event.listenSocialCardState,(userId)=>{
if(userId===this.userId){
this.followedAuthor = true;
}
})
},
methods:{
......@@ -239,6 +250,7 @@
this.userId = info.userId;
this.userNick = info.userNick;
this.userAvatar = info.userAvatar;
this.followedAuthor = info.followedAuthor;
}
},
dateDeleteCard(id){
......@@ -261,6 +273,28 @@
},
dataPostFollowUser(){
this.followLoading = true;
this.$axios.$post(config.api.post.User.follow+this.userId+'/follower').then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:'关注成功！'
})
this.followLoading = false;
this.followedAuthor = true;
globalBus.$emit(config.event.listenSocialCardState,this.userId)
}else{
this.followLoading = false;
this.$message({
type:'warning',
message:response.msg
})
}
})
}
},
......@@ -296,11 +330,35 @@
.nickname{
@include fontStyle(14,19,500,#888,left);
}
.follow{
.follow2{
margin-left: 22*$length;
@include fontStyle(14,19,500,#55B946,left);
@extend %cursorPointer;
i{
animation: LoadingTurn 1.2s infinite;
}
@keyframes LoadingTurn {
from {
transform: rotate(0deg);
}
to{
transform: rotate(360deg);
}
}
}
.follow1{
margin-left: 22*$length;
@include fontStyle(14,19,500,#666,left);
@extend %cursorPointer;
}
.follow3{
margin-left: 22*$length;
@include fontStyle(14,19,500,#1890ffb0,left);
@extend %cursorPointer;
}
}
......
components/pc/topicCard.vue
<template>
<div class="topic-card__wrap" v-if="cardId">
<div class="topic-card" @click="activeRouteFunc?changeRoute('/topic/detail/'+cardId):null">
<div class="topic-card" @click="activeRouteFunc?changeRoute('/topic/detail/'+cardName):null">
<div class="topic-card-left">
<div class="square1" v-if="!topicIcon"></div>
<div class="square2" v-if="!topicIcon"></div>
......
components/pc/userCard.vue
......@@ -10,6 +10,13 @@
<p class="info2">{{signature}}</p>
<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">
<yun-icon name="loading" v-if="followLoading"></yun-icon><yun-icon v-if="!followLoading" name="right"></yun-icon>已关注
</div>
<div v-if="from!=='my'&&!isFollow" class="follow2" @click="dataPostToFollow">
<yun-icon name="loading" v-if="followLoading"></yun-icon><span v-if="!followLoading">+</span>关注
</div>
<div class="footer">
<div class="footer-item">
<p>项目</p>
......@@ -64,7 +71,8 @@
popularity:6,
follow:7,
fans:7,
statistics:{}
statistics:{},
followLoading:false
}
},
props:{
......@@ -77,16 +85,23 @@
type:String,
default:'',
},
isFollow:{
type:Boolean,
default:false
}
},
created(){
if(this.userId){
this.getDataUserInfo();
this.dataGetUserInfo();
}
console.log(this.isFollow);
},
methods:{
getDataUserInfo(){
dataGetUserInfo(){
this.followLoading=true;
this.$axios.$get(config.api.get.User.otherInfo+this.userId+'/baseinfo').then((response) => {
if(response.code===0){
let data = response.data;
......@@ -95,10 +110,82 @@
this.signature = data.signature;
this.userAvatar = data.userAvatar;
this.statistics = data.statistics;
this.followLoading=false;
}
})
},
dataPostToFollow(){
this.followLoading=true;
this.$axios.$post(config.api.post.User.follow+this.userId+'/follower').then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
this.followLoading=false;
})
},
dataPostToCancelFollow(){
this.followLoading=true;
this.$axios.$delete(config.api.delete.User.follow+this.userId+'/follower').then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
this.followLoading=false;
})
},
dataPostToBlack(){
this.$axios.$post(config.api.post.User.shielding+this.userId).then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
dataPostToCancelBlack(){
this.$axios.$delete(config.api.post.User.shielding+this.userId).then((response)=>{
if(response.code===0){
this.$message({
type:'success',
message:response.msg
})
}else{
this.$message({
type:'warning',
message:response.msg
})
}
})
},
},
}
</script>
......@@ -146,6 +233,40 @@
}
.follow1{
margin:21*$length auto 0;
padding:7*$length 22*$length;
background-color: #fff;
border:1px solid #EFEFEF;
border-radius: 4*$length;
@include fontStyle(14,19,500,#999999,center);
@extend %animate-transition;
@extend %cursorPointer;
&:hover{
color: #13ce66;
background-color: #e7faf0;
border:1px solid #d0f5e0;
}
}
.follow2{
margin:21*$length auto 0;
padding:7*$length 22*$length;
background-color: #e7faf0;
border:1px solid #d0f5e0;
border-radius: 4*$length;
@include fontStyle(14,19,500,#13ce66,center);
@extend %animate-transition;
@extend %cursorPointer;
&:hover{
background-color: #13ce66;
border:1px solid #d0f5e0;
color:#e7faf0
}
}
.footer{
width:232*$length;
height:47*$length;
......
nuxt.config.js
......@@ -34,8 +34,9 @@ module.exports = {
*/
plugins: [
'~/plugins/axios',
{src:'~/plugins/mavonEditor.js',ssr:true},
{src:'~/plugins/mavonEditor.js',ssr:false},
{src:'~/plugins/cropper.js',ssr:false},
{src:'~/plugins/globalBux.js',ssr:false},
{src:'~/plugins/messageBox.js',ssr:true},
{src:'~/plugins/popupBox.js',ssr:true},
{src:'~/plugins/message.js',ssr:true},
......
pages/answer/detail/_id.vue
......@@ -72,7 +72,7 @@
</div>
<div class="detail-container__right">
<user-card :userId="articleDetail.userId"></user-card>
<user-card :isFollow="articleDetail.followedAuthor" :userId="articleDetail.userId"></user-card>
<card-container style="margin-top:16px" title="相关推荐" label="换一换" more="更多">
</card-container>
</div>
......@@ -231,6 +231,7 @@
width:100%;
.info-left{
@extend %flex-row-spb;
justify-content: flex-start;
flex: 1;
> .icon-box{
margin-right:15*$length;
......@@ -251,7 +252,7 @@
@extend %flex-row-spb;
justify-content: flex-start;
> p{
margin-top: 8*$length;
margin-bottom: 8*$length;
margin-right:10*$length;
padding:2*$length 8*$length;
background-color: #F4F8FA;
......
pages/dynamic/index.vue
......@@ -9,10 +9,7 @@
<div class="dynamic-container__center">
<release-card @listenReleaseState="dataGetDynamic(1)"></release-card>
<social-card @listenSocialCardState="dataGetDynamic(1)" v-for="(val,index) in postList" :key="val.postId" :info="val"></social-card>
<pagination :paginationReset="paginationReset" :paginationState="paginationState" :type="2" key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
<div class="dynamic-container__right">
<card-container title="话题热搜榜" label="换一换" more="更多">
......
pages/personal-center/home.vue
<template>
<div class="home-container">
<div class="home-container__top">
<img src="https://s2.ax1x.com/2020/01/30/1lqW5j.png" alt="">
<img src="../../assets/img/personal-cover.png" alt="">
</div>
<div class="home-container__bottom">
<div class="home-container__bottom-center">
<div class="bottom-container__bg"></div>
<div class="bottom-container">
<div class="bottom-left">
<user-card :from="$store.state.userProfile.userId===userId?'my':''" :userId="userId"></user-card>
<user-card from="my" :userId="this.$store.state.userProfile.userId"></user-card>
</div>
<div class="bottom-right">
<div class="bottom-right__tab">
<div class="tab__left">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/project',query:{user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/project'}">
<p class="abs"></p>
<p class="word">项目</p>
<p class="line" v-if="selected==='personal-center-home-project'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/blog',query:{user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/blog'}">
<p class="abs"></p>
<p class="word">博客</p>
<p class="line" v-if="selected==='personal-center-home-blog'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/answer',query:{type:'my',user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/answer',query:{type:'my'}}">
<p class="abs"></p>
<p class="word">问答</p>
<p class="line" v-if="selected==='personal-center-home-answer'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/dynamic',query:{user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/dynamic'}">
<p class="abs"></p>
<p class="word">动态</p>
<p class="line" v-if="selected==='personal-center-home-dynamic'"></p>
</nuxt-link>
<nuxt-link tag="div" v-if="$store.state.userProfile.userId===userId" class="left__item" :to="{path:'/personal-center/home/topic',query:{type:'my',user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/topic',query:{type:'my'}}">
<p class="abs"></p>
<p class="word">话题</p>
<p class="line" v-if="selected==='personal-center-home-topic'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/info',query:{user:$route.query.user}}">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/home/info'}">
<p class="abs"></p>
<p class="word">资料</p>
<p class="line" v-if="selected==='personal-center-home-info'"></p>
......@@ -47,12 +47,14 @@
<p class="tab__right">
</p>
</div>
<transition name="fade-transform" mode="out-in">
<div style="min-height:556px">
<transition name="fade-transform" mode="out-in">
<nuxt-child ></nuxt-child>
</div>
</transition>
</div>
</div>
</div>
<page-footer></page-footer>
......@@ -92,12 +94,6 @@
created(){
this.selected = this.$route.name;
let userId = this.$route.query.user;
if(userId){
this.userId = userId;
}else{
this.router.replace('/')
}
},
......
pages/personal-center/home/answer.vue
......@@ -30,19 +30,12 @@
},
computed:{
rightConTitle(){
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId===this.$route.query.user){
if(this.$route.query.type==="my"){
return '我创建的问题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId===this.$route.query.user){
if(this.$route.query.type==="notice"){
return '我回答的问题'
}
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的问题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta回答的问题'
}
},
},
......@@ -52,7 +45,6 @@
methods:{
dataGetMyAnswer(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user){
this.$axios.$get(config.api.get.Question.myCreated,{
params:{
page:currentPage,
......@@ -62,23 +54,9 @@
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Question.otherCreated+this.$route.query.user+'/questions',{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
dataGetNoticeAnswer(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user){
this.$axios.$get(config.api.get.Question.myParticipated,{
params:{
page:currentPage,
......@@ -87,17 +65,8 @@
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})}else{
this.$axios.$get(config.api.get.Question.otherParticipated+this.$route.query.user+'/question/participated',{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
......
pages/personal-center/home/blog.vue
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<blog-card :isMy="$store.state.userProfile.userId===$route.query.user" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.blogId" :info="val"></blog-card>
<blog-card :isMy="true" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.blogId" :info="val"></blog-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
......@@ -29,16 +29,7 @@
},
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的博客'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的博客'
}
},
},
components:{
......@@ -47,7 +38,6 @@
methods:{
dataGetBlog(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Blog.myList, {
params: {
......@@ -58,17 +48,7 @@
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Blog.otherList+this.$route.query.user+'/blogs', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
......
pages/personal-center/home/dynamic.vue
<template>
<div >
<release-card v-if="$store.state.userProfile.userId===$route.query.user" style="margin-top: 16px" @listenReleaseState="dataGetDynamic(1)"></release-card>
<release-card style="margin-top: 16px" @listenReleaseState="dataGetDynamic(1)"></release-card>
<social-card pageType="my" @listenSocialCardState="dataGetDynamic(1)" v-for="(val,index) in rightList" :key="val.postId" :info="val"></social-card>
<empty-card v-if="rightList.length===0&&$store.state.userProfile.userId!==$route.query.user" height="556px"></empty-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
......@@ -27,13 +27,7 @@
},
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的动态'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的动态'
}
},
},
components:{
......@@ -42,8 +36,6 @@
methods:{
dataGetDynamic(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Post.myList, {
params: {
page: currentPage,
......@@ -53,17 +45,7 @@
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Post.otherList+this.$route.query.user+'/posts', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
......
pages/personal-center/home/project.vue
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<project-card @listenProjectCardUpdate="dataGetProject(1)" :isMy="$store.state.userProfile.userId===$route.query.user" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.projectId" :info="val"></project-card>
<project-card @listenProjectCardUpdate="dataGetProject(1)" :isMy="true" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.projectId" :info="val"></project-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
......@@ -30,13 +30,7 @@
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的项目'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的项目'
}
},
},
components:{
......@@ -46,8 +40,6 @@
methods:{
dataGetProject(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Project.myList, {
params: {
page: currentPage,
......@@ -57,17 +49,6 @@
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Project.otherList+this.$route.query.user+'/projects', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
//返回页数 请求新的数据
......
pages/personal-center/home/topic.vue
......@@ -31,18 +31,12 @@
},
computed:{
rightConTitle(){
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId===this.$route.query.user){
if(this.$route.query.type==="my"){
return '我创建的话题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId===this.$route.query.user){
if(this.$route.query.type==="notice"){
return '我参与的话题'
}
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的话题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的话题'
}
}, },
components:{
ProjectCard,CardContainer,TopicCard,Pagination,EmptyCard
......
pages/personal-center/person/black-list.vue
<template>
<div style="background-color: #fff">
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<div style="min-height:556px">
<fan-card cardType="blackList" v-for="(val,index) in dataList" :key="val.blackedId" :id="val.blackedId"></fan-card>
<empty-card v-if="dataList.length===0" height="556px"></empty-card>
<pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
......@@ -14,21 +13,46 @@
import FanCard from '../../../components/pc/fanCard';
import config from '../../../action/config'
import Pagination from '../../../components/pc/pagination';
import EmptyCard from "../../../components/pc/emptyCard";
export default {
data(){
return{
dataList:[],
pages:1,
}
},
components:{
FanCard
FanCard,Pagination,EmptyCard
},
methods:{
dataGetPeople(currentPage){
this.$axios.$get(config.api.get.User.blacklist+this.$store.state.userProfile.userId,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
if(response.code===0){
this.dataList=response.data.dataList;
this.pages = response.data.totalPage;
}
})
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetPeople(currentPage)
}
}
}
</script>
......
pages/personal-center/person/fans.vue
<template>
<div style="background-color: #fff">
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<div style="min-height:556px">
<fan-card cardType="fans" v-for="(val,index) in dataList" :key="val.userId" :info="val"></fan-card>
<empty-card v-if="dataList.length===0" height="556px"></empty-card>
<pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
......@@ -14,21 +13,46 @@
import FanCard from '../../../components/pc/fanCard';
import config from '../../../action/config'
import Pagination from '../../../components/pc/pagination';
import EmptyCard from "../../../components/pc/emptyCard";
export default {
data(){
return{
dataList:[],
pages:1,
}
},
components:{
FanCard
FanCard,Pagination,EmptyCard
},
methods:{
dataGetPeople(currentPage){
this.$axios.$get(config.api.get.User.myFans,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
if(response.code===0){
this.dataList=response.data.dataList;
this.pages = response.data.totalPage;
}
})
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetPeople(currentPage)
}
}
}
</script>
......
pages/personal-center/person/following.vue
<template>
<div style="background-color: #fff">
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<fan-card></fan-card>
<div style="min-height:556px">
<fan-card cardType="follow" v-for="(val,index) in dataList" :key="val.followedId" :id="val.followedId"></fan-card>
<empty-card v-if="dataList.length===0" height="556px"></empty-card>
<pagination style="margin: 0 auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
......@@ -13,21 +13,46 @@
import FanCard from '../../../components/pc/fanCard';
import config from '../../../action/config'
import Pagination from '../../../components/pc/pagination';
import EmptyCard from "../../../components/pc/emptyCard";
export default {
data(){
return{
dataList:[],
pages:1,
}
},
components:{
FanCard
FanCard,Pagination,EmptyCard
},
methods:{
dataGetPeople(currentPage){
this.$axios.$get(config.api.get.User.myFollowing,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
if(response.code===0){
this.dataList=response.data.dataList;
this.pages = response.data.totalPage;
}
})
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetPeople(currentPage)
}
}
}
</script>
......
pages/personal-center/u.vue deleted 100644 → 0
<template>
<div class="home-container">
<div class="home-container__top">
<img src="https://s2.ax1x.com/2020/01/30/1lqW5j.png" alt="">
</div>
<div class="home-container__bottom">
<div class="home-container__bottom-center">
<div class="bottom-container__bg"></div>
<div class="bottom-container">
<div class="bottom-left">
<user-card :from="$store.state.userProfile.userId===userId?'my':''" :userId="userId"></user-card>
</div>
<div class="bottom-right">
<div class="bottom-right__tab">
<div class="tab__left">
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/u/project',query:{user:$route.query.user}}">
<p class="abs"></p>
<p class="word">项目</p>
<p class="line" v-if="selected==='personal-center-u-project'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/u/blog',query:{user:$route.query.user}}">
<p class="abs"></p>
<p class="word">博客</p>
<p class="line" v-if="selected==='personal-center-u-blog'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/u/answer',query:{type:'my',user:$route.query.user}}">
<p class="abs"></p>
<p class="word">问答</p>
<p class="line" v-if="selected==='personal-center-u-answer'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/u/dynamic',query:{user:$route.query.user}}">
<p class="abs"></p>
<p class="word">动态</p>
<p class="line" v-if="selected==='personal-center-u-dynamic'"></p>
</nuxt-link>
<nuxt-link tag="div" v-if="$store.state.userProfile.userId===userId" class="left__item" :to="{path:'/personal-center/u/topic',query:{type:'my',user:$route.query.user}}">
<p class="abs"></p>
<p class="word">话题</p>
<p class="line" v-if="selected==='personal-center-u-topic'"></p>
</nuxt-link>
<nuxt-link tag="div" class="left__item" :to="{path:'/personal-center/u/info',query:{user:$route.query.user}}">
<p class="abs"></p>
<p class="word">资料</p>
<p class="line" v-if="selected==='personal-center-u-info'"></p>
</nuxt-link>
</div>
<p class="tab__right">
</p>
</div>
<transition name="fade-transform" mode="out-in">
<div style="min-height:556px">
<nuxt-child ></nuxt-child>
</div>
</transition>
</div>
</div>
<page-footer></page-footer>
</div>
</div>
</div>
</template>
<script>
import UserCard from '../../components/pc/userCard';
import ProjectCard from '../../components/pc/projectCard';
import CardContainer from '../../components/pc/cardContainer';
import PageFooter from '../../components/pc/pageFooter';
export default {
layout: 'only-header',
data(){
return{
labelList: ['我的消息','私信'],
userId:'',
// selected: this.$route.name
}
},
components:{
UserCard,ProjectCard,CardContainer,PageFooter
},
watch:{
$route(to,from){
if(this.$route.name){
this.selected = this.$route.name
}
}
},
created(){
this.selected = this.$route.name;
let userId = this.$route.query.user;
if(userId){
this.userId = userId;
}else{
this.router.replace('/')
}
},
methods:{
showAlert(){
// $alert 使用方法
this.$alert('确认清空消息列表？', '', {
confirmButtonText: '确定',
// callback: action => {
// this.$message({
// type: 'info',
// message: `action: ${ action }`,
// confirmButtonPosition: 'left',
// });
// }
});
},
},
}
</script>
<style lang="scss" scoped>
html{
background-image: $bgImage;
}
.home-container{
align-items: flex-start;
.home-container__top{
width:100%;
height:auto;
z-index: 100;
position: relative;
img{
width:100%;
min-height:270*$length;
background-color:#B9A3D2 ;
height:auto;
}
}
.home-container__bottom{
position:relative;
margin:0 auto;
.home-container__bottom-center{
position:absolute;
top: -60*$length;
left:0;
right:0;
background-image: $bgImage;
.bottom-container__bg{
background-image: $bgImage;
position:absolute;
top: 60*$length;
left:0;
right:0;
z-index: -1;
}
.bottom-container{
position:relative;
z-index: 200;
padding-bottom: 32*$length;
width: $pageWidth;
margin:0 auto;
@extend %flex-row-spb;
align-items: flex-start;
.bottom-left{
width:302*$length;
}
.bottom-right{
width:938*$length;
.bottom-right__tab{
box-sizing: border-box;
height:62*$length;
padding:18*$length 24*$length;
border-bottom:1px solid #EFEFEF;
@extend %flex-row-spb;
.tab__left{
@extend %flex-row-spb;
.left__item{
position:relative;
@extend %flex-column-spb;
margin-right: 24*$length;
.abs{
position:absolute;
}
.word{
@include fontStyle(14,19,500,rgba(255,255,255,.6),center);
@extend %animate-transition;
@extend %cursorPointer;
&:hover{
color:#fff
}
}
.line{
position:absolute;
top:32*$length;
margin:0 auto;
left:0;
right:0;
width:16*$length;
height:4*$length;
border-radius:2px 2px 0 0;
background-color: #00AAE6;
}
}
}
.tab__right{
@include fontStyle(12,16,500,#999,center);
@extend %animate-transition;
@extend %cursorPointer;
&:hover{
color:#00AAE6
}
}
}
}
}
}
}
}
</style>
pages/personal-center/u/answer.vue deleted 100644 → 0
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<answer-card v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.questionId" :info="val"></answer-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
<script>
import ProjectCard from '../../../components/pc/projectCard';
import AnswerCard from '../../../components/pc/answerCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'answer',
data(){
return{
leftList:[],
rightList:[],
pages:1,
aaa:[]
}
},
computed:{
rightConTitle(){
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId===this.$route.query.user){
return '我创建的问题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId===this.$route.query.user){
return '我回答的问题'
}
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的问题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta回答的问题'
}
},
},
components:{
ProjectCard,CardContainer,AnswerCard,Pagination,EmptyCard
},
methods:{
dataGetMyAnswer(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user){
this.$axios.$get(config.api.get.Question.myCreated,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Question.otherCreated+this.$route.query.user+'/questions',{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
dataGetNoticeAnswer(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user){
this.$axios.$get(config.api.get.Question.myParticipated,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})}else{
this.$axios.$get(config.api.get.Question.otherParticipated+this.$route.query.user+'/question/participated',{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
//返回页数 请求新的数据
let type = this.$route.query.type
if(type==='my'){
this.dataGetMyAnswer(currentPage);
}
if(type==='notice'){
this.dataGetNoticeAnswer(currentPage);
}
}
},
}
</script>
<style lang="scss">
</style>
pages/personal-center/u/blog.vue deleted 100644 → 0
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<blog-card :isMy="$store.state.userProfile.userId===$route.query.user" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.blogId" :info="val"></blog-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
<script>
import BlogCard from '../../../components/pc/projectCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'blog',
data(){
return{
rightConType:1,
leftList:[],
rightList:[],
pages:1,
}
},
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的博客'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的博客'
}
},
},
components:{
BlogCard,CardContainer,Pagination,EmptyCard
},
methods:{
dataGetBlog(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Blog.myList, {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Blog.otherList+this.$route.query.user+'/blogs', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetBlog(currentPage);
}
},
}
</script>
pages/personal-center/u/dynamic.vue deleted 100644 → 0
<template>
<div >
<release-card v-if="$store.state.userProfile.userId===$route.query.user" style="margin-top: 16px" @listenReleaseState="dataGetDynamic(1)"></release-card>
<social-card pageType="my" @listenSocialCardState="dataGetDynamic(1)" v-for="(val,index) in rightList" :key="val.postId" :info="val"></social-card>
<empty-card v-if="rightList.length===0&&$store.state.userProfile.userId!==$route.query.user" height="556px"></empty-card>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
<script>
import SocialCard from '../../../components/pc/socialContactCard';
import ReleaseCard from '../../../components/pc/releaseCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'dynamic',
data(){
return{
rightConType:1,
leftList:[],
rightList:[],
pages:1,
}
},
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的动态'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的动态'
}
},
},
components:{
SocialCard,CardContainer,Pagination,ReleaseCard,EmptyCard
},
methods:{
dataGetDynamic(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Post.myList, {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Post.otherList+this.$route.query.user+'/posts', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetDynamic(currentPage);
}
},
}
</script>
pages/personal-center/u/info.vue deleted 100644 → 0
<template>
<div>
<card-container key="container3" style="margin-top: 16px" title="用户信息" label="换一换">
<empty-card height="556px"></empty-card>
</card-container>
</div>
</template>
<script>
import ProjectCard from '../../../components/pc/projectCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'info',
components:{
ProjectCard,CardContainer,Pagination,EmptyCard
}
}
</script>
pages/personal-center/u/project.vue deleted 100644 → 0
<template>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<project-card @listenProjectCardUpdate="dataGetProject(1)" :isMy="$store.state.userProfile.userId===$route.query.user" v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.projectId" :info="val"></project-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</template>
<script>
import ProjectCard from '../../../components/pc/projectCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'project',
data(){
return{
rightConType:1,
leftList:[],
rightList:[],
pages:1,
}
},
computed:{
rightConTitle(){
if(this.$store.state.userProfile.userId===this.$route.query.user){
return '我的项目'
}
if(this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta的项目'
}
},
},
components:{
ProjectCard,CardContainer,Pagination,EmptyCard
},
methods:{
dataGetProject(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Project.myList, {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}else{
this.$axios.$get(config.api.get.Project.otherList+this.$route.query.user+'/projects', {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
changePage(currentPage){
//返回页数 请求新的数据
this.dataGetProject(currentPage);
}
},
}
</script>
<style lang="scss">
</style>
pages/personal-center/u/topic.vue deleted 100644 → 0
<template>
<div>
<div>
<card-container key="container3" style="margin-top: 16px" :title="rightConTitle" label="换一换">
<topic-card v-if="rightList.length>0" v-for="(val,index) in rightList" :key="val.topicId" :info="val"></topic-card>
<empty-card v-if="rightList.length===0" height="556px"></empty-card>
</card-container>
<pagination key="container5" style="margin:20px auto;" :pages="pages" v-on:listenPageChange="changePage"></pagination>
</div>
</div>
</template>
<script>
import ProjectCard from '../../../components/pc/projectCard';
import TopicCard from '../../../components/pc/topicCard';
import CardContainer from '../../../components/pc/cardContainer';
import config from '../../../action/config';
import Pagination from "../../../components/pc/pagination";
import EmptyCard from "../../../components/pc/emptyCard";
export default {
name:'topic',
data(){
return{
leftList:[],
rightList:[],
pages:1,
}
},
computed:{
rightConTitle(){
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId===this.$route.query.user){
return '我创建的话题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId===this.$route.query.user){
return '我参与的话题'
}
if(this.$route.query.type==="my"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的话题'
}
if(this.$route.query.type==="notice"&&this.$store.state.userProfile.userId!==this.$route.query.user){
return 'Ta创建的话题'
}
}, },
components:{
ProjectCard,CardContainer,TopicCard,Pagination,EmptyCard
},
methods:{
dataGetMyTopic(currentPage){
if(this.$store.state.userProfile.userId===this.$route.query.user) {
this.$axios.$get(config.api.get.Topic.myList, {
params: {
page: currentPage,
size: 10
}
}).then((response) => {
this.rightList = response.data.dataList;
this.pages = response.data.totalPage;
})
}
},
dataGetNoticeTopic(currentPage){
this.$axios.$get(config.api.get.Topic.myfollowedList,{
params:{
page:currentPage,
size:10
}
}).then((response)=>{
this.rightList = response.data.records;
this.pages = response.data.pages;
})
},
changePage(currentPage){
//返回页数 请求新的数据
let type = this.$route.query.type
if(type==='my'){
this.dataGetMyTopic(currentPage);
}
if(type==='notice'){
this.dataGetNoticeTopic(currentPage);
}
}
},
}
</script>
<style lang="scss">
</style>
pages/project/detail/_id.vue
......@@ -73,7 +73,7 @@
<comment-con :id="articleDetail.projectId" type="project"></comment-con>
</div>
<div class="detail-container__right">
<user-card :userId="articleDetail.userId"></user-card>
<user-card :isFollow="articleDetail.followedAuthor" :userId="articleDetail.userId"></user-card>
<card-container style="margin-top:16px" title="相关推荐" label="换一换" more="更多">
</card-container>
</div>
......@@ -253,6 +253,7 @@
width:100%;
.info-left{
@extend %flex-row-spb;
justify-content: flex-start;
flex: 1;
> .icon-box{
margin-right:15*$length;
......@@ -273,7 +274,7 @@
@extend %flex-row-spb;
justify-content: flex-start;
> p{
margin-top: 8*$length;
margin-bottom: 8*$length;
margin-right:10*$length;
padding:2*$length 8*$length;
background-color: #F4F8FA;
......
plugins/globalBux.js 0 → 100644
import Vue from 'vue';
Vue.prototype.$globalBus = new Vue();
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