Skip to content

broadcast_cloud / web-live

Go to a project
Commit 4bdb3445 by MichaelJier
Options

faeture 

1. 增加postMessage与商城通信
2. 修复商品置顶和商城置顶冲突的情况
3. 修复竖屏直播下打开商品的问题
parent 45363ca8
Showing with 124 additions and 18 deletions
components/modules-vertical/shopBox/index.vue
...@@ -42,7 +42,7 @@ export default { ...@@ -42,7 +42,7 @@ export default {
methods: { methods: {
_enterMarket(url) { _enterMarket(url) {
this.marketSrc = url this.marketSrc = url
this.show = !this.show this.isShow = !this.isShow
}, },
} }
}; };
......
components/modules-vertical/shopBox/shopHot/index.vue
...@@ -209,6 +209,7 @@ export default { ...@@ -209,6 +209,7 @@ export default {
border: 0.01rem solid #feebf1; border: 0.01rem solid #feebf1;
font-size: 0.12rem; font-size: 0.12rem;
color: #e9355f; color: #e9355f;
transform: scale(0.8);
} }
} }
.btn { .btn {
......
components/modules/menuBox/list.vue
<template> <template>
<div class="wrapper"> <div class="wrapper">
<div class="shop-hot-box" v-transfer-dom="'#menu-list-box'" v-if="menuList.every(item => item.menuInfo !== 'shop' ) && caseInfo.status">
<shop-box :showHot="!!caseInfo.status"></shop-box>
</div>
<div class="swiper-container" ref="swiper"> <div class="swiper-container" ref="swiper">
<div class="swiper-wrapper"> <div class="swiper-wrapper">
<div class="swiper-slide" v-for="(item, index) in menuList" :key="index"> <div class="swiper-slide" v-for="(item, index) in menuList" :key="index">
...@@ -13,7 +16,7 @@ ...@@ -13,7 +16,7 @@
<invite-box></invite-box> <invite-box></invite-box>
</template> </template>
<template v-else-if="item.menuType == 'shop'"> <template v-else-if="item.menuType == 'shop'">
<shop-box :menuId="item.id"></shop-box> <shop-box :menuId="item.id" :showHot="!caseInfo.status" :showList="true"></shop-box>
</template> </template>
<template v-else-if="item.menuType == 'coupon'"> <template v-else-if="item.menuType == 'coupon'">
<coupon-box></coupon-box> <coupon-box></coupon-box>
...@@ -47,6 +50,7 @@ const reportBox = resolve => require(['./menuClass/report'], resolve); ...@@ -47,6 +50,7 @@ const reportBox = resolve => require(['./menuClass/report'], resolve);
const chatBox = resolve => require(['./menuClass/chat'], resolve); const chatBox = resolve => require(['./menuClass/chat'], resolve);
const iframeLine = resolve => require(['./menuClass/iframeLine'], resolve); const iframeLine = resolve => require(['./menuClass/iframeLine'], resolve);
const empty404 = resolve => require(['./menuClass/404'], resolve); const empty404 = resolve => require(['./menuClass/404'], resolve);
const shopHot = resolve => require(['./menuClass/shop/hot'], resolve);
export default { export default {
name: 'menu-list', name: 'menu-list',
...@@ -59,7 +63,8 @@ export default { ...@@ -59,7 +63,8 @@ export default {
reportBox, reportBox,
chatBox, chatBox,
iframeLine, iframeLine,
empty404 empty404,
shopHot
}, },
props: { props: {
value: {} value: {}
...@@ -74,6 +79,7 @@ export default { ...@@ -74,6 +79,7 @@ export default {
...mapGetters({ ...mapGetters({
menuList: 'menuList', menuList: 'menuList',
drainage: 'drainage', drainage: 'drainage',
caseInfo: 'caseInfo',
}), }),
isShowChat() { isShowChat() {
let index = -1; let index = -1;
...@@ -144,12 +150,19 @@ export default { ...@@ -144,12 +150,19 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.shop-hot-box {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.wrapper { .wrapper {
width: 100%; width: 100%;
height: 100%; height: 100%;
background: var(--menu-bg) no-repeat center center; background: var(--menu-bg) no-repeat center center;
background-size: cover; background-size: cover;
overflow: hidden; overflow: hidden;
position: relative;
.swiper-container { .swiper-container {
height: 100%; height: 100%;
......
components/modules/menuBox/menuClass/shop.vue
<template> <template>
<div class="shop"> <div class="shop" :style="{height: showList ? '100%' : ''}">
<shop-list :menuId="menuId"></shop-list> <shop-list :menuId="menuId" v-show="showList"></shop-list>
<div class="shop-hot-box" v-transfer-dom="'#menu-list-box'"> <div class="shop-hot-box" v-transfer-dom="'#menu-list-box'" v-if="showHot">
<shop-hot :menuId="menuId"></shop-hot> <shop-hot :menuId="menuId"></shop-hot>
</div> </div>
</div> </div>
...@@ -17,7 +17,15 @@ export default { ...@@ -17,7 +17,15 @@ export default {
shopHot shopHot
}, },
props: { props: {
menuId: {} menuId: {},
showList: {
type: Boolean,
default: false
},
showHot: {
type: Boolean,
default: false
}
}, },
data() { data() {
return { return {
...@@ -30,7 +38,6 @@ export default { ...@@ -30,7 +38,6 @@ export default {
<style lang="less" scoped> <style lang="less" scoped>
.shop { .shop {
position: relative; position: relative;
height: 100%;
} }
.shop-hot-box { .shop-hot-box {
position: absolute; position: absolute;
......
components/modules/menuBox/menuClass/shop/hot.vue
...@@ -12,8 +12,12 @@ ...@@ -12,8 +12,12 @@
</div> </div>
</div> </div>
<div class="price-box"> <div class="price-box">
<span class="price">￥{{ info.price }}</span> <div class="icon">￥</div>
<span class="shop_price" v-if="info.shop_price">￥{{ info.shop_price }}</span> <span class="price">{{ info.price }}</span>
<span class="shop_price" v-if="info.shop_price">
<div class="icon">￥</div>
{{ info.shop_price }}
</span>
</div> </div>
</div> </div>
<div class="pay"> <div class="pay">
...@@ -53,6 +57,7 @@ export default { ...@@ -53,6 +57,7 @@ export default {
}, },
methods: { methods: {
async getRecommendGoods() { async getRecommendGoods() {
if (this.menuId) {
const res = await getRecommendGoods({ const res = await getRecommendGoods({
includeId: this.menuId, includeId: this.menuId,
uin: this.channelInfo.uin, uin: this.channelInfo.uin,
...@@ -65,6 +70,7 @@ export default { ...@@ -65,6 +70,7 @@ export default {
} else { } else {
this.$layer.msg(res.errorMessage); this.$layer.msg(res.errorMessage);
} }
}
const topRes = await getTopGoodsInfo({ const topRes = await getTopGoodsInfo({
includeId: this.channelInfo.id, includeId: this.channelInfo.id,
uin: this.channelInfo.uin, uin: this.channelInfo.uin,
...@@ -191,11 +197,25 @@ export default { ...@@ -191,11 +197,25 @@ export default {
flex: 0 0 auto; flex: 0 0 auto;
height: 0.2rem; height: 0.2rem;
line-height: 0.2rem; line-height: 0.2rem;
.icon {
color: #e9355f;
font-size: 0.14rem;
margin-right: -.06rem;
transform: scale(0.8);
display: inline-block;
}
.price { .price {
color: #e9355f; color: #e9355f;
font-size: 0.14rem; font-size: 0.14rem;
} }
.shop_price { .shop_price {
.icon {
color: #999999;
font-size: 0.11rem;
margin-right: -.06rem;
transform: scale(0.8);
display: inline-block;
}
text-decoration: line-through; text-decoration: line-through;
color: #999999; color: #999999;
font-size: 0.11rem; font-size: 0.11rem;
......
components/modules/menuBox/menuClass/shop/index.vue
...@@ -16,8 +16,13 @@ ...@@ -16,8 +16,13 @@
</div> </div>
</div> </div>
<div class="price-box"> <div class="price-box">
<span class="price">￥{{ item.price }}</span> <span class="price">
<span class="shop_price" v-if="item.shop_price">￥{{ item.shop_price }}</span> <div class="icon">￥</div>
{{ item.price }}</span>
<span class="shop_price" v-if="item.shop_price">
<div class="icon">￥</div>
{{ item.shop_price }}
</span>
</div> </div>
</div> </div>
<div class="pay"> <div class="pay">
...@@ -97,6 +102,7 @@ export default { ...@@ -97,6 +102,7 @@ export default {
}, },
}, },
mounted() { mounted() {
if (this.menuId){
this.getList(); this.getList();
this.$Bus.$on('bus-editShop', this.editShop); this.$Bus.$on('bus-editShop', this.editShop);
this.$Bus.$on('bus-deleteShop', this.deleteShop); this.$Bus.$on('bus-deleteShop', this.deleteShop);
...@@ -104,6 +110,7 @@ export default { ...@@ -104,6 +110,7 @@ export default {
this.$Bus.$on('bus-cancelShopBind', this.cancelShopBind); this.$Bus.$on('bus-cancelShopBind', this.cancelShopBind);
this.$Bus.$on('bus-changeSort', this.changeSort); this.$Bus.$on('bus-changeSort', this.changeSort);
this.$Bus.$on('bus-buyShop', this._showDetails); this.$Bus.$on('bus-buyShop', this._showDetails);
}
}, },
methods: { methods: {
getMore() { getMore() {
...@@ -192,11 +199,10 @@ export default { ...@@ -192,11 +199,10 @@ export default {
this.goodsId = null; this.goodsId = null;
this.sourceType = null; this.sourceType = null;
this.sourceContent = null; this.sourceContent = null;
console.log(obj)
if (obj.type === 1) { if (obj.type === 1) {
this.goodsId = obj.id; this.goodsId = obj.id;
if (obj.market) { if (obj.market) {
if (this.caseInfo.state === 0){ if (this.caseInfo.status === 0){
this.$layer.msg('橱窗已关闭'); this.$layer.msg('橱窗已关闭');
return return
} }
...@@ -290,13 +296,14 @@ export default { ...@@ -290,13 +296,14 @@ export default {
.tag { .tag {
display: inline-block; display: inline-block;
width: 0.32rem; width: 0.32rem;
height: 0.15rem; height: 0.16rem;
line-height: 0.15rem; line-height: 0.16rem;
border-radius: 0.02rem; border-radius: 0.02rem;
border: 0.01rem solid #ffd9cb; border: 0.01rem solid #ffd9cb;
text-align: center; text-align: center;
font-size: 0.1rem; font-size: 0.1rem;
color: #ff4802; color: #ff4802;
transform: scale(0.9);
} }
} }
.price-box { .price-box {
...@@ -305,10 +312,24 @@ export default { ...@@ -305,10 +312,24 @@ export default {
line-height: 0.22rem; line-height: 0.22rem;
font-weight: bold; font-weight: bold;
.price { .price {
.icon {
color: #ff4802;
font-size: 0.14rem;
transform: scale(0.8);
display: inline-block;
margin-right: -0.06rem;
}
color: #ff4802; color: #ff4802;
font-size: 0.14rem; font-size: 0.14rem;
} }
.shop_price { .shop_price {
.icon {
color: #999999;
font-size: 0.1rem;
transform: scale(0.8);
display: inline-block;
margin-right: -0.06rem;
}
margin-left: 0.05rem; margin-left: 0.05rem;
text-decoration: line-through; text-decoration: line-through;
color: #999999; color: #999999;
......
components/shop/details/payment.vue
...@@ -109,6 +109,7 @@ export default { ...@@ -109,6 +109,7 @@ export default {
}, },
mounted() { mounted() {
this.get_addressList(); this.get_addressList();
this.$Bus.$on('bus-goPay', this.goPay);
}, },
methods: { methods: {
async get_addressList() { async get_addressList() {
...@@ -138,6 +139,10 @@ export default { ...@@ -138,6 +139,10 @@ export default {
payType: 1 payType: 1
}); });
if (res.code === 200 && res.errorCode === 0) { if (res.code === 200 && res.errorCode === 0) {
this.goPay(res)
}
},
goPay(res) {
const { tradeType, prepayInfo } = res.data; const { tradeType, prepayInfo } = res.data;
const { uin } = this.channelInfo; const { uin } = this.channelInfo;
const DEF_SITE = process.client const DEF_SITE = process.client
...@@ -160,7 +165,6 @@ export default { ...@@ -160,7 +165,6 @@ export default {
this.$layer.msg('网络错误，请稍后重试！'); this.$layer.msg('网络错误，请稍后重试！');
} }
} }
}
}, },
watch: { watch: {
changeAddressInfo() { changeAddressInfo() {
......
components/showcase/marketFrame.vue
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<div class="mask" @click="_close"></div> <div class="mask" @click="_close"></div>
<div class="box" @click.stop> <div class="box" @click.stop>
<iframe <iframe
:src="marketSrc ? `${DEF_SITE}/shop${marketSrc}` : `${DEF_SITE}/shop/showcase?uin=${channelInfo.uin}/&caseId=${caseInfo.caseId}`" :src="marketSrc ? `${DEF_SITE}/shop${marketSrc}` : `${DEF_SITE}/shop/showcase?uin=${channelInfo.uin}&caseId=${caseInfo.caseId}`"
width="100%" width="100%"
height="100%" height="100%"
/> />
...@@ -34,6 +34,10 @@ export default { ...@@ -34,6 +34,10 @@ export default {
return this.value; return this.value;
}, },
set(nVal) { set(nVal) {
if (!nVal) {
console.log('关闭商城')
window.removeEventListener('message', this.switchPostMessage, false)
}
this.$emit('input', nVal); this.$emit('input', nVal);
} }
}, },
...@@ -49,7 +53,43 @@ export default { ...@@ -49,7 +53,43 @@ export default {
_close() { _close() {
this.isShow = false; this.isShow = false;
}, },
switchPostMessage(message) {
if (!message.cmd) return
if (!this[message.cmd]) return
this[message.cmd](message.data)
},
parentLogin() {
this.$Bus.$emit('bus-showLogin', true);
},
sourceLinkShop(sourceContent) {
this.$Bus.$emit('bus-buyShop', {
type: 2,
source: 2,
sourceContent
});
},
sourceCommandShop(sourceContent) {
this.$Bus.$emit('bus-buyShop', {
type: 2,
source: 1,
sourceContent
});
},
payShop(res) {
this.$Bus.$emit('bus-goPay', res);
}, },
goMarket() {
window.location.href = `${this.DEF_SITE}/shop/home?uin=${this.channelInfo.uin}`
}
},
watch: {
value(newVal) {
if (newVal){
console.log('开启商城')
window.addEventListener('message', this.switchPostMessage, false)
}
}
}
}; };
</script> </script>
......
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 sign in to comment