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

Merge branch 'dev' of https://gitea.verdnatura.es/verdnatura/salix-front into 6243-generalizeCmrSection

This commit is contained in:
Jorge Penadés 2024-06-03 15:21:44 +02:00
parent e1bf3f5404 76f858ba7e
commit b93b630c6a
251 changed files with 13110 additions and 6164 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
CHANGELOG.md
View File

@ -7,12 +7,19 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
## [2420.01] ## [2420.01]
### Added
- (Item) => Se añade la opción de añadir un comentario del motivo de hacer una foto
## [2418.01] ## [2418.01]
## [2416.01] - 2024-04-18 ## [2416.01] - 2024-04-18
### Added ### Added
- (Worker) => Se crea la sección Taquilla
- (General) => Se mantiene el filtro lateral en cualquier parte de la seccíon.
### Fixed ### Fixed
- (General) => Se vuelven a mostrar los parámetros en la url al aplicar un filtro - (General) => Se vuelven a mostrar los parámetros en la url al aplicar un filtro

12
Jenkinsfile vendored
View File

@ -54,7 +54,6 @@ pipeline {
} }
environment { environment {
PROJECT_NAME = 'lilium' PROJECT_NAME = 'lilium'
STACK_NAME = "${env.PROJECT_NAME}-${env.BRANCH_NAME}"
} }
stages { stages {
stage('Install') { stage('Install') {
@ -104,15 +103,18 @@ pipeline {
when { when {
expression { PROTECTED_BRANCH } expression { PROTECTED_BRANCH }
} }
environment {
DOCKER_HOST = "${env.SWARM_HOST}"
}
steps { steps {
script { script {
def packageJson = readJSON file: 'package.json' def packageJson = readJSON file: 'package.json'
env.VERSION = packageJson.version env.VERSION = packageJson.version
} }
sh "docker stack deploy --with-registry-auth --compose-file docker-compose.yml ${env.STACK_NAME}" withKubeConfig([
serverUrl: "$KUBERNETES_API",
credentialsId: 'kubernetes',
namespace: 'lilium'
]) {
sh 'kubectl set image deployment/lilium-$BRANCH_NAME lilium-$BRANCH_NAME=$REGISTRY/salix-frontend:$VERSION'
}
} }
} }
} }

12
docker-compose.yml
View File

@ -1,17 +1,7 @@
version: '3.7' version: '3.7'
services: services:
main: main:
image: registry.verdnatura.es/salix-frontend:${BRANCH_NAME:?} image: registry.verdnatura.es/salix-frontend:${VERSION:?}
build: build:
context: . context: .
dockerfile: ./Dockerfile dockerfile: ./Dockerfile
ports:
- 4000
deploy:
replicas: ${FRONT_REPLICAS:?}
placement:
constraints:
- node.role == worker
resources:
limits:
memory: 1G

2
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "salix-front", "name": "salix-front",
"version": "24.22.0", "version": "24.24.3",
"description": "Salix frontend", "description": "Salix frontend",
"productName": "Salix", "productName": "Salix",
"author": "Verdnatura", "author": "Verdnatura",

2
quasar.config.js
View File

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

41
src/components/CreateBankEntityForm.vue
View File

@ -8,12 +8,7 @@ import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
import FormModelPopup from './FormModelPopup.vue'; import FormModelPopup from './FormModelPopup.vue';
const props = defineProps({ defineProps({ showEntityField: { type: Boolean, default: true } });
showEntityField: {
type: Boolean,
default: true,
},
});
const emit = defineEmits(['onDataSaved']); const emit = defineEmits(['onDataSaved']);
const { t } = useI18n(); const { t } = useI18n();
@ -26,7 +21,7 @@ const bankEntityFormData = reactive({
}); });
const countriesFilter = { const countriesFilter = {
fields: ['id', 'country', 'code'], fields: ['id', 'name', 'code'],
}; };
const countriesOptions = ref([]); const countriesOptions = ref([]);
@ -58,23 +53,19 @@ onMounted(async () => {
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('name')"
:label="t('name')" v-model="data.name"
v-model="data.name" :required="true"
:required="true" :rules="validate('bankEntity.name')"
:rules="validate('bankEntity.name')" />
/> <VnInput
</div> ref="bicInputRef"
<div class="col"> :label="t('swift')"
<VnInput v-model="data.bic"
ref="bicInputRef" :required="true"
:label="t('swift')" :rules="validate('bankEntity.bic')"
v-model="data.bic" />
:required="true"
:rules="validate('bankEntity.bic')"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">
@ -83,7 +74,7 @@ onMounted(async () => {
v-model="data.countryFk" v-model="data.countryFk"
:options="countriesOptions" :options="countriesOptions"
option-value="id" option-value="id"
option-label="country" option-label="name"
hide-selected hide-selected
:required="true" :required="true"
:rules="validate('bankEntity.countryFk')" :rules="validate('bankEntity.countryFk')"

110
src/components/CreateManualInvoiceForm.vue
View File

@ -48,7 +48,11 @@ const onDataSaved = async (formData, requestResponse) => {
/> />
<FetchData <FetchData
url="Tickets" url="Tickets"
:filter="{ fields: ['id', 'nickname'], order: 'shipped DESC', limit: 30 }" :filter="{
fields: ['id', 'nickname'],
where: { refFk: null },
order: 'shipped DESC',
}"
@on-fetch="(data) => (ticketsOptions = data)" @on-fetch="(data) => (ticketsOptions = data)"
auto-load auto-load
/> />
@ -72,69 +76,57 @@ const onDataSaved = async (formData, requestResponse) => {
{{ t('Invoicing in progress...') }} {{ t('Invoicing in progress...') }}
</span> </span>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Ticket')"
:label="t('Ticket')" :options="ticketsOptions"
:options="ticketsOptions" hide-selected
hide-selected option-label="id"
option-label="id" option-value="id"
option-value="id" v-model="data.ticketFk"
v-model="data.ticketFk" @update:model-value="data.clientFk = null"
@update:model-value="data.clientFk = null" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel> #{{ scope.opt?.id }} </QItemLabel>
<QItemLabel> #{{ scope.opt?.id }} </QItemLabel> <QItemLabel caption>{{ scope.opt?.nickname }}</QItemLabel>
<QItemLabel caption>{{ </QItemSection>
scope.opt?.nickname </QItem>
}}</QItemLabel> </template>
</QItemSection> </VnSelect>
</QItem>
</template>
</VnSelect>
</div>
<span class="row items-center" style="max-width: max-content">{{ <span class="row items-center" style="max-width: max-content">{{
t('Or') t('Or')
}}</span> }}</span>
<div class="col"> <VnSelect
<VnSelect :label="t('Client')"
:label="t('Client')" :options="clientsOptions"
:options="clientsOptions" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="data.clientFk"
v-model="data.clientFk" @update:model-value="data.ticketFk = null"
@update:model-value="data.ticketFk = null" />
/> <VnInputDate :label="t('Max date')" v-model="data.maxShipped" />
</div>
<div class="col">
<VnInputDate :label="t('Max date')" v-model="data.maxShipped" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Serial')"
:label="t('Serial')" :options="invoiceOutSerialsOptions"
:options="invoiceOutSerialsOptions" hide-selected
hide-selected option-label="description"
option-label="description" option-value="code"
option-value="code" v-model="data.serial"
v-model="data.serial" :required="true"
:required="true" />
/> <VnSelect
</div> :label="t('Area')"
<div class="col"> :options="taxAreasOptions"
<VnSelect hide-selected
:label="t('Area')" option-label="code"
:options="taxAreasOptions" option-value="code"
hide-selected v-model="data.taxArea"
option-label="code" :required="true"
option-value="code" />
v-model="data.taxArea"
:required="true"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<VnInput <VnInput

32
src/components/CreateNewCityForm.vue
View File

@ -40,24 +40,20 @@ const onDataSaved = (dataSaved) => {
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Name')"
:label="t('Name')" v-model="data.name"
v-model="data.name" :rules="validate('city.name')"
:rules="validate('city.name')" />
/> <VnSelect
</div> :label="t('Province')"
<div class="col"> :options="provincesOptions"
<VnSelect hide-selected
:label="t('Province')" option-label="name"
:options="provincesOptions" option-value="id"
hide-selected v-model="data.provinceFk"
option-label="name" :rules="validate('city.provinceFk')"
option-value="id" />
v-model="data.provinceFk"
:rules="validate('city.provinceFk')"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModelPopup> </FormModelPopup>

112
src/components/CreateNewPostcodeForm.vue
View File

@ -30,21 +30,21 @@ const townsLocationOptions = ref([]);
const onDataSaved = (formData) => { const onDataSaved = (formData) => {
const newPostcode = { const newPostcode = {
...formData ...formData,
}; };
const townObject = townsLocationOptions.value.find( const townObject = townsLocationOptions.value.find(
({id}) => id === formData.townFk ({ id }) => id === formData.townFk
); );
newPostcode.town = townObject?.name; newPostcode.town = townObject?.name;
const provinceObject = provincesOptions.value.find( const provinceObject = provincesOptions.value.find(
({id}) => id === formData.provinceFk ({ id }) => id === formData.provinceFk
); );
newPostcode.province = provinceObject?.name; newPostcode.province = provinceObject?.name;
const countryObject = countriesOptions.value.find( const countryObject = countriesOptions.value.find(
({id}) => id === formData.countryFk ({ id }) => id === formData.countryFk
); );
newPostcode.country = countryObject?.country; newPostcode.country = countryObject?.country;
emit('onDataSaved', newPostcode); emit('onDataSaved', newPostcode);
}; };
const onCityCreated = async ({ name, provinceFk }, formData) => { const onCityCreated = async ({ name, provinceFk }, formData) => {
@ -92,63 +92,55 @@ const onProvinceCreated = async ({ name }, formData) => {
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Postcode')"
:label="t('Postcode')" v-model="data.code"
v-model="data.code" :rules="validate('postcode.code')"
:rules="validate('postcode.code')" />
/> <VnSelectDialog
</div> :label="t('City')"
<div class="col"> :options="townsLocationOptions"
<VnSelectDialog v-model="data.townFk"
:label="t('City')" hide-selected
:options="townsLocationOptions" option-label="name"
v-model="data.townFk" option-value="id"
hide-selected :rules="validate('postcode.city')"
option-label="name" :roles-allowed-to-create="['deliveryAssistant']"
option-value="id" >
:rules="validate('postcode.city')" <template #form>
:roles-allowed-to-create="['deliveryAssistant']" <CreateNewCityForm @on-data-saved="onCityCreated($event, data)" />
> </template>
<template #form> </VnSelectDialog>
<CreateNewCityForm
@on-data-saved="onCityCreated($event, data)"
/>
</template>
</VnSelectDialog>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-xl"> <VnRow class="row q-gutter-md q-mb-xl">
<div class="col"> <VnSelectDialog
<VnSelectDialog :label="t('Province')"
:label="t('Province')" :options="provincesOptions"
:options="provincesOptions" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="data.provinceFk"
v-model="data.provinceFk" :rules="validate('postcode.provinceFk')"
:rules="validate('postcode.provinceFk')" :roles-allowed-to-create="['deliveryAssistant']"
:roles-allowed-to-create="['deliveryAssistant']" >
> <template #form>
<template #form> <CreateNewProvinceForm
<CreateNewProvinceForm @on-data-saved="onProvinceCreated($event, data)"
@on-data-saved="onProvinceCreated($event, data)" />
/> </template> </VnSelectDialog
</template> ></VnRow>
</VnSelectDialog> <VnRow class="row q-gutter-md q-mb-xl"
</div> ><VnSelect
<div class="col"> :label="t('Country')"
<VnSelect :options="countriesOptions"
:label="t('Country')" hide-selected
:options="countriesOptions" option-label="name"
hide-selected option-value="id"
option-label="country" v-model="data.countryFk"
option-value="id" :rules="validate('postcode.countryFk')"
v-model="data.countryFk" />
:rules="validate('postcode.countryFk')" </VnRow>
/> </template>
</div> </VnRow
></template>
</FormModelPopup> </FormModelPopup>
</template> </template>

32
src/components/CreateNewProvinceForm.vue
View File

@ -40,24 +40,20 @@ const onDataSaved = (dataSaved) => {
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Name')"
:label="t('Name')" v-model="data.name"
v-model="data.name" :rules="validate('province.name')"
:rules="validate('province.name')" />
/> <VnSelect
</div> :label="t('Autonomy')"
<div class="col"> :options="autonomiesOptions"
<VnSelect hide-selected
:label="t('Autonomy')" option-label="name"
:options="autonomiesOptions" option-value="id"
hide-selected v-model="data.autonomyFk"
option-label="name" :rules="validate('province.autonomyFk')"
option-value="id" />
v-model="data.autonomyFk"
:rules="validate('province.autonomyFk')"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModelPopup> </FormModelPopup>

77
src/components/CreateThermographForm.vue
View File

@ -54,51 +54,42 @@ const onDataSaved = (dataSaved) => {
> >
<template #form-inputs="{ data, validate }"> <template #form-inputs="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Identifier')"
:label="t('Identifier')" v-model="data.thermographId"
v-model="data.thermographId" :required="true"
:required="true" :rules="validate('thermograph.id')"
:rules="validate('thermograph.id')" />
/> <VnSelect
</div> :label="t('Model')"
:options="thermographsModels"
<div class="col"> hide-selected
<VnSelect option-label="value"
:label="t('Model')" option-value="value"
:options="thermographsModels" v-model="data.model"
hide-selected :required="true"
option-label="value" :rules="validate('thermograph.model')"
option-value="value" />
v-model="data.model"
:required="true"
:rules="validate('thermograph.model')"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-xl"> <VnRow class="row q-gutter-md q-mb-xl">
<div class="col"> <VnSelect
<VnSelect :label="t('Warehouse')"
:label="t('Warehouse')" :options="warehousesOptions"
:options="warehousesOptions" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="data.warehouseId"
v-model="data.warehouseId" :required="true"
:required="true" />
/> <VnSelect
</div> :label="t('Temperature')"
<div class="col"> :options="temperaturesOptions"
<VnSelect hide-selected
:label="t('Temperature')" option-label="name"
:options="temperaturesOptions" option-value="code"
hide-selected v-model="data.temperatureFk"
option-label="name" :required="true"
option-value="code" />
v-model="data.temperatureFk"
:required="true"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModelPopup> </FormModelPopup>

47
src/components/CrudModel.vue
View File

@ -1,6 +1,7 @@
<script setup> <script setup>
import axios from 'axios'; import axios from 'axios';
import { computed, ref, watch } from 'vue'; import { computed, ref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useValidator } from 'src/composables/useValidator'; import { useValidator } from 'src/composables/useValidator';
@ -10,6 +11,7 @@ import VnConfirm from 'components/ui/VnConfirm.vue';
import SkeletonTable from 'components/ui/SkeletonTable.vue'; import SkeletonTable from 'components/ui/SkeletonTable.vue';
import { tMobile } from 'src/composables/tMobile'; import { tMobile } from 'src/composables/tMobile';
const { push } = useRouter();
const quasar = useQuasar(); const quasar = useQuasar();
const stateStore = useStateStore(); const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
@ -60,6 +62,11 @@ const $props = defineProps({
type: Function, type: Function,
default: null, default: null,
}, },
goTo: {
type: String,
default: '',
description: 'It is used for redirect on click "save and continue"',
},
}); });
const isLoading = ref(false); const isLoading = ref(false);
@ -81,6 +88,7 @@ defineExpose({
hasChanges, hasChanges,
saveChanges, saveChanges,
getChanges, getChanges,
formData,
}); });
async function fetch(data) { async function fetch(data) {
@ -127,6 +135,11 @@ async function onSubmit() {
await saveChanges($props.saveFn ? formData.value : null); await saveChanges($props.saveFn ? formData.value : null);
} }
async function onSumbitAndGo() {
await onSubmit();
push({ path: $props.goTo });
}
async function saveChanges(data) { async function saveChanges(data) {
if ($props.saveFn) { if ($props.saveFn) {
$props.saveFn(data, getChanges); $props.saveFn(data, getChanges);
@ -309,7 +322,40 @@ watch(formUrl, async () => {
:title="t('globals.reset')" :title="t('globals.reset')"
v-if="$props.defaultReset" v-if="$props.defaultReset"
/> />
<QBtnDropdown
v-if="$props.goTo && $props.defaultSave"
@click="onSumbitAndGo"
:label="tMobile('globals.saveAndContinue')"
:title="t('globals.saveAndContinue')"
:disable="!hasChanges"
color="primary"
icon="save"
split
>
<QList>
<QItem
color="primary"
clickable
v-close-popup
@click="onSubmit"
:title="t('globals.save')"
>
<QItemSection>
<QItemLabel>
<QIcon
name="save"
color="white"
class="q-mr-sm"
size="sm"
/>
{{ t('globals.save').toUpperCase() }}
</QItemLabel>
</QItemSection>
</QItem>
</QList>
</QBtnDropdown>
<QBtn <QBtn
v-else-if="!$props.goTo && $props.defaultSave"
:label="tMobile('globals.save')" :label="tMobile('globals.save')"
ref="saveButtonRef" ref="saveButtonRef"
color="primary" color="primary"
@ -317,7 +363,6 @@ watch(formUrl, async () => {
@click="onSubmit" @click="onSubmit"
:disable="!hasChanges" :disable="!hasChanges"
:title="t('globals.save')" :title="t('globals.save')"
v-if="$props.defaultSave"
/> />
<slot name="moreAfterActions" /> <slot name="moreAfterActions" />
</QBtnGroup> </QBtnGroup>

96
src/components/EditPictureForm.vue
View File

@ -246,61 +246,55 @@ const makeRequest = async () => {
<div class="column"> <div class="column">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QOptionGroup
<QOptionGroup :options="uploadMethodsOptions"
:options="uploadMethodsOptions" type="radio"
type="radio" v-model="uploadMethodSelected"
v-model="uploadMethodSelected" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QFile
<QFile v-if="uploadMethodSelected === 'computer'"
v-if="uploadMethodSelected === 'computer'" ref="inputFileRef"
ref="inputFileRef" :label="t('File')"
:label="t('File')" :multiple="false"
:multiple="false" v-model="newPhoto.files"
v-model="newPhoto.files" @update:model-value="updatePhotoPreview($event)"
@update:model-value="updatePhotoPreview($event)" :accept="allowedContentTypes"
:accept="allowedContentTypes" class="required cursor-pointer"
class="required cursor-pointer" >
> <template #append>
<template #append> <QIcon
<QIcon name="vn:attach"
name="vn:attach" class="cursor-pointer q-mr-sm"
class="cursor-pointer q-mr-sm" @click="openInputFile()"
@click="openInputFile()" >
> <!-- <QTooltip>{{ t('globals.selectFile') }}</QTooltip> -->
<!-- <QTooltip>{{ t('globals.selectFile') }}</QTooltip> --> </QIcon>
</QIcon> <QIcon name="info" class="cursor-pointer">
<QIcon name="info" class="cursor-pointer"> <QTooltip>{{
<QTooltip>{{ t('globals.allowedFilesText', {
t('globals.allowedFilesText', { allowedContentTypes: allowedContentTypes,
allowedContentTypes: allowedContentTypes, })
}) }}</QTooltip>
}}</QTooltip> </QIcon>
</QIcon> </template>
</template> </QFile>
</QFile> <VnInput
<VnInput v-if="uploadMethodSelected === 'URL'"
v-if="uploadMethodSelected === 'URL'" v-model="newPhoto.url"
v-model="newPhoto.url" @update:model-value="updatePhotoPreview($event)"
@update:model-value="updatePhotoPreview($event)" placeholder="https://"
placeholder="https://" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Orientation')"
:label="t('Orientation')" :options="viewportTypes"
:options="viewportTypes" hide-selected
hide-selected option-label="description"
option-label="description" v-model="viewportSelection"
v-model="viewportSelection" />
/>
</div>
</VnRow> </VnRow>
<div class="q-mt-lg row justify-end"> <div class="q-mt-lg row justify-end">
<QBtn <QBtn

2
src/components/FetchData.vue
View File

@ -24,7 +24,7 @@ const $props = defineProps({
default: '', default: '',
}, },
limit: { limit: {
type: String, type: [String, Number],
default: '', default: '',
}, },
params: { params: {

68
src/components/FilterItemForm.vue
View File

@ -152,48 +152,32 @@ const selectItem = ({ id }) => {
</span> </span>
<h1 class="title">{{ t('Filter item') }}</h1> <h1 class="title">{{ t('Filter item') }}</h1>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput :label="t('entry.buys.name')" v-model="itemFilterParams.name" />
<VnInput <VnInput :label="t('entry.buys.size')" v-model="itemFilterParams.size" />
:label="t('entry.buys.name')" <VnSelect
v-model="itemFilterParams.name" :label="t('entry.buys.producer')"
/> :options="producersOptions"
</div> hide-selected
<div class="col"> option-label="name"
<VnInput option-value="id"
:label="t('entry.buys.size')" v-model="itemFilterParams.producerFk"
v-model="itemFilterParams.size" />
/> <VnSelect
</div> :label="t('entry.buys.type')"
<div class="col"> :options="ItemTypesOptions"
<VnSelect hide-selected
:label="t('entry.buys.producer')" option-label="name"
:options="producersOptions" option-value="id"
hide-selected v-model="itemFilterParams.typeFk"
option-label="name" />
option-value="id" <VnSelect
v-model="itemFilterParams.producerFk" :label="t('entry.buys.color')"
/> :options="InksOptions"
</div> hide-selected
<div class="col"> option-label="name"
<VnSelect option-value="id"
:label="t('entry.buys.type')" v-model="itemFilterParams.inkFk"
:options="ItemTypesOptions" />
hide-selected
option-label="name"
option-value="id"
v-model="itemFilterParams.typeFk"
/>
</div>
<div class="col">
<VnSelect
:label="t('entry.buys.color')"
:options="InksOptions"
hide-selected
option-label="name"
option-value="id"
v-model="itemFilterParams.inkFk"
/>
</div>
</VnRow> </VnRow>
<div class="q-mt-lg row justify-end"> <div class="q-mt-lg row justify-end">
<QBtn <QBtn

74
src/components/FilterTravelForm.vue
View File

@ -145,48 +145,38 @@ const selectTravel = ({ id }) => {
</span> </span>
<h1 class="title">{{ t('Filter travels') }}</h1> <h1 class="title">{{ t('Filter travels') }}</h1>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('entry.basicData.agency')"
:label="t('entry.basicData.agency')" :options="agenciesOptions"
:options="agenciesOptions" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="travelFilterParams.agencyModeFk"
v-model="travelFilterParams.agencyModeFk" />
/> <VnSelect
</div> :label="t('entry.basicData.warehouseOut')"
<div class="col"> :options="warehousesOptions"
<VnSelect hide-selected
:label="t('entry.basicData.warehouseOut')" option-label="name"
:options="warehousesOptions" option-value="id"
hide-selected v-model="travelFilterParams.warehouseOutFk"
option-label="name" />
option-value="id" <VnSelect
v-model="travelFilterParams.warehouseOutFk" :label="t('entry.basicData.warehouseIn')"
/> :options="warehousesOptions"
</div> hide-selected
<div class="col"> option-label="name"
<VnSelect option-value="id"
:label="t('entry.basicData.warehouseIn')" v-model="travelFilterParams.warehouseInFk"
:options="warehousesOptions" />
hide-selected <VnInputDate
option-label="name" :label="t('entry.basicData.shipped')"
option-value="id" v-model="travelFilterParams.shipped"
v-model="travelFilterParams.warehouseInFk" />
/> <VnInputDate
</div> :label="t('entry.basicData.landed')"
<div class="col"> v-model="travelFilterParams.landed"
<VnInputDate />
:label="t('entry.basicData.shipped')"
v-model="travelFilterParams.shipped"
/>
</div>
<div class="col">
<VnInputDate
:label="t('entry.basicData.landed')"
v-model="travelFilterParams.landed"
/>
</div>
</VnRow> </VnRow>
<div class="q-mt-lg row justify-end"> <div class="q-mt-lg row justify-end">
<QBtn <QBtn

215
src/components/FormModel.vue
View File

@ -1,7 +1,7 @@
<script setup> <script setup>
import axios from 'axios'; import axios from 'axios';
import { onMounted, onUnmounted, computed, ref, watch, nextTick } from 'vue'; import { onMounted, onUnmounted, computed, ref, watch, nextTick } from 'vue';
import { onBeforeRouteLeave } from 'vue-router'; import { onBeforeRouteLeave, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
@ -11,7 +11,9 @@ import useNotify from 'src/composables/useNotify.js';
import SkeletonForm from 'components/ui/SkeletonForm.vue'; import SkeletonForm from 'components/ui/SkeletonForm.vue';
import VnConfirm from './ui/VnConfirm.vue'; import VnConfirm from './ui/VnConfirm.vue';
import { tMobile } from 'src/composables/tMobile'; import { tMobile } from 'src/composables/tMobile';
import { useArrayData } from 'src/composables/useArrayData';
const { push } = useRouter();
const quasar = useQuasar(); const quasar = useQuasar();
const state = useState(); const state = useState();
const stateStore = useStateStore(); const stateStore = useStateStore();
@ -74,55 +76,17 @@ const $props = defineProps({
type: Function, type: Function,
default: null, default: null,
}, },
goTo: {
type: String,
default: '',
description: 'It is used for redirect on click "save and continue"',
},
}); });
const emit = defineEmits(['onFetch', 'onDataSaved']); const emit = defineEmits(['onFetch', 'onDataSaved']);
const componentIsRendered = ref(false); const componentIsRendered = ref(false);
const arrayData = useArrayData($props.model);
onMounted(async () => {
originalData.value = $props.formInitialData;
nextTick(() => {
componentIsRendered.value = true;
});
// Podemos enviarle al form la estructura de data inicial sin necesidad de fetchearla
state.set($props.model, $props.formInitialData);
if ($props.autoLoad && !$props.formInitialData) {
await fetch();
}
// 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) {
setTimeout(() => {
startFormWatcher();
}, 100);
}
});
onBeforeRouteLeave((to, from, next) => {
if (hasChanges.value && $props.observeFormChanges)
quasar.dialog({
component: VnConfirm,
componentProps: {
title: t('Unsaved changes will be lost'),
message: t('Are you sure exit without saving?'),
promise: () => next(),
},
});
else next();
});
onUnmounted(() => {
// Restauramos los datos originales en el store si se realizaron cambios en el formulario pero no se guardaron, evitando modificaciones erróneas.
if (hasChanges.value) {
state.set($props.model, originalData.value);
return;
}
if ($props.clearStoreOnUnmount) state.unset($props.model);
});
const isLoading = ref(false); const isLoading = ref(false);
// Si elegimos observar los cambios del form significa que inicialmente las actions estaran deshabilitadas // Si elegimos observar los cambios del form significa que inicialmente las actions estaran deshabilitadas
const isResetting = ref(false); const isResetting = ref(false);
@ -143,26 +107,72 @@ const defaultButtons = computed(() => ({
}, },
...$props.defaultButtons, ...$props.defaultButtons,
})); }));
const startFormWatcher = () => {
onMounted(async () => {
originalData.value = JSON.parse(JSON.stringify($props.formInitialData ?? {}));
nextTick(() => (componentIsRendered.value = true));
// Podemos enviarle al form la estructura de data inicial sin necesidad de fetchearla
state.set($props.model, $props.formInitialData);
if ($props.autoLoad && !$props.formInitialData && $props.url) await fetch();
else if (arrayData.store.data) updateAndEmit(arrayData.store.data, 'onFetch');
if ($props.observeFormChanges) {
watch(
() => formData.value,
(newVal, oldVal) => {
if (!oldVal) return;
hasChanges.value =
!isResetting.value &&
JSON.stringify(newVal) !== JSON.stringify(originalData.value);
isResetting.value = false;
},
{ deep: true }
);
}
});
if (!$props.url)
watch( watch(
() => formData.value, () => arrayData.store.data,
(val) => { (val) => updateAndEmit(val, 'onFetch')
hasChanges.value = !isResetting.value && val;
isResetting.value = false;
},
{ deep: true }
); );
};
watch(formUrl, async () => {
originalData.value = null;
reset();
await fetch();
});
onBeforeRouteLeave((to, from, next) => {
if (hasChanges.value && $props.observeFormChanges)
quasar.dialog({
component: VnConfirm,
componentProps: {
title: t('Unsaved changes will be lost'),
message: t('Are you sure exit without saving?'),
promise: () => next(),
},
});
else next();
});
onUnmounted(() => {
// Restauramos los datos originales en el store si se realizaron cambios en el formulario pero no se guardaron, evitando modificaciones erróneas.
if (hasChanges.value) return state.set($props.model, originalData.value);
if ($props.clearStoreOnUnmount) state.unset($props.model);
});
async function fetch() { async function fetch() {
try { try {
const { data } = await axios.get($props.url, { let { data } = await axios.get($props.url, {
params: { filter: JSON.stringify($props.filter) }, params: { filter: JSON.stringify($props.filter) },
}); });
state.set($props.model, data); if (Array.isArray(data)) data = data[0] ?? {};
originalData.value = data && JSON.parse(JSON.stringify(data));
emit('onFetch', state.get($props.model)); updateAndEmit(data, 'onFetch');
} catch (error) { } catch (error) {
state.set($props.model, {}); state.set($props.model, {});
originalData.value = {}; originalData.value = {};
@ -170,38 +180,39 @@ async function fetch() {
} }
async function save() { async function save() {
if ($props.observeFormChanges && !hasChanges.value) { if ($props.observeFormChanges && !hasChanges.value)
notify('globals.noChanges', 'negative'); return notify('globals.noChanges', 'negative');
return;
}
isLoading.value = true;
isLoading.value = true;
try { try {
const body = $props.mapper ? $props.mapper(formData.value) : formData.value; const body = $props.mapper ? $props.mapper(formData.value) : formData.value;
const method = $props.urlCreate ? 'post' : 'patch';
const url =
$props.urlCreate || $props.urlUpdate || $props.url || arrayData.store.url;
let response; let response;
if ($props.saveFn) response = await $props.saveFn(body); if ($props.saveFn) response = await $props.saveFn(body);
else else response = await axios[method](url, body);
response = await axios[$props.urlCreate ? 'post' : 'patch'](
$props.urlCreate || $props.urlUpdate || $props.url,
body
);
if ($props.urlCreate) notify('globals.dataCreated', 'positive'); if ($props.urlCreate) notify('globals.dataCreated', 'positive');
emit('onDataSaved', formData.value, response?.data);
originalData.value = JSON.parse(JSON.stringify(formData.value));
hasChanges.value = false; hasChanges.value = false;
isLoading.value = false;
updateAndEmit(response?.data, 'onDataSaved');
} catch (err) { } catch (err) {
console.error(err); console.error(err);
notify('errors.writeRequest', 'negative'); notify('errors.writeRequest', 'negative');
} }
isLoading.value = false; }
async function saveAndGo() {
await save();
push({ path: $props.goTo });
} }
function reset() { function reset() {
state.set($props.model, originalData.value); updateAndEmit(originalData.value, 'onFetch');
originalData.value = JSON.parse(JSON.stringify(originalData.value));
emit('onFetch', state.get($props.model));
if ($props.observeFormChanges) { if ($props.observeFormChanges) {
hasChanges.value = false; hasChanges.value = false;
isResetting.value = true; isResetting.value = true;
@ -223,17 +234,15 @@ function filter(value, update, filterOptions) {
); );
} }
watch(formUrl, async () => { function updateAndEmit(val, evt) {
originalData.value = null; state.set($props.model, val);
reset(); originalData.value = val && JSON.parse(JSON.stringify(val));
fetch(); if (!$props.url) arrayData.store.data = val;
});
defineExpose({ emit(evt, state.get($props.model));
save, }
isLoading,
hasChanges, defineExpose({ save, isLoading, hasChanges });
});
</script> </script>
<template> <template>
<div class="column items-center full-width"> <div class="column items-center full-width">
@ -270,10 +279,42 @@ defineExpose({
:disable="!hasChanges" :disable="!hasChanges"
:title="t(defaultButtons.reset.label)" :title="t(defaultButtons.reset.label)"
/> />
<QBtnDropdown
v-if="$props.goTo"
@click="saveAndGo"
:label="tMobile('globals.saveAndContinue')"
:title="t('globals.saveAndContinue')"
:disable="!hasChanges"
color="primary"
icon="save"
split
>
<QList>
<QItem
clickable
v-close-popup
@click="save"
:title="t('globals.save')"
>
<QItemSection>
<QItemLabel>
<QIcon
name="save"
color="white"
class="q-mr-sm"
size="sm"
/>
{{ t('globals.save').toUpperCase() }}
</QItemLabel>
</QItemSection>
</QItem>
</QList>
</QBtnDropdown>
<QBtn <QBtn
:label="tMobile(defaultButtons.save.label)" v-else
:color="defaultButtons.save.color" :label="tMobile('globals.save')"
:icon="defaultButtons.save.icon" color="primary"
icon="save"
@click="save" @click="save"
:disable="!hasChanges" :disable="!hasChanges"
:title="t(defaultButtons.save.label)" :title="t(defaultButtons.save.label)"

2
src/components/FormModelPopup.vue
View File

@ -6,7 +6,7 @@ import FormModel from 'components/FormModel.vue';
const emit = defineEmits(['onDataSaved']); const emit = defineEmits(['onDataSaved']);
const $props = defineProps({ defineProps({
title: { title: {
type: String, type: String,
default: '', default: '',

2
src/components/FormPopup.vue
View File

@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
const emit = defineEmits(['onSubmit']); const emit = defineEmits(['onSubmit']);
const $props = defineProps({ defineProps({
title: { title: {
type: String, type: String,
default: '', default: '',

12
src/components/RegularizeStockForm.vue
View File

@ -50,13 +50,11 @@ const onDataSaved = (data) => {
> >
<template #form-inputs="{ data }"> <template #form-inputs="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput :label="t('Type the visible quantity')"
:label="t('Type the visible quantity')" v-model.number="data.quantity"
v-model.number="data.quantity" autofocus
autofocus />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <div class="col">

124
src/components/TransferInvoiceForm.vue
View File

@ -83,74 +83,66 @@ const transferInvoice = async () => {
> >
<template #form-inputs> <template #form-inputs>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Client')"
:label="t('Client')" :options="clientsOptions"
:options="clientsOptions" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="transferInvoiceParams.newClientFk"
v-model="transferInvoiceParams.newClientFk" :required="true"
:required="true" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>
<QItemLabel> #{{ scope.opt?.id }} -
#{{ scope.opt?.id }} - {{ scope.opt?.name }}
{{ scope.opt?.name }} </QItemLabel>
</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect> <VnSelect
</div> :label="t('Rectificative type')"
<div class="col"> :options="rectificativeTypeOptions"
<VnSelect hide-selected
:label="t('Rectificative type')" option-label="description"
:options="rectificativeTypeOptions" option-value="id"
hide-selected v-model="transferInvoiceParams.cplusRectificationTypeFk"
option-label="description" :required="true"
option-value="id" />
v-model="transferInvoiceParams.cplusRectificationTypeFk"
:required="true"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Class')"
:label="t('Class')" :options="siiTypeInvoiceOutsOptions"
:options="siiTypeInvoiceOutsOptions" hide-selected
hide-selected option-label="description"
option-label="description" option-value="id"
option-value="id" v-model="transferInvoiceParams.siiTypeInvoiceOutFk"
v-model="transferInvoiceParams.siiTypeInvoiceOutFk" :required="true"
:required="true" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>
<QItemLabel> {{ scope.opt?.code }} -
{{ scope.opt?.code }} - {{ scope.opt?.description }}
{{ scope.opt?.description }} </QItemLabel>
</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect> <VnSelect
</div> :label="t('Type')"
<div class="col"> :options="invoiceCorrectionTypesOptions"
<VnSelect hide-selected
:label="t('Type')" option-label="description"
:options="invoiceCorrectionTypesOptions" option-value="id"
hide-selected v-model="transferInvoiceParams.invoiceCorrectionTypeFk"
option-label="description" :required="true"
option-value="id" />
v-model="transferInvoiceParams.invoiceCorrectionTypeFk"
:required="true"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormPopup> </FormPopup>

10
src/components/UserPanel.vue
View File

@ -178,6 +178,8 @@ function copyUserToken() {
:options="warehousesData" :options="warehousesData"
option-label="name" option-label="name"
option-value="id" option-value="id"
input-debounce="0"
hide-selected
/> />
<VnSelect <VnSelect
:label="t('components.userPanel.localBank')" :label="t('components.userPanel.localBank')"
@ -185,6 +187,8 @@ function copyUserToken() {
:options="accountBankData" :options="accountBankData"
option-label="bank" option-label="bank"
option-value="id" option-value="id"
input-debounce="0"
hide-selected
> >
<template #option="{ itemProps, opt }"> <template #option="{ itemProps, opt }">
<QItem v-bind="itemProps"> <QItem v-bind="itemProps">
@ -201,10 +205,11 @@ function copyUserToken() {
<VnSelect <VnSelect
:label="t('components.userPanel.localCompany')" :label="t('components.userPanel.localCompany')"
hide-selected hide-selected
v-model="user.companyFk" v-model="user.localCompanyFk"
:options="companiesData" :options="companiesData"
option-label="code" option-label="code"
option-value="id" option-value="id"
input-debounce="0"
/> />
<VnSelect <VnSelect
:label="t('components.userPanel.userWarehouse')" :label="t('components.userPanel.userWarehouse')"
@ -213,6 +218,7 @@ function copyUserToken() {
:options="warehousesData" :options="warehousesData"
option-label="name" option-label="name"
option-value="id" option-value="id"
input-debounce="0"
/> />
</VnRow> </VnRow>
<VnRow> <VnRow>
@ -224,6 +230,8 @@ function copyUserToken() {
option-label="code" option-label="code"
option-value="id" option-value="id"
style="flex: 0" style="flex: 0"
dense
input-debounce="0"
/> />
</VnRow> </VnRow>
</div> </div>

55
src/components/common/RightMenu.vue Normal file
View File

@ -0,0 +1,55 @@
<script setup>
import { ref, onMounted, useSlots } from 'vue';
import { useI18n } from 'vue-i18n';
import { useStateStore } from 'stores/useStateStore';
const slots = useSlots();
const hasContent = ref(false);
const rightPanel = ref(null);
onMounted(() => {
rightPanel.value = document.querySelector('#right-panel');
if (rightPanel.value.childNodes.length) hasContent.value = true;
// Check if there's content to display
const observer = new MutationObserver(() => {
hasContent.value = rightPanel.value.childNodes.length;
});
if (rightPanel.value)
observer.observe(rightPanel.value, {
subtree: true,
childList: true,
attributes: true,
});
if (!slots['right-panel'] && !hasContent.value) stateStore.rightDrawer = false;
});
const { t } = useI18n();
const stateStore = useStateStore();
</script>
<template>
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
v-if="hasContent || $slots['right-panel']"
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8">
<div id="right-panel"></div>
<slot v-if="!hasContent" name="right-panel" />
</QScrollArea>
</QDrawer>
</template>

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

@ -29,10 +29,12 @@ async function confirm() {
const response = { address: address.value }; const response = { address: address.value };
if (props.promise) { if (props.promise) {
isLoading.value = true; isLoading.value = true;
const { address: _address, ...restData } = props.data;
try { try {
Object.assign(response, restData); const dataCopy = JSON.parse(JSON.stringify({ ...props.data }));
delete dataCopy.address;
Object.assign(response, dataCopy);
await props.promise(response); await props.promise(response);
} finally { } finally {
isLoading.value = false; isLoading.value = false;

64
src/components/common/VnCard.vue
View File

@ -1,13 +1,13 @@
<script setup> <script setup>
import { onBeforeMount, computed } from 'vue'; import { onBeforeMount, computed, watchEffect } from 'vue';
import { useRoute, onBeforeRouteUpdate } from 'vue-router'; import { useRoute, onBeforeRouteUpdate } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import useCardSize from 'src/composables/useCardSize'; import useCardSize from 'src/composables/useCardSize';
import VnSubToolbar from '../ui/VnSubToolbar.vue'; import VnSubToolbar from '../ui/VnSubToolbar.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue'; import VnSearchbar from 'components/ui/VnSearchbar.vue';
import LeftMenu from 'components/LeftMenu.vue'; import LeftMenu from 'components/LeftMenu.vue';
import RightMenu from 'components/common/RightMenu.vue';
const props = defineProps({ const props = defineProps({
dataKey: { type: String, required: true }, dataKey: { type: String, required: true },
@ -15,13 +15,15 @@ const props = defineProps({
customUrl: { type: String, default: undefined }, customUrl: { type: String, default: undefined },
filter: { type: Object, default: () => {} }, filter: { type: Object, default: () => {} },
descriptor: { type: Object, required: true }, descriptor: { type: Object, required: true },
searchbarDataKey: { type: String, default: undefined }, filterPanel: { type: Object, default: undefined },
searchbarUrl: { type: String, default: undefined }, searchDataKey: { type: String, default: undefined },
searchUrl: { type: String, default: undefined },
searchbarLabel: { type: String, default: '' }, searchbarLabel: { type: String, default: '' },
searchbarInfo: { type: String, default: '' }, searchbarInfo: { type: String, default: '' },
searchCustomRouteRedirect: { type: String, default: undefined },
searchRedirect: { type: Boolean, default: true },
}); });
const { t } = useI18n();
const stateStore = useStateStore(); const stateStore = useStateStore();
const route = useRoute(); const route = useRoute();
const url = computed(() => { const url = computed(() => {
@ -42,31 +44,45 @@ onBeforeMount(async () => {
if (props.baseUrl) { if (props.baseUrl) {
onBeforeRouteUpdate(async (to, from) => { onBeforeRouteUpdate(async (to, from) => {
if (to.params.id !== from.params.id) { if (to.params.id !== from.params.id) {
arrayData.store.url = `${props.baseUrl}/${route.params.id}`; arrayData.store.url = `${props.baseUrl}/${to.params.id}`;
await arrayData.fetch({ append: false }); await arrayData.fetch({ append: false });
} }
}); });
} }
watchEffect(() => {
if (Array.isArray(arrayData.store.data))
arrayData.store.data = arrayData.store.data[0];
});
</script> </script>
<template> <template>
<Teleport <template v-if="stateStore.isHeaderMounted()">
to="#searchbar" <Teleport to="#searchbar" v-if="props.searchDataKey">
v-if="stateStore.isHeaderMounted() && props.searchbarDataKey" <slot name="searchbar">
> <VnSearchbar
<VnSearchbar :data-key="props.searchDataKey"
:data-key="props.searchbarDataKey" :url="props.searchUrl"
:url="props.searchbarUrl" :label="props.searchbarLabel"
:label="t(props.searchbarLabel)" :info="props.searchbarInfo"
:info="t(props.searchbarInfo)" :custom-route-redirect-name="searchCustomRouteRedirect"
/> :redirect="searchRedirect"
</Teleport> />
<QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256"> </slot>
<QScrollArea class="fit"> </Teleport>
<component :is="descriptor" /> <slot v-else name="searchbar" />
<QSeparator /> <QDrawer v-model="stateStore.leftDrawer" show-if-above :width="256">
<LeftMenu source="card" /> <QScrollArea class="fit">
</QScrollArea> <component :is="descriptor" />
</QDrawer> <QSeparator />
<LeftMenu source="card" />
</QScrollArea>
</QDrawer>
<RightMenu>
<template #right-panel v-if="props.filterPanel">
<component :is="props.filterPanel" :data-key="props.searchDataKey" />
</template>
</RightMenu>
</template>
<QPageContainer> <QPageContainer>
<QPage> <QPage>
<VnSubToolbar /> <VnSubToolbar />

1
src/components/common/VnDms.vue
View File

@ -78,6 +78,7 @@ async function save() {
const body = mapperDms(dms.value); const body = mapperDms(dms.value);
const response = await axios.post(getUrl(), body[0], body[1]); const response = await axios.post(getUrl(), body[0], body[1]);
emit('onDataSaved', body[1].params, response); emit('onDataSaved', body[1].params, response);
return response;
} }
function defaultData() { function defaultData() {

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

@ -35,7 +35,7 @@ const $props = defineProps({
downloadModel: { downloadModel: {
type: String, type: String,
required: false, required: false,
default: null, default: undefined,
}, },
defaultDmsCode: { defaultDmsCode: {
type: String, type: String,

31
src/components/common/VnInput.vue
View File

@ -37,14 +37,6 @@ const styleAttrs = computed(() => {
: {}; : {};
}); });
const onEnterPress = () => {
emit('keyup.enter');
};
const handleValue = (val = null) => {
value.value = val;
};
const focus = () => { const focus = () => {
vnInputRef.value.focus(); vnInputRef.value.focus();
}; };
@ -53,10 +45,12 @@ defineExpose({
focus, focus,
}); });
const inputRules = (val) => { const inputRules = [
const { min } = vnInputRef.value.$attrs; (val) => {
if (min >= 0) if (Math.floor(val) < min) return t('inputMin', { value: min }); const { min } = vnInputRef.value.$attrs;
}; if (min >= 0) if (Math.floor(val) < min) return t('inputMin', { value: min });
},
];
</script> </script>
<template> <template>
@ -71,22 +65,23 @@ const inputRules = (val) => {
v-bind="{ ...$attrs, ...styleAttrs }" v-bind="{ ...$attrs, ...styleAttrs }"
:type="$attrs.type" :type="$attrs.type"
:class="{ required: $attrs.required }" :class="{ required: $attrs.required }"
@keyup.enter="onEnterPress()" @keyup.enter="emit('keyup.enter')"
:clearable="false" :clearable="false"
:rules="[inputRules]" :rules="inputRules"
:lazy-rules="true" :lazy-rules="true"
hide-bottom-space
> >
<template v-if="$slots.prepend" #prepend> <template v-if="$slots.prepend" #prepend>
<slot name="prepend" /> <slot name="prepend" />
</template> </template>
<template #append> <template #append>
<slot name="append" v-if="$slots.append" /> <slot name="append" v-if="$slots.append && !$attrs.disabled" />
<QIcon <QIcon
name="close" name="close"
size="xs" size="xs"
v-if="hover && value" v-if="$slots.append && hover && value && !$attrs.disabled"
@click="handleValue(null)" @click="value = null"
></QIcon> ></QIcon>
</template> </template>
</QInput> </QInput>

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

@ -2,6 +2,7 @@
import { computed, ref } from 'vue'; import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import isValidDate from 'filters/isValidDate'; import isValidDate from 'filters/isValidDate';
import VnInput from 'components/common/VnInput.vue';
const props = defineProps({ const props = defineProps({
modelValue: { modelValue: {
@ -74,7 +75,7 @@ const styleAttrs = computed(() => {
@click="isPopupOpen = true" @click="isPopupOpen = true"
> >
<template #append> <template #append>
<QIcon name="schedule" class="cursor-pointer"> <QIcon name="Schedule" class="cursor-pointer">
<QPopupProxy <QPopupProxy
v-model="isPopupOpen" v-model="isPopupOpen"
cover cover

15
src/components/common/VnLog.vue
View File

@ -622,21 +622,6 @@ setLogTree();
</QList> </QList>
</div> </div>
</div> </div>
<Teleport v-if="stateStore.isHeaderMounted()" to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click.stop="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
<QDrawer v-model="stateStore.rightDrawer" show-if-above side="right" :width="300"> <QDrawer v-model="stateStore.rightDrawer" show-if-above side="right" :width="300">
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<QList dense> <QList dense>

13
src/components/common/VnSelect.vue
View File

@ -22,6 +22,10 @@ const $props = defineProps({
type: String, type: String,
default: '', default: '',
}, },
optionFilter: {
type: String,
default: null,
},
url: { url: {
type: String, type: String,
default: '', default: '',
@ -57,9 +61,9 @@ const $props = defineProps({
}); });
const { t } = useI18n(); const { t } = useI18n();
const requiredFieldRule = (val) => !!val || t('globals.fieldRequired'); const requiredFieldRule = (val) => val ?? t('globals.fieldRequired');
const { optionLabel, optionValue, options, modelValue } = toRefs($props); const { optionLabel, optionValue, optionFilter, options, modelValue } = toRefs($props);
const myOptions = ref([]); const myOptions = ref([]);
const myOptionsOriginal = ref([]); const myOptionsOriginal = ref([]);
const vnSelectRef = ref(); const vnSelectRef = ref();
@ -109,9 +113,9 @@ async function fetchFilter(val) {
const { fields, sortBy, limit } = $props; const { fields, sortBy, limit } = $props;
let key = optionLabel.value; let key = optionLabel.value;
if (new RegExp(/\d/g).test(val)) key = optionValue.value; if (new RegExp(/\d/g).test(val)) key = optionFilter.value ?? optionValue.value;
const where = { [key]: { like: `%${val}%` } }; const where = { ...{ [key]: { like: `%${val}%` } }, ...$props.where };
return dataRef.value.fetch({ fields, where, order: sortBy, limit }); return dataRef.value.fetch({ fields, where, order: sortBy, limit });
} }
@ -167,6 +171,7 @@ watch(modelValue, (newValue) => {
hide-selected hide-selected
fill-input fill-input
ref="vnSelectRef" ref="vnSelectRef"
lazy-rules
:class="{ required: $attrs.required }" :class="{ required: $attrs.required }"
:rules="$attrs.required ? [requiredFieldRule] : null" :rules="$attrs.required ? [requiredFieldRule] : null"
virtual-scroll-slice-size="options.length" virtual-scroll-slice-size="options.length"

13
src/components/common/VnTitle.vue
View File

@ -1,16 +1,16 @@
<script setup> <script setup>
const $props = defineProps({ defineProps({
url: { type: String, default: null }, url: { type: String, default: null },
text: { type: String, default: null }, text: { type: String, default: null },
icon: { type: String, default: 'open_in_new' }, icon: { type: String, default: 'open_in_new' },
}); });
</script> </script>
<template> <template>
<div class="titleBox"> <div :class="$q.screen.gt.md ? 'q-pb-lg' : 'q-pb-md'">
<div class="header-link"> <div class="header-link">
<a :href="$props.url" :class="$props.url ? 'link' : 'color-vn-text'"> <a :href="url" :class="url ? 'link' : 'color-vn-text'">
{{ $props.text }} {{ text }}
<QIcon v-if="url" :name="$props.icon" /> <QIcon v-if="url" :name="icon" />
</a> </a>
</div> </div>
</div> </div>
@ -19,7 +19,4 @@ const $props = defineProps({
a { a {
font-size: large; font-size: large;
} }
.titleBox {
padding-bottom: 2%;
}
</style> </style>

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

@ -5,6 +5,7 @@ import SkeletonDescriptor from 'components/ui/SkeletonDescriptor.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { useState } from 'src/composables/useState'; import { useState } from 'src/composables/useState';
import { useRoute } from 'vue-router';
const $props = defineProps({ const $props = defineProps({
url: { url: {
@ -15,21 +16,21 @@ const $props = defineProps({
type: Object, type: Object,
default: null, default: null,
}, },
module: {
type: String,
required: true,
},
title: { title: {
type: String, type: String,
default: '', default: '',
}, },
subtitle: { subtitle: {
type: Number, type: Number,
default: 0, default: null,
}, },
dataKey: { dataKey: {
type: String, type: String,
default: '', default: null,
},
module: {
type: String,
default: null,
}, },
summary: { summary: {
type: Object, type: Object,
@ -40,21 +41,27 @@ const $props = defineProps({
const state = useState(); const state = useState();
const { t } = useI18n(); const { t } = useI18n();
const { viewSummary } = useSummaryDialog(); const { viewSummary } = useSummaryDialog();
const arrayData = useArrayData($props.dataKey || $props.module, { let arrayData;
url: $props.url, let store;
filter: $props.filter, let entity;
skip: 0,
});
const { store } = arrayData;
const entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
const isLoading = ref(false); const isLoading = ref(false);
defineExpose({ defineExpose({ getData });
getData,
});
onBeforeMount(async () => { onBeforeMount(async () => {
await getData(); arrayData = useArrayData($props.dataKey, {
watch($props, async () => await getData()); url: $props.url,
filter: $props.filter,
skip: 0,
});
store = arrayData.store;
entity = computed(() => (Array.isArray(store.data) ? store.data[0] : store.data));
// It enables to load data only once if the module is the same as the dataKey
if ($props.dataKey !== useRoute().meta.moduleName) await getData();
watch(
() => [$props.url, $props.filter],
async () => await getData()
);
}); });
async function getData() { async function getData() {
@ -132,7 +139,7 @@ const emit = defineEmits(['onFetch']);
<QItemLabel header class="ellipsis text-h5" :lines="1"> <QItemLabel header class="ellipsis text-h5" :lines="1">
<div class="title"> <div class="title">
<span v-if="$props.title" :title="$props.title"> <span v-if="$props.title" :title="$props.title">
{{ $props.title }} {{ entity[title] ?? $props.title }}
</span> </span>
<slot v-else name="description" :entity="entity"> <slot v-else name="description" :entity="entity">
<span :title="entity.name"> <span :title="entity.name">

21
src/components/ui/CardSummary.vue
View File

@ -54,6 +54,22 @@ async function fetch() {
emit('onFetch', Array.isArray(data) ? data[0] : data); emit('onFetch', Array.isArray(data) ? data[0] : data);
isLoading.value = false; isLoading.value = false;
} }
const showRedirectToSummaryIcon = computed(() => {
const exist = existSummary(route.matched);
return !isSummary.value && route.meta.moduleName && exist;
});
function existSummary(routes) {
const hasSummary = routes.some((r) => r.name === `${route.meta.moduleName}Summary`);
if (hasSummary) return hasSummary;
for (const current of routes) {
if (current.path != '/' && current.children) {
const exist = existSummary(current.children);
if (exist) return exist;
}
}
}
</script> </script>
<template> <template>
@ -64,7 +80,7 @@ async function fetch() {
<div class="summaryHeader bg-primary q-pa-sm text-weight-bolder"> <div class="summaryHeader bg-primary q-pa-sm text-weight-bolder">
<slot name="header-left"> <slot name="header-left">
<router-link <router-link
v-if="!isSummary && route.meta.moduleName" v-if="showRedirectToSummaryIcon"
class="header link" class="header link"
:to="{ :to="{
name: `${route.meta.moduleName}Summary`, name: `${route.meta.moduleName}Summary`,
@ -135,6 +151,9 @@ async function fetch() {
box-shadow: none; box-shadow: none;
.vn-label-value { .vn-label-value {
&.negative > .value span {
color: $alert;
}
display: flex; display: flex;
flex-direction: row; flex-direction: row;
margin-top: 2px; margin-top: 2px;

74
src/components/ui/FetchedTags.vue
View File

@ -1,5 +1,7 @@
<script setup> <script setup>
defineProps({ import { computed } from 'vue';
const $props = defineProps({
maxLength: { maxLength: {
type: Number, type: Number,
required: true, required: true,
@ -8,53 +10,40 @@ defineProps({
type: Object, type: Object,
required: true, required: true,
}, },
tag: {
type: String,
required: false,
default: 'tag',
},
value: {
type: String,
required: false,
default: 'value',
},
});
const tags = computed(() => {
return Object.keys($props.item)
.filter((i) => i.startsWith(`${$props.tag}`))
.reduce((acc, tag) => {
const n = tag.split(`${$props.tag}`)[1];
const key = `${$props.tag}${n}`;
const value = `${$props.value}${n}`;
acc[$props.item[key] ?? key] = $props.item[value] ?? '';
return acc;
}, {});
}); });
</script> </script>
<template> <template>
<div class="fetchedTags"> <div class="fetchedTags">
<div class="wrap"> <div class="wrap">
<div <div
v-for="(val, key) in tags"
:key="key"
class="inline-tag" class="inline-tag"
:class="{ empty: !$props.item.value5 }" :title="`${key}: ${val}`"
:title="$props.item.tag5 + ': ' + $props.item.value5" :class="{ empty: !val }"
> >
{{ $props.item.value5 }} {{ val }}
</div>
<div
class="inline-tag"
:class="{ empty: !$props.item.tag6 }"
:title="$props.item.tag6 + ': ' + $props.item.value6"
>
{{ $props.item.value6 }}
</div>
<div
class="inline-tag"
:class="{ empty: !$props.item.value7 }"
:title="$props.item.tag7 + ': ' + $props.item.value7"
>
{{ $props.item.value7 }}
</div>
<div
class="inline-tag"
:class="{ empty: !$props.item.value8 }"
:title="$props.item.tag8 + ': ' + $props.item.value8"
>
{{ $props.item.value8 }}
</div>
<div
class="inline-tag"
:class="{ empty: !$props.item.value9 }"
:title="$props.item.tag9 + ': ' + $props.item.value9"
>
{{ $props.item.value9 }}
</div>
<div
class="inline-tag"
:class="{ empty: !$props.item.value10 }"
:title="$props.item.tag10 + ': ' + $props.item.value10"
>
{{ $props.item.value10 }}
</div> </div>
</div> </div>
</div> </div>
@ -72,7 +61,7 @@ defineProps({
.inline-tag { .inline-tag {
height: 1rem; height: 1rem;
margin: 0.05rem; margin: 0.05rem;
color: $secondary; color: $color-font-secondary;
text-align: center; text-align: center;
font-size: smaller; font-size: smaller;
padding: 1px; padding: 1px;
@ -83,9 +72,8 @@ defineProps({
min-width: 4rem; min-width: 4rem;
max-width: 4rem; max-width: 4rem;
} }
.empty { .empty {
border: 1px solid $color-spacer-light; border: 1px solid #2b2b2b;
} }
} }
</style> </style>

7
src/components/ui/QCalendarMonthWrapper.vue
View File

@ -59,12 +59,10 @@ const containerClasses = computed(() => {
// Clases para modificar el color de fecha seleccionada en componente QCalendarMonth // Clases para modificar el color de fecha seleccionada en componente QCalendarMonth
.q-dark div .q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button { .q-dark div .q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
background-color: $primary !important; background-color: $primary !important;
color: white !important;
} }
.q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button { .q-calendar-mini .q-calendar-month__day.q-selected .q-calendar__button {
background-color: $primary !important; background-color: $primary !important;
color: white !important;
} }
.q-calendar-month__head--weekday { .q-calendar-month__head--weekday {
@ -108,11 +106,10 @@ const containerClasses = computed(() => {
font-size: 13px; font-size: 13px;
&:hover { &:hover {
background-color: var(--vn-accent-color); background-color: var(--vn-label-color);
cursor: pointer; cursor: pointer;
} }
} }
.q-calendar-month__week--days > div:nth-child(6), .q-calendar-month__week--days > div:nth-child(6),
.q-calendar-month__week--days > div:nth-child(7) { .q-calendar-month__week--days > div:nth-child(7) {
// Cambia el color de los días sábado y domingo // Cambia el color de los días sábado y domingo
@ -150,7 +147,7 @@ const containerClasses = computed(() => {
.q-calendar-month__head--workweek, .q-calendar-month__head--workweek,
.q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis { .q-calendar-month__head--weekday.q-calendar__center.q-calendar__ellipsis {
text-transform: capitalize; text-transform: capitalize;
color: #777; color: var(---color-font-secondary);
font-weight: bold; font-weight: bold;
font-size: 0.8rem; font-size: 0.8rem;
text-align: center; text-align: center;

24
src/components/ui/SkeletonForm.vue
View File

@ -1,28 +1,16 @@
<template> <template>
<div class="q-pa-md"> <div class="q-pa-md">
<div class="row q-gutter-md q-mb-md"> <div class="row q-gutter-md q-mb-md">
<div class="col"> <QSkeleton type="QInput" square />
<QSkeleton type="QInput" square /> <QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
</div> </div>
<div class="row q-gutter-md q-mb-md"> <div class="row q-gutter-md q-mb-md">
<div class="col"> <QSkeleton type="QInput" square />
<QSkeleton type="QInput" square /> <QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
</div> </div>
<div class="row q-gutter-md q-mb-md"> <div class="row q-gutter-md q-mb-md">
<div class="col"> <QSkeleton type="QInput" square />
<QSkeleton type="QInput" square /> <QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
</div> </div>
<div class="row q-gutter-md"> <div class="row q-gutter-md">
<QSkeleton type="QBtn" /> <QSkeleton type="QBtn" />

70
src/components/ui/SkeletonSummary.vue
View File

@ -3,46 +3,36 @@
<QSkeleton type="rect" square /> <QSkeleton type="rect" square />
</div> </div>
<div class="row q-pa-md q-col-gutter-md q-mb-md"> <div class="row q-pa-md q-col-gutter-md q-mb-md">
<div class="col"> <QSkeleton type="rect" class="q-mb-md" square />
<QSkeleton type="rect" class="q-mb-md" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="rect" class="q-mb-md" square />
</div> <QSkeleton type="text" square />
<div class="col"> <QSkeleton type="text" square />
<QSkeleton type="rect" class="q-mb-md" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="rect" class="q-mb-md" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
</div> <QSkeleton type="text" square />
<div class="col"> <QSkeleton type="text" square />
<QSkeleton type="rect" class="q-mb-md" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="rect" class="q-mb-md" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
</div> <QSkeleton type="text" square />
<div class="col"> <QSkeleton type="rect" class="q-mb-md" square />
<QSkeleton type="rect" class="q-mb-md" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square /> <QSkeleton type="text" square />
<QSkeleton type="text" square />
</div>
<div class="col">
<QSkeleton type="rect" class="q-mb-md" square />
<QSkeleton type="text" square />
<QSkeleton type="text" square />
<QSkeleton type="text" square />
<QSkeleton type="text" square />
<QSkeleton type="text" square />
</div>
</div> </div>
</template> </template>

53
src/components/ui/SkeletonTable.vue
View File

@ -1,45 +1,20 @@
<template> <template>
<div class="q-pa-md w"> <div class="q-pa-md w">
<div class="row q-gutter-md q-mb-md"> <div class="row q-gutter-md q-mb-md">
<div class="col-1"> <QSkeleton type="rect" square />
<QSkeleton type="rect" square /> <QSkeleton type="rect" square />
</div> <QSkeleton type="rect" square />
<div class="col"> <QSkeleton type="rect" square />
<QSkeleton type="rect" square /> <QSkeleton type="rect" square />
</div> <QSkeleton type="rect" square />
<div class="col"> </div>
<QSkeleton type="rect" square /> <div class="row q-gutter-md q-mb-md" v-for="n in 5" :key="n">
</div> <QSkeleton type="QInput" square />
<div class="col"> <QSkeleton type="QInput" square />
<QSkeleton type="rect" square /> <QSkeleton type="QInput" square />
</div> <QSkeleton type="QInput" square />
<div class="col"> <QSkeleton type="QInput" square />
<QSkeleton type="rect" square /> <QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="rect" square />
</div>
</div>
<div class="row q-gutter-md q-mb-md" v-for="n in 5" :key="n">
<div class="col-1">
<QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
<div class="col">
<QSkeleton type="QInput" square />
</div>
</div> </div>
</div> </div>
</template> </template>

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

@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import toDate from 'filters/toDate'; import toDate from 'filters/toDate';
import useRedirect from 'src/composables/useRedirect';
import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue'; import VnFilterPanelChip from 'components/ui/VnFilterPanelChip.vue';
const { t } = useI18n(); const { t } = useI18n();
@ -56,6 +56,7 @@ const arrayData = useArrayData(props.dataKey, {
const route = useRoute(); const route = useRoute();
const store = arrayData.store; const store = arrayData.store;
const userParams = ref({}); const userParams = ref({});
const { navigate } = useRedirect();
onMounted(() => { onMounted(() => {
if (props.params) userParams.value = JSON.parse(JSON.stringify(props.params)); if (props.params) userParams.value = JSON.parse(JSON.stringify(props.params));
@ -92,6 +93,7 @@ async function search() {
isLoading.value = false; isLoading.value = false;
emit('search'); emit('search');
navigate(store.data, {});
} }
async function reload() { async function reload() {
@ -102,6 +104,7 @@ async function reload() {
if (!props.showAll && !params.length) store.data = []; if (!props.showAll && !params.length) store.data = [];
isLoading.value = false; isLoading.value = false;
emit('refresh'); emit('refresh');
navigate(store.data, {});
} }
async function clearFilters() { async function clearFilters() {
@ -147,7 +150,7 @@ const customTags = computed(() =>
async function remove(key) { async function remove(key) {
userParams.value[key] = null; userParams.value[key] = null;
await search(); await arrayData.applyFilter({ params: userParams.value });
emit('remove', key); emit('remove', key);
} }

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

@ -1,21 +1,16 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; defineProps({ phoneNumber: { type: [String, Number], default: null } });
const props = defineProps({
phoneNumber: { type: [String, Number], default: null },
});
const { t } = useI18n();
</script> </script>
<template> <template>
<QBtn <QBtn
v-if="props.phoneNumber" v-if="phoneNumber"
flat flat
round round
icon="phone" icon="phone"
size="sm" size="sm"
color="primary" color="primary"
padding="none" padding="none"
:href="`sip:${props.phoneNumber}`" :href="`sip:${phoneNumber}`"
@click.stop @click.stop
/> />
</template> </template>
<style scoped></style>

5
src/components/ui/VnPaginate.vue
View File

@ -42,6 +42,10 @@ const props = defineProps({
type: Object, type: Object,
default: null, default: null,
}, },
keepOpts: {
type: Array,
default: () => [],
},
offset: { offset: {
type: Number, type: Number,
default: 0, default: 0,
@ -76,6 +80,7 @@ const arrayData = useArrayData(props.dataKey, {
order: props.order, order: props.order,
userParams: props.userParams, userParams: props.userParams,
exprBuilder: props.exprBuilder, exprBuilder: props.exprBuilder,
keepOpts: props.keepOpts,
}); });
const store = arrayData.store; const store = arrayData.store;

53
src/components/ui/VnSearchbar.vue
View File

@ -1,11 +1,13 @@
<script setup> <script setup>
import { onMounted, ref } from 'vue'; import { onMounted, ref, watch } from 'vue';
import { useRouter } from 'vue-router';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import useRedirect from 'src/composables/useRedirect';
import { useI18n } from 'vue-i18n';
const quasar = useQuasar(); const quasar = useQuasar();
const { t } = useI18n();
const props = defineProps({ const props = defineProps({
dataKey: { dataKey: {
@ -65,10 +67,18 @@ const props = defineProps({
}, },
}); });
const router = useRouter(); let arrayData = useArrayData(props.dataKey, { ...props });
const arrayData = useArrayData(props.dataKey, { ...props }); let store = arrayData.store;
const { store } = arrayData;
const searchText = ref(''); const searchText = ref('');
const { navigate } = useRedirect();
watch(
() => props.dataKey,
(val) => {
arrayData = useArrayData(val, { ...props });
store = arrayData.store;
}
);
onMounted(() => { onMounted(() => {
const params = store.userParams; const params = store.userParams;
@ -81,37 +91,20 @@ async function search() {
const staticParams = Object.entries(store.userParams).filter( const staticParams = Object.entries(store.userParams).filter(
([key, value]) => value && (props.staticParams || []).includes(key) ([key, value]) => value && (props.staticParams || []).includes(key)
); );
// const filter =props?.where? { where: JSON.parse(props.where) }: {} store.skip = 0;
await arrayData.applyFilter({ await arrayData.applyFilter({
params: { params: {
// filter ,
...Object.fromEntries(staticParams), ...Object.fromEntries(staticParams),
search: searchText.value, search: searchText.value,
}, },
}); });
if (!props.redirect) return; if (!props.redirect) return;
if (props.customRouteRedirectName) navigate(store.data, {
return router.push({ customRouteRedirectName: props.customRouteRedirectName,
name: props.customRouteRedirectName, searchText: searchText.value,
params: { id: searchText.value }, });
});
const { matched: matches } = router.currentRoute.value;
const { path } = matches.at(-1);
const [, moduleName] = path.split('/');
if (!store.data.length || store.data.length > 1)
return router.push({ path: `/${moduleName}/list` });
const targetId = store.data[0].id;
let targetUrl;
if (path.endsWith('/list')) targetUrl = path.replace('/list', `/${targetId}/summary`);
if (path.endsWith('-list')) targetUrl = path.replace('-list', `/${targetId}/summary`);
else if (path.includes(':id')) targetUrl = path.replace(':id', targetId);
await router.push({ path: targetUrl });
} }
</script> </script>
@ -120,7 +113,7 @@ async function search() {
<VnInput <VnInput
id="searchbar" id="searchbar"
v-model="searchText" v-model="searchText"
:placeholder="props.label" :placeholder="t(props.label)"
dense dense
standout standout
autofocus autofocus
@ -139,7 +132,7 @@ async function search() {
name="info" name="info"
class="cursor-info" class="cursor-info"
> >
<QTooltip>{{ props.info }}</QTooltip> <QTooltip>{{ t(props.info) }}</QTooltip>
</QIcon> </QIcon>
</template> </template>
</VnInput> </VnInput>

8
src/composables/useArrayData.js
View File

@ -47,7 +47,10 @@ export function useArrayData(key, userOptions) {
if (isEmpty || !allowedOptions.includes(option)) continue; if (isEmpty || !allowedOptions.includes(option)) continue;
if (Object.prototype.hasOwnProperty.call(store, option)) { if (Object.prototype.hasOwnProperty.call(store, option)) {
store[option] = userOptions[option]; const defaultOpts = userOptions[option];
store[option] = userOptions.keepOpts?.includes(option)
? Object.assign(defaultOpts, store[option])
: defaultOpts;
} }
} }
} }
@ -127,7 +130,8 @@ export function useArrayData(key, userOptions) {
store.filter = {}; store.filter = {};
if (params) store.userParams = Object.assign({}, params); if (params) store.userParams = Object.assign({}, params);
await fetch({ append: false }); const response = await fetch({ append: false });
return response;
} }
async function addFilter({ filter, params }) { async function addFilter({ filter, params }) {

25
src/composables/useRedirect.js Normal file
View File

@ -0,0 +1,25 @@
import { useRouter } from 'vue-router';
export default function useRedirect() {
const router = useRouter();
const navigate = (data, { customRouteRedirectName, searchText }) => {
if (customRouteRedirectName)
return router.push({
name: customRouteRedirectName,
params: { id: searchText },
});
const { matched: matches } = router.currentRoute.value;
const { path } = matches.at(-1);
const to =
data.length === 1
? path.replace(/\/(list|:id)|-list/, `/${data[0].id}`)
: path.replace(/:id.*/, '');
router.push({ path: to });
};
return { navigate };
}

20
src/composables/useState.js
View File

@ -20,28 +20,12 @@ const headerMounted = ref(false);
export function useState() { export function useState() {
function getUser() { function getUser() {
return computed(() => { return computed(() => {
return { return user.value;
id: user.value.id,
name: user.value.name,
nickname: user.value.nickname,
lang: user.value.lang,
darkMode: user.value.darkMode,
companyFk: user.value.companyFk,
warehouseFk: user.value.warehouseFk,
};
}); });
} }
function setUser(data) { function setUser(data) {
user.value = { user.value = data;
id: data.id,
name: data.name,
nickname: data.nickname,
lang: data.lang,
darkMode: data.darkMode,
companyFk: data.companyFk,
warehouseFk: data.warehouseFk,
};
} }
function getRoles() { function getRoles() {

7
src/css/app.scss
View File

@ -169,6 +169,13 @@ select:-webkit-autofill {
/* q-notification row items-stretch q-notification--standard bg-negative text-white */ /* q-notification row items-stretch q-notification--standard bg-negative text-white */
.q-card,
.q-table,
.q-table__bottom,
.q-drawer {
background-color: var(--vn-section-color);
}
input[type='number'] { input[type='number'] {
-moz-appearance: textfield; -moz-appearance: textfield;
} }

BIN
src/css/fonts/icon.eot
View File

Binary file not shown.

255
src/css/fonts/icon.svg
View File

File diff suppressed because one or more lines are too long
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 173 KiB

After

Width:  |  Height:  |  Size: 174 KiB

BIN
src/css/fonts/icon.ttf
View File

Binary file not shown.

BIN
src/css/fonts/icon.woff
View File

Binary file not shown.

4153
src/css/fonts/selection.json
View File

File diff suppressed because one or more lines are too long

670
src/css/icons.scss
View File

@ -1,10 +1,10 @@
@font-face { @font-face {
font-family: 'icon'; font-family: 'icon';
src: url('fonts/icon.eot?2omjsr'); src: url('fonts/icon.eot?1om04h');
src: url('fonts/icon.eot?2omjsr#iefix') format('embedded-opentype'), src: url('fonts/icon.eot?1om04h#iefix') format('embedded-opentype'),
url('fonts/icon.ttf?2omjsr') format('truetype'), url('fonts/icon.ttf?1om04h') format('truetype'),
url('fonts/icon.woff?2omjsr') format('woff'), url('fonts/icon.woff?1om04h') format('woff'),
url('fonts/icon.svg?2omjsr#icon') format('svg'); url('fonts/icon.svg?1om04h#icon') format('svg');
font-weight: normal; font-weight: normal;
font-style: normal; font-style: normal;
font-display: block; font-display: block;
@ -27,392 +27,410 @@
} }
.icon-100:before { .icon-100:before {
content: '\e926'; content: '\e901';
} }
.icon-Client_unpaid:before { .icon-Client_unpaid:before {
content: '\e925'; content: '\e98c';
}
.icon-Client_unpaid:before {
content: '\e925';
} }
.icon-History:before { .icon-History:before {
content: '\e964'; content: '\e902';
} }
.icon-Person:before { .icon-Person:before {
content: '\e984'; content: '\e903';
} }
.icon-accessory:before { .icon-accessory:before {
content: '\e948'; content: '\e904';
} }
.icon-account:before { .icon-account:before {
content: '\e927'; content: '\e905';
} }
.icon-actions:before { .icon-actions:before {
content: '\e928'; content: '\e907';
} }
.icon-addperson:before { .icon-addperson:before {
content: '\e929'; content: '\e908';
}
.icon-agency:before {
content: '\e92a';
} }
.icon-agency:before { .icon-agency:before {
content: '\e92a'; content: '\e92a';
} }
.icon-agency-term:before { .icon-agency-term:before {
content: '\e92b'; content: '\e909';
}
.icon-albaran:before {
content: '\e92c';
} }
.icon-albaran:before { .icon-albaran:before {
content: '\e92c'; content: '\e92c';
} }
.icon-anonymous:before { .icon-anonymous:before {
content: '\e92d';
}
.icon-apps:before {
content: '\e92e';
}
.icon-artificial:before {
content: '\e92f';
}
.icon-attach:before {
content: '\e930';
}
.icon-barcode:before {
content: '\e932';
}
.icon-basket:before {
content: '\e933';
}
.icon-basketadd:before {
content: '\e934';
}
.icon-bin:before {
content: '\e935';
}
.icon-botanical:before {
content: '\e936';
}
.icon-bucket:before {
content: '\e937';
}
.icon-buscaman:before {
content: '\e938';
}
.icon-buyrequest:before {
content: '\e939';
}
.icon-calc_volum:before {
content: '\e93a';
}
.icon-calendar:before {
content: '\e940';
}
.icon-catalog:before {
content: '\e941';
}
.icon-claims:before {
content: '\e942';
}
.icon-client:before {
content: '\e943';
}
.icon-clone:before {
content: '\e945';
}
.icon-columnadd:before {
content: '\e946';
}
.icon-columndelete:before {
content: '\e947';
}
.icon-components:before {
content: '\e949';
}
.icon-consignatarios:before {
content: '\e94b';
}
.icon-control:before {
content: '\e94c';
}
.icon-credit:before {
content: '\e94d';
}
.icon-defaulter:before {
content: '\e94e';
}
.icon-deletedTicket:before {
content: '\e94f';
}
.icon-deleteline:before {
content: '\e950';
}
.icon-delivery:before {
content: '\e951';
}
.icon-deliveryprices:before {
content: '\e952';
}
.icon-details:before {
content: '\e954';
}
.icon-dfiscales:before {
content: '\e955';
}
.icon-disabled:before {
content: '\e965';
}
.icon-doc:before {
content: '\e956';
}
.icon-entry:before {
content: '\e958';
}
.icon-exit:before {
content: '\e959';
}
.icon-eye:before {
content: '\e95a';
}
.icon-fixedPrice:before {
content: '\e95b';
}
.icon-flower:before {
content: '\e95c';
}
.icon-frozen:before {
content: '\e95d';
}
.icon-fruit:before {
content: '\e95e';
}
.icon-funeral:before {
content: '\e95f';
}
.icon-grafana:before {
content: '\e931';
}
.icon-grafana:before {
content: '\e931';
}
.icon-greenery:before {
content: '\e91e';
}
.icon-greuge:before {
content: '\e960';
}
.icon-grid:before {
content: '\e961';
}
.icon-handmade:before {
content: '\e94a';
}
.icon-handmadeArtificial:before {
content: '\e962';
}
.icon-headercol:before {
content: '\e963';
}
.icon-info:before {
content: '\e966';
}
.icon-inventory:before {
content: '\e967';
}
.icon-invoice:before {
content: '\e969';
}
.icon-invoice-in:before {
content: '\e96a';
}
.icon-invoice-in-create:before {
content: '\e96b';
}
.icon-invoice-out:before {
content: '\e96c';
}
.icon-isTooLittle:before {
content: '\e96e';
}
.icon-item:before {
content: '\e96f';
}
.icon-languaje:before {
content: '\e912';
}
.icon-lines:before {
content: '\e971';
}
.icon-linesprepaired:before {
content: '\e972';
}
.icon-link-to-corrected:before {
content: '\e900';
}
.icon-link-to-correcting:before {
content: '\e906';
}
.icon-logout:before {
content: '\e90a';
}
.icon-mana:before {
content: '\e974';
}
.icon-mandatory:before {
content: '\e975';
}
.icon-net:before {
content: '\e976';
}
.icon-newalbaran:before {
content: '\e977';
}
.icon-niche:before {
content: '\e979';
}
.icon-no036:before {
content: '\e97a';
}
.icon-noPayMethod:before {
content: '\e97b';
}
.icon-notes:before {
content: '\e97c';
}
.icon-noweb:before {
content: '\e97e';
}
.icon-onlinepayment:before {
content: '\e97f';
}
.icon-package:before {
content: '\e980';
}
.icon-payment:before {
content: '\e982';
}
.icon-pbx:before {
content: '\e983';
}
.icon-pets:before {
content: '\e985';
}
.icon-photo:before {
content: '\e986';
}
.icon-plant:before {
content: '\e987';
}
.icon-polizon:before {
content: '\e989';
}
.icon-preserved:before {
content: '\e98a';
}
.icon-recovery:before {
content: '\e98b';
}
.icon-regentry:before {
content: '\e901';
}
.icon-reserva:before {
content: '\e902';
}
.icon-revision:before {
content: '\e903';
}
.icon-risk:before {
content: '\e904';
}
.icon-services:before {
content: '\e905';
}
.icon-settings:before {
content: '\e907';
}
.icon-shipment:before {
content: '\e908';
}
.icon-sign:before {
content: '\e909';
}
.icon-sms:before {
content: '\e90b'; content: '\e90b';
} }
.icon-solclaim:before { .icon-apps:before {
content: '\e90c'; content: '\e90c';
} }
.icon-solunion:before { .icon-artificial:before {
content: '\e90d'; content: '\e90d';
} }
.icon-splitline:before { .icon-attach:before {
content: '\e90e'; content: '\e90e';
} }
.icon-splur:before { .icon-barcode:before {
content: '\e90f'; content: '\e90f';
} }
.icon-stowaway:before { .icon-basket:before {
content: '\e910'; content: '\e910';
} }
.icon-supplier:before { .icon-basketadd:before {
content: '\e911'; content: '\e911';
} }
.icon-supplierfalse:before { .icon-bin:before {
content: '\e913'; content: '\e913';
} }
.icon-tags:before { .icon-botanical:before {
content: '\e914'; content: '\e914';
} }
.icon-tax:before { .icon-bucket:before {
content: '\e915'; content: '\e915';
} }
.icon-thermometer:before { .icon-buscaman:before {
content: '\e916'; content: '\e916';
} }
.icon-ticket:before { .icon-buyrequest:before {
content: '\e917'; content: '\e917';
} }
.icon-ticketAdd:before { .icon-calc_volum .path1:before {
content: '\e918'; content: '\e918';
color: rgb(0, 0, 0);
} }
.icon-traceability:before { .icon-calc_volum .path2:before {
content: '\e919'; content: '\e919';
margin-left: -1em;
color: rgb(0, 0, 0);
} }
.icon-transaction:before { .icon-calc_volum .path3:before {
content: '\e93b';
}
.icon-transaction:before {
content: '\e93b';
}
.icon-treatments:before {
content: '\e91c'; content: '\e91c';
margin-left: -1em;
color: rgb(0, 0, 0);
} }
.icon-trolley:before { .icon-calc_volum .path4:before {
content: '\e91a';
}
.icon-troncales:before {
content: '\e91b';
}
.icon-unavailable:before {
content: '\e91d'; content: '\e91d';
margin-left: -1em;
color: rgb(0, 0, 0);
} }
.icon-volume:before { .icon-calc_volum .path5:before {
content: '\e91e';
margin-left: -1em;
color: rgb(0, 0, 0);
}
.icon-calc_volum .path6:before {
content: '\e91f'; content: '\e91f';
margin-left: -1em;
color: rgb(255, 255, 255);
} }
.icon-wand:before { .icon-calendar:before {
content: '\e920'; content: '\e920';
} }
.icon-web:before { .icon-catalog:before {
content: '\e921'; content: '\e921';
} }
.icon-wiki:before { .icon-claims:before {
content: '\e922'; content: '\e922';
} }
.icon-worker:before { .icon-client:before {
content: '\e923'; content: '\e923';
} }
.icon-zone:before { .icon-clone:before {
content: '\e924'; content: '\e924';
} }
.icon-columnadd:before {
content: '\e925';
}
.icon-columndelete:before {
content: '\e926';
}
.icon-components:before {
content: '\e927';
}
.icon-consignatarios:before {
content: '\e928';
}
.icon-control:before {
content: '\e929';
}
.icon-credit:before {
content: '\e92b';
}
.icon-defaulter:before {
content: '\e92d';
}
.icon-deletedTicket:before {
content: '\e92e';
}
.icon-deleteline:before {
content: '\e92f';
}
.icon-delivery:before {
content: '\e930';
}
.icon-deliveryprices:before {
content: '\e932';
}
.icon-details:before {
content: '\e933';
}
.icon-dfiscales:before {
content: '\e934';
}
.icon-disabled:before {
content: '\e935';
}
.icon-doc:before {
content: '\e936';
}
.icon-entry:before {
content: '\e937';
}
.icon-exit:before {
content: '\e938';
}
.icon-eye:before {
content: '\e939';
}
.icon-fixedPrice:before {
content: '\e93a';
}
.icon-flower:before {
content: '\e93b';
}
.icon-frozen:before {
content: '\e93c';
}
.icon-fruit:before {
content: '\e93d';
}
.icon-funeral:before {
content: '\e93e';
}
.icon-grafana:before {
content: '\e906';
}
.icon-greenery:before {
content: '\e93f';
}
.icon-greuge:before {
content: '\e940';
}
.icon-grid:before {
content: '\e941';
}
.icon-handmade:before {
content: '\e942';
}
.icon-handmadeArtificial:before {
content: '\e943';
}
.icon-headercol:before {
content: '\e945';
}
.icon-info:before {
content: '\e946';
}
.icon-inventory:before {
content: '\e947';
}
.icon-invoice:before {
content: '\e968';
color: #5f5f5f;
}
.icon-invoice-in:before {
content: '\e949';
}
.icon-invoice-in-create:before {
content: '\e94a';
}
.icon-invoice-out:before {
content: '\e94b';
}
.icon-isTooLittle:before {
content: '\e94c';
}
.icon-item:before {
content: '\e94d';
}
.icon-languaje:before {
content: '\e970';
}
.icon-lines:before {
content: '\e94e';
}
.icon-linesprepaired:before {
content: '\e94f';
}
.icon-link-to-corrected:before {
content: '\e931';
}
.icon-link-to-correcting:before {
content: '\e944';
}
.icon-logout:before {
content: '\e973';
}
.icon-mana:before {
content: '\e950';
}
.icon-mandatory:before {
content: '\e951';
}
.icon-net:before {
content: '\e952';
}
.icon-newalbaran:before {
content: '\e954';
}
.icon-niche:before {
content: '\e955';
}
.icon-no036:before {
content: '\e956';
}
.icon-noPayMethod:before {
content: '\e958';
}
.icon-notes:before {
content: '\e959';
}
.icon-noweb:before {
content: '\e95a';
}
.icon-onlinepayment:before {
content: '\e95b';
}
.icon-package:before {
content: '\e95c';
}
.icon-payment:before {
content: '\e95d';
}
.icon-pbx:before {
content: '\e95e';
}
.icon-pets:before {
content: '\e95f';
}
.icon-photo:before {
content: '\e960';
}
.icon-plant:before {
content: '\e961';
}
.icon-polizon:before {
content: '\e962';
}
.icon-preserved:before {
content: '\e963';
}
.icon-recovery:before {
content: '\e964';
}
.icon-regentry:before {
content: '\e965';
}
.icon-reserva:before {
content: '\e966';
}
.icon-revision:before {
content: '\e967';
}
.icon-risk:before {
content: '\e969';
}
.icon-saysimple:before {
content: '\e912';
}
.icon-services:before {
content: '\e96a';
}
.icon-settings:before {
content: '\e96b';
}
.icon-shipment:before {
content: '\e96c';
}
.icon-sign:before {
content: '\e90a';
}
.icon-sms:before {
content: '\e96e';
}
.icon-solclaim:before {
content: '\e96f';
}
.icon-solunion:before {
content: '\e971';
}
.icon-splitline:before {
content: '\e972';
}
.icon-splur:before {
content: '\e974';
}
.icon-stowaway:before {
content: '\e975';
}
.icon-supplier:before {
content: '\e976';
}
.icon-supplierfalse:before {
content: '\e977';
}
.icon-tags:before {
content: '\e979';
}
.icon-tax:before {
content: '\e97a';
}
.icon-thermometer:before {
content: '\e97b';
}
.icon-ticket:before {
content: '\e97c';
}
.icon-ticketAdd:before {
content: '\e97e';
}
.icon-traceability:before {
content: '\e97f';
}
.icon-transaction:before {
content: '\e91b';
}
.icon-treatments:before {
content: '\e980';
}
.icon-trolley:before {
content: '\e900';
}
.icon-troncales:before {
content: '\e982';
}
.icon-unavailable:before {
content: '\e983';
}
.icon-visible_columns_Icono:before {
content: '\e984';
}
.icon-volume:before {
content: '\e985';
}
.icon-wand:before {
content: '\e986';
}
.icon-web:before {
content: '\e987';
}
.icon-wiki:before {
content: '\e989';
}
.icon-worker:before {
content: '\e98a';
}
.icon-zone:before {
content: '\e98b';
}

2
src/css/quasar.variables.scss
View File

@ -32,7 +32,7 @@ $primary-light: lighten($primary, 35%);
$dark-shadow-color: black; $dark-shadow-color: black;
$layout-shadow-dark: 0 0 10px 2px #00000033, 0 0px 10px #0000003d; $layout-shadow-dark: 0 0 10px 2px #00000033, 0 0px 10px #0000003d;
$spacing-md: 16px; $spacing-md: 16px;
$color-font-secondary: #777;
.bg-success { .bg-success {
background-color: $positive; background-color: $positive;
} }

2
src/filters/dateRange.js
View File

@ -1,7 +1,7 @@
export default function dateRange(value) { export default function dateRange(value) {
const minHour = new Date(value); const minHour = new Date(value);
minHour.setHours(0, 0, 0, 0); minHour.setHours(0, 0, 0, 0);
const maxHour = new Date(value); const maxHour = new Date();
maxHour.setHours(23, 59, 59, 59); maxHour.setHours(23, 59, 59, 59);
return [minHour, maxHour]; return [minHour, maxHour];

28
src/i18n/locale/en.yml
View File

@ -24,6 +24,7 @@ globals:
create: Create create: Create
edit: Edit edit: Edit
save: Save save: Save
saveAndContinue: Save and continue
remove: Remove remove: Remove
reset: Reset reset: Reset
close: Close close: Close
@ -32,6 +33,7 @@ globals:
confirm: Confirm confirm: Confirm
assign: Assign assign: Assign
back: Back back: Back
downloadPdf: Download PDF
yes: 'Yes' yes: 'Yes'
no: 'No' no: 'No'
noChanges: No changes to save noChanges: No changes to save
@ -95,11 +97,16 @@ globals:
agency: Agency agency: Agency
workCenters: Work centers workCenters: Work centers
modes: Modes modes: Modes
zones: Zones
zonesList: Zones
deliveryList: Delivery days
upcomingList: Upcoming deliveries
created: Created created: Created
worker: Worker worker: Worker
now: Now now: Now
name: Name name: Name
new: New new: New
comment: Comment
errors: errors:
statusUnauthorized: Access denied statusUnauthorized: Access denied
statusInternalServerError: An internal server error has ocurred statusInternalServerError: An internal server error has ocurred
@ -267,6 +274,7 @@ customer:
tableVisibleColumns: tableVisibleColumns:
id: Identifier id: Identifier
name: Name name: Name
socialName: Social name
fi: Tax number fi: Tax number
salesPersonFk: Salesperson salesPersonFk: Salesperson
credit: Credit credit: Credit
@ -426,6 +434,7 @@ ticket:
boxing: Boxing boxing: Boxing
sms: Sms sms: Sms
notes: Notes notes: Notes
sale: Sale
list: list:
nickname: Nickname nickname: Nickname
state: State state: State
@ -822,6 +831,8 @@ worker:
log: Log log: Log
calendar: Calendar calendar: Calendar
timeControl: Time control timeControl: Time control
locker: Locker
list: list:
name: Name name: Name
email: Email email: Email
@ -853,6 +864,15 @@ worker:
role: Role role: Role
sipExtension: Extension sipExtension: Extension
locker: Locker locker: Locker
fiDueDate: Fecha de caducidad del DNI
sex: Sexo
seniority: Antigüedad
fi: DNI/NIE/NIF
birth: Fecha de nacimiento
isFreelance: Autónomo
isSsDiscounted: Bonificación SS
hasMachineryAuthorized: Autorizado para llevar maquinaria
isDisable: Trabajador desactivado
notificationsManager: notificationsManager:
activeNotifications: Active notifications activeNotifications: Active notifications
availableNotifications: Available notifications availableNotifications: Available notifications
@ -1230,12 +1250,10 @@ item/itemType:
itemType: Item type itemType: Item type
basicData: Basic data basicData: Basic data
summary: Summary summary: Summary
zone: monitor:
pageTitles: pageTitles:
zones: Zone monitors: Monitors
zonesList: Zones list: List
deliveryList: Delivery days
upcomingList: Upcoming deliveries
components: components:
topbar: {} topbar: {}
itemsFilterPanel: itemsFilterPanel:

14
src/i18n/locale/es.yml
View File

@ -24,6 +24,7 @@ globals:
create: Crear create: Crear
edit: Modificar edit: Modificar
save: Guardar save: Guardar
saveAndContinue: Guardar y continuar
remove: Eliminar remove: Eliminar
reset: Restaurar reset: Restaurar
close: Cerrar close: Cerrar
@ -59,6 +60,7 @@ globals:
amount: Importe amount: Importe
packages: Bultos packages: Bultos
download: Descargar download: Descargar
downloadPdf: Descargar PDF
selectRows: 'Seleccionar las { numberRows } filas(s)' selectRows: 'Seleccionar las { numberRows } filas(s)'
allRows: 'Todo { numberRows } filas(s)' allRows: 'Todo { numberRows } filas(s)'
markAll: Marcar todo markAll: Marcar todo
@ -95,11 +97,16 @@ globals:
agency: Agencia agency: Agencia
workCenters: Centros de trabajo workCenters: Centros de trabajo
modes: Modos modes: Modos
zones: Zonas
zonesList: Zonas
deliveryList: Días de entrega
upcomingList: Próximos repartos
created: Fecha creación created: Fecha creación
worker: Trabajador worker: Trabajador
now: Ahora now: Ahora
name: Nombre name: Nombre
new: Nuevo new: Nuevo
comment: Comentario
errors: errors:
statusUnauthorized: Acceso denegado statusUnauthorized: Acceso denegado
statusInternalServerError: Ha ocurrido un error interno del servidor statusInternalServerError: Ha ocurrido un error interno del servidor
@ -265,6 +272,7 @@ customer:
tableVisibleColumns: tableVisibleColumns:
id: Identificador id: Identificador
name: Nombre name: Nombre
socialName: Razón social
fi: NIF / CIF fi: NIF / CIF
salesPersonFk: Comercial salesPersonFk: Comercial
credit: Crédito credit: Crédito
@ -424,6 +432,7 @@ ticket:
boxing: Encajado boxing: Encajado
sms: Sms sms: Sms
notes: Notas notes: Notas
sale: Lineas del pedido
list: list:
nickname: Alias nickname: Alias
state: Estado state: Estado
@ -820,6 +829,7 @@ worker:
log: Historial log: Historial
calendar: Calendario calendar: Calendario
timeControl: Control de horario timeControl: Control de horario
locker: Taquilla
list: list:
name: Nombre name: Nombre
email: Email email: Email
@ -1235,6 +1245,10 @@ zone:
zonesList: Zonas zonesList: Zonas
deliveryList: Días de entrega deliveryList: Días de entrega
upcomingList: Próximos repartos upcomingList: Próximos repartos
monitor:
pageTitles:
monitors: Monitores
list: Listado
components: components:
topbar: {} topbar: {}
itemsFilterPanel: itemsFilterPanel:

24
src/pages/Agency/Card/AgencyCard.vue
View File

@ -1,34 +1,14 @@
<script setup> <script setup>
import { onMounted, watch } from 'vue';
import { useRoute } from 'vue-router';
import { useArrayData } from 'src/composables/useArrayData';
import AgencyDescriptor from 'pages/Agency/Card/AgencyDescriptor.vue'; import AgencyDescriptor from 'pages/Agency/Card/AgencyDescriptor.vue';
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
const route = useRoute();
const arrayData = useArrayData('Agency', {
url: `Agencies/${route.params.id}`,
});
const { store } = arrayData;
onMounted(async () => await arrayData.fetch({ append: false }));
watch(
() => route.params.id,
async (newId) => {
if (newId) {
store.url = `Agencies/${newId}`;
await arrayData.fetch({ append: false });
}
}
);
</script> </script>
<template> <template>
<VnCard <VnCard
data-key="Agency" data-key="Agency"
base-url="Agencies" base-url="Agencies"
:descriptor="AgencyDescriptor" :descriptor="AgencyDescriptor"
searchbar-data-key="AgencyList" search-data-key="AgencyList"
searchbar-url="Agencies" search-url="Agencies"
searchbar-label="agency.searchBar.label" searchbar-label="agency.searchBar.label"
searchbar-info="agency.searchBar.info" searchbar-info="agency.searchBar.info"
/> />

4
src/pages/Agency/Card/AgencyDescriptor.vue
View File

@ -15,8 +15,8 @@ const props = defineProps({
}); });
const { t } = useI18n(); const { t } = useI18n();
const { params } = useRoute(); const route = useRoute();
const entityId = computed(() => props.id || params.id); const entityId = computed(() => props.id || route.params.id);
const { store } = useArrayData('Parking'); const { store } = useArrayData('Parking');
const card = computed(() => store.data); const card = computed(() => store.data);
</script> </script>

17
src/pages/Agency/Card/AgencySummary.vue
View File

@ -3,26 +3,13 @@ import { computed } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import FetchData from 'src/components/FetchData.vue';
import CardSummary from 'components/ui/CardSummary.vue'; import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'components/ui/VnLv.vue'; import VnLv from 'components/ui/VnLv.vue';
import VnTitle from 'src/components/common/VnTitle.vue'; import VnTitle from 'src/components/common/VnTitle.vue';
import VnSelect from 'src/components/common/VnSelect.vue';
const $props = defineProps({ const $props = defineProps({ id: { type: Number, default: 0 } });
id: {
type: Number,
default: 0,
},
});
const { params } = useRoute();
const { t } = useI18n(); const { t } = useI18n();
const entityId = computed(() => $props.id || params.id); const entityId = computed(() => $props.id || useRoute().params.id);
const filter = {
fields: ['id', 'sectorFk', 'code', 'pickingOrder', 'row', 'column'],
include: [{ relation: 'sector', scope: { fields: ['id', 'description'] } }],
};
</script> </script>
<template> <template>

27
src/pages/Claim/Card/ClaimAction.vue
View File

@ -201,30 +201,7 @@ async function post(query, params) {
auto-load auto-load
@on-fetch="(data) => (destinationTypes = data)" @on-fetch="(data) => (destinationTypes = data)"
/> />
<template v-if="stateStore.isHeaderMounted()"> <Teleport to="#right-panel" v-if="stateStore.isHeaderMounted() && claim">
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
</template>
<QDrawer
v-model="stateStore.rightDrawer"
side="right"
:width="300"
show-if-above
v-if="claim"
>
<QCard class="totalClaim q-my-md q-pa-sm no-box-shadow"> <QCard class="totalClaim q-my-md q-pa-sm no-box-shadow">
{{ `${t('Total claimed')}: ${toCurrency(totalClaimed)}` }} {{ `${t('Total claimed')}: ${toCurrency(totalClaimed)}` }}
</QCard> </QCard>
@ -274,7 +251,7 @@ async function post(query, params) {
v-model="multiplicatorValue" v-model="multiplicatorValue"
/> />
</QCard> </QCard>
</QDrawer> </Teleport>
<Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport> <Teleport to="#st-data" v-if="stateStore.isSubToolbarShown()"> </Teleport>
<CrudModel <CrudModel
v-if="claim" v-if="claim"

134
src/pages/Claim/Card/ClaimBasicData.vue
View File

@ -95,83 +95,71 @@ const statesFilter = {
> >
<template #form="{ data, validate, filter }"> <template #form="{ data, validate, filter }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput v-model="data.client.name"
v-model="data.client.name" :label="t('claim.basicData.customer')"
:label="t('claim.basicData.customer')" disable
disable />
/> <VnInputDate
</div> v-model="data.created"
<div class="col"> :label="t('claim.basicData.created')"
<VnInputDate />
v-model="data.created"
:label="t('claim.basicData.created')"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('claim.basicData.assignedTo')"
:label="t('claim.basicData.assignedTo')" v-model="data.workerFk"
v-model="data.workerFk" :options="workersOptions"
:options="workersOptions" option-value="id"
option-value="id" option-label="name"
option-label="name" emit-value
emit-value auto-load
auto-load :rules="validate('claim.claimStateFk')"
:rules="validate('claim.claimStateFk')" >
> <template #before>
<template #before> <QAvatar color="orange">
<QAvatar color="orange"> <QImg
<QImg v-if="data.workerFk"
v-if="data.workerFk" :src="`/api/Images/user/160x160/${data.workerFk}/download?access_token=${token}`"
:src="`/api/Images/user/160x160/${data.workerFk}/download?access_token=${token}`" spinner-color="white"
spinner-color="white" />
/> </QAvatar>
</QAvatar> </template>
</template> </VnSelect>
</VnSelect> <QSelect
</div> v-model="data.claimStateFk"
<div class="col"> :options="claimStates"
<QSelect option-value="id"
v-model="data.claimStateFk" option-label="description"
:options="claimStates" emit-value
option-value="id" :label="t('claim.basicData.state')"
option-label="description" map-options
emit-value use-input
:label="t('claim.basicData.state')" @filter="(value, update) => filter(value, update, statesFilter)"
map-options :rules="validate('claim.claimStateFk')"
use-input :input-debounce="0"
@filter="(value, update) => filter(value, update, statesFilter)" >
:rules="validate('claim.claimStateFk')" </QSelect>
:input-debounce="0"
>
</QSelect>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput v-model.number="data.packages"
v-model.number="data.packages" :label="t('globals.packages')"
:label="t('globals.packages')" :rules="validate('claim.packages')"
:rules="validate('claim.packages')" type="number"
type="number" />
/> <QSelect
</div> v-model="data.pickup"
<div class="col"> :options="optionsList"
<QSelect option-value="id"
v-model="data.pickup" option-label="description"
:options="optionsList" emit-value
option-value="id" :label="t('claim.basicData.pickup')"
option-label="description" map-options
emit-value use-input
:label="t('claim.basicData.pickup')" :input-debounce="0"
map-options >
use-input </QSelect>
:input-debounce="0"
>
</QSelect>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

6
src/pages/Claim/Card/ClaimCard.vue
View File

@ -1,14 +1,16 @@
<script setup> <script setup>
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
import ClaimDescriptor from './ClaimDescriptor.vue'; import ClaimDescriptor from './ClaimDescriptor.vue';
import ClaimFilter from '../ClaimFilter.vue';
</script> </script>
<template> <template>
<VnCard <VnCard
data-key="Claim" data-key="Claim"
base-url="Claims" base-url="Claims"
:descriptor="ClaimDescriptor" :descriptor="ClaimDescriptor"
searchbar-data-key="ClaimList" :filter-panel="ClaimFilter"
searchbar-url="Claims/filter" search-data-key="ClaimList"
search-url="Claims/filter"
searchbar-label="Search claim" searchbar-label="Search claim"
searchbar-info="You can search by claim id or customer name" searchbar-info="You can search by claim id or customer name"
/> />

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

@ -12,7 +12,6 @@ import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorP
import VnUserLink from 'src/components/ui/VnUserLink.vue'; import VnUserLink from 'src/components/ui/VnUserLink.vue';
import ClaimSummary from './Card/ClaimSummary.vue'; import ClaimSummary from './Card/ClaimSummary.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { getUrl } from 'src/composables/getUrl';
const stateStore = useStateStore(); const stateStore = useStateStore();
const router = useRouter(); const router = useRouter();

4
src/pages/Customer/Card/CustomerAddress.vue
View File

@ -202,9 +202,9 @@ const toCustomerAddressEdit = (addressId) => {
<div v-if="item.observations.length"> <div v-if="item.observations.length">
<div <div
:key="index" :key="obIndex"
class="flex q-mb-sm" class="flex q-mb-sm"
v-for="(observation, index) in item.observations" v-for="(observation, obIndex) in item.observations"
> >
<div class="text-weight-bold q-mr-sm"> <div class="text-weight-bold q-mr-sm">
{{ observation.observationType.description }}: {{ observation.observationType.description }}:

24
src/pages/Customer/Card/CustomerBalance.vue
View File

@ -11,6 +11,7 @@ import { useState } from 'src/composables/useState';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { useValidator } from 'src/composables/useValidator'; import { useValidator } from 'src/composables/useValidator';
import { usePrintService } from 'src/composables/usePrintService'; import { usePrintService } from 'src/composables/usePrintService';
import { useSession } from 'src/composables/useSession';
import VnPaginate from 'src/components/ui/VnPaginate.vue'; import VnPaginate from 'src/components/ui/VnPaginate.vue';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
@ -19,6 +20,9 @@ import VnSelect from 'src/components/common/VnSelect.vue';
import CustomerNewPayment from 'src/pages/Customer/components/CustomerNewPayment.vue'; import CustomerNewPayment from 'src/pages/Customer/components/CustomerNewPayment.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue'; import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue'; import InvoiceOutDescriptorProxy from 'src/pages/InvoiceOut/Card/InvoiceOutDescriptorProxy.vue';
const session = useSession();
const tokenMultimedia = session.getTokenMultimedia();
const { sendEmail } = usePrintService(); const { sendEmail } = usePrintService();
const { t } = useI18n(); const { t } = useI18n();
@ -188,6 +192,11 @@ const saveFieldValue = async (row) => {
const sendEmailAction = () => { const sendEmailAction = () => {
sendEmail(`Suppliers/${route.params.id}/campaign-metrics-email`); sendEmail(`Suppliers/${route.params.id}/campaign-metrics-email`);
}; };
const showBalancePdf = (balance) => {
const url = `api/InvoiceOuts/${balance.id}/download?access_token=${tokenMultimedia}`;
window.open(url, '_blank');
};
</script> </script>
<template> <template>
@ -257,17 +266,28 @@ const sendEmailAction = () => {
<QTd align="center"> <QTd align="center">
<QIcon <QIcon
@click.stop="showDialog = true" @click.stop="showDialog = true"
class="q-ml-md" class="q-ml-md fill-icon"
color="primary" color="primary"
name="outgoing_mail" name="outgoing_mail"
size="sm" size="sm"
style="font-variation-settings: 'FILL' 1"
v-if="row.isCompensation" v-if="row.isCompensation"
> >
<QTooltip> <QTooltip>
{{ t('Send compensation') }} {{ t('Send compensation') }}
</QTooltip> </QTooltip>
</QIcon> </QIcon>
<QIcon
@click="showBalancePdf(row)"
class="q-ml-md fill-icon"
color="primary"
name="cloud_download"
size="sm"
v-if="row.hasPdf"
>
<QTooltip>
{{ t('globals.downloadPdf') }}
</QTooltip>
</QIcon>
<QDialog v-model="showDialog"> <QDialog v-model="showDialog">
<QCard class="q-pa-sm"> <QCard class="q-pa-sm">

231
src/pages/Customer/Card/CustomerBasicData.vue
View File

@ -70,138 +70,121 @@ const filterOptions = {
<FormModel :url="`Clients/${route.params.id}`" auto-load model="customer"> <FormModel :url="`Clients/${route.params.id}`" auto-load model="customer">
<template #form="{ data, validate, filter }"> <template #form="{ data, validate, filter }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Comercial name')"
:label="t('Comercial name')" :rules="validate('client.socialName')"
:rules="validate('client.socialName')" autofocus
autofocus clearable
clearable v-model="data.name"
v-model="data.name" />
/>
</div> <QSelect
<div class="col"> :input-debounce="0"
<QSelect :label="t('customer.basicData.businessType')"
:input-debounce="0" :options="businessTypes"
:label="t('customer.basicData.businessType')" :rules="validate('client.businessTypeFk')"
:options="businessTypes" emit-value
:rules="validate('client.businessTypeFk')" map-options
emit-value option-label="description"
map-options option-value="code"
option-label="description" v-model="data.businessTypeFk"
option-value="code" />
v-model="data.businessTypeFk"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('customer.basicData.contact')"
:label="t('customer.basicData.contact')" :rules="validate('client.contact')"
:rules="validate('client.contact')" clearable
clearable v-model="data.contact"
v-model="data.contact" />
/> <VnInput
</div> :label="t('customer.basicData.email')"
<div class="col"> :rules="validate('client.email')"
<VnInput clearable
:label="t('customer.basicData.email')" type="email"
:rules="validate('client.email')" v-model="data.email"
clearable >
type="email" <template #append>
v-model="data.email" <QIcon name="info" class="cursor-info">
> <QTooltip>{{
<template #append> t('customer.basicData.youCanSaveMultipleEmails')
<QIcon name="info" class="cursor-info"> }}</QTooltip>
<QTooltip>{{ </QIcon>
t('customer.basicData.youCanSaveMultipleEmails') </template>
}}</QTooltip> </VnInput>
</QIcon>
</template>
</VnInput>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('customer.basicData.phone')"
:label="t('customer.basicData.phone')" :rules="validate('client.phone')"
:rules="validate('client.phone')" clearable
clearable v-model="data.phone"
v-model="data.phone" />
/> <VnInput
</div> :label="t('customer.basicData.mobile')"
<div class="col"> :rules="validate('client.mobile')"
<VnInput clearable
:label="t('customer.basicData.mobile')" v-model="data.mobile"
:rules="validate('client.mobile')" />
clearable
v-model="data.mobile"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QSelect
<QSelect :input-debounce="0"
:input-debounce="0" :label="t('customer.basicData.salesPerson')"
:label="t('customer.basicData.salesPerson')" :options="workers"
:options="workers" :rules="validate('client.salesPersonFk')"
:rules="validate('client.salesPersonFk')" @filter="(value, update) => filter(value, update, filterOptions)"
@filter="(value, update) => filter(value, update, filterOptions)" emit-value
emit-value map-options
map-options option-label="name"
option-label="name" option-value="id"
option-value="id" use-input
use-input v-model="data.salesPersonFk"
v-model="data.salesPersonFk" >
> <template #prepend>
<template #prepend> <QAvatar color="orange">
<QAvatar color="orange"> <QImg
<QImg :src="`/api/Images/user/160x160/${data.salesPersonFk}/download?access_token=${token}`"
:src="`/api/Images/user/160x160/${data.salesPersonFk}/download?access_token=${token}`" spinner-color="white"
spinner-color="white" v-if="data.salesPersonFk"
v-if="data.salesPersonFk" />
/> </QAvatar>
</QAvatar> </template>
</template> </QSelect>
</QSelect> <QSelect
</div> v-model="data.contactChannelFk"
<div class="col"> :options="contactChannels"
<QSelect option-value="id"
:input-debounce="0" option-label="name"
:label="t('customer.basicData.contactChannel')" emit-value
:options="contactChannels" :label="t('customer.basicData.contactChannel')"
:rules="validate('client.contactChannelFk')" map-options
emit-value :rules="validate('client.contactChannelFk')"
map-options :input-debounce="0"
option-label="name" />
option-value="id"
v-model="data.contactChannelFk"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QSelect
<QSelect :input-debounce="0"
:input-debounce="0" :label="t('customer.basicData.previousClient')"
:label="t('customer.basicData.previousClient')" :options="clients"
:options="clients" :rules="validate('client.transferorFk')"
:rules="validate('client.transferorFk')" emit-value
emit-value map-options
map-options option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="data.transferorFk"
v-model="data.transferorFk" >
> <template #append>
<template #append> <QIcon name="info" class="cursor-pointer">
<QIcon name="info" class="cursor-pointer"> <QTooltip>{{
<QTooltip>{{ t(
t( 'In case of a company succession, specify the grantor company'
'In case of a company succession, specify the grantor company' )
) }}</QTooltip>
}}</QTooltip> </QIcon>
</QIcon> </template>
</template> </QSelect>
</QSelect>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

106
src/pages/Customer/Card/CustomerBillingData.vue
View File

@ -48,74 +48,56 @@ const getBankEntities = (data, formData) => {
> >
<template #form="{ data, validate }"> <template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Billing data')"
:label="t('Billing data')" :options="payMethods"
:options="payMethods" hide-selected
hide-selected option-label="name"
option-label="name" option-value="id"
option-value="id" v-model="data.payMethod"
v-model="data.payMethod" />
/> <VnInput :label="t('Due day')" clearable v-model="data.dueDay" />
</div>
<div class="col">
<VnInput :label="t('Due day')" clearable v-model="data.dueDay" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput :label="t('IBAN')" clearable v-model="data.iban">
<VnInput :label="t('IBAN')" clearable v-model="data.iban"> <template #append>
<template #append> <QIcon name="info" class="cursor-info">
<QIcon name="info" class="cursor-info"> <QTooltip>{{ t('components.iban_tooltip') }}</QTooltip>
<QTooltip>{{ t('components.iban_tooltip') }}</QTooltip> </QIcon>
</QIcon> </template>
</template> </VnInput>
</VnInput> <VnSelectDialog
</div> :label="t('Swift / BIC')"
<div class="col"> :options="bankEntitiesOptions"
<VnSelectDialog :roles-allowed-to-create="['salesAssistant', 'hr']"
:label="t('Swift / BIC')" :rules="validate('Worker.bankEntity')"
:options="bankEntitiesOptions" hide-selected
:roles-allowed-to-create="['salesAssistant', 'hr']" option-label="name"
:rules="validate('Worker.bankEntity')" option-value="id"
hide-selected v-model="data.bankEntityFk"
option-label="name" >
option-value="id" <template #form>
v-model="data.bankEntityFk" <CreateBankEntityForm
> @on-data-saved="getBankEntities($event, data)"
<template #form> />
<CreateBankEntityForm </template>
@on-data-saved="getBankEntities($event, data)" <template #option="scope">
/> <QItem v-bind="scope.itemProps">
</template> <QItemSection v-if="scope.opt">
<template #option="scope"> <QItemLabel
<QItem v-bind="scope.itemProps"> >{{ scope.opt.bic }} {{ scope.opt.name }}</QItemLabel
<QItemSection v-if="scope.opt"> >
<QItemLabel </QItemSection>
>{{ scope.opt.bic }} </QItem>
{{ scope.opt.name }}</QItemLabel </template>
> </VnSelectDialog>
</QItemSection>
</QItem>
</template>
</VnSelectDialog>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox :label="t('Received LCR')" v-model="data.hasLcr" />
<QCheckbox :label="t('Received LCR')" v-model="data.hasLcr" /> <QCheckbox :label="t('VNL core received')" v-model="data.hasCoreVnl" />
</div> <QCheckbox :label="t('VNL B2B received')" v-model="data.hasSepaVnl" />
<div class="col">
<QCheckbox
:label="t('VNL core received')"
v-model="data.hasCoreVnl"
/>
</div>
<div class="col">
<QCheckbox :label="t('VNL B2B received')" v-model="data.hasSepaVnl" />
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

6
src/pages/Customer/Card/CustomerCard.vue
View File

@ -1,14 +1,16 @@
<script setup> <script setup>
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
import CustomerDescriptor from './CustomerDescriptor.vue'; import CustomerDescriptor from './CustomerDescriptor.vue';
import CustomerFilter from '../CustomerFilter.vue';
</script> </script>
<template> <template>
<VnCard <VnCard
data-key="Client" data-key="Client"
base-url="Clients" base-url="Clients"
:descriptor="CustomerDescriptor" :descriptor="CustomerDescriptor"
searchbar-data-key="CustomerList" :filter-panel="CustomerFilter"
searchbar-url="Clients/filter" search-data-key="CustomerList"
search-url="Clients/filter"
searchbar-label="Search customer" searchbar-label="Search customer"
searchbar-info="You can search by customer id or name" searchbar-info="You can search by customer id or name"
/> />

2
src/pages/Customer/Card/CustomerCreditContracts.vue
View File

@ -105,7 +105,7 @@ const updateData = () => {
color="primary" color="primary"
name="lock" name="lock"
size="md" size="md"
style="font-variation-settings: 'FILL' 1" class="fill-icon"
> >
<QTooltip>{{ t('Close contract') }}</QTooltip> <QTooltip>{{ t('Close contract') }}</QTooltip>
</QIcon> </QIcon>

182
src/pages/Customer/Card/CustomerFiscalData.vue
View File

@ -41,93 +41,75 @@ function handleLocation(data, location) {
> >
<template #form="{ data, validate }"> <template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Social name')"
:label="t('Social name')" :required="true"
:required="true" :rules="validate('client.socialName')"
:rules="validate('client.socialName')" clearable
clearable v-model="data.socialName"
v-model="data.socialName" >
> <template #append>
<template #append> <QIcon name="info" class="cursor-info">
<QIcon name="info" class="cursor-info"> <QTooltip>{{ t('onlyLetters') }}</QTooltip>
<QTooltip>{{ t('onlyLetters') }}</QTooltip> </QIcon>
</QIcon> </template>
</template> </VnInput>
</VnInput> <VnInput :label="t('Tax number')" clearable v-model="data.fi" />
</div>
<div class="col">
<VnInput :label="t('Tax number')" clearable v-model="data.fi" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput :label="t('Street')" clearable v-model="data.street" />
<VnInput :label="t('Street')" clearable v-model="data.street" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Sage tax type')"
:label="t('Sage tax type')" :options="typesTaxes"
:options="typesTaxes" hide-selected
hide-selected option-label="vat"
option-label="vat" option-value="id"
option-value="id" v-model="data.sageTaxTypeFk"
v-model="data.sageTaxTypeFk" />
/> <VnSelect
</div> :label="t('Sage transaction type')"
<div class="col"> :options="typesTransactions"
<VnSelect hide-selected
:label="t('Sage transaction type')" option-label="transaction"
:options="typesTransactions" option-value="id"
hide-selected v-model="data.sageTransactionTypeFk"
option-label="transaction" >
option-value="id" <template #option="scope">
v-model="data.sageTransactionTypeFk" <QItem v-bind="scope.itemProps">
> <QItemSection>
<template #option="scope"> <QItemLabel>{{ scope.opt.name }}</QItemLabel>
<QItem v-bind="scope.itemProps"> <QItemLabel caption>
<QItemSection> {{ `${scope.opt.id}: ${scope.opt.transaction}` }}
<QItemLabel>{{ scope.opt.name }}</QItemLabel> </QItemLabel>
<QItemLabel caption> </QItemSection>
{{ `${scope.opt.id}: ${scope.opt.transaction}` }} </QItem>
</QItemLabel> </template>
</QItemSection> </VnSelect>
</QItem>
</template>
</VnSelect>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnLocation
<VnLocation :rules="validate('Worker.postcode')"
:rules="validate('Worker.postcode')" :roles-allowed-to-create="['deliveryAssistant']"
:roles-allowed-to-create="['deliveryAssistant']" :options="postcodesOptions"
:options="postcodesOptions" v-model="data.postcode"
v-model="data.postcode" @update:model-value="(location) => handleLocation(data, location)"
@update:model-value="(location) => handleLocation(data, location)" >
> </VnLocation>
</VnLocation>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <QCheckbox :label="t('Active')" v-model="data.isActive" />
<QCheckbox :label="t('Active')" v-model="data.isActive" /> <QCheckbox :label="t('Frozen')" v-model="data.isFreezed" />
</div>
<div class="col">
<QCheckbox :label="t('Frozen')" v-model="data.isFreezed" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <QCheckbox :label="t('Has to invoice')" v-model="data.hasToInvoice" />
<QCheckbox :label="t('Has to invoice')" v-model="data.hasToInvoice" /> <div>
</div>
<div class="col">
<QCheckbox :label="t('Vies')" v-model="data.isVies" /> <QCheckbox :label="t('Vies')" v-model="data.isVies" />
<QIcon name="info" class="cursor-info q-ml-sm" size="sm"> <QIcon name="info" class="cursor-info q-ml-sm" size="sm">
<QTooltip> <QTooltip>
@ -137,23 +119,16 @@ function handleLocation(data, location) {
</div> </div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <QCheckbox :label="t('Notify by email')" v-model="data.isToBeMailed" />
<QCheckbox <QCheckbox
:label="t('Notify by email')" :label="t('Invoice by address')"
v-model="data.isToBeMailed" v-model="data.hasToInvoiceByAddress"
/> />
</div>
<div class="col">
<QCheckbox
:label="t('Invoice by address')"
v-model="data.hasToInvoiceByAddress"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <div>
<QCheckbox <QCheckbox
:label="t('Is equalizated')" :label="t('Is equalizated')"
v-model="data.isEqualizated" v-model="data.isEqualizated"
@ -164,27 +139,18 @@ function handleLocation(data, location) {
</QTooltip> </QTooltip>
</QIcon> </QIcon>
</div> </div>
<div class="col"> <QCheckbox :label="t('Verified data')" v-model="data.isTaxDataChecked" />
<QCheckbox
:label="t('Verified data')"
v-model="data.isTaxDataChecked"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <QCheckbox
<QCheckbox :label="t('Incoterms authorization')"
:label="t('Incoterms authorization')" v-model="data.hasIncoterms"
v-model="data.hasIncoterms" />
/> <QCheckbox
</div> :label="t('Electronic invoice')"
<div class="col"> v-model="data.hasElectronicInvoice"
<QCheckbox />
:label="t('Electronic invoice')"
v-model="data.hasElectronicInvoice"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

53
src/pages/Customer/Card/CustomerGreuges.vue
View File

@ -1,20 +1,17 @@
<script setup> <script setup>
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router'; import { useRoute } from 'vue-router';
import { QBtn } from 'quasar'; import { QBtn } from 'quasar';
import { useStateStore } from 'src/stores/useStateStore';
import { toCurrency } from 'src/filters'; import { toCurrency } from 'src/filters';
import { toDateTimeFormat } from 'src/filters/date'; import { toDateTimeFormat } from 'src/filters/date';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue'; import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
const { t } = useI18n(); const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const stateStore = computed(() => useStateStore());
const rows = ref([]); const rows = ref([]);
const totalAmount = ref(0); const totalAmount = ref(0);
@ -105,28 +102,40 @@ const columns = computed(() => [
const setRows = (data) => { const setRows = (data) => {
rows.value = data; rows.value = data;
totalAmount.value = data.reduce((accumulator, currentValue) => { totalAmount.value = data.reduce((acc, { amount = 0 }) => acc + amount, 0);
return accumulator + currentValue.amount;
}, 0);
};
const toCustomerGreugeCreate = () => {
router.push({ name: 'CustomerGreugeCreate' });
}; };
</script> </script>
<template> <template>
<FetchData :filter="filter" @on-fetch="setRows" auto-load url="greuges" /> <FetchData :filter="filter" @on-fetch="setRows" auto-load url="greuges" />
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
</template>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="300" show-if-above>
<QCard class="full-width q-pa-sm">
<h6 class="flex justify-end q-my-lg q-pr-lg" v-if="totalAmount">
<span class="color-vn-label q-mr-md">{{ t('Total') }}:</span>
{{ toCurrency(totalAmount) }}
</h6>
<QSkeleton v-else type="QInput" square />
</QCard>
</QDrawer>
<div class="full-width flex justify-center"> <div class="full-width flex justify-center">
<QPage class="card-width q-pa-lg"> <QPage class="card-width q-pa-lg">
<QCard class="full-width q-pa-sm" v-if="totalAmount">
<h6 class="flex justify-end q-my-lg q-pr-lg">
<span class="color-vn-label q-mr-md">{{ t('Total') }}:</span>
{{ toCurrency(totalAmount) }}
</h6>
</QCard>
<QCard class="q-pa-sm q-mt-md"> <QCard class="q-pa-sm q-mt-md">
<QTable <QTable
:columns="columns" :columns="columns"
@ -164,7 +173,7 @@ const toCustomerGreugeCreate = () => {
</div> </div>
<QPageSticky :offset="[18, 18]"> <QPageSticky :offset="[18, 18]">
<QBtn @click.stop="toCustomerGreugeCreate()" color="primary" fab icon="add" /> <QBtn color="primary" fab icon="add" :to="{ name: 'CustomerGreugeCreate' }" />
<QTooltip> <QTooltip>
{{ t('New greuge') }} {{ t('New greuge') }}
</QTooltip> </QTooltip>

1
src/pages/Customer/Card/CustomerWebAccess.vue
View File

@ -11,7 +11,6 @@ import useNotify from 'src/composables/useNotify';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import CustomerChangePassword from 'src/pages/Customer/components/CustomerChangePassword.vue'; import CustomerChangePassword from 'src/pages/Customer/components/CustomerChangePassword.vue';

1
src/pages/Customer/Card/CustomerWebPayment.vue
View File

@ -7,7 +7,6 @@ import axios from 'axios';
import { toCurrency, toDateHourMinSec } from 'src/filters'; import { toCurrency, toDateHourMinSec } from 'src/filters';
import FetchData from 'components/FetchData.vue';
import CustomerCloseIconTooltip from '../components/CustomerCloseIconTooltip.vue'; import CustomerCloseIconTooltip from '../components/CustomerCloseIconTooltip.vue';
import CustomerCheckIconTooltip from '../components/CustomerCheckIconTooltip.vue'; import CustomerCheckIconTooltip from '../components/CustomerCheckIconTooltip.vue';

124
src/pages/Customer/CustomerCreate.vue
View File

@ -49,89 +49,69 @@ function handleLocation(data, location) {
> >
<template #form="{ data, validate }"> <template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput :label="t('Comercial name')" v-model="data.name" />
<QInput :label="t('Comercial name')" v-model="data.name" /> <VnSelect
</div> :label="t('Salesperson')"
<div class="col"> :options="workersOptions"
<VnSelect hide-selected
:label="t('Salesperson')" option-label="name"
:options="workersOptions" option-value="id"
hide-selected v-model="data.salesPersonFk"
option-label="name" />
option-value="id"
v-model="data.salesPersonFk"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Business type')"
:label="t('Business type')" :options="businessTypesOptions"
:options="businessTypesOptions" hide-selected
hide-selected option-label="description"
option-label="description" option-value="code"
option-value="code" v-model="data.businessTypeFk"
v-model="data.businessTypeFk" />
/> <QInput v-model="data.fi" :label="t('Tax number')" />
</div>
<div class="col">
<QInput v-model="data.fi" :label="t('Tax number')" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput :label="t('Business name')"
:label="t('Business name')" :rules="validate('client.socialName')"
:rules="validate('client.socialName')" v-model="data.socialName"
v-model="data.socialName" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput :label="t('Street')"
:label="t('Street')" :rules="validate('client.street')"
:rules="validate('client.street')" v-model="data.street"
v-model="data.street" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnLocation
<VnLocation :rules="validate('Worker.postcode')"
:rules="validate('Worker.postcode')" :roles-allowed-to-create="['deliveryAssistant']"
:roles-allowed-to-create="['deliveryAssistant']" :options="postcodesOptions"
:options="postcodesOptions" v-model="data.location"
v-model="data.location" @update:model-value="(location) => handleLocation(data, location)"
@update:model-value=" >
(location) => handleLocation(data, location) </VnLocation>
"
>
</VnLocation>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput v-model="data.userName" :label="t('Web user')" />
<QInput v-model="data.userName" :label="t('Web user')" /> <QInput
</div> :label="t('Email')"
<div class="col"> :rules="validate('client.email')"
<QInput clearable
:label="t('Email')" type="email"
:rules="validate('client.email')" v-model="data.email"
clearable >
type="email" <template #append>
v-model="data.email" <QIcon name="info" class="cursor-info">
> <QTooltip max-width="400px">{{
<template #append> t('customer.basicData.youCanSaveMultipleEmails')
<QIcon name="info" class="cursor-info"> }}</QTooltip>
<QTooltip max-width="400px">{{ </QIcon>
t('customer.basicData.youCanSaveMultipleEmails') </template>
}}</QTooltip> </QInput>
</QIcon>
</template>
</QInput>
</div>
</VnRow> </VnRow>
<QCheckbox <QCheckbox
:label="t('Is equalizated')" :label="t('Is equalizated')"

7
src/pages/Customer/CustomerMain.vue
View File

@ -15,10 +15,3 @@ const stateStore = useStateStore();
<RouterView></RouterView> <RouterView></RouterView>
</QPageContainer> </QPageContainer>
</template> </template>
<style lang="scss">
#searchbar,
.search-panel {
width: 400px;
}
</style>

283
src/pages/Customer/Defaulter/CustomerDefaulter.vue
View File

@ -3,10 +3,10 @@ import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { QBtn, QCheckbox, useQuasar } from 'quasar'; import { QBtn, QCheckbox, useQuasar } from 'quasar';
import { useStateStore } from 'stores/useStateStore';
import { toCurrency, toDate } from 'filters/index'; import { toCurrency, toDate, dateRange } from 'filters/index';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import FetchData from 'components/FetchData.vue';
import CustomerNotificationsFilter from './CustomerDefaulterFilter.vue'; import CustomerNotificationsFilter from './CustomerDefaulterFilter.vue';
import CustomerBalanceDueTotal from './CustomerBalanceDueTotal.vue'; import CustomerBalanceDueTotal from './CustomerBalanceDueTotal.vue';
import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from 'src/pages/Customer/Card/CustomerDescriptorProxy.vue';
@ -14,18 +14,20 @@ import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.v
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import CustomerDefaulterAddObservation from './CustomerDefaulterAddObservation.vue'; import CustomerDefaulterAddObservation from './CustomerDefaulterAddObservation.vue';
import axios from 'axios';
const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const quasar = useQuasar(); const quasar = useQuasar();
const dataRef = ref(null);
const balanceDueTotal = ref(0); const balanceDueTotal = ref(0);
const selected = ref([]); const selected = ref([]);
const rows = ref([]);
const tableColumnComponents = { const tableColumnComponents = {
client: { client: {
component: QBtn, component: QBtn,
props: () => ({ flat: true, color: 'blue', noCaps: true }), props: () => ({ flat: true, class: 'link', noCaps: true }),
event: () => {}, event: () => {},
}, },
isWorker: { isWorker: {
@ -38,7 +40,12 @@ const tableColumnComponents = {
}, },
salesPerson: { salesPerson: {
component: QBtn, component: QBtn,
props: () => ({ flat: true, color: 'blue', noCaps: true }), props: () => ({ flat: true, class: 'link', noCaps: true }),
event: () => {},
},
department: {
component: 'span',
props: () => {},
event: () => {}, event: () => {},
}, },
country: { country: {
@ -58,7 +65,7 @@ const tableColumnComponents = {
}, },
author: { author: {
component: QBtn, component: QBtn,
props: () => ({ flat: true, color: 'blue', noCaps: true }), props: () => ({ flat: true, class: 'link', noCaps: true }),
event: () => {}, event: () => {},
}, },
lastObservation: { lastObservation: {
@ -81,6 +88,16 @@ const tableColumnComponents = {
props: () => {}, props: () => {},
event: () => {}, event: () => {},
}, },
finished: {
component: QCheckbox,
props: (prop) => ({
disable: true,
'model-value': prop.value,
class: 'disabled-checkbox',
}),
event: () => {},
},
}; };
const columns = computed(() => [ const columns = computed(() => [
@ -104,6 +121,13 @@ const columns = computed(() => [
name: 'salesPerson', name: 'salesPerson',
sortable: true, sortable: true,
}, },
{
align: 'left',
field: 'departmentName',
label: t('Department'),
name: 'department',
sortable: true,
},
{ {
align: 'left', align: 'left',
field: 'country', field: 'country',
@ -165,41 +189,102 @@ const columns = computed(() => [
name: 'from', name: 'from',
sortable: true, sortable: true,
}, },
{
align: 'left',
field: 'finished',
label: t('Has recover'),
name: 'finished',
},
]); ]);
const setRows = (data) => {
rows.value = data;
balanceDueTotal.value = data.reduce((accumulator, currentValue) => {
return accumulator + (currentValue['amount'] || 0);
}, 0);
};
const viewAddObservation = (rowsSelected) => { const viewAddObservation = (rowsSelected) => {
quasar.dialog({ quasar.dialog({
component: CustomerDefaulterAddObservation, component: CustomerDefaulterAddObservation,
componentProps: { componentProps: {
clients: rowsSelected, clients: rowsSelected,
promise: refreshData, promise: async () => await dataRef.value.fetch(),
}, },
}); });
}; };
const refreshData = () => { const departments = ref(new Map());
setRows();
const onFetch = async (data) => {
const salesPersonFks = data.map((item) => item.salesPersonFk);
const departmentNames = salesPersonFks.map(async (salesPersonFk) => {
try {
const { data: workerDepartment } = await axios.get(
`WorkerDepartments/${salesPersonFk}`
);
const { data: department } = await axios.get(
`Departments/${workerDepartment.departmentFk}`
);
departments.value.set(salesPersonFk, department.name);
} catch (error) {
console.error('Err: ', error);
}
});
const recoveryData = await axios.get('Recoveries');
const recoveries = recoveryData.data.map(({ clientFk, finished }) => ({
clientFk,
finished,
}));
await Promise.all(departmentNames);
data.forEach((item) => {
item.departmentName = departments.value.get(item.salesPersonFk);
item.isWorker = item.businessTypeFk === 'worker';
const recovery = recoveries.find(({ clientFk }) => clientFk === item.clientFk);
item.finished = recovery?.finished === null;
});
for (const element of data) element.isWorker = element.businessTypeFk === 'worker';
balanceDueTotal.value = data.reduce((acc, { amount = 0 }) => acc + amount, 0);
}; };
const onFetch = (data) => { function exprBuilder(param, value) {
for (const element of data) { switch (param) {
element.isWorker = element.businessTypeFk === 'worker'; case 'clientFk':
return { [`d.${param}`]: value?.id };
case 'creditInsurance':
case 'amount':
case 'workerFk':
case 'departmentFk':
case 'countryFk':
case 'payMethod':
case 'salesPersonFk':
return { [`d.${param}`]: value };
case 'date':
return { 'd.created': { between: dateRange(value) } };
case 'defaulterSinced':
return { 'd.defaulterSinced': { between: dateRange(value) } };
} }
rows.value = data; }
};
</script> </script>
<template> <template>
<FetchData :filter="filter" @on-fetch="onFetch" auto-load url="Defaulters/filter" /> <template v-if="stateStore.isHeaderMounted()">
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
</template>
<QDrawer side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<CustomerNotificationsFilter data-key="CustomerDefaulter" /> <CustomerNotificationsFilter data-key="CustomerDefaulter" />
</QScrollArea> </QScrollArea>
@ -214,69 +299,107 @@ const onFetch = (data) => {
icon="vn:notes" icon="vn:notes"
:disabled="!selected.length" :disabled="!selected.length"
@click.stop="viewAddObservation(selected)" @click.stop="viewAddObservation(selected)"
/> >
<QTooltip>{{ t('Add observation') }}</QTooltip>
</QBtn>
</div> </div>
</template> </template>
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <VnPaginate
:columns="columns" ref="dataRef"
:rows="rows" @on-fetch="onFetch"
class="full-width q-mt-md" data-key="CustomerDefaulter"
row-key="clientFk" :filter="filter"
selection="multiple" :expr-builder="exprBuilder"
v-model:selected="selected" auto-load
url="Defaulters/filter"
> >
<template #header="props"> <template #body="{ rows }">
<QTr :props="props" class="bg"> <div class="q-pa-md">
<QTh> <QTable
<QCheckbox v-model="props.selected" /> :columns="columns"
</QTh> :rows="rows"
<QTh v-for="col in props.cols" :key="col.name" :props="props"> class="full-width"
{{ t(col.label) }} row-key="clientFk"
<QTooltip v-if="col.tooltip">{{ col.tooltip }}</QTooltip> selection="multiple"
</QTh> v-model:selected="selected"
</QTr> >
</template> <template #header="props">
<QTr :props="props" class="bg" style="min-height: 200px">
<QTh>
<QCheckbox v-model="props.selected" />
</QTh>
<QTh
v-for="col in props.cols"
:key="col.name"
:props="props"
>
{{ t(col.label) }}
<QTooltip v-if="col.tooltip">{{
col.tooltip
}}</QTooltip>
</QTh>
</QTr>
</template>
<template #body-cell="props"> <template #body-cell="props">
<QTd :props="props"> <QTd :props="props">
<QTr :props="props" class="cursor-pointer"> <QTr :props="props" class="cursor-pointer">
<component <component
:is="tableColumnComponents[props.col.name].component" :is="
class="col-content" tableColumnComponents[props.col.name]
v-bind="tableColumnComponents[props.col.name].props(props)" .component
@click="tableColumnComponents[props.col.name].event(props)" "
> class="col-content"
<template v-if="props.col.name !== 'isWorker'"> v-bind="
<div v-if="props.col.name === 'lastObservation'"> tableColumnComponents[props.col.name].props(
<VnInput props
type="textarea" )
v-model="props.value" "
autogrow @click="
/> tableColumnComponents[props.col.name].event(
</div> props
<div v-else>{{ props.value }}</div> )
</template> "
>
<template v-if="typeof props.value !== 'boolean'">
<div
v-if="
props.col.name === 'lastObservation'
"
>
<VnInput
type="textarea"
v-model="props.value"
readonly
dense
rows="2"
/>
</div>
<div v-else>{{ props.value }}</div>
</template>
<WorkerDescriptorProxy <WorkerDescriptorProxy
:id="props.row.salesPersonFk" :id="props.row.salesPersonFk"
v-if="props.col.name === 'salesPerson'" v-if="props.col.name === 'salesPerson'"
/> />
<WorkerDescriptorProxy <WorkerDescriptorProxy
:id="props.row.workerFk" :id="props.row.workerFk"
v-if="props.col.name === 'author'" v-if="props.col.name === 'author'"
/> />
<CustomerDescriptorProxy <CustomerDescriptorProxy
:id="props.row.clientFk" :id="props.row.clientFk"
v-if="props.col.name === 'client'" v-if="props.col.name === 'client'"
/> />
</component> </component>
</QTr> </QTr>
</QTd> </QTd>
</template>
</QTable>
</div>
</template> </template>
</QTable> </VnPaginate>
</QPage> </QPage>
</template> </template>
@ -289,9 +412,11 @@ const onFetch = (data) => {
<i18n> <i18n>
es: es:
Add observation: Añadir observación
Client: Cliente Client: Cliente
Is worker: Es trabajador Is worker: Es trabajador
Salesperson: Comercial Salesperson: Comercial
Department: Departamento
Country: País Country: País
P. Method: F. Pago P. Method: F. Pago
Pay method: Forma de pago Pay method: Forma de pago

12
src/pages/Customer/Defaulter/CustomerDefaulterAddObservation.vue
View File

@ -61,13 +61,11 @@ const onSubmit = async () => {
}} }}
</div> </div>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput :label="t('Message')"
:label="t('Message')" type="textarea"
type="textarea" v-model="newObservation"
v-model="newObservation" />
/>
</div>
</VnRow> </VnRow>
<div class="q-mt-lg row justify-end"> <div class="q-mt-lg row justify-end">
<QBtn <QBtn

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

@ -45,11 +45,10 @@ const authors = ref();
</div> </div>
</template> </template>
<template #body="{ params }"> <template #body="{ params, searchFn }">
<QItem class="q-mb-sm q-mt-sm"> <QItem class="q-mb-sm">
<QItemSection v-if="clients"> <QItemSection v-if="clients">
<VnSelect <VnSelect
:input-debounce="0"
:label="t('Client')" :label="t('Client')"
:options="clients" :options="clients"
dense dense
@ -57,11 +56,13 @@ const authors = ref();
hide-selected hide-selected
map-options map-options
option-label="name" option-label="name"
option-value="clientTypeFk" option-value="id"
outlined outlined
rounded rounded
use-input use-input
v-model="params.clientFk" v-model="params.clientFk"
@update:model-value="searchFn()"
auto-load
/> />
</QItemSection> </QItemSection>
<QItemSection v-else> <QItemSection v-else>
@ -85,6 +86,7 @@ const authors = ref();
rounded rounded
use-input use-input
v-model="params.salesPersonFk" v-model="params.salesPersonFk"
@update:model-value="searchFn()"
/> />
</QItemSection> </QItemSection>
<QItemSection v-else> <QItemSection v-else>
@ -108,6 +110,7 @@ const authors = ref();
rounded rounded
use-input use-input
v-model="params.countryFk" v-model="params.countryFk"
@update:model-value="searchFn()"
/> />
</QItemSection> </QItemSection>
<QItemSection v-else> <QItemSection v-else>
@ -153,6 +156,7 @@ const authors = ref();
rounded rounded
use-input use-input
v-model="params.workerFk" v-model="params.workerFk"
@update:model-value="searchFn()"
/> />
</QItemSection> </QItemSection>
<QItemSection v-else> <QItemSection v-else>
@ -162,7 +166,7 @@ const authors = ref();
<QItem class="q-mb-sm"> <QItem class="q-mb-sm">
<QItemSection> <QItemSection>
<VnInput <VnInputDate
:label="t('L. O. Date')" :label="t('L. O. Date')"
clearable clearable
is-outlined is-outlined

171
src/pages/Customer/ExtendedList/CustomerExtendedList.vue
View File

@ -10,7 +10,7 @@ import CustomerExtendedListActions from './CustomerExtendedListActions.vue';
import CustomerExtendedListFilter from './CustomerExtendedListFilter.vue'; import CustomerExtendedListFilter from './CustomerExtendedListFilter.vue';
import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue'; import TableVisibleColumns from 'src/components/common/TableVisibleColumns.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import { useArrayData } from 'composables/useArrayData'; import { useArrayData } from 'composables/useArrayData';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toDate } from 'src/filters'; import { toDate } from 'src/filters';
@ -37,8 +37,6 @@ onMounted(() => {
allColumnNames.value = filteredColumns.map((col) => col.name); allColumnNames.value = filteredColumns.map((col) => col.name);
}); });
const rows = computed(() => arrayData.value.store.data);
const selectedCustomerId = ref(0); const selectedCustomerId = ref(0);
const selectedSalesPersonId = ref(0); const selectedSalesPersonId = ref(0);
const allColumnNames = ref([]); const allColumnNames = ref([]);
@ -70,6 +68,11 @@ const tableColumnComponents = {
props: () => {}, props: () => {},
event: () => {}, event: () => {},
}, },
socialName: {
component: 'span',
props: () => {},
event: () => {},
},
fi: { fi: {
component: 'span', component: 'span',
props: () => {}, props: () => {},
@ -283,6 +286,12 @@ const columns = computed(() => [
label: t('customer.extendedList.tableVisibleColumns.name'), label: t('customer.extendedList.tableVisibleColumns.name'),
name: 'name', name: 'name',
}, },
{
align: 'left',
field: 'socialName',
label: t('customer.extendedList.tableVisibleColumns.socialName'),
name: 'socialName',
},
{ {
align: 'left', align: 'left',
field: 'fi', field: 'fi',
@ -485,6 +494,23 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
</script> </script>
<template> <template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#actions-append">
<div class="row q-gutter-x-sm">
<QBtn
flat
@click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport></template
>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<CustomerExtendedListFilter <CustomerExtendedListFilter
@ -495,7 +521,7 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<VnSubToolbar> <VnSubToolbar>
<template #st-actions> <template #st-data>
<TableVisibleColumns <TableVisibleColumns
:all-columns="allColumnNames" :all-columns="allColumnNames"
table-code="clientsDetail" table-code="clientsDetail"
@ -508,58 +534,97 @@ const selectSalesPersonId = (id) => (selectedSalesPersonId.value = id);
</VnSubToolbar> </VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <VnPaginate
:columns="columns" data-key="CustomerExtendedList"
:rows="rows" url="Clients/extendedListFilter"
class="full-width q-mt-md" auto-load
row-key="id"
:visible-columns="visibleColumns"
@row-click="(evt, row, id) => navigateToTravelId(row.id)"
> >
<template #body-cell="{ col, value }"> <template #body="{ rows }">
<QTd @click="stopEventPropagation($event, col)"> <div class="q-pa-md">
{{ value }} <QTable
</QTd> :columns="columns"
</template> :rows="rows"
<template #body-cell-id="props"> class="full-width q-mt-md"
<QTd @click="stopEventPropagation($event, props.col)"> row-key="id"
<component :visible-columns="visibleColumns"
:is="tableColumnComponents[props.col.name].component" @row-click="(evt, row, id) => navigateToTravelId(row.id)"
class="col-content"
v-bind="tableColumnComponents[props.col.name].props(props)"
@click="tableColumnComponents[props.col.name].event(props)"
> >
<CustomerDescriptorProxy :id="props.row.id" /> <template #body-cell="{ col, value }">
{{ props.row.id }} <QTd @click="stopEventPropagation($event, col)">
</component> {{ value }}
</QTd> </QTd>
</template>
<template #body-cell-customerStatus="props">
<QTd @click="stopEventPropagation($event, props.col)">
<component
:is="tableColumnComponents[props.col.name].component"
class="col-content"
v-bind="
tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
>
</component>
</QTd>
</template>
<template #body-cell-id="props">
<QTd @click="stopEventPropagation($event, props.col)">
<component
:is="tableColumnComponents[props.col.name].component"
class="col-content"
v-bind="
tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
>
<CustomerDescriptorProxy :id="props.row.id" />
{{ props.row.id }}
</component>
</QTd>
</template>
<template #body-cell-salesPersonFk="props">
<QTd @click="stopEventPropagation($event, props.col)">
<component
v-if="props.row.salesPerson"
class="col-content"
:is="tableColumnComponents[props.col.name].component"
v-bind="
tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
>
<WorkerDescriptorProxy
:id="props.row.salesPersonFk"
/>
{{ props.row.salesPerson }}
</component>
<span class="col-content" v-else>-</span>
</QTd>
</template>
<template #body-cell-actions="props">
<QTd @click="stopEventPropagation($event, props.col)">
<component
:is="tableColumnComponents[props.col.name].component"
class="col-content"
v-bind="
tableColumnComponents[props.col.name].props(props)
"
@click="
tableColumnComponents[props.col.name].event(props)
"
/>
</QTd>
</template>
</QTable>
</div>
</template> </template>
<template #body-cell-salesPersonFk="props"> </VnPaginate>
<QTd @click="stopEventPropagation($event, props.col)">
<component
v-if="props.row.salesPerson"
class="col-content"
:is="tableColumnComponents[props.col.name].component"
v-bind="tableColumnComponents[props.col.name].props(props)"
@click="tableColumnComponents[props.col.name].event(props)"
>
<WorkerDescriptorProxy :id="props.row.salesPersonFk" />
{{ props.row.salesPerson }}
</component>
<span class="col-content" v-else>-</span>
</QTd>
</template>
<template #body-cell-actions="props">
<QTd @click="stopEventPropagation($event, props.col)">
<component
:is="tableColumnComponents[props.col.name].component"
class="col-content"
v-bind="tableColumnComponents[props.col.name].props(props)"
@click="tableColumnComponents[props.col.name].event(props)"
/>
</QTd>
</template>
</QTable>
</QPage> </QPage>
</template> </template>

112
src/pages/Customer/Notifications/CustomerNotifications.vue
View File

@ -1,17 +1,16 @@
<script setup> <script setup>
import { ref, computed } from 'vue'; import { ref, computed } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { QBtn } from 'quasar'; import { QBtn } from 'quasar';
import FetchData from 'components/FetchData.vue';
import CustomerNotificationsFilter from './CustomerNotificationsFilter.vue'; import CustomerNotificationsFilter from './CustomerNotificationsFilter.vue';
import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue'; import CustomerDescriptorProxy from '../Card/CustomerDescriptorProxy.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue'; import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useStateStore } from 'stores/useStateStore';
import VnPaginate from 'src/components/ui/VnPaginate.vue';
import CustomerNotificationsCampaignConsumption from './CustomerNotificationsCampaignConsumption.vue';
const stateStore = useStateStore();
const { t } = useI18n(); const { t } = useI18n();
const rows = ref([]);
const selected = ref([]); const selected = ref([]);
const selectedCustomerId = ref(0); const selectedCustomerId = ref(0);
@ -82,46 +81,82 @@ const selectCustomerId = (id) => {
</script> </script>
<template> <template>
<FetchData <template v-if="stateStore.isHeaderMounted()">
:filter="filter" <Teleport to="#actions-append">
@on-fetch="(data) => (rows = data)" <div class="row q-gutter-x-sm">
auto-load <QBtn
url="Clients" flat
/> @click="stateStore.toggleRightDrawer()"
round
dense
icon="menu"
>
<QTooltip bottom anchor="bottom right">
{{ t('globals.collapseMenu') }}
</QTooltip>
</QBtn>
</div>
</Teleport>
</template>
<QDrawer side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<CustomerNotificationsFilter data-key="CustomerNotifications" /> <CustomerNotificationsFilter data-key="CustomerNotifications" />
</QScrollArea> </QScrollArea>
</QDrawer> </QDrawer>
<VnSubToolbar class="justify-end">
<VnSubToolbar /> <template #st-data>
<CustomerNotificationsCampaignConsumption
:selected-rows="selected.length > 0"
:clients="selected"
:promise="refreshData"
/>
</template>
</VnSubToolbar>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <VnPaginate data-key="CustomerNotifications" url="Clients" auto-load>
:columns="columns" <template #body="{ rows }">
:rows="rows" <div class="q-pa-md">
class="full-width q-mt-md" <QTable
row-key="id" :columns="columns"
selection="multiple" :rows="rows"
v-model:selected="selected" class="full-width q-mt-md"
> row-key="id"
<template #body-cell="props"> selection="multiple"
<QTd :props="props"> v-model:selected="selected"
<QTr :props="props" class="cursor-pointer"> >
<component <template #body-cell="props">
:is="tableColumnComponents[props.col.name].component" <QTd :props="props">
class="col-content" <QTr :props="props" class="cursor-pointer">
v-bind="tableColumnComponents[props.col.name].props(props)" <component
@click="tableColumnComponents[props.col.name].event(props)" :is="
> tableColumnComponents[props.col.name]
{{ props.value }} .component
<CustomerDescriptorProxy :id="selectedCustomerId" /> "
</component> class="col-content"
</QTr> v-bind="
</QTd> tableColumnComponents[props.col.name].props(
props
)
"
@click="
tableColumnComponents[props.col.name].event(
props
)
"
>
{{ props.value }}
<CustomerDescriptorProxy
:id="selectedCustomerId"
/>
</component>
</QTr>
</QTd>
</template>
</QTable>
</div>
</template> </template>
</QTable> </VnPaginate>
</QPage> </QPage>
</template> </template>
@ -140,4 +175,5 @@ es:
Phone: Teléfono Phone: Teléfono
City: Población City: Población
Email: Email Email: Email
Campaign consumption: Consumo campaña
</i18n> </i18n>

152
src/pages/Customer/Notifications/CustomerNotificationsCampaignConsumption.vue Normal file
View File

@ -0,0 +1,152 @@
<script setup>
import { ref, toRefs } from 'vue';
import { useI18n } from 'vue-i18n';
import axios from 'axios';
import useNotify from 'src/composables/useNotify';
import { useValidator } from 'src/composables/useValidator';
import VnRow from 'components/ui/VnRow.vue';
import VnSelect from 'components/common/VnSelect.vue';
import VnInputDate from 'components/common/VnInputDate.vue';
import FetchData from 'src/components/FetchData.vue';
import { watch } from 'vue';
import { onMounted } from 'vue';
const $props = defineProps({
clients: {
type: Array,
required: true,
},
promise: {
type: Function,
required: true,
},
selectedRows: {
type: Boolean,
},
});
const { selectedRows } = toRefs($props);
const { notify } = useNotify();
const { t } = useI18n();
const validationsStore = useValidator();
const campaignParams = ref(null);
const campaignsOptions = ref(null);
const moreFields = ref([]);
const popupProxyRef = ref(null);
const upcomingOptions = ref(null);
const campaignChange = ({ name }) => {
const campaign = campaignsOptions.value.find((c) => c.code === name);
handleDates(campaign);
};
const handleDates = (campaign) => {
const from = new Date(campaign.dated);
from.setDate(from.getDate() - campaign.scopeDays);
campaignParams.value = {
code: campaign.code,
from: from,
to: campaign.dated,
};
};
watch(selectedRows, () => {
handleDates(upcomingOptions.value);
});
const onSubmit = async () => {
try {
const data = {
clients: $props.clients.map((item) => item.id),
from: campaignParams.value.from,
to: campaignParams.value.to,
};
const params = JSON.stringify(data);
await axios.post('ClientConsumptionQueues', { params });
notify('globals.dataSaved', 'positive');
popupProxyRef.value.hide();
} catch (error) {
notify(error.message, 'negative');
}
};
onMounted(async () => {
const { models } = validationsStore;
const properties = models.Item?.properties || {};
const _moreFields = ['valentinesDay', 'mothersDay', 'allSaints'];
_moreFields.forEach((field) => {
let prop = properties[field];
const label = t(`params.${field}`);
moreFields.value.push({
name: field,
label,
type: prop ? prop.type : null,
});
});
});
</script>
<template>
<FetchData
url="Campaigns/latest"
@on-fetch="(data) => (campaignsOptions = data)"
:filter="{ fields: ['id', 'code', 'dated'], order: 'code ASC', limit: 30 }"
auto-load
/>
<FetchData
url="Campaigns/upcoming"
@on-fetch="(data) => (upcomingOptions = data)"
auto-load
/>
<QBtn color="primary" icon="show_chart" :disable="!selectedRows">
<QPopupProxy ref="popupProxyRef">
<QCard class="column q-pa-md">
<span class="text-body1 q-mb-sm">{{ t('Campaign consumption') }}</span>
<VnRow class="row q-gutter-md q-mb-md">
<VnSelect
:options="moreFields"
option-value="code"
option-label="label"
v-model="campaignParams.code"
:label="t('Campaign')"
@update:model-value="campaignChange"
/>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<VnInputDate v-model="campaignParams.from" :label="t('From')" />
<VnInputDate v-model="campaignParams.to" :label="t('To')" />
</VnRow>
<div class="q-mt-lg row justify-end">
<QBtn
:label="t('globals.cancel')"
color="primary"
flat
class="q-mr-md"
v-close-popup
/>
<QBtn
:label="t('globals.save')"
type="submit"
color="primary"
@click="onSubmit()"
/>
</div>
</QCard>
</QPopupProxy>
<QTooltip>{{ t('Campaign consumption') }}</QTooltip>
</QBtn>
</template>
<i18n>
en:
params:
valentinesDay: Valentine's Day
mothersDay: Mother's Day
allSaints: All Saints' Day
es:
params:
valentinesDay: Día de San Valentín
mothersDay: Día de la Madre
allSaints: Día de Todos los Santos
Campaign consumption: Consumo campaña
Campaign: Campaña
From: Desde
To: Hasta
</i18n>

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

@ -110,13 +110,7 @@ function stateColor(row) {
</div> </div>
</Teleport> </Teleport>
</template> </template>
<QDrawer <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
v-model="stateStore.rightDrawer"
side="right"
:width="256"
show-if-above
:breakpoint="1600"
>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<CustomerPaymentsFilter data-key="CustomerTransactions" /> <CustomerPaymentsFilter data-key="CustomerTransactions" />
</QScrollArea> </QScrollArea>

1
src/pages/Customer/components/CustomerAddressCreate.vue
View File

@ -11,7 +11,6 @@ import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue'; import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
import CustomerCreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
import CustomerNewCustomsAgent from 'src/pages/Customer/components/CustomerNewCustomsAgent.vue'; import CustomerNewCustomsAgent from 'src/pages/Customer/components/CustomerNewCustomsAgent.vue';
const { t } = useI18n(); const { t } = useI18n();

1
src/pages/Customer/components/CustomerAddressEdit.vue
View File

@ -11,7 +11,6 @@ import VnRow from 'components/ui/VnRow.vue';
import VnInput from 'src/components/common/VnInput.vue'; import VnInput from 'src/components/common/VnInput.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import VnSelectDialog from 'src/components/common/VnSelectDialog.vue'; import VnSelectDialog from 'src/components/common/VnSelectDialog.vue';
import CustomerCreateNewPostcode from 'src/components/CreateNewPostcodeForm.vue';
import CustomsNewCustomsAgent from 'src/pages/Customer/components/CustomerNewCustomsAgent.vue'; import CustomsNewCustomsAgent from 'src/pages/Customer/components/CustomerNewCustomsAgent.vue';
const { t } = useI18n(); const { t } = useI18n();

40
src/pages/Customer/components/CustomerGreugeCreate.vue
View File

@ -56,33 +56,25 @@ const toCustomerGreuges = () => {
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Amount')"
:label="t('Amount')" clearable
clearable type="number"
type="number" v-model="data.amount"
v-model="data.amount" />
/> <VnInputDate :label="t('Date')" v-model="data.shipped" />
</div>
<div class="col">
<VnInputDate :label="t('Date')" v-model="data.shipped" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput :label="t('Comment')" clearable v-model="data.description" />
<VnInput :label="t('Comment')" clearable v-model="data.description" /> <VnSelect
</div> :label="t('Type')"
<div class="col"> :options="greugeTypes"
<VnSelect hide-selected
:label="t('Type')" option-label="name"
:options="greugeTypes" option-value="id"
hide-selected v-model="data.greugeTypeFk"
option-label="name" />
option-value="id"
v-model="data.greugeTypeFk"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

37
src/pages/Customer/components/CustomerNewCustomsAgent.vue
View File

@ -1,5 +1,4 @@
<script setup> <script setup>
import { reactive } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import VnRow from 'components/ui/VnRow.vue'; import VnRow from 'components/ui/VnRow.vue';
@ -24,30 +23,22 @@ const onDataSaved = (dataSaved) => {
> >
<template #form-inputs="{ data }"> <template #form-inputs="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('NIF')"
:label="t('NIF')" :required="true"
:required="true" clearable
clearable v-model="data.nif"
v-model="data.nif" />
/> <VnInput
</div> :label="t('Fiscal name')"
<div class="col"> :required="true"
<VnInput clearable
:label="t('Fiscal name')" v-model="data.fiscalName"
:required="true" />
clearable
v-model="data.fiscalName"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput :label="t('Street')" clearable v-model="data.street" />
<VnInput :label="t('Street')" clearable v-model="data.street" /> <VnInput :label="t('Phone')" clearable v-model="data.phone" />
</div>
<div class="col">
<VnInput :label="t('Phone')" clearable v-model="data.phone" />
</div>
</VnRow> </VnRow>
</template> </template>
</FormModelPopup> </FormModelPopup>

148
src/pages/Customer/components/CustomerNewPayment.vue
View File

@ -135,60 +135,52 @@ const onDataSaved = async () => {
<h5 class="q-mt-none">{{ t('New payment') }}</h5> <h5 class="q-mt-none">{{ t('New payment') }}</h5>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInputDate
<VnInputDate :label="t('Date')"
:label="t('Date')" :required="true"
:required="true" v-model="data.payed"
v-model="data.payed" />
/> <VnSelect
</div> :label="t('Company')"
<div class="col"> :options="companyOptions"
<VnSelect :required="true"
:label="t('Company')" :rules="validate('entry.companyFk')"
:options="companyOptions" hide-selected
:required="true" option-label="code"
:rules="validate('entry.companyFk')" option-value="id"
hide-selected v-model="data.companyFk"
option-label="code" />
option-value="id"
v-model="data.companyFk"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Bank')"
:label="t('Bank')" :options="bankOptions"
:options="bankOptions" :required="true"
:required="true" @update:model-value="setPaymentType($event)"
@update:model-value="setPaymentType($event)" hide-selected
hide-selected option-label="bank"
option-label="bank" option-value="id"
option-value="id" v-model="data.bankFk"
v-model="data.bankFk" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>
<QItemLabel> {{ scope.opt.id }}:&ensp;{{ scope.opt.bank }}
{{ scope.opt.id }}:&ensp;{{ scope.opt.bank }} </QItemLabel>
</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect> <VnInput
</div> :label="t('Amount')"
<div class="col"> :required="true"
<VnInput @update:model-value="calculateFromAmount($event)"
:label="t('Amount')" clearable
:required="true" type="number"
@update:model-value="calculateFromAmount($event)" v-model.number="data.amountPaid"
clearable />
type="number"
v-model.number="data.amountPaid"
/>
</div>
</VnRow> </VnRow>
<div class="text-h6" v-if="data.bankFk === 3 || data.bankFk === 3117"> <div class="text-h6" v-if="data.bankFk === 3 || data.bankFk === 3117">
@ -203,47 +195,37 @@ const onDataSaved = async () => {
v-model="data.compensationAccount" v-model="data.compensationAccount"
/> />
</div> </div>
<div class="col"> <VnInput
<VnInput :label="t('Reference')"
:label="t('Reference')" :required="true"
:required="true" clearable
clearable v-model="data.description"
v-model="data.description" />
/>
</div>
</VnRow> </VnRow>
<div class="q-mt-lg" v-if="data.bankFk === 2"> <div class="q-mt-lg" v-if="data.bankFk === 2">
<div class="text-h6">{{ t('Cash') }}</div> <div class="text-h6">{{ t('Cash') }}</div>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Delivered amount')"
:label="t('Delivered amount')" @update:model-value="calculateFromDeliveredAmount($event)"
@update:model-value="calculateFromDeliveredAmount($event)" clearable
clearable type="number"
type="number" v-model="deliveredAmount"
v-model="deliveredAmount" />
/> <VnInput
</div> :label="t('Amount to return')"
<div class="col"> clearable
<VnInput disable
:label="t('Amount to return')" type="number"
clearable v-model="amountToReturn"
disable />
type="number"
v-model="amountToReturn"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox v-model="viewRecipt" />
<QCheckbox v-model="viewRecipt" /> <QCheckbox v-model="sendEmail" />
</div>
<div class="col">
<QCheckbox v-model="sendEmail" />
</div>
</VnRow> </VnRow>
</div> </div>

4
src/pages/Customer/components/CustomerNoteCreate.vue
View File

@ -45,9 +45,7 @@ const toCustomerNotes = () => {
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput :label="t('Note')" type="textarea" v-model="data.text" />
<QInput :label="t('Note')" type="textarea" v-model="data.text" />
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

36
src/pages/Customer/components/CustomerRecoverieCreate.vue
View File

@ -50,31 +50,23 @@ const toCustomerRecoveries = () => {
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInputDate :label="t('Since')" v-model="data.started" />
<VnInputDate :label="t('Since')" v-model="data.started" /> <VnInputDate :label="t('To')" v-model="data.finished" />
</div>
<div class="col">
<VnInputDate :label="t('To')" v-model="data.finished" />
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('Amount')"
:label="t('Amount')" clearable
clearable type="number"
type="number" v-model="data.amount"
v-model="data.amount" />
/> <VnInput
</div> :label="t('Period')"
<div class="col"> clearable
<VnInput type="number"
:label="t('Period')" v-model="data.period"
clearable />
type="number"
v-model="data.period"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

156
src/pages/Department/Card/DepartmentBasicData.vue
View File

@ -30,105 +30,83 @@ const clientsOptions = ref([]);
> >
<template #form="{ data, validate }"> <template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('department.name')"
:label="t('department.name')" v-model="data.name"
v-model="data.name" :rules="validate('department.name')"
:rules="validate('department.name')" clearable
clearable autofocus
autofocus />
/> <VnInput
</div> v-model="data.code"
<div class="col"> :label="t('department.code')"
<VnInput :rules="validate('department.code')"
v-model="data.code" clearable
:label="t('department.code')" />
:rules="validate('department.code')"
clearable
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('department.chat')"
:label="t('department.chat')" v-model="data.chatName"
v-model="data.chatName" :rules="validate('department.chat')"
:rules="validate('department.chat')" clearable
clearable />
/> <VnInput
</div> v-model="data.notificationEmail"
<div class="col"> :label="t('department.email')"
<VnInput :rules="validate('department.email')"
v-model="data.notificationEmail" clearable
:label="t('department.email')" />
:rules="validate('department.email')"
clearable
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('department.bossDepartment')"
:label="t('department.bossDepartment')" v-model="data.workerFk"
v-model="data.workerFk" :options="workersOptions"
:options="workersOptions" option-value="id"
option-value="id" option-label="name"
option-label="name" hide-selected
hide-selected map-options
map-options :rules="validate('department.workerFk')"
:rules="validate('department.workerFk')" />
/> <VnSelect
</div> :label="t('department.selfConsumptionCustomer')"
<div class="col"> v-model="data.clientFk"
<VnSelect :options="clientsOptions"
:label="t('department.selfConsumptionCustomer')" option-value="id"
v-model="data.clientFk" option-label="name"
:options="clientsOptions" hide-selected
option-value="id" map-options
option-label="name" :rules="validate('department.clientFk')"
hide-selected />
map-options
:rules="validate('department.clientFk')"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox
<QCheckbox :label="t('department.telework')"
:label="t('department.telework')" v-model="data.isTeleworking"
v-model="data.isTeleworking" />
/> <QCheckbox
</div> :label="t('department.notifyOnErrors')"
<div class="col"> v-model="data.hasToMistake"
<QCheckbox :false-value="0"
:label="t('department.notifyOnErrors')" :true-value="1"
v-model="data.hasToMistake" />
:false-value="0"
:true-value="1"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox
<QCheckbox :label="t('department.worksInProduction')"
:label="t('department.worksInProduction')" v-model="data.isProduction"
v-model="data.isProduction" />
/> <QCheckbox
</div> :label="t('department.hasToRefill')"
<div class="col"> v-model="data.hasToRefill"
<QCheckbox />
:label="t('department.hasToRefill')"
v-model="data.hasToRefill"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox
<QCheckbox :label="t('department.hasToSendMail')"
:label="t('department.hasToSendMail')" v-model="data.hasToSendMail"
v-model="data.hasToSendMail" />
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

47
src/pages/Department/Card/DepartmentDescriptor.vue
View File

@ -3,7 +3,7 @@ import { computed, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router'; import { useRoute, useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { useVnConfirm } from 'composables/useVnConfirm';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import CardDescriptor from 'src/components/ui/CardDescriptor.vue'; import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
import useCardDescription from 'src/composables/useCardDescription'; import useCardDescription from 'src/composables/useCardDescription';
@ -43,30 +43,17 @@ const setData = (entity) => {
data.value = useCardDescription(entity.name, entity.id); data.value = useCardDescription(entity.name, entity.id);
}; };
const removeDepartment = () => { const removeDepartment = async () => {
quasar try {
.dialog({ await axios.post(`/Departments/${entityId.value}/removeChild`, entityId.value);
title: 'Are you sure you want to delete it?', router.push({ name: 'WorkerDepartment' });
message: 'Delete department', notify('department.departmentRemoved', 'positive');
ok: { } catch (err) {
push: true, console.error('Error removing department');
color: 'primary', }
},
cancel: true,
})
.onOk(async () => {
try {
await axios.post(
`/Departments/${entityId.value}/removeChild`,
entityId.value
);
router.push({ name: 'WorkerDepartment' });
notify('department.departmentRemoved', 'positive');
} catch (err) {
console.error('Error removing department');
}
});
}; };
const { openConfirmationModal } = useVnConfirm();
</script> </script>
<template> <template>
<CardDescriptor <CardDescriptor
@ -84,7 +71,17 @@ const removeDepartment = () => {
" "
> >
<template #menu="{}"> <template #menu="{}">
<QItem v-ripple clickable @click="removeDepartment()"> <QItem
v-ripple
clickable
@click="
openConfirmationModal(
t('Are you sure you want to delete it?'),
t('Delete department'),
removeDepartment
)
"
>
<QItemSection>{{ t('Delete') }}</QItemSection> <QItemSection>{{ t('Delete') }}</QItemSection>
</QItem> </QItem>
</template> </template>

246
src/pages/Entry/Card/EntryBasicData.vue
View File

@ -68,152 +68,126 @@ const onFilterTravelSelected = (formData, id) => {
> >
<template #form="{ data }"> <template #form="{ data }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('entry.basicData.supplier')"
:label="t('entry.basicData.supplier')" v-model="data.supplierFk"
v-model="data.supplierFk" :options="suppliersOptions"
:options="suppliersOptions" option-value="id"
option-value="id" option-label="nickname"
option-label="nickname" hide-selected
hide-selected :required="true"
:required="true" map-options
map-options >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>{{ scope.opt?.name }}</QItemLabel>
<QItemLabel>{{ scope.opt?.name }}</QItemLabel> <QItemLabel caption>
<QItemLabel caption> {{ scope.opt?.nickname }}, {{ scope.opt?.id }}
{{ scope.opt?.nickname }}, {{ scope.opt?.id }} </QItemLabel>
</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect> <VnSelectDialog
</div> :label="t('entry.basicData.travel')"
<div class="col"> v-model="data.travelFk"
<VnSelectDialog :options="travelsOptions"
:label="t('entry.basicData.travel')" option-value="id"
v-model="data.travelFk" option-label="warehouseInName"
:options="travelsOptions" map-options
option-value="id" hide-selected
option-label="warehouseInName" :required="true"
map-options action-icon="filter_alt"
hide-selected >
:required="true" <template #form>
action-icon="filter_alt" <FilterTravelForm
> @travel-selected="onFilterTravelSelected(data, $event)"
<template #form> />
<FilterTravelForm </template>
@travel-selected="onFilterTravelSelected(data, $event)" <template #option="scope">
/> <QItem v-bind="scope.itemProps">
</template> <QItemSection>
<template #option="scope"> <QItemLabel
<QItem v-bind="scope.itemProps"> >{{ scope.opt?.agencyModeName }} -
<QItemSection> {{ scope.opt?.warehouseInName }} ({{
<QItemLabel toDate(scope.opt?.shipped)
>{{ scope.opt?.agencyModeName }} - }}) &#x2192; {{ scope.opt?.warehouseOutName }} ({{
{{ scope.opt?.warehouseInName }} ({{ toDate(scope.opt?.landed)
toDate(scope.opt?.shipped) }})</QItemLabel
}}) &#x2192; {{ scope.opt?.warehouseOutName }} ({{ >
toDate(scope.opt?.landed) </QItemSection>
}})</QItemLabel </QItem>
> </template>
</QItemSection> </VnSelectDialog>
</QItem>
</template>
</VnSelectDialog>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput v-model="data.reference"
v-model="data.reference" :label="t('entry.basicData.reference')"
:label="t('entry.basicData.reference')" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput v-model="data.invoiceNumber"
v-model="data.invoiceNumber" :label="t('entry.basicData.invoiceNumber')"
:label="t('entry.basicData.invoiceNumber')" />
/> <VnSelect
</div> :label="t('entry.basicData.company')"
<div class="col"> v-model="data.companyFk"
<VnSelect :options="companiesOptions"
:label="t('entry.basicData.company')" option-value="id"
v-model="data.companyFk" option-label="code"
:options="companiesOptions" map-options
option-value="id" hide-selected
option-label="code" :required="true"
map-options />
hide-selected
:required="true"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('entry.basicData.currency')"
:label="t('entry.basicData.currency')" v-model="data.currencyFk"
v-model="data.currencyFk" :options="currenciesOptions"
:options="currenciesOptions" option-value="id"
option-value="id" option-label="code"
option-label="code" />
/> <QInput
</div> :label="t('entry.basicData.commission')"
<div class="col"> v-model="data.commission"
<QInput type="number"
:label="t('entry.basicData.commission')" autofocus
v-model="data.commission" min="0"
type="number" />
autofocus
min="0"
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QInput
<QInput :label="t('entry.basicData.observation')"
:label="t('entry.basicData.observation')" type="textarea"
type="textarea" v-model="data.observation"
v-model="data.observation" :maxlength="45"
:maxlength="45" counter
counter fill-input
fill-input />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QCheckbox
<QCheckbox v-model="data.isOrdered"
v-model="data.isOrdered" :label="t('entry.basicData.ordered')"
:label="t('entry.basicData.ordered')" />
/> <QCheckbox
</div> v-model="data.isConfirmed"
<div class="col"> :label="t('entry.basicData.confirmed')"
<QCheckbox />
v-model="data.isConfirmed" <QCheckbox
:label="t('entry.basicData.confirmed')" v-model="data.isExcludedFromAvailable"
/> :label="t('entry.basicData.excludedFromAvailable')"
</div> />
<div class="col"> <QCheckbox v-model="data.isRaid" :label="t('entry.basicData.raid')" />
<QCheckbox <QCheckbox
v-model="data.isExcludedFromAvailable" v-if="isAdministrative()"
:label="t('entry.basicData.excludedFromAvailable')" v-model="data.isBooked"
/> :label="t('entry.basicData.booked')"
</div> />
<div class="col">
<QCheckbox v-model="data.isRaid" :label="t('entry.basicData.raid')" />
</div>
<div class="col">
<QCheckbox
v-if="isAdministrative()"
v-model="data.isBooked"
:label="t('entry.basicData.booked')"
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

2
src/pages/Entry/Card/EntryBuys.vue
View File

@ -410,7 +410,7 @@ const lockIconType = (groupingMode, mode) => {
<span v-if="props.row.item.subName" class="subName"> <span v-if="props.row.item.subName" class="subName">
{{ props.row.item.subName }} {{ props.row.item.subName }}
</span> </span>
<fetched-tags :item="props.row.item" :max-length="5" /> <FetchedTags :item="props.row.item" :max-length="5" />
</QTd> </QTd>
</QTr> </QTr>
<!-- Esta última row es utilizada para agregar un espaciado y así marcar una diferencia visual entre los diferentes buys --> <!-- Esta última row es utilizada para agregar un espaciado y así marcar una diferencia visual entre los diferentes buys -->

60
src/pages/Entry/Card/EntryBuysImport.vue
View File

@ -198,44 +198,38 @@ const redirectToBuysView = () => {
</Teleport> </Teleport>
<QCard class="q-pa-lg"> <QCard class="q-pa-lg">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <QFile
<QFile ref="inputFileRef"
ref="inputFileRef" :label="t('entry.buys.file')"
:label="t('entry.buys.file')" v-model="importData.file"
v-model="importData.file" :multiple="false"
:multiple="false" accept=".json"
accept=".json" @update:model-value="onFileChange($event)"
@update:model-value="onFileChange($event)" class="required"
class="required" >
> <template #append>
<template #append> <QIcon
<QIcon name="vn:attach"
name="vn:attach" class="cursor-pointer"
class="cursor-pointer" @click="inputFileRef.pickFiles()"
@click="inputFileRef.pickFiles()" >
> <QTooltip>{{ t('globals.selectFile') }}</QTooltip>
<QTooltip>{{ t('globals.selectFile') }}</QTooltip> </QIcon>
</QIcon> </template>
</template> </QFile>
</QFile>
</div>
</VnRow> </VnRow>
<div v-if="importData.file"> <div v-if="importData.file">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('entry.buys.reference')"
:label="t('entry.buys.reference')" v-model="importData.ref"
v-model="importData.ref" />
/>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnInput
<VnInput :label="t('entry.buys.observations')"
:label="t('entry.buys.observations')" v-model="importData.observation"
v-model="importData.observation" />
/>
</div>
</VnRow> </VnRow>
<VnRow> <VnRow>
<QTable :columns="columns" :rows="importData.buys"> <QTable :columns="columns" :rows="importData.buys">

6
src/pages/Entry/Card/EntryCard.vue
View File

@ -1,14 +1,16 @@
<script setup> <script setup>
import VnCard from 'components/common/VnCard.vue'; import VnCard from 'components/common/VnCard.vue';
import EntryDescriptor from './EntryDescriptor.vue'; import EntryDescriptor from './EntryDescriptor.vue';
import EntryFilter from '../EntryFilter.vue';
</script> </script>
<template> <template>
<VnCard <VnCard
data-key="Entry" data-key="Entry"
base-url="Entries" base-url="Entries"
:descriptor="EntryDescriptor" :descriptor="EntryDescriptor"
searchbar-data-key="EntryList" :filter-panel="EntryFilter"
searchbar-url="Entries/filter" search-data-key="EntryList"
search-url="Entries/filter"
searchbar-label="Search entries" searchbar-label="Search entries"
searchbar-info="You can search by entry reference" searchbar-info="You can search by entry reference"
/> />

3
src/pages/Entry/Card/EntrySummary.vue
View File

@ -6,7 +6,6 @@ import { useI18n } from 'vue-i18n';
import CardSummary from 'components/ui/CardSummary.vue'; import CardSummary from 'components/ui/CardSummary.vue';
import VnLv from 'src/components/ui/VnLv.vue'; import VnLv from 'src/components/ui/VnLv.vue';
import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue'; import TravelDescriptorProxy from 'src/pages/Travel/Card/TravelDescriptorProxy.vue';
import VnTitle from 'src/components/common/VnTitle.vue';
import { toDate, toCurrency } from 'src/filters'; import { toDate, toCurrency } from 'src/filters';
import { getUrl } from 'src/composables/getUrl'; import { getUrl } from 'src/composables/getUrl';
@ -339,7 +338,7 @@ const fetchEntryBuys = async () => {
<span v-if="row.item.subName" class="subName"> <span v-if="row.item.subName" class="subName">
{{ row.item.subName }} {{ row.item.subName }}
</span> </span>
<fetched-tags :item="row.item" :max-length="5" /> <FetchedTags :item="row.item" :max-length="5" />
</QTd> </QTd>
</QTr> </QTr>
<!-- Esta última row es utilizada para agregar un espaciado y así marcar una diferencia visual entre los diferentes buys --> <!-- Esta última row es utilizada para agregar un espaciado y así marcar una diferencia visual entre los diferentes buys -->

129
src/pages/Entry/EntryCreate.vue
View File

@ -79,78 +79,71 @@ const redirectToEntryBasicData = (_, { id }) => {
> >
<template #form="{ data, validate }"> <template #form="{ data, validate }">
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Supplier')"
:label="t('Supplier')" class="full-width"
class="full-width" v-model="data.supplierFk"
v-model="data.supplierFk" :options="suppliersOptions"
:options="suppliersOptions" option-value="id"
option-value="id" option-label="nickname"
option-label="nickname" hide-selected
hide-selected :required="true"
:required="true" :rules="validate('entry.supplierFk')"
:rules="validate('entry.supplierFk')" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>{{ scope.opt?.nickname }}</QItemLabel>
<QItemLabel>{{ scope.opt?.nickname }}</QItemLabel> <QItemLabel caption>
<QItemLabel caption> #{{ scope.opt?.id }}
#{{ scope.opt?.id }} </QItemLabel>
</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Travel')"
:label="t('Travel')" class="full-width"
class="full-width" v-model="data.travelFk"
v-model="data.travelFk" :options="travelsOptions"
:options="travelsOptions" option-value="id"
option-value="id" option-label="warehouseInName"
option-label="warehouseInName" map-options
map-options hide-selected
hide-selected :required="true"
:required="true" :rules="validate('entry.travelFk')"
:rules="validate('entry.travelFk')" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel
<QItemLabel >{{ scope.opt?.agencyModeName }} -
>{{ scope.opt?.agencyModeName }} - {{ scope.opt?.warehouseInName }} ({{
{{ scope.opt?.warehouseInName }} ({{ toDate(scope.opt?.shipped)
toDate(scope.opt?.shipped) }}) &#x2192; {{ scope.opt?.warehouseOutName }} ({{
}}) &#x2192; toDate(scope.opt?.landed)
{{ scope.opt?.warehouseOutName }} ({{ }})</QItemLabel
toDate(scope.opt?.landed) >
}})</QItemLabel </QItemSection>
> </QItem>
</QItemSection> </template>
</QItem> </VnSelect>
</template>
</VnSelect>
</div>
</VnRow> </VnRow>
<VnRow class="row q-gutter-md q-mb-md"> <VnRow class="row q-gutter-md q-mb-md">
<div class="col"> <VnSelect
<VnSelect :label="t('Company')"
:label="t('Company')" class="full-width"
class="full-width" v-model="data.companyFk"
v-model="data.companyFk" :options="companiesOptions"
:options="companiesOptions" option-value="id"
option-value="id" option-label="code"
option-label="code" map-options
map-options hide-selected
hide-selected :required="true"
:required="true" :rules="validate('entry.companyFk')"
:rules="validate('entry.companyFk')" />
/>
</div>
</VnRow> </VnRow>
</template> </template>
</FormModel> </FormModel>

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

@ -12,6 +12,7 @@ import VnInput from 'src/components/common/VnInput.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import EntryLatestBuysFilter from './EntryLatestBuysFilter.vue'; import EntryLatestBuysFilter from './EntryLatestBuysFilter.vue';
import ItemDescriptorProxy from '../Item/Card/ItemDescriptorProxy.vue'; import ItemDescriptorProxy from '../Item/Card/ItemDescriptorProxy.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useStateStore } from 'stores/useStateStore'; import { useStateStore } from 'stores/useStateStore';
import { toDate, toCurrency } from 'src/filters'; import { toDate, toCurrency } from 'src/filters';
@ -636,18 +637,18 @@ onUnmounted(() => (stateStore.rightDrawer = false));
auto-load auto-load
@on-fetch="(data) => (intrastatOptions = data)" @on-fetch="(data) => (intrastatOptions = data)"
/> />
<QToolbar class="justify-end"> <VnSubToolbar>
<div id="st-data"> <template #st-data>
<TableVisibleColumns <TableVisibleColumns
:all-columns="allColumnNames" :all-columns="allColumnNames"
table-code="latestBuys" table-code="latestBuys"
labels-traductions-path="entry.latestBuys" labels-traductions-path="entry.latestBuys"
@on-config-saved="visibleColumns = ['picture', ...$event]" @on-config-saved="visibleColumns = ['picture', ...$event]"
/> />
</div> </template>
<QSpace /> <QSpace />
<div id="st-actions"></div> <div id="st-actions"></div>
</QToolbar> </VnSubToolbar>
<QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above> <QDrawer v-model="stateStore.rightDrawer" side="right" :width="256" show-if-above>
<QScrollArea class="fit text-grey-8"> <QScrollArea class="fit text-grey-8">
<EntryLatestBuysFilter data-key="EntryLatestBuys" /> <EntryLatestBuysFilter data-key="EntryLatestBuys" />
@ -706,7 +707,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
</template> </template>
<template #body-cell-tags="{ row }"> <template #body-cell-tags="{ row }">
<QTd> <QTd>
<fetched-tags :item="row" :max-length="6" /> <FetchedTags :item="row" :max-length="6" />
</QTd> </QTd>
</template> </template>
<template #body-cell-entryFk="{ row }"> <template #body-cell-entryFk="{ row }">

444
src/pages/InvoiceIn/Card/InvoiceInBasicData.vue
View File

@ -3,25 +3,27 @@ import { ref, computed } from 'vue';
import { useRoute } from 'vue-router'; import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import axios from 'axios';
import { useArrayData } from 'src/composables/useArrayData'; import { useArrayData } from 'src/composables/useArrayData';
import { downloadFile } from 'src/composables/downloadFile'; import { downloadFile } from 'src/composables/downloadFile';
import FormModel from 'components/FormModel.vue'; import FormModel from 'components/FormModel.vue';
import VnSelect from 'src/components/common/VnSelect.vue'; import VnSelect from 'src/components/common/VnSelect.vue';
import FetchData from 'src/components/FetchData.vue'; import FetchData from 'src/components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue';
import axios from 'axios'; import VnInputDate from 'src/components/common/VnInputDate.vue';
import VnInput from 'src/components/common/VnInput.vue';
const quasar = useQuasar(); const quasar = useQuasar();
const route = useRoute();
const { t } = useI18n(); const { t } = useI18n();
const dms = ref({}); const dms = ref({});
const route = useRoute();
const editDownloadDisabled = ref(false); const editDownloadDisabled = ref(false);
const arrayData = useArrayData('InvoiceIn'); const invoiceIn = computed(() => useArrayData(route.meta.moduleName).store.data);
const invoiceIn = computed(() => arrayData.store.data);
const userConfig = ref(null); const userConfig = ref(null);
const invoiceId = computed(() => +route.params.id);
const expenses = ref([]);
const currencies = ref([]); const currencies = ref([]);
const currenciesRef = ref(); const currenciesRef = ref();
const companies = ref([]); const companies = ref([]);
@ -32,14 +34,11 @@ const warehouses = ref([]);
const warehousesRef = ref(); const warehousesRef = ref();
const allowTypesRef = ref(); const allowTypesRef = ref();
const allowedContentTypes = ref([]); const allowedContentTypes = ref([]);
const sageWithholdings = ref([]);
const inputFileRef = ref(); const inputFileRef = ref();
const editDmsRef = ref(); const editDmsRef = ref();
const createDmsRef = ref(); const createDmsRef = ref();
const requiredFieldRule = (val) => val || t('globals.requiredField');
const dateMask = '####-##-##';
const fillMask = '_';
async function checkFileExists(dmsId) { async function checkFileExists(dmsId) {
if (!dmsId) return; if (!dmsId) return;
try { try {
@ -174,261 +173,148 @@ async function upsert() {
@on-fetch="(data) => (userConfig = data)" @on-fetch="(data) => (userConfig = data)"
auto-load auto-load
/> />
<FetchData url="Expenses" auto-load @on-fetch="(data) => (expenses = data)" />
<FetchData
url="SageWithholdings"
auto-load
@on-fetch="(data) => (sageWithholdings = data)"
/>
<FormModel <FormModel
v-if="invoiceIn" model="InvoiceIn"
:url="`InvoiceIns/${route.params.id}`" :go-to="`/invoice-in/${invoiceId}/vat`"
model="invoiceIn" auto-load
:auto-load="true" :url-update="`InvoiceIns/${invoiceId}/updateInvoiceIn`"
> >
<template #form="{ data }"> <template #form="{ data }">
<div class="row q-gutter-md q-mb-md"> <VnRow>
<div class="col"> <VnSelect
<VnSelect :label="t('supplierFk')"
:label="t('supplierFk')" v-model="data.supplierFk"
v-model="data.supplierFk" option-value="id"
option-value="id" option-label="nickname"
option-label="nickname" url="Suppliers"
url="Suppliers" :fields="['id', 'nickname']"
:fields="['id', 'nickname']" sort-by="nickname"
sort-by="nickname" :is-clearable="false"
:is-clearable="false" >
> <template #option="scope">
<template #option="scope"> <QItem v-bind="scope.itemProps">
<QItem v-bind="scope.itemProps"> <QItemSection>
<QItemSection> <QItemLabel>{{
<QItemLabel>{{ `${scope.opt.id} - ${scope.opt.nickname}`
`${scope.opt.id} - ${scope.opt.nickname}` }}</QItemLabel>
}}</QItemLabel> </QItemSection>
</QItemSection> </QItem>
</QItem> </template>
</template> </VnSelect>
</VnSelect> <VnInput
</div> clearable
<div class="col"> clear-icon="close"
<QInput :label="t('Supplier ref')"
clearable v-model="data.supplierRef"
clear-icon="close" />
:label="t('Supplier ref')" </VnRow>
v-model="data.supplierRef" <VnRow>
/> <VnInputDate :label="t('Expedition date')" v-model="data.issued" />
</div> <VnInputDate
</div> :label="t('Operation date')"
<div class="row q-gutter-md q-mb-md"> v-model="data.operated"
<div class="col"> autofocus
<QInput />
:label="t('Expedition date')" </VnRow>
v-model="data.issued" <VnRow>
:mask="dateMask" <VnSelect
> :label="t('Undeductible VAT')"
<template #append> v-model="data.deductibleExpenseFk"
<QIcon :options="expenses"
name="event" option-value="id"
class="cursor-pointer" option-label="id"
:fill-mask="fillMask" :filter-options="['id', 'name']"
> >
<QPopupProxy <template #option="scope">
cover <QItem v-bind="scope.itemProps">
transition-show="scale" {{ `${scope.opt.id}: ${scope.opt.name}` }}
transition-hide="scale" </QItem>
> </template>
<QDate v-model="data.issued"> </VnSelect>
<div class="row items-center justify-end"> <VnInput
<QBtn :label="t('Document')"
v-close-popup v-model="data.dmsFk"
label="Close" clearable
color="primary" clear-icon="close"
flat @update:model-value="checkFileExists(data.dmsFk)"
/> >
</div> <template #prepend>
</QDate> <QBtn
</QPopupProxy> v-if="data.dmsFk"
</QIcon> :class="{
</template> 'no-pointer-events': editDownloadDisabled,
</QInput> }"
</div> :disable="editDownloadDisabled"
<div class="col"> icon="cloud_download"
<QInput :title="t('Download file')"
:label="t('Operation date')" padding="xs"
v-model="data.operated" round
:mask="dateMask" @click="downloadFile(data.dmsFk)"
:fill-mask="fillMask" />
autofocus </template>
> <template #append>
<template #append> <QBtn
<QIcon name="event" class="cursor-pointer"> :class="{
<QPopupProxy 'no-pointer-events': editDownloadDisabled,
cover }"
transition-show="scale" :disable="editDownloadDisabled"
transition-hide="scale" v-if="data.dmsFk"
> icon="edit"
<QDate v-model="data.operated" :mask="dateMask"> round
<div class="row items-center justify-end"> padding="xs"
<QBtn @click="setEditDms(data.dmsFk)"
v-close-popup >
label="Close" <QTooltip>{{ t('Edit document') }}</QTooltip>
color="primary" </QBtn>
flat <QBtn
/> v-else
</div> icon="add_circle"
</QDate> round
</QPopupProxy> padding="xs"
</QIcon> @click="setCreateDms()"
</template> >
</QInput> <QTooltip>{{ t('Create document') }}</QTooltip>
</div> </QBtn>
</div> </template>
<div class="row q-gutter-md q-mb-md"> </VnInput>
<div class="col"> </VnRow>
<QInput <VnRow>
:label="t('Undeductible VAT')" <VnInputDate :label="t('Entry date')" v-model="data.bookEntried" />
v-model="data.deductibleExpenseFk" <VnInputDate :label="t('Accounted date')" v-model="data.booked" />
clearable </VnRow>
clear-icon="close" <VnRow>
/> <VnSelect
</div> :label="t('Currency')"
<div class="col"> v-model="data.currencyFk"
<QInput :options="currencies"
:label="t('Document')" option-value="id"
v-model="data.dmsFk" option-label="code"
clearable />
clear-icon="close"
@update:model-value="checkFileExists(data.dmsFk)" <VnSelect
> v-if="companiesRef"
<template #prepend> :label="t('Company')"
<QBtn v-model="data.companyFk"
v-if="data.dmsFk" :options="companies"
:class="{ option-value="id"
'no-pointer-events': editDownloadDisabled, option-label="code"
}" />
:disable="editDownloadDisabled" </VnRow>
icon="cloud_download" <VnRow>
:title="t('Download file')" <VnSelect
padding="xs" :label="t('invoiceIn.summary.sage')"
round v-model="data.withholdingSageFk"
@click="downloadFile(data.dmsFk)" :options="sageWithholdings"
/> option-value="id"
</template> option-label="withholding"
<template #append> />
<QBtn </VnRow>
:class="{
'no-pointer-events': editDownloadDisabled,
}"
:disable="editDownloadDisabled"
v-if="data.dmsFk"
icon="edit"
round
padding="xs"
@click="setEditDms(data.dmsFk)"
>
<QTooltip>{{ t('Edit document') }}</QTooltip>
</QBtn>
<QBtn
v-else
icon="add_circle"
round
padding="xs"
@click="setCreateDms()"
>
<QTooltip>{{ t('Create document') }}</QTooltip>
</QBtn>
</template>
</QInput>
</div>
</div>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<QInput
:label="t('Entry date')"
v-model="data.bookEntried"
clearable
clear-icon="close"
:mask="dateMask"
:fill-mask="fillMask"
>
<template #append>
<QIcon name="event" class="cursor-pointer">
<QPopupProxy
cover
transition-show="scale"
transition-hide="scale"
>
<QDate v-model="data.bookEntried" :mask="dateMask">
<div class="row items-center justify-end">
<QBtn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</QDate>
</QPopupProxy>
</QIcon>
</template>
</QInput>
</div>
<div class="col">
<QInput
:label="t('Accounted date')"
v-model="data.booked"
clearable
clear-icon="close"
:mask="dateMask"
:fill-mask="fillMask"
>
<template #append>
<QIcon name="event" class="cursor-pointer">
<QPopupProxy
cover
transition-show="scale"
transition-hide="scale"
>
<QDate v-model="data.booked" :mask="maskDate">
<div class="row items-center justify-end">
<QBtn
v-close-popup
label="Close"
color="primary"
flat
/>
</div>
</QDate>
</QPopupProxy>
</QIcon>
</template>
</QInput>
</div>
</div>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelect
:label="t('Currency')"
v-model="data.currencyFk"
:options="currencies"
option-value="id"
option-label="code"
/>
</div>
<div class="col">
<VnSelect
v-if="companiesRef"
:label="t('Company')"
v-model="data.companyFk"
:options="companies"
option-value="id"
option-label="code"
/>
</div>
</div>
<div class="row q-gutter-md q-mb-md">
<div class="col">
<QCheckbox
:label="t('invoiceIn.summary.booked')"
v-model="data.isBooked"
/>
</div>
<div class="col"></div>
</div>
</template> </template>
</FormModel> </FormModel>
<QDialog ref="editDmsRef"> <QDialog ref="editDmsRef">
@ -444,7 +330,7 @@ async function upsert() {
</QCardSection> </QCardSection>
<QCardSection class="q-py-none"> <QCardSection class="q-py-none">
<QItem> <QItem>
<QInput <VnInput
class="full-width q-pa-xs" class="full-width q-pa-xs"
:label="t('Reference')" :label="t('Reference')"
v-model="dms.reference" v-model="dms.reference"
@ -453,45 +339,45 @@ async function upsert() {
/> />
<VnSelect <VnSelect
class="full-width q-pa-xs" class="full-width q-pa-xs"
:label="`${t('Company')}*`" :label="t('Company')"
v-model="dms.companyId" v-model="dms.companyId"
:options="companies" :options="companies"
option-value="id" option-value="id"
option-label="code" option-label="code"
:rules="[requiredFieldRule]" :required="true"
/> />
</QItem> </QItem>
<QItem> <QItem>
<VnSelect <VnSelect
class="full-width q-pa-xs" class="full-width q-pa-xs"
:label="`${t('Warehouse')}*`" :label="t('Warehouse')"
v-model="dms.warehouseId" v-model="dms.warehouseId"
:options="warehouses" :options="warehouses"
option-value="id" option-value="id"
option-label="name" option-label="name"
:rules="[requiredFieldRule]" :required="true"
/> />
<VnSelect <VnSelect
class="full-width q-pa-xs" class="full-width q-pa-xs"
:label="`${t('Type')}*`" :label="t('Type')"
v-model="dms.dmsTypeId" v-model="dms.dmsTypeId"
:options="dmsTypes" :options="dmsTypes"
option-value="id" option-value="id"
option-label="name" option-label="name"
:rules="[requiredFieldRule]" :required="true"
/> />
</QItem> </QItem>
<QItem> <QItem>
<QInput <VnInput
class="full-width q-pa-xs" :label="t('Description')"
v-model="dms.description"
:required="true"
type="textarea" type="textarea"
class="full-width q-pa-xs"
size="lg" size="lg"
autogrow autogrow
:label="`${t('Description')}*`"
v-model="dms.description"
clearable clearable
clear-icon="close" clear-icon="close"
:rules="[(val) => val.length || t('Required field')]"
/> />
</QItem> </QItem>
<QItem> <QItem>
@ -555,7 +441,7 @@ async function upsert() {
</QCardSection> </QCardSection>
<QCardSection class="q-pb-none"> <QCardSection class="q-pb-none">
<QItem> <QItem>
<QInput <VnInput
class="full-width q-pa-xs" class="full-width q-pa-xs"
:label="t('Reference')" :label="t('Reference')"
v-model="dms.reference" v-model="dms.reference"
@ -567,7 +453,7 @@ async function upsert() {
:options="companies" :options="companies"
option-value="id" option-value="id"
option-label="code" option-label="code"
:rules="[requiredFieldRule]" :required="true"
/> />
</QItem> </QItem>
<QItem> <QItem>
@ -578,7 +464,7 @@ async function upsert() {
:options="warehouses" :options="warehouses"
option-value="id" option-value="id"
option-label="name" option-label="name"
:rules="[requiredFieldRule]" :required="true"
/> />
<VnSelect <VnSelect
class="full-width q-pa-xs" class="full-width q-pa-xs"
@ -587,11 +473,11 @@ async function upsert() {
:options="dmsTypes" :options="dmsTypes"
option-value="id" option-value="id"
option-label="name" option-label="name"
:rules="[requiredFieldRule]" :required="true"
/> />
</QItem> </QItem>
<QItem> <QItem>
<QInput <VnInput
class="full-width q-pa-xs" class="full-width q-pa-xs"
type="textarea" type="textarea"
size="lg" size="lg"

Some files were not shown because too many files have changed in this diff Show More