matt/opnform-host-nginx
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Pagination for forms on main page (#9)

Browse Source 
* Pagination for forms on main page

* Fix tests

Co-authored-by: Julien Nahum <jhumanj@MacBook-Pro-de-Julien.local>
This commit is contained in:
Chirag
2022-10-17 13:15:41 +05:30
committed by GitHub
parent 8f528155f5
commit bd7d20feb9
5 changed files with 35 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/js/pages/forms/show.vue
View File

@@ -306,7 +306,7 @@ import FormSubmissions from '../../components/open/forms/components/FormSubmissi
const loadForms = function () {
store.commit('open/forms/startLoading')
store.dispatch('open/workspaces/loadIfEmpty').then(() => {
store.dispatch('open/forms/load', store.state['open/workspaces'].currentId)
store.dispatch('open/forms/loadIfEmpty', store.state['open/workspaces'].currentId)
})
}

13
resources/js/pages/home.vue
View File

@@ -10,13 +10,11 @@
Create a new form
</fancy-link>
</div>
<div v-if="formsLoading" class="text-center">
<loader class="h-6 w-6 text-nt-blue mx-auto" />
</div>
<p v-else-if="enrichedForms.length === 0 && !isFilteringForms">
<p v-if="!formsLoading && enrichedForms.length === 0 && !isFilteringForms">
You don't have any form yet.
</p>
<div v-else class="mb-10">
<div v-else-if="forms.length > 0" class="mb-10">
<text-input v-if="forms.length > 5" class="mb-6" :form="searchForm" name="search" label="Search a form"
placeholder="Name of form to search"
/>
@@ -66,6 +64,9 @@
</template>.
</p>
</div>
<div v-if="formsLoading" class="text-center">
<loader class="h-6 w-6 text-nt-blue mx-auto" />
</div>
</div>
</div>
<open-form-footer class="mt-8 border-t" />
@@ -83,7 +84,7 @@ import OpenFormFooter from '../components/pages/OpenFormFooter'
const loadForms = function () {
store.commit('open/forms/startLoading')
store.dispatch('open/workspaces/loadIfEmpty').then(() => {
store.dispatch('open/forms/load', store.state['open/workspaces'].currentId)
store.dispatch('open/forms/loadIfEmpty', store.state['open/workspaces'].currentId)
})
}

24
resources/js/store/modules/open/forms.js vendored
View File

@@ -2,6 +2,7 @@ import axios from 'axios'
export const formsEndpoint = '/api/open/workspaces/{workspaceId}/forms'
export const namespaced = true
export let currentPage = 1
// state
export const state = {
@@ -36,6 +37,9 @@ export const mutations = {
set (state, items) {
state.content = items
},
append (state, items) {
state.content = state.content.concat(items)
},
addOrUpdate (state, item) {
state.content = state.content.filter((val) => val.id !== item.id)
state.content.push(item)
@@ -56,12 +60,26 @@ export const actions = {
resetState (context) {
context.commit('set', [])
context.commit('stopLoading')
currentPage = 1
},
load (context, workspaceId) {
context.commit('startLoading')
return axios.get(formsEndpoint.replace('{workspaceId}', workspaceId)).then((response) => {
context.commit('set', response.data)
context.commit('stopLoading')
return axios.get(formsEndpoint.replace('{workspaceId}', workspaceId)+'?page='+currentPage).then((response) => {
context.commit((currentPage == 1) ? 'set' : 'append', response.data.data)
if (currentPage < response.data.meta.last_page) {
currentPage += 1
context.dispatch('load', workspaceId)
} else {
context.commit('stopLoading')
currentPage = 1
}
})
},
loadIfEmpty (context, workspaceId) {
if (context.state.content.length === 0) {
return context.dispatch('load', workspaceId)
}
context.commit('stopLoading')
return Promise.resolve()
}
}