Issue316 addresses search by postal code

This commit is contained in:
2021-12-06 12:56:57 +00:00
parent 51bbcab878
commit 938720be52
18 changed files with 805 additions and 23 deletions

View File

@@ -16,7 +16,8 @@ const fetchCountries = () => {
/**
* Endpoint chill_api_single_postal_code__index
* method GET, get Country Object
* method GET, get Cities Object
* @params {object} a country object
* @returns {Promise} a promise containing all Postal Code objects filtered with country
*/
const fetchCities = (country) => {
@@ -29,6 +30,40 @@ const fetchCities = (country) => {
});
};
/**
* Endpoint chill_main_postalcodeapi_search
* method GET, get Cities Object
* @params {string} search a search string
* @params {object} country a country object
* @returns {Promise} a promise containing all Postal Code objects filtered with country and a search string
*/
const searchCities = (search, country) => {
const url = `/api/1.0/main/postal-code/search.json?q=${search}&country=${country.id}`;
return fetch(url)
.then(response => {
if (response.ok) { return response.json(); }
throw Error('Error with request resource response');
});
};
/**
* Endpoint chill_main_addressreferenceapi_search
* method GET, get AddressReference Object
* @params {string} search a search string
* @params {object} postalCode a postalCode object
* @returns {Promise} a promise containing all Postal Code objects filtered with country and a search string
*/
const searchReferenceAddresses = (search, postalCode) => {
const url = `/api/1.0/main/address-reference/by-postal-code/${postalCode.id}/search.json?q=${search}`;
return fetch(url)
.then(response => {
if (response.ok) { return response.json(); }
throw Error('Error with request resource response');
});
};
/**
* Endpoint chill_api_single_address_reference__index
* method GET, get AddressReference Object
@@ -170,5 +205,7 @@ export {
postAddress,
patchAddress,
postPostalCode,
getAddress
getAddress,
searchCities,
searchReferenceAddresses
};

View File

@@ -556,8 +556,8 @@ export default {
this.entity.selected.address.distribution = this.context.edit ? this.entity.address.distribution: null;
this.entity.selected.address.extra = this.context.edit ? this.entity.address.extra: null;
this.entity.selected.writeNew.address = this.context.edit;
this.entity.selected.writeNew.postcode = this.context.edit;
this.entity.selected.writeNew.address = this.context.edit && this.entity.address.addressReference === null && this.entity.address.street.length > 0
this.entity.selected.writeNew.postcode = false // NB: this used to be this.context.edit, but think it was erroneous;
console.log('!! just set writeNew.postcode to', this.entity.selected.writeNew.postcode);
},
@@ -569,7 +569,6 @@ export default {
applyChanges()
{
console.log('apply changes');
let newAddress = {
'isNoAddress': this.entity.selected.isNoAddress,
'street': this.entity.selected.isNoAddress ? '' : this.entity.selected.address.street,
@@ -633,7 +632,6 @@ export default {
if (!this.context.edit) {
this.addNewAddress(newAddress)
.then(payload => this.addressChangedCallback(payload));
} else {
this.updateAddress({
addressId: this.context.addressId,
@@ -697,8 +695,7 @@ export default {
* Async PATCH transactions,
* then update existing address with backend datas when promise is resolved
*/
updateAddress(payload)
{
updateAddress(payload) {
this.flag.loading = true;
// TODO change the condition because it writes new postal code in edit mode now: !writeNewPostalCode

View File

@@ -18,6 +18,7 @@
:taggable="true"
:multiple="false"
@tag="addAddress"
:loading="isLoading"
:options="addresses">
</VueMultiselect>
</div>
@@ -48,14 +49,17 @@
<script>
import VueMultiselect from 'vue-multiselect';
import { searchReferenceAddresses, fetchReferenceAddresses } from '../../api.js';
export default {
name: 'AddressSelection',
components: { VueMultiselect },
props: ['entity', 'updateMapCenter'],
props: ['entity', 'context', 'updateMapCenter'],
data() {
return {
value: null
value: this.context.edit ? this.entity.address.addressReference : null,
isLoading: false
}
},
computed: {
@@ -107,6 +111,36 @@ export default {
},
listenInputSearch(query) {
//console.log('listenInputSearch', query, this.isAddressSelectorOpen);
if (!this.entity.selected.writeNew.postcode) {
if (query.length > 2) {
this.isLoading = true;
searchReferenceAddresses(query, this.entity.selected.city).then(
addresses => new Promise((resolve, reject) => {
this.entity.loaded.addresses = addresses.results;
this.isLoading = false;
resolve();
}))
.catch((error) => {
console.log(error); //TODO better error handling
this.isLoading = false;
});
} else {
if (query.length === 0) { // Fetch all cities when suppressing the query
this.isLoading = true;
fetchReferenceAddresses(this.entity.selected.city).then(
addresses => new Promise((resolve, reject) => {
this.entity.loaded.addresses = addresses.results;
this.isLoading = false;
resolve();
}))
.catch((error) => {
console.log(error);
this.isLoading = false;
});
}
}
}
if (this.isAddressSelectorOpen) {
this.$data.value = { text: query };
} else if (this.isEnteredCustomAddress) {

View File

@@ -18,6 +18,7 @@
:multiple="false"
@tag="addPostcode"
:tagPlaceholder="$t('create_postal_code')"
:loading="isLoading"
:options="cities">
</VueMultiselect>
</div>
@@ -48,15 +49,17 @@
<script>
import VueMultiselect from 'vue-multiselect';
import { searchCities, fetchCities } from '../../api.js';
export default {
name: 'CitySelection',
components: { VueMultiselect },
props: ['entity', 'focusOnAddress', 'updateMapCenter'],
props: ['entity', 'context', 'focusOnAddress', 'updateMapCenter'],
emits: ['getReferenceAddresses'],
data() {
return {
value: null
value: this.context.edit ? this.entity.address.postcode : null,
isLoading: false
}
},
computed: {
@@ -93,6 +96,15 @@ export default {
},
mounted() {
console.log('writeNew.postcode', this.entity.selected.writeNew.postcode, 'in mounted');
if (this.context.edit) {
this.entity.selected.city = this.value;
this.entity.selected.postcode.name = this.value.name;
this.entity.selected.postcode.code = this.value.code;
this.$emit('getReferenceAddresses', this.value);
if (this.value.center) {
this.updateMapCenter(this.value.center);
}
}
},
methods: {
transName(value) {
@@ -105,7 +117,6 @@ export default {
this.entity.selected.postcode.code = value.code;
this.entity.selected.postcode.coordinates = value.center.coordinates;
this.entity.selected.writeNew.postcode = false;
console.log('writeNew.postcode false, in selectCity');
this.$emit('getReferenceAddresses', value);
this.focusOnAddress();
if (value.center) {
@@ -113,7 +124,33 @@ export default {
}
},
listenInputSearch(query) {
//console.log('listenInputSearch', query, this.isCitySelectorOpen);
if (query.length > 2) {
this.isLoading = true;
searchCities(query, this.entity.selected.country).then(
cities => new Promise((resolve, reject) => {
this.entity.loaded.cities = cities.results.filter(c => c.origin !== 3); // filter out user-defined cities
this.isLoading = false;
resolve();
}))
.catch((error) => {
console.log(error); //TODO better error handling
this.isLoading = false;
});
} else {
if (query.length === 0) { // Fetch all cities when suppressing the query
this.isLoading = true;
fetchCities(this.entity.selected.country).then(
cities => new Promise((resolve, reject) => {
this.entity.loaded.cities = cities.results.filter(c => c.origin !== 3); // filter out user-defined cities
this.isLoading = false;
resolve();
}))
.catch((error) => {
console.log(error)
this.isLoading = false;
});
}
}
if (this.isCitySelectorOpen) {
this.$data.value = { text: query };
} else if (this.isEnteredCustomCity) {

View File

@@ -30,6 +30,7 @@
<city-selection
v-bind:entity="entity"
v-bind:context="context"
v-bind:focusOnAddress="focusOnAddress"
v-bind:updateMapCenter="updateMapCenter"
@getReferenceAddresses="$emit('getReferenceAddresses', selected.city)">
@@ -37,6 +38,7 @@
<address-selection v-if="!isNoAddress"
v-bind:entity="entity"
v-bind:context="context"
v-bind:updateMapCenter="updateMapCenter">
</address-selection>