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

Merge pull request 'feature/ms-95-postcode-autocomplete' (#67) from feature/ms-95-postcode-autocomplete into dev 

Reviewed-on: hyervoni/salix-front-mindshore#67
This commit is contained in:
William Buezas 2024-01-12 20:05:45 +00:00
parent 6e04de47a4 4bf16da814
commit b41da81f3e
7 changed files with 70 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/CreateNewCityForm.vue
View File

@ -19,8 +19,8 @@ const cityFormData = reactive({
const provincesOptions = ref([]);
const onDataSaved = () => {
emit('onDataSaved');
const onDataSaved = (dataSaved) => {
emit('onDataSaved', dataSaved);
};
</script>

18
src/components/CreateNewPostcodeForm.vue
View File

@ -32,12 +32,20 @@ const onDataSaved = (dataSaved) => {
emit('onDataSaved', dataSaved);
};
const onCityCreated = async () => {
const onCityCreated = async ({ name, provinceFk }, formData) => {
await townsFetchDataRef.value.fetch();
formData.townFk = townsLocationOptions.value.find((town) => town.name === name).id;
formData.provinceFk = provinceFk;
formData.countryFk = provincesOptions.value.find(
(province) => province.id === provinceFk
).countryFk;
};
const onProvinceCreated = async () => {
const onProvinceCreated = async ({ name }, formData) => {
await provincesFetchDataRef.value.fetch();
formData.provinceFk = provincesOptions.value.find(
(province) => province.name === name
).id;
};
</script>
@ -88,7 +96,9 @@ const onProvinceCreated = async () => {
:roles-allowed-to-create="['deliveryAssistant']"
>
<template #form>
<CreateNewCityForm @on-data-saved="onCityCreated($event)" />
<CreateNewCityForm
@on-data-saved="onCityCreated($event, data)"
/>
</template>
</VnSelectCreate>
</div>
@ -107,7 +117,7 @@ const onProvinceCreated = async () => {
>
<template #form>
<CreateNewProvinceForm
@on-data-saved="onProvinceCreated($event)"
@on-data-saved="onProvinceCreated($event, data)"
/>
</template>
</VnSelectCreate>

4
src/components/CreateNewProvinceForm.vue
View File

@ -19,8 +19,8 @@ const provinceFormData = reactive({
const autonomiesOptions = ref([]);
const onDataSaved = () => {
emit('onDataSaved');
const onDataSaved = (dataSaved) => {
emit('onDataSaved', dataSaved);
};
</script>

27
src/pages/Customer/Card/CustomerFiscalData.vue
View File

@ -14,16 +14,22 @@ import VnSelectCreate from 'src/components/common/VnSelectCreate.vue';
const { t } = useI18n();
const route = useRoute();
const townsFetchDataRef = ref(null);
const postcodeFetchDataRef = ref(null);
const typesTaxes = ref([]);
const typesTransactions = ref([]);
const postcodeFetchDataRef = ref(null);
const citiesLocationOptions = ref([]);
const provincesLocationOptions = ref([]);
const countriesOptions = ref([]);
const postcodesOptions = ref([]);
const onPostcodeCreated = async () => {
postcodeFetchDataRef.value.fetch();
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postcode = code;
formData.provinceFk = provinceFk;
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
formData.countryFk = countryFk;
};
</script>
@ -35,6 +41,7 @@ const onPostcodeCreated = async () => {
url="SageTransactionTypes"
/>
<FetchData
ref="townsFetchDataRef"
@on-fetch="(data) => (citiesLocationOptions = data)"
auto-load
url="Towns/location"
@ -49,7 +56,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 +126,7 @@ const onPostcodeCreated = async () => {
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event)"
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">
@ -136,7 +148,6 @@ const onPostcodeCreated = async () => {
</VnSelectCreate>
</div>
<div class="col">
<!-- ciudades -->
<VnSelectFilter
:label="t('City')"
:options="citiesLocationOptions"
@ -169,7 +180,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 +200,7 @@ const onPostcodeCreated = async () => {
hide-selected
option-label="country"
option-value="id"
v-model="data.country"
v-model="data.countryFk"
/>
</div>
</VnRow>

14
src/pages/Customer/CustomerCreate.vue
View File

@ -30,6 +30,7 @@ const newClientForm = reactive({
});
const postcodeFetchDataRef = ref(null);
const townsFetchDataRef = ref(null);
const workersOptions = ref([]);
const businessTypesOptions = ref([]);
const citiesLocationOptions = ref([]);
@ -37,8 +38,13 @@ const provincesLocationOptions = ref([]);
const countriesOptions = ref([]);
const postcodesOptions = ref([]);
const onPostcodeCreated = async () => {
postcodeFetchDataRef.value.fetch();
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postcode = code;
formData.provinceFk = provinceFk;
formData.city = citiesLocationOptions.value.find((town) => town.id === townFk).name;
formData.countryFk = countryFk;
};
</script>
@ -60,6 +66,7 @@ const onPostcodeCreated = async () => {
url="BusinessTypes"
/>
<FetchData
ref="townsFetchDataRef"
@on-fetch="(data) => (citiesLocationOptions = data)"
auto-load
url="Towns/location"
@ -78,7 +85,6 @@ const onPostcodeCreated = async () => {
<VnSubToolbar />
<FormModel
:form-initial-data="newClientForm"
:observe-form-changes="false"
model="client"
url-create="Clients/createWithUser"
>
@ -145,7 +151,7 @@ const onPostcodeCreated = async () => {
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event)"
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">

19
src/pages/Supplier/Card/SupplierFiscalData.vue
View File

@ -15,6 +15,7 @@ const route = useRoute();
const { t } = useI18n();
const postcodeFetchDataRef = ref(null);
const townsFetchDataRef = ref(null);
const sageTaxTypesOptions = ref([]);
const sageWithholdingsOptions = ref([]);
const sageTransactionTypesOptions = ref([]);
@ -24,8 +25,13 @@ const provincesLocationOptions = ref([]);
const townsLocationOptions = ref([]);
const countriesOptions = ref([]);
const onPostcodeCreated = async () => {
postcodeFetchDataRef.value.fetch();
const onPostcodeCreated = async ({ code, provinceFk, townFk, countryFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postCode = code;
formData.provinceFk = provinceFk;
formData.city = townsLocationOptions.value.find((town) => town.id === townFk).name;
formData.countryFk = countryFk;
};
</script>
<template>
@ -56,6 +62,7 @@ const onPostcodeCreated = async () => {
auto-load
/>
<FetchData
ref="townsFetchDataRef"
@on-fetch="(data) => (townsLocationOptions = data)"
auto-load
url="Towns/location"
@ -167,19 +174,18 @@ const onPostcodeCreated = async () => {
</div>
<div class="col">
<VnSelectCreate
v-model="data.postCode"
:label="t('supplier.fiscalData.postcode')"
v-model="data.postCode"
:options="postcodesOptions"
:rules="validate('supplier.postCode')"
:roles-allowed-to-create="['deliveryAssistant']"
:options="postcodesOptions"
option-label="code"
option-value="code"
map-options
hide-selected
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event)"
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">
@ -282,6 +288,7 @@ const onPostcodeCreated = async () => {
</div>
</div>
</VnRow>
<pre> {{ data }}</pre>
</template>
</FormModel>
</template>

13
src/pages/Worker/WorkerCreate.vue
View File

@ -50,6 +50,7 @@ const newWorkerForm = ref({
});
const postcodeFetchDataRef = ref(null);
const townsFetchDataRef = ref(null);
const provincesOptions = ref([]);
const townsOptions = ref([]);
const companiesOptions = ref([]);
@ -66,8 +67,12 @@ const onBankEntityCreated = (data) => {
bankEntitiesOptions.value.push(data);
};
const onPostcodeCreated = async () => {
postcodeFetchDataRef.value.fetch();
const onPostcodeCreated = async ({ code, provinceFk, townFk }, formData) => {
await postcodeFetchDataRef.value.fetch();
await townsFetchDataRef.value.fetch();
formData.postcode = code;
formData.provinceFk = provinceFk;
formData.city = townsOptions.value.find((town) => town.id === townFk).name;
};
onMounted(async () => {
@ -96,6 +101,7 @@ onMounted(async () => {
auto-load
/>
<FetchData
ref="townsFetchDataRef"
url="Towns/location"
@on-fetch="(data) => (townsOptions = data)"
:filter="townsFilter"
@ -190,7 +196,7 @@ onMounted(async () => {
>
<template #form>
<CustomerCreateNewPostcode
@on-data-saved="onPostcodeCreated($event)"
@on-data-saved="onPostcodeCreated($event, data)"
/>
</template>
<template #option="scope">
@ -357,6 +363,7 @@ onMounted(async () => {
</template>
</VnSelectCreate>
</VnRow>
<pre>{{ data }}</pre>
</template>
</FormModel>
</QPage>