sileya-ai
/
vr-shopxo-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

商品参数新增弹窗展示

master
gongfuxiang 2023-03-19 19:25:49 +08:00
parent b1902de33b
commit ac4190581d
2 changed files with 68 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
pages/goods-detail/goods-detail.css
View File

@ -336,6 +336,15 @@
.goods-parameters .content-item .item:nth-child(2n) {
float: right;
}
/**
* 商品参数弹窗
*/
.popup-params-container .item .name {
width: 220rpx;
}
.popup-params-container .item .value {
width: calc(100% - 240rpx);
}
/*
* icon

59
pages/goods-detail/goods-detail.vue
View File

@ -189,16 +189,12 @@
</view>
<!-- 商品基础参数 -->
<view v-if="(goods.parameters || null) != null && (goods.parameters.base || null) != null && goods.parameters.base.length > 0" class="goods-parameters parameters-base border-radius-main padding-main bg-white spacing-mb">
<view class="content-item oh">
<view v-if="(goods.parameters || null) != null && (goods.parameters.base || null) != null && goods.parameters.base.length > 0" class="goods-parameters parameters-base border-radius-main padding-main bg-white arrow-right single-text spacing-mb" @tap="popup_params_event" data-value="base">
<block v-for="(item, index) in goods.parameters.base" :key="index">
<view class="item single-text">
<text class="name">{{item.name}}:</text>
<text class="value">{{item.value}}</text>
</view>
<text v-if="index > 0">，</text>
<text>{{item.value}}</text>
</block>
</view>
</view>
<!-- 组合搭配 -->
<block v-if="plugins_binding_data != null">
@ -279,13 +275,18 @@
</view>
<view class="goods-parameters border-radius-main padding-main bg-white">
<view class="content-item oh">
<view class="oh">
<block v-for="(item, index) in goods.parameters.detail" :key="index">
<view class="item single-text">
<view v-if="index <= 3" class="item single-text">
<text class="name">{{item.name}}:</text>
<text class="value">{{item.value}}</text>
</view>
</block>
</view>
<view class="tc margin-top-sm">
<text class="cr-grey" @tap="popup_params_event" data-value="detail">查看全部参数 >></text>
</view>
</view>
</view>
</view>
@ -377,6 +378,30 @@
</view>
</view>
<!-- 商品参数弹窗 -->
<component-popup :propShow="popup_params_status" propPosition="bottom" @onclose="popup_params_close_event">
<view class="padding-horizontal-main padding-top-main bg-white">
<view class="close oh">
<view class="fr" @tap.stop="popup_params_close_event">
<icon type="clear" size="20"></icon>
</view>
</view>
<view class="popup-params-container">
<block v-if="(goods.parameters || null) != null && (goods.parameters[popup_params_type_field] || null) != null && goods.parameters[popup_params_type_field].length > 0">
<block v-for="(item, index) in goods.parameters[popup_params_type_field]" :key="index">
<view class="item padding-vertical-main br-b oh">
<view class="name fl br-r single-text">{{item.name}}</view>
<view class="value fr padding-left single-text">{{item.value}}</view>
</view>
</block>
</block>
<block v-else>
<view class="cr-grey tc padding-top-xl padding-bottom-xxxl">无参数数据</view>
</block>
</view>
</view>
</component-popup>
<!-- 批发弹层 -->
<component-popup :propShow="popup_wholesale_status" propPosition="bottom" @onclose="popup_wholesale_close_event">
<view class="padding-horizontal-main padding-top-main bg-base">
@ -583,6 +608,9 @@
top_nav_title_scroll: true,
top_nav_title_timer: null,
top_nav_title_data: [],
// 详情参数弹窗
popup_params_status: false,
popup_params_type_field: 'base',
// 自定义分享信息
share_info: {},
// 限时秒杀插件
@ -1206,6 +1234,21 @@
this.setData({nav_more_status: false});
},
// 商品参数开启弹层
popup_params_event(e) {
this.setData({
popup_params_status: true,
popup_params_type_field: e.currentTarget.dataset.value || 'base'
});
},
// 商品参数关闭弹层
popup_params_close_event(e) {
this.setData({
popup_params_status: false
});
},
// 批发开启弹层
popup_wholesale_event(e) {
this.setData({