forked from verdnatura/salix-front
WIP
This commit is contained in:
parent
2432496eaf
commit
cded128c4c
|
|
@ -84,7 +84,7 @@ onUnmounted(() => {
|
|||
const isLoading = ref(false);
|
||||
// Si elegimos observar los cambios del form significa que inicialmente las actions estaran deshabilitadas
|
||||
const hasChanges = ref(!$props.observeFormChanges);
|
||||
const originalData = ref({...$props.formInitialData});
|
||||
const originalData = ref({ ...$props.formInitialData });
|
||||
const formData = computed(() => state.get($props.model));
|
||||
const formUrl = computed(() => $props.url);
|
||||
|
||||
|
|
|
|||
|
|
@ -457,7 +457,7 @@ export default {
|
|||
list: {
|
||||
parking: 'Parking',
|
||||
priority: 'Priority',
|
||||
newShelving: 'New Shelving'
|
||||
newShelving: 'New Shelving',
|
||||
},
|
||||
summary: {
|
||||
code: 'Code',
|
||||
|
|
@ -480,6 +480,7 @@ export default {
|
|||
basicData: 'Basic data',
|
||||
summary: 'Summary',
|
||||
notifications: 'Notifications',
|
||||
workerCreate: 'New worker',
|
||||
},
|
||||
list: {
|
||||
name: 'Name',
|
||||
|
|
@ -489,6 +490,7 @@ export default {
|
|||
active: 'Active',
|
||||
department: 'Department',
|
||||
schedule: 'Schedule',
|
||||
newWorker: 'New worker',
|
||||
},
|
||||
card: {
|
||||
workerId: 'Worker ID',
|
||||
|
|
@ -520,6 +522,25 @@ export default {
|
|||
subscribed: 'Subscribed to the notification',
|
||||
unsubscribed: 'Unsubscribed from the notification',
|
||||
},
|
||||
create: {
|
||||
name: 'Name',
|
||||
lastName: 'Last name',
|
||||
birth: 'Birth',
|
||||
fi: 'Fi',
|
||||
code: 'Worker code',
|
||||
phone: 'Phone',
|
||||
postcode: 'Postcode',
|
||||
province: 'Province',
|
||||
city: 'City',
|
||||
street: 'Street',
|
||||
webUser: 'Web user',
|
||||
personalEmail: 'Personal email',
|
||||
company: 'Company',
|
||||
boss: 'Boss',
|
||||
payMethods: 'Pay method',
|
||||
iban: 'IBAN',
|
||||
bankEntity: 'Swift / BIC',
|
||||
},
|
||||
imageNotFound: 'Image not found',
|
||||
},
|
||||
wagon: {
|
||||
|
|
@ -638,6 +659,7 @@ export default {
|
|||
create: 'Create',
|
||||
summary: 'Summary',
|
||||
extraCommunity: 'Extra community',
|
||||
travelCreate: 'New travel',
|
||||
},
|
||||
summary: {
|
||||
confirmed: 'Confirmed',
|
||||
|
|
|
|||
|
|
@ -459,7 +459,7 @@ export default {
|
|||
list: {
|
||||
parking: 'Parking',
|
||||
priority: 'Prioridad',
|
||||
newShelving: 'Nuevo Carro'
|
||||
newShelving: 'Nuevo Carro',
|
||||
},
|
||||
summary: {
|
||||
code: 'Código',
|
||||
|
|
@ -482,6 +482,7 @@ export default {
|
|||
basicData: 'Datos básicos',
|
||||
summary: 'Resumen',
|
||||
notifications: 'Notificaciones',
|
||||
workerCreate: 'Nuevo trabajador',
|
||||
},
|
||||
list: {
|
||||
name: 'Nombre',
|
||||
|
|
@ -491,6 +492,7 @@ export default {
|
|||
active: 'Activo',
|
||||
department: 'Departamento',
|
||||
schedule: 'Horario',
|
||||
newWorker: 'Nuevo trabajador',
|
||||
},
|
||||
card: {
|
||||
workerId: 'ID Trabajador',
|
||||
|
|
@ -522,6 +524,25 @@ export default {
|
|||
subscribed: 'Se ha suscrito a la notificación',
|
||||
unsubscribed: 'Se ha dado de baja de la notificación',
|
||||
},
|
||||
create: {
|
||||
name: 'Nombre',
|
||||
lastName: 'Apellido',
|
||||
birth: 'Fecha de nacimiento',
|
||||
fi: 'DNI/NIF/NIE',
|
||||
code: 'Código de trabajador',
|
||||
phone: 'Teléfono',
|
||||
postcode: 'Código postal',
|
||||
province: 'Provincia',
|
||||
city: 'Población',
|
||||
street: 'Dirección',
|
||||
webUser: 'Usuario Web',
|
||||
personalEmail: 'Correo personal',
|
||||
company: 'Empresa',
|
||||
boss: 'Jefe',
|
||||
payMethods: 'Método de pago',
|
||||
iban: 'IBAN',
|
||||
bankEntity: 'Swift / BIC',
|
||||
},
|
||||
imageNotFound: 'No se ha encontrado la imagen',
|
||||
},
|
||||
wagon: {
|
||||
|
|
@ -640,6 +661,7 @@ export default {
|
|||
create: 'Crear',
|
||||
summary: 'Resumen',
|
||||
extraCommunity: 'Extra comunitarios',
|
||||
travelCreate: 'Nuevo envío',
|
||||
},
|
||||
summary: {
|
||||
confirmed: 'Confirmado',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,285 @@
|
|||
<script setup>
|
||||
import { onMounted, ref, reactive } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
|
||||
import { useUserConfig } from 'src/composables/useUserConfig';
|
||||
|
||||
const { t } = useI18n();
|
||||
|
||||
const workerConfigFilter = {
|
||||
field: ['payMethodFk'],
|
||||
};
|
||||
|
||||
const provincesFilter = {
|
||||
fields: ['id', 'name', 'countryFk'],
|
||||
};
|
||||
|
||||
const townsFilter = {
|
||||
fields: ['id', 'name', 'provinceFk'],
|
||||
};
|
||||
|
||||
const newWorkerForm = ref({
|
||||
companyFk: null,
|
||||
payMethodFk: null,
|
||||
firstName: null,
|
||||
lastNames: null,
|
||||
birth: null,
|
||||
fi: null,
|
||||
code: null,
|
||||
phone: null,
|
||||
postcode: null,
|
||||
provinceFk: null,
|
||||
city: null,
|
||||
street: null,
|
||||
name: null,
|
||||
});
|
||||
|
||||
const filtersOptions = reactive({
|
||||
provinces: [],
|
||||
towns: [],
|
||||
companies: [],
|
||||
workers: [],
|
||||
payMethods: [],
|
||||
bankEntities: [],
|
||||
});
|
||||
|
||||
const updateFilterOptions = (data, optionKey) => {
|
||||
filtersOptions[optionKey] = [...data];
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
const userInfo = await useUserConfig().fetch();
|
||||
newWorkerForm.value = { companyFk: userInfo.companyFk };
|
||||
});
|
||||
|
||||
const onFetchWorkerConfig = (workerConfig) => {
|
||||
newWorkerForm.value.payMethodFk = workerConfig.payMethodFk;
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FetchData
|
||||
url="WorkerConfigs/findOne"
|
||||
@on-fetch="(data) => onFetchWorkerConfig(data)"
|
||||
:filter="workerConfigFilter"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Provinces/location"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'provinces')"
|
||||
:filter="provincesFilter"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Towns/location"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'towns')"
|
||||
:filter="townsFilter"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Companies"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'companies')"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Workers/search"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'workers')"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="Paymethods"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'payMethods')"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData
|
||||
url="BankEntities"
|
||||
@on-fetch="(data) => updateFilterOptions(data, 'bankEntities')"
|
||||
auto-load
|
||||
/>
|
||||
<QPage>
|
||||
<QToolbar class="bg-vn-dark">
|
||||
<div id="st-data"></div>
|
||||
<QSpace />
|
||||
<div id="st-actions"></div>
|
||||
</QToolbar>
|
||||
<FormModel
|
||||
url-create="Workers/new"
|
||||
model="worker"
|
||||
:form-initial-data="newWorkerForm"
|
||||
:observe-form-changes="false"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
v-model="data.firstName"
|
||||
:label="t('worker.create.name')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput
|
||||
v-model="data.lastNames"
|
||||
:label="t('worker.create.lastName')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInputDate
|
||||
v-model="data.birth"
|
||||
:label="t('worker.create.birth')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput v-model="data.fi" :label="t('worker.create.fi')" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput v-model="data.code" :label="t('worker.create.code')" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput v-model="data.phone" :label="t('worker.create.phone')" />
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
v-model="data.postcode"
|
||||
:label="t('worker.create.postcode')"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.province')"
|
||||
v-model="data.provinceFk"
|
||||
:options="filtersOptions.provinces"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.city')"
|
||||
v-model="data.city"
|
||||
:options="filtersOptions.towns"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel>{{ scope.opt.name }}</QItemLabel>
|
||||
<QItemLabel caption
|
||||
>{{ scope.opt.name }},
|
||||
{{ scope.opt.province.name }} ({{
|
||||
scope.opt.province.country.country
|
||||
}})</QItemLabel
|
||||
>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
</VnSelectFilter>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput
|
||||
:label="t('worker.create.street')"
|
||||
v-model="data.street"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput v-model="data.name" :label="t('worker.create.webUser')" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<QInput
|
||||
v-model="data.email"
|
||||
:label="t('worker.create.personalEmail')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.company')"
|
||||
v-model="data.companyFk"
|
||||
:options="filtersOptions.companies"
|
||||
option-value="id"
|
||||
option-label="code"
|
||||
hide-selected
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.boss')"
|
||||
v-model="data.bossFk"
|
||||
:options="filtersOptions.workers"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel>{{ scope.opt.name }}</QItemLabel>
|
||||
<QItemLabel caption
|
||||
>{{ scope.opt.nickname }},
|
||||
{{ scope.opt.code }}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
</VnSelectFilter>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.payMethods')"
|
||||
v-model="data.payMethodFk"
|
||||
:options="filtersOptions.payMethods"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
hide-selected
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<QInput v-model="data.iban" :label="t('worker.create.iban')" />
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('worker.create.bankEntity')"
|
||||
v-model="data.bankEntityFk"
|
||||
:options="filtersOptions.bankEntities"
|
||||
option-value="id"
|
||||
option-label="bic"
|
||||
hide-selected
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel
|
||||
>{{ scope.opt.bic }}
|
||||
{{ scope.opt.name }}</QItemLabel
|
||||
>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template></VnSelectFilter
|
||||
>
|
||||
</div>
|
||||
</VnRow>
|
||||
<pre>data:: {{ data }}</pre>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
</template>
|
||||
|
|
@ -27,6 +27,10 @@ function viewSummary(id) {
|
|||
},
|
||||
});
|
||||
}
|
||||
|
||||
const redirectToCreateView = () => {
|
||||
router.push({ name: 'WorkerCreate' });
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -101,6 +105,12 @@ function viewSummary(id) {
|
|||
</template>
|
||||
</VnPaginate>
|
||||
</div>
|
||||
<QPageSticky :offset="[20, 20]">
|
||||
<QBtn fab icon="add" color="primary" @click="redirectToCreateView()" />
|
||||
<QTooltip>
|
||||
{{ t('worker.list.newWorker') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
</QPage>
|
||||
</template>
|
||||
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@ export default {
|
|||
path: 'create',
|
||||
name: 'TravelCreate',
|
||||
meta: {
|
||||
title: 'extraCommunity',
|
||||
title: 'travelCreate',
|
||||
icon: '',
|
||||
},
|
||||
component: () => import('src/pages/Travel/TravelCreate.vue'),
|
||||
|
|
|
|||
|
|
@ -29,6 +29,15 @@ export default {
|
|||
},
|
||||
component: () => import('src/pages/Worker/WorkerList.vue'),
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'WorkerCreate',
|
||||
meta: {
|
||||
title: 'workerCreate',
|
||||
icon: '',
|
||||
},
|
||||
component: () => import('src/pages/Worker/WorkerCreate.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
|
|
|||
Loading…
Reference in New Issue