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

Merge branch 'feature/SuppliersCorrections' of https://gitea.verdnatura.es/hyervoni/salix-front-mindshore into dev

This commit is contained in:
Alex Moreno 2024-02-02 07:30:57 +01:00
parent 90f5d8dbf3 25926e6660
commit 0ffff5ea1c
81 changed files with 4104 additions and 2913 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package-lock.json generated
View File

@ -12,6 +12,7 @@
"@quasar/extras": "^1.16.4", "@quasar/extras": "^1.16.4",
"axios": "^1.4.0", "axios": "^1.4.0",
"chromium": "^3.0.3", "chromium": "^3.0.3",
"croppie": "^2.6.5",
"pinia": "^2.1.3", "pinia": "^2.1.3",
"quasar": "^2.12.0", "quasar": "^2.12.0",
"validator": "^13.9.0", "validator": "^13.9.0",
@ -3169,6 +3170,11 @@
"node": ">= 10" "node": ">= 10"
} }
}, },
"node_modules/croppie": {
"version": "2.6.5",
"resolved": "https://registry.npmjs.org/croppie/-/croppie-2.6.5.tgz",
"integrity": "sha512-IlChnVUGG5T3w2gRZIaQgBtlvyuYnlUWs2YZIXXR3H9KrlO1PtBT3j+ykxvy9eZIWhk+V5SpBmhCQz5UXKrEKQ=="
},
"node_modules/cross-spawn": { "node_modules/cross-spawn": {
"version": "7.0.3", "version": "7.0.3",
"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz",

1
package.json
View File

@ -19,6 +19,7 @@
"@quasar/extras": "^1.16.4", "@quasar/extras": "^1.16.4",
"axios": "^1.4.0", "axios": "^1.4.0",
"chromium": "^3.0.3", "chromium": "^3.0.3",
"croppie": "^2.6.5",
"pinia": "^2.1.3", "pinia": "^2.1.3",
"quasar": "^2.12.0", "quasar": "^2.12.0",
"validator": "^13.9.0", "validator": "^13.9.0",

363
src/components/EditPictureForm.vue Normal file
View File

@ -0,0 +1,363 @@
<script setup>
import { reactive, computed, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue';
import Croppie from 'croppie/croppie';
import 'croppie/croppie.css';
import useNotify from 'src/composables/useNotify.js';
import axios from 'axios';
const emit = defineEmits(['closeForm', 'onPhotoUploaded']);
const props = defineProps({
id: {
type: String,
default: '',
},
collection: {
type: String,
default: '',
},
});
const { t } = useI18n();
const { notify } = useNotify();
const uploadMethodsOptions = [
{ label: t('Select from computer'), value: 'computer' },
{ label: t('Import from external URL'), value: 'URL' },
];
const viewportTypes = [
{
code: 'normal',
description: t('Normal'),
viewport: {
width: 400,
height: 400,
},
output: {
width: 1200,
height: 1200,
},
},
{
code: 'panoramic',
description: t('Panoramic'),
viewport: {
width: 675,
height: 450,
},
output: {
width: 1350,
height: 900,
},
},
{
code: 'vertical',
description: t('Vertical'),
viewport: {
width: 306.66,
height: 533.33,
},
output: {
width: 460,
height: 800,
},
},
];
const uploadMethodSelected = ref('computer');
const viewPortTypeSelected = ref(viewportTypes[0]);
const inputFileRef = ref(null);
const allowedContentTypes = ref('');
const photoContainerRef = ref(null);
const editor = ref(null);
const newPhoto = reactive({
id: props.id,
collection: props.collection,
file: null,
url: null,
blob: null,
});
const openInputFile = () => {
inputFileRef.value.pickFiles();
};
const displayEditor = () => {
const viewportType = viewPortTypeSelected.value;
const viewport = viewportType.viewport;
const boundaryWidth = viewport.width + 200;
const boundaryHeight = viewport.height + 200;
if (editor.value) editor.value.destroy();
editor.value = new Croppie(photoContainerRef.value, {
viewport: { width: viewport.width, height: viewport.height },
boundary: { width: boundaryWidth, height: boundaryHeight },
enableOrientation: true,
showZoomer: true,
});
};
const viewportSelection = computed({
get() {
return viewPortTypeSelected.value;
},
set(val) {
viewPortTypeSelected.value = val;
const hasFile = newPhoto.files || newPhoto.url;
if (!val || !hasFile) return;
let file;
if (uploadMethodSelected.value == 'computer') file = newPhoto.files;
else if (uploadMethodSelected.value == 'URL') file = newPhoto.url;
updatePhotoPreview(file);
},
});
const updatePhotoPreview = (value) => {
if (value) {
displayEditor();
if (uploadMethodSelected.value == 'computer') {
newPhoto.files = value;
const reader = new FileReader();
reader.onload = (e) => editor.value.bind({ url: e.target.result });
reader.readAsDataURL(value);
} else if (uploadMethodSelected.value == 'URL') {
newPhoto.url = value;
const img = new Image();
img.crossOrigin = 'Anonymous';
img.src = value;
img.onload = () => editor.value.bind({ url: value });
img.onerror = () => {
notify(
t("This photo provider doesn't allow remote downloads"),
'negative'
);
};
}
}
};
const rotateLeft = () => {
editor.value.rotate(90);
};
const rotateRight = () => {
editor.value.rotate(-90);
};
const onUploadAccept = () => {
try {
if (!newPhoto.files && !newPhoto.url) {
notify(t('Select an image'), 'negative');
return;
}
const options = {
type: 'blob',
};
editor.value
.result(options)
.then((result) => {
const file = new File([result], newPhoto.files?.name || '');
newPhoto.blob = file;
})
.then(() => makeRequest());
} catch (err) {
console.error('Error uploading image');
}
};
const makeRequest = async () => {
const formData = new FormData();
const now = Date.vnNew();
const timestamp = now.getTime();
const fileName = `${newPhoto.files?.name}_${timestamp}`;
formData.append('blob', newPhoto.blob, fileName);
await axios.post('Images/upload', formData, {
params: newPhoto,
headers: {
'Content-Type': 'multipart/form-data',
},
});
emit('closeForm');
emit('onPhotoUploaded');
notify(t('globals.dataSaved'), 'positive');
};
</script>
<template>
<FetchData
ref="allowTypesRef"
url="ImageContainers/allowedContentTypes"
@on-fetch="(data) => (allowedContentTypes = data.join(', '))"
auto-load
/>
<QForm @submit="onUploadAccept()" class="all-pointer-events">
<QCard class="q-pa-lg">
<span ref="closeButton" class="close-icon" v-close-popup>
<QIcon name="close" size="sm" />
</span>
<h1 class="title">{{ t('Edit photo') }}</h1>
<div class="row q-gutter-lg">
<div
v-show="newPhoto.files || newPhoto.url"
class="row q-gutter-lg items-center"
>
<QIcon
name="rotate_left"
size="sm"
color="primary"
class="cursor-pointer"
@click="rotateLeft()"
>
<!-- <QTooltip class="no-pointer-events">
{{ t('Rotate left') }}
</QTooltip> -->
</QIcon>
<div>
<div ref="photoContainerRef" />
</div>
<QIcon
name="rotate_right"
size="sm"
color="primary"
class="cursor-pointer"
@click="rotateRight()"
>
<!-- <QTooltip class="no-pointer-events">
{{ t('Rotate right') }}
</QTooltip> -->
</QIcon>
</div>
<div class="column">
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QOptionGroup
:options="uploadMethodsOptions"
type="radio"
v-model="uploadMethodSelected"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QFile
v-if="uploadMethodSelected === 'computer'"
ref="inputFileRef"
:label="t('File')"
:multiple="false"
v-model="newPhoto.files"
@update:model-value="updatePhotoPreview($event)"
:accept="allowedContentTypes"
class="required cursor-pointer"
>
<template #append>
<QIcon
name="vn:attach"
class="cursor-pointer q-mr-sm"
@click="openInputFile()"
>
<!-- <QTooltip>{{ t('Select a file') }}</QTooltip> -->
</QIcon>
<QIcon name="info" class="cursor-pointer">
<QTooltip>{{
t(
'components.editPictureForm.allowedFilesText',
{
allowedContentTypes:
allowedContentTypes,
}
)
}}</QTooltip>
</QIcon>
</template>
</QFile>
<VnInput
v-if="uploadMethodSelected === 'URL'"
v-model="newPhoto.url"
@update:model-value="updatePhotoPreview($event)"
placeholder="https://"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('Orientation')"
:options="viewportTypes"
hide-selected
option-label="description"
v-model="viewportSelection"
/>
</div>
</VnRow>
<div class="q-mt-lg row justify-end">
<QBtn
:label="t('globals.save')"
type="submit"
color="primary"
:disabled="isLoading"
:loading="isLoading"
/>
<QBtn
:label="t('globals.cancel')"
type="reset"
color="primary"
flat
class="q-ml-sm"
:disabled="isLoading"
:loading="isLoading"
v-close-popup
/>
</div>
</div>
</div>
</QCard>
</QForm>
</template>
<style lang="scss" scoped>
.title {
font-size: 17px;
font-weight: bold;
line-height: 20px;
}
.close-icon {
position: absolute;
top: 20px;
right: 20px;
cursor: pointer;
}
</style>
<i18n>
es:
Edit photo: Editar foto
Select from computer: Seleccionar desde ordenador
Import from external URL: Importar desde URL externa
Vertical: Vertical
Normal: Normal
Panoramic: Panorámica
Orientation: Orientación
File: Fichero
This photo provider doesn't allow remote downloads: Este proveedor de fotos no permite descargas remotas
Rotate left: Girar a la izquierda
Rotate right: Girar a la derecha
Select an image: Selecciona una imagen
</i18n>

9
src/components/FormModel.vue
View File

@ -75,9 +75,12 @@ onMounted(async () => {
await fetch(); await fetch();
} }
// Disparamos el watcher del form después de que se haya cargado la data inicial, si así se desea // Si así se desea disparamos el watcher del form después de 100ms, asi darle tiempo de que se haya cargado la data inicial
// para evitar que detecte cambios cuando es data inicial default
if ($props.observeFormChanges) { if ($props.observeFormChanges) {
setTimeout(() => {
startFormWatcher(); startFormWatcher();
}, 100);
} }
}); });
@ -128,14 +131,14 @@ async function save() {
try { try {
const body = $props.mapper ? $props.mapper(formData.value) : formData.value; const body = $props.mapper ? $props.mapper(formData.value) : formData.value;
let response let response;
if ($props.urlCreate) { if ($props.urlCreate) {
response = await axios.post($props.urlCreate, body); response = await axios.post($props.urlCreate, body);
notify('globals.dataCreated', 'positive'); notify('globals.dataCreated', 'positive');
} else { } else {
response = await axios.patch($props.urlUpdate || $props.url, body); response = await axios.patch($props.urlUpdate || $props.url, body);
} }
emit('onDataSaved', formData.value, response); emit('onDataSaved', formData.value, response?.data);
originalData.value = JSON.parse(JSON.stringify(formData.value)); originalData.value = JSON.parse(JSON.stringify(formData.value));
hasChanges.value = false; hasChanges.value = false;
} catch (err) { } catch (err) {

81
src/components/RegularizeStockForm.vue Normal file
View File

@ -0,0 +1,81 @@
<script setup>
import { reactive, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import FormModelPopup from './FormModelPopup.vue';
const emit = defineEmits(['onDataSaved']);
const props = defineProps({
itemFk: {
type: Number,
default: null,
},
warehouseFk: {
type: Boolean,
default: null,
},
});
const { t } = useI18n();
const regularizeFormData = reactive({
itemFk: props.itemFk,
warehouseFk: props.warehouseFk,
quantity: null,
});
const warehousesOptions = ref([]);
const onDataSaved = (data) => {
emit('onDataSaved', data);
};
</script>
<template>
<FetchData
url="Warehouses"
@on-fetch="(data) => (warehousesOptions = data)"
auto-load
/>
<FormModelPopup
url-create="Items/regularize"
model="Items"
:title="t('Regularize stock')"
:form-initial-data="regularizeFormData"
@on-data-saved="onDataSaved($event)"
>
<template #form-inputs="{ data }">
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QInput
:label="t('Type the visible quantity')"
v-model.number="data.quantity"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('Warehouse')"
v-model="data.warehouseFk"
:options="warehousesOptions"
option-value="id"
option-label="name"
hide-selected
/>
</div>
</VnRow>
</template>
</FormModelPopup>
</template>
<i18n>
es:
Warehouse: Almacén
Type the visible quantity: Introduce la cantidad visible
Regularize stock: Regularizar stock
</i18n>

40
src/components/common/VnInputTime.vue
View File

@ -1,8 +1,8 @@
<script setup> <script setup>
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { toHour } from 'src/filters'; import { toHour } from 'src/filters';
import {useI18n} from "vue-i18n"; import { useI18n } from 'vue-i18n';
import isValidDate from "filters/isValidDate"; import isValidDate from 'filters/isValidDate';
const props = defineProps({ const props = defineProps({
modelValue: { modelValue: {
@ -25,9 +25,14 @@ const value = computed({
return props.modelValue; return props.modelValue;
}, },
set(value) { set(value) {
const [hours, minutes] = value.split(':') const [hours, minutes] = value.split(':');
const date = new Date() const date = new Date();
date.setUTCHours(Number.parseInt(hours) || 0, Number.parseInt(minutes) || 0, 0, 0) date.setUTCHours(
Number.parseInt(hours) || 0,
Number.parseInt(minutes) || 0,
0,
0
);
emit('update:modelValue', value ? date.toISOString() : null); emit('update:modelValue', value ? date.toISOString() : null);
}, },
}); });
@ -41,13 +46,17 @@ const save = () => {
}; };
const formatTime = (dateString) => { const formatTime = (dateString) => {
if (!isValidDate(dateString)) { if (!isValidDate(dateString)) {
return '' return '';
} }
const date = new Date(dateString || ''); const date = new Date(dateString || '');
return `${date.getUTCHours().toString().padStart(2, '0')}:${date.getUTCMinutes().toString().padStart(2, '0')}`; return date.toLocaleTimeString([], {
hour: '2-digit',
minute: '2-digit',
});
}; };
const internalValue = ref(formatTime(value)) const internalValue = ref(formatTime(value));
const styleAttrs = computed(() => { const styleAttrs = computed(() => {
return props.isOutlined return props.isOutlined
@ -82,8 +91,19 @@ const styleAttrs = computed(() => {
@update:model-value="onDateUpdate" @update:model-value="onDateUpdate"
> >
<div class="row items-center justify-end q-gutter-sm"> <div class="row items-center justify-end q-gutter-sm">
<QBtn :label="t('Cancel')" color="primary" flat v-close-popup /> <QBtn
<QBtn label="Ok" color="primary" flat @click="save" v-close-popup /> :label="t('Cancel')"
color="primary"
flat
v-close-popup
/>
<QBtn
label="Ok"
color="primary"
flat
@click="save"
v-close-popup
/>
</div> </div>
</QTime> </QTime>
</QPopupProxy> </QPopupProxy>

2
src/components/common/VnLogFilter.vue
View File

@ -38,7 +38,6 @@ const workers = ref();
minimal minimal
> >
</QDate> </QDate>
<QList dense>
<QSeparator /> <QSeparator />
<QItem> <QItem>
<QItemSection v-if="!workers"> <QItemSection v-if="!workers">
@ -59,7 +58,6 @@ const workers = ref();
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

6
src/components/common/VnSelectFilter.vue
View File

@ -178,3 +178,9 @@ watch(modelValue, (newValue) => {
</template> </template>
</QSelect> </QSelect>
</template> </template>
<style scoped lang="scss">
.q-field--outlined {
max-width: 100%;
}
</style>

3
src/components/ui/CardDescriptor.vue
View File

@ -79,6 +79,7 @@ function viewSummary(id) {
<div class="descriptor"> <div class="descriptor">
<template v-if="entity"> <template v-if="entity">
<div class="header bg-primary q-pa-sm justify-between"> <div class="header bg-primary q-pa-sm justify-between">
<slot name="header-extra-action" />
<QBtn <QBtn
@click.stop="viewSummary(entity.id)" @click.stop="viewSummary(entity.id)"
round round
@ -116,7 +117,7 @@ function viewSummary(id) {
icon="more_vert" icon="more_vert"
round round
size="md" size="md"
v-if="slots.menu" :class="{ invisible: !slots.menu }"
> >
<QTooltip> <QTooltip>
{{ t('components.cardDescriptor.moreOptions') }} {{ t('components.cardDescriptor.moreOptions') }}

8
src/components/ui/VnFilterPanel.vue
View File

@ -220,7 +220,9 @@ function formatValue(value) {
</QItem> </QItem>
<QSeparator /> <QSeparator />
</QList> </QList>
<QList dense class="list q-gutter-y-sm q-mt-sm">
<slot name="body" :params="userParams" :search-fn="search"></slot> <slot name="body" :params="userParams" :search-fn="search"></slot>
</QList>
<template v-if="props.searchButton"> <template v-if="props.searchButton">
<QItem> <QItem>
<QItemSection class="q-py-sm"> <QItemSection class="q-py-sm">
@ -246,6 +248,12 @@ function formatValue(value) {
/> />
</template> </template>
<style scoped lang="scss">
.list {
width: 256px;
}
</style>
<i18n> <i18n>
es: es:
No filters applied: No se han aplicado filtros No filters applied: No se han aplicado filtros

2
src/composables/useState.js
View File

@ -25,6 +25,7 @@ export function useState() {
lang: user.value.lang, lang: user.value.lang,
darkMode: user.value.darkMode, darkMode: user.value.darkMode,
companyFk: user.value.companyFk, companyFk: user.value.companyFk,
warehouseFk: user.value.warehouseFk,
}; };
}); });
} }
@ -37,6 +38,7 @@ export function useState() {
lang: data.lang, lang: data.lang,
darkMode: data.darkMode, darkMode: data.darkMode,
companyFk: data.companyFk, companyFk: data.companyFk,
warehouseFk: data.warehouseFk,
}; };
} }

1
src/composables/useUserConfig.js
View File

@ -12,6 +12,7 @@ export function useUserConfig() {
const user = state.getUser().value; const user = state.getUser().value;
user.darkMode = data.darkMode; user.darkMode = data.darkMode;
user.companyFk = data.companyFk; user.companyFk = data.companyFk;
user.warehouseFk = data.warehouseFk;
state.setUser(user); state.setUser(user);
return data; return data;

9
src/css/app.scss
View File

@ -52,12 +52,21 @@ body.body--dark {
color: var(--vn-text); color: var(--vn-text);
} }
.color-vn-white {
color: $white;
}
.vn-card { .vn-card {
background-color: var(--vn-gray); background-color: var(--vn-gray);
color: var(--vn-text); color: var(--vn-text);
border-radius: 8px; border-radius: 8px;
} }
.vn-card-list {
width: 100%;
max-width: 60em;
}
/* Estilo para el asterisco en campos requeridos */ /* Estilo para el asterisco en campos requeridos */
.q-field.required .q-field__label:after { .q-field.required .q-field__label:after {
content: ' *'; content: ' *';

13
src/filters/toHour.js
View File

@ -4,13 +4,8 @@ export default function toHour(date) {
if (!isValidDate(date)) { if (!isValidDate(date)) {
return '--:--'; return '--:--';
} }
const dateHour = new Date(date); return (new Date(date || '')).toLocaleTimeString([], {
let hours = dateHour.getUTCHours(); hour: '2-digit',
hours = hours % 12; minute: '2-digit',
hours = hours ? hours : 12; });
let minutes = dateHour.getUTCMinutes();
minutes = minutes < 10 ? minutes.toString().padStart(2, '0') : minutes;
return `${hours}:${minutes} ${dateHour.getUTCHours() >= 12 ? 'PM' : 'AM'}`;
} }

23
src/i18n/en/index.js
View File

@ -1060,7 +1060,25 @@ export default {
totalEntries: 'Total entries', totalEntries: 'Total entries',
}, },
}, },
item: {
pageTitles: {
items: 'Items',
list: 'List',
diary: 'Diary',
tags: 'Tags',
},
descriptor: {
item: 'Item',
buyer: 'Buyer',
color: 'Color',
category: 'Category',
stems: 'Stems',
visible: 'Visible',
available: 'Available',
warehouseText: 'Calculated on the warehouse of { warehouseName }',
itemDiary: 'Item diary',
},
},
components: { components: {
topbar: {}, topbar: {},
userPanel: { userPanel: {
@ -1084,6 +1102,9 @@ export default {
addToPinned: 'Add to pinned', addToPinned: 'Add to pinned',
removeFromPinned: 'Remove from pinned', removeFromPinned: 'Remove from pinned',
}, },
editPictureForm: {
allowedFilesText: 'Allowed file types: { allowedContentTypes }',
},
VnLv: { VnLv: {
copyText: '{copyValue} has been copied to the clipboard', copyText: '{copyValue} has been copied to the clipboard',
}, },

22
src/i18n/es/index.js
View File

@ -1060,6 +1060,25 @@ export default {
totalEntries: 'Ent. totales', totalEntries: 'Ent. totales',
}, },
}, },
item: {
pageTitles: {
items: 'Artículos',
list: 'Listado',
diary: 'Histórico',
tags: 'Etiquetas',
},
descriptor: {
item: 'Artículo',
buyer: 'Comprador',
color: 'Color',
category: 'Categoría',
stems: 'Tallos',
visible: 'Visible',
available: 'Disponible',
warehouseText: 'Calculado sobre el almacén de { warehouseName }',
itemDiary: 'Registro de compra-venta',
},
},
components: { components: {
topbar: {}, topbar: {},
userPanel: { userPanel: {
@ -1083,6 +1102,9 @@ export default {
addToPinned: 'Añadir a fijados', addToPinned: 'Añadir a fijados',
removeFromPinned: 'Eliminar de fijados', removeFromPinned: 'Eliminar de fijados',
}, },
editPictureForm: {
allowedFilesText: 'Tipos de archivo permitidos: { allowedContentTypes }',
},
VnLv: { VnLv: {
copyText: '{copyValue} se ha copiado al portapepeles', copyText: '{copyValue} se ha copiado al portapepeles',
}, },

11
src/pages/Claim/ClaimFilter.vue
View File

@ -36,7 +36,6 @@ const states = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="list">
<QItem class="q-my-sm"> <QItem class="q-my-sm">
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -178,20 +177,10 @@ const states = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
</QExpansionItem> </QExpansionItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

9
src/pages/Claim/ClaimList.vue
View File

@ -71,7 +71,7 @@ function viewSummary(id) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="ClaimList" data-key="ClaimList"
url="Claims/filter" url="Claims/filter"
@ -147,13 +147,6 @@ function viewSummary(id) {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search claim: Buscar reclamación Search claim: Buscar reclamación

3
src/pages/Claim/ClaimRmaList.vue
View File

@ -84,7 +84,7 @@ async function remove({ id }) {
</QForm> </QForm>
</QCard> </QCard>
</QPageSticky> </QPageSticky>
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="ClaimRmaList" data-key="ClaimRmaList"
url="ClaimRmas" url="ClaimRmas"
@ -160,7 +160,6 @@ async function remove({ id }) {
padding-top: 156px; padding-top: 156px;
} }
.card-list,
.card { .card {
width: 100%; width: 100%;
max-width: 60em; max-width: 60em;

23
src/pages/Customer/CustomerFilter.vue
View File

@ -37,7 +37,6 @@ const zones = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="list">
<QItem class="q-my-sm"> <QItem class="q-my-sm">
<QItemSection> <QItemSection>
<VnInput :label="t('FI')" v-model="params.fi" is-outlined> <VnInput :label="t('FI')" v-model="params.fi" is-outlined>
@ -115,11 +114,7 @@ const zones = ref();
<QExpansionItem :label="t('More options')" expand-separator> <QExpansionItem :label="t('More options')" expand-separator>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput :label="t('Phone')" v-model="params.phone" is-outlined>
:label="t('Phone')"
v-model="params.phone"
is-outlined
>
<template #prepend> <template #prepend>
<QIcon name="phone" size="xs" /> <QIcon name="phone" size="xs" />
</template> </template>
@ -128,11 +123,7 @@ const zones = ref();
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput :label="t('Email')" v-model="params.email" is-outlined>
:label="t('Email')"
v-model="params.email"
is-outlined
>
<template #prepend> <template #prepend>
<QIcon name="email" size="sm" /> <QIcon name="email" size="sm" />
</template> </template>
@ -170,20 +161,10 @@ const zones = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
</QExpansionItem> </QExpansionItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

9
src/pages/Customer/CustomerList.vue
View File

@ -65,7 +65,7 @@ const redirectToCreateView = () => {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
auto-load auto-load
data-key="CustomerList" data-key="CustomerList"
@ -116,13 +116,6 @@ const redirectToCreateView = () => {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search customer: Buscar cliente Search customer: Buscar cliente

17
src/pages/Customer/Defaulter/CustomerDefaulterFilter.vue
View File

@ -46,7 +46,6 @@ const authors = ref();
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="list">
<QItem class="q-mb-sm q-mt-sm"> <QItem class="q-mb-sm q-mt-sm">
<QItemSection v-if="clients"> <QItemSection v-if="clients">
<VnSelectFilter <VnSelectFilter
@ -161,11 +160,7 @@ const authors = ref();
<QItem class="q-mb-sm"> <QItem class="q-mb-sm">
<QItemSection> <QItemSection>
<VnInput <VnInput :label="t('L. O. Date')" is-outlined v-model="params.date" />
:label="t('L. O. Date')"
is-outlined
v-model="params.date"
/>
</QItemSection> </QItemSection>
</QItem> </QItem>
@ -189,20 +184,10 @@ const authors = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
<QSeparator /> <QSeparator />
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

82
src/pages/Customer/ExtendedList/CustomerExtendedListFilter.vue
View File

@ -145,7 +145,6 @@ const shouldRenderColumn = (colName) => {
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="list q-gutter-y-sm q-mt-sm">
<QItem v-if="shouldRenderColumn('id')"> <QItem v-if="shouldRenderColumn('id')">
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -204,9 +203,7 @@ const shouldRenderColumn = (colName) => {
<QItemSection v-if="workers"> <QItemSection v-if="workers">
<VnSelectFilter <VnSelectFilter
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.salesPersonFk')
'customer.extendedList.tableVisibleColumns.salesPersonFk'
)
" "
v-model="params.salesPersonFk" v-model="params.salesPersonFk"
@update:model-value="searchFn()" @update:model-value="searchFn()"
@ -237,9 +234,7 @@ const shouldRenderColumn = (colName) => {
<QItemSection> <QItemSection>
<VnInput <VnInput
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.creditInsurance')
'customer.extendedList.tableVisibleColumns.creditInsurance'
)
" "
v-model="params.creditInsurance" v-model="params.creditInsurance"
is-outlined is-outlined
@ -276,9 +271,7 @@ const shouldRenderColumn = (colName) => {
<QItem v-if="shouldRenderColumn('countryFk')"> <QItem v-if="shouldRenderColumn('countryFk')">
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label=" :label="t('customer.extendedList.tableVisibleColumns.countryFk')"
t('customer.extendedList.tableVisibleColumns.countryFk')
"
v-model="params.countryFk" v-model="params.countryFk"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:options="countriesOptions" :options="countriesOptions"
@ -295,9 +288,7 @@ const shouldRenderColumn = (colName) => {
<QItem v-if="shouldRenderColumn('provinceFk')"> <QItem v-if="shouldRenderColumn('provinceFk')">
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label=" :label="t('customer.extendedList.tableVisibleColumns.provinceFk')"
t('customer.extendedList.tableVisibleColumns.provinceFk')
"
v-model="params.provinceFk" v-model="params.provinceFk"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:options="provincesOptions" :options="provincesOptions"
@ -323,9 +314,7 @@ const shouldRenderColumn = (colName) => {
<QItem v-if="shouldRenderColumn('postcode')"> <QItem v-if="shouldRenderColumn('postcode')">
<QItemSection> <QItemSection>
<VnInput <VnInput
:label=" :label="t('customer.extendedList.tableVisibleColumns.postcode')"
t('customer.extendedList.tableVisibleColumns.postcode')
"
v-model="params.postcode" v-model="params.postcode"
is-outlined is-outlined
/> />
@ -345,9 +334,7 @@ const shouldRenderColumn = (colName) => {
<QItemSection> <QItemSection>
<VnInputDate <VnInputDate
v-model="params.created" v-model="params.created"
:label=" :label="t('customer.extendedList.tableVisibleColumns.created')"
t('customer.extendedList.tableVisibleColumns.created')
"
@update:model-value="searchFn()" @update:model-value="searchFn()"
is-outlined is-outlined
/> />
@ -357,9 +344,7 @@ const shouldRenderColumn = (colName) => {
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.businessTypeFk')
'customer.extendedList.tableVisibleColumns.businessTypeFk'
)
" "
v-model="params.businessTypeFk" v-model="params.businessTypeFk"
:options="businessTypesOptions" :options="businessTypesOptions"
@ -397,9 +382,7 @@ const shouldRenderColumn = (colName) => {
<QItemSection> <QItemSection>
<VnSelectFilter <VnSelectFilter
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.sageTaxTypeFk')
'customer.extendedList.tableVisibleColumns.sageTaxTypeFk'
)
" "
v-model="params.sageTaxTypeFk" v-model="params.sageTaxTypeFk"
@update:model-value="searchFn()" @update:model-value="searchFn()"
@ -435,16 +418,12 @@ const shouldRenderColumn = (colName) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem <QItem v-if="shouldRenderColumn('isActive') || shouldRenderColumn('isVies')">
v-if="shouldRenderColumn('isActive') || shouldRenderColumn('isVies')"
>
<QItemSection v-if="shouldRenderColumn('isActive')"> <QItemSection v-if="shouldRenderColumn('isActive')">
<QCheckbox <QCheckbox
v-model="params.isActive" v-model="params.isActive"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="t('customer.extendedList.tableVisibleColumns.isActive')"
t('customer.extendedList.tableVisibleColumns.isActive')
"
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
/> />
@ -483,9 +462,7 @@ const shouldRenderColumn = (colName) => {
v-model="params.isEqualizated" v-model="params.isEqualizated"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.isEqualizated')
'customer.extendedList.tableVisibleColumns.isEqualizated'
)
" "
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
@ -494,17 +471,14 @@ const shouldRenderColumn = (colName) => {
</QItem> </QItem>
<QItem <QItem
v-if=" v-if="
shouldRenderColumn('hasToInvoice') || shouldRenderColumn('hasToInvoice') || shouldRenderColumn('isFreezed')
shouldRenderColumn('isFreezed')
" "
> >
<QItemSection v-if="shouldRenderColumn('isFreezed')"> <QItemSection v-if="shouldRenderColumn('isFreezed')">
<QCheckbox <QCheckbox
v-model="params.isFreezed" v-model="params.isFreezed"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="t('customer.extendedList.tableVisibleColumns.isFreezed')"
t('customer.extendedList.tableVisibleColumns.isFreezed')
"
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
/> />
@ -514,9 +488,7 @@ const shouldRenderColumn = (colName) => {
v-model="params.hasToInvoice" v-model="params.hasToInvoice"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.hasToInvoice')
'customer.extendedList.tableVisibleColumns.hasToInvoice'
)
" "
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
@ -547,9 +519,7 @@ const shouldRenderColumn = (colName) => {
v-model="params.isToBeMailed" v-model="params.isToBeMailed"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="
t( t('customer.extendedList.tableVisibleColumns.isToBeMailed')
'customer.extendedList.tableVisibleColumns.isToBeMailed'
)
" "
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
@ -557,9 +527,7 @@ const shouldRenderColumn = (colName) => {
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem <QItem
v-if=" v-if="shouldRenderColumn('hasLcr') || shouldRenderColumn('hasCoreVnl')"
shouldRenderColumn('hasLcr') || shouldRenderColumn('hasCoreVnl')
"
> >
<QItemSection v-if="shouldRenderColumn('hasLcr')"> <QItemSection v-if="shouldRenderColumn('hasLcr')">
<QCheckbox <QCheckbox
@ -574,9 +542,7 @@ const shouldRenderColumn = (colName) => {
<QCheckbox <QCheckbox
v-model="params.hasCoreVnl" v-model="params.hasCoreVnl"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="t('customer.extendedList.tableVisibleColumns.hasCoreVnl')"
t('customer.extendedList.tableVisibleColumns.hasCoreVnl')
"
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
/> />
@ -587,9 +553,7 @@ const shouldRenderColumn = (colName) => {
<QCheckbox <QCheckbox
v-model="params.hasSepaVnl" v-model="params.hasSepaVnl"
@update:model-value="searchFn()" @update:model-value="searchFn()"
:label=" :label="t('customer.extendedList.tableVisibleColumns.hasSepaVnl')"
t('customer.extendedList.tableVisibleColumns.hasSepaVnl')
"
toggle-indeterminate toggle-indeterminate
:false-value="undefined" :false-value="undefined"
/> />
@ -597,20 +561,10 @@ const shouldRenderColumn = (colName) => {
</QItem> </QItem>
<QSeparator /> <QSeparator />
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
es: es:
Social name: Razón social Social name: Razón social

11
src/pages/Customer/Notifications/CustomerNotificationsFilter.vue
View File

@ -36,7 +36,6 @@ const clients = ref();
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="list">
<QItem class="q-mb-sm q-mt-sm"> <QItem class="q-mb-sm q-mt-sm">
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -107,20 +106,10 @@ const clients = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
<QSeparator /> <QSeparator />
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

7
src/pages/Customer/Payments/CustomerPayments.vue
View File

@ -122,7 +122,7 @@ function stateColor(row) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md customer-payments"> <QPage class="column items-center q-pa-md customer-payments">
<div class="card-list"> <div class="vn-card-list">
<QToolbar class="q-pa-none justify-end"> <QToolbar class="q-pa-none justify-end">
<QBtn <QBtn
@click="arrayData.refresh()" @click="arrayData.refresh()"
@ -278,10 +278,6 @@ function stateColor(row) {
<style lang="scss"> <style lang="scss">
.customer-payments { .customer-payments {
.card-list {
width: 100%;
max-width: 60em;
.q-table--dense .q-table th:first-child { .q-table--dense .q-table th:first-child {
padding-left: 0; padding-left: 0;
} }
@ -291,7 +287,6 @@ function stateColor(row) {
text-overflow: ellipsis; text-overflow: ellipsis;
} }
} }
}
</style> </style>
<i18n> <i18n>

17
src/pages/Customer/Payments/CustomerPaymentsFilter.vue
View File

@ -27,14 +27,9 @@ function isValidNumber(value) {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput :label="t('Order ID')" v-model="params.orderFk" is-outlined>
:label="t('Order ID')"
v-model="params.orderFk"
is-outlined
>
<template #prepend> <template #prepend>
<QIcon name="vn:basket" size="xs" /> <QIcon name="vn:basket" size="xs" />
</template> </template>
@ -67,8 +62,7 @@ function isValidNumber(value) {
} }
" "
:rules="[ :rules="[
(val) => (val) => isValidNumber(val) || !val || 'Please type a number',
isValidNumber(val) || !val || 'Please type a number',
]" ]"
lazy-rules lazy-rules
> >
@ -81,17 +75,12 @@ function isValidNumber(value) {
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInputDate <VnInputDate v-model="params.from" :label="t('From')" is-outlined />
v-model="params.from"
:label="t('From')"
is-outlined
/>
</QItemSection> </QItemSection>
<QItemSection> <QItemSection>
<VnInputDate v-model="params.to" :label="t('To')" is-outlined /> <VnInputDate v-model="params.to" :label="t('To')" is-outlined />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

11
src/pages/Entry/EntryFilter.vue
View File

@ -54,7 +54,6 @@ const suppliersOptions = ref([]);
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="list q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -198,20 +197,10 @@ const suppliersOptions = ref([]);
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

9
src/pages/Entry/EntryList.vue
View File

@ -47,7 +47,7 @@ onMounted(async () => {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="EntryList" data-key="EntryList"
url="Entries/filter" url="Entries/filter"
@ -128,13 +128,6 @@ onMounted(async () => {
</QPageSticky> </QPageSticky>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search entries: Buscar entradas Search entries: Buscar entradas

17
src/pages/InvoiceIn/InvoiceInFilter.vue
View File

@ -36,7 +36,6 @@ const suppliersRef = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="list q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -186,11 +185,7 @@ const suppliersRef = ref();
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInputDate <VnInputDate :label="t('To')" v-model="params.to" is-outlined />
:label="t('To')"
v-model="params.to"
is-outlined
/>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
@ -203,20 +198,10 @@ const suppliersRef = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
</QExpansionItem> </QExpansionItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
</style>
<i18n> <i18n>
en: en:
params: params:

9
src/pages/InvoiceIn/InvoiceInList.vue
View File

@ -71,7 +71,7 @@ function viewSummary(id) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="InvoiceInList" data-key="InvoiceInList"
url="InvoiceIns/filter" url="InvoiceIns/filter"
@ -156,13 +156,6 @@ function viewSummary(id) {
</QPageSticky> </QPageSticky>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search invoice: Buscar factura emitida Search invoice: Buscar factura emitida

8
src/pages/InvoiceOut/InvoiceOutFilter.vue
View File

@ -41,7 +41,6 @@ function setWorkers(data) {
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -58,11 +57,7 @@ function setWorkers(data) {
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput :label="t('Amount')" v-model="params.amount" is-outlined />
:label="t('Amount')"
v-model="params.amount"
is-outlined
/>
</QItemSection> </QItemSection>
</QItem> </QItem>
<QItem> <QItem>
@ -129,7 +124,6 @@ function setWorkers(data) {
</QItemSection> </QItemSection>
</QItem> </QItem>
</QExpansionItem> </QExpansionItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

9
src/pages/InvoiceOut/InvoiceOutList.vue
View File

@ -182,7 +182,7 @@ const downloadCsv = () => {
</template> </template>
</VnSubToolbar> </VnSubToolbar>
<div class="flex flex-center q-pa-md"> <div class="flex flex-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<CardList <CardList
:element="row" :element="row"
:id="row.id" :id="row.id"
@ -247,13 +247,6 @@ const downloadCsv = () => {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
en: en:
searchInvoice: Search issued invoice searchInvoice: Search issued invoice

4
src/pages/InvoiceOut/InvoiceOutNegativeBasesFilter.vue
View File

@ -27,7 +27,6 @@ const props = defineProps({
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInputDate <VnInputDate
@ -101,13 +100,10 @@ const props = defineProps({
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped></style>
<i18n> <i18n>
en: en:
params: params:

25
src/pages/Item/Card/ItemCard.vue Normal file
View File

@ -0,0 +1,25 @@
<script setup>
import LeftMenu from 'components/LeftMenu.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import ItemDescriptor from './ItemDescriptor.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit">
<ItemDescriptor />
<QSeparator />
<LeftMenu source="card" />
</QScrollArea>
</QDrawer>
<QPageContainer>
<QPage>
<VnSubToolbar />
<div class="q-pa-md"><RouterView></RouterView></div>
</QPage>
</QPageContainer>
</template>

316
src/pages/Item/Card/ItemDescriptor.vue Normal file
View File

@ -0,0 +1,316 @@
<script setup>
import { computed, ref, onMounted, onUnmounted } from 'vue';
import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import VnConfirm from 'components/ui/VnConfirm.vue';
import RegularizeStockForm from 'components/RegularizeStockForm.vue';
import EditPictureForm from 'components/EditPictureForm.vue';
import { useState } from 'src/composables/useState';
import useCardDescription from 'src/composables/useCardDescription';
import { useSession } from 'src/composables/useSession';
import axios from 'axios';
const $props = defineProps({
id: {
type: Number,
required: false,
default: null,
},
summary: {
type: Object,
default: null,
},
dated: {
type: String,
default: null,
},
});
const quasar = useQuasar();
const route = useRoute();
const router = useRouter();
const { t } = useI18n();
const { getToken } = useSession();
const state = useState();
const user = state.getUser();
const entityId = computed(() => {
return $props.id || route.params.id;
});
const image = ref(null);
const regularizeStockFormDialog = ref(null);
const editPhotoFormDialog = ref(null);
const item = ref(null);
const available = ref(null);
const visible = ref(null);
const _warehouseFk = ref(null);
const warehouseText = ref(null);
const warehouseFk = computed({
get() {
return _warehouseFk.value;
},
set(val) {
_warehouseFk.value = val;
if (val) {
updateStock();
getWarehouseName(val);
}
},
});
const showWarehouseIconTooltip = ref(true);
const showEditPhotoForm = ref(false);
onMounted(async () => {
await getItemAvatar();
warehouseFk.value = user.value.warehouseFk;
});
const getItemAvatar = async () => {
const token = getToken();
const timeStamp = `timestamp=${Date.now()}`;
image.value = `/api/Images/catalog/200x200/${entityId.value}/download?access_token=${token}&${timeStamp}`;
};
const data = ref(useCardDescription());
const setData = (entity) => {
if (!entity) return;
data.value = useCardDescription(entity.name, entity.id);
};
const getWarehouseName = async (warehouseFk) => {
try {
showWarehouseIconTooltip.value = false;
const filter = {
where: { id: warehouseFk },
};
const { data } = await axios.get('Warehouses/findOne', { filter });
warehouseText.value = t('item.descriptor.warehouseText', {
warehouseName: data.name,
});
showWarehouseIconTooltip.value = true;
} catch (err) {
console.error('Error finding warehouse');
}
};
const updateStock = async () => {
try {
available.value = null;
visible.value = null;
const params = {
warehouseFk: warehouseFk.value,
dated: $props.dated,
};
const { data } = await axios.get(`Items/${entityId.value}/getVisibleAvailable`, {
params,
});
available.value = data.available;
visible.value = data.visible;
} catch (err) {
console.error('Error updating stock');
}
};
const openRegularizeStockForm = () => {
regularizeStockFormDialog.value.show();
};
const toggleEditPictureForm = () => {
showEditPhotoForm.value = !showEditPhotoForm.value;
};
const cloneItem = async () => {
try {
const { data } = await axios.post(`Items/${entityId.value}/clone`);
router.push({ name: 'ItemTags', params: { id: data.id } });
} catch (err) {
console.error('Error cloning item');
}
};
const openCloneDialog = async () => {
quasar
.dialog({
component: VnConfirm,
componentProps: {
title: t("All it's properties will be copied"),
message: t('Do you want to clone this item?'),
},
})
.onOk(async () => {
await cloneItem();
});
};
</script>
<template>
<CardDescriptor
data-key="ItemData"
module="Item"
:title="data.title"
:subtitle="data.subtitle"
:summary="$props.summary"
:url="`Items/${entityId}/getCard`"
@on-fetch="
(data) => {
item = data;
setData(data);
}
"
>
<template #menu="{}">
<QItem v-ripple clickable @click="openRegularizeStockForm()">
<QItemSection>
{{ t('Regularize stock') }}
<QDialog ref="regularizeStockFormDialog">
<RegularizeStockForm
:item-fk="entityId"
:warehouse-fk="warehouseFk"
@on-data-saved="updateStock()"
/>
</QDialog>
</QItemSection>
</QItem>
<QItem v-ripple clickable @click="openCloneDialog()">
<QItemSection>
{{ t('Clone') }}
</QItemSection>
</QItem>
</template>
<template #before>
<div class="relative-position">
<QImg :src="image" spinner-color="primary" class="photo">
<template #error>
<div
class="absolute-full picture text-center q-pa-md flex flex-center"
>
<div>
<div
class="text-grey-5"
style="opacity: 0.4; font-size: 5vh"
>
<QIcon name="vn:item" />
</div>
<div class="text-grey-5" style="opacity: 0.4">
{{ t('item.descriptor.item') }}
</div>
</div>
</div>
</template>
</QImg>
<QBtn
color="primary"
size="lg"
round
class="edit-photo-btn"
@click="toggleEditPictureForm()"
>
<QIcon name="edit" size="sm" />
<QDialog ref="editPhotoFormDialog" v-model="showEditPhotoForm">
<EditPictureForm
collection="catalog"
:id="entityId"
@close-form="toggleEditPictureForm()"
@on-photo-uploaded="getItemAvatar()"
/>
</QDialog>
</QBtn>
</div>
<div
class="row justify-between items-center full-width bg-primary"
style="height: 54px"
>
<div class="col column items-center">
<span class="text-uppercase color-vn-white" style="font-size: 11px">
{{ t('item.descriptor.visible') }}
</span>
<span class="text-weight-bold text-h5 color-vn-white">{{
visible
}}</span>
</div>
<div
class="col column items-center separation-borders"
style="font-size: 11px"
>
<span class="text-uppercase color-vn-white">
{{ t('item.descriptor.available') }}
</span>
<span class="text-weight-bold text-h5 color-vn-white">{{
available
}}</span>
</div>
<div class="col column items-center justify-center">
<QIcon name="info" class="cursor-pointer color-vn-white" size="md">
<QTooltip>{{ warehouseText }}</QTooltip>
</QIcon>
</div>
</div>
</template>
<template #body="{ entity }">
<VnLv :label="t('item.descriptor.buyer')">
<template #value>
<span class="link">
{{ t('item.descriptor.buyer') }}
<WorkerDescriptorProxy :id="entity.itemType?.worker?.id" />
</span>
</template>
</VnLv>
<VnLv :label="t('item.descriptor.color')" :value="entity.value5"> </VnLv>
<VnLv :label="t('item.descriptor.color')" :value="entity.value6" />
<VnLv :label="t('item.descriptor.stems')" :value="entity.value7" />
</template>
<template #actions="{}">
<QCardActions class="row justify-center">
<QBtn
:to="{ name: 'ItemDiary' }"
size="md"
icon="vn:transaction"
color="primary"
>
<QTooltip>{{ t('item.descriptor.itemDiary') }}</QTooltip>
</QBtn>
</QCardActions>
</template>
</CardDescriptor>
</template>
<i18n>
es:
Regularize stock: Regularizar stock
Clone: Clonar
All it's properties will be copied: Todas sus propiedades serán copiadas
Do you want to clone this item?: ¿Desea clonar este artículo?
</i18n>
<style lang="scss" scoped>
.photo {
height: 256px;
}
.edit-photo-btn {
position: absolute;
right: 12px;
bottom: 12px;
z-index: 1;
cursor: pointer;
}
.separation-borders {
border-left: 1px solid $white;
border-right: 1px solid $white;
}
</style>

26
src/pages/Item/Card/ItemDescriptorProxy.vue Normal file
View File

@ -0,0 +1,26 @@
<script setup>
import ItemDescriptor from './ItemDescriptor.vue';
import ItemSummaryDialog from './ItemSummaryDialog.vue';
const $props = defineProps({
id: {
type: Number,
required: true,
},
dated: {
type: String,
default: null,
},
});
</script>
<template>
<QPopupProxy>
<ItemDescriptor
v-if="$props.id"
:id="$props.id"
:summary="ItemSummaryDialog"
:dated="dated"
/>
</QPopupProxy>
</template>

1
src/pages/Item/Card/ItemDiary.vue Normal file
View File

@ -0,0 +1 @@
<template>Item diary (CREAR CUANDO SE DESARROLLE EL MODULO DE ITEMS)</template>

1
src/pages/Item/Card/ItemSummary.vue Normal file
View File

@ -0,0 +1 @@
<template>Item summary</template>

5
src/pages/Item/Card/ItemSummaryDialog.vue Normal file
View File

@ -0,0 +1,5 @@
<template>
<QDialog
>Item summary dialog (A DESARROLLAR CUANDO SE CREE EL MODULO DE ITEMS)</QDialog
>
</template>

1
src/pages/Item/Card/ItemTags.vue Normal file
View File

@ -0,0 +1 @@
<template>Item tags (CREAR CUANDO SE DESARROLLE EL MODULO DE ITEMS)</template>

1
src/pages/Item/ItemList.vue Normal file
View File

@ -0,0 +1 @@
<template>Item list</template>

18
src/pages/Item/ItemMain.vue Normal file
View File

@ -0,0 +1,18 @@
<script setup>
import LeftMenu from 'src/components/LeftMenu.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore();
</script>
<template>
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<QScrollArea class="fit text-grey-8">
<LeftMenu />
</QScrollArea>
</QDrawer>
<QPageContainer>
<RouterView></RouterView>
</QPageContainer>
</template>

2
src/pages/Order/Card/OrderCatalogFilter.vue
View File

@ -219,7 +219,6 @@ const getCategoryClass = (category, params) => {
</template> </template>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense style="max-width: 256px">
<QItem class="category-filter q-mt-md"> <QItem class="category-filter q-mt-md">
<div <div
v-for="category in categoryList" v-for="category in categoryList"
@ -395,7 +394,6 @@ const getCategoryClass = (category, params) => {
</QItemSection> </QItemSection>
</QItem> </QItem>
<QSeparator /> <QSeparator />
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

18
src/pages/Order/Card/OrderCatalogItem.vue
View File

@ -1,10 +1,13 @@
<script setup> <script setup>
import { useSession } from 'composables/useSession';
import VnLv from 'components/ui/VnLv.vue';
import { useI18n } from 'vue-i18n';
import OrderCatalogItemDialog from 'pages/Order/Card/OrderCatalogItemDialog.vue';
import toCurrency from '../../../filters/toCurrency';
import { ref } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnLv from 'components/ui/VnLv.vue';
import OrderCatalogItemDialog from 'pages/Order/Card/OrderCatalogItemDialog.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import { useSession } from 'composables/useSession';
import toCurrency from '../../../filters/toCurrency';
const DEFAULT_PRICE_KG = 0; const DEFAULT_PRICE_KG = 0;
@ -42,7 +45,10 @@ const dialog = ref(null);
</div> </div>
</div> </div>
<div class="content"> <div class="content">
<span class="link">{{ item.name }}</span> <span class="link">
{{ item.name }}
<ItemDescriptorProxy :id="item.id" />
</span>
<p class="subName">{{ item.subName }}</p> <p class="subName">{{ item.subName }}</p>
<template v-for="index in 4" :key="`tag-${index}`"> <template v-for="index in 4" :key="`tag-${index}`">
<VnLv <VnLv

10
src/pages/Order/Card/OrderFilter.vue
View File

@ -59,7 +59,6 @@ const sourceList = ref(null);
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList id="orderFilter" dense>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -202,19 +201,10 @@ const sourceList = ref(null);
<QCheckbox v-model="params.showEmpty" :label="t('showEmpty')" /> <QCheckbox v-model="params.showEmpty" :label="t('showEmpty')" />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style lang="scss">
#orderFilter {
.q-item {
padding-top: 8px;
}
}
</style>
<i18n> <i18n>
en: en:
params: params:

10
src/pages/Order/OrderCatalog.vue
View File

@ -20,7 +20,7 @@ const catalogParams = {
orderBy: JSON.stringify({ field: 'relevancy DESC, name', way: 'ASC', isTag: false }), orderBy: JSON.stringify({ field: 'relevancy DESC, name', way: 'ASC', isTag: false }),
}; };
const tags = ref([]) const tags = ref([]);
function extractTags(items) { function extractTags(items) {
const resultTags = []; const resultTags = [];
@ -34,7 +34,7 @@ function extractTags(items) {
} }
}); });
}); });
tags.value = resultTags tags.value = resultTags;
} }
</script> </script>
@ -70,7 +70,7 @@ function extractTags(items) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="full-width">
<VnPaginate <VnPaginate
data-key="OrderCatalogList" data-key="OrderCatalogList"
url="Orders/CatalogFilter" url="Orders/CatalogFilter"
@ -93,10 +93,6 @@ function extractTags(items) {
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-list {
width: 100%;
}
.catalog-list { .catalog-list {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;

7
src/pages/Order/OrderLines.vue
View File

@ -83,7 +83,7 @@ async function confirmOrder() {
auto-load auto-load
/> />
<QPage :key="componentKey" class="column items-center q-pa-md"> <QPage :key="componentKey" class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<div v-if="!orderSummary.total" class="no-result"> <div v-if="!orderSummary.total" class="no-result">
{{ t('globals.noResults') }} {{ t('globals.noResults') }}
</div> </div>
@ -228,11 +228,6 @@ async function confirmOrder() {
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
.header { .header {
color: $primary; color: $primary;
font-weight: bold; font-weight: bold;

13
src/pages/Order/OrderList.vue
View File

@ -4,7 +4,7 @@ import { onMounted, onUnmounted } from 'vue';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toCurrency, toDate } from 'src/filters'; import { toCurrency, toDate } from 'src/filters';
import {useQuasar} from "quasar"; import { useQuasar } from 'quasar';
import CardList from 'components/ui/CardList.vue'; import CardList from 'components/ui/CardList.vue';
import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue'; import WorkerDescriptorProxy from 'pages/Worker/Card/WorkerDescriptorProxy.vue';
import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from 'pages/Customer/Card/CustomerDescriptorProxy.vue';
@ -12,7 +12,7 @@ import VnPaginate from 'components/ui/VnPaginate.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
import OrderSearchbar from 'pages/Order/Card/OrderSearchbar.vue'; import OrderSearchbar from 'pages/Order/Card/OrderSearchbar.vue';
import OrderFilter from 'pages/Order/Card/OrderFilter.vue'; import OrderFilter from 'pages/Order/Card/OrderFilter.vue';
import OrderSummaryDialog from "pages/Order/Card/OrderSummaryDialog.vue"; import OrderSummaryDialog from 'pages/Order/Card/OrderSummaryDialog.vue';
const stateStore = useStateStore(); const stateStore = useStateStore();
const quasar = useQuasar(); const quasar = useQuasar();
@ -63,7 +63,7 @@ function viewSummary(id) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="OrderList" data-key="OrderList"
url="Orders/filter" url="Orders/filter"
@ -153,10 +153,3 @@ function viewSummary(id) {
</QPageSticky> </QPageSticky>
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>

7
src/pages/Order/OrderVolume.vue
View File

@ -35,7 +35,7 @@ const loadVolumes = async (rows) => {
auto-load auto-load
/> />
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<div <div
v-if="!volumeSummary?.totalVolume && !volumeSummary?.totalBoxes" v-if="!volumeSummary?.totalVolume && !volumeSummary?.totalBoxes"
class="no-result" class="no-result"
@ -121,11 +121,6 @@ const loadVolumes = async (rows) => {
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
.header { .header {
color: $primary; color: $primary;
font-weight: bold; font-weight: bold;

2
src/pages/Route/Card/RouteFilter.vue
View File

@ -61,7 +61,6 @@ const warehouseList = ref([]);
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense>
<QItem class="q-my-sm"> <QItem class="q-my-sm">
<QItemSection v-if="workerList"> <QItemSection v-if="workerList">
<VnSelectFilter <VnSelectFilter
@ -198,7 +197,6 @@ const warehouseList = ref([]);
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

23
src/pages/Route/Card/RouteForm.vue
View File

@ -71,8 +71,8 @@ const routeFilter = {
}; };
const onSave = (data, response) => { const onSave = (data, response) => {
if (isNew) { if (isNew) {
axios.post(`Routes/${response.data?.id}/updateWorkCenter`); axios.post(`Routes/${response?.id}/updateWorkCenter`);
router.push({ name: 'RouteSummary', params: { id: response.data?.id } }); router.push({ name: 'RouteSummary', params: { id: response?.id } });
} }
}; };
</script> </script>
@ -198,6 +198,13 @@ const onSave = (data, response) => {
clearable clearable
/> />
</div> </div>
<div class="col flex items-center">
<QCheckbox
size="sm"
v-model="data.isOk"
:label="t('Is served')"
/>
</div>
</VnRow> </VnRow>
</template> </template>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
@ -212,3 +219,15 @@ const onSave = (data, response) => {
</template> </template>
</FormModel> </FormModel>
</template> </template>
<i18n>
es:
Worker: Trabajador
Vehicle: Vehículo
Agency: Agencia
Km Start: Km de inicio
Km End: Km de fin
Hour started: Hora inicio
Hour finished: Hora fin
Description: Descripción
Is served: Se ha servido
</i18n>

2
src/pages/Route/Cmr/CmrFilter.vue
View File

@ -28,7 +28,6 @@ const countries = ref();
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -124,7 +123,6 @@ const countries = ref();
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

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

@ -272,6 +272,7 @@ function previewRoute(id) {
selection="multiple" selection="multiple"
:rows-per-page-options="[0]" :rows-per-page-options="[0]"
hide-pagination hide-pagination
:pagination="{ sortBy: 'ID', descending: true }"
> >
<template #body-cell-worker="props"> <template #body-cell-worker="props">
<QTd :props="props"> <QTd :props="props">
@ -459,11 +460,12 @@ function previewRoute(id) {
</template> </template>
<template #body-cell-actions="props"> <template #body-cell-actions="props">
<QTd :props="props"> <QTd :props="props">
<div class="table-actions"> <div class="flex items-center table-actions">
<QIcon <QIcon
name="vn:ticketAdd" name="vn:ticketAdd"
size="xs" size="xs"
color="primary" color="primary"
class="cursor-pointer"
> >
<QTooltip>{{ t('Add ticket') }}</QTooltip> <QTooltip>{{ t('Add ticket') }}</QTooltip>
</QIcon> </QIcon>
@ -472,6 +474,7 @@ function previewRoute(id) {
size="xs" size="xs"
color="primary" color="primary"
@click="previewRoute(props?.row?.id)" @click="previewRoute(props?.row?.id)"
class="cursor-pointer"
> >
<QTooltip>{{ t('Preview') }}</QTooltip> <QTooltip>{{ t('Preview') }}</QTooltip>
</QIcon> </QIcon>
@ -500,13 +503,7 @@ function previewRoute(id) {
} }
.table-actions { .table-actions {
display: flex;
align-items: center;
gap: 12px; gap: 12px;
i {
cursor: pointer;
}
} }
</style> </style>
<i18n> <i18n>
@ -528,4 +525,6 @@ es:
Cancel: Cancelar Cancel: Cancelar
Clone: Clonar Clone: Clonar
Mark as served: Marcar como servidas Mark as served: Marcar como servidas
Add ticket: Añadir tickets
Preview: Vista previa
</i18n> </i18n>

8
src/pages/Shelving/Card/ShelvingFilter.vue
View File

@ -41,7 +41,11 @@ function setParkings(data) {
@on-fetch="setWorkers" @on-fetch="setWorkers"
auto-load auto-load
/> />
<VnFilterPanel :data-key="props.dataKey" :search-button="true" @search="emit('search')"> <VnFilterPanel
:data-key="props.dataKey"
:search-button="true"
@search="emit('search')"
>
<template #tags="{ tag, formatFn }"> <template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs"> <div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong> <strong>{{ t(`params.${tag.label}`) }}: </strong>
@ -49,7 +53,6 @@ function setParkings(data) {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense>
<QItem class="q-my-sm"> <QItem class="q-my-sm">
<QItemSection v-if="!parkings"> <QItemSection v-if="!parkings">
<QSkeleton type="QInput" class="full-width" /> <QSkeleton type="QInput" class="full-width" />
@ -101,7 +104,6 @@ function setParkings(data) {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

9
src/pages/Shelving/ShelvingList.vue
View File

@ -74,7 +74,7 @@ function exprBuilder(param, value) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="ShelvingList" data-key="ShelvingList"
url="Shelvings" url="Shelvings"
@ -129,10 +129,3 @@ function exprBuilder(param, value) {
</QPageSticky> </QPageSticky>
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>

15
src/pages/Supplier/Card/SupplierAccounts.vue
View File

@ -106,7 +106,7 @@ onMounted(() => {
</div> </div>
<div class="col"> <div class="col">
<VnSelectCreate <VnSelectCreate
:label="t('worker.create.bankEntity')" :label="t('supplier.accounts.bankEntity')"
v-model="row.bankEntityFk" v-model="row.bankEntityFk"
:options="bankEntitiesOptions" :options="bankEntitiesOptions"
option-label="name" option-label="name"
@ -135,7 +135,17 @@ onMounted(() => {
<VnInput <VnInput
:label="t('supplier.accounts.beneficiary')" :label="t('supplier.accounts.beneficiary')"
v-model="row.beneficiary" v-model="row.beneficiary"
/> >
<template #append>
<QIcon name="info" class="cursor-pointer">
<QTooltip>{{
t(
'Name of the bank account holder if different from the provider'
)
}}</QTooltip>
</QIcon>
</template>
</VnInput>
</div> </div>
<div class="col-1 row justify-center items-center"> <div class="col-1 row justify-center items-center">
<QIcon <QIcon
@ -174,4 +184,5 @@ onMounted(() => {
Do you want to change the pay method to wire transfer?: ¿Quieres modificar la forma de pago a transferencia? Do you want to change the pay method to wire transfer?: ¿Quieres modificar la forma de pago a transferencia?
Add account: Añadir cuenta Add account: Añadir cuenta
Remove account: Remover cuenta Remove account: Remover cuenta
Name of the bank account holder if different from the provider: Nombre del titular de la cuenta bancaria en caso de ser diferente del proveedor
</i18n> </i18n>

9
src/pages/Supplier/Card/SupplierAddresses.vue
View File

@ -47,7 +47,7 @@ const redirectToUpdateView = (addressData) => {
<template> <template>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="SupplierAddress" data-key="SupplierAddress"
:url="`Suppliers/${route.params.id}/addresses`" :url="`Suppliers/${route.params.id}/addresses`"
@ -88,10 +88,3 @@ const redirectToUpdateView = (addressData) => {
</QPageSticky> </QPageSticky>
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>

7
src/pages/Supplier/Card/SupplierAddressesCreate.vue
View File

@ -147,8 +147,6 @@ onMounted(() => {
option-value="id" option-value="id"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<VnSelectFilter <VnSelectFilter
:label="t('supplier.addresses.province')" :label="t('supplier.addresses.province')"
@ -160,21 +158,20 @@ onMounted(() => {
v-model="data.provinceFk" v-model="data.provinceFk"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<VnInput <VnInput
v-model="data.phone" v-model="data.phone"
:label="t('supplier.addresses.phone')" :label="t('supplier.addresses.phone')"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<VnInput <VnInput
v-model="data.mobile" v-model="data.mobile"
:label="t('supplier.addresses.mobile')" :label="t('supplier.addresses.mobile')"
/> />
</div> </div>
<div class="col" />
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

7
src/pages/Supplier/Card/SupplierAgencyTermCreate.vue
View File

@ -80,8 +80,6 @@ const onDataSaved = () => {
type="number" type="number"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <QInput
:label="t('supplier.agencyTerms.m3Price')" :label="t('supplier.agencyTerms.m3Price')"
@ -89,6 +87,8 @@ const onDataSaved = () => {
type="number" type="number"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <QInput
:label="t('supplier.agencyTerms.routePrice')" :label="t('supplier.agencyTerms.routePrice')"
@ -96,8 +96,6 @@ const onDataSaved = () => {
type="number" type="number"
/> />
</div> </div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
<QInput <QInput
:label="t('supplier.agencyTerms.minimumKm')" :label="t('supplier.agencyTerms.minimumKm')"
@ -105,7 +103,6 @@ const onDataSaved = () => {
type="number" type="number"
/> />
</div> </div>
<div class="col" />
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

13
src/pages/Supplier/Card/SupplierBasicData.vue
View File

@ -48,6 +48,13 @@ const workersOptions = ref([]);
map-options map-options
:rules="validate('supplier.workerFk')" :rules="validate('supplier.workerFk')"
> >
<template #append>
<QIcon name="info" class="cursor-pointer">
<QTooltip>{{
t('Responsible for approving invoices')
}}</QTooltip>
</QIcon>
</template>
<template #option="scope"> <template #option="scope">
<QItem v-bind="scope.itemProps"> <QItem v-bind="scope.itemProps">
<QItemSection> <QItemSection>
@ -88,10 +95,14 @@ const workersOptions = ref([]);
type="textarea" type="textarea"
v-model="data.note" v-model="data.note"
fill-input fill-input
autogrow
/> />
</div> </div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>
</template> </template>
<i18n>
es:
Responsible for approving invoices: Responsable de aprobar las facturas
</i18n>

11
src/pages/Supplier/Card/SupplierBillingData.vue
View File

@ -13,6 +13,13 @@ const { t } = useI18n();
const paymethodsOptions = ref([]); const paymethodsOptions = ref([]);
const payDemsOptions = ref([]); const payDemsOptions = ref([]);
const formatPayDems = (data) => {
payDemsOptions.value = data.map(({ id, payDem }) => ({
id: id,
payDem: payDem || '0',
}));
};
</script> </script>
<template> <template>
<FetchData <FetchData
@ -20,7 +27,7 @@ const payDemsOptions = ref([]);
@on-fetch="(data) => (paymethodsOptions = data)" @on-fetch="(data) => (paymethodsOptions = data)"
auto-load auto-load
/> />
<FetchData url="PayDems" @on-fetch="(data) => (payDemsOptions = data)" auto-load /> <FetchData url="PayDems" @on-fetch="(data) => formatPayDems(data)" auto-load />
<FormModel <FormModel
:url="`Suppliers/${route.params.id}`" :url="`Suppliers/${route.params.id}`"
:url-update="`Suppliers/${route.params.id}`" :url-update="`Suppliers/${route.params.id}`"
@ -37,7 +44,6 @@ const payDemsOptions = ref([]);
option-value="id" option-value="id"
option-label="name" option-label="name"
hide-selected hide-selected
map-options
:rules="validate('supplier.payMethodFk')" :rules="validate('supplier.payMethodFk')"
/> />
</div> </div>
@ -49,7 +55,6 @@ const payDemsOptions = ref([]);
option-value="id" option-value="id"
option-label="payDem" option-label="payDem"
hide-selected hide-selected
map-options
:rules="validate('supplier.payDemFk')" :rules="validate('supplier.payDemFk')"
/> />
</div> </div>

1
src/pages/Supplier/Card/SupplierCard.vue
View File

@ -14,6 +14,7 @@ const { t } = useI18n();
<Teleport to="#searchbar"> <Teleport to="#searchbar">
<VnSearchbar <VnSearchbar
data-key="SuppliersList" data-key="SuppliersList"
url="Suppliers/filter"
:limit="20" :limit="20"
:label="t('Search suppliers')" :label="t('Search suppliers')"
/> />

95
src/pages/Supplier/Card/SupplierConsumption.vue
View File

@ -1,47 +1,64 @@
<script setup> <script setup>
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { ref, computed } from 'vue'; import { computed, onMounted } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import axios from 'axios';
import { useStateStore } from 'stores/useStateStore';
import { usePrintService } from 'composables/usePrintService';
import useNotify from 'src/composables/useNotify.js';
import { toDate, toDateString } from 'src/filters';
import { dashIfEmpty } from 'src/filters';
import FetchData from 'components/FetchData.vue';
import FetchedTags from 'components/ui/FetchedTags.vue'; import FetchedTags from 'components/ui/FetchedTags.vue';
import SendEmailDialog from 'components/common/SendEmailDialog.vue'; import SendEmailDialog from 'components/common/SendEmailDialog.vue';
import SupplierConsumptionFilter from './SupplierConsumptionFilter.vue';
import ItemDescriptorProxy from 'src/pages/Item/Card/ItemDescriptorProxy.vue';
import { toDate } from 'src/filters';
import { dashIfEmpty } from 'src/filters';
import { usePrintService } from 'composables/usePrintService';
import useNotify from 'src/composables/useNotify.js';
import axios from 'axios';
import { useStateStore } from 'stores/useStateStore';
import { useArrayData } from 'composables/useArrayData';
const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const stateStore = useStateStore();
const { openReport, sendEmail } = usePrintService(); const { openReport, sendEmail } = usePrintService();
const quasar = useQuasar(); const quasar = useQuasar();
const { notify } = useNotify(); const { notify } = useNotify();
const suppliersConsumption = ref(); const arrayData = useArrayData('SupplierConsumption', {
url: 'Suppliers/consumption',
order: ['itemTypeFk', 'itemName', 'itemSize'],
userFilter: { where: { supplierFk: route.params.id } },
});
const userParams = computed(() => { const store = arrayData.store;
const minDate = Date.vnNew();
minDate.setHours(0, 0, 0, 0);
minDate.setMonth(minDate.getMonth() - 2);
const maxDate = Date.vnNew(); const dateRanges = computed(() => {
maxDate.setHours(23, 59, 59, 59); const ranges = {
from: null,
return { to: null,
from: toDateString(minDate),
to: toDateString(maxDate),
}; };
if (route.query && route.query.params) {
const params = JSON.parse(route.query.params);
if (params.from && params.to) {
ranges.from = params.from;
ranges.to = params.to;
}
}
return ranges;
}); });
const reportParams = computed(() => ({ const reportParams = computed(() => ({
recipientId: Number(route.params.id), recipientId: Number(route.params.id),
...userParams.value, ...dateRanges.value,
})); }));
const rows = computed(() => suppliersConsumption.value || []); async function getSupplierConsumptionData() {
await arrayData.fetch({ append: false });
}
const rows = computed(() => store.data || []);
const openReportPdf = () => { const openReportPdf = () => {
openReport(`Suppliers/${route.params.id}/campaign-metrics-pdf`, reportParams.value); openReport(`Suppliers/${route.params.id}/campaign-metrics-pdf`, reportParams.value);
@ -88,24 +105,19 @@ const sendCampaignMetricsEmail = ({ address }) => {
}); });
}; };
const calculateTotal = (buysArray) => const calculateTotal = (buysArray = []) =>
buysArray.reduce((accumulator, { total }) => accumulator + total, 0); buysArray.reduce((accumulator, { total }) => accumulator + total, 0);
onMounted(async () => {
stateStore.rightDrawer = true;
await getSupplierConsumptionData();
});
</script> </script>
<template> <template>
<FetchData
url="Suppliers/consumption"
@on-fetch="(data) => (suppliersConsumption = data)"
:filter="{
where: { supplierFk: route.params.id },
order: ['itemTypeFk', 'itemName', 'itemSize'],
}"
:params="userParams"
auto-load
/>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()">
<QBtn <QBtn
v-if="userParams.from && userParams.to" v-if="dateRanges.from && dateRanges.to"
color="primary" color="primary"
icon-right="picture_as_pdf" icon-right="picture_as_pdf"
no-caps no-caps
@ -117,7 +129,7 @@ const calculateTotal = (buysArray) =>
</QTooltip> </QTooltip>
</QBtn> </QBtn>
<QBtn <QBtn
v-if="userParams.from && userParams.to" v-if="dateRanges.from && dateRanges.to"
color="primary" color="primary"
icon-right="email" icon-right="email"
no-caps no-caps
@ -128,14 +140,20 @@ const calculateTotal = (buysArray) =>
</QTooltip> </QTooltip>
</QBtn> </QBtn>
</Teleport> </Teleport>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<SupplierConsumptionFilter data-key="SupplierConsumption" />
</QScrollArea>
</QDrawer>
<QTable <QTable
:rows="rows" :rows="rows"
hide-bottom
row-key="id" row-key="id"
hide-header hide-header
:pagination="{ rowsPerPage: 0 }" :pagination="{ rowsPerPage: 0 }"
class="full-width q-mt-md" class="full-width q-mt-md"
:no-data-label="t('No results')"
> >
<template #body="{ row }"> <template #body="{ row }">
<QTr> <QTr>
@ -151,7 +169,10 @@ const calculateTotal = (buysArray) =>
<QTd no-hover>{{ row.invoiceNumber }}</QTd> <QTd no-hover>{{ row.invoiceNumber }}</QTd>
</QTr> </QTr>
<QTr v-for="(buy, index) in row.buys" :key="index"> <QTr v-for="(buy, index) in row.buys" :key="index">
<QTd no-hover> {{ buy.itemName }}</QTd> <QTd no-hover>
<QBtn flat color="blue" dense>{{ buy.itemName }}</QBtn>
<ItemDescriptorProxy :id="buy.itemFk" />
</QTd>
<QTd no-hover> <QTd no-hover>
<span>{{ buy.subName }}</span> <span>{{ buy.subName }}</span>

181
src/pages/Supplier/Card/SupplierConsumptionFilter.vue Normal file
View File

@ -0,0 +1,181 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
import FetchData from 'components/FetchData.vue';
import VnInputDate from 'src/components/common/VnInputDate.vue';
const { t } = useI18n();
const props = defineProps({
dataKey: {
type: String,
required: true,
},
});
const buyersOptions = ref([]);
const itemTypesOptions = ref([]);
const itemCategoriesOptions = ref([]);
</script>
<template>
<FetchData
url="TicketRequests/getItemTypeWorker"
:filter="{
fields: ['id', 'nickname'],
order: 'nickname ASC',
}"
@on-fetch="(data) => (buyersOptions = data)"
auto-load
/>
<FetchData
url="ItemTypes"
:filter="{
fields: ['id', 'name', 'categoryFk'],
include: 'category',
order: 'name ASC',
}"
@on-fetch="(data) => (itemTypesOptions = data)"
auto-load
/>
<FetchData
url="ItemCategories"
:filter="{
fields: ['id', 'name'],
order: 'name ASC',
}"
@on-fetch="(data) => (itemCategoriesOptions = data)"
auto-load
/>
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
<template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong>
<span>{{ formatFn(tag.value) }}</span>
</div>
</template>
<template #body="{ params, searchFn }">
<QItem>
<QItemSection>
<VnInput
v-model="params.search"
:label="t('params.search')"
is-outlined
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
v-model="params.itemId"
:label="t('params.itemId')"
is-outlined
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('params.buyerId')"
v-model="params.buyerId"
@update:model-value="searchFn()"
:options="buyersOptions"
option-value="id"
option-label="nickname"
hide-selected
dense
outlined
rounded
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('params.typeId')"
v-model="params.typeId"
@update:model-value="searchFn()"
:options="itemTypesOptions"
option-value="id"
option-label="name"
hide-selected
dense
outlined
rounded
>
<template #option="scope">
<QItem v-bind="scope.itemProps">
<QItemSection>
<QItemLabel>{{ scope.opt?.name }}</QItemLabel>
<QItemLabel caption>{{
scope.opt?.category?.name
}}</QItemLabel>
</QItemSection>
</QItem>
</template>
</VnSelectFilter>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('params.categoryId')"
v-model="params.categoryId"
@update:model-value="searchFn()"
:options="itemCategoriesOptions"
option-value="id"
option-label="name"
hide-selected
dense
outlined
rounded
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate
:label="t('params.from')"
v-model="params.from"
@update:model-value="searchFn()"
is-outlined
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInputDate
:label="t('params.to')"
v-model="params.to"
@update:model-value="searchFn()"
is-outlined
/>
</QItemSection>
</QItem>
</template>
</VnFilterPanel>
</template>
<i18n>
en:
params:
search: General search
itemId: Item id
buyerId: Buyer
typeId: Type
categoryId: Category
from: From
to: To
es:
params:
search: Búsqueda general
itemId: Id Artículo
buyerId: Comprador
typeId: Tipo
categoryId: Reino
from: Desde
to: Hasta
</i18n>

111
src/pages/Supplier/Card/SupplierDescriptor.vue
View File

@ -1,10 +1,14 @@
<script setup> <script setup>
import { ref, computed } from 'vue'; import { ref, computed, onMounted } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import CardDescriptor from 'components/ui/CardDescriptor.vue'; import CardDescriptor from 'components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import { toDateString } from 'src/filters';
import useCardDescription from 'src/composables/useCardDescription'; import useCardDescription from 'src/composables/useCardDescription';
import { getUrl } from 'src/composables/getUrl';
const $props = defineProps({ const $props = defineProps({
id: { id: {
@ -16,6 +20,7 @@ const $props = defineProps({
const route = useRoute(); const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
const url = ref();
const filter = { const filter = {
fields: [ fields: [
@ -53,6 +58,10 @@ const filter = {
], ],
}; };
onMounted(async () => {
url.value = await getUrl('');
});
const entityId = computed(() => { const entityId = computed(() => {
return $props.id || route.params.id; return $props.id || route.params.id;
}); });
@ -61,6 +70,27 @@ const data = ref(useCardDescription());
const setData = (entity) => { const setData = (entity) => {
data.value = useCardDescription(entity.ref, entity.id); data.value = useCardDescription(entity.ref, entity.id);
}; };
const getEntryQueryParams = (supplier) => {
if (!supplier) return null;
const date = Date.vnNew();
date.setHours(0, 0, 0, 0);
const from = new Date(date.getTime());
from.setDate(from.getDate() - 10);
const to = new Date(date.getTime());
to.setDate(to.getDate() + 10);
const params = {
supplierFk: supplier.id,
from: toDateString(from),
to: toDateString(to),
};
return params;
};
</script> </script>
<template> <template>
@ -73,6 +103,22 @@ const setData = (entity) => {
@on-fetch="setData" @on-fetch="setData"
data-key="Supplier" data-key="Supplier"
> >
<template #header-extra-action>
<QBtn
round
flat
dense
size="md"
icon="vn:supplier"
color="white"
class="link"
:to="{ name: 'SupplierList' }"
>
<QTooltip>
{{ t('Go to module index') }}
</QTooltip>
</QBtn>
</template>
<template #body="{ entity }"> <template #body="{ entity }">
<VnLv :label="t('supplier.summary.taxNumber')" :value="entity.nif" /> <VnLv :label="t('supplier.summary.taxNumber')" :value="entity.nif" />
<VnLv label="Alias" :value="entity.nickname" /> <VnLv label="Alias" :value="entity.nickname" />
@ -87,8 +133,69 @@ const setData = (entity) => {
<VnLv :label="t('supplier.summary.payDay')" :value="entity.payDay" /> <VnLv :label="t('supplier.summary.payDay')" :value="entity.payDay" />
<VnLv :label="t('supplier.summary.account')" :value="entity.account" /> <VnLv :label="t('supplier.summary.account')" :value="entity.account" />
</template> </template>
<template #icons="{ entity }">
<QCardActions class="q-gutter-x-md">
<QIcon
v-if="!entity.isActive"
name="vn:disabled"
color="primary"
size="xs"
>
<QTooltip>{{ t('Inactive supplier') }}</QTooltip>
</QIcon>
<QIcon
v-if="!entity.isSerious"
name="vn:supplierfalse"
color="primary"
size="xs"
>
<QTooltip>{{ t('Unverified supplier') }}</QTooltip>
</QIcon>
</QCardActions>
</template>
<template #actions="{ entity }">
<QCardActions>
<QBtn
:to="{
name: 'EntryList',
query: { params: JSON.stringify(getEntryQueryParams(entity)) },
}"
size="md"
icon="vn:entry"
color="primary"
>
<QTooltip>{{ t('All entries with current supplier') }}</QTooltip>
</QBtn>
<QBtn
:to="{
name: 'CustomerCard',
params: { id: entity.client?.id },
}"
size="md"
icon="vn:Person"
color="primary"
>
<QTooltip>{{ t('Go to client') }}</QTooltip>
</QBtn>
<QBtn
:href="`${url}invoice-in/create?supplierFk=${entity.id}`"
size="md"
icon="vn:invoice-in-create"
color="primary"
>
<QTooltip>{{ t('Create invoiceIn') }}</QTooltip>
</QBtn>
</QCardActions>
</template>
</CardDescriptor> </CardDescriptor>
</template> </template>
<i18n>
<i18n>
es:
All entries with current supplier: Todas las entradas con proveedor actual
Go to client: Ir a cliente
Create invoiceIn: Crear factura recibida
Go to module index: Ir al índice del módulo
Inactive supplier: Proveedor inactivo
Unverified supplier: Proveedor no verificado
</i18n> </i18n>

8
src/pages/Supplier/SupplierCreate.vue
View File

@ -1,6 +1,8 @@
<script setup> <script setup>
import { reactive } from 'vue'; import { reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRouter } from 'vue-router';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
@ -9,12 +11,17 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
const router = useRouter();
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore(); const stateStore = useStateStore();
const newSupplierForm = reactive({ const newSupplierForm = reactive({
name: null, name: null,
}); });
const redirectToSupplierFiscalData = (_, responseData) => {
router.push({ name: 'SupplierFiscalData', params: { id: responseData.id } });
};
</script> </script>
<template> <template>
@ -34,6 +41,7 @@ const newSupplierForm = reactive({
url-create="Suppliers/newSupplier" url-create="Suppliers/newSupplier"
model="supplier" model="supplier"
:form-initial-data="newSupplierForm" :form-initial-data="newSupplierForm"
@on-data-saved="redirectToSupplierFiscalData"
> >
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">

23
src/pages/Supplier/SupplierList.vue
View File

@ -1,13 +1,16 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore'; import { useQuasar } from 'quasar';
import { useRouter } from 'vue-router'; import { useRouter } from 'vue-router';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue'; import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CardList from 'src/components/ui/CardList.vue'; import CardList from 'src/components/ui/CardList.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import { useQuasar } from 'quasar';
import SupplierSummaryDialog from './Card/SupplierSummaryDialog.vue'; import SupplierSummaryDialog from './Card/SupplierSummaryDialog.vue';
import SupplierListFilter from './SupplierListFilter.vue';
import { useStateStore } from 'stores/useStateStore';
const stateStore = useStateStore(); const stateStore = useStateStore();
const router = useRouter(); const router = useRouter();
@ -44,7 +47,12 @@ const viewSummary = (id) => {
</template> </template>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<SupplierListFilter data-key="SuppliersList" />
</QScrollArea>
</QDrawer>
<div class="vn-card-list">
<VnPaginate data-key="SuppliersList" url="Suppliers/filter" auto-load> <VnPaginate data-key="SuppliersList" url="Suppliers/filter" auto-load>
<template #body="{ rows }"> <template #body="{ rows }">
<CardList <CardList
@ -56,7 +64,7 @@ const viewSummary = (id) => {
> >
<template #list-items> <template #list-items>
<VnLv label="NIF/CIF" :value="row.nif" /> <VnLv label="NIF/CIF" :value="row.nif" />
<VnLv label="Alias" :value="row.nickname" /> <VnLv label="Alias" :value="row.alias" />
<VnLv <VnLv
:label="t('supplier.list.payMethod')" :label="t('supplier.list.payMethod')"
:value="row.payMethod" :value="row.payMethod"
@ -95,13 +103,6 @@ const viewSummary = (id) => {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
en: en:
Search suppliers: Search suppliers Search suppliers: Search suppliers

122
src/pages/Supplier/SupplierListFilter.vue Normal file
View File

@ -0,0 +1,122 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
import FetchData from 'components/FetchData.vue';
const props = defineProps({
dataKey: {
type: String,
required: true,
},
});
const { t } = useI18n();
const provincesOptions = ref([]);
const countriesOptions = ref([]);
</script>
<template>
<FetchData
url="Provinces"
:filter="{ fields: ['id', 'name'], order: 'name ASC', limit: 30 }"
@on-fetch="(data) => (provincesOptions = data)"
auto-load
/>
<FetchData
url="countries"
:filter="{ fields: ['id', 'country'], order: 'country ASC', limit: 30 }"
@on-fetch="(data) => (countriesOptions = data)"
auto-load
/>
<VnFilterPanel
:data-key="props.dataKey"
:search-button="true"
:unremovable-params="['supplierFk']"
>
<template #tags="{ tag, formatFn }">
<div class="q-gutter-x-xs">
<strong>{{ t(`params.${tag.label}`) }}: </strong>
<span>{{ formatFn(tag.value) }}</span>
</div>
</template>
<template #body="{ params, searchFn }">
<QItem>
<QItemSection>
<VnInput
v-model="params.search"
:label="t('params.search')"
is-outlined
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput
v-model="params.nickname"
:label="t('params.nickname')"
is-outlined
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnInput v-model="params.nif" :label="t('params.nif')" is-outlined />
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('params.provinceFk')"
v-model="params.provinceFk"
@update:model-value="searchFn()"
:options="provincesOptions"
option-value="id"
option-label="name"
hide-selected
dense
outlined
rounded
/>
</QItemSection>
</QItem>
<QItem>
<QItemSection>
<VnSelectFilter
:label="t('params.countryFk')"
v-model="params.countryFk"
@update:model-value="searchFn()"
:options="countriesOptions"
option-value="id"
option-label="country"
hide-selected
dense
outlined
rounded
/>
</QItemSection>
</QItem>
</template>
</VnFilterPanel>
</template>
<i18n>
en:
params:
search: General search
nickname: Alias
nif: Tax number
provinceFk: Province
countryFk: Country
es:
params:
search: Búsqueda general
nickname: Alias
nif: NIF/CIF
provinceFk: Provincia
countryFk: País
</i18n>

8
src/pages/Ticket/TicketFilter.vue
View File

@ -56,7 +56,6 @@ const warehouses = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -75,11 +74,7 @@ const warehouses = ref();
</QItem> </QItem>
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInputDate <VnInputDate v-model="params.from" :label="t('From')" is-outlined />
v-model="params.from"
:label="t('From')"
is-outlined
/>
</QItemSection> </QItemSection>
<QItemSection> <QItemSection>
<VnInputDate v-model="params.to" :label="t('To')" is-outlined /> <VnInputDate v-model="params.to" :label="t('To')" is-outlined />
@ -244,7 +239,6 @@ const warehouses = ref();
</QItemSection> </QItemSection>
</QItem> </QItem>
</QExpansionItem> </QExpansionItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

9
src/pages/Ticket/TicketList.vue
View File

@ -74,7 +74,7 @@ function viewSummary(id) {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="TicketList" data-key="TicketList"
url="Tickets/filter" url="Tickets/filter"
@ -134,13 +134,6 @@ function viewSummary(id) {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search ticket: Buscar ticket Search ticket: Buscar ticket

9
src/pages/Travel/ExtraCommunityFilter.vue
View File

@ -66,7 +66,6 @@ const decrement = (paramsObj, key) => {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="list q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput label="id" v-model="params.id" is-outlined /> <VnInput label="id" v-model="params.id" is-outlined />
@ -205,19 +204,11 @@ const decrement = (paramsObj, key) => {
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped> <style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
.input-number >>> input[type='number'] { .input-number >>> input[type='number'] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }

9
src/pages/Travel/TravelFilter.vue
View File

@ -61,7 +61,6 @@ const decrement = (paramsObj, key) => {
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params }">
<QList dense class="list q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput <VnInput
@ -258,19 +257,11 @@ const decrement = (paramsObj, key) => {
</QInput> </QInput>
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>
<style scoped> <style scoped>
.list {
width: 256px;
}
.list * {
max-width: 100%;
}
.input-number >>> input[type='number'] { .input-number >>> input[type='number'] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }

9
src/pages/Travel/TravelList.vue
View File

@ -56,7 +56,7 @@ onMounted(async () => {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="TravelList" data-key="TravelList"
url="Travels/filter" url="Travels/filter"
@ -132,13 +132,6 @@ onMounted(async () => {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
en: en:
addEntry: Add entry addEntry: Add entry

9
src/pages/Wagon/Type/WagonTypeList.vue
View File

@ -42,7 +42,7 @@ async function remove(row) {
<template> <template>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="WagonTypeList" data-key="WagonTypeList"
url="/WagonTypes" url="/WagonTypes"
@ -80,10 +80,3 @@ async function remove(row) {
</QPageSticky> </QPageSticky>
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>

9
src/pages/Wagon/WagonList.vue
View File

@ -48,7 +48,7 @@ async function remove(row) {
<template> <template>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="WagonList" data-key="WagonList"
url="/Wagons" url="/Wagons"
@ -99,10 +99,3 @@ async function remove(row) {
</QPageSticky> </QPageSticky>
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>

2
src/pages/Worker/WorkerFilter.vue
View File

@ -27,7 +27,6 @@ const departments = ref();
</div> </div>
</template> </template>
<template #body="{ params, searchFn }"> <template #body="{ params, searchFn }">
<QList dense class="q-gutter-y-sm q-mt-sm">
<QItem> <QItem>
<QItemSection> <QItemSection>
<VnInput :label="t('FI')" v-model="params.fi" is-outlined <VnInput :label="t('FI')" v-model="params.fi" is-outlined
@ -94,7 +93,6 @@ const departments = ref();
/> />
</QItemSection> </QItemSection>
</QItem> </QItem>
</QList>
</template> </template>
</VnFilterPanel> </VnFilterPanel>
</template> </template>

9
src/pages/Worker/WorkerList.vue
View File

@ -64,7 +64,7 @@ const redirectToCreateView = () => {
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<div class="card-list"> <div class="vn-card-list">
<VnPaginate <VnPaginate
data-key="WorkerList" data-key="WorkerList"
url="Workers/filter" url="Workers/filter"
@ -114,13 +114,6 @@ const redirectToCreateView = () => {
</QPage> </QPage>
</template> </template>
<style lang="scss" scoped>
.card-list {
width: 100%;
max-width: 60em;
}
</style>
<i18n> <i18n>
es: es:
Search worker: Buscar trabajador Search worker: Buscar trabajador

2
src/router/modules/index.js
View File

@ -1,3 +1,4 @@
import Item from './item';
import Customer from './customer'; import Customer from './customer';
import Ticket from './ticket'; import Ticket from './ticket';
import Claim from './claim'; import Claim from './claim';
@ -14,6 +15,7 @@ import Department from './department';
import Entry from './entry'; import Entry from './entry';
export default [ export default [
Item,
Customer, Customer,
Ticket, Ticket,
Claim, Claim,

70
src/router/modules/item.js Normal file
View File

@ -0,0 +1,70 @@
import { RouterView } from 'vue-router';
export default {
path: '/item',
name: 'Item',
meta: {
title: 'items',
icon: 'vn:item',
},
component: RouterView,
redirect: { name: 'ItemMain' },
menus: {
main: [],
card: [],
},
children: [
{
path: '',
name: 'ItemMain',
component: () => import('src/pages/Item/ItemMain.vue'),
redirect: { name: 'Itemlist' },
children: [
{
path: 'list',
name: 'ItemList',
meta: {
title: 'list',
icon: 'view_list',
},
component: () => import('src/pages/Item/ItemList.vue'),
},
],
},
{
name: 'ItemCard',
path: ':id',
component: () => import('src/pages/Item/Card/ItemCard.vue'),
redirect: { name: 'ItemSummary' },
children: [
{
name: 'ItemSummary',
path: 'summary',
meta: {
title: 'summary',
icon: 'launch',
},
component: () => import('src/pages/Item/Card/ItemSummary.vue'),
},
{
path: 'diary',
name: 'ItemDiary',
meta: {
title: 'diary',
icon: 'vn:transaction',
},
component: () => import('src/pages/Item/Card/ItemDiary.vue'),
},
{
path: 'tags',
name: 'ItemTags',
meta: {
title: 'Tags',
icon: 'vn:tags',
},
component: () => import('src/pages/Item/Card/ItemTags.vue'),
},
],
},
],
};

2
src/router/routes.js
View File

@ -1,3 +1,4 @@
import item from './modules/item';
import customer from './modules/customer'; import customer from './modules/customer';
import ticket from './modules/ticket'; import ticket from './modules/ticket';
import claim from './modules/claim'; import claim from './modules/claim';
@ -51,6 +52,7 @@ const routes = [
component: () => import('../pages/Dashboard/DashboardMain.vue'), component: () => import('../pages/Dashboard/DashboardMain.vue'),
}, },
// Module routes // Module routes
item,
customer, customer,
ticket, ticket,
claim, claim,

20
src/stores/useNavigationStore.js
View File

@ -7,19 +7,19 @@ import routes from 'src/router/modules';
export const useNavigationStore = defineStore('navigationStore', () => { export const useNavigationStore = defineStore('navigationStore', () => {
const modules = [ const modules = [
'customer',
'claim',
'ticket',
'invoiceOut',
'invoiceIn',
'worker',
'shelving', 'shelving',
'order', 'order',
'wagon', 'customer',
'route',
'supplier',
'travel',
'entry', 'entry',
'travel',
'invoiceOut',
'invoiceIn',
'supplier',
'claim',
'route',
'ticket',
'worker',
'wagon',
]; ];
const pinnedModules = ref([]); const pinnedModules = ref([]);
const role = useRole(); const role = useRole();