feat: 新增首页搜索页面

pages.json

@@ -47,6 +47,13 @@
 				"navigationStyle": "custom"
 			}
 		},
+		{
+			"path": "pages/index/homePageSearch",
+			"style": {
+				"navigationBarTitleText": "搜索",
+				"enablePullDownRefresh": false
+			}
+		},
 		{
 			"path": "pages/index/video",
 			"aliasPath": "/",
@@ -89,7 +96,7 @@
 				"navigationStyle": "custom",
 				"enablePullDownRefresh": false
 			}
-		
+
 		},
 		{
 			"path": "pages/user/index",
@@ -106,28 +113,28 @@
 				"navigationBarTitleText": "产品详情",
 				"enablePullDownRefresh": false
 			}
-		
+
 		}, {
 			"path": "pages/shopping/cart",
 			"style": {
 				"navigationBarTitleText": "购物车",
 				"enablePullDownRefresh": false
 			}
-		
+
 		}, {
 			"path": "pages/shopping/confirmOrder",
 			"style": {
 				"navigationBarTitleText": "确认订单",
 				"enablePullDownRefresh": false
 			}
-		
+
 		}, {
 			"path": "pages/shopping/paymentOrder",
 			"style": {
 				"navigationBarTitleText": "去支付",
 				"enablePullDownRefresh": false
 			}
-		
+
 		}, {
 			"path": "pages/shopping/payOrder",
 			"style": {
@@ -141,7 +148,7 @@
 				"navigationBarTitleText": "支付成功",
 				"enablePullDownRefresh": false
 			}
-		
+
 		},
 		{
 			"path": "pages/auth/wechatList",
@@ -4265,25 +4272,25 @@
 						"navigationBarTextStyle": "black"
 					}
 				},
