0
0
Fork 0

Autocomplete postcodes

This commit is contained in:
William Buezas 2024-01-10 12:11:49 -03:00
parent 50492151d8
commit 9aeba37140
6 changed files with 37 additions and 18 deletions

View File

@ -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 () => {

View File

@ -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>

View File

@ -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>

View File

@ -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">

View File

@ -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">

View File

@ -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>