fixes: pagination & users permissions

This commit is contained in:
Alexandro Uc Santos
2024-03-13 21:39:26 -06:00
parent cbd076e887
commit c286da773e
18 changed files with 92 additions and 63 deletions

View File

@@ -151,6 +151,7 @@
</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"
@click="handleDeleteLoad"
><i class="fa-solid fa-ban clear-sm"></i> Cancelar</button>
@@ -164,6 +165,7 @@
Evidencias
</button>
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn-primary-sm"
data-toggle="modal" data-target="#formLoadModal"
@click="openEditModal"

View File

@@ -1,6 +1,7 @@
<script setup>
import Swal from 'sweetalert2';
import { useCompanyStore } from '../stores/company';
import { useAuthStore } from '../stores/auth';
const props = defineProps({
location: {
@@ -12,6 +13,7 @@
defineEmits(['set-location'])
const companyStore = useCompanyStore();
const authStore = useAuthStore();
const handleDeleteLocation = async() => {
Swal.fire({
@@ -70,7 +72,7 @@
{{ location.description }}
</div>
</div>
<div class="card-footer">
<div class="card-footer" v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'">
<button
class="btn btn-dark radius-sm"
@click="handleDeleteLocation"

View File

@@ -3,6 +3,7 @@
import { getDateMonthDay } from '../helpers/date_formats';
import { getStatusLoad } from '../helpers/status';
import { useCompanyStore } from '../stores/company';
import { useAuthStore } from '../stores/auth';
const props = defineProps({
proposal: {
@@ -12,6 +13,7 @@ import { getDateMonthDay } from '../helpers/date_formats';
})
const companyStore = useCompanyStore();
const authStore = useAuthStore();
const handleWithdrawnProposal = async() => {
@@ -104,7 +106,9 @@ import { getDateMonthDay } from '../helpers/date_formats';
<i class="fa-solid fa-ban"></i>
Retirado
</div>
<button v-else
<button
v-else
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
type="button"
class="btn btn-danger radius-sm"
@click="handleWithdrawnProposal"
@@ -113,6 +117,7 @@ import { getDateMonthDay } from '../helpers/date_formats';
Retirar
</button>
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn-primary-sm radius-sm"
@click="$emit('set-proposal', {proposal: proposal, modal: 'edit'})"
data-toggle="modal" data-target="#makeProposalModal"

View File

@@ -2,6 +2,7 @@
import Swal from 'sweetalert2';
import { getDateMonthDay } from '../helpers/date_formats';
import { useCompanyStore } from '../stores/company';
import { useAuthStore } from '../stores/auth';
const props = defineProps({
user: {
@@ -19,6 +20,7 @@
defineEmits(['set-user'])
const companyStore = useCompanyStore();
const authStore = useAuthStore();
const handleDelete = async() => {
Swal.fire({
@@ -66,7 +68,7 @@
<div class="card-fixed flex-column">
<div class="row">
<div class="col-lg-6 col-sm-12">
<p><span>Nombre de usuario:</span> {{user.name}}</p>
<p><span>Nombre de usuario:</span> {{user.first_name}} {{user.last_name}}</p>
<p v-if="user.employee_id"><span class="font-weight-bold mr-1">Número de registro:</span> {{user.employee_id}}</p>
<p><span>Teléfono 1: </span>{{user.phone}}</p>
<p><span>Teléfono 2: </span>{{user.phone2}}</p>
@@ -93,14 +95,14 @@
<p><span>Rol del usuario: </span>{{user.job_role}}</p>
</div>
</div>
<div class="btn-row" v-if="readonly === false">
<div class="btn-row" v-if="readonly === false && (authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager')">
<button
class="btn-primary-sm radius-sm"
data-toggle="modal"
data-target="#userModal"
@click="$emit('set-user')"
><i class="fa-solid fa-pen-to-square"></i> Editar</button>
<button
><i class="fa-solid fa-pen-to-square"></i> Editar</button>
<button
class="btn btn-dark radius-sm"
@click="handleDelete"
><i class="fa-solid fa-trash"></i> Eliminar</button>

View File

@@ -2,6 +2,7 @@
import Swal from 'sweetalert2';
import { getDateMonthDayEs } from '../helpers/date_formats';
import { useVehiclesStore } from '../stores/vehicles';
import { useAuthStore } from '../stores/auth';
const props = defineProps({
vehicle: {
@@ -13,6 +14,7 @@
defineEmits(['set-vehicle']);
const vehicleStore = useVehiclesStore();
const authStore = useAuthStore();
const handleDeleteVehicle = async() => {
Swal.fire({
@@ -102,12 +104,14 @@
</div>
<div class="card-footer">
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn btn-dark radius-sm"
@click="handleDeleteVehicle"
>
<i class="fa-solid fa-trash" /> <span class="clear-xsm">Eliminar</span>
</button>
<button
v-if="authStore.user?.job_role === 'owner' || authStore.user?.job_role === 'manager'"
class="btn-primary-sm radius-sm"
@click="$emit('set-vehicle', {vehicle: vehicle, modal: 'form'})"
data-toggle="modal"

View File

@@ -94,13 +94,15 @@
job_role: userForm.job_role,
permissions: authStore.user.permissions,
company: authStore.user.company,
categories: userForm.categories.length <= 0 ? null : userForm.categories?.map((e) => e._id),
categories: userForm.categories?.length <= 0 ? null : userForm.categories?.map((e) => e._id),
user_city: userForm.user_city?.length <= 0 ? null : userForm.user_city?.map((e) => e.city_name),
user_state: userForm.user_state?.length <= 0 ? null : userForm.user_state?.map((e) => e.state_name),
truck_type: userForm.truck_type?.length <= 0 ? null : userForm.truck_type?.map((e) => e.meta_value),
user_description: userForm.user_description
}
console.log(userData);
const dataUpdate = {
categories: userForm.categories,
name: userForm.name + ' ' + userForm.last_name
@@ -180,6 +182,8 @@
type="number"
v-model:field="userForm.phone"
:filled="false"
:step="1"
:error="errors.phone"
/>
<CustomInput
@@ -187,6 +191,7 @@
name="phone2"
type="number"
v-model:field="userForm.phone2"
:step="1"
:filled="false"
/>
<CustomInput
@@ -194,6 +199,7 @@
name="email"
type="email"
v-model:field="userForm.email"
:readonly="(props.user) ? true : false"
:filled="false"
:error="errors.email"
/>
@@ -206,8 +212,9 @@
v-model="userForm.job_role"
>
<option disabled value="">-- Seleccionar rol --</option>
<option value="owner">Dueño</option>
<!-- <option value="owner">Dueño</option> -->
<option value="manager">Gerente</option>
<option value="staff">Personal</option>
<option v-if="authStore.user?.permissions === 'role_carrier'" value="driver">Conductor</option>
</select>
</div>

View File

@@ -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';
<div class="box-pages" v-if="totalPage > 1">
<div
v-for="p in totalPage"
:class="[currentPage === p ? 'page page-active' : 'page']"
@click="setPage(p)"
:class="[currentPage === (p - 1) ? 'page page-active' : 'page']"
@click="setPage(p - 1)"
>
{{ p }}
</div>

View File

@@ -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"

View File

@@ -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;

View File

@@ -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;

View File

@@ -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;

View File

@@ -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;
}

View File

@@ -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 = () => {

View File

@@ -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) => {

View File

@@ -44,6 +44,7 @@ import { storeToRefs } from 'pinia';
<div class="header-info">
<h2>{{ company.company?.company_name }}</h2>
<button
v-if="auth.user?.job_role === 'owner'"
class="btn-primary-sm"
data-toggle="modal" data-target="#editcompanymodal"
><i class="fa-solid fa-pen-to-square"></i> Editar empresa</button>

View File

@@ -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;

View File

@@ -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;
}

View File

@@ -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;