Commit 87a7a6ab authored by beisir's avatar beisir

feat:提交头像列表

parents 6703e3ae 34fe5d2f
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
<div id="app"> <div id="app">
<cr-nav-bar v-if="header" :title="title" left-text="" @click-left="backFun" /> <cr-nav-bar v-if="header" :title="title" left-text="" @click-left="backFun" />
<div class="app"> <div class="app">
<!-- <Weapp v-if="isWeixinBrowser" jump-url="/pages/user/login" /> -->
<keep-alive> <keep-alive>
<router-view v-if="$route.meta.keepLive" /> <router-view v-if="$route.meta.keepLive" />
</keep-alive> </keep-alive>
...@@ -19,6 +20,7 @@ import { mapState } from 'vuex'; ...@@ -19,6 +20,7 @@ import { mapState } from 'vuex';
import NetError from '@/components/NetError'; import NetError from '@/components/NetError';
import { isApp, isWxMp, isWechat } from '@/service/validation.service'; import { isApp, isWxMp, isWechat } from '@/service/validation.service';
import store from '@/store'; import store from '@/store';
// import Weapp from '@/components/weapp';
import goodsShare from '@/components/groupShare'; import goodsShare from '@/components/groupShare';
import qs from 'qs'; import qs from 'qs';
export default { export default {
...@@ -54,7 +56,7 @@ export default { ...@@ -54,7 +56,7 @@ export default {
bool: !isApp && !isWxMp && !isWechat ? true : false, bool: !isApp && !isWxMp && !isWechat ? true : false,
pointer: this pointer: this
}); });
// store.dispatch('change_is_weixin_browser', !isApp && !isWxMp && isWechat ? true : false); store.dispatch('change_is_weixin_browser', !isApp && !isWxMp && isWechat ? true : false);
} }
}, },
created() { created() {
......
...@@ -59,7 +59,9 @@ export default { ...@@ -59,7 +59,9 @@ export default {
return http.get(`${talosHost}/api/kdsp/playBill/getMakePicData?${qsString}`); return http.get(`${talosHost}/api/kdsp/playBill/getMakePicData?${qsString}`);
}, },
getGroupShareInfo(orderNo) { getGroupShareInfo(orderNo) {
return http.get(`${talosHost}/api/kdsp/groupShareInfo?orderNo=${orderNo}`); return http.get(`${talosHost}/api/kdsp/groupShareInfo?orderNo=${orderNo}`, {
hideLoading: true
});
}, },
getPlayBillUrl(m) { getPlayBillUrl(m) {
return http.get(`http://192.168.25.122/api/kdsp/playBill/getPlayBillUrl?m=${m}`); return http.get(`http://192.168.25.122/api/kdsp/playBill/getPlayBillUrl?m=${m}`);
......
...@@ -13,17 +13,19 @@ ...@@ -13,17 +13,19 @@
height="" height=""
:src="item.avatar" :src="item.avatar"
/> />
<div v-if="item.userTag && item.userTag == '团长'" class="is-leader"> <template v-if="item.userTag && item.userTag == '团长'">
<cr-image class="crown" width="" height="" src="@/assets/images/leaderIcon.png" /> <div class="is-leader">
</div> <cr-image class="crown" width="" height="" src="@/assets/images/leaderIcon.png" />
<div v-if="item.userTag && item.userTag == '团长'" class="leader-name"> </div>
<cr-image <div class="leader-name">
class="leader-name-icon" <cr-image
height="" class="leader-name-icon"
width="" height=""
src="@/assets/images/leader-name.png" width=""
/> src="@/assets/images/leader-name.png"
</div> />
</div>
</template>
<div v-if="item.userTag && item.userTag.toLowerCase() == 'new'" class="is-new"> <div v-if="item.userTag && item.userTag.toLowerCase() == 'new'" class="is-new">
<cr-image width="25px" src="@/assets/images/new-user.png" /> <cr-image width="25px" src="@/assets/images/new-user.png" />
</div> </div>
...@@ -32,9 +34,23 @@ ...@@ -32,9 +34,23 @@
v-for="n in placeholderNum" v-for="n in placeholderNum"
:key="`placeholder-${n}`" :key="`placeholder-${n}`"
class="placeholder" class="placeholder"
:class="{ leader: avators.length == 0 }"
:style="widthStyle" :style="widthStyle"
> >
<div class="content">?</div> <template v-if="avators.length == 0 && n == 1">
<div class="is-leader">
<cr-image class="crown" width="" height="" src="@/assets/images/leaderIcon.png" />
</div>
<div class="leader-name">
<cr-image
class="leader-name-icon"
height=""
width=""
src="@/assets/images/leader-name.png"
/>
</div>
</template>
<div class="content" :class="{ avator: avators.length == 0 && n == 1 }">?</div>
</div> </div>
<div v-if="groupHC >= 10" class="more" :style="widthStyle" @click="showMoreAvator"> <div v-if="groupHC >= 10" class="more" :style="widthStyle" @click="showMoreAvator">
<div class="content" /> <div class="content" />
...@@ -193,6 +209,48 @@ export default { ...@@ -193,6 +209,48 @@ export default {
/deep/ .cr-dialog--message { /deep/ .cr-dialog--message {
padding-top: 0; padding-top: 0;
} }
.placeholder.leader {
position: relative;
.is-leader {
position: absolute;
right: 4px;
top: -9px;
.crown {
width: 22px;
height: 20px;
}
}
.leader-name {
width: 35px;
height: 17px;
position: absolute;
left: 50%;
bottom: -6px;
transform: translateX(-50%);
&-icon {
width: 100%;
height: 100%;
img {
width: 35px;
height: 17px;
}
}
}
.avator {
background: #ffe1e1 url('../assets/images/leaderBorder.png');
// border: px solid rgba(255, 212, 0, 0.24);
background-size: cover;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
border: 0;
/deep/ img {
width: 37px;
height: 37px;
}
}
}
.placeholder, .placeholder,
.more { .more {
display: flex; display: flex;
......
...@@ -85,6 +85,7 @@ export default { ...@@ -85,6 +85,7 @@ export default {
if (isWxMp) { if (isWxMp) {
this.shareOpenWechat(); this.shareOpenWechat();
} }
this.$store.dispatch('change_loading', false);
}, },
handleShareInfo(shareInfo) { handleShareInfo(shareInfo) {
// 处理是否已经有 海报地址,如果有,小程序弹出地步框,App直接弹出分享 // 处理是否已经有 海报地址,如果有,小程序弹出地步框,App直接弹出分享
...@@ -98,6 +99,7 @@ export default { ...@@ -98,6 +99,7 @@ export default {
// 直接调用app分享方法 // 直接调用app分享方法
this.appShareEventChange(); this.appShareEventChange();
} }
this.$store.dispatch('change_loading', false);
return; return;
// 如果传递的数据有海报则不处理 // 如果传递的数据有海报则不处理
} }
......
...@@ -74,13 +74,18 @@ ...@@ -74,13 +74,18 @@
style="width: 94px;height: 94px;margin: 0 21px;font-size: 34px;" style="width: 94px;height: 94px;margin: 0 21px;font-size: 34px;"
/> />
</div> </div>
<div class="groupProcess" style="width: 750px;height: 123px;padding-top: 50px;"> <div class="groupProcess" style="width: 920px;height: 123px;padding-top: 50px;">
<div class="desc" style="border-radius: 36.5px;font-size: 34px;"> <div class="desc" style="border-radius: 36.5px;font-size: 34px;">
还差 <span style="margin: 0 10px;">{{ sharePicData.needGuys }}人</span> 成团,<template <template v-if="avatorList.length == 0">
v-if="endTime != ''" 开团0元拿商品,
><template v-if="avatorList.length == 0">活动</template </template>
><template v-else>参团</template>截止时间 {{ endTime }}</template <template v-else>
> 还差 <span style="margin: 0 10px;">{{ sharePicData.needGuys }}</span> 成团,
</template>
<template v-if="endTime != ''">
<template v-if="avatorList.length == 0">活动</template>
<template v-else>参团</template>截止时间 {{ endTime }}
</template>
</div> </div>
</div> </div>
</div> </div>
...@@ -171,9 +176,12 @@ export default { ...@@ -171,9 +176,12 @@ export default {
}, },
async createAndUploadPic(sharePicData) { async createAndUploadPic(sharePicData) {
this.sharePicData = sharePicData; this.sharePicData = sharePicData;
let endTime = sharePicData.endTime ? sharePicData.endTime.split(' ')[0] : ''; const endTimeYMD = sharePicData.endTime ? sharePicData.endTime.split(' ')[0] : '';
if (endTime) { const endTimeHMS = sharePicData.endTime ? sharePicData.endTime.split(' ')[1] : '';
this.endTime = `${new Date(endTime).getMonth() + 1}${new Date(endTime).getDate()}日`; if (endTimeYMD) {
this.endTime = `${new Date(endTimeYMD).getMonth() + 1}${new Date(
endTimeYMD
).getDate()}${endTimeHMS}`;
} }
this.handleAvator(sharePicData); this.handleAvator(sharePicData);
const _this = this; const _this = this;
...@@ -196,6 +204,7 @@ export default { ...@@ -196,6 +204,7 @@ export default {
const observer = { const observer = {
error(err) { error(err) {
console.log(err); console.log(err);
_this.$store.dispatch('change_loading', false);
}, },
complete({ hash }) { complete({ hash }) {
const fileLink = config.qiniuHost + hash; const fileLink = config.qiniuHost + hash;
......
<template> <template>
<div class="goods-bottom"> <div class="goods-bottom">
<template v-if="status == 1"> <template v-if="status == 1">
<template v-if="groupId"> <template v-if="!groupId">
<cr-button
shape="circle"
:disabled="disabled"
type="primary"
block
@click="createOrJoin(1)"
>
立即开团
</cr-button>
</template>
<template v-else>
<cr-button <cr-button
class="mutiplie" class="mutiplie"
plain plain
...@@ -11,33 +22,42 @@ ...@@ -11,33 +22,42 @@
@click="createOrJoin(2)" @click="createOrJoin(2)"
>自己做团长</cr-button >自己做团长</cr-button
> >
<!-- canJoinGroupBuyAgain -> 是否可以参团 groupBuyStatus 1->拼团中 -->
<cr-button <cr-button
v-if="info.canJoinGroupBuyAgain && info.groupBuyStatus == 1"
class="mutiplie" class="mutiplie"
shape="circle" shape="circle"
:disabled="disabled" :disabled="disabled"
type="primary" type="primary"
block block
@click="createOrJoin(0)" @click="createOrJoin(3)"
> >
立即参团 立即参团
</cr-button> </cr-button>
</template> </template>
<template v-else>
<cr-button
shape="circle"
:disabled="disabled"
type="primary"
block
@click="createOrJoin(1)"
>
立即开团
</cr-button>
</template>
</template> </template>
<template v-else> <template v-else>
<cr-button shape="circle" :disabled="disabled" type="primary" block @click="shareTo"> <cr-button
v-if="info.groupBuyStatus == 1 || info.groupBuyStatus == 0"
shape="circle"
:disabled="disabled"
type="primary"
block
@click="shareTo"
>
邀请好友 邀请好友
</cr-button> </cr-button>
<cr-button
v-else
shape="circle"
plain
:disabled="disabled"
type="primary"
block
@click="toList"
>
查看其他商品
</cr-button>
</template> </template>
</div> </div>
</template> </template>
...@@ -74,13 +94,19 @@ export default { ...@@ -74,13 +94,19 @@ export default {
}; };
}, },
methods: { methods: {
toList() {
const { activityId } = this.$route.query || '';
if (activityId) {
this.$router.push({ name: 'groupBuyList', query: { activityId } });
}
},
shareTo() { shareTo() {
// 邀请好友 // 邀请好友
this.$emit('share'); this.$emit('share');
}, },
createOrJoin(mark) { createOrJoin(mark) {
// 参团 // 参团
// mark 1-> 开团 0-> 参团 2->自己做团长 // mark 1-> 开团 3-> 参团 2->自己做团长
this.$emit('buy', mark); this.$emit('buy', mark);
} }
} }
......
...@@ -73,12 +73,10 @@ export default { ...@@ -73,12 +73,10 @@ 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 (this.groupInfo.groupBuyStatus == 1) { if (item.intersectionRatio == 0) {
if (item.intersectionRatio == 0) { this.$emit('changeButtonVisible', true);
this.$emit('changeButtonVisible', true); } else {
} else { this.$emit('changeButtonVisible', false);
this.$emit('changeButtonVisible', false);
}
} }
}); });
}); });
......
...@@ -185,6 +185,7 @@ ...@@ -185,6 +185,7 @@
type="shoppingCar" type="shoppingCar"
:disabled="false" :disabled="false"
:group-id="groupId" :group-id="groupId"
:info="detailInfo.groupBuyInfo || {}"
@buy="goVccOrDetail" @buy="goVccOrDetail"
/> />
</div> </div>
...@@ -314,7 +315,7 @@ export default { ...@@ -314,7 +315,7 @@ export default {
activityPrice: this.detailInfo.activityPrice, // y activityPrice: this.detailInfo.activityPrice, // y
skuNo: this.detailParam.skuNo, skuNo: this.detailParam.skuNo,
peoplePhotoList: avatorList, peoplePhotoList: avatorList,
endTime: this.detailInfo.endTime || '' endTime: this.detailInfo?.groupBuyInfo.currentGroupEndTime || this.detailInfo?.endTime || ''
}; };
EventBus.$emit('goods_share_info', { EventBus.$emit('goods_share_info', {
shareInfo: sharePicData, shareInfo: sharePicData,
...@@ -326,8 +327,13 @@ export default { ...@@ -326,8 +327,13 @@ export default {
}, },
// ka渠道逻辑 // ka渠道逻辑
goVccOrDetail(res) { goVccOrDetail(res) {
if (!res) {
this.currentPopupType = '';
this.currentPopupName = '';
return;
}
const buttonNameMap = { const buttonNameMap = {
0: '立即参团', 3: '立即参团',
1: '立即开团', 1: '立即开团',
2: '自己做团长' 2: '自己做团长'
}; };
...@@ -373,20 +379,17 @@ export default { ...@@ -373,20 +379,17 @@ export default {
}, },
async init(detailParam) { async init(detailParam) {
const [res] = await goods.detailInfo(detailParam); const [res] = await goods.detailInfo(detailParam);
// canJoinGroupBuyAgain groupStatus
try { try {
if (res.groupBuyInfo?.groupId) {
localStorage.set('groupBuyGroupId', res.groupBuyInfo.groupId || ''); // 设置groupBuyGroupId,用于下单
this.groupId = +res.groupBuyInfo.groupId || 0;
}
if (res.groupBuyInfo?.joinGroup) {
const query = { ...this.$route.query };
return this.$router.replace({ name: 'groupBuySkuInfoSmallPic', query });
}
this.imgList = res.imageUrl || []; this.imgList = res.imageUrl || [];
this.detailInfo = res; this.detailInfo = res;
this.setStartStatus(res); this.setStartStatus(res);
this.showPage = true; this.showPage = true;
try { try {
this.detailInfo.contentDetailUrl = this.detailInfo.contentDetailUrl.replace(
'http://',
'https://'
);
const detailImages = await goods.getDetailPic(this.detailInfo.contentDetailUrl); const detailImages = await goods.getDetailPic(this.detailInfo.contentDetailUrl);
// const imgReg = new RegExp('(?<=src=").[^"]*', 'g'); // const imgReg = new RegExp('(?<=src=").[^"]*', 'g');
// this.detailImgList = (detailImages || '').match(imgReg); // this.detailImgList = (detailImages || '').match(imgReg);
......
...@@ -78,6 +78,7 @@ ...@@ -78,6 +78,7 @@
box-sizing: border-box; box-sizing: border-box;
font-size: 16px; font-size: 16px;
padding: 0 @padding-sd 60px; padding: 0 @padding-sd 60px;
overflow: hidden;
} }
// 头像组、团购规则等 // 头像组、团购规则等
&-product-info{ &-product-info{
......
...@@ -190,7 +190,7 @@ export default { ...@@ -190,7 +190,7 @@ export default {
activityPrice: this.detailInfo.activityPrice, // y activityPrice: this.detailInfo.activityPrice, // y
skuNo: this.detailParam.skuNo, skuNo: this.detailParam.skuNo,
peoplePhotoList: avatorList, peoplePhotoList: avatorList,
endTime: this.detailInfo.endTime || '' endTime: this.detailInfo?.groupBuyInfo.currentGroupEndTime || this.detailInfo?.endTime || ''
}; };
EventBus.$emit('goods_share_info', { EventBus.$emit('goods_share_info', {
shareInfo: sharePicData, shareInfo: sharePicData,
......
...@@ -15,8 +15,8 @@ export default { ...@@ -15,8 +15,8 @@ export default {
title: 'aaaa', title: 'aaaa',
desc: 'bbbb', desc: 'bbbb',
link: `https://www.baidu.com`, // 页面地址 link: `https://www.baidu.com`, // 页面地址
imgUrl: 'http://kdspstatic.q-gp.com/FnPUaThQoK23qZjhXTG9C8XopI4y', // 图片地址 imgUrl: 'https://kdspstatic.q-gp.com/FnPUaThQoK23qZjhXTG9C8XopI4y', // 图片地址
posterUrl: 'http://kdspstatic.q-gp.com/FnPUaThQoK23qZjhXTG9C8XopI4y' // 海报地址 posterUrl: 'https://kdspstatic.q-gp.com/FnPUaThQoK23qZjhXTG9C8XopI4y' // 海报地址
} }
} }
}; };
......
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