Create client geo auto fill
gitea/salix/2034-postcode_autocomplete There was a failure building this commit Details

This commit is contained in:
Joan Sanchez 2020-02-21 12:39:41 +01:00
parent 2dbde24a99
commit 7b57d79f50
6 changed files with 213 additions and 131 deletions

View File

@ -35,6 +35,13 @@
"foreignKey": "zoneFk"
}
},
"scopes": {
"location": {
"include": {
"relation": "country"
}
}
},
"acls": [
{
"accessType": "READ",

View File

@ -52,7 +52,14 @@ export default class Datalist extends Textfield {
validSelection(selection) {
return this.modelData && this.modelData.find(item => {
return item[this.valueField] == selection;
let dataValue = item[this.valueField];
if (typeof(dataValue) === 'string')
dataValue = dataValue.toLowerCase();
if (typeof(selection) === 'string')
selection = selection.toLowerCase();
return dataValue == selection;
});
}

View File

@ -49,76 +49,57 @@
</vn-textfield>
</vn-horizontal>
<vn-horizontal>
<vn-autocomplete
vn-id="country"
vn-one
<vn-autocomplete vn-id="country" vn-one
ng-model="$ctrl.client.countryFk"
url="Countries"
show-field="country"
value-field="id"
label="Country">
</vn-autocomplete>
<vn-autocomplete
vn-id="province"
vn-one
url="Provinces"
<vn-autocomplete vn-id="province" vn-one
label="Province"
ng-model="$ctrl.client.provinceFk"
selection="$ctrl.province"
url="Provinces/location"
fields="['id', 'name', 'countryFk']"
where="{countryFk: country.selection.id}"
show-field="name"
value-field="id"
label="Province">
rule>
<tpl-item>{{name}} ({{country.country}})</tpl-item>
</vn-autocomplete>
</vn-horizontal>
<vn-horizontal>
<vn-textfield
vn-one
<vn-datalist vn-id="town" vn-one
label="City"
ng-model="$ctrl.client.city"
rule>
</vn-textfield>
<!--
<vn-autocomplete vn-id="town" vn-one
label="City"
url="Towns"
fields="['id', 'name']"
selection="$ctrl.town"
url="Towns/location"
fields="['id', 'name', 'provinceFk']"
where="{provinceFk: province.selection.id}"
show-field="name"
value-field="name"
ng-model="$ctrl.client.city">
</vn-autocomplete>
<vn-icon-button
vn-auto
class="vn-my-md"
icon="add_circle"
vn-tooltip="New postcode"
ng-click="postcode.open()">
</vn-icon-button>
-->
<vn-textfield
vn-one
value-field="name">
<tpl-item>
{{name}}, {{province.name}}
({{province.country.country}})
</tpl-item>
</vn-datalist>
<vn-datalist vn-one
label="Postcode"
ng-model="$ctrl.client.postcode"
rule>
</vn-textfield>
<!--
<vn-autocomplete
vn-one
selection="$ctrl.postcode"
url="Postcodes/location"
fields="['code','townFk']"
ng-model="$ctrl.client.postcode"
selection="$ctrl.postcodeSelection"
search-function="{code: $search}"
where="{townFk: town.selection.id}"
order="code, townFk"
show-field="code"
value-field="code"
label="Postcode">
show-field="code"
rule>
<tpl-item>
{{code}}, {{town.name}} - {{town.province.name}}
({{town.province.country.country}})
</tpl-item>
</vn-autocomplete>
-->
</vn-datalist>
</vn-horizontal>
<vn-horizontal>
<vn-textfield

View File

@ -12,12 +12,59 @@ export default class Controller {
};
}
get postcodeSelection() {
return this._postcodeSelection;
onResponse(response) {
this.client.postcode = response.code;
}
set postcodeSelection(selection) {
this._postcodeSelection = selection;
onSubmit() {
return this.$.watcher.submit().then(
json => this.$state.go('client.card.basicData', {id: json.data.id})
);
}
get province() {
return this._province;
}
// Province auto complete
set province(selection) {
this._province = selection;
if (!selection) return;
const country = selection.country;
this.client.countryFk = country.id;
}
get town() {
return this._town;
}
// Town auto complete
set town(selection) {
this._town = selection;
if (!selection) return;
const province = selection.province;
const country = province.country;
const postcodes = selection.postcodes;
this.client.provinceFk = province.id;
this.client.countryFk = country.id;
if (postcodes.length === 1)
this.client.postcode = postcodes[0].code;
}
get postcode() {
return this._postcode;
}
// Postcode auto complete
set postcode(selection) {
this._postcode = selection;
if (!selection) return;
@ -29,17 +76,8 @@ export default class Controller {
this.client.provinceFk = province.id;
this.client.countryFk = country.id;
}
onResponse(response) {
this.client.postcode = response.code;
}
onSubmit() {
return this.$.watcher.submit().then(
json => this.$state.go('client.card.basicData', {id: json.data.id})
);
}
}
Controller.$inject = ['$scope', '$state', '$http', '$translate', 'vnApp'];
ngModule.component('vnClientCreate', {

View File

@ -33,9 +33,7 @@
</vn-textfield>
</vn-horizontal>
<vn-horizontal>
<vn-autocomplete
vn-one
vn-id="country"
<vn-autocomplete vn-id="country" vn-one
ng-model="$ctrl.client.countryFk"
url="Countries"
show-field="country"
@ -43,51 +41,44 @@
label="Country"
rule>
</vn-autocomplete>
<vn-autocomplete
vn-one
vn-id="province"
<vn-autocomplete vn-id="province" vn-one
label="Province"
ng-model="$ctrl.client.provinceFk"
url="Provinces"
selection="$ctrl.province"
url="Provinces/location"
fields="['id', 'name', 'countryFk']"
where="{countryFk: country.selection.id}"
show-field="name"
value-field="id"
label="Province"
rule>
<tpl-item>{{name}} ({{country.country}})</tpl-item>
</vn-autocomplete>
</vn-horizontal>
<vn-horizontal>
<vn-textfield
vn-one
<vn-datalist vn-id="town" vn-one
label="City"
ng-model="$ctrl.client.city"
rule>
</vn-textfield>
<vn-textfield
vn-one
label="Postcode"
ng-model="$ctrl.client.postcode"
rule>
</vn-textfield>
<!-- <vn-autocomplete vn-id="town" vn-one
label="City"
url="Towns"
fields="['id', 'name']"
selection="$ctrl.town"
url="Towns/location"
fields="['id', 'name', 'provinceFk']"
where="{provinceFk: province.selection.id}"
show-field="name"
value-field="name"
ng-model="$ctrl.client.city">
</vn-autocomplete>
<vn-autocomplete vn-id="postcode" vn-one
value-field="name">
<tpl-item>{{name}} ({{province.name}}, {{province.country.country}})</tpl-item>
</vn-datalist>
<vn-datalist vn-one
label="Postcode"
ng-model="$ctrl.client.postcode"
selection="$ctrl.postcode"
url="Postcodes/location"
fields="['code','townFk']"
ng-model="$ctrl.client.postcode"
search-function="{code: $search}"
where="{townFk: town.selection.id}"
order="code, townFk"
show-field="code"
value-field="code"
label="Postcode">
</vn-autocomplete> -->
show-field="code"
rule>
<tpl-item>{{code}} - {{town.name}} ({{town.province.name}}, {{town.province.country.country}})</tpl-item>
</vn-datalist>
</vn-horizontal>
<vn-horizontal>
<vn-check

View File

@ -76,6 +76,64 @@ export default class Controller extends Component {
this.$.$apply();
}
get province() {
return this._province;
}
// Province auto complete
set province(selection) {
const oldValue = this._province;
this._province = selection;
if (!selection || !oldValue) return;
const country = selection.country;
this.client.countryFk = country.id;
}
get town() {
return this._town;
}
// Town auto complete
set town(selection) {
const oldValue = this._town;
this._town = selection;
if (!selection || !oldValue) return;
const province = selection.province;
const country = province.country;
const postcodes = selection.postcodes;
this.client.provinceFk = province.id;
this.client.countryFk = country.id;
if (postcodes.length === 1)
this.client.postcode = postcodes[0].code;
}
get postcode() {
return this._postcode;
}
// Postcode auto complete
set postcode(selection) {
const oldValue = this._postcode;
this._postcode = selection;
console.log(selection);
if (!selection || !oldValue) return;
const town = selection.town;
const province = town.province;
const country = province.country;
console.log(province.id);
this.client.city = town.name;
this.client.provinceFk = province.id;
this.client.countryFk = country.id;
}
}
ngModule.component('vnClientFiscalData', {