|
|
@@ -1,10 +1,13 @@
|
|
|
<template>
|
|
|
- <view class="section" v-if="displayProducts && displayProducts.length > 0">
|
|
|
+ <view class="section">
|
|
|
<view class="section-header">
|
|
|
<text class="section-title">🛍️ 推荐商品</text>
|
|
|
<text class="section-more" @click="$emit('moreProducts')">更多 ›</text>
|
|
|
</view>
|
|
|
- <view class="product-list">
|
|
|
+ <view v-if="!displayProducts || displayProducts.length === 0" class="empty-state">
|
|
|
+ <text class="empty-tip">{{ isLoggedIn ? '暂无商品' : '登录后查看更多商品' }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="product-list" v-if="displayProducts && displayProducts.length > 0">
|
|
|
<view class="product-card" v-for="prod in displayProducts" :key="prod.id" @click="$emit('productClick', prod)">
|
|
|
<image class="product-img" :src="prod.coverImage || '/static/default-product.png'" mode="aspectFill" />
|
|
|
<text class="product-name line-clamp-2">{{ prod.name }}</text>
|
|
|
@@ -99,4 +102,13 @@ export default {
|
|
|
-webkit-line-clamp: 2;
|
|
|
-webkit-box-orient: vertical;
|
|
|
}
|
|
|
+.empty-state {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ padding: 40rpx 0;
|
|
|
+}
|
|
|
+.empty-tip {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
</style>
|