Authored by yyq

author follow

... ... @@ -2,8 +2,8 @@
<Layout class="article-detail">
<RecycleScrollReveal :size="10" ref="scroll" @scroll="onScroll" :offset="2000" :on-fetch="onFetch" :manual-init="true">
<template v-slot:eternalTop>
<ArticleDeatilLong v-if="articleSingleDetail.sort == 2" ref="detailLong" :data="articleSingleDetail" :scroll-top="scrollTop" :list-title="listTitle" :scroll-to="scrollTo" @on-show-more="onShowMore"></ArticleDeatilLong>
<ArticleDeatilNote v-else :data="articleSingleDetail" :scroll-top="scrollTop" :list-title="listTitle" :scroll-to="scrollTo" @on-show-more="onShowMore"></ArticleDeatilNote>
<ArticleDeatilLong v-if="articleSingleDetail.sort == 2" ref="detailLong" :data="articleSingleDetail" :scroll-top="scrollTop" :list-title="listTitle" :scroll-to="scrollTo" @on-show-more="onShowMore" @on-follow="onFollowAuthor"></ArticleDeatilLong>
<ArticleDeatilNote v-else :data="articleSingleDetail" :scroll-top="scrollTop" :list-title="listTitle" :scroll-to="scrollTo" @on-show-more="onShowMore" @on-follow="onFollowAuthor"></ArticleDeatilNote>
</template>
<template class="article-item" #item="{ data }">
<ArticleItem2
... ... @@ -21,7 +21,7 @@
</template>
</RecycleScrollReveal>
<MoreActionSheet transfer ref="moreAction" @on-follow="onFollow" @on-delete="onDelete"></MoreActionSheet>
<MoreActionSheet transfer ref="moreAction" @on-follow="onFollowAuthor" @on-delete="onDelete"></MoreActionSheet>
</Layout>
</template>
... ... @@ -33,7 +33,7 @@ import ArticleDeatilNote from './components/detail/article-note';
import ArticleItem2 from './components/article/article-item2';
import MoreActionSheet from './components/detail/more-action-sheet';
import {createNamespacedHelpers} from 'vuex';
const {mapState, mapActions} = createNamespacedHelpers('article');
const {mapState, mapActions, mapMutations} = createNamespacedHelpers('article');
export default {
name: 'ArticleDetailPage',
... ... @@ -82,6 +82,7 @@ export default {
},
methods: {
...mapActions(['fetchArticleList', 'fetchDetailRecommendAricles']),
...mapMutations(['CHANGE_SINGLE_DETAIL_AUTHOR_FOLLOW']),
init() {
this.recommendArticles = {};
this.syncServiceArticleDetail();
... ... @@ -159,8 +160,13 @@ export default {
onShowMore() {
this.$refs.moreAction.show(this.articleSingleDetail);
},
onFollow() {},
onDelete() {}
onFollowAuthor(data, follow) {
console.log(data, follow);
this.CHANGE_SINGLE_DETAIL_AUTHOR_FOLLOW({authorUid: data.authorUid, follow});
},
onDelete() {
}
},
components: {
ArticleDeatilLong,
... ...
... ... @@ -3,7 +3,7 @@
<ArticleDetailHeader ref="header" :data="data" :step="headerAnimateStep" :title-step="headerTitleAnimateStep">
<div class="title-main">
<div class="title-info" :style="`transform: translate3d(0, ${titleTranslateY}, 0)`">
<ArticleItemHeader class="title-info-author" :share="share" :data="authorData" :lazy="lazy" :more="showMoreOpt" @on-follow="onFollow"></ArticleItemHeader>
<ArticleItemHeader class="title-info-author" :share="share" :data="authorData" :lazy="lazy" :more="showMoreOpt" @on-follow="onFollowAuthor"></ArticleItemHeader>
<div class="title-info-rec">{{listTitle}}</div>
</div>
</div>
... ... @@ -12,7 +12,7 @@
<ImageFormat class="cover-img" :src="coverImage.src" :width="coverImage.width" :height="coverImage.height" :style="`transform: translate3d(0, ${coverTranslateY}px, 0)`"></ImageFormat>
</div>
<div ref="authorBlock" class="author-block">
<ArticleItemHeader :share="share" :data="authorData" :lazy="lazy" :more="showMoreOpt" @on-follow="onFollow"></ArticleItemHeader>
<ArticleItemHeader :share="share" :data="authorData" :lazy="lazy" :more="showMoreOpt" @on-follow="onFollowAuthor"></ArticleItemHeader>
</div>
<div class="main-detail">
<div class="article-context">
... ... @@ -202,13 +202,8 @@ export default {
},
methods: {
...mapMutations(['SET_STATUS_BAR_COLOR']),
onClick() {
if (this.share) {
return this.$links.toDownloadApp();
}
},
onFollow(follow) {
this.$emit('on-follow', follow);
onFollowAuthor(follow) {
this.$emit('on-follow', this.data, follow);
},
onComment() {
this.showCommentAction = true;
... ...
... ... @@ -3,7 +3,7 @@
<ArticleDetailHeader ref="header" :data="data" :step="100" :title-step="100">
<div class="title-main">
<div class="title-info" :style="`transform: translate3d(0, ${titleTranslateY}, 0)`">
<ArticleItemHeader class="title-info-author" :share="share" :data="authorData" :lazy="lazy" :more="false"></ArticleItemHeader>
<ArticleItemHeader class="title-info-author" :share="share" :data="authorData" :lazy="lazy" :more="false" @on-follow="onFollowAuthor"></ArticleItemHeader>
<div class="title-info-rec">{{listTitle}}</div>
</div>
</div>
... ... @@ -156,6 +156,9 @@ export default {
}
},
methods: {
onFollowAuthor(follow) {
this.$emit('on-follow', this.data, follow);
},
onPraise() {
this.$refs.footer.onPraise();
},
... ...
... ... @@ -258,6 +258,11 @@ export default {
[Types.FETCH_DETAIL_RECOMMEND_REQUEST](state, topicId) {
state.fetchDetailRecommendArticles = true;
},
[Types.CHANGE_SINGLE_DETAIL_AUTHOR_FOLLOW](state, {authorUid, follow}) {
if (state.articleSingleDetail.authorUid === authorUid) {
state.articleSingleDetail.hasAttention = follow ? 'Y' : 'N';
}
},
[Types.FETCH_DETAIL_RECOMMEND_SUCCESS](state, {data}) {
state.fetchDetailRecommendArticles = false;
setArticleList(state, data, 'detail');
... ...
... ... @@ -37,6 +37,7 @@ export const CHANGE_TOPIC_FOLLOW = 'CHANGE_TOPIC_FOLLOW';
export const FETCH_ARTICLE_SINGLE_DETAIL_REQUEST = 'FETCH_ARTICLE_SINGLE_DETAIL_REQUEST';
export const FETCH_ARTICLE_SINGLE_DETAIL_FAILD = 'FETCH_ARTICLE_SINGLE_DETAIL_FAILD';
export const FETCH_ARTICLE_SINGLE_DETAIL_SUCCESS = 'FETCH_ARTICLE_SINGLE_DETAIL_SUCCESS';
export const CHANGE_SINGLE_DETAIL_AUTHOR_FOLLOW = 'CHANGE_SINGLE_DETAIL_AUTHOR_FOLLOW';
export const FETCH_DETAIL_RECOMMEND_REQUEST = 'FETCH_DETAIL_RECOMMEND_REQUEST';
export const FETCH_DETAIL_RECOMMEND_FAILD = 'FETCH_DETAIL_RECOMMEND_FAILD';
... ...