vue Address: fix ShowAddress multiline option

This commit is contained in:
Mathieu Jaumotte 2021-08-19 15:41:54 +02:00
parent 2394895ccb
commit fd8f4a98c0
3 changed files with 64 additions and 61 deletions

View File

@ -1,7 +1,7 @@
<template>
<div class="chill-entity entity-address my-3"></div>
<component :is="component" class="chill-entity entity-address my-3">
<component :is="component" :class="'address'+ isMultiline">
<component :is="component" class="address" :class="multiline">
<p v-if="address.text"
class="street">
{{ address.text }},
@ -14,7 +14,9 @@
class="country">
{{ address.country.name.fr }}
</p>
</component>
<div v-if="isMultiline">
<div v-if="address.floor">
<span class="floor">
<b>{{ $t('floor') }}</b>: {{ address.floor }}
@ -72,8 +74,9 @@
</span>
</div>
</div>
</component>
</div>
</component>
</template>
<script>
@ -83,25 +86,25 @@ export default {
address: {
type: Object
},
multiline: {
isMultiline: {
default: true,
type: Boolean
}
},
computed: {
component(){
return this.multiline == true ? "div" : "span";
return this.isMultiline == true ? "div" : "span";
},
isMultiline(){
return this.multiline == true ? " multiline" : "";
multiline(){
return this.isMultiline == true ? "multiline" : "";
}
}
};
</script>
<style lang="scss" scoped>
p{
&:after{
p {
&:after {
content: " ";
margin-right: 0.3em;
}

View File

@ -64,9 +64,9 @@
<div class="item-col">
<ul class="list-content fa-ul">
<!-- ADDRESS -->
<li v-if="person.current_household_address" class="chill-entity entity-address">
<li v-if="person.current_household_address">
<i class="fa fa-li fa-map-marker"></i>
<show-address :address="person.current_household_address" :multiline="false"></show-address>
<show-address :address="person.current_household_address" :isMultiline="false"></show-address>
</li>
<!-- PHONENUMBER -->
<!-- todo: change href for phonenumbers and format phone number? -->

View File

@ -49,9 +49,9 @@
<div class="item-col">
<ul class="list-content fa-ul">
<!-- ADDRESS -->
<li v-if="thirdparty.resource.address" class="chill-entity entity-address">
<li v-if="thirdparty.resource.address">
<i class="fa fa-li fa-map-marker"></i>
<show-address :address="thirdparty.resource.address" :multiline="false"></show-address>
<show-address :address="thirdparty.resource.address" :isMultiline="false"></show-address>
</li>
<!-- PHONENUMBER -->
<!-- todo: change href for phonenumbers -->