refactor(live): 优化直播页面消息提示和界面显示
- 移除不必要的空行和逗号 - 统一消息提示的展示时间 - 为艺术品结束提示添加背景色和边框色 - 在竞价信息中添加货币符号 - 调整侧边按钮弹窗的动画效果
This commit is contained in:
parent
f1bd2b183f
commit
e8a89b184e
@ -67,7 +67,7 @@ onUnmounted(() => {
|
|||||||
<div class="flex-grow-1 text-start" :style="`color: ${item.statusCode==='head'?'#D03050':'#939393'}`" >{{ item.statusCode==='head'?'领先':'出局' }}</div>
|
<div class="flex-grow-1 text-start" :style="`color: ${item.statusCode==='head'?'#D03050':'#939393'}`" >{{ item.statusCode==='head'?'领先':'出局' }}</div>
|
||||||
<div class="flex-grow-1 text-center">{{ item.auctionType==='local'?'现场竞价':'网络竞价' }}</div>
|
<div class="flex-grow-1 text-center">{{ item.auctionType==='local'?'现场竞价':'网络竞价' }}</div>
|
||||||
<div class="flex-grow-1 text-center">{{ item.createdAt }}</div>
|
<div class="flex-grow-1 text-center">{{ item.createdAt }}</div>
|
||||||
<div class="flex-grow-1 text-center">{{ item.baseMoney }}</div>
|
<div class="flex-grow-1 text-center">{{item.baseCurrency}}{{ item.baseMoney }}</div>
|
||||||
<div class="flex-grow-1 text-center text-#2B53AC">{{ item.userId===userInfo.ID?'我':'' }}</div>
|
<div class="flex-grow-1 text-center text-#2B53AC">{{ item.userId===userInfo.ID?'我':'' }}</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -141,11 +141,11 @@ watch(()=>props.show,(newValue)=>{
|
|||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
}
|
}
|
||||||
.blink {
|
.blink {
|
||||||
animation: fade 1s linear infinite; /* 改为0.4秒,使用linear让过渡更快 */
|
animation: fade 1s linear infinite;
|
||||||
}
|
}
|
||||||
|
|
||||||
@keyframes fade {
|
@keyframes fade {
|
||||||
0%, 100% { opacity: 1; }
|
0%, 100% { opacity: 1; }
|
||||||
50% { opacity: 0.4; } /* 改为0.3,这样不会完全消失 */
|
50% { opacity: 0.5; }
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
@ -31,7 +31,6 @@ export const liveStore = createGlobalState(() => {
|
|||||||
|
|
||||||
ws.onMessage((data) => {
|
ws.onMessage((data) => {
|
||||||
auctionData.value = data.data
|
auctionData.value = data.data
|
||||||
|
|
||||||
if (data.data?.wsType === 'tip' ) {
|
if (data.data?.wsType === 'tip' ) {
|
||||||
if (data.data?.tip?.tipType === 'falling'){
|
if (data.data?.tip?.tipType === 'falling'){
|
||||||
message.warning({
|
message.warning({
|
||||||
@ -44,7 +43,7 @@ export const liveStore = createGlobalState(() => {
|
|||||||
width: '151px',
|
width: '151px',
|
||||||
bottom: '230px',
|
bottom: '230px',
|
||||||
},
|
},
|
||||||
}, 500000)
|
})
|
||||||
}else if (data.data?.tip?.tipType === 'othersBid'){
|
}else if (data.data?.tip?.tipType === 'othersBid'){
|
||||||
message.error({
|
message.error({
|
||||||
title: {
|
title: {
|
||||||
@ -62,7 +61,7 @@ export const liveStore = createGlobalState(() => {
|
|||||||
width: '151px',
|
width: '151px',
|
||||||
bottom: '230px'
|
bottom: '230px'
|
||||||
},
|
},
|
||||||
}, 500000)
|
})
|
||||||
}else if (data.data?.tip?.tipType === 'successBid'){
|
}else if (data.data?.tip?.tipType === 'successBid'){
|
||||||
message.success({
|
message.success({
|
||||||
title: {
|
title: {
|
||||||
@ -80,13 +79,15 @@ export const liveStore = createGlobalState(() => {
|
|||||||
width: '151px',
|
width: '151px',
|
||||||
bottom: '230px'
|
bottom: '230px'
|
||||||
},
|
},
|
||||||
}, 500000)
|
})
|
||||||
}else if (data.data?.tip?.tipType === 'artworkOver'){
|
}else if (data.data?.tip?.tipType === 'artworkOver'){
|
||||||
message.success({
|
message.success({
|
||||||
title: {
|
title: {
|
||||||
text: '本拍品已结束',
|
text: '本拍品已结束',
|
||||||
color: '#575757',
|
color: '#575757',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
|
backgroundColor: '#fff',
|
||||||
|
borderColor:'#fff'
|
||||||
},
|
},
|
||||||
icon:false,
|
icon:false,
|
||||||
subTitle:{
|
subTitle:{
|
||||||
|
Loading…
Reference in New Issue
Block a user