-					{
-						"path": "productList",
-						"style": {
-							"navigationBarTitleText": "商品列表"
-						}
-					},
-					{
-						"path": "recommendList",
-						"style": {
-							"navigationBarTitleText": "商品列表"
-						}
-					},
-					{
-						"path": "productSearch",
-						"style": {
-							"navigationBarTitleText": "产品搜索"
-						}
-					
-					},
+				{
+					"path": "productList",
+					"style": {
+						"navigationBarTitleText": "商品列表"
+					}
+				},
+				{
+					"path": "recommendList",
+					"style": {
+						"navigationBarTitleText": "商品列表"
+					}
+				},
+				{
+					"path": "productSearch",
+					"style": {
+						"navigationBarTitleText": "产品搜索"
+					}
+
+				},
 				{
 					"path": "productDetails",
 					"style": {
@@ -4578,7 +4585,7 @@
 			// 	"selectedIconPath": "/static/image/tabbar/tab_new_on_icon.png",
 			// 	"text": "消息"
 			// },
-			
+
 			{
 				"pagePath": "pages/index/index",
 				"iconPath": "/static/image/tabbar/home.png",
@@ -4586,12 +4593,12 @@
 				"text": "首页"
 			},
 
-			// {
-			// 	"pagePath": "pages/course/index",
-			// 	"iconPath": "/static/image/tabbar/tab_hall_icon.png",
-			// 	"selectedIconPath": "/static/image/tabbar/tab_hall_on_icon.png",
-			// 	"text": "讲堂"
-			// },
+			{
+				"pagePath": "pages/course/index",
+				"iconPath": "/static/image/tabbar/tab_hall_icon.png",
+				"selectedIconPath": "/static/image/tabbar/tab_hall_on_icon.png",
+				"text": "讲堂"
+			},
 			{
 				"pagePath": "pages_mall/index",
 				"iconPath": "/static/image/tabbar/mall.png",

pages/index/homePageSearch.vue

@@ -0,0 +1,681 @@
+<template>
+	<view class="container">
+		<!-- 顶部导航 Tab -->
+		<view class="top-nav">
+			<view class="search-cont">
+				<view class="inner">
+					<image class="icon-search"
+						src="https://jnlzjk-1323137866.cos.ap-chongqing.myqcloud.com/shop/images/search.png" mode="">
+					</image>
+					<input type="text" @confirm="goSearch" v-model="keywordValue" placeholder="请输入关键字搜索内容"
+						placeholder-style="font-size:28rpx;color:#BBBBBB;font-family: PingFang SC;" />
+					<u-icon v-if="keywordValue !=''" name="close-circle" color="24rpx" size="#00000073"
+						@tap="deleteKeywordMethods"></u-icon>
+				</view>
+				<view class="searchBtnViewClass" @tap="goSearch">搜索</view>
+				<!-- <view class="icon-search">
+					<image @click="showChange(2)" v-if="true"
+						src="https://jnlzjk-1323137866.cos.ap-chongqing.myqcloud.com/shop/images/search1.png" mode="">
+					</image>
+					<image @click="showChange(1)" v-else
+						src="https://jnlzjk-1323137866.cos.ap-chongqing.myqcloud.com/shop/images/search2.png" mode="">
+					</image>
+				</view> -->
+			</view>
+			<view class="nav-row">
+				<view class="nav-all" :class="{ active: activeId === 'all'}" @tap.stop="onSelectAll">
+					<text>全部</text>
+				</view>
+				<scroll-view scroll-x class="nav-scroll" :show-scrollbar="false">
+					<view class="nav-inner">
+						<view v-for="(item, index) in navList" :key="index"
+							:class="['nav-item', { active: item.id === activeId }]"
+							@tap.stop="onSelectByIndex(item.id)">
+							<text>{{ item.categoryName}}</text>
+						</view>
+					</view>
+				</scroll-view>
+			</view>
+		</view>
+		<!-- 最近学习 内容 -->
+		<scroll-view scroll-y class="scroll-wrap" :show-scrollbar="false">
+			<!-- 有学习记录：按日期分组列表 -->
+			<template v-if="courseList.length > 0">
+				<view class="course-grid">
+					<view v-for="(course, idx) in courseList" :key="idx" class="course-card"
+						@click="onCourseClick(course)">
+						<view class="card-cover">
+							<image :src="course.cover || '/static/logo.jpg'" mode="aspectFill" class="cover-img">
+							</image>
+						</view>
+						<view class="course-info">
+							<text class="card-title">{{ course.title }}</text>
+							<view class="x-end" style="justify-content: space-between;">
+								<view class="course-meta">
+									<image src="@/static/images/new/renshu.png"></image>
+									<text class="meta-count">{{ course.views }}</text>
+								</view>
+								<view class="btn-watch" @click.stop="onCourseClick(course)">立即观看</view>
+							</view>
+						</view>
+
+					</view>
+				</view>
+			</template>
+
+			<!-- 无学习记录：空态 + 为您精选 -->
+			<template v-else>
+				<view class="empty-state">
+					<!-- <view class="empty-icon"></view> -->
+					<image class="empty-icon" src="@/static/images/new/nodata.png"></image>
+					<text class="empty-text">没有搜索任何内容，换个词试试</text>
+				</view>
+				<view v-if="recommendList.length>0" class="recommend-section">
+					<text class="recommend-title">大家都在学习</text>
+					<view class="course-grid" style="padding: 0;">
+						<view v-for="(course, idx) in recommendList" :key="idx" class="course-card"
+							@click="onCourseClick(course)">
+							<view class="card-cover">
+								<image :src="course.cover || '/static/logo.jpg'" mode="aspectFill" class="cover-img">
+								</image>
+							</view>
+
+							<view class="card-footer">
+								<text class="card-title">{{ course.title }}</text>
+								<view class="x-end" style="justify-content: space-between;">
+									<view class="course-meta">
+										<image src="@/static/images/new/renshu.png"></image>
+										<text class="meta-count">{{ course.views }}</text>
+									</view>
+									<view class="btn-watch" @click.stop="onCourseClick(course)">立即观看</view>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</template>
+			<view class="bottom-placeholder"></view>
+		</scroll-view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				keywordValue: '',
+				statusBarHeight: uni.getSystemInfoSync().statusBarHeight + 'px',
+				activeId: 'all',
+				categoryExpand: true,
+				categoryIndex: 0,
+				categories: ['全部', '歌唱艺术', '太极养生', '防骗指南', '手机摄影', '棋牌益智', '用药指导', '膳食营养', '慢病管理'],
+				courseList: [{
+						title: '刘金的《0基础金曲演唱速练课》',
+						views: '9239',
+						cover: ''
+					},
+					{
+						title: '邹方斌讲《毛笔书法修心课》',
+						views: '10.8w',
+						cover: ''
+					},
+					{
+						title: '张斌《元气八段锦》系列课',
+						views: '2.5w',
+						cover: ''
+					},
+					{
+						title: '翔哥精讲摄影课—手机微距拍摄技巧...',
+						views: '100w+',
+						cover: ''
+					},
+					{
+						title: '道家智慧 入门21讲',
+						views: '1.2w',
+						cover: ''
+					},
+					{
+						title: '入门进阶必修 瑜伽呼吸全精讲',
+						views: '3.6w',
+						cover: ''
+					}
+				],
+				recentList: [{
+						date: '2026-02-08',
+						list: [{
+								title: '歌唱家刘金的《0基础金曲演唱速练课》',
+								progress: 87,
+								cover: ''
+							},
+							{
+								title: '资深编辑邹方斌讲《毛笔书法修心课》',
+								progress: 56,
+								cover: ''
+							}
+						]
+					},
+					{
+						date: '2026-02-01',
+						list: [{
+							title: '张斌《元气八段锦》系列课',
+							progress: 56,
+							cover: ''
+						}]
+					}
+				],
+				navList: [{
+						id: 37,
+						categoryName: "健康食品"
+					},
+					{
+						id: 35,
+						categoryName: "绿色有机"
+					},
+					{
+						id: 36,
+						categoryName: "膳食营养"
+					},
+					{
+						id: 33,
+						categoryName: "太极养生"
+					}
+				],
+				recommendList: [{
+						title: '刘金的《0基础金曲演唱速练课》',
+						views: '9239',
+						cover: ''
+					},
+					{
+						title: '邹方斌讲《毛笔书法修心课》',
+						views: '10.8w',
+						cover: ''
+					},
+					{
+						title: '张斌《元气八段锦》系列课',
+						views: '2.5w',
+						cover: ''
+					},
+					{
+						title: '翔哥精讲摄影课-手机微距拍摄技巧...',
+						views: '100w+',
+						cover: ''
+					}
+				]
+			}
+		},
+		onLoad() {
+			// 若无最近学习，可置空 recentList 显示空态
+			// this.recentList = [];
+		},
+		methods: {
+			deleteKeywordMethods() {
+				this.keywordValue = ''
+				this.goSearch()
+			},
+			goSearch() {},
+			onSelectAll() {
+				this.activeId = 'all'
+			},
+			onCourseClick(course) {
+				uni.showToast({
+					title: course.title || '立即观看',
+					icon: 'none'
+				})
+				// uni.navigateTo({ url: '/pages_course/videovip?id=' + (course.id || '') })
+			},
+			onSelectByIndex(id) {
+				this.activeId = id
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	/* 图片箭头旋转类（展开时向上） */
+	.rotate-arrow {
+		transform: rotate(180deg);
+	}
+
+	.container {
+		min-height: 100vh;
+		background: #F5F5F5;
+		display: flex;
+		flex-direction: column;
+	}
+
+	/* 顶部 Tab */
+	.top-nav {
+		display: flex;
+		flex-direction: column;
+		background: #fff;
+		/* border-bottom: 1rpx solid #f0f0f0; */
+	}
+
+	.search-cont {
+		padding: 24rpx 24rpx 40rpx;
+		background-color: #FFFFFF;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+
+		.inner {
+			box-sizing: border-box;
+			width: calc(100vw - 135rpx);
+			height: 72upx;
+			background: #F7F7F7;
+			border-radius: 36upx;
+			display: flex;
+			align-items: center;
+			padding: 0 20upx;
+
+			.icon-search {
+				width: 28upx;
+				height: 28upx;
+				margin-right: 20upx;
+			}
+
+			input {
+				height: 60upx;
+				line-height: 60upx;
+				flex: 1;
+				padding-right: 15rpx;
+			}
+
+		}
+
+		.searchBtnViewClass {
+			font-weight: 400;
+			font-size: 36rpx;
+			color: #222222;
+		}
+
+		.icon-search {
+			margin-left: 10upx;
+			width: 40upx;
+			height: 40upx;
+
+			image {
+				width: 40upx;
+				height: 40upx;
+			}
+
+		}
+	}
+
+	.nav-row {
+		display: flex;
+		align-items: center;
+		padding: 0 24rpx 24rpx;
+		gap: 30rpx;
+	}
+
+	.nav-all {
+		flex-shrink: 0;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 40rpx;
+		color: rgba(0, 0, 0, 0.85);
+		line-height: 56rpx;
+	}
+
+	.nav-all.active {
+		color: #FF233C;
+		font-weight: 600;
+	}
+
+	.nav-scroll {
+		flex: 1;
+	}
+
+	.nav-inner {
+		display: inline-flex;
+		padding: 0;
+		gap: 30rpx;
+	}
+
+	.nav-item {
+		flex-shrink: 0;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 40rpx;
+		color: rgba(0, 0, 0, 0.85);
+		line-height: 56rpx;
+	}
+
+	.nav-item.active {
+		color: #FF233C;
+		font-weight: 600;
+	}
+
+	/* 滚动区 */
+	.scroll-wrap {
+		flex: 1;
+		height: 0;
+	}
+
+	/* 分类标签 */
+	.category-wrap {
+		padding: 24rpx 0;
+		border-radius: 0rpx 0rpx 20rpx 20rpx;
+		background: #fff;
+		display: flex;
+		align-items: center;
+		flex-direction: column;
+	}
+
+	.category-tags {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 24rpx;
+		flex-direction: row;
+		justify-content: center;
+	}
+
+	.category-tags.collapsed {
+		max-height: 88rpx;
+		overflow: hidden;
+	}
+
+	.tag-item {
+		width: 30%;
+		padding: 20rpx 0;
+		text-align: center;
+		border-radius: 20rpx;
+		background: #f0f0f0;
+	}
+
+	.tag-item text {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 40rpx;
+		color: rgba(0, 0, 0, 0.85);
+	}
+
+	.tag-item.active {
+		background: linear-gradient(135deg, #FF5267 0%, #FF233C 100%);
+	}
+
+	.tag-item.active text {
+		color: #fff;
+	}
+
+	.expand-btn {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		margin-top: 20rpx;
+		width: 166rpx;
+		height: 64rpx;
+		border-radius: 32rpx;
+		border: 2rpx solid #FF233C;
+	}
+
+	.expand-btn text {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 32rpx;
+		color: #FF233C;
+	}
+
+	.expand-btn .arrow {
+		margin-left: 6rpx;
+		font-size: 22rpx;
+	}
+
+	.expand-btn image {
+		margin-left: 10rpx;
+		width: 32rpx;
+		height: 32rpx;
+	}
+
+	/* 课程网格 */
+	.course-grid {
+		display: flex;
+		flex-wrap: wrap;
+		padding: 24rpx;
+		gap: 24rpx 20rpx;
+		flex-direction: column;
+	}
+
+	.course-card {
+		display: flex;
+		background: #fff;
+		border-radius: 20rpx;
+		overflow: hidden;
+		padding: 20rpx;
+	}
+
+	.course-tag {
+		position: absolute;
+		left: 0;
+		bottom: 0;
+		right: 0;
+		padding: 8rpx 12rpx;
+		background: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
+		font-size: 22rpx;
+		color: #fff;
+	}
+
+	.course-info {
+		flex: 1;
+		padding-left: 24rpx;
+		/* padding: 20rpx 24rpx; */
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		min-width: 0;
+	}
+
+	.course-meta {
+		display: flex;
+		align-items: center;
+
+		image {
+			width: 30rpx;
+			height: 30rpx;
+		}
+
+	}
+
+	.meta-icon {
+		font-size: 24rpx;
+		margin-right: 6rpx;
+		color: #999;
+	}
+
+	.meta-count {
+		margin-left: 10rpx;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 32rpx;
+		color: #666666;
+	}
+
+	.card-cover {
+		position: relative;
+		width: 296rpx;
+		height: 222rpx;
+		border-radius: 20rpx;
+		overflow: hidden;
+		flex-shrink: 0;
+	}
+
+	.cover-img {
+		width: 100%;
+		height: 100%;
+		background: #BB6D6D;
+	}
+
+	.card-title {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 600;
+		font-size: 36rpx;
+		color: #222222;
+		line-height: 50rpx;
+		text-align: justify;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		display: -webkit-box;
+		-webkit-line-clamp: 2;
+		-webkit-box-orient: vertical;
+	}
+
+	.card-footer {
+		flex: 1;
+		padding-left: 24rpx;
+		/* padding: 20rpx 24rpx; */
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		min-width: 0;
+	}
+
+	.card-views {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 32rpx;
+		color: #666666;
+		line-height: 44rpx;
+	}
+
+	.btn-watch {
+		width: 168rpx;
+		height: 64rpx;
+		line-height: 64rpx;
+		text-align: center;
+		background: linear-gradient(135deg, #FF5267 0%, #FF233C 100%);
+		border-radius: 32rpx;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 600;
+		font-size: 32rpx;
+		color: #FFFFFF;
+	}
+
+	/* 最近学习 - 按日期分组 */
+	.recent-group {
+		padding: 24rpx 24rpx 0;
+	}
+
+	.group-date {
+		display: flex;
+		align-items: center;
+		margin-bottom: 24rpx;
+	}
+
+	.date-icon {
+		width: 32rpx;
+		height: 32rpx;
+		margin-right: 8rpx;
+	}
+
+	.date-text {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 600;
+		font-size: 40rpx;
+		line-height: 56rpx;
+		color: #222222;
+	}
+
+	.recent-card {
+		display: flex;
+		background: #fff;
+		border-radius: 20rpx;
+		overflow: hidden;
+		padding: 20rpx;
+		margin-bottom: 24rpx;
+	}
+
+	.recent-card:last-child {
+		margin-bottom: 0;
+	}
+
+	.recent-thumb {
+		position: relative;
+		width: 296rpx;
+		height: 222rpx;
+		border-radius: 20rpx;
+		overflow: hidden;
+		flex-shrink: 0;
+	}
+
+	.thumb-img {
+		width: 100%;
+		height: 100%;
+		background: #BB6D6D;
+	}
+
+	.recent-info {
+		flex: 1;
+		padding-left: 24rpx;
+		/* padding: 20rpx 24rpx; */
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		min-width: 0;
+	}
+
+	.recent-title {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 600;
+		font-size: 36rpx;
+		color: #222222;
+		line-height: 50rpx;
+		text-align: justify;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		display: -webkit-box;
+		-webkit-line-clamp: 2;
+		-webkit-box-orient: vertical;
+	}
+
+	.recent-progress {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 32rpx;
+		color: rgba(0, 0, 0, 0.65);
+		line-height: 44rpx;
+	}
+
+	/* 空态 */
+	.empty-state {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		justify-content: center;
+		padding: 80rpx 0 48rpx;
+		/* background: linear-gradient(180deg, #fff5f5 0%, #fff 100%); */
+	}
+
+	.empty-icon {
+		width: 310rpx;
+		height: 260rpx;
+		margin-bottom: 30rpx;
+	}
+
+	.empty-text {
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 400;
+		font-size: 36rpx;
+		color: rgba(0, 0, 0, 0.25);
+		line-height: 50rpx;
+	}
+
+	/* 为您精选 */
+	.recommend-section {
+		padding: 0 24rpx 32rpx;
+	}
+
+	.recommend-title {
+		display: block;
+		font-family: PingFangSC, PingFang SC;
+		font-weight: 600;
+		font-size: 40rpx;
+		color: #222222;
+		line-height: 56rpx;
+		padding-bottom: 24rpx;
+	}
+
+	.bottom-placeholder {
+		height: 120rpx;
+	}
+</style>

pages/index/index.vue

@@ -194,10 +194,8 @@
 		onLoad() {},
 		methods: {
 			onSearch() {
-				// 可跳转搜索页
-				uni.showToast({
-					title: '搜索',
-					icon: 'none'
+				uni.navigateTo({
+					url: '/pages/index/homePageSearch'
 				})
 			},
 			onBannerClick() {