ETA/WebETA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

pagination users, locations, vehicles, loads

Browse Source
This commit is contained in:
Alexandro Uc Santos
2024-02-08 21:28:44 -06:00
parent 2df3bcfcfb
commit 3018a95a59
10 changed files with 157 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
src/views/LoadsPublishedView.vue
View File

@@ -5,59 +5,90 @@
import AttachmentsModal from '../components/AttachmentsModal.vue';
import { useLoadsStore } from '../stores/loads';
import FormLoadModal from '../components/FormLoadModal.vue';
import ProposalsModal from '../components/ProposalsModal.vue';
import CardEmpty from '../components/CardEmpty.vue';
import ProposalsModal from '../components/ProposalsModal.vue';
import CardEmpty from '../components/CardEmpty.vue';
import Pagination from '../components/Pagination.vue';
const loadStore = useLoadsStore();
const loading = ref(false);
const query = ref('');
const filterQuery = ref([]);
const limit = 3;
onMounted(() =>{
getDataLoadsInit();
console.log('init')
getDataLoadsInit(false);
})
///loads?company=64fa70c130d2650011ac4f3a&$limit=3&$skip=0&status[$ne]=Closed&$sort%5BcreatedAt%5D=-1
watch(query, () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ 100;
if(query.value.length === 0){
console.log('Clear manueal')
// console.log(loadStore.loadsTotal)
clearRequest();
filterQuery.value.search = "";
getLoadWithFilters(filterQuery.value);
}
});
const getDataLoadsInit = async() => {
const getDataLoadsInit = async(reload) => {
filterQuery.value.limit = '$limit=' + limit;
filterQuery.value.skip = "$skip=0"
filterQuery.value.status = "status[$ne]="+"Closed";
loading.value = true;
await loadStore.getCompanyLoads(filterQuery.value);
await loadStore.getCompanyLoads(filterQuery.value, reload);
loading.value = false;
}
const getLoadsByPage = async(data) => {
console.log(data);
loading.value = true;
filterQuery.value.skip = "$skip="+ data.skip;
loadStore.loadsCurrentPage = data.page
await loadStore.getCompanyLoads(filterQuery.value, true)
loading.value = false;
}
const getLoadWithFilters = async(filter) => {
loading.value = true;
await loadStore.getCompanyLoads(filter);
await loadStore.getCompanyLoads(filter, true);
loading.value = false;
}
const search = () => {
if(query.value.length >= 2){
// filterQuery.value = "company_name[$regex]=" + query.value + "&company_name[$options]=i";
filterQuery.value.search = "posted_by_name[$regex]="+query.value+"&posted_by_name[$options]=i";
getLoadWithFilters(filterQuery.value);
}
setTimeout(() => {
if(query.value.length >= 2){
// filterQuery.value = "company_name[$regex]=" + query.value + "&company_name[$options]=i";
filterQuery.value.search = "posted_by_name[$regex]="+query.value+"&posted_by_name[$options]=i";
getLoadWithFilters(filterQuery.value);
}
}, 100)
}
const clearFilter = () => {
clearRequest();
filterQuery.value.search = ""
filterQuery.value.status = "status[$ne]="+"Closed";
console.log('click here');
if(query.value == ''){
getDataLoadsInit();
getDataLoadsInit(true);
} else {
query.value = '';
}
}
const clearRequest = () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ limit;
loadStore.loadsCurrentPage = 1;
}
const loadHistory = () => {
clearRequest();
filterQuery.value.status = ""
filterQuery.value.status = "status="+ "Closed";
getLoadWithFilters(filterQuery.value);
@@ -99,6 +130,12 @@ import CardEmpty from '../components/CardEmpty.vue';
:load="load"
/>
<CardEmpty v-else text="No hay cargas agregadas"/>
<Pagination
:limit="limit"
:total="loadStore.loadsTotal"
:current-page="loadStore.loadsCurrentPage"
@get-elements="getLoadsByPage"
/>
</div>
</div>
</div>

4
src/views/LocationsView.vue
View File

@@ -5,7 +5,7 @@
import CardEmpty from '../components/CardEmpty.vue';
import CreateLocationModal from '../components/CreateLocationModal.vue';
import CardLocation from '../components/CardLocation.vue';
import Pagination from '../components/Pagination.vue';
import Pagination from '../components/Pagination.vue';
const companyStore = useCompanyStore();
@@ -23,7 +23,7 @@ import Pagination from '../components/Pagination.vue';
const getInitData = async() => {
loading.value = true;
companyStore.locationsCurrentPage = companyStore.locationsCurrentPage;
// companyStore.locationsCurrentPage = companyStore.locationsCurrentPage;
filterQuery.value.company = "company="+ localStorage.getItem('id');
await companyStore.getLocationsCompany(filterQuery.value, false)
loading.value = false;

23
src/views/TrucksPublishedView.vue
View File

@@ -4,13 +4,15 @@
import Spiner from '../components/ui/Spiner.vue';
import CardProposal from '../components/CardProposal.vue';
import LoadDetailModal from '../components/LoadDetailModal.vue';
import MakeProposalModal from '../components/MakeProposalModal.vue';
import MakeProposalModal from '../components/MakeProposalModal.vue';
import Pagination from '../components/pagination.vue';
const companyStore = useCompanyStore();
const loading = ref(false);
const proposalCurrent = ref(null);
const openModal = ref(false);
const openModalProposal = ref(false);
const limit = 3;
onMounted(() =>{
getInitData();
@@ -18,7 +20,17 @@ import MakeProposalModal from '../components/MakeProposalModal.vue';
const getInitData = async() => {
loading.value = true;
await companyStore.getProposalsCompany();
const filter = '$limit=' + limit + "&$skip=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;
companyStore.proposalsCurrentPage = data.page;
await companyStore.getProposalsCompany(filter, true);
loading.value = false;
}
@@ -61,6 +73,13 @@ import MakeProposalModal from '../components/MakeProposalModal.vue';
:proposal="proposal"
@set-proposal="handleSetCurrentProposal"
/>
<Pagination
v-if="!loading"
:limit="limit"
:current-page="companyStore.proposalsCurrentPage"
:total="companyStore.proposalsTotal"
@get-elements="getProposalsByPage"
/>
</div>
</template>

2
src/views/UsersView.vue
View File

@@ -4,7 +4,7 @@
import CardUser from '../components/CardUser.vue';
import { useCompanyStore } from '../stores/company';
import CreateUserModal from '../components/CreateUserModal.vue';
import Pagination from '../components/Pagination.vue';
import Pagination from '../components/Pagination.vue';
const companyStore = useCompanyStore();

30
src/views/VehiclesView.vue
View File

@@ -8,6 +8,7 @@
import CreateVehicleModal from '../components/CreateVehicleModal.vue';
import StatusVehicleModal from '../components/StatusVehicleModal.vue';
import DriverVehicleModal from '../components/DriverVehicleModal.vue';
import Pagination from '../components/pagination.vue';
const companyStore = useCompanyStore();
const vehicleStore = useVehiclesStore();
@@ -20,12 +21,16 @@
const editStatusVehicle = ref(false);
const editDriverVehicle = ref(false);
const limit = 2;
onMounted(() => {
getInitData();
})
const getInitData = async() => {
loading.value = true;
filterQuery.value.limit = '$limit=' + limit;
filterQuery.value.skip = "$skip=0"
filterQuery.value.company = "company="+ localStorage.getItem('id');
await vehicleStore.fetchVehicles(filterQuery.value, false);
await companyStore.getDrivers();
@@ -39,7 +44,10 @@
}
watch(query, () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ 100;
if(query.value.length === 0){
clearRequest()
filterQuery.value.search = "";
getVehiclesWithFilters(filterQuery.value);
}
@@ -55,6 +63,7 @@
}
const clearFilter = () => {
clearRequest()
filterQuery.value.search = "";
filterQuery.value.company = "company="+ localStorage.getItem('id');
@@ -65,6 +74,12 @@
}
}
const clearRequest = () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ limit;
vehicleStore.vehiclesCurrentPage = 1;
}
const handleSetCurrentVehicle = (data) => {
console.log(data);
if(data.modal === 'form') {
@@ -84,6 +99,15 @@
vehicleCurrent.value = null;
}
const getVehiclesByPage = async(data) => {
loading.value = true;
filterQuery.value.company = "company="+ localStorage.getItem('id');
filterQuery.value.skip = "$skip="+ data.skip;
vehicleStore.vehiclesCurrentPage = data.page
await vehicleStore.fetchVehicles(filterQuery.value, true);
loading.value = false;
}
</script>
<template>
@@ -130,6 +154,12 @@
@set-vehicle="handleSetCurrentVehicle"
/>
<CardEmpty v-else text="No hay vehiculos agregados"/>
<Pagination
:current-page="vehicleStore.vehiclesCurrentPage"
:total="vehicleStore.vehiclesTotal"
:limit="limit"
@get-elements="getVehiclesByPage"
/>
</div>
</div>
</template>