Feat:千县资讯分类&评论功能

This commit is contained in:
LinCyJang
2025-12-13 14:49:59 +08:00
parent 86ae127763
commit f055036001
5 changed files with 1120 additions and 7 deletions
+160 -5
View File
@@ -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;
}