Skip to content

broadcast_cloud / web-live

Go to a project
Commit 6a44b674 by MichaelJier
Options

feature 

1. 升级svgaplayer-for-live
2. 重置礼物倒计时
3. 美化
parent fdbb074f
Showing with 64 additions and 72 deletions
components/modules-vertical/chatBox/chat/chatItem/chatRewardGift.vue
......@@ -6,7 +6,7 @@
赠送的
<img :src="giftImg" />
{{ gift.name }}
<em>* {{ gift.num }}</em>
<em>x {{ gift.num }}</em>
</div>
</div>
</template>
......
components/modules-vertical/chatBox/index.vue
......@@ -40,7 +40,9 @@ export default {
mounted() {
this.$nextTick(() => {
const player = require('@gdyfe/svgaplayer-for-live')
this.SVGAPlayer = new player.default('#svgaBox');
this.SVGAPlayer = player.default({
target: '#svgaBox'
});
this.$Bus.$on('bus-playsvga', this.playsvga);
// setTimeout(() => {
// this.playsvga([{
......@@ -60,15 +62,15 @@ export default {
playsvga(url){
if (!this.SVGAPlayer) return
this.showSVAG = true
this.SVGAPlayer.enqueue([url])
this.SVGAPlayer.endCallback = () => {
this.SVGAPlayer.enqueue(url)
this.SVGAPlayer.$on('end',(info) => {
this.$Bus.$emit('bus-setGiftBannerInfo', null);
this.showSVAG = false
}
this.SVGAPlayer.startCallback = (info) => {
})
this.SVGAPlayer.$on('start',(info) => {
this.$Bus.$emit('bus-setGiftBannerInfo', info);
this.showSVAG = true
}
})
},
},
watch: {
......@@ -76,7 +78,9 @@ export default {
if (newVal) {
console.log('初始化svgaplayer')
const player = require('@gdyfe/svgaplayer-for-live')
this.SVGAPlayer = new player.default('#svgaBox');
this.SVGAPlayer = player.default({
target: '#svgaBox'
});
} else {
this.SVGAPlayer.destroyed()
this.SVGAPlayer = null
......
components/modules-vertical/giftRollBox/index.vue
......@@ -86,8 +86,8 @@ export default {
align-items: center;
margin-bottom: 0.1rem;
padding: 0.01rem;
height: 0.32rem;
border-radius: 0.32rem;
height: 0.35rem;
border-radius: 0.35rem;
background: rgba(0, 0, 0, 0.3);
&.gift {
.head {
......@@ -95,6 +95,7 @@ export default {
height: 0.3rem;
border-radius: 100%;
overflow: hidden;
margin-left: 0.02rem;
img {
display: block;
width: 100%;
......@@ -102,7 +103,7 @@ export default {
}
}
.info {
margin: 0 0.08rem;
margin: 0 0.08rem 0.02rem 0.08rem;
.name {
line-height: 0.2rem;
font-size: 0.11rem;
......
components/modules/menuBox/list.vue
......@@ -105,7 +105,9 @@ export default {
mounted() {
this.$nextTick(() => {
const player = require('@gdyfe/svgaplayer-for-live')
this.SVGAPlayer = new player.default('#svgaBox');
this.SVGAPlayer = player.default({
target: '#svgaBox'
});
this.$Bus.$on('bus-playsvga', this.playsvga);
this._initSwiper();
// setTimeout(() => {
......@@ -126,15 +128,15 @@ export default {
playsvga(url){
if (!this.SVGAPlayer) return
this.showSVAG = true
this.SVGAPlayer.enqueue([url])
this.SVGAPlayer.endCallback = () => {
this.SVGAPlayer.enqueue(url)
this.SVGAPlayer.$on('end',(info) => {
this.$Bus.$emit('bus-setGiftBannerInfo', null);
this.showSVAG = false
}
this.SVGAPlayer.startCallback = (info) => {
})
this.SVGAPlayer.$on('start',(info) => {
this.$Bus.$emit('bus-setGiftBannerInfo', info);
this.showSVAG = true
}
})
},
_initSwiper() {
const self = this;
......@@ -187,7 +189,9 @@ export default {
if (newVal) {
console.log('初始化svgaplayer')
const player = require('@gdyfe/svgaplayer-for-live')
this.SVGAPlayer = new player.default('#svgaBox');
this.SVGAPlayer = player.default({
target: '#svgaBox'
});
} else {
this.SVGAPlayer.destroyed()
this.SVGAPlayer = null
......
components/modules/menuBox/menuClass/chat/chat.vue
......@@ -25,12 +25,12 @@
</transition>
<transition name="fade">
<div class="chat-gift" v-show="giftBannerInfo !== null"> <!-- v-show="giftBannerInfo !== null" -->
<div class="chat-gift__header"><img :src="giftBannerInfo && giftBannerInfo.userHeadImg" alt=""></div>
<div class="chat-gift__senderName">{{ giftBannerInfo && giftBannerInfo.userNick || '未知' }}</div>
<div class="chat-gift__header" v-show="giftBannerInfo && giftBannerInfo.userHeadImg"><img :src="giftBannerInfo && giftBannerInfo.userHeadImg" alt=""></div>
<div class="chat-gift__senderName" v-show="giftBannerInfo && giftBannerInfo.userNick">{{ giftBannerInfo && giftBannerInfo.userNick || '未知' }}</div>
<strong>送给</strong>
<div class="chat-gift__receiver">浙江卫视</div>
<div class="chat-gift__giftPic"><img :src="giftBannerInfo && giftBannerInfo.filterContent.img" alt=""></div>
<div class="chat-gift__num">
<div class="chat-gift__receiver">{{ channelInfo.chatAdminName || '管理员' }}</div>
<div class="chat-gift__giftPic" v-show="giftBannerInfo && giftBannerInfo.filterContent.img"><img :src="giftBannerInfo && giftBannerInfo.filterContent.img" alt=""></div>
<div class="chat-gift__num" v-show="giftBannerInfo && giftBannerInfo.filterContent.num">
{{ giftBannerInfo && giftBannerInfo.filterContent.name || '未知' }} x {{ giftBannerInfo && giftBannerInfo.filterContent.num || '未知' }}
</div>
</div>
......
components/suspension/reward/rewardGiftNew.vue
......@@ -10,7 +10,7 @@
<img :src="giftImg(item)" />
</div>
<div class="name">{{ item.name }}</div>
<div class="price">{{ item.price == 0 ? 免费 : `${item.price}币` }}</div>
<div class="price">{{ item.price == 0 ? `免费` : `${item.price}币` }}</div>
<div class="bg"></div>
<div class="progress">
<div class="container right">
......@@ -35,7 +35,7 @@
<div class="right">
<div class="num">{{giftNum}}</div>
<div class="icon" @click.stop="changePicker"></div>
<div class="send" :class="giftInfo.id&&sendable ? 'send-active' : ''" @click.stop="giftInfo.id&&sendable&&_giftReward">
<div class="send" :class="giftInfo.id&&sendable ? 'send-active' : ''" @click.stop="giftInfo.id&&sendable&&_giftReward()">
发送
<div class="picker" @click.stop v-if="showPicker">
<scroll-picker :options="options" v-model="giftNum" @click.stop></scroll-picker>
......@@ -76,11 +76,10 @@ export default {
}),
remainingTime() {
return (item) => {
if (!item.time && !item.sendTime) return false
// eslint-disable-next-line radix
if (item.time && !item.sendTime) return parseInt(item.time) * 1000
const remain = item.sendTime * 1000 - new Date().getTime()
return item.time * 1000 - (remain > 0 ? remain : 0)
if (!item.time && !item.sendTime) return 0
if (item.time && !item.sendTime) return 0
const remain = item.time * 1000 - (new Date().getTime() - item.sendTime * 1000)
return remain > 0 ? remain : 0
}
},
options() {
......@@ -101,6 +100,7 @@ export default {
}
},
mounted() {
// this.$Bus.$on('bus-getRewardGiftList', this._getRewardGiftList);
this._getRewardGiftList();
},
methods: {
......@@ -155,13 +155,13 @@ export default {
} else {
clearTimeout(this.timer)
const change = this.list[page][index] // change.sendTime *
const remain = change.sendTime * 1000 - new Date().getTime()
const remainTime = change.sendTime * 1000 - (remain > 0 ? remain : 0)
const remainTime = change.time * 1000 - new Date().getTime() + change.sendTime * 1000
this.changeIndex = index;
this.pageIndex = page;
if (remainTime > 0){
setTimeout(() => {
this.sendable = true;
change.sendTime = null
}, remainTime)
return
}
......@@ -182,6 +182,12 @@ export default {
payType: 1
});
if (res.code === 200 && res.errorCode === 0) {
this.pageIndex = null
this.changeIndex = null
if (res.data === 'success') {
this._getRewardGiftList();
return
}
const { tradeType, prepayInfo } = res.data;
const { uin } = this.channelInfo;
const DEF_SITE = process.client
......@@ -257,6 +263,7 @@ export default {
border: 1px solid transparent;
padding: 0.05rem 0;
background: linear-gradient(180deg, rgba(90,93,135,.3) 0%, rgba(90, 93, 135, 0) 100%);
background-repeat: no-repeat;
border-radius: .1rem;
overflow: hidden;
.bg {
......@@ -288,19 +295,24 @@ export default {
.name {
margin: .02rem 0;
line-height: 0.2rem;
font-size: 0.1rem;
font-size: 0.12rem;
color: #FFF;
}
.price {
margin: .02rem 0;
line-height: 0.08rem;
font-size: 0.08rem;
font-size: 0.12rem;
color: #AAA;
transform: scale(0.9);
transform: scale(0.85);
padding-bottom: 0.06rem;
}
&.z-active {
border: 0.01rem solid #80d0f9;
.img {
img {
transform: scale(1.1);
}
}
}
&.z-active-progress {
.progress {
......
components/suspension/reward/rewardNew.vue
......@@ -19,7 +19,6 @@
<div class="icon"></div>
</div>
</div>
<div class="swiper-container" ref="swiper">
<div class="swiper-wrapper">
<div class="swiper-slide" v-for="item in list" :key="item.index">
......@@ -145,6 +144,7 @@ export default {
width: 50%;
display: flex;
justify-content: space-around;
align-items: flex-end;
div {
display: inline-block;
margin-right: 0.1rem;
......
package.json
{
"name": "ssr-program-live",
"version": "1.4.0",
"version": "1.5.0",
"description": "My superb Nuxt.js project",
"author": "1006903445@qq.com",
"private": true,
......@@ -40,7 +40,7 @@
},
"dependencies": {
"@gdyfe/ink-marks": "^1.1.4",
"@gdyfe/svgaplayer-for-live": "^1.0.0",
"@gdyfe/svgaplayer-for-live": "^1.0.3",
"@gdyfe/uploader": "^2.3.6",
"@nuxtjs/axios": "^5.3.6",
"@nuxtjs/component-cache": "^1.1.5",
......
yarn.lock
......@@ -2135,13 +2135,11 @@
dayjs "^1.8.34"
pako "^1.0.11"
"@gdyfe/svgaplayer-for-live@^1.0.0":
version "1.0.0"
resolved "https://registry.yarnpkg.com/@gdyfe/svgaplayer-for-live/-/svgaplayer-for-live-1.0.0.tgz#2ff345077d26ad1dd5f2b48fc7be13f361a805a6"
integrity sha512-luNIL4TobTzdYGjB/pKKGqU1XCluNfoFgRe5fAkEkYbzLLlcfb7QJA+0g6APpGLZN+mUfO91KEQsNyopfGnoRQ==
"@gdyfe/svgaplayer-for-live@^1.0.3":
version "1.0.3"
resolved "https://registry.yarnpkg.com/@gdyfe/svgaplayer-for-live/-/svgaplayer-for-live-1.0.3.tgz#1f3b14b30ce754ace7147a4aa15b99a55c45edb9"
integrity sha512-nXpwOha6XyqF5V11hX3w1Vr3xggDq+zPncGjFTvbakuhrVJptyXKJqlRwAj5P2Ky+MK9qKOhNSddGHeq1xmsFA==
dependencies:
jszip "^3.6.0"
jszip-utils "^0.1.0"
svga.lite "^1.5.0"
"@gdyfe/uploader@^2.3.6":
......@@ -7075,21 +7073,6 @@ jstoxml@^0.2.3:
resolved "https://registry.yarnpkg.com/jstoxml/-/jstoxml-0.2.4.tgz#ff3fb67856883a032953c7ce8ce7486210f48447"
integrity sha1-/z+2eFaIOgMpU8fOjOdIYhD0hEc=
jszip-utils@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/jszip-utils/-/jszip-utils-0.1.0.tgz#8c04cdedcdb291e83f055f5b261b3a3188ceca0b"
integrity sha512-tBNe0o3HAf8vo0BrOYnLPnXNo5A3KsRMnkBFYjh20Y3GPYGfgyoclEMgvVchx0nnL+mherPi74yLPIusHUQpZg==
jszip@^3.6.0:
version "3.6.0"
resolved "https://registry.yarnpkg.com/jszip/-/jszip-3.6.0.tgz#839b72812e3f97819cc13ac4134ffced95dd6af9"
integrity sha512-jgnQoG9LKnWO3mnVNBnfhkh0QknICd1FGSrXcgrl67zioyJ4wgx25o9ZqwNtrROSflGBCGYnJfjrIyRIby1OoQ==
dependencies:
lie "~3.3.0"
pako "~1.0.2"
readable-stream "~2.3.6"
set-immediate-shim "~1.0.1"
just-extend@^4.0.2:
version "4.1.1"
resolved "https://registry.yarnpkg.com/just-extend/-/just-extend-4.1.1.tgz#158f1fdb01f128c411dc8b286a7b4837b3545282"
......@@ -7200,13 +7183,6 @@ lie@3.1.1:
dependencies:
immediate "~3.0.5"
lie@~3.3.0:
version "3.3.0"
resolved "https://registry.yarnpkg.com/lie/-/lie-3.3.0.tgz#dcf82dee545f46074daf200c7c1c5a08e0f40f6a"
integrity sha512-UaiMJzeWRlEujzAuw5LokY1L5ecNQYZKfmyZ9L7wDHb/p5etKaxXhohBcrw0EYby+G/NA52vRSN4N39dxHAIwQ==
dependencies:
immediate "~3.0.5"
load-json-file@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-2.0.0.tgz#7947e42149af80d696cbf797bcaabcfe1fe29ca8"
......@@ -8179,7 +8155,7 @@ paho-mqtt@^1.1.0:
resolved "https://registry.yarnpkg.com/paho-mqtt/-/paho-mqtt-1.1.0.tgz#8c10e29eb162e966fb15188d965c3dce505de9d9"
integrity sha512-KPbL9KAB0ASvhSDbOrZBaccXS+/s7/LIofbPyERww8hM5Ko71GUJQ6Nmg0BWqj8phAIT8zdf/Sd/RftHU9i2HA==
pako@^1.0.11, pako@~1.0.2, pako@~1.0.5:
pako@^1.0.11, pako@~1.0.5:
version "1.0.11"
resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
integrity sha512-4hLB8Py4zZce5s4yd9XzopqwVv/yGNhV1Bl8NTmCq1763HeK2+EwVTv+leGeL13Dnh2wfbqowVPXCIO0z4taYw==
......@@ -9857,11 +9833,6 @@ set-blocking@^2.0.0:
resolved "https://registry.yarnpkg.com/set-blocking/-/set-blocking-2.0.0.tgz#045f9782d011ae9a6803ddd382b24392b3d890f7"
integrity sha1-BF+XgtARrppoA93TgrJDkrPYkPc=
set-immediate-shim@~1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/set-immediate-shim/-/set-immediate-shim-1.0.1.tgz#4b2b1b27eb808a9f8dcc481a58e5e56f599f3f61"
integrity sha1-SysbJ+uAip+NzEgaWOXlb1mfP2E=
set-value@^2.0.0, set-value@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/set-value/-/set-value-2.0.1.tgz#a18d40530e6f07de4228c7defe4227af8cad005b"
......
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