forked from verdnatura/salix-front
Solucion a comentarios 33
This commit is contained in:
carlosfonseca
parent
c844d26ccb
commit
5ff90d127b
|
|
@ -59,12 +59,7 @@ const getBankEntities = (data, formData) => {
|
|||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('Due day')"
|
||||
:rules="validate('client.socialName')"
|
||||
clearable
|
||||
v-model="data.dueDay"
|
||||
/>
|
||||
<VnInput :label="t('Due day')" clearable v-model="data.dueDay" />
|
||||
</div>
|
||||
</VnRow>
|
||||
|
||||
|
|
|
|||
|
|
@ -230,6 +230,18 @@ const onFetch = (data) => {
|
|||
selection="multiple"
|
||||
v-model:selected="selected"
|
||||
>
|
||||
<template #header="props">
|
||||
<QTr :props="props" class="bg">
|
||||
<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">
|
||||
<QTd :props="props">
|
||||
<QTr :props="props" class="cursor-pointer">
|
||||
|
|
|
|||
|
|
@ -7,25 +7,31 @@ import axios from 'axios';
|
|||
import { useQuasar } from 'quasar';
|
||||
|
||||
import { useState } from 'src/composables/useState';
|
||||
import { useValidator } from 'src/composables/useValidator';
|
||||
import useNotify from 'src/composables/useNotify';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnSelectFilter from 'src/components/common/VnSelectFilter.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnInputDate from 'src/components/common/VnInputDate.vue';
|
||||
import CustomerSamplesPreview from 'src/pages/Customer/components/CustomerSamplesPreview.vue';
|
||||
|
||||
const { notify } = useNotify();
|
||||
const { t } = useI18n();
|
||||
const { validate } = useValidator();
|
||||
const quasar = useQuasar();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const state = useState();
|
||||
const user = state.getUser();
|
||||
|
||||
const optionsEmailUsers = ref([]);
|
||||
const client = ref({});
|
||||
const hasChanged = ref(false);
|
||||
const isLoading = ref(false);
|
||||
const optionsClientsAddressess = ref([]);
|
||||
const optionsCompanies = ref([]);
|
||||
const optionsEmailUsers = ref([]);
|
||||
const optionsSamplesVisible = ref([]);
|
||||
const sampleType = ref({ hasPreview: false });
|
||||
|
||||
|
|
@ -53,11 +59,9 @@ const filterSamplesVisible = {
|
|||
const initialData = reactive({});
|
||||
|
||||
onBeforeMount(async () => {
|
||||
const { companyFk } = user.value;
|
||||
const { data } = await axios.get(`Clients/1/getCard`);
|
||||
client.value = data;
|
||||
initialData.clientFk = route.params.id;
|
||||
initialData.companyFk = companyFk;
|
||||
initialData.companyId = companyFk;
|
||||
initialData.recipient = data.email;
|
||||
initialData.recipientId = data.id;
|
||||
});
|
||||
|
|
@ -73,28 +77,27 @@ const setClientsAddresses = (data) => {
|
|||
};
|
||||
|
||||
const setSampleType = (sampleId) => {
|
||||
sampleType.value = optionsSamplesVisible.value.find(
|
||||
(option) => option.id === sampleId
|
||||
);
|
||||
hasChanged.value = true;
|
||||
const { companyFk } = user.value;
|
||||
sampleType.value = optionsSamplesVisible.value.find((option) => {
|
||||
return option.id === sampleId;
|
||||
});
|
||||
initialData.companyFk = companyFk;
|
||||
initialData.companyId = companyFk;
|
||||
};
|
||||
|
||||
const onDataSaved = async ({
|
||||
addressId,
|
||||
companyFk,
|
||||
companyId,
|
||||
from,
|
||||
recipient,
|
||||
replyTo,
|
||||
}) => {
|
||||
await axios.post(`Clients/${route.params.id}/incoterms-authorization-email`, {
|
||||
addressId,
|
||||
companyFk,
|
||||
companyId,
|
||||
from,
|
||||
recipient,
|
||||
replyTo,
|
||||
});
|
||||
toCustomerSamples();
|
||||
const setInitialData = () => {
|
||||
hasChanged.value = false;
|
||||
|
||||
initialData.addressId = optionsClientsAddressess.value[0].id;
|
||||
initialData.companyFk = null;
|
||||
initialData.from = null;
|
||||
initialData.recipient = client.value.email;
|
||||
initialData.recipientId = client.value.id;
|
||||
initialData.replyTo = optionsEmailUsers.value[0]?.email;
|
||||
initialData.typeFk = '';
|
||||
|
||||
sampleType.value = {};
|
||||
};
|
||||
|
||||
const getPreview = async () => {
|
||||
|
|
@ -123,6 +126,43 @@ const getPreview = async () => {
|
|||
}
|
||||
};
|
||||
|
||||
const onSubmit = async () => {
|
||||
isLoading.value = true;
|
||||
|
||||
try {
|
||||
const { data } = await axios.patch('ClientSamples', initialData);
|
||||
notify('globals.dataSaved', 'positive');
|
||||
onDataSaved(data);
|
||||
} catch (error) {
|
||||
notify('errors.create', 'negative');
|
||||
} finally {
|
||||
isLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
const onDataSaved = async ({
|
||||
addressId,
|
||||
companyFk,
|
||||
companyId,
|
||||
from,
|
||||
recipient,
|
||||
replyTo,
|
||||
}) => {
|
||||
await axios.post(`Clients/${route.params.id}/incoterms-authorization-email`, {
|
||||
addressId,
|
||||
companyFk,
|
||||
companyId,
|
||||
from,
|
||||
recipient,
|
||||
replyTo,
|
||||
});
|
||||
toCustomerSamples();
|
||||
};
|
||||
|
||||
const updateModelValue = () => {
|
||||
hasChanged.value = true;
|
||||
};
|
||||
|
||||
const toCustomerSamples = () => {
|
||||
router.push({ name: 'CustomerSamples' });
|
||||
};
|
||||
|
|
@ -154,14 +194,8 @@ const toCustomerSamples = () => {
|
|||
url="Samples/visible"
|
||||
/>
|
||||
|
||||
<FormModel
|
||||
:form-initial-data="initialData"
|
||||
:observe-form-changes="false"
|
||||
@on-data-saved="onDataSaved"
|
||||
model="samplesCreate"
|
||||
url-create="ClientSamples"
|
||||
>
|
||||
<template #moreActions>
|
||||
<Teleport to="#st-actions">
|
||||
<QBtnGroup push class="q-gutter-x-sm">
|
||||
<QBtn
|
||||
:label="t('globals.cancel')"
|
||||
@click="toCustomerSamples"
|
||||
|
|
@ -170,7 +204,7 @@ const toCustomerSamples = () => {
|
|||
icon="close"
|
||||
/>
|
||||
<QBtn
|
||||
:disabled="isLoading || !sampleType.hasPreview"
|
||||
:disabled="isLoading || !sampleType?.hasPreview"
|
||||
:label="t('Preview')"
|
||||
:loading="isLoading"
|
||||
@click.stop="getPreview()"
|
||||
|
|
@ -178,10 +212,30 @@ const toCustomerSamples = () => {
|
|||
flat
|
||||
icon="preview"
|
||||
/>
|
||||
</template>
|
||||
<QBtn
|
||||
:disabled="!hasChanged"
|
||||
:label="t('globals.reset')"
|
||||
:loading="isLoading"
|
||||
@click="setInitialData"
|
||||
color="primary"
|
||||
flat
|
||||
icon="restart_alt"
|
||||
type="reset"
|
||||
/>
|
||||
<QBtn
|
||||
:disabled="!hasChanged"
|
||||
:label="t('globals.save')"
|
||||
:loading="isLoading"
|
||||
@click="onSubmit"
|
||||
color="primary"
|
||||
icon="save"
|
||||
/>
|
||||
</QBtnGroup>
|
||||
</Teleport>
|
||||
|
||||
<template #form="{ data, validate }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="full-width flex justify-center">
|
||||
<QCard class="card-width q-pa-lg">
|
||||
<QForm>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Sample')"
|
||||
|
|
@ -190,106 +244,110 @@ const toCustomerSamples = () => {
|
|||
hide-selected
|
||||
option-label="description"
|
||||
option-value="id"
|
||||
required="true"
|
||||
v-model="data.typeFk"
|
||||
v-model="initialData.typeFk"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('Recipient')"
|
||||
clearable
|
||||
required="true"
|
||||
v-model="data.recipient"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="info" class="cursor-pointer">
|
||||
<QTooltip>{{
|
||||
t('Its only used when sample is sent')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('Reply to')"
|
||||
clearable
|
||||
required="true"
|
||||
v-model="data.replyTo"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="info" class="cursor-pointer">
|
||||
<QTooltip>{{
|
||||
t('To who should the recipient replay?')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('Recipient')"
|
||||
@update:model-value="updateModelValue"
|
||||
clearable
|
||||
required="true"
|
||||
v-model="initialData.recipient"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="info" class="cursor-pointer">
|
||||
<QTooltip>{{
|
||||
t('Its only used when sample is sent')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnInput
|
||||
:label="t('Reply to')"
|
||||
@update:model-value="updateModelValue"
|
||||
clearable
|
||||
required="true"
|
||||
v-model="initialData.replyTo"
|
||||
>
|
||||
<template #append>
|
||||
<QIcon name="info" class="cursor-pointer">
|
||||
<QTooltip>{{
|
||||
t('To who should the recipient replay?')
|
||||
}}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnInput>
|
||||
</div>
|
||||
</VnRow>
|
||||
|
||||
<VnRow
|
||||
class="row q-gutter-md q-mb-md"
|
||||
v-if="sampleType.hasCompany || sampleType.datepickerEnabled"
|
||||
>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Company')"
|
||||
:options="optionsCompanies"
|
||||
:rules="validate('entry.companyFk')"
|
||||
hide-selected
|
||||
option-label="code"
|
||||
option-value="id"
|
||||
required="true"
|
||||
v-model="data.companyFk"
|
||||
v-if="sampleType.hasCompany"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Address')"
|
||||
:options="optionsClientsAddressess"
|
||||
hide-selected
|
||||
option-label="nickname"
|
||||
option-value="id"
|
||||
required="true"
|
||||
v-model="data.addressId"
|
||||
v-if="sampleType.id === 20"
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel>
|
||||
{{
|
||||
`${scope.opt.nickname}, ${scope.opt.street}, ${scope.opt.city}, ${scope.opt.province.name} - ${scope.opt.agencyMode.name}`
|
||||
}}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
<template #append>
|
||||
<QIcon name="edit" class="cursor-pointer">
|
||||
<QTooltip>{{ t('Edit address') }}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnSelectFilter>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow
|
||||
class="row q-gutter-md q-mb-md"
|
||||
v-if="sampleType?.hasCompany || sampleType?.datepickerEnabled"
|
||||
>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Company')"
|
||||
:options="optionsCompanies"
|
||||
:rules="validate('entry.companyFk')"
|
||||
hide-selected
|
||||
option-label="code"
|
||||
option-value="id"
|
||||
required="true"
|
||||
v-model="initialData.companyFk"
|
||||
v-if="sampleType.hasCompany"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<VnSelectFilter
|
||||
:label="t('Address')"
|
||||
:options="optionsClientsAddressess"
|
||||
hide-selected
|
||||
option-label="nickname"
|
||||
option-value="id"
|
||||
required="true"
|
||||
v-model="initialData.addressId"
|
||||
v-if="sampleType.id === 20"
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
<QItemSection>
|
||||
<QItemLabel>
|
||||
{{
|
||||
`${scope.opt.nickname}, ${scope.opt.street}, ${scope.opt.city}, ${scope.opt.province.name} - ${scope.opt.agencyMode.name}`
|
||||
}}
|
||||
</QItemLabel>
|
||||
</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
<template #append>
|
||||
<QIcon name="edit" class="cursor-pointer">
|
||||
<QTooltip>{{ t('Edit address') }}</QTooltip>
|
||||
</QIcon>
|
||||
</template>
|
||||
</VnSelectFilter>
|
||||
</div>
|
||||
</VnRow>
|
||||
|
||||
<VnRow class="row q-gutter-md q-mb-md" v-if="sampleType.datepickerEnabled">
|
||||
<div class="col">
|
||||
<VnInputDate
|
||||
:label="t('Since')"
|
||||
required="true"
|
||||
v-model="data.from"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
<VnRow
|
||||
class="row q-gutter-md q-mb-md"
|
||||
v-if="sampleType?.datepickerEnabled"
|
||||
>
|
||||
<div class="col">
|
||||
<VnInputDate
|
||||
:label="t('Since')"
|
||||
required="true"
|
||||
v-model="initialData.from"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
</QForm>
|
||||
</QCard>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
|
|
|
|||
Loading…
Reference in New Issue