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 133 additions and 27 deletions
components/modules-vertical/shopBox/index.vue
......@@ -42,7 +42,7 @@ export default {
methods: {
_enterMarket(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 {
border: 0.01rem solid #feebf1;
font-size: 0.12rem;
color: #e9355f;
transform: scale(0.8);
}
}
.btn {
......
components/modules/menuBox/list.vue
<template>
<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-wrapper">
<div class="swiper-slide" v-for="(item, index) in menuList" :key="index">
......@@ -13,7 +16,7 @@
<invite-box></invite-box>
</template>
<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 v-else-if="item.menuType == 'coupon'">
<coupon-box></coupon-box>
......@@ -47,6 +50,7 @@ const reportBox = resolve => require(['./menuClass/report'], resolve);
const chatBox = resolve => require(['./menuClass/chat'], resolve);
const iframeLine = resolve => require(['./menuClass/iframeLine'], resolve);
const empty404 = resolve => require(['./menuClass/404'], resolve);
const shopHot = resolve => require(['./menuClass/shop/hot'], resolve);
export default {
name: 'menu-list',
......@@ -59,7 +63,8 @@ export default {
reportBox,
chatBox,
iframeLine,
empty404
empty404,
shopHot
},
props: {
value: {}
......@@ -74,6 +79,7 @@ export default {
...mapGetters({
menuList: 'menuList',
drainage: 'drainage',
caseInfo: 'caseInfo',
}),
isShowChat() {
let index = -1;
......@@ -144,13 +150,20 @@ export default {
</script>
<style lang="less" scoped>
.shop-hot-box {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.wrapper {
width: 100%;
height: 100%;
background: var(--menu-bg) no-repeat center center;
background-size: cover;
overflow: hidden;
position: relative;
.swiper-container {
height: 100%;
overflow: visible;
......
components/modules/menuBox/menuClass/shop.vue
<template>
<div class="shop">
<shop-list :menuId="menuId"></shop-list>
<div class="shop-hot-box" v-transfer-dom="'#menu-list-box'">
<div class="shop" :style="{height: showList ? '100%' : ''}">
<shop-list :menuId="menuId" v-show="showList"></shop-list>
<div class="shop-hot-box" v-transfer-dom="'#menu-list-box'" v-if="showHot">
<shop-hot :menuId="menuId"></shop-hot>
</div>
</div>
......@@ -17,7 +17,15 @@ export default {
shopHot
},
props: {
menuId: {}
menuId: {},
showList: {
type: Boolean,
default: false
},
showHot: {
type: Boolean,
default: false
}
},
data() {
return {
......@@ -30,7 +38,6 @@ export default {
<style lang="less" scoped>
.shop {
position: relative;
height: 100%;
}
.shop-hot-box {
position: absolute;
......
components/modules/menuBox/menuClass/shop/hot.vue
......@@ -12,8 +12,12 @@
</div>
</div>
<div class="price-box">
<span class="price">￥{{ info.price }}</span>
<span class="shop_price" v-if="info.shop_price">￥{{ info.shop_price }}</span>
<div class="icon">￥</div>
<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 class="pay">
......@@ -53,6 +57,7 @@ export default {
},
methods: {
async getRecommendGoods() {
if (this.menuId) {
const res = await getRecommendGoods({
includeId: this.menuId,
uin: this.channelInfo.uin,
......@@ -64,6 +69,7 @@ export default {
}
} else {
this.$layer.msg(res.errorMessage);
}
}
const topRes = await getTopGoodsInfo({
includeId: this.channelInfo.id,
......@@ -191,11 +197,25 @@ export default {
flex: 0 0 auto;
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 {
color: #e9355f;
font-size: 0.14rem;
}
.shop_price {
.icon {
color: #999999;
font-size: 0.11rem;
margin-right: -.06rem;
transform: scale(0.8);
display: inline-block;
}
text-decoration: line-through;
color: #999999;
font-size: 0.11rem;
......
components/modules/menuBox/menuClass/shop/index.vue
......@@ -16,8 +16,13 @@
</div>
</div>
<div class="price-box">
<span class="price">￥{{ item.price }}</span>
<span class="shop_price" v-if="item.shop_price">￥{{ item.shop_price }}</span>
<span class="price">
<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 class="pay">
......@@ -97,14 +102,16 @@ export default {
},
},
mounted() {
this.getList();
this.$Bus.$on('bus-editShop', this.editShop);
this.$Bus.$on('bus-deleteShop', this.deleteShop);
this.$Bus.$on('bus-addShopBind', this.addShopBind);
this.$Bus.$on('bus-cancelShopBind', this.cancelShopBind);
this.$Bus.$on('bus-changeSort', this.changeSort);
this.$Bus.$on('bus-buyShop', this._showDetails);
},
if (this.menuId){
this.getList();
this.$Bus.$on('bus-editShop', this.editShop);
this.$Bus.$on('bus-deleteShop', this.deleteShop);
this.$Bus.$on('bus-addShopBind', this.addShopBind);
this.$Bus.$on('bus-cancelShopBind', this.cancelShopBind);
this.$Bus.$on('bus-changeSort', this.changeSort);
this.$Bus.$on('bus-buyShop', this._showDetails);
}
},
methods: {
getMore() {
const shopContainerTop = this.$refs.shopContainer && this.$refs.shopContainer.scrollTop;
......@@ -192,11 +199,10 @@ export default {
this.goodsId = null;
this.sourceType = null;
this.sourceContent = null;
console.log(obj)
if (obj.type === 1) {
this.goodsId = obj.id;
if (obj.market) {
if (this.caseInfo.state === 0){
if (this.caseInfo.status === 0){
this.$layer.msg('橱窗已关闭');
return
}
......@@ -290,13 +296,14 @@ export default {
.tag {
display: inline-block;
width: 0.32rem;
height: 0.15rem;
line-height: 0.15rem;
height: 0.16rem;
line-height: 0.16rem;
border-radius: 0.02rem;
border: 0.01rem solid #ffd9cb;
text-align: center;
font-size: 0.1rem;
color: #ff4802;
transform: scale(0.9);
}
}
.price-box {
......@@ -305,10 +312,24 @@ export default {
line-height: 0.22rem;
font-weight: bold;
.price {
.icon {
color: #ff4802;
font-size: 0.14rem;
transform: scale(0.8);
display: inline-block;
margin-right: -0.06rem;
}
color: #ff4802;
font-size: 0.14rem;
}
.shop_price {
.icon {
color: #999999;
font-size: 0.1rem;
transform: scale(0.8);
display: inline-block;
margin-right: -0.06rem;
}
margin-left: 0.05rem;
text-decoration: line-through;
color: #999999;
......
components/shop/details/payment.vue
......@@ -109,6 +109,7 @@ export default {
},
mounted() {
this.get_addressList();
this.$Bus.$on('bus-goPay', this.goPay);
},
methods: {
async get_addressList() {
......@@ -138,6 +139,10 @@ export default {
payType: 1
});
if (res.code === 200 && res.errorCode === 0) {
this.goPay(res)
}
},
goPay(res) {
const { tradeType, prepayInfo } = res.data;
const { uin } = this.channelInfo;
const DEF_SITE = process.client
......@@ -159,7 +164,6 @@ export default {
} else {
this.$layer.msg('网络错误，请稍后重试！');
}
}
}
},
watch: {
......
components/showcase/marketFrame.vue
......@@ -4,7 +4,7 @@
<div class="mask" @click="_close"></div>
<div class="box" @click.stop>
<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%"
height="100%"
/>
......@@ -34,6 +34,10 @@ export default {
return this.value;
},
set(nVal) {
if (!nVal) {
console.log('关闭商城')
window.removeEventListener('message', this.switchPostMessage, false)
}
this.$emit('input', nVal);
}
},
......@@ -49,7 +53,43 @@ export default {
_close() {
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>
......
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