Commit 23904f66 authored by beisir's avatar beisir

Merge branch 'feat/group-buy' of git.quantgroup.cn:ui/group-buy-ui into feat/group-buy

parents 149969e0 95c6c758
...@@ -42,10 +42,8 @@ ...@@ -42,10 +42,8 @@
</div> </div>
</template> </template>
<script> <script>
import goodsCheckMixin from '@/mixins/goodsCheck.mixin';
export default { export default {
name: 'BottomNav', name: 'BottomNav',
mixins: [goodsCheckMixin],
props: { props: {
groupId: { groupId: {
type: Number, type: Number,
...@@ -83,9 +81,6 @@ export default { ...@@ -83,9 +81,6 @@ export default {
createOrJoin(mark) { createOrJoin(mark) {
// 参团 // 参团
// mark 1-> 开团 2-> 参团 // mark 1-> 开团 2-> 参团
if (this.checkLogin()) {
return;
}
this.$emit('buy', mark); this.$emit('buy', mark);
} }
} }
......
...@@ -21,7 +21,12 @@ ...@@ -21,7 +21,12 @@
<!-- </template> --> <!-- </template> -->
</div> </div>
<div v-if="showButtonGroup" ref="buttonArea" class="button-area"> <div v-if="showButtonGroup" ref="buttonArea" class="button-area">
<cr-button v-if="groupInfo.groupBuyStatus == 1" block shape="circle" type="primary" <cr-button
v-if="groupInfo.groupBuyStatus == 1"
block
shape="circle"
type="primary"
@click="share"
>邀请好友</cr-button >邀请好友</cr-button
> >
<cr-button v-else plain block shape="circle" type="primary" @click="toList" <cr-button v-else plain block shape="circle" type="primary" @click="toList"
...@@ -68,10 +73,12 @@ export default { ...@@ -68,10 +73,12 @@ export default {
if (this.$refs.buttonArea) { if (this.$refs.buttonArea) {
this.observer = new IntersectionObserver(entries => { this.observer = new IntersectionObserver(entries => {
entries.forEach(item => { entries.forEach(item => {
if (item.intersectionRatio == 0) { if (this.groupInfo.groupBuyStatus == 1) {
this.$emit('changeButtonVisible', true); if (item.intersectionRatio == 0) {
} else { this.$emit('changeButtonVisible', true);
this.$emit('changeButtonVisible', false); } else {
this.$emit('changeButtonVisible', false);
}
} }
}); });
}); });
...@@ -87,11 +94,13 @@ export default { ...@@ -87,11 +94,13 @@ export default {
}, },
methods: { methods: {
toList() { toList() {
console.log(this.$route);
const { activityId } = this.$route.query || ''; const { activityId } = this.$route.query || '';
if (activityId) { if (activityId) {
this.$router.push({ name: 'groupBuyList', query: { activityId } }); this.$router.push({ name: 'groupBuyList', query: { activityId } });
} }
},
share() {
this.$emit('share');
} }
} }
}; };
......
...@@ -263,7 +263,7 @@ export default { ...@@ -263,7 +263,7 @@ export default {
}) })
}, },
created() { created() {
this.hasLogin = localStorage.get('vccToken') != 'null' ? true : false; this.hasLogin = localStorage.get('vccToken') ? true : false;
this.detailParam = { ...this.$route.query }; this.detailParam = { ...this.$route.query };
localStorage.remove('orderData'); localStorage.remove('orderData');
localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id,用于下单 localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id,用于下单
......
...@@ -65,6 +65,7 @@ ...@@ -65,6 +65,7 @@
:timestemp="groupTimestemp" :timestemp="groupTimestemp"
:show-button-group="true" :show-button-group="true"
@changeButtonVisible="changeButtonVisible" @changeButtonVisible="changeButtonVisible"
@share="setShareData"
/> />
<successInfo :group-info="detailInfo.groupBuyInfo || {}" /> <successInfo :group-info="detailInfo.groupBuyInfo || {}" />
<cr-divider <cr-divider
...@@ -90,6 +91,7 @@ ...@@ -90,6 +91,7 @@
</div> </div>
</div> </div>
<bottom-nav v-if="showButtonNav" :status="2" :disabled="false" @share="shareTo" /> <bottom-nav v-if="showButtonNav" :status="2" :disabled="false" @share="shareTo" />
<sharePic ref="sharePic" :share-pic-data="sharePicData" @outputPicUrl="outputPicUrl" />
</div> </div>
</template> </template>
<script> <script>
...@@ -101,6 +103,7 @@ import successInfo from '@/components/groupBuySuccessInfo'; ...@@ -101,6 +103,7 @@ import successInfo from '@/components/groupBuySuccessInfo';
import rules from '@/components/rules'; import rules from '@/components/rules';
import groupDescInfo from './components/groupDescInfo'; import groupDescInfo from './components/groupDescInfo';
import localStorage from '@/service/localStorage.service'; import localStorage from '@/service/localStorage.service';
import sharePic from '@/components/sharePic';
export default { export default {
// eslint-disable-next-line vue/name-property-casing // eslint-disable-next-line vue/name-property-casing
name: 'goodDetail', name: 'goodDetail',
...@@ -110,7 +113,8 @@ export default { ...@@ -110,7 +113,8 @@ export default {
avatorGroup, avatorGroup,
successInfo, successInfo,
rules, rules,
groupDescInfo groupDescInfo,
sharePic
}, },
data() { data() {
return { return {
...@@ -120,6 +124,9 @@ export default { ...@@ -120,6 +124,9 @@ export default {
inProgress: false, // 活动是否已经开始 inProgress: false, // 活动是否已经开始
countDownText: '', countDownText: '',
stockPercentage: 0, stockPercentage: 0,
sharePicData: {}, // 生成海报图所需要的链接
shareInfo: {}, // 调用分享需要的参数
picUrl: '', // 海报url
// 以下是原有的data // 以下是原有的data
detailParam: { detailParam: {
skuNo: '', skuNo: '',
...@@ -129,13 +136,24 @@ export default { ...@@ -129,13 +136,24 @@ export default {
detailInfo: {}, detailInfo: {},
imgList: [], imgList: [],
detailImgList: [], // 商品详情图像展示 detailImgList: [], // 商品详情图像展示
hasLogin: false,
name: {}, name: {},
showButtonNav: false // 是否显示底部按钮 showButtonNav: false // 是否显示底部按钮
}; };
}, },
computed: {
goodsShareInfo() {
return this.$store.state.pay.goodsShareInfo;
}
},
watch: {
goodsShareInfo: {
immediate: false,
handler(val) {
this.onShareEventChange(val);
}
}
},
created() { created() {
this.hasLogin = window.localStorage.getItem('vccToken') != 'null' ? true : false;
this.detailParam = { ...this.$route.query }; this.detailParam = { ...this.$route.query };
localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id,用于下单 localStorage.set('activityId', this.detailParam.templateId); // 设置活动模板id,用于下单
if (this.detailParam.groupBuyGroupId) { if (this.detailParam.groupBuyGroupId) {
...@@ -159,8 +177,54 @@ export default { ...@@ -159,8 +177,54 @@ export default {
}, 5000); }, 5000);
}, },
methods: { methods: {
shareTo() { async onShareEventChange({ ev, nativeBridge }) {
// 分享 if (ev === 'pic') {
// 处理图片url
nativeBridge.openNewUrl({
newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(this.picUrl))}`
});
this.$store.dispatch('goods_share_close');
}
if (ev === 'weixin') {
nativeBridge.run({
event: 'showShareView',
data: this.shareInfo
});
}
},
outputPicUrl(res) {
this.picUrl = res || '';
this.shareInfo = {
title: this.detailInfo.goodsName,
desc: '',
link: `${window.location.href}&groupBuyGroupId=${this.groupId}` || '', // 页面地址
imgUrl: this.detailInfo.thumbImageUrl, // 图片地
posterUrl: res || ''
};
this.$store.dispatch('goods_share_open', this.shareInfo);
},
setShareData() {
const avatorList = [];
this.detailInfo.groupBuyInfo.groupBuyValidUserInfoList.map(v => {
avatorList.push(v.avatar);
});
this.sharePicData = {
groupBuySuccessGuys: this.detailInfo?.groupBuyInfo.groupBuySuccessPersonCount,
salePrice: this.detailInfo.price, // y
groupBuyGroupId: this.groupId,
goodsSpecialId: this.detailParam.goodsSpecialId,
openGroupCnt: this.detailInfo?.groupBuyInfo.groupBuyLimitUserCount,
templateId: this.detailParam.templateId,
templateDetailId: this.detailParam.templateDetailId,
needGuys: this.detailInfo?.groupBuyInfo.groupBuyNeedUserCount,
skuName: this.detailInfo.goodsName, // y
activityId: this.detailParam.activityId,
skuImg: this.detailInfo.thumbImageUrl, // y,
activityPrice: this.detailInfo.activityPrice, // y
skuNo: this.detailParam.skuNo,
peoplePhotoList: avatorList
};
this.$refs.sharePic.createAndUploadPic();
}, },
changeButtonVisible(res) { changeButtonVisible(res) {
this.showButtonNav = res; this.showButtonNav = res;
......
...@@ -76,6 +76,8 @@ import groupBuyApi from '@/api/groupBuy'; ...@@ -76,6 +76,8 @@ import groupBuyApi from '@/api/groupBuy';
import { isApp, isWxMp } from '@/service/validation.service'; import { isApp, isWxMp } from '@/service/validation.service';
import { EventBus } from '@/service/utils.service'; import { EventBus } from '@/service/utils.service';
import sharePic from '@/components/sharePic'; import sharePic from '@/components/sharePic';
import qs from 'qs';
import config from '@/config';
export default { export default {
components: { components: {
// Goods, // Goods,
...@@ -98,6 +100,19 @@ export default { ...@@ -98,6 +100,19 @@ export default {
picUrl: '' picUrl: ''
}; };
}, },
computed: {
goodsShareInfo() {
return this.$store.state.pay.goodsShareInfo;
}
},
watch: {
goodsShareInfo: {
immediate: false,
handler(val) {
this.onShareEventChange(val);
}
}
},
created() { created() {
const { orderNo, reason, amount, freeAmount, payType } = this.$route.query; const { orderNo, reason, amount, freeAmount, payType } = this.$route.query;
const { success } = this.$route.meta; const { success } = this.$route.meta;
...@@ -111,26 +126,45 @@ export default { ...@@ -111,26 +126,45 @@ export default {
this.payStatusName = success ? '支付成功' : '支付失败'; this.payStatusName = success ? '支付成功' : '支付失败';
this.getCouponList(); this.getCouponList();
}, },
mounted() { beforeDestroy() {
const _this = this; EventBus.$off('shareClickItem');
EventBus.$on('shareClickItem', async function({ ev, nativeBridge }) { },
methods: {
async onShareEventChange({ ev, nativeBridge }) {
if (ev === 'pic') { if (ev === 'pic') {
// 处理图片url // 处理图片url
nativeBridge.openNewUrl({ nativeBridge.openNewUrl({
newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(_this.picUrl))}` newUrl: `/pages/goodshare/index?url=${encodeURIComponent(JSON.stringify(this.picUrl))}`
}); });
_this.$store.dispatch('goods_share_close'); this.$store.dispatch('goods_share_close');
} }
}); if (ev === 'weixin') {
}, nativeBridge.run({
beforeDestroy() { event: 'showShareView',
EventBus.$off('shareClickItem'); data: this.shareInfo
}, });
methods: { }
},
outputPicUrl(res) { outputPicUrl(res) {
this.picUrl = res; this.picUrl = res;
this.$store.dispatch('goods_share_open'); const linkPath = qs.stringify({
console.log(this.picUrl); h: 0,
skuNo: this.sharePicData.skuNo,
groupBuyGroupId: this.sharePicData.groupBuyGroupId,
goodsSpecialId: this.sharePicData.goodsSpecialId,
activityId: this.sharePicData.activityId,
templateId: this.sharePicData.templateId,
templateDetailId: this.sharePicData.templateDetailId
});
let detailUrl = `${config.localHost}/groupBuy/skuInfo?${linkPath}`;
this.shareInfo = {
title: this.sharePicData.skuName,
desc: '',
link: detailUrl || '', // 页面地址
imgUrl: this.sharePicData.skuImg, // 图片地
posterUrl: res || ''
};
this.$store.dispatch('goods_share_open', this.shareInfo);
}, },
async setShareData() { async setShareData() {
const [res, error] = await groupBuyApi.getGroupShareInfo(this.orderNo); const [res, error] = await groupBuyApi.getGroupShareInfo(this.orderNo);
...@@ -140,16 +174,6 @@ export default { ...@@ -140,16 +174,6 @@ export default {
this.sharePicData = res; this.sharePicData = res;
this.$refs.sharePic.createAndUploadPic(); this.$refs.sharePic.createAndUploadPic();
}, },
// goPay() {
// this.$track?.registeredEvents('h5_RechargeResultPageClick', {
// commodity_id: this.skuID,
// order_number: this.orderNo,
// pay_method: this.payMethodName,
// pay_status: this.payStatusName,
// buttons_name: '重新支付'
// });
// this.$router.replace({ name: 'pay', query: { orderNo: this.orderNo } });
// },
goPage(type) { goPage(type) {
if (type == 1) { if (type == 1) {
this.$router.replace({ path: '/orderList/0' }); this.$router.replace({ path: '/orderList/0' });
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment