k_online_ui/src/stores/modules/notificationMessage.ts

import { defineStore } from 'pinia'

interface NotificationMessageState {
  notificationMsgList: string[] // 页面中监听的未读消息id
  readCardMap: string[] // 已读的消息id
  requestedReadList: string[] // 已请求置为已读的消息id
}

export const useNotificationMessage = defineStore('notificationMessage', {
  state: (): NotificationMessageState => ({
    notificationMsgList: JSON.parse(localStorage.getItem('notificationMsgList')) || [],
    readCardMap: JSON.parse(localStorage.getItem('readCardMap')) || [],
    requestedReadList: JSON.parse(localStorage.getItem('requestedReadList')) || []
  }),
  getters: {},
  actions: {
    pushNotificationMessage(array: any[]) {
      this.notificationMsgList = [...this.notificationMsgList, ...array]
      localStorage.setItem('notificationMsgList', JSON.stringify(this.notificationMsgList))
    },
    setReadCardMap(id: string) {
      if (this.readCardMap.includes(id) || this.requestedReadList.includes(id)) return
      this.readCardMap.push(id)
      localStorage.setItem('readCardMap', JSON.stringify(this.readCardMap))
    },
    markMessageAsRead() {
      if (this.readCardMap.length === 0) return
      $api.setMessageRead({ id: this.readCardMap }).then((res) => {
        if (res.code === 200) {
          this.requestedReadList = this.readCardMap
          localStorage.setItem('requestedReadList', JSON.stringify(this.requestedReadList))
          this.readCardMap = []
          localStorage.setItem('readCardMap', JSON.stringify(this.readCardMap))

          this.notificationMsgList = this.notificationMsgList.filter(
            (item) => !this.readCardMap.includes(item.id)
          )
        }
      })
    },
    clearData() {
      this.notificationMsgList = []
      this.readCardMap = []
      this.requestedReadList = []
      localStorage.removeItem('notificationMsgList')
      localStorage.removeItem('readCardMap')
      localStorage.removeItem('requestedReadList')
    }
  }
})