<template>
|
<view>
|
<u-toast ref="uToast" /><u-no-network></u-no-network>
|
<u-navbar title="邀请拼单" safeAreaInsetTop fixed placeholder>
|
<view class="coreshop-navbar-left-slot" slot="left">
|
<u-icon name="arrow-left" size="19" @click="goNavigateBack"></u-icon>
|
<u-line direction="column" :hairline="false" length="16" margin="0 8px"></u-line>
|
<u-icon name="home" size="22" @click="goHome"></u-icon>
|
</view>
|
<view slot="right">
|
</view>
|
</u-navbar>
|
<view class="content">
|
<view class="coreshop-text-center coreshop-bg-white coreshop-padding-10 coreshop-flex coreshop-flex-wrap">
|
<view class="ig-top-t coreshop-margin-bottom-10 coreshop-percent-100 coreshop-text-center coreshop-flex coreshop-flex-nowrap coreshop-justify-center coreshop-align-center">
|
剩余： <u-count-down :time="teamInfo.lastTime * 1000" :autoStart="true" :millisecond="true" format="DD天HH时mm分ss秒"></u-count-down>
|
</view>
|
<view class="coreshop-margin-bottom-10 coreshop-percent-100 coreshop-text-center coreshop-flex coreshop-flex-nowrap coreshop-justify-center">
|
<view class="user-head-img-c" v-for="(item, index) in teamInfo.list" :key="index">
|
<view class="user-head-img-tip" v-if="item.recordId == teamInfo.teamId">拼主</view>
|
<image class="user-head-img coreshop-head-icon" :src='item.userAvatar' mode=""></image>
|
</view>
|
<view class="user-head-img-c no-head-icon" v-if="teamInfo.teamNums" v-for="n in teamInfo.teamNums" :key="n"><text>?</text></view>
|
</view>
|
<view class="coreshop-margin-bottom-10 coreshop-percent-100 coreshop-flex coreshop-flex-direction coreshop-align-center coreshop-justify-center">
|
<view class="coreshop-font-16 coreshop-text-black coreshop-margin-bottom-10">
|
还差<text class="coreshop-text-red">{{ teamInfo.teamNums }}</text>人，赶快邀请好友来拼单吧
|
</view>
|
<view class="coreshop-margin-bottom-10 coreshop-padding-5 coreshop-width-fit-content">
|
<u-button type="success" size="normal" @click="goShare">
|
<u-icon name="share-fill" color="#fff" label="立即邀请好友拼单" labelColor="#fff"></u-icon>
|
</u-button>
|
</view>
|
<view class="coreshop-font-12 coreshop-text-gray">
|
分享好友越多，成团越快
|
</view>
|
</view>
|
</view>
|
|
<!-- 弹出层 -->
|
<view class="coreshop-padding-10">
|
<u-popup mode="bottom" :show="shareBox" ref="share">
|
<!-- #ifdef MP-WEIXIN -->
|
<coreshop-share-wx :shareType='$globalConstVars.shareType.addPinTuan' :goodsId="goodsInfo.goodsId" :teamId="teamInfo.teamId" :groupId="teamInfo.ruleId" :shareImg="goodsInfo.imageUrl" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.addon" @close="closeShare()"></coreshop-share-wx>
|
<!-- #endif -->
|
<!-- #ifdef APP-PLUS || APP-PLUS-NVUE -->
|
<coreshop-share-app :shareType='$globalConstVars.shareType.addPinTuan' :goodsId="goodsInfo.goodsId" :teamId="teamInfo.teamId" :groupId="teamInfo.ruleId" :shareImg="goodsInfo.imageUrl" :shareTitle="goodsInfo.name" :shareContent="goodsInfo.addon" @close="closeShare()"></coreshop-share-app>
|
<!-- #endif -->
|
</u-popup>
|
</view>
|
|
<view class="coreshop-cell-group coreshop-margin-top-10 coreshop-margin-bottom-10">
|
<view class='coreshop-cell-item'>
|
<view class='coreshop-cell-item-hd'>
|
<view class='coreshop-cell-hd-title'>商品名称</view>
|
</view>
|
<view class='coreshop-cell-item-ft'>
|
<text class="coreshop-cell-ft-text">{{ goodsInfo.name }}</text>
|
</view>
|
</view>
|
<view class='coreshop-cell-item'>
|
<view class='coreshop-cell-item-hd'>
|
<view class='coreshop-cell-hd-title'>拼单时间</view>
|
</view>
|
<view class='coreshop-cell-item-ft'>
|
<text class="coreshop-cell-ft-text">{{ orderInfo.createTime }}</text>
|
</view>
|
</view>
|
<view class='coreshop-cell-item'>
|
<view class='coreshop-cell-item-hd'>
|
<view class='coreshop-cell-hd-title'>拼单须知</view>
|
</view>
|
<view class='coreshop-cell-item-ft group-notice'>
|
<text class="coreshop-cell-ft-text">* 好友拼单 </text>
|
<text class="coreshop-cell-ft-text">* 人满发货 </text>
|
<text class="coreshop-cell-ft-text">* 人不满退款 </text>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
data() {
|
return {
|
shareType: 3,
|
goodsInfo: [],
|
teamInfo: [],
|
query: '', // query参数登录跳转回来使用
|
userToken: 0,
|
orderId: '',//订单号
|
orderInfo: {},
|
shareUrl: this.$globalConstVars.shareUrl,
|
shareBox: false,
|
}
|
},
|
onLoad(options) {
|
if (options.orderId) {
|
this.orderId = options.orderId;
|
} else {
|
this.$u.toast('参数错误');
|
}
|
this.orderDetail();
|
this.getTeam();
|
},
|
methods: {
|
//拼团信息
|
getTeam() {
|
this.$u.api.getOrderPinTuanTeamInfo({ orderId: this.orderId }).then(res => {
|
if (res.status) {
|
this.teamInfo = {
|
list: res.data.teams,
|
userAvatar: res.data.userAvatar,
|
currentCount: res.data.teams.length,
|
peopleNumber: res.data.peopleNumber,
|
teamNums: res.data.teamNums, //剩余
|
closeTime: res.data.closeTime, //关闭时间
|
id: res.data.id, //拼团id
|
teamId: res.data.teamId, //拼团团队id
|
ruleId: res.data.ruleId,
|
status: res.data.status,
|
lastTime: res.data.lastTime
|
};
|
} else {
|
this.$u.toast(res.msg)
|
}
|
|
});
|
},
|
//获取订单详情
|
orderDetail() {
|
let _this = this
|
let data = {
|
id: _this.orderId
|
}
|
_this.$u.api.orderDetail(data).then(res => {
|
if (res.status) {
|
let data = res.data
|
|
_this.orderInfo = data
|
_this.goodsInfo = data.items[0];
|
|
} else {
|
_this.$u.toast(res.msg)
|
}
|
})
|
},
|
// 关闭弹出层
|
close() {
|
this.$emit('close')
|
},
|
// 点击操作
|
clickHandler(e) {
|
if (e.cate === 'poster') {
|
this.createPoster()
|
} else {
|
// 去分享
|
this.share(e)
|
}
|
},
|
// 显示modal弹出框
|
toshow(type, teamId = 0) {
|
if (type == 1) {
|
this.lvvpopref_type = 1;
|
}
|
if (teamId !== 0) {
|
this.teamId = teamId;
|
}
|
this.$refs.lvvpopref.show();
|
},
|
// 关闭modal弹出框
|
toclose() {
|
this.$refs.lvvpopref.close();
|
},
|
// 跳转到h5分享页面
|
goShare() {
|
this.shareBox = true;
|
},
|
closeShare() {
|
this.shareBox = false;
|
},
|
//获取分享URL
|
getShareUrl() {
|
let data = {
|
client: this.$globalConstVars.shareClient.wxMiNiProgram,
|
url: this.$globalConstVars.shareUrl,
|
type: this.$globalConstVars.shareModel.url,
|
page: this.$globalConstVars.shareType.addPinTuan,
|
params: {
|
goodsId: this.goodsInfo.goodsId,
|
teamId: this.teamInfo.teamId,
|
groupId: this.teamInfo.ruleId
|
}
|
};
|
let userToken = this.$db.get('userToken');
|
if (userToken && userToken != '') {
|
data.token = userToken
|
}
|
this.$u.api.share(data).then(res => {
|
this.shareUrl = res.data
|
});
|
}
|
},
|
watch: {
|
goodsInfo: {
|
handler() {
|
this.getShareUrl();
|
},
|
deep: true
|
},
|
teamInfo: {
|
handler() {
|
this.getShareUrl();
|
},
|
deep: true
|
}
|
},
|
//分享
|
onShareAppMessage(res) {
|
console.log(this.shareUrl);
|
return {
|
title: this.goodsInfo.name,
|
imageUrl: this.goodsInfo.imageUrl,
|
path: this.shareUrl
|
}
|
},
|
onShareTimeline(res) {
|
return {
|
title: this.goodsInfo.name,
|
imageUrl: this.goodsInfo.imageUrl,
|
path: this.shareUrl
|
}
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
@import "invitationGroup.scss";
|
</style>
|
