feat: add article demo videos and category counts

2026-08-17 15:50:17 +08:00
parent cf40df23f4
commit 6d847bdd86
5 changed files with 155 additions and 20 deletions
--- a/api/app/index.js
+++ b/api/app/index.js
@@ -60,6 +60,14 @@ export function getResourceByUserId(id) {
  })
 }

+// 查询首页分类内容数量
+export function getHomeCategoryCounts() {
+  return request({
+    url: '/app/article/app/homeCategoryCounts',
+    method: 'get'
+  })
+}
+

 // 根据字典类型查询字典数据信息
 export function getDicts(dictType) {
--- a/config.js
+++ b/config.js
@@ -3,6 +3,10 @@
 module.exports = {
  baseUrl: 'https://feast.yidaima.cn/prod-api',
  // baseUrl: 'http://127.0.0.1:8080',
+  // 文章演示视频所属的视频号
+  channelsVideo: {
+    finderUserName: 'sphL4UXLiAs4gH5'
+  },
  //应用信息
  appInfo: {
    // 应用名称(依沫博客已上架微信小程序，搜索名称即可查看演示)
--- a/pages/blog/bloginfo.vue
+++ b/pages/blog/bloginfo.vue
@@ -102,14 +102,11 @@
 					<!-- <view class="cover-quest">
 						提交问题
 					</view> -->
-					<view @click="showToast()" class="cover-list-btn">
-						<view class="cover-list-icon">
-							<image class="ui-img" src="https://img.yidaima.cn/feast/dianzan.svg"
-								mode="aspectFit">
-							</image>
-						</view>
-						<view class="cover-list-font">点赞</view>
+					<view @click="openChannelsVideo()" class="cover-list-btn">
+						<view class="cover-list-icon channels-video-icon cuIcon-videofill"></view>
+						<view class="cover-list-font">观看视频</view>
 					</view>
+					<!-- 点赞入口暂时隐藏，保留 showToast 方法便于后续恢复。 -->

 					<view v-if="blogInfo.appResourceId" @click="download()">
 						<view class="cover-list-icon">
@@ -370,6 +367,64 @@
 					})
 				})
 			},
+			openChannelsVideo() {
+				const feedIds = [
+					this.blogInfo && this.blogInfo.videoFeedId,
+					this.blogInfo && this.blogInfo.videoFeedId2
+				].map(function(item) {
+					return item ? String(item).trim() : ''
+				}).filter(function(item) {
+					return !!item
+				})
+				if (!feedIds.length) {
+					uni.showModal({
+						title: '温馨提示',
+						content: '暂无演示视频',
+						showCancel: false
+					})
+					return
+				}
+				if (feedIds.length === 1) {
+					this.launchChannelsVideo(feedIds[0])
+					return
+				}
+				const that = this
+				uni.showActionSheet({
+					itemList: ['演示视频一', '演示视频二'],
+					success: function(result) {
+						that.launchChannelsVideo(feedIds[result.tapIndex])
+					}
+				})
+			},
+			launchChannelsVideo(feedId) {
+				// #ifdef MP-WEIXIN
+				if (typeof wx === 'undefined' || !wx.openChannelsActivity) {
+					uni.showToast({
+						title: '当前微信版本暂不支持，请升级微信',
+						icon: 'none'
+					})
+					return
+				}
+				wx.openChannelsActivity({
+					finderUserName: config.channelsVideo.finderUserName,
+					feedId: feedId,
+					fail: function(error) {
+						console.error('打开视频号视频失败', error)
+						uni.showToast({
+							title: '视频打开失败，请稍后重试',
+							icon: 'none'
+						})
+					}
+				})
+				return
+				// #endif
+				// #ifndef MP-WEIXIN
+				uni.showToast({
+					title: '请在微信小程序中观看视频',
+					icon: 'none'
+				})
+				// #endif
+			},
 			download() {
 				const id = this.blogInfo && this.blogInfo.appResourceId
 				if (!id) {
@@ -710,6 +765,13 @@
 		line-height: unset;
 	}

+	.channels-video-icon {
+		color: #6d52f5;
+		font-size: 56upx;
+		line-height: 64upx;
+		text-align: center;
+	}
+
 	button::after {
 		border: none;
 	}
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -24,23 +24,31 @@
 			<view class="index-info">
 				<view class="mt30 grid text-center col-4 bg-white" style="padding: 30rpx 0; border-radius: 15rpx;row-gap: 30rpx;">
 					<view @click="Jump('/pages/tool/highQualityCode')">
-						<image class="cell_3_icon flex justify-center align-center" style="height:65rpx;" src="https://img.yidaima.cn/feast/sjbz.png" mode="aspectFit">
-						</image>
+						<view class="category-icon-wrap">
+							<image class="category-icon" src="https://img.yidaima.cn/feast/sjbz.png" mode="aspectFit"></image>
+							<text v-if="categoryCounts.highQuality !== null" class="category-count-badge">{{formatCategoryCount(categoryCounts.highQuality)}}</text>
+						</view>
 						<view>精品源码</view>
 					</view>
 					<view @click="Jump('/pages/tool/resource')">
-						<image class="cell_3_icon flex justify-center align-center" style="height: 65rpx;" src="https://img.yidaima.cn/feast/dnbz.png" mode="aspectFit">
-						</image>
+						<view class="category-icon-wrap">
+							<image class="category-icon" src="https://img.yidaima.cn/feast/dnbz.png" mode="aspectFit"></image>
+							<text v-if="categoryCounts.resource !== null" class="category-count-badge">{{formatCategoryCount(categoryCounts.resource)}}</text>
+						</view>
 						<view>资源分享</view>
 					</view>
 					<view @click="Jump('/pages/tool/integralCode')">
-						<image class="cell_3_icon flex justify-center align-center" style="height: 65rpx;" src="https://img.yidaima.cn/feast/sp.png" mode="aspectFit">
-						</image>
+						<view class="category-icon-wrap">
+							<image class="category-icon" src="https://img.yidaima.cn/feast/sp.png" mode="aspectFit"></image>
+							<text v-if="categoryCounts.integral !== null" class="category-count-badge">{{formatCategoryCount(categoryCounts.integral)}}</text>
+						</view>
 						<view>积分源码</view>
 					</view>
 					<view @click="Jump('/pages/tool/freeCode')">
-						<image class="cell_3_icon flex justify-center align-center" style="height: 65rpx;" src="https://img.yidaima.cn/feast/sycc.png" mode="aspectFit">
-						</image>
+						<view class="category-icon-wrap">
+							<image class="category-icon" src="https://img.yidaima.cn/feast/sycc.png" mode="aspectFit"></image>
+							<text v-if="categoryCounts.free !== null" class="category-count-badge">{{formatCategoryCount(categoryCounts.free)}}</text>
+						</view>
 						<view>免费源码</view>
 					</view>
 				</view>
@@ -135,7 +143,7 @@
 		getConfigKey
 	} from "@/api/app/public.js"
 	import {
-		listArticle,newUser,wxLogin,getSysSet
+		listArticle,newUser,wxLogin,getSysSet,getHomeCategoryCounts
 	} from "@/api/app/index.js"
 	import {
 		getQiniuToken
@@ -162,6 +170,12 @@
 				swiperData: [],
 				noticeStr:"",
 				blogList:[],
+				categoryCounts: {
+					highQuality: null,
+					resource: null,
+					integral: null,
+					free: null
+				},
 				queryParams: {
 				  pageNum: 1,
 				  pageSize: 6,
@@ -239,6 +253,7 @@
 			})
 			//获取文章列表
 			this.getBlogList()
