diff --git a/src/api/chat.js b/src/api/chat.js index e37b6a8a..2063e22e 100644 --- a/src/api/chat.js +++ b/src/api/chat.js @@ -23,10 +23,13 @@ export async function fetchChat(id, authHost, token) { }) } -export async function fetchChatMessages(id, authHost, token) { +export async function fetchChatMessages(id, max_id, authHost, token) { + console.log(max_id) + let url + max_id !== null ? url = `/api/pleroma/admin/chats/${id}/messages?max_id=${max_id}` : url = `/api/pleroma/admin/chats/${id}/messages` return await request({ baseURL: baseName(authHost), - url: `/api/pleroma/admin/chats/${id}/messages`, + url: url, method: 'get', headers: authHeaders(token) }) diff --git a/src/lang/en.js b/src/lang/en.js index bd60ce52..affc2772 100644 --- a/src/lang/en.js +++ b/src/lang/en.js @@ -324,6 +324,7 @@ export default { pending: 'Pending', noStatuses: 'No statuses to show', noChats: 'No chats to show', + noMessages: 'No messages to show', openAccountInInstance: 'Open account in instance', securitySettings: { email: 'Email', diff --git a/src/store/modules/chat.js b/src/store/modules/chat.js index 29c993fc..ca288743 100644 --- a/src/store/modules/chat.js +++ b/src/store/modules/chat.js @@ -4,17 +4,29 @@ const chat = { state: { fetchedChat: {}, fetchedChatMessages: {}, - loading: false + loading: false, + buttonLoading: false, + allLoaded: false, + max_id: null }, mutations: { - SET_LOADING: (state, status) => { - state.loading = status + SET_LOADING: (state, chat) => { + state.loading = chat + }, + SET_ALL_LOADED: (state, chat) => { + state.allLoaded = chat + }, + SET_BUTTON_LOADING: (state, chat) => { + state.buttonLoading = chat }, SET_CHAT: (state, chat) => { state.fetchedChat = chat }, SET_CHAT_MESSAGES: (state, chatMessages) => { state.fetchedChatMessages = chatMessages + }, + CHANGE_MAX_ID: (state, max_id) => { + state.max_id = max_id } }, actions: { @@ -25,15 +37,18 @@ const chat = { commit('SET_CHAT', chat.data) commit('SET_LOADING', false) }, - async FetchChatMessages({ commit, dispatch, getters, state }, id) { + async FetchChatMessages({ commit, dispatch, getters, state }, id, max_id) { commit('SET_LOADING', true) - const chat = await fetchChatMessages(id, getters.authHost, getters.token) + const chat = await fetchChatMessages(id, state.max_id, getters.authHost, getters.token) commit('SET_CHAT_MESSAGES', chat.data) commit('SET_LOADING', false) }, async DeleteMessage({ commit, dispatch, getters, state }, params) { await deleteChatMessage(params.chat_id, params.message_id, getters.authHost, getters.token) dispatch('FetchChatMessages', params.chat_id) + }, + HandlePageChange({ commit }, max_id) { + commit('CHANGE_MAX_ID', max_id) } } } diff --git a/src/views/chats/show.vue b/src/views/chats/show.vue index 74603fa9..23a135c9 100644 --- a/src/views/chats/show.vue +++ b/src/views/chats/show.vue @@ -40,7 +40,11 @@ -

{{ $t('userProfile.noStatuses') }}

+

{{ $t('userProfile.noMessages') }}

+
+ {{ $t('statuses.loadMore') }} + +
@@ -54,11 +58,6 @@ import RebootButton from '@/components/RebootButton' export default { name: 'ChatShow', components: { RebootButton, ChatMessage }, - data() { - return { - - } - }, computed: { isDesktop() { return this.$store.state.app.device === 'desktop' @@ -69,6 +68,12 @@ export default { isTablet() { return this.$store.state.app.device === 'tablet' }, + allLoaded() { + return this.$store.state.chat.allLoaded + }, + buttonLoading() { + return this.$store.state.chat.buttonLoading + }, loading() { return this.$store.state.chat.loading }, @@ -80,6 +85,7 @@ export default { } }, beforeMount: function() { + this.$store.dispatch('HandlePageChange', null) this.$store.dispatch('NeedReboot') this.$store.dispatch('GetNodeInfo') this.$store.dispatch('FetchChat', this.$route.params.id) @@ -93,6 +99,11 @@ export default { const sender = this.chat.sender const receiver = this.chat.receiver return account_id === sender.id ? sender : receiver + }, + handleLoadMore() { + const max_id = this.chatMessages.pop().id + this.$store.dispatch('HandlePageChange', max_id) + this.$store.dispatch('FetchChatMessages', this.$route.params.id) } } } @@ -152,6 +163,10 @@ export default { .chats { padding: 0 20px 0 0; } +.statuses-pagination { + padding: 15px 0; + text-align: center; +} @media only screen and (min-width: 1824px) {