174 lines
5.9 KiB
JavaScript
174 lines
5.9 KiB
JavaScript
import { createGlobalState } from '@vueuse/core'
|
|
import {ref} from "vue";
|
|
import {goodStore} from "@/stores/goods/index.js";
|
|
import {authStore} from "@/stores/auth/index.js";
|
|
import {message} from "~/components/x-message/useMessage.js";
|
|
import { WebSocketClient } from '@/utils/websocket'
|
|
|
|
export const liveStore = createGlobalState(() => {
|
|
const {auctionDetail,getAuctionDetail} = goodStore();
|
|
const { token } = authStore()
|
|
const quoteStatus = ref(false)
|
|
const show = ref(false)
|
|
const cleanup = ref(null)
|
|
const show1=ref(false)
|
|
const playerId=ref('J_prismPlayer')
|
|
const auctionData=ref({})
|
|
const socket=ref(null)
|
|
const config = useRuntimeConfig()
|
|
const getSocketData = async () => {
|
|
const wsClient = new WebSocketClient(
|
|
config.public.NUXT_PUBLIC_SOCKET_URL,
|
|
token.value
|
|
)
|
|
const ws = wsClient.connect('/api/v1/m/auction/live', {
|
|
auctionUuid: auctionDetail.value.uuid,
|
|
})
|
|
|
|
ws.onOpen(() => {
|
|
console.log('WebSocket connected')
|
|
})
|
|
|
|
ws.onMessage((data) => {
|
|
auctionData.value = data.data
|
|
if (data.data?.wsType === 'tip' ) {
|
|
if (data.data?.tip?.tipType === 'falling'){
|
|
message.warning({
|
|
title: {
|
|
text: '即将落槌',
|
|
color: '#F09F1F',
|
|
align: 'center',
|
|
},
|
|
style: {
|
|
width: '151px',
|
|
bottom: '230px',
|
|
},
|
|
})
|
|
}else if (data.data?.tip?.tipType === 'othersBid'){
|
|
message.error({
|
|
title: {
|
|
text: '已有人出价',
|
|
color: '#CF3050',
|
|
align: 'center',
|
|
},
|
|
icon:false,
|
|
subTitle:{
|
|
text:'更新后再出价',
|
|
color: '#939393',
|
|
align: 'center',
|
|
},
|
|
style: {
|
|
width: '151px',
|
|
bottom: '230px'
|
|
},
|
|
})
|
|
}else if (data.data?.tip?.tipType === 'successBid'){
|
|
message.success({
|
|
title: {
|
|
text: '恭喜您，竞拍成功',
|
|
color: '#18A058',
|
|
align: 'center',
|
|
},
|
|
icon:false,
|
|
subTitle:{
|
|
text:'请缴款',
|
|
color: '#939393',
|
|
align: 'center',
|
|
},
|
|
style: {
|
|
width: '151px',
|
|
bottom: '230px'
|
|
},
|
|
})
|
|
}else if (data.data?.tip?.tipType === 'artworkOver'){
|
|
message.success({
|
|
title: {
|
|
text: '本拍品已结束',
|
|
color: '#575757',
|
|
align: 'center',
|
|
|
|
},
|
|
icon:false,
|
|
subTitle:{
|
|
text:'请期待下个拍品',
|
|
color: '#939393',
|
|
align: 'center',
|
|
},
|
|
style: {
|
|
width: '151px',
|
|
bottom: '230px',
|
|
backgroundColor: '#fff',
|
|
borderColor:'#fff'
|
|
},
|
|
})
|
|
}else if (data.data?.tip?.tipType === 'failBid'){
|
|
message.error({
|
|
title: {
|
|
text: '很遗憾，竞拍失败',
|
|
color: '#CF3050',
|
|
align: 'center',
|
|
},
|
|
icon:false,
|
|
subTitle:{
|
|
text:'竞拍结束',
|
|
color: '#939393',
|
|
align: 'center',
|
|
},
|
|
style: {
|
|
width: '186px',
|
|
bottom: '230px'
|
|
},
|
|
})
|
|
}
|
|
|
|
}else if (data.data?.wsType==='stopArtwor'){
|
|
quoteStatus.value=false
|
|
}else if (data.data?.wsType==='over'){
|
|
message.success({
|
|
title: {
|
|
text: '竞拍结束，谢谢参与',
|
|
color: '#575757',
|
|
align: 'center',
|
|
|
|
},
|
|
icon:false,
|
|
style: {
|
|
width: '195px',
|
|
bottom: '230px',
|
|
backgroundColor: '#fff',
|
|
borderColor:'#fff'
|
|
},
|
|
})
|
|
}
|
|
|
|
console.log('onmessage', data)
|
|
})
|
|
|
|
ws.onClose(() => {
|
|
console.log('WebSocket disconnected')
|
|
})
|
|
|
|
ws.onError((error) => {
|
|
console.error('WebSocket error:', error)
|
|
})
|
|
}
|
|
const changeStatus = () => {
|
|
if (auctionData.value.artwork.isSelling&&!auctionData.value.artwork.isSoled){
|
|
quoteStatus.value = true
|
|
}else {
|
|
if (quoteStatus.value){
|
|
quoteStatus.value = false
|
|
}
|
|
}
|
|
|
|
}
|
|
return{
|
|
auctionData,
|
|
getSocketData,
|
|
show1,
|
|
playerId,
|
|
show,
|
|
quoteStatus,
|
|
changeStatus
|
|
}
|
|
}) |