129 lines
3.6 KiB
JavaScript
129 lines
3.6 KiB
JavaScript
import { io } from 'socket.io/client-dist/socket.io'
|
|
import Vue from 'vue'
|
|
export default {
|
|
data() {
|
|
return {
|
|
userNotificationOffset: 60
|
|
}
|
|
},
|
|
computed: {
|
|
userIsLoggedIn() {
|
|
return this.$auth.loggedIn
|
|
},
|
|
userWS: {
|
|
get() {
|
|
return this.$store.state.front.userWS
|
|
},
|
|
set(val) {
|
|
this.$store.commit('front/set', ['userWS', val])
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
initUserWS() {
|
|
this.userWS = true
|
|
|
|
/// /////////////////////////////////////////// connetct to ws server
|
|
const socket = io(`${this.$config.WebSocketURL}/user`, {
|
|
reconnectionDelay: 20000,
|
|
reconnectionDelayMax: 20000,
|
|
auth: {
|
|
token: this.$auth.strategy.token.get()
|
|
}
|
|
})
|
|
|
|
Vue.prototype.$userSocket = socket
|
|
|
|
/// /////////////////////////////////////////// connection error
|
|
// eslint-disable-next-line node/handle-callback-err
|
|
socket.on('connect_error', err => {
|
|
this.$notify({
|
|
type: 'error',
|
|
title: 'خطا',
|
|
message: 'دریافت اعلانات با مشکل مواجه شد',
|
|
position: 'top-left',
|
|
offset: this.userNotificationOffset
|
|
// duration: 0
|
|
})
|
|
})
|
|
|
|
/// /////////////////////////////////////////// events
|
|
socket.on('connect', () => {
|
|
// console.log('**************** You have access to notifications')
|
|
socket.emit('user:fetchAnnouncements')
|
|
})
|
|
|
|
socket.on(`user:allNotifs`, data => {
|
|
this.$store.commit('front/set', ['unreadTickets', data.unreadTickets])
|
|
this.$store.commit('front/set', ['draftsCount', data.draftsCount])
|
|
})
|
|
|
|
socket.on(`user:announcements`, data => {
|
|
this.$store.commit('front/set', ['newUserAnnosCount', data.newUserAnnosCount])
|
|
this.$store.commit('front/set', ['userAnnouncements', data.userAnnouncements])
|
|
})
|
|
|
|
socket.on(`user:fetchNewAnnouncements`, data => {
|
|
socket.emit('user:fetchAnnouncements')
|
|
})
|
|
|
|
socket.on(`user:notify`, data => {
|
|
if (data.type === 'updateUnreadTickets') {
|
|
// update store
|
|
this.$store.commit('front/set', ['unreadTickets', data.unreadTickets])
|
|
|
|
// update DOM
|
|
if (this.$route.name === 'account-tickets') {
|
|
this.$nuxt.refresh()
|
|
}
|
|
}
|
|
|
|
if (data.type === 'newTicketMsg') {
|
|
this.$notify({
|
|
type: 'success',
|
|
title: 'توجه',
|
|
message: 'پیام دارید',
|
|
position: 'top-left',
|
|
offset: this.userNotificationOffset
|
|
})
|
|
|
|
if (this.$route.name === 'account-tickets-ticket') {
|
|
this.$nuxt.refresh()
|
|
setTimeout(() => {
|
|
window.scrollTo(0, document.body.scrollHeight)
|
|
}, 500)
|
|
}
|
|
}
|
|
|
|
if (data.type === 'updateDraftsCount') {
|
|
// update store
|
|
this.$store.commit('front/set', ['draftsCount', data.draftsCount])
|
|
|
|
// update DOM
|
|
if (this.$route.name === 'account-drafts') {
|
|
this.$nuxt.refresh()
|
|
}
|
|
}
|
|
})
|
|
|
|
socket.on(`user:notifyAll`, data => {
|
|
if (data.type === 'fetchNewAnnouncements') {
|
|
socket.emit('user:fetchAnnouncements')
|
|
this.$notify({
|
|
type: 'success',
|
|
title: 'توجه',
|
|
message: 'پیام جدید در اعلانات دارید',
|
|
position: 'top-left',
|
|
offset: this.userNotificationOffset
|
|
})
|
|
}
|
|
})
|
|
}
|
|
},
|
|
mounted() {
|
|
if (this.userIsLoggedIn && this.$auth.hasScope('user') && !this.userWS) {
|
|
this.initUserWS()
|
|
}
|
|
}
|
|
}
|