wbuezas
/
salix-front-mindshore-fork2
forked from verdnatura/salix-front
0
0
Fork 0
Code Pull Requests Activity

Update routes list input

This commit is contained in:
Kevin Martinez 2024-02-28 21:21:07 -03:00
parent 4be9c02711
commit e93864e967
1 changed files with 118 additions and 191 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

179
src/pages/Route/RouteList.vue
View File

@ -3,7 +3,7 @@ import VnPaginate from 'components/ui/VnPaginate.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { computed, onMounted, onUnmounted, ref } from 'vue'; import { computed, onMounted, onUnmounted, ref } from 'vue';
import { dashIfEmpty, toDate, toHour } from 'src/filters'; import { dashIfEmpty, toHour } from 'src/filters';
import VnSelectFilter from 'components/common/VnSelectFilter.vue'; import VnSelectFilter from 'components/common/VnSelectFilter.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import { useValidator } from 'composables/useValidator'; import { useValidator } from 'composables/useValidator';
@ -37,7 +37,7 @@ const columns = computed(() => [
label: t('ID'), label: t('ID'),
field: (row) => row.id, field: (row) => row.id,
sortable: true, sortable: true,
align: 'left', align: 'center',
}, },
{ {
name: 'worker', name: 'worker',
@ -72,7 +72,7 @@ const columns = computed(() => [
label: 'm³', label: 'm³',
field: (row) => dashIfEmpty(row.m3), field: (row) => dashIfEmpty(row.m3),
sortable: true, sortable: true,
align: 'left', align: 'center',
}, },
{ {
name: 'description', name: 'description',
@ -115,24 +115,6 @@ const updateRoute = async (route) => {
} }
}; };
const updateVehicle = (row, vehicle) => {
row.vehicleFk = vehicle.id;
row.vehiclePlateNumber = vehicle.numberPlate;
updateRoute(row);
};
const updateAgency = (row, agency) => {
row.agencyModeFk = agency.id;
row.agencyName = agency.name;
updateRoute(row);
};
const updateWorker = (row, worker) => {
row.workerFk = worker.id;
row.workerUserName = worker.name;
updateRoute(row);
};
const confirmationDialog = ref(false); const confirmationDialog = ref(false);
const startingDate = ref(null); const startingDate = ref(null);
@ -241,7 +223,7 @@ const openTicketsDialog = (id) => {
/> />
<FetchData url="AgencyModes" @on-fetch="(data) => (agencyList = data)" auto-load /> <FetchData url="AgencyModes" @on-fetch="(data) => (agencyList = data)" auto-load />
<FetchData url="Vehicles" @on-fetch="(data) => (vehicleList = data)" auto-load /> <FetchData url="Vehicles" @on-fetch="(data) => (vehicleList = data)" auto-load />
<QPage class="column items-center q-mb-xl"> <QPage class="column items-center">
<VnSubToolbar class="bg-vn-dark justify-end"> <VnSubToolbar class="bg-vn-dark justify-end">
<template #st-actions> <template #st-actions>
<QBtn <QBtn
@ -294,31 +276,22 @@ const openTicketsDialog = (id) => {
:rows-per-page-options="[0]" :rows-per-page-options="[0]"
hide-pagination hide-pagination
:pagination="{ sortBy: 'ID', descending: true }" :pagination="{ sortBy: 'ID', descending: true }"
:no-data-label="t('No results')"
> >
<template #body-cell-worker="props"> <template #body-cell-worker="{ row }">
<QTd :props="props"> <QTd>
{{ props.row?.workerUserName }}
<QPopupEdit
:model-value="props.row.workerFk"
v-slot="scope"
buttons
@update:model-value="
(worker) => updateWorker(props.row, worker)
"
>
<VnSelectFilter <VnSelectFilter
:label="t('Worker')" :label="t('Worker')"
v-model="scope.value" v-model="row.workerFk"
:options="workers" :options="workers"
option-value="id" option-value="id"
option-label="name" option-label="name"
hide-selected hide-selected
autofocus dense
:emit-value="false" :emit-value="false"
:rules="validate('Route.workerFk')" :rules="validate('Route.workerFk')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" @update:model-value="updateRoute(row)"
@focus="($event) => $event.target.select()"
> >
<template #option="{ opt, itemProps }"> <template #option="{ opt, itemProps }">
<QItem <QItem
@ -336,147 +309,92 @@ const openTicketsDialog = (id) => {
</QItem> </QItem>
</template> </template>
</VnSelectFilter> </VnSelectFilter>
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-agency="props"> <template #body-cell-agency="{ row }">
<QTd :props="props"> <QTd>
{{ props.row?.agencyName }}
<QPopupEdit
:model-value="props.row.agencyModeFk"
v-slot="scope"
buttons
@update:model-value="
(agency) => updateAgency(props.row, agency)
"
>
<VnSelectFilter <VnSelectFilter
:label="t('Agency')" :label="t('Agency')"
v-model="scope.value" v-model="row.agencyModeFk"
:options="agencyList" :options="agencyList"
option-value="id" option-value="id"
option-label="name" option-label="name"
hide-selected hide-selected
autofocus dense
:emit-value="false" :emit-value="false"
:rules="validate('route.agencyFk')" :rules="validate('route.agencyFk')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" @update:model-value="updateRoute(row)"
@focus="($event) => $event.target.select()"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-vehicle="props"> <template #body-cell-vehicle="{ row }">
<QTd :props="props"> <QTd>
{{ props.row?.vehiclePlateNumber }}
<QPopupEdit
:model-value="props.row.vehicleFk"
v-slot="scope"
buttons
@update:model-value="
(vehicle) => updateVehicle(props.row, vehicle)
"
>
<VnSelectFilter <VnSelectFilter
:label="t('Vehicle')" :label="t('Vehicle')"
v-model="scope.value" v-model="row.vehicleFk"
:options="vehicleList" :options="vehicleList"
option-value="id" option-value="id"
option-label="numberPlate" option-label="numberPlate"
hide-selected hide-selected
autofocus dense
:emit-value="false" :emit-value="false"
:rules="validate('route.vehicleFk')" :rules="validate('route.vehicleFk')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" @update:model-value="updateRoute(row)"
@focus="($event) => $event.target.select()"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-date="props"> <template #body-cell-date="{ row }">
<QTd :props="props"> <QTd class="table-input-cell">
{{ toDate(props.row?.created) }}
<QPopupEdit
v-model="props.row.created"
v-slot="scope"
@update:model-value="updateRoute(props.row)"
buttons
>
<VnInputDate <VnInputDate
v-model="scope.value" v-model="row.created"
autofocus hide-bottom-space
dense
:label="t('Date')" :label="t('Date')"
:rules="validate('route.created')" :rules="validate('route.created')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" @update:model-value="updateRoute(row)"
@focus="($event) => $event.target.select()"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-description="props"> <template #body-cell-description="{ row }">
<QTd :props="props"> <QTd class="table-input-cell">
{{ props.row?.description }}
<QPopupEdit
v-model="props.row.description"
v-slot="scope"
@update:model-value="updateRoute(props.row)"
buttons
>
<VnInput <VnInput
v-model="scope.value" v-model="row.description"
autofocus
:label="t('Description')" :label="t('Description')"
:rules="validate('route.description')" :rules="validate('route.description')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" dense
@focus="($event) => $event.target.select()" @update:model-value="updateRoute(row)"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-started="props"> <template #body-cell-started="{ row }">
<QTd :props="props"> <QTd class="table-input-cell">
{{ toHour(props.row.started) }}
<QPopupEdit
v-model="props.row.started"
v-slot="scope"
buttons
@update:model-value="updateRoute(props.row)"
>
<VnInputTime <VnInputTime
v-model="scope.value" v-model="row.started"
autofocus
:label="t('Hour started')" :label="t('Hour started')"
:rules="validate('route.started')" :rules="validate('route.started')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" hide-bottom-space
@focus="($event) => $event.target.select()" dense
@update:model-value="updateRoute(row)"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-finished="props"> <template #body-cell-finished="{ row }">
<QTd :props="props"> <QTd class="table-input-cell">
{{ toHour(props.row.finished) }}
<QPopupEdit
v-model="props.row.finished"
v-slot="scope"
buttons
@update:model-value="updateRoute(props.row)"
>
<VnInputTime <VnInputTime
v-model="scope.value" v-model="row.finished"
autofocus autofocus
:label="t('Hour finished')" :label="t('Hour finished')"
:rules="validate('route.finished')" :rules="validate('route.finished')"
:is-clearable="false" :is-clearable="false"
@keyup.enter="scope.set" hide-bottom-space
@focus="($event) => $event.target.select()" dense
@update:model-value="updateRoute(row)"
/> />
</QPopupEdit>
</QTd> </QTd>
</template> </template>
<template #body-cell-actions="props"> <template #body-cell-actions="props">
@ -508,7 +426,11 @@ const openTicketsDialog = (id) => {
params: { id: props?.row?.id }, params: { id: props?.row?.id },
}" }"
> >
<QIcon name="vn:eye" size="xs" color="primary"> <QIcon
name="vn:eye"
size="xs"
color="primary"
>
<QTooltip>{{ t('Summary') }}</QTooltip> <QTooltip>{{ t('Summary') }}</QTooltip>
</QIcon> </QIcon>
</RouterLink> </RouterLink>
@ -532,8 +454,13 @@ const openTicketsDialog = (id) => {
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.table-input-cell {
min-width: 150px;
}
.route-list { .route-list {
width: 100%; width: 100%;
max-height: 100%;
} }
.table-actions { .table-actions {