This commit is contained in:
parent
e93ba20d83
commit
c7e6af6133
|
|
@ -76,6 +76,47 @@
|
|||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 更多推荐分割线 -->
|
||||
<view class="recommend-divider" v-if="recommendList.length > 0">
|
||||
<view class="line"></view>
|
||||
<text class="dot">更多推荐</text>
|
||||
<view class="line"></view>
|
||||
</view>
|
||||
|
||||
<!-- 推荐商品列表 -->
|
||||
<view class="goods-list recommend-list" v-if="recommendList.length > 0">
|
||||
<view class="goods-item" v-for="(goods, idx) in recommendList" :key="idx" @click="goToDetail(goods.id)">
|
||||
<view class="g-img-left">
|
||||
<image class="goods-img" :src="goods.image" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="goods-info">
|
||||
<view class="goods-title-row">
|
||||
<image src="https://img-haodanku-com.cdn.fudaiapp.com/FlyOSTvjC3LjrkUoJ0NPxx1qnGz4" class="platform-icon"></image>
|
||||
<text class="title-text">{{ goods.title }}</text>
|
||||
</view>
|
||||
<view class="labels-row" v-if="goods.labels && goods.labels.length > 0">
|
||||
<text class="label-tag" v-for="(label, lIdx) in goods.labels.slice(0, 2)" :key="lIdx">{{ label }}</text>
|
||||
</view>
|
||||
<view class="goods-price-section">
|
||||
<view class="price-main">
|
||||
<text class="price-tip">{{ goods.couponValue > 0 ? '券后' : '抢购价' }}</text>
|
||||
<text class="price-symbol">¥</text>
|
||||
<text class="price-integer">{{ goods.finalPrice }}</text>
|
||||
<view class="coupon-box" v-if="goods.couponValue > 0">
|
||||
<text class="coupon-icon">券</text>
|
||||
<text class="coupon-txt">{{ goods.couponValue }}元</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="goods-bottom-info">
|
||||
<text class="sales">已售{{ goods.sales }}件</text>
|
||||
<text class="split-line">|</text>
|
||||
<text class="shop-name">店铺:{{ goods.shopName }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="loading-status">
|
||||
<view v-if="loading" class="loading-text">加载中...</view>
|
||||
<view v-else-if="goodsList.length === 0" class="empty-text">暂无相关商品</view>
|
||||
|
|
@ -105,7 +146,9 @@
|
|||
filterHasCoupon: false,
|
||||
filterIsFlagship: false,
|
||||
filterIsTmall: false,
|
||||
filterIsBrand: false
|
||||
filterIsBrand: false,
|
||||
recommendList: [], // 更多推荐列表
|
||||
loadingRecommend: false
|
||||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
|
|
@ -177,8 +220,14 @@
|
|||
this.finished = true;
|
||||
}
|
||||
}
|
||||
|
||||
// 兜底逻辑:如果主列表数据少于 10 条且是首屏加载,则请求推荐列表
|
||||
if (refresh && this.goodsList.length < 10) {
|
||||
this.getRecommendList();
|
||||
}
|
||||
} else {
|
||||
this.finished = true;
|
||||
if (refresh) this.getRecommendList();
|
||||
}
|
||||
},
|
||||
complete: () => {
|
||||
|
|
@ -186,6 +235,38 @@
|
|||
}
|
||||
});
|
||||
},
|
||||
getRecommendList() {
|
||||
if (this.loadingRecommend) return;
|
||||
this.loadingRecommend = true;
|
||||
// 构建推荐接口的高级筛选参数
|
||||
let recommendParams = '';
|
||||
if (this.filterHasCoupon) recommendParams += '&is_coupon=1';
|
||||
if (this.filterIsFlagship) recommendParams += '&is_tmall=1';
|
||||
if (this.filterIsTmall) recommendParams += '&min_id=1';
|
||||
|
||||
uni.request({
|
||||
url: `https://api.cmspro.haodanku.com/superSearch/getList?sort=0&page_size=20&category_id=${this.mainCatId}&son_category=${encodeURIComponent(this.secondCategory)}&cid=qOstW90${recommendParams}`,
|
||||
success: (res) => {
|
||||
if (res.data && res.data.code === 200 && res.data.data) {
|
||||
const list = res.data.data.map(item => ({
|
||||
id: item.id || item.itemid,
|
||||
image: item.itempic,
|
||||
title: item.itemshorttitle && item.itemshorttitle.length > 18 ? item.itemshorttitle.substring(0, 18) + '...' : item.itemshorttitle,
|
||||
finalPrice: item.itemendprice,
|
||||
couponValue: item.couponmoney || 0,
|
||||
sales: item.itemsale >= 10000 ? (item.itemsale / 10000).toFixed(1) + '万' : item.itemsale,
|
||||
shopType: item.shoptype === 'B' ? '天猫' : '淘宝',
|
||||
shopName: item.shopname,
|
||||
labels: item.label || (item.couponmoney > 0 ? [`${item.couponmoney}元券`] : [])
|
||||
}));
|
||||
this.recommendList = list;
|
||||
}
|
||||
},
|
||||
complete: () => {
|
||||
this.loadingRecommend = false;
|
||||
}
|
||||
});
|
||||
},
|
||||
changeSort(type) {
|
||||
if (type === 3 && this.sortType === 3) {
|
||||
this.priceOrder = this.priceOrder === 'asc' ? 'desc' : 'asc';
|
||||
|
|
@ -496,6 +577,31 @@
|
|||
color: #999;
|
||||
}
|
||||
|
||||
/* 更多推荐分割线 */
|
||||
.recommend-divider {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 30rpx 0;
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.recommend-divider .line {
|
||||
width: 100rpx;
|
||||
height: 1rpx;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.recommend-divider .dot {
|
||||
margin: 0 30rpx;
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.recommend-list {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.footer-placeholder {
|
||||
height: 40rpx;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue