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

add: pagination in search loads y companies

Browse Source
This commit is contained in:
Alexandro Uc Santos
2024-03-16 18:20:59 -06:00
parent c286da773e
commit f8dfe4a3ad
17 changed files with 122 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/CardLoad.vue
View File

@@ -151,8 +151,8 @@
</div>
<div class="btn-row" v-if="!readOnly && authStore.user?.permissions === 'role_shipper'">
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn-primary-sm bg-dark"
v-if="(authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager') || authStore.user._id === props.load.posted_by"
class="btn-primary-sm bg-danger"
@click="handleDeleteLoad"
><i class="fa-solid fa-ban clear-sm"></i> Cancelar</button>
<button v-if="load.status !== 'Draft' && load.load_status !== 'Published' && load.load_status !== 'Loading'"
@@ -165,7 +165,7 @@
Evidencias
</button>
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
v-if="(authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager') || authStore.user._id === props.load.posted_by"
class="btn-primary-sm"
data-toggle="modal" data-target="#formLoadModal"
@click="openEditModal"

2
src/components/CardVehicle.vue
View File

@@ -10,7 +10,7 @@ import { useAuthStore } from '../stores/auth';
required: true
}
})
console.log(props.vehicle);
defineEmits(['set-vehicle']);
const vehicleStore = useVehiclesStore();

23
src/components/CreateUserModal.vue
View File

@@ -18,6 +18,29 @@
}
});
/*
Usuarios: Staff solo puede ver los usuarios.
Ubicaciones: Staff puede hacer todas las acciones
Cargas: Staff: solo puede elimianr y editar sus propias cargas, y puede crear cargas
Gerente: de todos
Staff puede aceptar ofertas de las cargas de sus demas compañeros
Calendario: Gerente, Staff, puede ver sus eventos propios y las de la empresa,
Vehiculos: Staff: solo puede elimianr y editar sus propias vehiculos, y puede crear vehiculo
Gerente: de todos
Staff puede asignar conductores al vehiculo, puede igual cambiar el estado del vehiculo
Ofertas aceptadas: tiene todos los privilegios de un gerente.
Calculadora: El staff tiene todo los privigelios
Empresa: Manager
*/
onMounted(() => {
if(props.user) {
console.log(props.user)

3
src/components/CreateVehicleModal.vue
View File

@@ -17,6 +17,8 @@
}
});
console.log(props.vehicle);
defineEmits(['reset-vehicle']);
const initState = {
@@ -85,6 +87,7 @@
circulation_serial_number: vehicleForm.circulation_serial_number,
notes: vehicleForm.notes,
company: authStore.user.company,
// posted_by: authStore.user._id,
categories: vehicleForm.categories.length <= 0 ? null : vehicleForm.categories?.map((e) => e._id),
destino: vehicleForm.destino,
available_date: new Date()

2
src/components/DriverVehicleModal.vue
View File

@@ -115,7 +115,7 @@
v-model="driverSelected"
>
<option disabled value="">-- Seleccionar conductor --</option>
<option v-for="driver in drivers" :value="driver">{{driver.name}}</option>
<option v-for="driver in drivers" :value="driver">{{driver.first_name}} {{ driver.last_name }}</option>
</select>
<span class="error-msg" v-if="error">{{ error }}</span>
</div>

2
src/composables/useDirectory.js
View File

@@ -6,7 +6,7 @@ export default function useDirectory() {
const loading = ref(false);
const users = ref([]);
const companiesTotal = ref(0);
const currentCompaniesPage = ref(1);
const currentCompaniesPage = ref(0);
const getCompaniesData = async(filterQuery) => {

2
src/composables/userSearchLoads.js
View File

@@ -5,7 +5,7 @@ export default function useSearchLoads() {
const loads = ref([]);
const loading = ref(false);
const total = ref(0);
const currentPage = ref(1);
const currentPage = ref(0);
const getLoadsPublished = async(filterQuery) => {
loading.value = true;

4
src/router/index.js
View File

@@ -119,12 +119,12 @@ const router = createRouter({
component: () => import('../views/VehiclesView.vue'),
},
{
path: 'embarcadores',
path: 'transportistas',
name: 'carriers',
component: () => import('../views/CarriersView.vue'),
},
{
path: 'transportistas',
path: 'embarcadores',
name: 'shippers',
component: () => import('../views/ShippersView.vue'),
},

2
src/services/auth.js
View File

@@ -6,6 +6,7 @@ export const login = async(body) => {
try {
const endpoint = "/v1/account/authorize";
const {data} = await apiPublic.post(endpoint, body);
console.log('auth: ', data);
if(data.accessToken !== null){
if(data.user.job_role !== 'driver'){
//TODO: Guardar token y datos del usuario
@@ -78,6 +79,7 @@ export const regiterConfirm = async(body) => {
try {
const endpoint = "/v1/account/signup";
const {data} = await apiPublic.patch(endpoint, body);
console.log('register auth: ', data);
return {
msg: 'success',
data

2
src/stores/vehicles.js
View File

@@ -28,7 +28,7 @@ export const useVehiclesStore = defineStore('vehicles', () => {
const createVehicleCompany = async(formData, localData = {}) => {
const data = await createVehicle(formData);
if(data) {
vehicles.value.push({
vehicles.value.unshift({
...data,
...localData
});

32
src/views/CarriersView.vue
View File

@@ -7,8 +7,9 @@
import Segments from '../components/ui/Segments.vue';
import States from '../components/ui/States.vue';
import Cities from '../components/ui/Cities.vue';
import Pagination from '../components/Pagination.vue';
const {loading, companies, getCompaniesData} = useDirectory();
const {loading, companies, getCompaniesData, companiesTotal, currentCompaniesPage} = useDirectory();
const query = ref('');
const selectedTruckType = ref([]);
const selectedCategory = ref([]);
@@ -16,11 +17,24 @@
const selectedCities = ref([]);
const filterQuery = ref([]);
const limit = 5;
onMounted(() => {
filterQuery.value.company_type = 'carrier';
filterQuery.value.limit = 'elements=' + limit;
filterQuery.value.page = "page=0";
getCompaniesData(filterQuery.value);
});
const getCompaniesByPage = (data) => {
console.log(data);
// filterQuery.value.company_type = 'shipper';
filterQuery.value.page = "page="+ data.page;
currentCompaniesPage.value = data.page
getCompaniesData(filterQuery.value);
}
watch(query, () => {
if(query.value.length === 0){
filterQuery.value.search = "";
@@ -66,7 +80,7 @@
}
const clearFilter = () => {
clearRequest();
selectedCities.value = null;
selectedCategory.value = null;
selectedState.value = null;
@@ -86,6 +100,12 @@
}
}
const clearRequest = () => {
filterQuery.value.page = "page="+ 0;
filterQuery.value.limit = "elements="+ limit;
currentCompaniesPage.value = 0;
}
const clearState = () => {
filterQuery.value.state = "";
getCompaniesData(filterQuery.value);
@@ -151,6 +171,14 @@
:key="company._id"
:company="company"
/>
<Pagination
v-if="!loading"
:total="companiesTotal"
:limit="limit"
:current-page="currentCompaniesPage"
@get-elements="getCompaniesByPage"
/>
</div>
</template>

48
src/views/CompleteRegisterView.vue
View File

@@ -13,6 +13,7 @@
import { useAuthStore } from '../stores/auth';
import { complete_registry } from "../services/auth";
import { updateMyUserProfile } from "../services/company"
import Spiner from '../components/ui/Spiner.vue';
const notifications = useNotificationsStore();
const auth = useAuthStore();
@@ -72,6 +73,7 @@
clearMessages();
return;
}
localStorage.setItem('access', auth.token);
const companyData = {
company_name : company.name,
rfc : company.rfc,
@@ -82,31 +84,40 @@
company_description : company.description,
company_type : typeCompany.typeCompany,
};
loading.value = true;
const result = await complete_registry( companyData );
console.log(result);
if(result.msg === 'success' && result.data !== null){
localStorage.setItem('id', result.data._id);
if(result.msg !== 'success') {
msgError.value = result.msg;
localStorage.removeItem('access');
loading.value = false;
clearMessages();
return;
}
console.log(result);
localStorage.setItem('id', result.data._id);
localStorage.setItem('session', auth.sesion);
// localStorage.setItem('access', auth.token);
const userData = {
"first_name" : user.name,
"last_name" : user.lastName,
"phone" : user.phone1,
"phone2" : user.phone2,
};
await updateMyUserProfile( userData );
let respUser = await updateMyUserProfile( userData );
console.log('User create: ', respUser);
if(respUser === null) {
auth.user = userData;
} else {
auth.user = respUser;
}
/////// Datos debug ///////
notifications.show = true;
notifications.text = 'Los datos se llenaron correctamente';
localStorage.setItem('session', 'jssksksksk2skskkskskkskss');
auth.$patch({
sesion: 'jssksksksk2skskkskskkskss',
token: 'jkdkdkdkeoee00kelldd',
user: {
first_name: user.name,
last_name: user.lastName
},
})
loading.value = false;
router.push({name: 'home'});
///////////////////////////
}
@@ -292,6 +303,7 @@
label="Teléfono 1: *"
type="number"
name="phone1"
:step="1"
:filled="false"
v-model:field="user.phone1"
/>
@@ -299,12 +311,18 @@
label="Teléfono 2:"
type="number"
name="phone2"
:step="1"
:filled="false"
v-model:field="user.phone2"
/>
</div>
<input type="submit" value="Guardar" class="btn-primary-lg btn-lg-block my-4">
<Spiner v-if="loading" class="mt-5"/>
<input
v-else
type="submit"
value="Guardar"
class="btn-primary-lg btn-lg-block my-4"
/>
</form>
</div>
</template>

9
src/views/LoginView.vue
View File

@@ -37,8 +37,7 @@
}
const resp = await login(data);
if(resp.msg === 'success') {
console.log(resp.data.user);
if( resp.data.user.company ) {
if( resp.data.user.company ) { // Registro completo
localStorage.setItem('session', resp.data.session_token);
localStorage.setItem('access', resp.data.accessToken);
localStorage.setItem('id', resp.data.user.company);
@@ -49,14 +48,14 @@
token: resp.data.accessToken,
user: resp.data.user,
})
} else {
} else { // Completar registro
auth.$patch({
sesion: resp.data.session_token,
token: resp.data.accessToken,
user: resp.data.user,
})
localStorage.setItem('session', resp.data.session_token);
localStorage.setItem('access', resp.data.accessToken);
// localStorage.setItem('session', resp.data.session_token);
// localStorage.setItem('access', resp.data.accessToken);
router.push({name: 'register-company'});
}
} else {

19
src/views/SearchLoadsView.vue
View File

@@ -10,13 +10,14 @@
import Cities from '../components/ui/Cities.vue';
import MakeProposalModal from '../components/MakeProposalModal.vue';
import Pagination from '../components/Pagination.vue';
const filterQuery = ref([]);
const query = ref('');
const selectedTruckType = ref([]);
const selectedCategory = ref([]);
const selectedState = ref([]);
const selectedCities = ref([]);
const limit = 3;
const limit = 1;
const isSearch = ref(false);
const { getLoadsPublished, loads, loading, currentPage, total } = useSearchLoads();
@@ -121,8 +122,8 @@
}
const getInitData = async() => {
filterQuery.value.limit = '$limit=' + limit;
filterQuery.value.skip = "$skip=0";
filterQuery.value.limit = 'elements=' + limit;
filterQuery.value.page = "page=0";
filterQuery.value.company = "";
filterQuery.value.status = "status=Published",
@@ -131,20 +132,20 @@
const getLoadsByPage = (data) => {
console.log(data);
filterQuery.value.skip = "$skip="+ data.skip;
filterQuery.value.page = "page="+ data.page;
currentPage.value = data.page
getLoadsPublished(filterQuery.value);
}
const clearRequest = () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ limit;
currentPage.value = 1;
filterQuery.value.page = "page="+ 0;
filterQuery.value.limit = "elements="+ limit;
currentPage.value = 0;
}
const setFilterUnlimited = () => {
filterQuery.value.skip = "$skip="+ 0;
filterQuery.value.limit = "$limit="+ 100;
filterQuery.value.page = "page="+ 0;
filterQuery.value.limit = "elements="+ 100;
}
const currentLoad = ref(null);

6
src/views/ShippersView.vue
View File

@@ -17,7 +17,7 @@
const selectedCities = ref([]);
const filterQuery = ref([]);
const limit = 3;
const limit = 5;
onMounted(() => {
filterQuery.value.company_type = 'shipper';
@@ -102,9 +102,9 @@
}
const clearRequest = () => {
filterQuery.value.page = "page="+ 1;
filterQuery.value.page = "page="+ 0;
filterQuery.value.limit = "elements="+ limit;
currentPage.value = 1;
currentCompaniesPage.value = 0;
}
const clearState = () => {

3
src/views/UsersView.vue
View File

@@ -5,8 +5,10 @@
import { useCompanyStore } from '../stores/company';
import CreateUserModal from '../components/CreateUserModal.vue';
import Pagination from '../components/Pagination.vue';
import { useAuthStore } from '../stores/auth';
const companyStore = useCompanyStore();
const authStore = useAuthStore();
onMounted(() => {
getInitData();
@@ -54,6 +56,7 @@
<h2 class="title mb-4">Usuarios</h2>
<div class="btn-row mb-4">
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn-primary-sm"
data-toggle="modal"
data-target="#userModal"

2
src/views/VehiclesView.vue
View File

@@ -21,7 +21,7 @@
const editStatusVehicle = ref(false);
const editDriverVehicle = ref(false);
const limit = 2;
const limit = 3;
onMounted(() => {
getInitData();