hookehuyr

feat(index): 优化首页产品跳转逻辑

- 热卖产品点击"产品资料"跳转到产品详情页并传递产品ID
- 产品详情页使用useLoad接收ID参数,为后续API调用做准备
- 本周热门资料"查看更多"跳转到资料列表页(material-list)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
......@@ -67,7 +67,7 @@
plain
color="#2563EB"
class="flex-1 !h-[64rpx] !rounded-[16rpx] !text-[26rpx] !m-0 !border-blue-600"
@tap="go('/pages/knowledge-base/index')"
@tap="goToProductDetail(1)"
>
产品资料
</nut-button>
......@@ -100,7 +100,7 @@
plain
color="#2563EB"
class="flex-1 !h-[64rpx] !rounded-[16rpx] !text-[26rpx] !m-0 !border-blue-600"
@tap="go('/pages/knowledge-base/index')"
@tap="goToProductDetail(2)"
>
产品资料
</nut-button>
......@@ -119,7 +119,7 @@
<view class="bg-white rounded-[32rpx] shadow-sm p-[32rpx] mb-[48rpx]">
<view class="flex justify-between items-center mb-[24rpx]">
<text class="text-gray-900 text-[32rpx] font-bold">本周热门资料</text>
<view class="flex items-center text-blue-600" @tap="go('/pages/knowledge-base/index')">
<view class="flex items-center text-blue-600" @tap="go('/pages/material-list/index')">
<text class="text-[26rpx] mr-[4rpx]">查看更多</text>
<IconFont name="RectRight" size="12" />
</view>
......@@ -208,6 +208,13 @@ const handleGridNav = (item) => {
go(item.route);
};
// 跳转到产品详情页
const goToProductDetail = (productId) => {
go('/pages/product-detail/index', {
id: productId
});
};
// Open webview with URL
const openWebView = (url) => {
go('/pages/webview/index', {
......
......@@ -117,7 +117,51 @@ import { ref } from 'vue'
import NavHeader from '@/components/NavHeader.vue'
import TabBar from '@/components/TabBar.vue'
import IconFont from '@/components/IconFont.vue'
import Taro from '@tarojs/taro'
import Taro, { useLoad } from '@tarojs/taro'
// 接收页面参数
const productId = ref(null)
useLoad((options) => {
console.log('产品详情页参数:', options)
if (options.id) {
productId.value = options.id
console.log('产品ID:', productId.value)
// TODO: 根据 productId 获取产品详情数据
// 这里可以调用 API 获取对应产品的数据
fetchProductDetail(options.id)
} else {
console.warn('未接收到产品ID')
Taro.showToast({
title: '产品ID不存在',
icon: 'none',
duration: 2000
})
}
})
// 根据 ID 获取产品详情(模拟)
const fetchProductDetail = async (id) => {
console.log('正在获取产品ID', id, '的详情...')
// TODO: 实际调用 API
// const res = await getProductDetailAPI({ i: id })
// if (res.code === 1) {
// // 更新产品数据
// }
// 模拟根据不同ID显示不同产品
const productNames = {
'1': '家庭财富传承保障计划(分红)',
'2': '儿童教育金储备方案(分红)'
}
if (productNames[id]) {
console.log('产品名称:', productNames[id])
}
}
// Random banner image
const bannerImage = `https://picsum.photos/seed/${Math.floor(Math.random() * 1000)}/750/420`
......