Skip to content

broadcast_cloud / web-live

Go to a project
Commit b6a34ec2 by MichaelJier
Options

Merge branch 'test' into feature/feature_redPacketRain_v1.2.0

parents 76403b7d 579d9c7f
Showing with 36 additions and 40 deletions
components/modules-vertical/footerBox/index.vue
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<div class="send-box" v-show="!isInput"> <div class="send-box" v-show="!isInput">
<send-box></send-box> <send-box></send-box>
</div> </div>
<div class="shop-box" v-show="!isInput" v-if="caseInfo && caseInfo.status"> <div class="shop-box" v-show="!isInput" v-if="isShop || (caseInfo && !!caseInfo.status)" >
<shop-box></shop-box> <shop-box></shop-box>
</div> </div>
<div class="more-box" v-show="!isInput"> <div class="more-box" v-show="!isInput">
......
components/modules-vertical/shopBox/index.vue
<template> <template>
<div class="shop"> <div class="shop">
<div class="btn"> <div class="btn">
<showcase @enterMarket="_enterMarket"/> <showcase @enterMarket="_enterMarket" v-if="caseInfo.status"/>
<div class="icon" @click.stop="_enterMarket('')"></div> <div class="icon" @click.stop="_enterMarket('')"></div>
</div> </div>
<market-frame v-model="isShow" :marketSrc="marketSrc"/> <market-frame v-model="isShow" :marketSrc="marketSrc" v-if="caseInfo.status"/>
<!-- <transition name="move-bottom"> <transition name="move-bottom">
<div class="shop-mask" v-transfer-dom v-show="isShow"> <div class="shop-mask" v-transfer-dom v-show="isShow" v-if="!caseInfo.status">
<div class="mask" @click="isShow = false"></div> <div class="mask" @click="isShow = false"></div>
<div class="box"> <div class="box">
<shop-list v-model="isShow"></shop-list> <shop-list v-model="isShow"></shop-list>
</div> </div>
</div> </div>
</transition> --> </transition>
<!-- <div class="shop-hot-box"> <div class="shop-hot-box" v-if="!caseInfo.status">
<shop-hot></shop-hot> <shop-hot></shop-hot>
</div> --> </div>
</div> </div>
</template> </template>
<script> <script>
import { mapGetters } from 'vuex'; import { mapGetters } from 'vuex';
import showcase from '@/components/showcase/index.vue'; import showcase from '@/components/showcase/index.vue';
import marketFrame from '@/components/showcase/marketFrame.vue'; import marketFrame from '@/components/showcase/marketFrame.vue';
import shopList from './shopList/index';
import shopHot from './shopHot/index';
export default { export default {
name: 'vertical-shop-box', name: 'vertical-shop-box',
components: { components: {
showcase, showcase,
shopHot,
shopList,
marketFrame marketFrame
}, },
data() { data() {
...@@ -36,7 +40,8 @@ export default { ...@@ -36,7 +40,8 @@ export default {
}, },
computed: { computed: {
...mapGetters({ ...mapGetters({
userInfo: 'userInfo' userInfo: 'userInfo',
caseInfo: 'caseInfo'
}), }),
}, },
methods: { methods: {
......
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"> <div class="shop-hot-box" v-if="menuList.every(item => item.menuInfo !== 'shop' ) && caseInfo.status">
<shop-box :showHot="!!caseInfo.status" :isMarket="true"></shop-box> <shop-box :showHot="!!caseInfo.status" :isMarket="true"></shop-box>
</div> </div>
<div class="swiper-container" ref="swiper"> <div class="swiper-container" ref="swiper">
...@@ -64,7 +64,6 @@ export default { ...@@ -64,7 +64,6 @@ export default {
chatBox, chatBox,
iframeLine, iframeLine,
empty404, empty404,
shopHot
}, },
props: { props: {
value: {} value: {}
......
components/modules/menuBox/menuClass/shop.vue
...@@ -35,6 +35,9 @@ export default { ...@@ -35,6 +35,9 @@ export default {
return { return {
info: {} info: {}
}; };
},
destroyed() {
} }
}; };
</script> </script>
......
components/modules/redBox/default/index.vue
...@@ -130,15 +130,6 @@ export default { ...@@ -130,15 +130,6 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fade-enter,.fade-leave-to{
opacity: 0;
}
.fade-enter-to,.fade-leave{
opacity: 1;
}
.fade-enter-active,.fade-leave-active{
transition: opacity .6s cubic-bezier(0,0,0.58,1);
}
.default { .default {
position: fixed; position: fixed;
......
components/modules/redBox/index.vue
...@@ -122,23 +122,6 @@ export default { ...@@ -122,23 +122,6 @@ export default {
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.fade-enter,.fade-leave-to{
// max-width: 0;
// max-height: 0;
// margin-top: 50vh;
// margin-left: 50vw;
opacity: 0;
}
.fade-enter-to,.fade-leave{
// max-width: 100vw;
// max-height: 100vh;
// margin-left: 0;
// margin-top: 0;
opacity: 1;
}
.fade-enter-active,.fade-leave-active{
transition: all .6s cubic-bezier(0,0,0.58,1);
}
.red-box { .red-box {
position: absolute; position: absolute;
top: 0; top: 0;
......
components/showcase/index.vue
<template> <template>
<div> <div>
<div class="case-box" v-if="caseInfo.goodsInfo.id"> <div class="case-box" v-if="caseInfo.goodsInfo.id" :style="{bottom: !(open || !isClose) ?'0.495rem' : '0.4rem'}">
<div class="goods" :style="{transform: open ? 'unset' : 'translate3d(0, 120%, 0)'}" @click="_enterMarket"> <div class="goods" :style="{transform: (open && !isClose) ? 'unset' : 'translate3d(0, 120%, 0)', display: (open || !isClose) ? 'block' : 'none'}" @click="_enterMarket">
<div class="image-box"> <div class="image-box">
<div class="image" :style="{backgroundImage: `url(${ caseInfo.goodsInfo.real_img[0] })`}"/> <div class="image" :style="{backgroundImage: `url(${ caseInfo.goodsInfo.real_img[0] })`}"/>
<div class="state"> <div class="state">
...@@ -54,7 +54,8 @@ export default { ...@@ -54,7 +54,8 @@ export default {
data() { data() {
return { return {
open: true, open: true,
isShow: false isShow: false,
isClose: false
} }
}, },
computed: { computed: {
...@@ -74,6 +75,20 @@ export default { ...@@ -74,6 +75,20 @@ export default {
this.$emit('enterMarket', `/showcase?uin=${this.channelInfo.uin}&caseId=${this.caseInfo.caseId}&goodsId=${this.caseInfo.goodsInfo ? this.caseInfo.goodsInfo.id : ''}`) this.$emit('enterMarket', `/showcase?uin=${this.channelInfo.uin}&caseId=${this.caseInfo.caseId}&goodsId=${this.caseInfo.goodsInfo ? this.caseInfo.goodsInfo.id : ''}`)
} }
} }
},
watch: {
open(newVal) {
if (newVal) {
setTimeout(() => {
this.isClose = !newVal
})
} else {
setTimeout(() => {
this.isClose = !newVal
}, 300)
}
}
} }
} }
</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