diff --git a/src/stores/socket.ts b/src/stores/socket.ts index be2ceee..28c1e3b 100644 --- a/src/stores/socket.ts +++ b/src/stores/socket.ts @@ -1,3 +1,4 @@ +import { ref } from 'vue' import config from '@/app.config' import { getToken } from '@/plugins/auth' import { defineStore } from 'pinia' @@ -10,6 +11,7 @@ interface sockeBackup { export const useSocketStore = defineStore('socket', () => { let socket: Socket + const notificationCounter = ref(0); async function init() { socket = io(new URL(config.API.socket).origin, { @@ -19,6 +21,7 @@ export const useSocketStore = defineStore('socket', () => { socket.on('socket-notification', (payload) => { let body: sockeBackup = JSON.parse(payload) + notificationCounter.value++ notifyStatus(body.message, body.success) }) } @@ -94,5 +97,5 @@ export const useSocketStore = defineStore('socket', () => { init() - return {} + return { notificationCounter } }) diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue index 9b76ae3..b5ffaa2 100644 --- a/src/views/HomeView.vue +++ b/src/views/HomeView.vue @@ -11,6 +11,7 @@ import { import { useQuasar } from 'quasar' import { format } from 'date-fns' import Camera from 'simple-vue-camera' +import { storeToRefs } from 'pinia' import config from '@/app.config' import http from '@/plugins/http' @@ -18,6 +19,7 @@ import { useCounterMixin } from '@/stores/mixin' import { usePermissions } from '@/composables/usePermissions' import { usePrivacyStore } from '@/stores/privacy' import { usePositionKeycloakStore } from '@/stores/positionKeycloak' +import { useSocketStore } from '@/stores/socket' import type { FormRef, OptionReason } from '@/interface/response/checkin' @@ -32,6 +34,8 @@ const { syncPermissionStates, requestCameraPermission, } = usePermissions() +const socketStore = useSocketStore() +const { notificationCounter } = storeToRefs(socketStore) const privacyStore = usePrivacyStore() const positionKeycloakStore = usePositionKeycloakStore() const MOCK_CHECK_DELAY_MS = 800 @@ -1248,6 +1252,11 @@ watch( } } ) + +/** Watch notification counter on socket */ +watch(notificationCounter, () => { + startChecking() +})