consumer模块完成度95%,准备部署消费者端测试
This commit is contained in:
@@ -1,36 +1,36 @@
|
||||
<template>
|
||||
<template>
|
||||
<view class="category-page">
|
||||
<!-- 顶部搜索栏 -->
|
||||
<!-- 椤堕儴鎼滅储鏍?-->
|
||||
<view class="search-bar" :style="{ paddingTop: statusBarHeight + 'px' }">
|
||||
<view class="search-container">
|
||||
<view class="search-box" @click="navigateToSearch" :style="{ height: '30px' }">
|
||||
<!-- 模拟输入框 -->
|
||||
<text class="search-placeholder">请输入药品名称、症状或品牌</text>
|
||||
<!-- 妯℃嫙杈撳叆妗?-->
|
||||
<text class="search-placeholder">璇疯緭鍏ヨ嵂鍝佸悕绉般€佺棁鐘舵垨鍝佺墝</text>
|
||||
|
||||
<!-- 扫码图标 -->
|
||||
<!-- 鎵爜鍥炬爣 -->
|
||||
<view class="nav-icon-btn" @click.stop="onScan">
|
||||
<text class="nav-icon">🔳</text>
|
||||
<text class="nav-icon">馃敵</text>
|
||||
</view>
|
||||
|
||||
<!-- 相机图标 -->
|
||||
<!-- 鐩告満鍥炬爣 -->
|
||||
<view class="nav-camera-btn" @click.stop="onCamera">
|
||||
<text class="nav-camera-icon">📷</text>
|
||||
<text class="nav-camera-icon">馃摲</text>
|
||||
</view>
|
||||
|
||||
<!-- 搜索按钮 -->
|
||||
<!-- 鎼滅储鎸夐挳 -->
|
||||
<view class="nav-inner-search-btn" :style="{ height: '22px' }">
|
||||
<text class="nav-inner-search-text">搜索</text>
|
||||
<text class="nav-inner-search-text">鎼滅储</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 导航栏占位 - 需要包含statusBarHeight + 搜索框高度44px -->
|
||||
<!-- 瀵艰埅鏍忓崰浣?- 闇€瑕佸寘鍚玸tatusBarHeight + 鎼滅储妗嗛珮搴?4px -->
|
||||
<view class="navbar-placeholder" :style="{ height: (statusBarHeight + 44) + 'px' }"></view>
|
||||
|
||||
<!-- 分类内容区 -->
|
||||
<!-- 鍒嗙被鍐呭鍖?-->
|
||||
<view class="category-content">
|
||||
<!-- 左侧一级分类 -->
|
||||
<!-- 宸︿晶涓€绾у垎绫?-->
|
||||
<scroll-view :scroll-y="true" class="primary-category">
|
||||
<view
|
||||
v-for="item in primaryCategories"
|
||||
@@ -44,20 +44,20 @@
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 右侧商品列表 -->
|
||||
<!-- 鍙充晶鍟嗗搧鍒楄〃 -->
|
||||
<scroll-view
|
||||
:scroll-y="true"
|
||||
class="product-content"
|
||||
@scrolltolower="loadMore"
|
||||
:lower-threshold="50"
|
||||
>
|
||||
<!-- 分类标题 -->
|
||||
<!-- 鍒嗙被鏍囬 -->
|
||||
<view class="category-header">
|
||||
<text class="category-title">{{ currentCategoryName }}</text>
|
||||
<text class="category-desc">{{ currentCategoryDesc }}</text>
|
||||
</view>
|
||||
|
||||
<!-- 商品网格 -->
|
||||
<!-- 鍟嗗搧缃戞牸 -->
|
||||
<view v-if="productList.length > 0" class="product-grid">
|
||||
<view
|
||||
v-for="product in productList"
|
||||
@@ -72,7 +72,7 @@
|
||||
/>
|
||||
<text class="product-name" :lines="2">{{ product.name }}</text>
|
||||
<view class="product-bottom">
|
||||
<text class="product-price">¥{{ product.base_price ?? product.price ?? 0 }}</text>
|
||||
<text class="product-price">楼{{ product.base_price ?? product.price ?? 0 }}</text>
|
||||
<view class="product-add-btn" @click.stop="addToCart(product)">
|
||||
<text class="add-icon">+</text>
|
||||
</view>
|
||||
@@ -80,16 +80,16 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<!-- 绌虹姸鎬?-->
|
||||
<view v-else class="empty-state">
|
||||
<text class="empty-icon">💊</text>
|
||||
<text class="empty-text">暂无相关药品</text>
|
||||
<text class="empty-desc">该分类下暂无商品,敬请期待</text>
|
||||
<text class="empty-icon">馃拪</text>
|
||||
<text class="empty-text">鏆傛棤鐩稿叧鑽搧</text>
|
||||
<text class="empty-desc">璇ュ垎绫讳笅鏆傛棤鍟嗗搧锛屾暚璇锋湡寰?/text>
|
||||
</view>
|
||||
|
||||
<!-- 加载更多提示 -->
|
||||
<!-- 鍔犺浇鏇村鎻愮ず -->
|
||||
<view v-if="hasMore" class="load-more">
|
||||
<text class="load-text">上拉加载更多</text>
|
||||
<text class="load-text">涓婃媺鍔犺浇鏇村</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
@@ -109,38 +109,38 @@ type LocalCategory = {
|
||||
color: string
|
||||
}
|
||||
|
||||
// 响应式数据
|
||||
// 鍝嶅簲寮忔暟鎹?
|
||||
const statusBarHeight = ref(0)
|
||||
const headerHeight = ref(44) // 默认头部高度
|
||||
const headerHeight = ref(44) // 榛樿澶撮儴楂樺害
|
||||
const primaryCategories = ref<LocalCategory[]>([])
|
||||
const productList = ref<Product[]>([])
|
||||
const activePrimary = ref<string>('')
|
||||
const cartCount = ref(3)
|
||||
const hasMore = ref(true)
|
||||
const hasLoadedFromParams = ref(false) // 标记是否已通过参数加载
|
||||
const hasLoadedFromParams = ref(false) // 鏍囪鏄惁宸查€氳繃鍙傛暟鍔犺浇
|
||||
const currentPage = ref(1)
|
||||
const loading = ref(false)
|
||||
|
||||
// 获取当前分类信息
|
||||
// 鑾峰彇褰撳墠鍒嗙被淇℃伅
|
||||
const currentCategoryName = ref('')
|
||||
const currentCategoryDesc = ref('')
|
||||
|
||||
// 页面参数
|
||||
// 椤甸潰鍙傛暟
|
||||
const pageParams = ref<any>({})
|
||||
|
||||
// 加载商品数据
|
||||
// 鍔犺浇鍟嗗搧鏁版嵁
|
||||
async function loadProducts(): Promise<void> {
|
||||
if (loading.value) return
|
||||
if (activePrimary.value == '') {
|
||||
console.warn('activePrimary为空,无法加载商品')
|
||||
console.warn('activePrimary涓虹┖锛屾棤娉曞姞杞藉晢鍝?)
|
||||
return
|
||||
}
|
||||
|
||||
loading.value = true
|
||||
try {
|
||||
console.log('开始加载商品,分类ID:', activePrimary.value, '页码:', currentPage.value)
|
||||
console.log('寮€濮嬪姞杞藉晢鍝侊紝鍒嗙被ID:', activePrimary.value, '椤电爜:', currentPage.value)
|
||||
const response = await supabaseService.getProductsByCategory(activePrimary.value, currentPage.value)
|
||||
console.log('商品加载结果:', {
|
||||
console.log('鍟嗗搧鍔犺浇缁撴灉:', {
|
||||
dataCount: response.data.length,
|
||||
total: response.total,
|
||||
hasmore: response.hasmore,
|
||||
@@ -155,16 +155,16 @@ async function loadProducts(): Promise<void> {
|
||||
|
||||
hasMore.value = response.hasmore
|
||||
|
||||
// 更新当前分类信息
|
||||
// 鏇存柊褰撳墠鍒嗙被淇℃伅
|
||||
const category = primaryCategories.value.find((cat: LocalCategory): boolean => cat.id === activePrimary.value)
|
||||
if (category != null) {
|
||||
currentCategoryName.value = category.name
|
||||
currentCategoryDesc.value = category.description
|
||||
}
|
||||
|
||||
console.log('商品列表加载完成,当前总数量:', productList.value.length)
|
||||
console.log('鍟嗗搧鍒楄〃鍔犺浇瀹屾垚锛屽綋鍓嶆€绘暟閲?', productList.value.length)
|
||||
} catch (error) {
|
||||
console.error('加载商品数据失败:', error)
|
||||
console.error('鍔犺浇鍟嗗搧鏁版嵁澶辫触:', error)
|
||||
if (currentPage.value === 1) {
|
||||
productList.value = []
|
||||
}
|
||||
@@ -176,22 +176,22 @@ async function loadProducts(): Promise<void> {
|
||||
async function loadCategories(): Promise<void> {
|
||||
try {
|
||||
const categoriesData = await supabaseService.getCategories()
|
||||
console.log('加载分类数据成功,数量:', categoriesData.length)
|
||||
console.log('鍔犺浇鍒嗙被鏁版嵁鎴愬姛锛屾暟閲?', categoriesData.length)
|
||||
|
||||
// 映射数据并添加默认颜色,防止选中时背景透明导致文字看不清
|
||||
// 过滤掉医药健康相关分类
|
||||
// 鏄犲皠鏁版嵁骞舵坊鍔犻粯璁ら鑹诧紝闃叉閫変腑鏃惰儗鏅€忔槑瀵艰嚧鏂囧瓧鐪嬩笉娓?
|
||||
// 杩囨护鎺夊尰鑽仴搴风浉鍏冲垎绫?
|
||||
const categories: LocalCategory[] = []
|
||||
const rawList = categoriesData as any[]
|
||||
for (let i = 0; i < rawList.length; i++) {
|
||||
const raw = rawList[i]
|
||||
const catObj = (raw instanceof UTSJSONObject) ? (raw as UTSJSONObject) : (JSON.parse(JSON.stringify(raw)) as UTSJSONObject)
|
||||
const name = catObj.getString('name') ?? ''
|
||||
if (name.includes('医药') || name.includes('健康')) {
|
||||
if (name.includes('鍖昏嵂') || name.includes('鍋ュ悍')) {
|
||||
continue
|
||||
}
|
||||
const id = catObj.getString('id') ?? ''
|
||||
const description = catObj.getString('description') ?? ''
|
||||
const icon = catObj.getString('icon') ?? catObj.getString('icon_url') ?? '📦'
|
||||
const icon = catObj.getString('icon') ?? catObj.getString('icon_url') ?? '馃摝'
|
||||
const color = catObj.getString('color') ?? '#4CAF50'
|
||||
categories.push({
|
||||
id,
|
||||
@@ -204,36 +204,36 @@ async function loadCategories(): Promise<void> {
|
||||
|
||||
if (categories.length > 0) {
|
||||
primaryCategories.value = categories
|
||||
// 如果没有通过参数设置分类,则设置默认选中一个分类
|
||||
// 濡傛灉娌℃湁閫氳繃鍙傛暟璁剧疆鍒嗙被锛屽垯璁剧疆榛樿閫変腑涓€涓垎绫?
|
||||
if (activePrimary.value == '') {
|
||||
// 优先查找"厨具"相关的分类作为默认
|
||||
const defaultCategory = categories.find((c: LocalCategory): boolean => c.name.includes('厨具')) ?? categories[0]
|
||||
// 浼樺厛鏌ユ壘"鍘ㄥ叿"鐩稿叧鐨勫垎绫讳綔涓洪粯璁?
|
||||
const defaultCategory = categories.find((c: LocalCategory): boolean => c.name.includes('鍘ㄥ叿')) ?? categories[0]
|
||||
|
||||
activePrimary.value = defaultCategory.id
|
||||
console.log('设置默认分类为:', defaultCategory.name, 'ID:', defaultCategory.id)
|
||||
console.log('璁剧疆榛樿鍒嗙被涓?', defaultCategory.name, 'ID:', defaultCategory.id)
|
||||
currentCategoryName.value = defaultCategory.name
|
||||
currentCategoryDesc.value = defaultCategory.description
|
||||
} else {
|
||||
// 如果已经选中了分类(可能来自Storage),更新显示信息
|
||||
// 濡傛灉宸茬粡閫変腑浜嗗垎绫伙紙鍙兘鏉ヨ嚜Storage锛夛紝鏇存柊鏄剧ず淇℃伅
|
||||
const current = categories.find((c: LocalCategory): boolean => c.id == activePrimary.value)
|
||||
if (current != null) {
|
||||
currentCategoryName.value = current.name
|
||||
currentCategoryDesc.value = current.description
|
||||
// 如果此时没有商品列表(且没有正在加载),可能需要加载
|
||||
// 濡傛灉姝ゆ椂娌℃湁鍟嗗搧鍒楄〃锛堜笖娌℃湁姝e湪鍔犺浇锛夛紝鍙兘闇€瑕佸姞杞?
|
||||
if (productList.value.length === 0 && !loading.value) {
|
||||
loadProducts()
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
console.warn('从Supabase获取的分类数据为空')
|
||||
console.warn('浠嶴upabase鑾峰彇鐨勫垎绫绘暟鎹负绌?)
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载分类数据失败:', error)
|
||||
console.error('鍔犺浇鍒嗙被鏁版嵁澶辫触:', error)
|
||||
}
|
||||
}
|
||||
|
||||
// 加载更多
|
||||
// 鍔犺浇鏇村
|
||||
function loadMore(): void {
|
||||
if (hasMore.value && !loading.value) {
|
||||
currentPage.value++
|
||||
@@ -241,72 +241,72 @@ function loadMore(): void {
|
||||
}
|
||||
}
|
||||
|
||||
// 选择一级分类
|
||||
// 閫夋嫨涓€绾у垎绫?
|
||||
async function selectPrimaryCategory(categoryId: string): Promise<void> {
|
||||
console.log('=== selectPrimaryCategory函数开始执行 ===')
|
||||
console.log('传入的categoryId:', categoryId)
|
||||
console.log('当前时间:', Date.now())
|
||||
console.log('=== selectPrimaryCategory鍑芥暟寮€濮嬫墽琛?===')
|
||||
console.log('浼犲叆鐨刢ategoryId:', categoryId)
|
||||
console.log('褰撳墠鏃堕棿:', Date.now())
|
||||
|
||||
// 验证categoryId是否有效
|
||||
// 楠岃瘉categoryId鏄惁鏈夋晥
|
||||
if (categoryId == '') {
|
||||
console.error('categoryId为空,尝试使用第一个分类')
|
||||
console.error('categoryId涓虹┖锛屽皾璇曚娇鐢ㄧ涓€涓垎绫?)
|
||||
if (primaryCategories.value.length > 0) {
|
||||
categoryId = primaryCategories.value[0].id
|
||||
} else {
|
||||
console.error('没有可用的分类')
|
||||
console.error('娌℃湁鍙敤鐨勫垎绫?)
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
console.log('验证后的categoryId:', categoryId)
|
||||
console.log('当前activePrimary的值:', activePrimary.value)
|
||||
console.log('楠岃瘉鍚庣殑categoryId:', categoryId)
|
||||
console.log('褰撳墠activePrimary鐨勫€?', activePrimary.value)
|
||||
|
||||
// 更新活动分类
|
||||
// 鏇存柊娲诲姩鍒嗙被
|
||||
activePrimary.value = categoryId
|
||||
console.log('更新后的activePrimary:', activePrimary.value)
|
||||
console.log('鏇存柊鍚庣殑activePrimary:', activePrimary.value)
|
||||
|
||||
// 更新当前分类信息
|
||||
// 鏇存柊褰撳墠鍒嗙被淇℃伅
|
||||
const category = primaryCategories.value.find((cat: LocalCategory): boolean => cat.id === categoryId)
|
||||
if (category != null) {
|
||||
currentCategoryName.value = category.name
|
||||
currentCategoryDesc.value = category.description
|
||||
console.log('✅ 找到分类:', category.name, '描述:', category.description)
|
||||
console.log('鉁?鎵惧埌鍒嗙被:', category.name, '鎻忚堪:', category.description)
|
||||
} else {
|
||||
console.error('❌ 未找到分类ID:', categoryId, ',使用第一个分类')
|
||||
// 如果找不到对应的分类,使用第一个分类
|
||||
console.error('鉂?鏈壘鍒板垎绫籌D:', categoryId, '锛屼娇鐢ㄧ涓€涓垎绫?)
|
||||
// 濡傛灉鎵句笉鍒板搴旂殑鍒嗙被锛屼娇鐢ㄧ涓€涓垎绫?
|
||||
if (primaryCategories.value.length > 0) {
|
||||
const firstCategory = primaryCategories.value[0]
|
||||
currentCategoryName.value = firstCategory.name
|
||||
currentCategoryDesc.value = firstCategory.description
|
||||
activePrimary.value = firstCategory.id
|
||||
categoryId = firstCategory.id
|
||||
console.log('使用默认分类:', firstCategory.name)
|
||||
console.log('浣跨敤榛樿鍒嗙被:', firstCategory.name)
|
||||
}
|
||||
}
|
||||
|
||||
console.log('准备加载商品数据...')
|
||||
console.log('鍑嗗鍔犺浇鍟嗗搧鏁版嵁...')
|
||||
|
||||
// 重置分页并加载
|
||||
// 閲嶇疆鍒嗛〉骞跺姞杞?
|
||||
currentPage.value = 1
|
||||
hasMore.value = true
|
||||
await loadProducts()
|
||||
|
||||
console.log('✅ 加载商品数据成功')
|
||||
console.log('分类:', categoryId)
|
||||
console.log('商品数量:', productList.value.length)
|
||||
console.log('商品列表:', productList.value)
|
||||
console.log('鉁?鍔犺浇鍟嗗搧鏁版嵁鎴愬姛')
|
||||
console.log('鍒嗙被:', categoryId)
|
||||
console.log('鍟嗗搧鏁伴噺:', productList.value.length)
|
||||
console.log('鍟嗗搧鍒楄〃:', productList.value)
|
||||
|
||||
// 验证数据是否已正确更新
|
||||
console.log('数据更新验证:')
|
||||
// 楠岃瘉鏁版嵁鏄惁宸叉纭洿鏂?
|
||||
console.log('鏁版嵁鏇存柊楠岃瘉:')
|
||||
console.log('activePrimary:', activePrimary.value)
|
||||
console.log('currentCategoryName:', currentCategoryName.value)
|
||||
console.log('currentCategoryDesc:', currentCategoryDesc.value)
|
||||
console.log('productList长度:', productList.value.length)
|
||||
console.log('productList闀垮害:', productList.value.length)
|
||||
|
||||
console.log('=== selectPrimaryCategory函数执行完成 ===')
|
||||
console.log('=== selectPrimaryCategory鍑芥暟鎵ц瀹屾垚 ===')
|
||||
}
|
||||
|
||||
// 生命周期
|
||||
// 鐢熷懡鍛ㄦ湡
|
||||
onMounted(() => {
|
||||
loadCategories().then(() => {
|
||||
setTimeout(() => {
|
||||
@@ -317,160 +317,160 @@ onMounted(() => {
|
||||
})
|
||||
})
|
||||
|
||||
// 页面加载时处理参数 - 这是处理分类切换的主要入口
|
||||
// 椤甸潰鍔犺浇鏃跺鐞嗗弬鏁?- 杩欐槸澶勭悊鍒嗙被鍒囨崲鐨勪富瑕佸叆鍙?
|
||||
onLoad((options: any) => {
|
||||
// 获取系统状态栏高度
|
||||
// 鑾峰彇绯荤粺鐘舵€佹爮楂樺害
|
||||
const systemInfo = uni.getSystemInfoSync()
|
||||
statusBarHeight.value = systemInfo.statusBarHeight
|
||||
console.log('=== category页面onLoad被调用 ===')
|
||||
console.log('页面加载时间:', Date.now())
|
||||
console.log('传入的options参数:', options)
|
||||
console.log('当前活动分类:', activePrimary.value)
|
||||
console.log('=== category椤甸潰onLoad琚皟鐢?===')
|
||||
console.log('椤甸潰鍔犺浇鏃堕棿:', Date.now())
|
||||
console.log('浼犲叆鐨刼ptions鍙傛暟:', options)
|
||||
console.log('褰撳墠娲诲姩鍒嗙被:', activePrimary.value)
|
||||
|
||||
let categoryId = ''
|
||||
let categoryName = ''
|
||||
|
||||
// 首先检查传入的options参数
|
||||
// 棣栧厛妫€鏌ヤ紶鍏ョ殑options鍙傛暟
|
||||
const optObj = (options instanceof UTSJSONObject) ? (options as UTSJSONObject) : (JSON.parse(JSON.stringify(options ?? {})) as UTSJSONObject)
|
||||
const optCategoryId = optObj.getString('categoryId') ?? ''
|
||||
if (optCategoryId !== '') {
|
||||
categoryId = optCategoryId
|
||||
categoryName = optObj.getString('name') ?? ''
|
||||
console.log('✅ onLoad中找到分类参数:', categoryId, categoryName)
|
||||
console.log('鉁?onLoad涓壘鍒板垎绫诲弬鏁?', categoryId, categoryName)
|
||||
}
|
||||
|
||||
// 如果options中没有,尝试从getCurrentPages()获取
|
||||
// 濡傛灉options涓病鏈夛紝灏濊瘯浠巊etCurrentPages()鑾峰彇
|
||||
if (categoryId == '') {
|
||||
const pages = getCurrentPages()
|
||||
if (pages.length > 0) {
|
||||
const currentPage = pages[pages.length - 1]
|
||||
const rawPageOptions = currentPage.options ?? {}
|
||||
console.log('从getCurrentPages()获取参数:', rawPageOptions)
|
||||
console.log('浠巊etCurrentPages()鑾峰彇鍙傛暟:', rawPageOptions)
|
||||
const pageOptObj = (rawPageOptions instanceof UTSJSONObject) ? (rawPageOptions as UTSJSONObject) : (JSON.parse(JSON.stringify(rawPageOptions)) as UTSJSONObject)
|
||||
const pageCategoryId = pageOptObj.getString('categoryId') ?? ''
|
||||
if (pageCategoryId !== '') {
|
||||
categoryId = pageCategoryId
|
||||
categoryName = pageOptObj.getString('name') ?? ''
|
||||
console.log('✅ 从getCurrentPages()找到分类参数:', categoryId, categoryName)
|
||||
console.log('鉁?浠巊etCurrentPages()鎵惧埌鍒嗙被鍙傛暟:', categoryId, categoryName)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 如果有找到分类ID,则选中对应的分类
|
||||
// 濡傛灉鏈夋壘鍒板垎绫籌D锛屽垯閫変腑瀵瑰簲鐨勫垎绫?
|
||||
if (categoryId != '') {
|
||||
hasLoadedFromParams.value = true
|
||||
console.log('✅ 准备选中分类:', categoryId)
|
||||
console.log('分类名称:', categoryName ?? '未指定')
|
||||
console.log('鉁?鍑嗗閫変腑鍒嗙被:', categoryId)
|
||||
console.log('鍒嗙被鍚嶇О:', categoryName ?? '鏈寚瀹?)
|
||||
|
||||
// 检查是否需要更新分类
|
||||
// 妫€鏌ユ槸鍚﹂渶瑕佹洿鏂板垎绫?
|
||||
if (activePrimary.value !== categoryId) {
|
||||
console.log('当前分类:', activePrimary.value, '与目标分类:', categoryId, '不同,需要更新')
|
||||
console.log('准备调用selectPrimaryCategory函数...')
|
||||
console.log('褰撳墠鍒嗙被:', activePrimary.value, '涓庣洰鏍囧垎绫?', categoryId, '涓嶅悓锛岄渶瑕佹洿鏂?)
|
||||
console.log('鍑嗗璋冪敤selectPrimaryCategory鍑芥暟...')
|
||||
selectPrimaryCategory(categoryId)
|
||||
} else {
|
||||
console.log('当前分类已经是目标分类,但可能用户想要刷新页面')
|
||||
console.log('当前分类:', activePrimary.value, '目标分类:', categoryId)
|
||||
// 即使分类相同,也重新加载数据,确保数据是最新的
|
||||
// 添加一个小的延迟,确保页面完全显示后再更新数据
|
||||
console.log('褰撳墠鍒嗙被宸茬粡鏄洰鏍囧垎绫伙紝浣嗗彲鑳界敤鎴锋兂瑕佸埛鏂伴〉闈?)
|
||||
console.log('褰撳墠鍒嗙被:', activePrimary.value, '鐩爣鍒嗙被:', categoryId)
|
||||
// 鍗充娇鍒嗙被鐩稿悓锛屼篃閲嶆柊鍔犺浇鏁版嵁锛岀‘淇濇暟鎹槸鏈€鏂扮殑
|
||||
// 娣诲姞涓€涓皬鐨勫欢杩燂紝纭繚椤甸潰瀹屽叏鏄剧ず鍚庡啀鏇存柊鏁版嵁
|
||||
setTimeout(() => {
|
||||
selectPrimaryCategory(categoryId)
|
||||
}, 100)
|
||||
}
|
||||
} else {
|
||||
console.log('⚠️ onLoad中未找到分类参数,将使用从数据库加载的第一个分类')
|
||||
// 不再使用硬编码的默认分类,loadCategories 会设置第一个分类
|
||||
console.log('鈿狅笍 onLoad涓湭鎵惧埌鍒嗙被鍙傛暟锛屽皢浣跨敤浠庢暟鎹簱鍔犺浇鐨勭涓€涓垎绫?)
|
||||
// 涓嶅啀浣跨敤纭紪鐮佺殑榛樿鍒嗙被锛宭oadCategories 浼氳缃涓€涓垎绫?
|
||||
}
|
||||
|
||||
console.log('=== category页面onLoad执行完成 ===')
|
||||
console.log('=== category椤甸潰onLoad鎵ц瀹屾垚 ===')
|
||||
})
|
||||
|
||||
// 页面显示时也检查参数,确保从其他页面返回时能正确显示
|
||||
// 椤甸潰鏄剧ず鏃朵篃妫€鏌ュ弬鏁帮紝纭繚浠庡叾浠栭〉闈㈣繑鍥炴椂鑳芥纭樉绀?
|
||||
onShow(() => {
|
||||
console.log('=== category页面onShow被调用 ===')
|
||||
console.log('页面显示时间:', Date.now())
|
||||
console.log('当前活动分类:', activePrimary.value)
|
||||
console.log('=== category椤甸潰onShow琚皟鐢?===')
|
||||
console.log('椤甸潰鏄剧ず鏃堕棿:', Date.now())
|
||||
console.log('褰撳墠娲诲姩鍒嗙被:', activePrimary.value)
|
||||
|
||||
// 1. 优先检查 Storage 中的参数 (由首页传入)
|
||||
// 1. 浼樺厛妫€鏌?Storage 涓殑鍙傛暟 (鐢遍椤典紶鍏?
|
||||
const storageCategoryId = (uni.getStorageSync('selectedCategory') as string) ?? ''
|
||||
if (storageCategoryId !== '') {
|
||||
console.log('✅ onShow中找到Storage分类参数:', storageCategoryId)
|
||||
console.log('鉁?onShow涓壘鍒癝torage鍒嗙被鍙傛暟:', storageCategoryId)
|
||||
hasLoadedFromParams.value = true
|
||||
// 清除Storage,防止下次误读
|
||||
// 娓呴櫎Storage锛岄槻姝笅娆¤璇?
|
||||
uni.removeStorageSync('selectedCategory')
|
||||
|
||||
if (activePrimary.value !== storageCategoryId) {
|
||||
selectPrimaryCategory(storageCategoryId)
|
||||
}
|
||||
// 如果分类还没加载完,这里设置了ID,等loadCategories完成后会自动匹配信息
|
||||
// 濡傛灉鍒嗙被杩樻病鍔犺浇瀹岋紝杩欓噷璁剧疆浜咺D锛岀瓑loadCategories瀹屾垚鍚庝細鑷姩鍖归厤淇℃伅
|
||||
return
|
||||
}
|
||||
|
||||
// 在onShow中,我们也需要检查是否有新的参数
|
||||
// 因为当从主页再次点击分类跳转过来时,可能不会触发onLoad
|
||||
// 而是触发onShow
|
||||
// 鍦╫nShow涓紝鎴戜滑涔熼渶瑕佹鏌ユ槸鍚︽湁鏂扮殑鍙傛暟
|
||||
// 鍥犱负褰撲粠涓婚〉鍐嶆鐐瑰嚮鍒嗙被璺宠浆杩囨潵鏃讹紝鍙兘涓嶄細瑙﹀彂onLoad
|
||||
// 鑰屾槸瑙﹀彂onShow
|
||||
|
||||
// 获取当前页面实例和参数
|
||||
// 鑾峰彇褰撳墠椤甸潰瀹炰緥鍜屽弬鏁?
|
||||
const pages = getCurrentPages()
|
||||
if (pages.length > 0) {
|
||||
const currentPage = pages[pages.length - 1]
|
||||
const rawPageOptions = currentPage.options ?? {}
|
||||
console.log('onShow中获取参数:', rawPageOptions)
|
||||
console.log('onShow涓幏鍙栧弬鏁?', rawPageOptions)
|
||||
const pageOptObj = (rawPageOptions instanceof UTSJSONObject) ? (rawPageOptions as UTSJSONObject) : (JSON.parse(JSON.stringify(rawPageOptions)) as UTSJSONObject)
|
||||
|
||||
// 检查是否有分类参数
|
||||
// 妫€鏌ユ槸鍚︽湁鍒嗙被鍙傛暟
|
||||
const pageCategoryId = pageOptObj.getString('categoryId') ?? ''
|
||||
if (pageCategoryId !== '') {
|
||||
hasLoadedFromParams.value = true
|
||||
const categoryId = pageCategoryId
|
||||
const categoryName = pageOptObj.getString('name') ?? ''
|
||||
|
||||
console.log('✅ onShow中找到分类参数:', categoryId, categoryName)
|
||||
console.log('URL中的时间戳参数:', pageOptObj.getString('timestamp') ?? '')
|
||||
console.log('URL中的随机参数:', pageOptObj.getString('random') ?? '')
|
||||
console.log('鉁?onShow涓壘鍒板垎绫诲弬鏁?', categoryId, categoryName)
|
||||
console.log('URL涓殑鏃堕棿鎴冲弬鏁?', pageOptObj.getString('timestamp') ?? '')
|
||||
console.log('URL涓殑闅忔満鍙傛暟:', pageOptObj.getString('random') ?? '')
|
||||
|
||||
// 检查是否需要更新分类
|
||||
// 妫€鏌ユ槸鍚﹂渶瑕佹洿鏂板垎绫?
|
||||
if (activePrimary.value !== categoryId) {
|
||||
console.log('当前分类:', activePrimary.value, '与目标分类:', categoryId, '不同,需要更新')
|
||||
console.log('准备调用selectPrimaryCategory函数...')
|
||||
console.log('褰撳墠鍒嗙被:', activePrimary.value, '涓庣洰鏍囧垎绫?', categoryId, '涓嶅悓锛岄渶瑕佹洿鏂?)
|
||||
console.log('鍑嗗璋冪敤selectPrimaryCategory鍑芥暟...')
|
||||
selectPrimaryCategory(categoryId)
|
||||
} else {
|
||||
console.log('当前分类已经是目标分类,但可能用户想要刷新页面')
|
||||
console.log('当前分类:', activePrimary.value, '目标分类:', categoryId)
|
||||
// 即使分类相同,也重新加载数据,确保数据是最新的
|
||||
// 添加一个小的延迟,确保页面完全显示后再更新数据
|
||||
console.log('褰撳墠鍒嗙被宸茬粡鏄洰鏍囧垎绫伙紝浣嗗彲鑳界敤鎴锋兂瑕佸埛鏂伴〉闈?)
|
||||
console.log('褰撳墠鍒嗙被:', activePrimary.value, '鐩爣鍒嗙被:', categoryId)
|
||||
// 鍗充娇鍒嗙被鐩稿悓锛屼篃閲嶆柊鍔犺浇鏁版嵁锛岀‘淇濇暟鎹槸鏈€鏂扮殑
|
||||
// 娣诲姞涓€涓皬鐨勫欢杩燂紝纭繚椤甸潰瀹屽叏鏄剧ず鍚庡啀鏇存柊鏁版嵁
|
||||
setTimeout(() => {
|
||||
selectPrimaryCategory(categoryId)
|
||||
}, 100)
|
||||
}
|
||||
} else {
|
||||
console.log('⚠️ onShow中未找到分类参数')
|
||||
console.log('鈿狅笍 onShow涓湭鎵惧埌鍒嗙被鍙傛暟')
|
||||
}
|
||||
}
|
||||
|
||||
console.log('=== category页面onShow执行完成 ===')
|
||||
console.log('=== category椤甸潰onShow鎵ц瀹屾垚 ===')
|
||||
})
|
||||
|
||||
|
||||
// 添加到购物车
|
||||
// 娣诲姞鍒拌喘鐗╄溅
|
||||
async function addToCart(product: Product): Promise<void> {
|
||||
uni.showLoading({ title: '检查商品...' })
|
||||
uni.showLoading({ title: '妫€鏌ュ晢鍝?..' })
|
||||
try {
|
||||
const pid = (product.id ?? '').toString()
|
||||
const merchantId = product.merchant_id ?? ''
|
||||
if (pid === '') {
|
||||
uni.hideLoading()
|
||||
uni.showToast({ title: '商品无效', icon: 'none' })
|
||||
uni.showToast({ title: '鍟嗗搧鏃犳晥', icon: 'none' })
|
||||
return
|
||||
}
|
||||
|
||||
// 检查商品是否有SKU
|
||||
// 妫€鏌ュ晢鍝佹槸鍚︽湁SKU
|
||||
const skus = await supabaseService.getProductSkus(pid)
|
||||
uni.hideLoading()
|
||||
|
||||
if (skus.length > 0) {
|
||||
// 有规格,提示并跳转到商品详情页选择规格
|
||||
// 鏈夎鏍硷紝鎻愮ず骞惰烦杞埌鍟嗗搧璇︽儏椤甸€夋嫨瑙勬牸
|
||||
uni.showToast({
|
||||
title: '请选择规格',
|
||||
title: '璇烽€夋嫨瑙勬牸',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(() => {
|
||||
@@ -479,31 +479,31 @@ async function addToCart(product: Product): Promise<void> {
|
||||
})
|
||||
}, 500)
|
||||
} else {
|
||||
// 无规格,直接加入购物车
|
||||
uni.showLoading({ title: '添加中...' })
|
||||
// 鏃犺鏍硷紝鐩存帴鍔犲叆璐墿杞?
|
||||
uni.showLoading({ title: '娣诲姞涓?..' })
|
||||
const success = await supabaseService.addToCart(pid, 1, '', merchantId)
|
||||
uni.hideLoading()
|
||||
if (success) {
|
||||
uni.showToast({
|
||||
title: '已添加到购物车',
|
||||
title: '宸叉坊鍔犲埌璐墿杞?,
|
||||
icon: 'success'
|
||||
})
|
||||
cartCount.value++
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '添加失败,请先登录',
|
||||
title: '娣诲姞澶辫触锛岃鍏堢櫥褰?,
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('添加到购物车异常', e)
|
||||
console.error('娣诲姞鍒拌喘鐗╄溅寮傚父', e)
|
||||
uni.hideLoading()
|
||||
uni.showToast({ title: '操作失败', icon: 'none' })
|
||||
uni.showToast({ title: '鎿嶄綔澶辫触', icon: 'none' })
|
||||
}
|
||||
}
|
||||
|
||||
// 导航函数
|
||||
// 瀵艰埅鍑芥暟
|
||||
function navigateToSearch(): void { uni.navigateTo({ url: '/pages/mall/consumer/search' }) }
|
||||
function navigateToCart(): void { uni.navigateTo({ url: '/pages/mall/consumer/cart' }) }
|
||||
function navigateToProduct(product: Product): void {
|
||||
@@ -519,43 +519,43 @@ function navigateToProduct(product: Product): void {
|
||||
})
|
||||
}
|
||||
|
||||
// 相机功能
|
||||
// 鐩告満鍔熻兘
|
||||
function onCamera(): void {
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sourceType: ['camera'],
|
||||
success: (res) => {
|
||||
console.log('相机拍摄成功:', res.tempFilePaths[0])
|
||||
console.log('鐩告満鎷嶆憚鎴愬姛:', res.tempFilePaths[0])
|
||||
uni.showToast({
|
||||
title: '已拍摄,正在识别...',
|
||||
title: '宸叉媿鎽勶紝姝e湪璇嗗埆...',
|
||||
icon: 'loading'
|
||||
})
|
||||
// 这里可以添加后续的识别逻辑
|
||||
// 杩欓噷鍙互娣诲姞鍚庣画鐨勮瘑鍒€昏緫
|
||||
setTimeout(() => {
|
||||
uni.showToast({
|
||||
title: '识别成功',
|
||||
title: '璇嗗埆鎴愬姛',
|
||||
icon: 'success'
|
||||
})
|
||||
}, 1000)
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('相机调用失败:', err)
|
||||
console.error('鐩告満璋冪敤澶辫触:', err)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 扫码功能
|
||||
// 鎵爜鍔熻兘
|
||||
function onScan(): void {
|
||||
uni.scanCode({
|
||||
success: (res) => {
|
||||
console.log('扫码成功:', res)
|
||||
console.log('鎵爜鎴愬姛:', res)
|
||||
uni.showToast({
|
||||
title: '扫码成功: ' + res.result,
|
||||
title: '鎵爜鎴愬姛: ' + res.result,
|
||||
icon: 'none'
|
||||
})
|
||||
},
|
||||
fail: (err) => {
|
||||
console.error('扫码失败:', err)
|
||||
console.error('鎵爜澶辫触:', err)
|
||||
}
|
||||
})
|
||||
}
|
||||
@@ -571,7 +571,7 @@ function onScan(): void {
|
||||
flex-direction: column;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', sans-serif;
|
||||
}
|
||||
/* 搜索栏 */
|
||||
/* 鎼滅储鏍?*/
|
||||
.search-bar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
@@ -582,13 +582,13 @@ function onScan(): void {
|
||||
box-shadow: 0 2px 12px rgba(76, 175, 80, 0.15);
|
||||
}
|
||||
|
||||
/* 导航栏占位 */
|
||||
/* 瀵艰埅鏍忓崰浣?*/
|
||||
.navbar-placeholder {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 搜索栏 */
|
||||
/* 导航栏搜索框容器内边距调整 */
|
||||
/* 鎼滅储鏍?*/
|
||||
/* 瀵艰埅鏍忔悳绱㈡瀹瑰櫒鍐呰竟璺濊皟鏁?*/
|
||||
.search-container {
|
||||
height: 44px;
|
||||
padding: 0 16px;
|
||||
@@ -601,12 +601,12 @@ function onScan(): void {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* 搜索框 hover 效果 */
|
||||
/* 鎼滅储妗?hover 鏁堟灉 */
|
||||
.search-box:hover {
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
/* 导航栏搜索框容器内边距调整 */
|
||||
/* 瀵艰埅鏍忔悳绱㈡瀹瑰櫒鍐呰竟璺濊皟鏁?*/
|
||||
.search-box {
|
||||
flex: 1;
|
||||
max-width: 600px;
|
||||
@@ -631,7 +631,7 @@ function onScan(): void {
|
||||
}
|
||||
|
||||
.nav-inner-search-text {
|
||||
font-size: 12px; /* 字体稍微变小 */
|
||||
font-size: 12px; /* 瀛椾綋绋嶅井鍙樺皬 */
|
||||
color: #ffffff;
|
||||
font-weight: normal;
|
||||
}
|
||||
@@ -664,7 +664,7 @@ function onScan(): void {
|
||||
border-right-width: 1px;
|
||||
border-right-style: solid;
|
||||
border-right-color: #ddd;
|
||||
border-right: 1px solid #ddd; /* 修复UVUE样式 */
|
||||
border-right: 1px solid #ddd; /* 淇UVUE鏍峰紡 */
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
@@ -672,23 +672,23 @@ function onScan(): void {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* 搜索按钮高度微调 */
|
||||
/* 鎼滅储鎸夐挳楂樺害寰皟 */
|
||||
.nav-inner-search-btn {
|
||||
padding: 0 12px; /* 减小内边距 */
|
||||
background-color: #87CEEB; /* 天空蓝 */
|
||||
padding: 0 12px; /* 鍑忓皬鍐呰竟璺?*/
|
||||
background-color: #87CEEB; /* 澶╃┖钃?*/
|
||||
border-radius: 16px;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 24px; /* 随搜索框高度减小而减小 */
|
||||
height: 24px; /* 闅忔悳绱㈡楂樺害鍑忓皬鑰屽噺灏?*/
|
||||
}
|
||||
|
||||
.cart-badge {
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
right: -5px;
|
||||
background: #FF5722;
|
||||
background: #ff5000;
|
||||
color: white;
|
||||
font-size: 10px;
|
||||
min-width: 18px;
|
||||
@@ -701,7 +701,7 @@ function onScan(): void {
|
||||
border: 2px solid #4CAF50;
|
||||
}
|
||||
|
||||
/* 分类内容区 */
|
||||
/* 鍒嗙被鍐呭鍖?*/
|
||||
.category-content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
@@ -714,7 +714,7 @@ function onScan(): void {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* 左侧一级分类 */
|
||||
/* 宸︿晶涓€绾у垎绫?*/
|
||||
.primary-category {
|
||||
width: 100px;
|
||||
flex: 0 0 100px;
|
||||
@@ -741,7 +741,7 @@ function onScan(): void {
|
||||
}
|
||||
|
||||
.primary-item:hover {
|
||||
transform: translateY(-2px); /* 悬停时向上浮动 */
|
||||
transform: translateY(-2px); /* 鎮仠鏃跺悜涓婃诞鍔?*/
|
||||
}
|
||||
|
||||
.primary-item.active {
|
||||
@@ -752,7 +752,7 @@ function onScan(): void {
|
||||
.primary-icon {
|
||||
font-size: 24px;
|
||||
margin-bottom: 6px;
|
||||
margin-right: 0; /* 移除右边距 */
|
||||
margin-right: 0; /* 绉婚櫎鍙宠竟璺?*/
|
||||
text-align: center;
|
||||
/* display: block; removed for uniapp-x support */
|
||||
}
|
||||
@@ -763,7 +763,7 @@ function onScan(): void {
|
||||
/* display: block; removed for uniapp-x support */
|
||||
}
|
||||
|
||||
/* 右侧内容区 */
|
||||
/* 鍙充晶鍐呭鍖?*/
|
||||
.product-content {
|
||||
flex: 1;
|
||||
padding: 0;
|
||||
@@ -790,7 +790,7 @@ function onScan(): void {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* 商品网格 */
|
||||
/* 鍟嗗搧缃戞牸 */
|
||||
.product-grid {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
@@ -896,7 +896,7 @@ function onScan(): void {
|
||||
margin-right: 6px; /* gap replacement */
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
/* 绌虹姸鎬?*/
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -924,7 +924,7 @@ function onScan(): void {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* 加载更多 */
|
||||
/* 鍔犺浇鏇村 */
|
||||
.load-more {
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
@@ -939,9 +939,9 @@ function onScan(): void {
|
||||
border-radius: 20px;
|
||||
}
|
||||
|
||||
/* ===== 响应式设计 ===== */
|
||||
/* ===== 鍝嶅簲寮忚璁?===== */
|
||||
|
||||
/* 小屏手机 (小于414px) */
|
||||
/* 灏忓睆鎵嬫満 (灏忎簬414px) */
|
||||
@media screen and (max-width: 414px) {
|
||||
.search-container {
|
||||
padding: 0 12px;
|
||||
@@ -1051,7 +1051,7 @@ function onScan(): void {
|
||||
}
|
||||
}
|
||||
|
||||
/* 中屏手机/小平板 (415px-768px) */
|
||||
/* 涓睆鎵嬫満/灏忓钩鏉?(415px-768px) */
|
||||
@media screen and (min-width: 415px) and (max-width: 768px) {
|
||||
.search-container {
|
||||
padding: 0 16px;
|
||||
@@ -1075,7 +1075,7 @@ function onScan(): void {
|
||||
}
|
||||
}
|
||||
|
||||
/* 平板设备 (769px-1024px) */
|
||||
/* 骞虫澘璁惧 (769px-1024px) */
|
||||
@media screen and (min-width: 769px) and (max-width: 1024px) {
|
||||
.search-container {
|
||||
padding: 0 16px;
|
||||
@@ -1109,7 +1109,7 @@ function onScan(): void {
|
||||
}
|
||||
}
|
||||
|
||||
/* 桌面端 (1025px以上) */
|
||||
/* 妗岄潰绔?(1025px浠ヤ笂) */
|
||||
@media screen and (min-width: 1025px) {
|
||||
.search-container {
|
||||
padding: 0 16px;
|
||||
@@ -1188,7 +1188,7 @@ function onScan(): void {
|
||||
}
|
||||
}
|
||||
|
||||
/* 大桌面端 (1400px以上) */
|
||||
/* 澶ф闈㈢ (1400px浠ヤ笂) */
|
||||
@media screen and (min-width: 1400px) {
|
||||
.category-content {
|
||||
max-width: 1600px;
|
||||
@@ -1267,3 +1267,5 @@ function onScan(): void {
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
Reference in New Issue
Block a user