feat(goods-detail): 商品详情页主图/视频按后台「媒体显示顺序」切换
后台商品「高级设置」新增 media_order(1=主图在前 2=视频在前), 前端按其决定
商品详情页媒体区默认展示哪一个, 以及底部「图片/视频」切换按钮的排列顺序.
改动:
- goods-detail-view 组件:
- 新增 applyMediaOrder() 按 media_order 决定默认展示主图还是视频
- 新增 mediaOrderKey 计算属性 + watcher: 只在「媒体显示顺序/视频地址」
变化时重新应用, 避免用户手动切到「视频」后被详情数据深层变更打回
- 新增 mediaTabs 计算属性: 切换按钮顺序跟随配置
- 切换按钮改用 switchMediaTab(), 切回主图时暂停视频
- common/js/goods_detail_base.js: 父级那行 switchMedia 赋值原本是死代码
(父级无此 data 字段, 无模板读取), 改成与新规则一致, 避免两处规则打架
This commit is contained in:
@@ -105,6 +105,24 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 应用后台「高级设置 → 媒体显示顺序」(media_order)
|
||||
* 1 = 主图在前(默认) 2 = 视频在前
|
||||
* 商品没有视频时一律主图在前
|
||||
*/
|
||||
applyMediaOrder() {
|
||||
const detail = this.goodsSkuDetail || {};
|
||||
if (!detail.video_url) {
|
||||
this.switchMedia = 'img';
|
||||
return;
|
||||
}
|
||||
this.switchMedia = Number(detail.media_order) === 2 ? 'video' : 'img';
|
||||
},
|
||||
// 手动切换图片/视频
|
||||
switchMediaTab(key) {
|
||||
this.switchMedia = key;
|
||||
if (key === 'img' && this.videoContext) this.videoContext.pause();
|
||||
},
|
||||
init(params) {
|
||||
this.skuId = params.sku_id;
|
||||
this.goodsId = params.goods_id;
|
||||
@@ -136,6 +154,9 @@ export default {
|
||||
|
||||
this.videoContext = uni.createVideoContext('goodsVideo');
|
||||
|
||||
// 媒体显示顺序: 以后台商品「高级设置 → 媒体显示顺序」为准
|
||||
this.applyMediaOrder();
|
||||
|
||||
// #ifdef MP-WEIXIN
|
||||
this.goodsSyncToGoodsCircle();
|
||||
// #endif
|
||||
|
||||
Reference in New Issue
Block a user