mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-06-07 18:44:08 +00:00
address selection: add more fields
This commit is contained in:
parent
c3926991ac
commit
15e301b889
@ -3,11 +3,8 @@ import { _createI18n } from 'ChillMainAssets/vuejs/_js/i18n'
|
||||
import { addressMessages } from './js/i18n'
|
||||
import { getDataPromise } from './store'
|
||||
|
||||
|
||||
import App from './App.vue';
|
||||
|
||||
|
||||
|
||||
getDataPromise.then(store => {
|
||||
|
||||
const i18n = _createI18n(addressMessages);
|
||||
|
@ -1,16 +1,22 @@
|
||||
// import { mainMessages } from 'ChillMainAssets/vuejs/_js/i18n' //TODO
|
||||
|
||||
const addressMessages = {
|
||||
fr: {
|
||||
add_an_address: 'Ajouter une adresse',
|
||||
select_an_address: 'Sélectionner une adresse',
|
||||
fill_an_address: 'Compléter l\'adresse',
|
||||
select_country: 'Choisir le pays',
|
||||
select_city: 'Choisir une localité',
|
||||
select_address: 'Choisir une adresse'
|
||||
select_address: 'Choisir une adresse',
|
||||
isNoAddress: 'L\'adresse n\'est pas celle d\'un domicile fixe ?',
|
||||
floor: 'Étage',
|
||||
corridor: 'Couloir',
|
||||
steps: 'Escalier',
|
||||
flat: 'Appartement',
|
||||
buildingName: 'Nom du batiment',
|
||||
extra: 'Complément d\'adresse',
|
||||
distribution: 'Service particulier de distribution'
|
||||
}
|
||||
};
|
||||
|
||||
// Object.assign(appMessages.fr, mainMessages.fr);
|
||||
|
||||
export {
|
||||
addressMessages
|
||||
};
|
||||
|
@ -14,32 +14,48 @@
|
||||
|
||||
<template v-slot:body>
|
||||
|
||||
<div class="address_form__fields">
|
||||
<div class="address_form__fields__isNoAddress">
|
||||
<input type="checkbox" name="isNoAddress" :placeholder="$t('isNoAddress')" v-model="isNoAddress"/>
|
||||
<label for="isNoAddress">{{ $t('isNoAddress') }}</label>
|
||||
</div>
|
||||
|
||||
<div class="address_form__left">
|
||||
<div class="address_form__select">
|
||||
<div class="address_form__select__header">
|
||||
<h4>{{ $t('select_an_address') }}</h4>
|
||||
</div>
|
||||
<div class="address_form__select__left">
|
||||
|
||||
<country-selection>
|
||||
</country-selection>
|
||||
<country-selection>
|
||||
</country-selection>
|
||||
|
||||
<city-selection>
|
||||
</city-selection>
|
||||
<city-selection>
|
||||
</city-selection>
|
||||
|
||||
<address-selection>
|
||||
</address-selection>
|
||||
<address-selection>
|
||||
</address-selection>
|
||||
|
||||
</div>
|
||||
<div class="address_form__map">
|
||||
<address-map ref="addressMap">
|
||||
</address-map>
|
||||
</div>
|
||||
<div class="address_form__map">
|
||||
<address-map ref="addressMap">
|
||||
</address-map>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="!isNoAddress" class="address_form__fields">
|
||||
<input type="text" name="floor" :placeholder="$t('floor')" v-model="floor"/>
|
||||
<input type="text" name="corridor" :placeholder="$t('corridor')" v-model="corridor"/>
|
||||
<input type="text" name="steps" :placeholder="$t('steps')" v-model="steps"/>
|
||||
|
||||
<div class="address_form__fields__header">
|
||||
<h4>{{ $t('fill_an_address') }}</h4>
|
||||
</div>
|
||||
<div class="address_form__fields__left">
|
||||
<input type="text" name="floor" :placeholder="$t('floor')" v-model="floor"/>
|
||||
<input type="text" name="corridor" :placeholder="$t('corridor')" v-model="corridor"/>
|
||||
<input type="text" name="steps" :placeholder="$t('steps')" v-model="steps"/>
|
||||
<input type="text" name="flat" :placeholder="$t('flat')" v-model="flat"/>
|
||||
</div>
|
||||
<div class="address_form__fields__right">
|
||||
<input type="text" name="buildingName" :placeholder="$t('buildingName')" v-model="buildingName"/>
|
||||
<input type="text" name="extra" :placeholder="$t('extra')" v-model="extra"/>
|
||||
<input type="text" name="distribution" :placeholder="$t('distribution')" v-model="distribution"/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@ -91,6 +107,7 @@ export default {
|
||||
return this.$store.state.form.isNoAddress; //TODO could be this.add_address.form.isNoAddress
|
||||
}
|
||||
},
|
||||
//TODO define setter and getter for form input (floor, steps, ...)
|
||||
},
|
||||
methods: {
|
||||
openModal() {
|
||||
|
@ -12,7 +12,6 @@
|
||||
|
||||
export default {
|
||||
name: 'AddressSelection',
|
||||
props: ['item'], //TODO useful?
|
||||
data() {
|
||||
},//TODO useful?
|
||||
computed: {
|
||||
|
@ -12,7 +12,6 @@
|
||||
|
||||
export default {
|
||||
name: 'CitySelection',
|
||||
props: ['item'], //TODO useful?
|
||||
data() {
|
||||
},//TODO useful?
|
||||
computed: {
|
||||
|
@ -12,14 +12,13 @@
|
||||
|
||||
export default {
|
||||
name: 'CountrySelection',
|
||||
props: ['item'],//TODO useful?
|
||||
data() {
|
||||
},//TODO useful?
|
||||
computed: {
|
||||
countries() { return this.$store.getters.getCountries; },
|
||||
selected: {
|
||||
set(value) {
|
||||
this.$store.commit('setSelectedCountry', value);
|
||||
this.$store.commit('setSelectedCountry', value); //TODO we should not change the state here (https://stackoverflow.com/questions/39299042/vuex-action-vs-mutations)
|
||||
},
|
||||
get() {
|
||||
return this.$store.state.selectedCountry;
|
||||
|
Loading…
x
Reference in New Issue
Block a user