拼团页面优化,增加分享和下拉刷新

This commit is contained in:
gongfuxiang
2026-05-25 09:17:30 +08:00
parent d8834c1297
commit 3939160bde
4 changed files with 107 additions and 10 deletions

View File

@ -2252,14 +2252,14 @@
{
"path": "detail/detail",
"style": {
"enablePullDownRefresh": false,
"enablePullDownRefresh": true,
"navigationBarTitleText": ""
}
},
{
"path": "team/team",
"style": {
"enablePullDownRefresh": false,
"enablePullDownRefresh": true,
"navigationBarTitleText": ""
}
},

View File

@ -1,3 +1,14 @@
.groupbuy-detail-share-fixed {
top: 20rpx;
right: 24rpx;
z-index: 10;
}
.groupbuy-detail-share-icon {
width: 64rpx;
height: 64rpx;
background: rgba(0, 0, 0, 0.35);
}
.goods-photo-swiper-wrap,
.goods-photo-swiper-dot,
.goods-photo-swiper {

View File

@ -3,6 +3,11 @@
<block v-if="data_list_loding_status == 3">
<view class="page-bottom-fixed">
<view class="groupbuy-detail-hero spacing-mb" :class="photo_list.length <= 0 ? 'groupbuy-detail-hero-no-photo' : ''">
<view class="groupbuy-detail-share-fixed pa" @tap="popup_share_event">
<view class="groupbuy-detail-share-icon flex-row align-c jc-c round">
<iconfont name="icon-share-circle" color="#ffffff" size="36rpx"></iconfont>
</view>
</view>
<view v-if="photo_list.length > 0" class="goods-photo-swiper-wrap">
<uni-swiper-dot class="goods-photo-swiper-dot" mode="dot" :dots-styles="photo_dots_styles" :info="photo_list" :current="photo_swiper_current">
<swiper class="goods-photo-swiper" circular :indicator-dots="false" @change="photo_swiper_change_event">
@ -98,6 +103,8 @@
<block v-else>
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg"></component-no-data>
</block>
<!-- 分享弹窗 -->
<component-share-popup ref="share"></component-share-popup>
<component-common ref="common"></component-common>
</view>
</template>
@ -108,6 +115,7 @@
import componentGoodsBuy from '@/components/goods-buy/goods-buy';
import componentGroupbuyPlayRules from '../components/groupbuy-play-rules/groupbuy-play-rules';
import componentBottomLine from '@/components/bottom-line/bottom-line';
import componentSharePopup from '@/components/share-popup/share-popup';
export default {
data() {
return {
@ -161,6 +169,7 @@
componentGoodsBuy,
componentGroupbuyPlayRules,
componentBottomLine,
componentSharePopup,
},
onLoad(params) {
// 调用公共事件方法
@ -189,6 +198,21 @@
}
},
// 下拉刷新
onPullDownRefresh() {
this.get_data();
},
// 分享
onShareAppMessage() {
var share = app.globalData.share_content_handle(this.share_info || {});
return {
title: share.title,
path: share.path + share.query,
imageUrl: share.img,
};
},
methods: {
// 初始化配置
init_config(status) {
@ -234,6 +258,7 @@
data: data,
dataType: 'json',
success: (res) => {
uni.stopPullDownRefresh();
if (res.data.code == 0) {
var result = res.data.data;
var goods = result.goods || {};
@ -257,6 +282,16 @@
if (!show_original_price && (goods.original_price || null) != null && (groupbuy.min_groupbuy_price || null) != null) {
show_original_price = parseFloat(goods.original_price) > parseFloat(groupbuy.min_groupbuy_price);
}
var share_query = 'id=' + groupbuy.id;
if (join_team_id > 0) {
share_query += '&team_id=' + join_team_id;
}
var share_desc = (groupbuy.group_number || 0) + '人团';
if (join_team_id > 0) {
share_desc += ',邀请你一起参团';
} else {
share_desc += ',快来一起拼团吧';
}
this.setData({
goods: goods,
groupbuy: groupbuy,
@ -275,7 +310,9 @@
data_bottom_line_status: true,
share_info: {
title: groupbuy.title || goods.title,
path: '/pages/plugins/groupbuy/detail/detail?id=' + groupbuy.id + (join_team_id > 0 ? '&team_id=' + join_team_id : ''),
desc: share_desc,
path: '/pages/plugins/groupbuy/detail/detail',
query: share_query,
img: goods.images || '',
},
});
@ -290,6 +327,7 @@
}
},
fail: () => {
uni.stopPullDownRefresh();
this.setData({
data_bottom_line_status: false,
data_list_loding_status: 2,
@ -356,6 +394,19 @@
url_event(e) {
app.globalData.url_event(e);
},
// 分享开启弹层
popup_share_event(e) {
if (!app.globalData.is_single_page_check()) {
return false;
}
if ((this.$refs.share || null) != null) {
this.$refs.share.init({
status: true,
share_info: this.share_info,
});
}
},
},
};
</script>

View File

@ -65,7 +65,7 @@
<button v-if="user == null" class="btn round bg-main cr-white text-size-md wh-auto" type="default" @tap="login_event" hover-class="none">登录后参团</button>
<block v-else>
<button class="btn round bg-main cr-white text-size-md wh-auto margin-bottom-main" type="default" @tap="join_team_event" hover-class="none">立即参团</button>
<button class="btn round bg-white br-main cr-main text-size-md wh-auto" type="default" open-type="share" hover-class="none">邀请好友参团</button>
<button class="btn round bg-white br-main cr-main text-size-md wh-auto" type="default" hover-class="none" @tap="popup_share_event">邀请好友参团</button>
<view v-if="is_leader" class="tc margin-top-main">
<text class="cr-grey text-size-xs" @tap="team_cancel_event">取消开团</text>
</view>
@ -81,6 +81,8 @@
<block v-else>
<component-no-data :propStatus="data_list_loding_status" :propMsg="data_list_loding_msg"></component-no-data>
</block>
<!-- 分享弹窗 -->
<component-share-popup ref="share"></component-share-popup>
<component-common ref="common"></component-common>
</view>
</template>
@ -90,6 +92,7 @@
import componentNoData from '@/components/no-data/no-data';
import componentBottomLine from '@/components/bottom-line/bottom-line';
import componentGroupbuyPlayRules from '../components/groupbuy-play-rules/groupbuy-play-rules';
import componentSharePopup from '@/components/share-popup/share-popup';
export default {
data() {
return {
@ -119,6 +122,7 @@
componentNoData,
componentBottomLine,
componentGroupbuyPlayRules,
componentSharePopup,
},
onLoad(params) {
// 调用公共事件方法
@ -149,9 +153,19 @@
clearInterval(this.countdown_timer);
},
// 下拉刷新
onPullDownRefresh() {
this.get_data();
},
// 分享
onShareAppMessage() {
return this.share_info || {};
var share = app.globalData.share_content_handle(this.share_info || {});
return {
title: share.title,
path: share.path + share.query,
imageUrl: share.img,
};
},
methods: {
@ -163,15 +177,20 @@
data: { id: this.params.id || 0 },
dataType: 'json',
success: (res) => {
uni.stopPullDownRefresh();
if (res.data.code == 0) {
var result = res.data.data;
var team = result.team || {};
var user = result.user || null;
var is_leader = user != null && team.leader_user_id == user.id;
var groupbuy = result.groupbuy || {};
var goods = result.goods || {};
var share_title = groupbuy.title || goods.title || '邀请你参团';
var share_desc = '还差' + (team.remain_number || 0) + '人成团,快来一起拼团吧';
this.setData({
team: team,
groupbuy: result.groupbuy || {},
goods: result.goods || {},
groupbuy: groupbuy,
goods: goods,
members: result.members || [],
empty_slots: result.empty_slots || [],
groupbuy_config: result.groupbuy_config || {},
@ -182,9 +201,11 @@
data_list_loding_status: 3,
data_bottom_line_status: true,
share_info: {
title: (result.groupbuy || {}).title || '邀请你参团',
path: team.share_url || ('/pages/plugins/groupbuy/team/team?id=' + team.id),
imageUrl: (result.goods || {}).images || '',
title: share_title,
desc: share_desc,
path: '/pages/plugins/groupbuy/team/team',
query: 'id=' + team.id,
img: goods.images || '',
},
});
this.countdown_init(team.expire_time || 0);
@ -199,6 +220,7 @@
}
},
fail: () => {
uni.stopPullDownRefresh();
this.setData({
data_bottom_line_status: false,
data_list_loding_status: 2,
@ -276,6 +298,19 @@
url_event(e) {
app.globalData.url_event(e);
},
// 分享开启弹层
popup_share_event(e) {
if (!app.globalData.is_single_page_check()) {
return false;
}
if ((this.$refs.share || null) != null) {
this.$refs.share.init({
status: true,
share_info: this.share_info,
});
}
},
},
};
</script>