Autocomplete postcodes
This commit is contained in:
parent
50492151d8
commit
9aeba37140
|
@ -28,8 +28,8 @@ const countriesOptions = ref([]);
|
|||
const provincesOptions = ref([]);
|
||||
const townsLocationOptions = ref([]);
|
||||
|
||||
const onDataSaved = () => {
|
||||
emit('onDataSaved');
|
||||
const onDataSaved = (dataSaved) => {
|
||||
emit('onDataSaved', dataSaved);
|
||||
};
|
||||
|
||||
const onCityCreated = async () => {
|
||||
|
|
|
@ -42,8 +42,8 @@ const { t } = useI18n();
|
|||
const closeButton = ref(null);
|
||||
const isLoading = ref(false);
|
||||
|
||||
const onDataSaved = () => {
|
||||
emit('onDataSaved');
|
||||
const onDataSaved = (dataSaved) => {
|
||||
emit('onDataSaved', dataSaved);
|
||||
closeForm();
|
||||
};
|
||||
|
||||
|
@ -59,7 +59,7 @@ const closeForm = () => {
|
|||
:default-actions="false"
|
||||
:url-create="urlCreate"
|
||||
:model="model"
|
||||
@on-data-saved="onDataSaved()"
|
||||
@on-data-saved="onDataSaved($event)"
|
||||
>
|
||||
<template #form="{ data, validate }">
|
||||
<span ref="closeButton" class="close-icon" v-close-popup>
|
||||
|
|
|
@ -22,8 +22,12 @@ const provincesLocationOptions = ref([]);
|
|||
const countriesOptions = ref([]);
|
||||
const postcodesOptions = ref([]);
|
||||
|
||||
const onPostcodeCreated = async () => {
|
||||
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
|
||||
postcodeFetchDataRef.value.fetch();
|
||||
formData.postcode = code;
|
||||
formData.provinceFk = provinceFk;
|
||||
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
|
||||
formData.countryFk = countryFk;
|
||||
};
|
||||
</script>
|
||||
|
||||
|
@ -49,7 +53,12 @@ const onPostcodeCreated = async () => {
|
|||
auto-load
|
||||
url="Countries"
|
||||
/>
|
||||
|
||||
<FetchData
|
||||
ref="postcodeFetchDataRef"
|
||||
url="Postcodes/location"
|
||||
@on-fetch="(data) => (postcodesOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FormModel
|
||||
:url-update="`Clients/${route.params.id}/updateFiscalData`"
|
||||
:url="`Clients/${route.params.id}/getCard`"
|
||||
|
@ -114,7 +123,7 @@ const onPostcodeCreated = async () => {
|
|||
>
|
||||
<template #form>
|
||||
<CustomerCreateNewPostcode
|
||||
@on-data-saved="onPostcodeCreated($event)"
|
||||
@on-data-saved="onPostcodeCreated($event, data)"
|
||||
/>
|
||||
</template>
|
||||
<template #option="scope">
|
||||
|
@ -136,7 +145,6 @@ const onPostcodeCreated = async () => {
|
|||
</VnSelectCreate>
|
||||
</div>
|
||||
<div class="col">
|
||||
<!-- ciudades -->
|
||||
<VnSelectFilter
|
||||
:label="t('City')"
|
||||
:options="citiesLocationOptions"
|
||||
|
@ -169,7 +177,7 @@ const onPostcodeCreated = async () => {
|
|||
hide-selected
|
||||
option-label="name"
|
||||
option-value="id"
|
||||
v-model="data.province"
|
||||
v-model="data.provinceFk"
|
||||
>
|
||||
<template #option="scope">
|
||||
<QItem v-bind="scope.itemProps">
|
||||
|
@ -189,7 +197,7 @@ const onPostcodeCreated = async () => {
|
|||
hide-selected
|
||||
option-label="country"
|
||||
option-value="id"
|
||||
v-model="data.country"
|
||||
v-model="data.countryFk"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
|
|
|
@ -36,8 +36,12 @@ const provincesLocationOptions = ref([]);
|
|||
const countriesOptions = ref([]);
|
||||
const postcodesOptions = ref([]);
|
||||
|
||||
const onPostcodeCreated = async () => {
|
||||
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
|
||||
postcodeFetchDataRef.value.fetch();
|
||||
formData.postcode = code;
|
||||
formData.provinceFk = provinceFk;
|
||||
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
|
||||
formData.countryFk = countryFk;
|
||||
};
|
||||
</script>
|
||||
|
||||
|
@ -81,7 +85,6 @@ const onPostcodeCreated = async () => {
|
|||
</QToolbar>
|
||||
<FormModel
|
||||
:form-initial-data="newClientForm"
|
||||
:observe-form-changes="false"
|
||||
model="client"
|
||||
url-create="Clients/createWithUser"
|
||||
>
|
||||
|
@ -148,7 +151,7 @@ const onPostcodeCreated = async () => {
|
|||
>
|
||||
<template #form>
|
||||
<CustomerCreateNewPostcode
|
||||
@on-data-saved="onPostcodeCreated($event)"
|
||||
@on-data-saved="onPostcodeCreated($event, data)"
|
||||
/>
|
||||
</template>
|
||||
<template #option="scope">
|
||||
|
|
|
@ -24,8 +24,12 @@ const provincesLocationOptions = ref([]);
|
|||
const townsLocationOptions = ref([]);
|
||||
const countriesOptions = ref([]);
|
||||
|
||||
const onPostcodeCreated = async () => {
|
||||
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
|
||||
postcodeFetchDataRef.value.fetch();
|
||||
formData.postcode = code;
|
||||
formData.provinceFk = provinceFk;
|
||||
formData.city = townsLocationOptions.value.find((town) => town.id === townFk).name;
|
||||
formData.countryFk = countryFk;
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
|
@ -179,7 +183,7 @@ const onPostcodeCreated = async () => {
|
|||
>
|
||||
<template #form>
|
||||
<CustomerCreateNewPostcode
|
||||
@on-data-saved="onPostcodeCreated($event)"
|
||||
@on-data-saved="onPostcodeCreated($event, data)"
|
||||
/>
|
||||
</template>
|
||||
<template #option="scope">
|
||||
|
|
|
@ -65,8 +65,11 @@ const onBankEntityCreated = (data) => {
|
|||
bankEntitiesOptions.value.push(data);
|
||||
};
|
||||
|
||||
const onPostcodeCreated = async () => {
|
||||
const onPostcodeCreated = async ({ code, provinceFk, townFk }, formData) => {
|
||||
postcodeFetchDataRef.value.fetch();
|
||||
formData.postcode = code;
|
||||
formData.provinceFk = provinceFk;
|
||||
formData.city = townsOptions.value.find((town) => town.id === townFk).name;
|
||||
};
|
||||
|
||||
onMounted(async () => {
|
||||
|
@ -193,7 +196,7 @@ onMounted(async () => {
|
|||
>
|
||||
<template #form>
|
||||
<CustomerCreateNewPostcode
|
||||
@on-data-saved="onPostcodeCreated($event)"
|
||||
@on-data-saved="onPostcodeCreated($event, data)"
|
||||
/>
|
||||
</template>
|
||||
<template #option="scope">
|
||||
|
@ -360,6 +363,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</VnSelectCreate>
|
||||
</VnRow>
|
||||
<pre>{{ data }}</pre>
|
||||
</template>
|
||||
</FormModel>
|
||||
</QPage>
|
||||
|
|
Loading…
Reference in New Issue