diff --git a/src/components/LoggedInLayout.vue b/src/components/LoggedInLayout.vue index 4969178..dd7ad6b 100644 --- a/src/components/LoggedInLayout.vue +++ b/src/components/LoggedInLayout.vue @@ -4,14 +4,17 @@ :is-open-form="isOpenForm", :close-form="closeForm", :open-form="openForm", - :current-year="currentYear" + :current-year="currentYear", + @update-client="setUpdatedClients" ) .flex.flex-auto the-sidebar router-view( :open-form="openForm", :is-open-form="isOpenForm", - :current-year="currentYear" + :current-year="currentYear", + :updated-clients="updatedClients", + @reset-updated-clients="resetUpdatedClients" ) @@ -26,6 +29,7 @@ export default { return { isOpenForm: false, currentYear: null, + updatedClients: false, }; }, methods: { @@ -38,6 +42,12 @@ export default { printCurrentYear() { return new Date().getFullYear(); }, + setUpdatedClients() { + this.updatedClients = true; + }, + resetUpdatedClients() { + this.updatedClients = false; + }, }, mounted: function () { this.currentYear = this.printCurrentYear(); diff --git a/src/components/TheHeader.vue b/src/components/TheHeader.vue index fffa46d..ec05d4e 100644 --- a/src/components/TheHeader.vue +++ b/src/components/TheHeader.vue @@ -3,7 +3,8 @@ base-client-form-create( v-if="isOpenForm", :close-form="closeForm", - :current-year="currentYear" + :current-year="currentYear", + @update-client="transmitUpdateClient" ) .flex.items-center.box-border.cursor-pointer.mr-auto img.logo-img.mr-29_25px(src="@/assets/images/logo.svg", alt="Logo") @@ -58,6 +59,9 @@ export default { localStorage.clear(); this.$router.push("/login"); }, + transmitUpdateClient() { + this.$emit("update-client"); + }, }, }; diff --git a/src/components/base/BaseClientFormCreate.vue b/src/components/base/BaseClientFormCreate.vue index 6e458ef..637ff11 100644 --- a/src/components/base/BaseClientFormCreate.vue +++ b/src/components/base/BaseClientFormCreate.vue @@ -210,6 +210,7 @@ export default { this.createIdentityDocument(result.id); this.createAddress(result.id); }); + this.$emit("update-client"); }, filterDataEmptyProperty(data) { let postData = data; diff --git a/src/pages/clients/TheClients.vue b/src/pages/clients/TheClients.vue index 4b4810f..b4f3b61 100644 --- a/src/pages/clients/TheClients.vue +++ b/src/pages/clients/TheClients.vue @@ -2,7 +2,9 @@ clients-wrapper( :open-form="openForm", :is-open-form="isOpenForm", - :current-year="currentYear" + :current-year="currentYear", + :updated-clients="updatedClients", + @reset-updated-clients="transmitReset" ) @@ -15,6 +17,12 @@ export default { openForm: Function, currentYear: Number, isOpenForm: Boolean, + updatedClients: Boolean, + }, + methods: { + transmitReset() { + this.$emit("reset-updated-clients"); + }, }, }; diff --git a/src/pages/clients/components/ClientsTable.vue b/src/pages/clients/components/ClientsTable.vue index 924e330..7c50ed5 100644 --- a/src/pages/clients/components/ClientsTable.vue +++ b/src/pages/clients/components/ClientsTable.vue @@ -20,7 +20,8 @@ :current-year="currentYear" ) client-table-pagination( - :length=6, + v-if="pageCount > 1" + :length="pageCount", :current-page="currentTablePage", @previous-page="switchPreviousPage", @next-page="switchNextPage", @@ -50,6 +51,7 @@ export default { openForm: Function, currentYear: Number, isOpenForm: Boolean, + updatedClients: Boolean, }, data() { @@ -58,21 +60,36 @@ export default { marked: [], dataClients: [], currentTablePage: 1, + limit: 4, + count: 0, }; }, + computed: { + pageCount() { + return Math.ceil(this.count / this.limit); + }, + }, methods: { saveDataClients(data) { this.dataClients = data.results; + this.count = data.count; }, filterDataClients(text) { fetchWrapper - .get(`general/person/?last_name=${text}`) + .get( + `general/person/?last_name=${text}&?limit=${this.limit}&offset=${ + (this.currentPage - 1) * this.limit + }` + ) .then((data) => this.saveDataClients(data)); }, - fetchDataClients() { - fetchWrapper - .get("general/person/") - .then((data) => this.saveDataClients(data)); + async fetchDataClients(currentPage) { + let response = await fetchWrapper.get( + `general/person/?limit=${this.limit}&offset=${ + (currentPage - 1) * this.limit + }` + ); + this.saveDataClients(response); }, selectedCheck(e) { if (e.target.id === "checkbox") { @@ -104,17 +121,20 @@ export default { }, }, watch: { - isOpenForm: { - immediate: true, - handler(newValue) { - if (newValue === false) { - this.fetchDataClients(); - } - }, + updatedClients() { + if (this.updatedClients === true) { + this.fetchDataClients(this.currentTablePage).then( + () => (this.currentTablePage = this.pageCount) + ); + this.$emit("reset-updated-clients"); + } + }, + currentTablePage() { + this.fetchDataClients(this.currentTablePage); }, }, mounted() { - this.fetchDataClients(); + this.fetchDataClients(this.currentTablePage); }, }; diff --git a/src/pages/clients/components/ClientsTableHat.vue b/src/pages/clients/components/ClientsTableHat.vue index 5516d03..b4bf51f 100644 --- a/src/pages/clients/components/ClientsTableHat.vue +++ b/src/pages/clients/components/ClientsTableHat.vue @@ -53,7 +53,7 @@ export default { this.$emit("search", this.searchClient); }, resetLastName() { - this.$emit("reset-search", this.searchClient); + this.$emit("reset-search"); this.searchClient = ""; }, }, diff --git a/src/pages/clients/components/ClientsWrapper.vue b/src/pages/clients/components/ClientsWrapper.vue index a03aee1..2dab7fe 100644 --- a/src/pages/clients/components/ClientsWrapper.vue +++ b/src/pages/clients/components/ClientsWrapper.vue @@ -2,8 +2,10 @@ .wrapper.flex.w-full.relative.mx-2 clients-table( :open-form="openForm", - :is-open-form="isOpenForm" - :current-year="currentYear" + :is-open-form="isOpenForm", + :current-year="currentYear", + :updated-clients="updatedClients", + @reset-updated-clients="transmitReset" ) @@ -16,6 +18,12 @@ export default { openForm: Function, currentYear: Number, isOpenForm: Boolean, + updatedClients: Boolean, + }, + methods: { + transmitReset() { + this.$emit("reset-updated-clients"); + }, }, };