| 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117 | 1×
1×
1×
1×
| const state = {
open: false,
user: null,
preUser: null,
messages: [],
preMessage: null,
target: null,
unread: 0
}
const getters = {
open: state => state.open,
user: state => state.user,
preUser: state => state.activeUser,
messages: state => state.messages,
preMessage: state => state.activeMessage,
target: state => state.target,
unread: state => state.unread
}
const actions = {
// empty message box
emptyMessages ({ commit }) {
commit('EMPTY_MESSAGES')
},
createMessage ({ commit }, data) {
commit('CREATE_MESSAGE', data)
},
updateUser ({ commit }, data) {
commit('UPDATE_USER', data)
},
setUser ({ commit }, data) {
commit('SET_USER', data)
},
setMessage ({ commit }, data) {
commit('SET_MESSAGE', data)
},
setTarget ({ commit }, data) {
commit('SET_TARGET', data)
},
openChat ({ commit }) {
commit('OPEN_CHAT')
},
closeChat ({ commit }) {
commit('CLOSE_CHAT')
},
toggleChat ({ commit }) {
commit('TOGGLE_CHAT')
}
}
const mutations = {
EMPTY_MESSAGES (state) {
state.messages = []
},
CREATE_MESSAGE (state, data) {
state.messages.push(data)
// add unread if chat window is not open
if (!state.open || document.hidden) {
state.unread++
}
// only contain recent 100 messages
if (state.messages.length > 100) {
state.messages.splice(0, state.messages.length - 100)
}
},
UPDATE_USER (state, data) {
state.user = data
},
SET_USER (state, data) {
state.preUser = data
},
SET_MESSAGE (state, data) {
state.preMessage = data
},
SET_TARGET (state, data) {
state.target = data
},
OPEN_CHAT (state) {
state.unread = 0
state.open = true
},
CLOSE_CHAT (state) {
state.open = false
},
TOGGLE_CHAT (state) {
state.unread = 0
state.open = !state.open
}
}
export default {
namespaced: true,
state,
getters,
actions,
mutations
}
|