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

Se implementan las correcciones a los comentarios
gitea/salix-front/pipeline/pr-dev There was a failure building this commit Details

This commit is contained in:
carlosfonseca 2024-03-25 16:00:47 -05:00
parent aa2db28eda
commit 627d3bbe85
5 changed files with 103 additions and 520 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/pages/Worker/Card/WorkerDms.vue
View File

@ -1,22 +1,27 @@
<script setup> <script setup>
import { computed, ref, watch } from 'vue'; import { computed, ref, watch } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router'; import { useRoute } from 'vue-router';
import { useQuasar } from 'quasar';
import { downloadFile } from 'src/composables/downloadFile'; import { downloadFile } from 'src/composables/downloadFile';
import { toDateHour } from 'src/filters'; import { toDateHour } from 'src/filters';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import WorkerDmsCreate from '../components/WorkerDmsCreate.vue';
import WorkerDmsActions from '../components/WorkerDmsActions.vue'; import WorkerDmsActions from '../components/WorkerDmsActions.vue';
const { t } = useI18n(); const { t } = useI18n();
const quasar = useQuasar();
const route = useRoute(); const route = useRoute();
const router = useRouter();
const workerDmsRef = ref(null); const findOne = ref([]);
const rows = ref([]); const rows = ref([]);
const workerDmsRef = ref(null);
const filter = { where: { worker: route.params.id }, order: ['dmsFk DESC'], limit: 20 }; const filter = { where: { worker: route.params.id }, order: ['dmsFk DESC'], limit: 20 };
const filterFindOne = { where: { code: 'hhrrData' } };
const columns = computed(() => [ const columns = computed(() => [
{ {
@ -82,8 +87,15 @@ const setData = () => {
workerDmsRef.value.fetch(); workerDmsRef.value.fetch();
}; };
const toWorkerDmsCreate = () => { const showWorkerDmsCreate = () => {
router.push({ name: 'WorkerDmsCreate' }); quasar.dialog({
component: WorkerDmsCreate,
componentProps: {
id: Number(route.params.id),
defaultDmsCode: findOne.value.code,
promise: setData,
},
});
}; };
</script> </script>
@ -95,6 +107,12 @@ const toWorkerDmsCreate = () => {
auto-load auto-load
:url="`WorkerDms/${route.params.id}/filter`" :url="`WorkerDms/${route.params.id}/filter`"
/> />
<fetch-data
:filter="filterFindOne"
@on-fetch="(data) => (findOne = data)"
auto-load
url="DmsTypes/findOne"
/>
<QPage class="column items-center q-pa-md"> <QPage class="column items-center q-pa-md">
<QTable <QTable
@ -107,7 +125,9 @@ const toWorkerDmsCreate = () => {
> >
<template #body-cell-order="{ row }"> <template #body-cell-order="{ row }">
<QTd> <QTd>
<QChip class="chip-color" square>{{ row.hardCopyNumber }}</QChip> <QChip class="chip-color" square v-if="row.hardCopyNumber">{{
row.hardCopyNumber
}}</QChip>
</QTd> </QTd>
</template> </template>
@ -138,7 +158,7 @@ const toWorkerDmsCreate = () => {
</QPage> </QPage>
<QPageSticky :offset="[18, 18]"> <QPageSticky :offset="[18, 18]">
<QBtn @click.stop="toWorkerDmsCreate()" color="primary" fab icon="add" /> <QBtn @click.stop="showWorkerDmsCreate" color="primary" fab icon="add" />
<QTooltip> <QTooltip>
{{ t('Upload file') }} {{ t('Upload file') }}
</QTooltip> </QTooltip>
@ -147,7 +167,7 @@ const toWorkerDmsCreate = () => {
<style scoped> <style scoped>
.chip-color { .chip-color {
background-color: var(--vn-label); background-color: var(--vn-label-color);
} }
</style> </style>

16
src/pages/Worker/components/WorkerDmsActions.vue
View File

@ -1,17 +1,15 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import { useQuasar } from 'quasar'; import { useQuasar } from 'quasar';
import { downloadFile } from 'src/composables/downloadFile'; import { downloadFile } from 'src/composables/downloadFile';
import WorkerDmsDelete from 'src/pages/Worker/components/WorkerDmsDelete.vue'; import WorkerDmsDelete from 'src/pages/Worker/components/WorkerDmsDelete.vue';
import WorkerDmsEdit from './WorkerDmsEdit.vue';
const { t } = useI18n(); const { t } = useI18n();
const quasar = useQuasar(); const quasar = useQuasar();
const route = useRoute();
const router = useRouter();
const $props = defineProps({ const $props = defineProps({
id: { id: {
@ -26,12 +24,12 @@ const $props = defineProps({
const setDownloadFile = () => downloadFile($props.id); const setDownloadFile = () => downloadFile($props.id);
const toWorkerDmsEdit = () => { const showWorkerDmsEdit = () => {
router.push({ quasar.dialog({
name: 'WorkerDmsEdit', component: WorkerDmsEdit,
params: { componentProps: {
id: route.params.id,
dmsId: $props.id, dmsId: $props.id,
promise: setData,
}, },
}); });
}; };
@ -64,7 +62,7 @@ const setData = () => {
</QTooltip> </QTooltip>
</QIcon> </QIcon>
<QIcon <QIcon
@click.stop="toWorkerDmsEdit" @click.stop="showWorkerDmsEdit"
class="q-ml-md" class="q-ml-md"
color="primary" color="primary"
name="edit" name="edit"

277
src/pages/Worker/components/WorkerDmsCreate.vue
View File

@ -1,262 +1,37 @@
<script setup> <script setup>
import { onBeforeMount, ref, watch } from 'vue'; import { useDialogPluginComponent } from 'quasar';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios'; import VnDms from 'src/components/common/VnDms.vue';
import { useState } from 'src/composables/useState'; const { dialogRef } = useDialogPluginComponent();
import { useValidator } from 'src/composables/useValidator';
import useNotify from 'src/composables/useNotify';
import FetchData from 'components/FetchData.vue'; const $props = defineProps({
import VnRow from 'components/ui/VnRow.vue'; id: {
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue'; type: Number,
import VnInput from 'src/components/common/VnInput.vue'; required: true,
},
const { notify } = useNotify(); defaultDmsCode: {
const { t } = useI18n(); type: String,
const { validate } = useValidator(); required: true,
const route = useRoute(); },
const router = useRouter(); promise: {
const state = useState(); type: Function,
const user = state.getUser(); required: true,
},
const filterFindOne = { where: { code: 'paymentsLaw' } };
const filterCompanies = { order: ['code'] };
const filterWarehouses = { order: ['name'] };
const inputFileRef = ref();
const client = ref({});
const findOne = ref([]);
const allowedContentTypes = ref([]);
const optionsCompanies = ref([]);
const optionsWarehouses = ref([]);
const optionsDmsTypes = ref([]);
const isLoading = ref(false);
const dms = ref({
hasFile: false,
}); });
onBeforeMount(() => { const onDataSaved = async () => {
const { companyFk, warehouseFk } = user.value; if ($props.promise) await $props.promise();
dms.value.reference = route.params.id;
dms.value.companyId = companyFk;
dms.value.warehouseId = warehouseFk;
});
watch([client, findOne], ([newClient, newFindOne]) => {
dms.value.description = t('clientFileDescription', {
dmsTypeName: newFindOne.name?.toUpperCase(),
clientName: newClient.name?.toUpperCase(),
clientId: newClient.id,
});
dms.value.dmsTypeId = newFindOne.id;
});
const saveData = async () => {
try {
const formData = new FormData();
const files = dms.value.files;
if (files && files.length > 0) {
for (let file of files) {
formData.append(file.name, file);
}
dms.value.hasFileAttached = true;
const url = `Workers/${route.params.id}/uploadFile`;
await axios.post(url, formData, {
params: dms.value,
});
notify('globals.dataSaved', 'positive');
toWorkerDms();
}
} catch (error) {
notify(error.message, 'negative');
}
};
const toWorkerDms = () => {
router.push({ name: 'WorkerDms' });
}; };
</script> </script>
<template> <template>
<fetch-data <QDialog ref="dialogRef">
@on-fetch="(data) => (client = data)" <VnDms
auto-load :default-dms-code="$props.defaultDmsCode"
:url="`Clients/${route.params.id}/getCard`" :url="`Workers/${$props.id}/uploadFile`"
/> @on-data-saved="onDataSaved"
<fetch-data model="WorkerDmsCreate"
:filter="filterFindOne" />
@on-fetch="(data) => (findOne = data)" </QDialog>
auto-load
url="DmsTypes/findOne"
/>
<fetch-data
@on-fetch="(data) => (allowedContentTypes = data)"
auto-load
url="DmsContainers/allowedContentTypes"
/>
<fetch-data
:filter="filterCompanies"
@on-fetch="(data) => (optionsCompanies = data)"
auto-load
url="Companies"
/>
<fetch-data
:filter="filterWarehouses"
@on-fetch="(data) => (optionsWarehouses = data)"
auto-load
url="Warehouses"
/>
<fetch-data
:filter="filterWarehouses"
@on-fetch="(data) => (optionsDmsTypes = data)"
auto-load
url="DmsTypes"
/>
<Teleport to="#st-actions">
<QBtnGroup push class="q-gutter-x-sm">
<QBtn
:disabled="isLoading"
:label="t('globals.cancel')"
:loading="isLoading"
@click="toWorkerDms"
color="primary"
flat
icon="close"
/>
<QBtn
:disabled="isLoading"
:label="t('globals.save')"
:loading="isLoading"
@click.stop="saveData"
color="primary"
icon="save"
/>
</QBtnGroup>
</Teleport>
<div class="full-width flex justify-center">
<QCard class="card-width q-pa-lg">
<QCardSection>
<QForm>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput
:label="t('Reference')"
clearable
v-model="dms.reference"
/>
</div>
<div class="col">
<VnSelectFilter
:label="t('Company')"
:options="optionsCompanies"
:rules="validate('entry.companyFk')"
option-label="code"
option-value="id"
v-model="dms.companyId"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('Warehouse')"
:options="optionsWarehouses"
option-label="name"
option-value="id"
v-model="dms.warehouseId"
/>
</div>
<div class="col">
<VnSelectFilter
:label="t('Type')"
:options="optionsDmsTypes"
option-label="name"
option-value="id"
v-model="dms.dmsTypeId"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput
:label="t('Description')"
:rules="validate('route.description')"
clearable
type="textarea"
v-model="dms.description"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QFile
ref="inputFileRef"
class="required"
:label="t('File')"
v-model="dms.files"
multiple
:accept="allowedContentTypes.join(',')"
clearable
clear-icon="close"
>
<template #append>
<QBtn
icon="vn:attach"
flat
round
padding="xs"
@click="inputFileRef.pickFiles()"
>
<QTooltip>
{{ t('Select a file') }}
</QTooltip>
</QBtn>
<QBtn icon="info" flat round padding="xs">
<QTooltip max-width="30rem">
{{
`${t(
'Allowed content types'
)}: ${allowedContentTypes.join(', ')}`
}}
</QTooltip>
</QBtn>
</template>
</QFile>
</div>
</VnRow>
<QCheckbox
:label="t('Generate identifier for original file')"
v-model="dms.hasFile"
/>
</QForm>
</QCardSection>
</QCard>
</div>
</template> </template>
<i18n>
en:
clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
es:
Reference: Referencia
Company: Empresa
Warehouse: Almacén
Type: Tipo
Description: Descripción
clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
File: Fichero
Select a file: Selecciona un fichero
Allowed content types: Tipos de archivo permitidos
Generate identifier for original file: Generar identificador para archivo original
</i18n>

262
src/pages/Worker/components/WorkerDmsEdit.vue
View File

@ -1,246 +1,56 @@
<script setup> <script setup>
import { ref } from 'vue'; import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { useRoute, useRouter } from 'vue-router';
import axios from 'axios'; import { useDialogPluginComponent } from 'quasar';
import { useValidator } from 'src/composables/useValidator';
import useNotify from 'src/composables/useNotify';
import FetchData from 'components/FetchData.vue'; import FetchData from 'components/FetchData.vue';
import VnRow from 'components/ui/VnRow.vue'; import VnDms from 'src/components/common/VnDms.vue';
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
import VnInput from 'src/components/common/VnInput.vue';
const { notify } = useNotify(); const { dialogRef } = useDialogPluginComponent();
const { t } = useI18n();
const { validate } = useValidator();
const route = useRoute();
const router = useRouter();
const filterCompanies = { order: ['code'] }; const $props = defineProps({
const filterWarehouses = { order: ['name'] }; dmsId: {
type: Number,
required: true,
},
defaultDmsCode: {
type: String,
required: false,
},
promise: {
type: Function,
required: true,
},
});
const inputFileRef = ref(); const initialData = ref({
const allowedContentTypes = ref([]);
const optionsCompanies = ref([]);
const optionsWarehouses = ref([]);
const optionsDmsTypes = ref([]);
const isLoading = ref(false);
const dms = ref({
hasFile: true, hasFile: true,
id: $props.dmsId,
}); });
const setCurrentDms = (data) => { const setCurrentDms = (data) => {
dms.value.reference = data.reference; initialData.value.reference = data.reference;
dms.value.companyId = data.companyFk; initialData.value.companyFk = data.companyFk;
dms.value.warehouseId = data.warehouseFk; initialData.value.warehouseFk = data.warehouseFk;
dms.value.dmsTypeId = data.dmsTypeFk; initialData.value.dmsTypeFk = data.dmsTypeFk;
dms.value.description = data.description; initialData.value.description = data.description;
dms.value.hasFile = data.hasFile; initialData.value.hasFile = data.hasFile;
}; };
const saveData = async () => { const onDataSaved = async () => {
try { if ($props.promise) await $props.promise();
const formData = new FormData();
console.log(formData);
const files = dms.value.files;
console.log(files);
dms.value.hasFileAttached = files ? true : false;
const url = `dms/${route.params.dmsId}/updateFile`;
if (files && files.length > 0) {
for (let file of files) {
formData.append(file.name, file);
}
await axios.post(url, formData, {
params: dms.value,
});
notify('globals.dataSaved', 'positive');
} else {
await axios.post(url, dms.value);
}
toWorkerDms();
} catch (error) {
notify(error.message, 'negative');
}
};
const toWorkerDms = () => {
router.push({ name: 'WorkerDms' });
}; };
</script> </script>
<template> <template>
<fetch-data :url="`Dms/${route.params.dmsId}`" @on-fetch="setCurrentDms" auto-load /> <fetch-data :url="`Dms/${$props.dmsId}`" @on-fetch="setCurrentDms" auto-load />
<fetch-data
@on-fetch="(data) => (allowedContentTypes = data)"
auto-load
url="DmsContainers/allowedContentTypes"
/>
<fetch-data
:filter="filterCompanies"
@on-fetch="(data) => (optionsCompanies = data)"
auto-load
url="Companies"
/>
<fetch-data
:filter="filterWarehouses"
@on-fetch="(data) => (optionsWarehouses = data)"
auto-load
url="Warehouses"
/>
<fetch-data
:filter="filterWarehouses"
@on-fetch="(data) => (optionsDmsTypes = data)"
auto-load
url="DmsTypes"
/>
<Teleport to="#st-actions"> <QDialog ref="dialogRef">
<QBtnGroup push class="q-gutter-x-sm"> <VnDms
<QBtn :default-initialData-code="$props.defaultDmsCode"
:disabled="isLoading" @on-data-saved="onDataSaved"
:label="t('globals.cancel')" model="WorkerDmsEdit"
:loading="isLoading" :form-initial-data="initialData"
@click="toWorkerDms" />
color="primary" </QDialog>
flat
icon="close"
/>
<QBtn
:disabled="isLoading"
:label="t('globals.save')"
:loading="isLoading"
@click.stop="saveData"
color="primary"
icon="save"
/>
</QBtnGroup>
</Teleport>
<div class="full-width flex justify-center">
<QCard class="card-width q-pa-lg">
<QCardSection>
<QForm>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput
:label="t('Reference')"
clearable
v-model="dms.reference"
/>
</div>
<div class="col">
<VnSelectFilter
:label="t('Company')"
:options="optionsCompanies"
:rules="validate('entry.companyFk')"
option-label="code"
option-value="id"
v-model="dms.companyId"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnSelectFilter
:label="t('Warehouse')"
:options="optionsWarehouses"
option-label="name"
option-value="id"
v-model="dms.warehouseId"
/>
</div>
<div class="col">
<VnSelectFilter
:label="t('Type')"
:options="optionsDmsTypes"
option-label="name"
option-value="id"
v-model="dms.dmsTypeId"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<VnInput
:label="t('Description')"
:rules="validate('route.description')"
clearable
type="textarea"
v-model="dms.description"
/>
</div>
</VnRow>
<VnRow class="row q-gutter-md q-mb-md">
<div class="col">
<QFile
ref="inputFileRef"
class="required"
:label="t('File')"
v-model="dms.files"
multiple
:accept="allowedContentTypes.join(',')"
clearable
clear-icon="close"
>
<template #append>
<QBtn
icon="vn:attach"
flat
round
padding="xs"
@click="inputFileRef.pickFiles()"
>
<QTooltip>
{{ t('Select a file') }}
</QTooltip>
</QBtn>
<QBtn icon="info" flat round padding="xs">
<QTooltip max-width="30rem">
{{
`${t(
'Allowed content types'
)}: ${allowedContentTypes.join(', ')}`
}}
</QTooltip>
</QBtn>
</template>
</QFile>
</div>
</VnRow>
<QCheckbox
:label="t('Generate identifier for original file')"
v-model="dms.hasFile"
disable
/>
</QForm>
</QCardSection>
</QCard>
</div>
</template> </template>
<i18n>
en:
clientFileDescription: '{dmsTypeName} FROM CLIENT {clientName} ID {clientId}'
es:
Reference: Referencia
Company: Empresa
Warehouse: Almacén
Type: Tipo
Description: Descripción
clientFileDescription: '{dmsTypeName} DEL CLIENTE {clientName} ID {clientId}'
File: Fichero
Select a file: Selecciona un fichero
Allowed content types: Tipos de archivo permitidos
Generate identifier for original file: Generar identificador para archivo original
</i18n>

32
src/router/modules/worker.js
View File

@ -86,33 +86,13 @@ export default {
component: () => import('src/pages/Worker/Card/WorkerPda.vue'), component: () => import('src/pages/Worker/Card/WorkerPda.vue'),
}, },
{ {
name: 'WorkerDms',
path: 'dms', path: 'dms',
name: 'DmsCard', meta: {
redirect: { name: 'WorkerDms' }, title: 'dms',
children: [ icon: 'cloud_upload',
{ },
path: '', component: () => import('src/pages/Worker/Card/WorkerDms.vue'),
name: 'WorkerDms',
meta: {
title: 'dms',
icon: 'cloud_upload',
},
component: () =>
import('src/pages/Worker/Card/WorkerDms.vue'),
},
{
path: 'create',
name: 'WorkerDmsCreate',
component: () =>
import('src/pages/Worker/components/WorkerDmsCreate.vue'),
},
{
path: ':dmsId/edit',
name: 'WorkerDmsEdit',
component: () =>
import('src/pages/Worker/components/WorkerDmsEdit.vue'),
},
],
}, },
], ],
}, },