location: client side validation

This commit is contained in:
nobohan 2021-11-03 13:51:15 +01:00 committed by Julien Fastré
parent 51938a99db
commit 4011fc6e77
2 changed files with 46 additions and 17 deletions

View File

@ -66,7 +66,7 @@ export default {
}))
},
customLabel(value) {
return `${value.locationType.title.fr} ${value.name}`;
return `${value.locationType.title.fr} ${value.name ? value.name : ''}`;
}
}
}

View File

@ -30,7 +30,7 @@
<div class="form-floating mb-3">
<select class="form-select form-select-lg" id="type" required v-model="selectType">
<option selected disabled value="">{{ $t('activity.choose_location_type') }}</option>
<option v-for="t in locationTypes" :value="t.id" :key="t.id">
<option v-for="t in locationTypes" :value="t" :key="t.id">
{{ t.title.fr }}
</option>
</select>
@ -46,10 +46,11 @@
:context="addAddress.context"
:options="addAddress.options"
:addressChangedCallback="submitNewAddress"
v-if="showAddAddress"
ref="addAddress">
</add-address>
<div class="form-floating mb-3">
<div class="form-floating mb-3" v-if="showContactData">
<input class="form-control form-control-lg" id="phonenumber1" v-model="inputPhonenumber1" placeholder />
<label for="phonenumber1">{{ $t('activity.location_fields.phonenumber1') }}</label>
</div>
@ -57,7 +58,7 @@
<input class="form-control form-control-lg" id="phonenumber2" v-model="inputPhonenumber2" placeholder />
<label for="phonenumber2">{{ $t('activity.location_fields.phonenumber2') }}</label>
</div>
<div class="form-floating mb-3">
<div class="form-floating mb-3" v-if="showContactData">
<input class="form-control form-control-lg" id="email" v-model="inputEmail" placeholder />
<label for="email">{{ $t('activity.location_fields.email') }}</label>
</div>
@ -166,7 +167,25 @@ export default {
},
hasPhonenumber1() {
return this.selected.phonenumber1 !== null && this.selected.phonenumber1 !== "";
}
},
showAddAddress() {
let cond = false;
if (this.selected.type) {
if (this.selected.type.addressRequired !== 'never') {
cond = true;
}
}
return cond;
},
showContactData() {
let cond = false;
if (this.selected.type) {
if (this.selected.type.contactData !== 'never') {
cond = true;
}
}
return cond;
},
},
mounted() {
this.getLocationTypesList();
@ -174,18 +193,24 @@ export default {
methods: {
checkForm() {
let cond = true;
console.log('check form');
this.errors = [];
console.log(this.selected.type)
if (this.selected.type) {
//TODO conditional requirements for field
//if (this.selected.type.addressRequired = 'required') ...
cond = true;
} else {
if (!this.selected.type) {
this.errors.push('Type de localisation requis');
cond = false;
} else {
if (this.selected.type.addressRequired === 'required' && !this.selected.addressId) {
this.errors.push('Adresse requise');
cond = false;
}
if (this.selected.type.contactData === 'required' && !this.selected.phonenumber1) {
this.errors.push('Numéro de téléphone requis');
cond = false;
}
if (this.selected.type.contactData === 'required' && !this.selected.email) {
this.errors.push('Adresse email requise');
cond = false;
}
}
return cond;
},
getLocationTypesList() {
@ -204,17 +229,21 @@ export default {
let body = {
type: 'location',
name: this.selected.name,
address: {
id: this.selected.addressId
},
locationType: {
id: this.selected.type,
id: this.selected.type.id,
type: 'location-type'
},
phonenumber1: this.selected.phonenumber1,
phonenumber2: this.selected.phonenumber2,
email: this.selected.email,
};
if (this.selected.addressId) {
body = Object.assign(body, {
address: {
id: this.selected.addressId
}
});
}
postLocation(body).then(location => new Promise(resolve => {
console.log('postLocation', location);
this.locations.push(location);