+			this.getCategoryCounts()
 			//初始化插屏广告
 			that.adUnitId = uni.getStorageSync("sysSet").homeAd
 			this.getWxchaAd()
@@ -274,6 +289,17 @@
 			}
 		},
 		methods: {
+			getCategoryCounts() {
+				getHomeCategoryCounts().then(response => {
+					this.categoryCounts = Object.assign({}, this.categoryCounts, response.data || {})
+				}).catch(error => {
+					console.error('获取首页分类数量失败', error)
+				})
+			},
+			formatCategoryCount(count) {
+				const value = Number(count) || 0
+				return value > 999 ? '999+' : String(value)
+			},
 			articleImage(item) {
 				if (item && item.imageFallback) {
 					return this.$image.original(item.showImg)
@@ -397,6 +423,41 @@
 </script>

 <style lang="scss">
+	.category-icon-wrap {
+		position: relative;
+		width: 80rpx;
+		height: 65rpx;
+		margin: 0 auto;
+	}
+
+	.category-icon {
+		display: block;
+		width: 80rpx;
+		height: 65rpx;
+	}
+
+	.category-count-badge {
+		position: absolute;
+		top: -8rpx;
+		right: -12rpx;
+		z-index: 2;
+		box-sizing: border-box;
+		min-width: 30rpx;
+		height: 30rpx;
+		padding: 0 7rpx;
+		border: 1.5rpx solid rgba(255, 255, 255, 0.95);
+		border-radius: 16rpx;
+		background: linear-gradient(135deg, #8a8fff 0%, #6d52f5 100%);
+		box-shadow: 0 5rpx 12rpx rgba(109, 82, 245, 0.24);
+		color: #fff;
+		font-size: 16rpx;
+		font-weight: 500;
+		line-height: 27rpx;
+		text-align: center;
+		letter-spacing: 0;
+		white-space: nowrap;
+	}
+
 	/* 列表没有数据 */
 	.no-list-data {
 		text-align: center;
--- a/pages/search/index.vue
+++ b/pages/search/index.vue
@@ -23,13 +23,13 @@
 				<view class='cu-tag round light' :class="'bg-' + item.name">{{item.title}}</view>
 			</view>
 		</view>
-		<!-- 热门文章 -->
+		<!-- 搜索结果 -->
 		<view class="titel-felx">
 			<view class="time-img">
 				<image style="width: 100%;height: 100%;" src="https://img.yidaima.cn/feast/dstrict-3.svg" mode=""></image>
 			</view>
 			<view class="titel-h-go">
-				热门文章
+				搜索结果
 			</view>
 		</view>
 		<!-- 文章列表 -->
@@ -157,7 +157,7 @@
 					isShow: 1,
 					articleType: null,
 					keyword: null,
-					orderType: "look_number"
+					orderType: "create_time"
 				},
 				bLogTypeList: [],
 				total: 0,
@@ -202,7 +202,7 @@
 				isShow: 1,
 				articleType: null,
 				keyword: null,
-				orderType: "look_number"
+				orderType: "create_time"
 			}
 			this.searchValue = null
 			this.getBlogList()