From c286da773ec244471d6f920498357fddc0ffadbc Mon Sep 17 00:00:00 2001 From: Alexandro Uc Santos Date: Wed, 13 Mar 2024 21:39:26 -0600 Subject: [PATCH] fixes: pagination & users permissions --- src/components/CardLoad.vue | 2 ++ src/components/CardLocation.vue | 4 +++- src/components/CardProposal.vue | 7 ++++++- src/components/CardUser.vue | 10 ++++++---- src/components/CardVehicle.vue | 4 ++++ src/components/CreateUserModal.vue | 11 +++++++++-- src/components/Pagination.vue | 11 ++++++----- src/components/ui/CustomInput.vue | 6 +++++- src/services/company.js | 4 ++-- src/stores/company.js | 23 ++++++++++++----------- src/stores/loads.js | 4 ++-- src/stores/vehicles.js | 6 +++--- src/views/LoadsPublishedView.vue | 20 ++++++++++---------- src/views/LocationsView.vue | 16 +++++++++------- src/views/MyCompanyView.vue | 1 + src/views/TrucksPublishedView.vue | 7 +++---- src/views/UsersView.vue | 3 +-- src/views/VehiclesView.vue | 16 ++++++++-------- 18 files changed, 92 insertions(+), 63 deletions(-) diff --git a/src/components/CardLoad.vue b/src/components/CardLoad.vue index 24228f6..86123ae 100644 --- a/src/components/CardLoad.vue +++ b/src/components/CardLoad.vue @@ -151,6 +151,7 @@
@@ -164,6 +165,7 @@ Evidencias
- diff --git a/src/components/Pagination.vue b/src/components/Pagination.vue index f9de790..56625a2 100644 --- a/src/components/Pagination.vue +++ b/src/components/Pagination.vue @@ -12,19 +12,20 @@ import { onMounted, ref } from 'vue'; }, currentPage: { type: Number, - default: 1 + default: 0 } }) const emits = defineEmits(['get-elements']) - const currentPage = ref(1); + const currentPage = ref(0); const totalPage = ref(0) onMounted(() => { currentPage.value = props.currentPage; totalPage.value = Math.ceil(props.total / props.limit) }) - const setPage = (p) => { + const setPage = (p) => { + console.log('Page:', p); currentPage.value = p const skip = (p - 1) * props.limit; emits('get-elements', {skip: skip, page: p}); @@ -37,8 +38,8 @@ import { onMounted, ref } from 'vue';
{{ p }}
diff --git a/src/components/ui/CustomInput.vue b/src/components/ui/CustomInput.vue index 346d350..dd7efa8 100644 --- a/src/components/ui/CustomInput.vue +++ b/src/components/ui/CustomInput.vue @@ -35,6 +35,10 @@ }, error: { type: String, + }, + step: { + type: Number, + default: 0.1 } }) @@ -52,7 +56,7 @@ :id="name" :name="name" :min="0" - :step="0.1" + :step="step" :value="field" :disabled="readonly" :readonly="readonly" diff --git a/src/services/company.js b/src/services/company.js index aab5265..2e1bbc9 100644 --- a/src/services/company.js +++ b/src/services/company.js @@ -25,7 +25,7 @@ export const updateCompany = async(formData) => { export const getUsers = async(filter) => { try { - const endpoint = `/v1/users/find?${filter}`; + const endpoint = `/v1/users/find?${filter}&$sort%5BcreatedAt%5D=-1`; const {data} = await api.get(endpoint); return data; } catch (error) { @@ -126,7 +126,7 @@ export const deleteBudget = async(id) => { export const getLocations = async(filter) => { try { - const endpoint = `/v1/branches/find${filter}&$limit=3&$sort%5BcreatedAt%5D=-1`; + const endpoint = `/v1/branches/find${filter}&$sort%5BcreatedAt%5D=-1`; console.log(endpoint); const {data} = await api.get(endpoint); return data; diff --git a/src/stores/company.js b/src/stores/company.js index 4f2f243..edec500 100644 --- a/src/stores/company.js +++ b/src/stores/company.js @@ -10,17 +10,17 @@ export const useCompanyStore = defineStore('company', () => { const users = ref([]); const drivers = ref([]); const usersTotal = ref(0); - const usersCurrentPage = ref(1); + const usersCurrentPage = ref(0); const budgets = ref([]); const budgetsTotal = ref(0); - const budgetsCurrentPage = ref(1); + const budgetsCurrentPage = ref(0); const locations = ref([]); const locationsLoads = ref([]); const locationsTotal = ref(0); - const locationsCurrentPage = ref(1); + const locationsCurrentPage = ref(0); const proposals = ref([]); const proposalsTotal = ref(0); - const proposalsCurrentPage = ref(1) + const proposalsCurrentPage = ref(0) const loading = ref(false); const getCompanyData = async() => { @@ -35,10 +35,11 @@ export const useCompanyStore = defineStore('company', () => { loading.value = false; } - const getUsersCompany = async(limit = 10, skip = 0, reload = false) => { + const getUsersCompany = async(limit = 1, page = 0, reload = false) => { const companyId = localStorage.getItem('id'); if(users.value.length <= 0 || reload === true) { - const filter = `company=${companyId}`; + // const filter = `company=${companyId}`; + const filter = `company=${companyId}&elements=${limit}&page=${page}`; const resp = await getUsers(filter); if(resp !== null && resp.total > 0) { usersTotal.value = resp.total; @@ -142,17 +143,17 @@ export const useCompanyStore = defineStore('company', () => { users.value = []; drivers.value = []; usersTotal.value = 0; - usersCurrentPage.value = 1; + usersCurrentPage.value = 0; budgets.value = []; budgetsTotal.value = 0; - budgetsCurrentPage.value = 1; + budgetsCurrentPage.value = 0; locations.value = []; locationsLoads.value = []; locationsTotal.value = 0; - locationsCurrentPage.value = 1; + locationsCurrentPage.value = 0; proposals.value = []; proposalsTotal.value = 0; - proposalsCurrentPage.value = 1; + proposalsCurrentPage.value = 0; // companyid = null; loading.value = false; } @@ -170,7 +171,7 @@ export const useCompanyStore = defineStore('company', () => { const companyId = localStorage.getItem('id'); try { if(proposals.value.length <= 0 || reload) { - const endpoint = `/v1/proposals/find?carrier=${companyId}&$sort%5BcreatedAt%5D=-1&${filter}`; + const endpoint = `/v1/proposals/find?carrier=${companyId}&${filter}&$sort%5BcreatedAt%5D=-1`; console.log(endpoint) const {data} = await api.get(endpoint); proposals.value = data.data; diff --git a/src/stores/loads.js b/src/stores/loads.js index 38b211a..6461af3 100644 --- a/src/stores/loads.js +++ b/src/stores/loads.js @@ -8,7 +8,7 @@ export const useLoadsStore = defineStore('load', () => { const loads = ref([]) const loadsDashboard = ref([]); const loadsTotal = ref(0) - const loadsCurrentPage = ref(1) + const loadsCurrentPage = ref(0) const proposalsOfLoads = ref([]); const openModalEdit = ref(false); const openAttachmentsModal = ref(false); @@ -152,7 +152,7 @@ export const useLoadsStore = defineStore('load', () => { loads.value = []; loadsDashboard.value = []; loadsTotal.value = 0; - loadsCurrentPage.value = 1; + loadsCurrentPage.value = 0; proposalsOfLoads.value = []; openModalEdit.value = false; openAttachmentsModal.value = false; diff --git a/src/stores/vehicles.js b/src/stores/vehicles.js index 962a5b4..5290953 100644 --- a/src/stores/vehicles.js +++ b/src/stores/vehicles.js @@ -5,7 +5,7 @@ export const useVehiclesStore = defineStore('vehicles', () => { const vehicles = ref([]); const vehiclesTotal = ref(0); - const vehiclesCurrentPage = ref(1) + const vehiclesCurrentPage = ref(0) const fetchVehicles = async(filterQuery, reload = false) => { let filterArr = Object.values(filterQuery); @@ -17,7 +17,7 @@ export const useVehiclesStore = defineStore('vehicles', () => { } if(vehicles.value.length <= 0 || reload === true) { const resp = await getVehicles(filterStr + '&$sort%5BcreatedAt%5D=-1'); - console.log(resp.data); + console.log(resp); if(resp !== null) { vehiclesTotal.value = resp.total; vehicles.value = resp.data; @@ -71,7 +71,7 @@ export const useVehiclesStore = defineStore('vehicles', () => { const clear = () => { vehicles.value = []; vehiclesTotal.value = 0; - vehiclesCurrentPage.value = 1; + vehiclesCurrentPage.value = 0; } diff --git a/src/views/LoadsPublishedView.vue b/src/views/LoadsPublishedView.vue index 36ad821..80ef112 100644 --- a/src/views/LoadsPublishedView.vue +++ b/src/views/LoadsPublishedView.vue @@ -13,18 +13,18 @@ const loading = ref(false); const query = ref(''); const filterQuery = ref([]); - const limit = 3; + const limit = 5; onMounted(() =>{ console.log('init') getDataLoadsInit(false); }) - ///loads?company=64fa70c130d2650011ac4f3a&$limit=3&$skip=0&status[$ne]=Closed&$sort%5BcreatedAt%5D=-1 + ///loads?company=64fa70c130d2650011ac4f3a&elements=3&page=0&status[$ne]=Closed&$sort%5BcreatedAt%5D=-1 watch(query, () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ 100; + filterQuery.value.page = "page="+ 0; + filterQuery.value.limit = "elements="+ 100; if(query.value.length === 0){ console.log('Clear manueal') // console.log(loadStore.loadsTotal) @@ -35,8 +35,8 @@ }); const getDataLoadsInit = async(reload) => { - filterQuery.value.limit = '$limit=' + limit; - filterQuery.value.skip = "$skip=0" + filterQuery.value.limit = 'elements=' + limit; + filterQuery.value.page = "page=0" filterQuery.value.status = "status[$ne]="+"Closed"; loading.value = true; await loadStore.getCompanyLoads(filterQuery.value, reload); @@ -46,7 +46,7 @@ const getLoadsByPage = async(data) => { console.log(data); loading.value = true; - filterQuery.value.skip = "$skip="+ data.skip; + filterQuery.value.page = "page="+ data.page; loadStore.loadsCurrentPage = data.page await loadStore.getCompanyLoads(filterQuery.value, true) loading.value = false; @@ -82,9 +82,9 @@ } const clearRequest = () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ limit; - loadStore.loadsCurrentPage = 1; + filterQuery.value.page = "page="+ 0; + filterQuery.value.limit = "elements="+ limit; + loadStore.loadsCurrentPage = 0; } const loadHistory = () => { diff --git a/src/views/LocationsView.vue b/src/views/LocationsView.vue index ab4b085..e8b453a 100644 --- a/src/views/LocationsView.vue +++ b/src/views/LocationsView.vue @@ -19,12 +19,14 @@ getInitData(); }) - const limit = 3; + const limit = 5; const getInitData = async() => { loading.value = true; // companyStore.locationsCurrentPage = companyStore.locationsCurrentPage; filterQuery.value.company = "company="+ localStorage.getItem('id'); + filterQuery.value.limit = "elements=" + limit; + filterQuery.value.page = "page=" + 0; await companyStore.getLocationsCompany(filterQuery.value, false) loading.value = false; } @@ -32,7 +34,7 @@ const getLocationsByPage = async(data) => { loading.value = true; filterQuery.value.company = "company="+ localStorage.getItem('id'); - filterQuery.value.skip = "$skip="+ data.skip; + filterQuery.value.page = "page=" + data.page; companyStore.locationsCurrentPage = data.page await companyStore.getLocationsCompany(filterQuery.value, true) loading.value = false; @@ -45,8 +47,8 @@ } watch(query, () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ 100; + filterQuery.value.page = "page=" + 0; + filterQuery.value.limit = "elements=" + 100; if(query.value.length === 0){ clearRequest(); filterQuery.value.search = ""; @@ -77,9 +79,9 @@ } const clearRequest = () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ limit; - companyStore.locationsCurrentPage = 1; + filterQuery.value.page = "page=" + 0; + filterQuery.value.limit = "elements="+ limit; + companyStore.locationsCurrentPage = 0; } const handleSetCurrentLocation = (location) => { diff --git a/src/views/MyCompanyView.vue b/src/views/MyCompanyView.vue index 8753849..c9fbcff 100644 --- a/src/views/MyCompanyView.vue +++ b/src/views/MyCompanyView.vue @@ -44,6 +44,7 @@ import { storeToRefs } from 'pinia';

{{ company.company?.company_name }}

diff --git a/src/views/TrucksPublishedView.vue b/src/views/TrucksPublishedView.vue index 855b3dd..ab26fe8 100644 --- a/src/views/TrucksPublishedView.vue +++ b/src/views/TrucksPublishedView.vue @@ -12,7 +12,7 @@ const proposalCurrent = ref(null); const openModal = ref(false); const openModalProposal = ref(false); - const limit = 3; + const limit = 5; onMounted(() =>{ getInitData(); @@ -20,15 +20,14 @@ const getInitData = async() => { loading.value = true; - const filter = '$limit=' + limit + "&$skip=0"; + const filter = 'elements=' + limit + "&page=0"; await companyStore.getProposalsCompany(filter, false); loading.value = false; } const getProposalsByPage = async(data) => { - console.log(data) loading.value = true; - const filter = '$limit=' + limit + "&$skip=" + data.skip; + const filter = 'elements=' + limit + "&page=" + data.page; companyStore.proposalsCurrentPage = data.page; await companyStore.getProposalsCompany(filter, true); loading.value = false; diff --git a/src/views/UsersView.vue b/src/views/UsersView.vue index ca9a7b1..318ea28 100644 --- a/src/views/UsersView.vue +++ b/src/views/UsersView.vue @@ -24,10 +24,9 @@ } const getUsersByPage = async(data) => { - console.log(data) loading.value = true; companyStore.usersCurrentPage = data.page - await companyStore.getUsersCompany(limit, data.skip, true); + await companyStore.getUsersCompany(limit, companyStore.usersCurrentPage, true); loading.value = false; } diff --git a/src/views/VehiclesView.vue b/src/views/VehiclesView.vue index 4ccec49..ffad538 100644 --- a/src/views/VehiclesView.vue +++ b/src/views/VehiclesView.vue @@ -29,8 +29,8 @@ const getInitData = async() => { loading.value = true; - filterQuery.value.limit = '$limit=' + limit; - filterQuery.value.skip = "$skip=0" + filterQuery.value.limit = 'elements=' + limit; + filterQuery.value.page = "page=0" filterQuery.value.company = "company="+ localStorage.getItem('id'); await vehicleStore.fetchVehicles(filterQuery.value, false); await companyStore.getDrivers(); @@ -44,8 +44,8 @@ } watch(query, () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ 100; + filterQuery.value.page = "page="+ 0; + filterQuery.value.limit = "elements="+ 100; if(query.value.length === 0){ clearRequest() filterQuery.value.search = ""; @@ -75,9 +75,9 @@ } const clearRequest = () => { - filterQuery.value.skip = "$skip="+ 0; - filterQuery.value.limit = "$limit="+ limit; - vehicleStore.vehiclesCurrentPage = 1; + filterQuery.value.page = "page="+ 0; + filterQuery.value.limit = "elements="+ limit; + vehicleStore.vehiclesCurrentPage = 0; } const handleSetCurrentVehicle = (data) => { @@ -102,7 +102,7 @@ const getVehiclesByPage = async(data) => { loading.value = true; filterQuery.value.company = "company="+ localStorage.getItem('id'); - filterQuery.value.skip = "$skip="+ data.skip; + filterQuery.value.page = "page="+ data.page; vehicleStore.vehiclesCurrentPage = data.page await vehicleStore.fetchVehicles(filterQuery.value, true); loading.value = false;