postcode autocompletion fixes
gitea/salix/master This commit looks good Details

This commit is contained in:
Joan Sanchez 2019-08-02 08:27:55 +02:00
parent e7511aefdc
commit 2ff374e7ba
6 changed files with 62 additions and 41 deletions

View File

@ -1,6 +1,7 @@
import ngModule from '../../module';
import Input from '../../lib/input';
import assignProps from '../../lib/assign-props';
import {mergeWhere} from 'vn-loopback/util/filter';
import './style.scss';
/**
@ -163,6 +164,8 @@ export default class Autocomplete extends Input {
else
where[this.valueField] = this._field;
where = mergeWhere(where, this.fetchFunction);
let filter = {
fields: this.$.dropDown.getFields(),
where: where
@ -292,6 +295,17 @@ export default class Autocomplete extends Input {
this.assignDropdownProps();
this.$.dropDown.show(this.input, search);
}
get fetchFunction() {
return this._fetchFunction;
}
set fetchFunction(value) {
this._fetchFunction = value;
if (value)
this.refreshSelection();
}
}
Autocomplete.$inject = ['$element', '$scope', '$http', '$transclude', '$translate', '$interpolate'];
@ -317,7 +331,8 @@ ngModule.component('vnAutocomplete', {
order: '@?',
limit: '<?',
translateFields: '<?',
searchFunction: '&?'
searchFunction: '&?',
fetchFunction: '<?'
},
transclude: {
tplItem: '?tplItem'

View File

@ -71,7 +71,6 @@ describe('Client', () => {
expect(controller.address.city).toEqual('New York');
expect(controller.address.provinceFk).toEqual(1);
expect(controller.address.countryFk).toEqual(2);
});
});
});

View File

@ -60,9 +60,10 @@
url="/api/Postcodes/location"
fields="['code', 'townFk']"
field="$ctrl.address.postalCode"
where="{townFk: town.selection.id}"
selection="$ctrl.postcodeSelection"
search-function="{code: $search}"
where="{townFk: town.selection.id}"
fetch-function="{townFk: town.selection.id}"
order="code, townFk"
show-field="code"
value-field="code"

View File

@ -79,7 +79,6 @@ describe('Client', () => {
expect(controller.address.city).toEqual('New York');
expect(controller.address.provinceFk).toEqual(1);
expect(controller.address.countryFk).toEqual(2);
});
});
});

View File

@ -28,12 +28,39 @@
</vn-textfield>
</vn-horizontal>
<vn-horizontal>
<vn-autocomplete vn-id="country" vn-one
field="$ctrl.client.countryFk"
url="/api/Countries"
show-field="country"
value-field="id"
label="Country">
</vn-autocomplete>
<vn-autocomplete vn-id="province" vn-one
field="$ctrl.client.provinceFk"
url="/api/Provinces"
where="{countryFk: country.selection.id}"
show-field="name"
value-field="id"
label="Province">
</vn-autocomplete>
</vn-horizontal>
<vn-horizontal>
<vn-autocomplete vn-id="town" vn-one
label="City"
url="/api/Towns"
fields="['id', 'name']"
where="{provinceFk: province.selection.id}"
show-field="name"
value-field="name"
field="$ctrl.client.city">
</vn-autocomplete>
<vn-autocomplete vn-id="postcode" vn-one
field="$ctrl.client.postcode"
on-change="$ctrl.setLocation()"
search-function="{code: $search}"
url="/api/Postcodes/location"
fields="['code', 'townFk']"
field="$ctrl.client.postcode"
selection="$ctrl.postcodeSelection"
search-function="{code: $search}"
where="{townFk: town.selection.id}"
show-field="code"
value-field="code"
label="Postcode">
@ -42,31 +69,6 @@
({{town.province.country.country}})
</tpl-item>
</vn-autocomplete>
<vn-autocomplete vn-one
label="City"
url="/api/Towns"
show-field="name"
value-field="name"
field="$ctrl.client.city">
</vn-autocomplete>
</vn-horizontal>
<vn-horizontal>
<vn-autocomplete vn-one
disabled="true"
field="$ctrl.client.provinceFk"
url="/api/Provinces"
show-field="name"
value-field="id"
label="Province">
</vn-autocomplete>
<vn-autocomplete vn-one
disabled="true"
field="$ctrl.client.countryFk"
url="/api/Countries"
show-field="country"
value-field="id"
label="Country">
</vn-autocomplete>
</vn-horizontal>
<vn-horizontal pad-small-v>
<vn-check

View File

@ -57,16 +57,21 @@ export default class Controller {
}
}
setLocation() {
const location = this.$.postcode.selection;
if (!location || !location.town) return;
const town = location.town;
const province = town.province;
const country = province.country;
get postcodeSelection() {
return this._postcodeSelection;
}
this.client.city = location.town.name;
this.client.provinceFk = province.id;
this.client.countryFk = country.id;
set postcodeSelection(selection) {
const hasValue = this._postcodeSelection;
this._postcodeSelection = selection;
if (!selection || !hasValue) return;
const town = selection.town;
const province = town.province;
this.address.city = town.name;
this.address.provinceFk = province.id;
}
}
Controller.$inject = ['$scope', '$http', 'vnApp', '$translate'];