Feat:千县资讯分类&评论功能
This commit is contained in:
@@ -148,6 +148,21 @@
|
||||
v-if="activeIndex === 3"
|
||||
class="info-section"
|
||||
>
|
||||
<view class="news-category">
|
||||
<scroll-view scroll-x class="news-category-scroll" show-scrollbar="false">
|
||||
<view class="news-category-wrapper">
|
||||
<view
|
||||
v-for="(item, index) in newsCategoryList"
|
||||
:key="index"
|
||||
class="category-item"
|
||||
:class="{ active: newsCurrent === index }"
|
||||
@click="changeNewsTab(index)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view>
|
||||
<view v-if="infoArray.length > 0" class="info-wrapper">
|
||||
<view class="info-list">
|
||||
@@ -222,7 +237,83 @@
|
||||
:class="item.hasZan ? 'on' : ''"
|
||||
class="seeNum-txt"
|
||||
>{{ item.zan }}</text>
|
||||
|
||||
</view>
|
||||
<view class="flex">
|
||||
<u-icon name="chat" size="24"></u-icon>
|
||||
<text class="seeNum-txt">{{ item.replyCount || 0}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="comment-list v12-px-3" v-if="item.latestReplyList" @click="infoClick(item)">
|
||||
<view class="v12-mt-2" v-for="(comment, i) in item.latestReplyList" :key="i">
|
||||
<view class="user-info v12-align-center">
|
||||
<view class="user-avatar">
|
||||
<u-avatar :src="comment.userAvatar"></u-avatar>
|
||||
</view>
|
||||
<view class="user-name v12-ml-3">
|
||||
<view class="v12-font-bold v12-dark-text v12-font-32">
|
||||
<text>{{ comment.userNickName }}</text>
|
||||
<text v-if="comment.userIsAdmin" class="v12-ml-1 v12-primary v12-white-text v12-font-24 v12-font-weight-400 v12-px-1 v12-radius-8">
|
||||
{{ '店主' }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="v12-font-22 v12-secondary-dark-text v12-mt-1">
|
||||
<text>{{ formatterTime(comment.createTime) }}</text>
|
||||
<text v-if="comment.at">
|
||||
{{ ' 回复 ' + comment.at.atNickName }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-info v12-d-flex" >
|
||||
<view class="user-avatar">
|
||||
<view style="opacity: 0;">
|
||||
<u-avatar></u-avatar>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-name v12-ml-3">
|
||||
<view class="v12-font-28 v12-dark-text">
|
||||
{{ comment.reply }}
|
||||
</view>
|
||||
<view v-if="comment.children">
|
||||
<view class="v12-mt-2" v-for="(_comment, atIndex) in comment.children" :key="atIndex">
|
||||
<view class="user-info v12-align-center">
|
||||
<view class="user-avatar">
|
||||
<u-avatar size="35" :src="_comment.userAvatar"></u-avatar>
|
||||
</view>
|
||||
<view class="user-name v12-ml-3">
|
||||
<view class="v12-font-bold v12-dark-text v12-font-32">
|
||||
<text>{{ _comment.userNickName }}</text>
|
||||
<text v-if="_comment.userIsAdmin" class="v12-ml-1 v12-primary v12-white-text v12-font-24 v12-font-weight-400 v12-px-1 v12-radius-8">
|
||||
{{ '店主' }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="v12-font-22 v12-secondary-dark-text v12-mt-1">
|
||||
<text>{{ formatterTime(_comment.createTime) }}</text>
|
||||
<text v-if="_comment.at && _comment.parentReplyId !== comment.id">
|
||||
{{ ' 回复 ' + _comment.at.atNickName }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-info v12-align-center">
|
||||
<view class="user-avatar">
|
||||
<view style="opacity: 0;">
|
||||
<u-avatar size="35"></u-avatar>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-name v12-ml-3">
|
||||
<view class="v12-font-28 v12-dark-text">
|
||||
{{ _comment.reply }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@@ -772,7 +863,8 @@ import {
|
||||
getCountyFamousCityDetail,
|
||||
getShareImg,
|
||||
getSaleList,
|
||||
getJiaLouList
|
||||
getJiaLouList,
|
||||
getCityNewsCategory
|
||||
} from '@/api/qianxian'
|
||||
import ProductWindow from '@/components/ProductWindow'
|
||||
import goCartMixin from '@/mixins/goCartMixins'
|
||||
@@ -859,6 +951,8 @@ export default {
|
||||
videoPlayers:[],
|
||||
jiaLouList: [],
|
||||
countyId: null,
|
||||
newsCategoryList: [],
|
||||
newsCurrent: 0
|
||||
}
|
||||
},
|
||||
onShareAppMessage() {
|
||||
@@ -899,8 +993,46 @@ export default {
|
||||
this.getListReq()
|
||||
this.getsaleList()
|
||||
this.queryGuide('countyFamousIndex')
|
||||
this.getCityNewsCategoryReq()
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取县城资讯类别
|
||||
*/
|
||||
getCityNewsCategoryReq() {
|
||||
getCityNewsCategory().then(res => {
|
||||
if(res.status === 200) {
|
||||
this.newsCategoryList = [{name: '全部', id: ''}].concat(res.data || [])
|
||||
}
|
||||
})
|
||||
},
|
||||
changeNewsTab(index) {
|
||||
if (this.newsCurrent === index) return
|
||||
this.newsCurrent = index
|
||||
this.getInfoReq()
|
||||
},
|
||||
formatterTime(time) {
|
||||
const now = new Date();
|
||||
const date = new Date(time);
|
||||
const diff = now - date;
|
||||
const diffMin = Math.floor(diff / 1000 / 60);
|
||||
const diffHour = Math.floor(diff / 1000 / 60 / 60);
|
||||
const diffDay = Math.floor(diff / 1000 / 60 / 60 / 24);
|
||||
if (diffMin < 1) {
|
||||
return "刚刚";
|
||||
} else if (diffHour < 1) {
|
||||
return diffMin + "分钟前";
|
||||
} else if (diffDay < 1) {
|
||||
return diffHour + "小时前";
|
||||
} else if (diffDay < 7) {
|
||||
return diffDay + "天前";
|
||||
} else {
|
||||
return date.getFullYear() + "年" + (date.getMonth() + 1) + "月" + date.getDate() + "日";
|
||||
}
|
||||
},
|
||||
infoClick(info) {
|
||||
this.$yrouter.push('/pkg_product/views/newsInfo?id=' + info.id)
|
||||
},
|
||||
showFunctionGuide() {
|
||||
if(this._step == this.functionGuideData.step) return
|
||||
if(this.functionGuideData.step == 1) {
|
||||
@@ -1221,10 +1353,12 @@ export default {
|
||||
_this.isLoadInfoListSuccess = false
|
||||
_this.loading = true
|
||||
_this.infoArray = []
|
||||
const categoryId = this.newsCategoryList[this.newsCurrent] ? this.newsCategoryList[this.newsCurrent].id : ''
|
||||
getCountyFamousCityNews({
|
||||
page: 1,
|
||||
limit: 9999,
|
||||
countyFamousDataId: _this.id
|
||||
countyFamousDataId: _this.id,
|
||||
categoryId: categoryId
|
||||
}).then(res => {
|
||||
const { data } = res
|
||||
_this.loading = false
|
||||
@@ -1385,9 +1519,6 @@ export default {
|
||||
})
|
||||
})
|
||||
},
|
||||
infoClick(info) {
|
||||
// this.$yrouter.push('/pagesInn/inn/innInfoDetail?id=' + info.id)
|
||||
},
|
||||
coverPlay(){
|
||||
this.videoPlayers.forEach(player => {
|
||||
const playerCtx = uni.createVideoContext(player, this)
|
||||
@@ -1914,6 +2045,30 @@ export default {
|
||||
padding: 22rpx;
|
||||
}
|
||||
.info-section {
|
||||
.news-category {
|
||||
padding-bottom: 20rpx;
|
||||
.news-category-scroll {
|
||||
white-space: nowrap;
|
||||
width: 100%;
|
||||
}
|
||||
.news-category-wrapper {
|
||||
display: flex;
|
||||
justify-content: space-evenly;
|
||||
}
|
||||
.category-item {
|
||||
display: inline-block;
|
||||
padding: 10rpx 30rpx;
|
||||
margin-right: 20rpx;
|
||||
border-radius: 16rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
&.active {
|
||||
color: #fff;
|
||||
background: #C52733
|
||||
}
|
||||
}
|
||||
}
|
||||
.info-item + .info-item {
|
||||
margin: 22rpx 0 0 0;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user