verdnatura/salix-front
verdnatura
/
salix-front
1
2
Fork 1
Code Issues Pull Requests 62 Releases Wiki Activity

feat: refs #6321 update

This commit is contained in:
Javier Segarra 2024-09-24 13:54:58 +02:00
parent d0eb1d97ac
commit 7da3f132ea
10 changed files with 119 additions and 367 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
quasar.config.js
View File

@ -29,8 +29,16 @@ module.exports = configure(function (/* ctx */) {
// app boot file (/src/boot)
// --> boot files are part of "main.js"
// https://v2.quasar.dev/quasar-cli/boot-files
boot: ['i18n', 'axios', 'vnDate', 'validations', 'quasar', 'quasar.defaults'],
boot: [
'i18n',
'axios',
'vnDate',
'validations',
'quasar',
'quasar.defaults',
'global-components',
],
importStrategy: 'auto',
// https://v2.quasar.dev/quasar-cli-vite/quasar-config-js#css
css: ['app.scss'],

13
src/boot/global-components.js Normal file
View File

@ -0,0 +1,13 @@
// src/boot/global-components.js
import { defineAsyncComponent } from 'vue';
const components = import.meta.glob('src/components/**/*.vue');
export default ({ app }) => {
for (const path in components) {
const componentName = path
.split('/')
.pop()
.replace(/\.\w+$/, '');
app.component(componentName, defineAsyncComponent(components[path]));
}
};

11
src/components/ui/VnStockValueDisplay.vue
View File

@ -17,8 +17,12 @@ const props = defineProps({
},
});
const valueClass = computed(() => (props.value > 0 ? 'positive' : 'negative'));
const iconName = computed(() => (props.value > 0 ? 'arrow_upward' : 'arrow_downward'));
const valueClass = computed(() =>
props.value === 0 ? 'neutral' : props.value > 0 ? 'positive' : 'negative'
);
const iconName = computed(() =>
props.value === 0 ? 'equal' : props.value > 0 ? 'arrow_upward' : 'arrow_downward'
);
const formattedValue = computed(() => props.value);
</script>
@ -29,6 +33,9 @@ const formattedValue = computed(() => props.value);
.negative {
color: red;
}
.neutral {
color: orange;
}
.value-icon {
margin-right: 4px;
}

79
src/pages/Item/components/ItemProposal.vue
View File

@ -23,11 +23,6 @@ const gradientStyle = (value) =>
)}, ${colorSpacer} 10%)`;
const $props = defineProps({
item: {
type: Object,
required: true,
default: () => {},
},
itemLack: {
type: Object,
required: true,
@ -38,7 +33,7 @@ const $props = defineProps({
required: false,
default: false,
},
tickets: {
sales: {
type: Array,
required: false,
default: () => [],
@ -47,15 +42,19 @@ const $props = defineProps({
const proposalSelected = ref([]);
const quantity = ref(-1);
const defaultColumnAttrs = {
align: 'left',
align: 'center',
sortable: true,
};
const ticket = computed(() => $props.tickets[0]);
const ticket = computed(() => $props.sales[0]);
const saleFk = computed(() => ticket.value.saleFk);
const statusConditionalValue = (row) => {
const total = MATCH_VALUES.reduce((acc, i) => acc + row[`match${i}`], 0);
return total;
};
const popupProxyRef = ref(null);
const proposalTableRef = ref(null);
const emit = defineEmits(['onDialogClosed', 'itemReplaced']);
const conditionalValuePrice = (price) => (price > 1.3 ? 'match' : 'not-match');
const columns = computed(() => [
{
@ -63,18 +62,13 @@ const columns = computed(() => [
label: t('proposal.available'),
name: 'available',
field: 'available',
component: 'input',
type: 'number',
class: 'shrink',
},
{
...defaultColumnAttrs,
label: t('proposal.difference'),
name: 'difference',
component: 'input',
type: 'number',
class: 'shrink',
style: 'background-color:red;max-width: 75px',
style: 'max-width: 75px',
},
{
...defaultColumnAttrs,
@ -88,9 +82,6 @@ const columns = computed(() => [
label: t('proposal.counter'),
name: 'counter',
field: 'counter',
component: 'input',
type: 'number',
class: 'shrink',
},
{
@ -107,9 +98,6 @@ const columns = computed(() => [
...defaultColumnAttrs,
label: t('proposal.price2'),
name: 'price2',
field: 'price2',
component: 'input',
type: 'number',
class: 'shrink',
},
{
@ -131,12 +119,18 @@ const columns = computed(() => [
async function confirm() {
try {
const params = {
saleFk: saleFk.value,
newItemFK: proposalSelected.value[0].id,
quantity: quantity.value,
};
// const params = {
// saleFk: saleFk.value,
// substitutionFk: proposalSelected.value[0].id,
// quantity: quantity.value,
// };
// const { data } = await axios.post('Sales/replaceItem', params);
const params = [saleFk.value, proposalSelected.value[0].id, quantity.value];
const { data } = await axios.post('Applications/sale_replaceItem/execute-proc', {
schema: 'vn',
params,
});
proposalTableRef.value.reload();
emit('itemReplaced', {
type: 'refresh',
itemProposal: proposalSelected.value[0],
@ -149,8 +143,6 @@ async function confirm() {
}
}
// const { dialogRef, onDialogOK, onDialogCancel } = useDialogPluginComponent();
const popupProxyRef = ref(null);
const emit = defineEmits(['onDialogClosed', 'itemReplaced']);
// function onDialogClose() {
// console.log('Dialog has been closed');
@ -161,16 +153,20 @@ onUnmounted(() => {});
function handleSelection(value, _) {
quantity.value = value.available;
}
const isSelectionAvailable = (data) => {
if (!data?.row) return false;
const { row } = data;
return $props.replaceAction && row.available >= $props.itemLack.lack * -1;
};
// const isSelectionAvailable = (data) => {
// if (!data?.row) return false;
// const { row } = data;
// return $props.replaceAction && row.available >= Math.abs($props.itemLack.lack);
// };
// watch(proposalSelected, ({ available }) => (quantity.value = available));
</script>
<template>
<div style="min-width: 65vw">
{{ sales }}
<br />
{{ itemLack }}
<VnTable
ref="proposalTableRef"
data-key="ItemsGetSimilar"
url="Items/getSimilar"
:filter="{
@ -194,10 +190,9 @@ const isSelectionAvailable = (data) => {
}"
>
<template #top-left>
<div v-if="$props.replaceAction" style="display: flex">
<div v-if="$props.replaceAction" class="q-ml-xs" style="display: flex">
<QBtn
:label="t('globals.replace')"
class="q-py-xs"
color="primary"
:loading="isLoading"
@click="confirm"
@ -216,10 +211,10 @@ const isSelectionAvailable = (data) => {
/></div
></template>
<template #body-selection="props">
<!-- {{ isSelectionAvailable(props) }} -->
<QCheckbox
class="q-ma-xs"
flat
v-if="isSelectionAvailable(props)"
v-model="props.selected"
@update:model-value="(evt, _) => handleSelection(props.row, null)"
>
@ -231,9 +226,11 @@ const isSelectionAvailable = (data) => {
{{ row.id }}
</QTooltip>
<!-- <QBtn flat color="blue" dense>{{ }}</QBtn> -->
<p class="link">{{ row.longName }}</p>
<span class="link">{{ row.longName }}</span>
<ItemDescriptorProxy :id="row.id" />
<div style="display: flex">
<div style="display: flex; flex-direction: row">
<div style="display: flex; flex-direction: column">
<span style="font-size: xx-small">{{ row.price2 }}</span>
<VnImg
:id="row.id"
spinner-color="primary"
@ -242,8 +239,12 @@ const isSelectionAvailable = (data) => {
width="50px"
class="image remove-bg"
/>
<span style="font-size: xx-small">ID: {{ row.id }}</span>
</div>
<div style="display: flex; align-items: center">
<FetchedTags :item="row" />
</div>
</div>
<!-- </QTd> -->
</template>
<template #column-status="{ row }">
@ -265,9 +266,7 @@ const isSelectionAvailable = (data) => {
}}</span>
</template>
<template #column-difference="{ row }">
<QTd style="width: 75px; background-color: red"
><VnStockValueDisplay :value="row.id % 2 === 0 ? 10 : -10"
/></QTd>
<VnStockValueDisplay :value="sales[0].price - row.price2" />
</template>
</VnTable>
</div>

15
src/pages/Item/components/ItemProposalProxy.vue
View File

@ -6,11 +6,6 @@ import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
const emit = defineEmits(['onDialogClosed', 'itemReplaced']);
const $props = defineProps({
item: {
type: Object,
required: true,
default: () => {},
},
itemLack: {
type: Object,
required: true,
@ -21,7 +16,7 @@ const $props = defineProps({
required: false,
default: false,
},
tickets: {
sales: {
type: Array,
required: false,
default: () => [],
@ -37,12 +32,12 @@ const $props = defineProps({
<QBtn icon="close" flat round dense v-close-popup />
</QCardSection>
<QCardSection class="row items-center">
<VnImg :id="item.id" class="rounded image-wrapper"></VnImg>
<VnImg :id="itemLack.id" class="rounded image-wrapper"></VnImg>
<QBtn flat class="link text-blue">
{{ item.longName }}
<ItemDescriptorProxy :id="item.id" />
{{ itemLack.longName }}
<ItemDescriptorProxy :id="itemLack.id" />
</QBtn>
<FetchedTags :item="item" />
<FetchedTags :item="itemLack" />
<!-- {{ tickets[0].saleFk }} -->
</QCardSection>

1
src/pages/Item/locale/en.yml
View File

@ -89,6 +89,7 @@ itemType:
category: Category
temperature: Temperature
proposal:
difference: Difference
title: Items proposal
itemFk: Item
longName: Name

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

@ -1,41 +1,20 @@
<script setup>
import { computed, ref, watch } from 'vue';
import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useSession } from 'composables/useSession';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { useQuasar } from 'quasar';
import { toDate } from 'src/filters';
import { useRouter } from 'vue-router';
import { toHour } from 'src/filters';
import axios from 'axios';
import RouteSearchbar from 'pages/Route/Card/RouteSearchbar.vue';
import RouteListTicketsDialog from 'pages/Route/Card/RouteListTicketsDialog.vue';
import RouteSummary from 'pages/Route/Card/RouteSummary.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
import RouteFilter from 'pages/Route/Card/RouteFilter.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import VnTable from 'components/VnTable/VnTable.vue';
import { usePrintService } from 'src/composables/usePrintService';
const $props = defineProps({
filter: {
type: Object,
default: () => ({}),
},
});
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
const { openReport } = usePrintService();
const { t } = useI18n();
const { viewSummary } = useSummaryDialog();
const quasar = useQuasar();
const session = useSession();
const selectedRows = ref([]);
const tableRef = ref([]);
const confirmationDialog = ref(false);
const startingDate = ref(null);
const router = useRouter();
const filterLack = ref({
const routeFilter = {
include: [
{
relation: 'workers',
@ -44,17 +23,16 @@ const filterLack = ref({
},
},
],
where: { alertLevel: 'FREE' },
});
};
const columns = computed(() => [
{
align: 'left',
isId: true,
name: 'id',
label: 'Id',
chip: {
condition: () => true,
},
isId: true,
columnFilter: false,
},
{
@ -62,138 +40,52 @@ const columns = computed(() => [
name: 'workerFk',
label: t('Worker'),
create: true,
component: 'select',
attrs: {
url: 'Workers/activeWithInheritedRole',
fields: ['id', 'name'],
useLike: false,
optionFilter: 'firstName',
find: {
value: 'workerFk',
label: 'workerUserName',
},
},
columnFilter: {
inWhere: true,
},
useLike: false,
cardVisible: true,
format: (row, dashIfEmpty) => dashIfEmpty(row.travelRef),
columnFilter: false,
},
{
align: 'left',
name: 'agencyModeFk',
name: 'agencyName',
label: t('Agency'),
isTitle: true,
cardVisible: true,
create: true,
component: 'select',
attrs: {
url: 'agencyModes',
fields: ['id', 'name'],
find: {
value: 'agencyModeFk',
label: 'agencyName',
},
},
columnClass: 'expand',
columnFilter: false,
},
{
align: 'left',
name: 'vehicleFk',
name: 'vehiclePlateNumber',
label: t('Vehicle'),
cardVisible: true,
create: true,
component: 'select',
attrs: {
url: 'vehicles',
fields: ['id', 'numberPlate'],
optionLabel: 'numberPlate',
optionFilterValue: 'numberPlate',
find: {
value: 'vehicleFk',
label: 'vehiclePlateNumber',
},
},
columnFilter: {
inWhere: true,
},
},
{
align: 'left',
name: 'created',
label: t('Date'),
columnFilter: false,
cardVisible: true,
create: true,
component: 'date',
format: ({ date }) => toDate(date),
},
{
align: 'left',
name: 'from',
label: t('From'),
visible: false,
cardVisible: true,
create: true,
component: 'date',
format: ({ date }) => toDate(date),
},
{
align: 'left',
name: 'to',
label: t('To'),
visible: false,
cardVisible: true,
create: true,
component: 'date',
format: ({ date }) => toDate(date),
},
{
align: 'center',
name: 'm3',
label: t('Volume'),
cardVisible: true,
columnClass: 'shrink',
},
{
align: 'left',
name: 'started',
label: t('hourStarted'),
component: 'time',
cardVisible: true,
columnFilter: false,
format: (row) => toHour(row.started),
},
{
align: 'left',
name: 'finished',
label: t('hourFinished'),
component: 'time',
cardVisible: true,
columnFilter: false,
},
{
align: 'center',
name: 'kmStart',
label: t('KmStart'),
columnClass: 'shrink',
create: true,
visible: false,
},
{
align: 'center',
name: 'kmEnd',
label: t('KmEnd'),
columnClass: 'shrink',
create: true,
visible: false,
format: (row) => toHour(row.started),
},
{
align: 'left',
name: 'description',
label: t('Description'),
cardVisible: true,
isTitle: true,
create: true,
component: 'input',
field: 'description',
columnFilter: false,
},
{
align: 'left',
@ -207,212 +99,53 @@ const columns = computed(() => [
align: 'right',
name: 'tableActions',
actions: [
{
title: t('Add tickets'),
icon: 'vn:ticketAdd',
action: (row) => openTicketsDialog(row?.id),
},
{
title: t('components.smartCard.viewSummary'),
icon: 'preview',
action: (row) => viewSummary(row?.id, RouteSummary),
},
{
title: t('Route summary'),
icon: 'arrow_forward',
isPrimary: true,
action: (row) => navigate(row?.id),
color: 'primary',
},
],
},
]);
watch($props.filter, (v) => (filterLack.value.where = v));
function navigate(id) {
router.push({ path: `/route/${id}` });
}
const cloneRoutes = () => {
if (!selectedRows.value.length || !startingDate.value) return;
axios.post('Routes/clone', {
created: startingDate.value,
ids: selectedRows.value.map((row) => row?.id),
});
startingDate.value = null;
tableRef.value.reload();
};
const showRouteReport = () => {
const ids = selectedRows.value.map((row) => row?.id);
const idString = ids.join(',');
let url = `Routes/${idString}/driver-route-pdf`;
let params = {};
if (selectedRows.value.length >= 1) {
params = {
id: idString,
};
url = `Routes/downloadZip`;
}
openReport(url, params, '_blank');
};
function markAsServed() {
selectedRows.value.forEach(async (row) => {
await axios.patch(`Routes/${row?.id}`, { isOk: true });
});
tableRef.value.reload();
startingDate.value = null;
}
const openTicketsDialog = (id) => {
quasar
.dialog({
component: RouteListTicketsDialog,
componentProps: {
id,
},
})
.onOk(() => tableRef.value.reload());
};
</script>
<template>
<RouteSearchbar />
<QDialog v-model="confirmationDialog">
<QCard style="min-width: 350px">
<QCardSection>
<p class="text-h6 q-ma-none">{{ t('Select the starting date') }}</p>
</QCardSection>
<QCardSection class="q-pt-none">
<VnInputDate
:label="t('Stating date')"
v-model="startingDate"
autofocus
/>
</QCardSection>
<QCardActions align="right">
<QBtn flat :label="t('Cancel')" v-close-popup class="text-primary" />
<QBtn color="primary" v-close-popup @click="cloneRoutes">
{{ t('globals.clone') }}
</QBtn>
</QCardActions>
</QCard>
</QDialog>
<VnSubToolbar />
<RightMenu>
<template #right-panel>
<RouteFilter data-key="RouteList" />
</template>
</RightMenu>
<VnTable
class="route-list"
ref="tableRef"
data-key="RouteList"
url="Routes/filter"
:columns="columns"
:right-search="false"
:is-editable="true"
:filter="filterLack"
:filter="routeFilter"
redirect="route"
:row-click="false"
:create="{
urlCreate: 'Routes',
title: t('Create route'),
onDataSaved: ({ id }) => tableRef.redirect(id),
formInitialData: {},
}"
save-url="Routes/crud"
:disable-option="{ card: true }"
table-height="85vh"
v-model:selected="selectedRows"
:table="{
'row-key': 'id',
selection: 'multiple',
}"
>
<template #moreBeforeActions>
<QBtn
icon="vn:clone"
color="primary"
class="q-mr-sm"
:disable="!selectedRows?.length"
@click="confirmationDialog = true"
>
<QTooltip>{{ t('Clone Selected Routes') }}</QTooltip>
</QBtn>
<QBtn
icon="cloud_download"
color="primary"
class="q-mr-sm"
:disable="!selectedRows?.length"
@click="showRouteReport"
>
<QTooltip>{{ t('Download selected routes as PDF') }}</QTooltip>
</QBtn>
<QBtn
icon="check"
color="primary"
class="q-mr-sm"
:disable="!selectedRows?.length"
@click="markAsServed()"
>
<QTooltip>{{ t('Mark as served') }}</QTooltip>
</QBtn>
<template #column-workerFk="{ row }">
<span class="link" @click.stop>
{{ row?.workerUserName }}
<WorkerDescriptorProxy :id="row?.workerFk" v-if="row?.workerFk" />
</span>
</template>
</VnTable>
</template>
<style lang="scss" scoped>
.table-input-cell {
max-width: 143px;
}
.route-list {
width: 100%;
max-height: 100%;
}
.table-actions {
gap: 12px;
}
th:last-child,
td:last-child {
background-color: var(--vn-section-color);
position: sticky;
right: 0;
}
</style>
<i18n>
en:
newRoute: New Route
hourStarted: Started hour
hourFinished: Finished hour
es:
From: Desde
To: Hasta
Worker: Trabajador
Agency: Agencia
Vehicle: Vehículo
Volume: Volumen
Date: Fecha
Description: Descripción
Hour started: Hora inicio
Hour finished: Hora fin
KmStart: Km inicio
KmEnd: Km fin
Served: Servida
newRoute: Nueva Ruta
Clone Selected Routes: Clonar rutas seleccionadas
Select the starting date: Seleccione la fecha de inicio
Stating date: Fecha de inicio
Cancel: Cancelar
Mark as served: Marcar como servidas
Download selected routes as PDF: Descargar rutas seleccionadas como PDF
Add ticket: Añadir tickets
Preview: Vista previa
Summary: Resumen
Route is closed: La ruta está cerrada
Route is not served: La ruta no está servida
hourStarted: Hora de inicio
hourFinished: Hora de fin
</i18n>

9
src/pages/Ticket/Negative/TicketLackDetail.vue
View File

@ -176,10 +176,9 @@ const itemProposalSelected = ref(null);
<QIcon name="import_export" class="rotate-90"></QIcon>
<ItemProposalProxy
ref="proposalDialogRef"
:item="item"
:item-lack="itemLack"
:replace-action="true"
:tickets="selectedRows"
:sales="selectedRows"
@item-replaced="itemProposalEvt"
></ItemProposalProxy>
<QTooltip bottom anchor="bottom right">
@ -217,13 +216,13 @@ const itemProposalSelected = ref(null);
:color="itemLack.lack === 0 ? 'green' : 'red'"
:label="itemLack.lack"
/>
<QBadge
<!-- <QBadge
color="secondary"
class="q-ml-xs q-mt-xs"
v-if="itemLack"
:label="toCurrency(itemLack.lack)"
:label="toCurrency(itemLack.quantity * itemLack.price)"
outline
/>
/> -->
</div>
<QBtn flat class="link text-blue">
{{ item.longName }}

4
src/pages/Ticket/Negative/TicketLackList.vue
View File

@ -2,18 +2,14 @@
import { computed, ref, reactive } from 'vue';
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
import VnTable from 'components/VnTable/VnTable.vue';
import NegativeOriginDialog from 'pages/Ticket/Negative/components/NegativeOriginDialog.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { onBeforeMount } from 'vue';
import { dashIfEmpty, toDate, toHour } from 'src/filters';
import { useRouter } from 'vue-router';
import { useState } from 'src/composables/useState';
import { useRole } from 'src/composables/useRole';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import RightMenu from 'src/components/common/RightMenu.vue';
const router = useRouter();
import VnImg from 'src/components/ui/VnImg.vue';
import TicketLackFilter from './TicketLackFilter.vue';
const stateStore = useStateStore();

11
src/pages/Ticket/Negative/TicketLackTable.vue
View File

@ -43,9 +43,9 @@ const { notify } = useNotify();
const route = useRoute();
const itemLack = ref(null);
const getInputEvents = (colField, props) => ({
'update:modelValue': () => saveChange(colField, props),
'keyup.enter': () => saveChange(colField, props),
const getInputEvents = ({ col, ...rows }) => ({
'update:modelValue': () => saveChange(col.name, rows),
'keyup.enter': () => saveChange(col.name, rows),
});
const saveChange = async (field, { rowIndex, row }) => {
try {
@ -175,8 +175,9 @@ const columns = computed(() => [
]);
const itemLackForm = ref();
const reload = async () => {
itemLackForm.value.fetch();
const reload = async (data) => {
// window.location.reload();
console.err(data);
};
defineExpose({ reload });
const emit = defineEmits(['update:selection']);