mirror of
https://gitlab.com/Chill-Projet/chill-bundles.git
synced 2025-08-21 23:23:51 +00:00
Entity/PersonRenderBox.vue with render=badge
This commit is contained in:
@@ -4,51 +4,44 @@
|
||||
<div class="item-col">
|
||||
|
||||
<!-- identifier -->
|
||||
<div v-if="isHouseholdNew()" class="identifier">
|
||||
<div v-if="isHouseholdNew()" class="h4">
|
||||
<i class="fa fa-home"></i>
|
||||
{{ $t('new_household') }}
|
||||
</div>
|
||||
<div v-else class="identifier">
|
||||
<div v-else class="h4">
|
||||
<i class="fa fa-home"></i>
|
||||
{{ $t('household_number', { number: household.id } ) }}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="item-col">
|
||||
<ul class="list-content fa-ul">
|
||||
|
||||
<!-- member part -->
|
||||
<li v-if="hasCurrentMembers" class="members">
|
||||
<i class="fa fa-li fa-user" :title="$t('current_members')"></i>
|
||||
<template v-for="(m, index) in currentMembers()" :key="m.id">
|
||||
<span v-if="m.holder">
|
||||
<span class="badge bg-primary">{{ $t('holder') }}</span>
|
||||
</span>
|
||||
<span v-if="index != (currentMembersLength() - 1)">, </span>
|
||||
<div v-if="hasCurrentMembers" class="members" :title="$t('current_members')">
|
||||
<template v-for="m in currentMembers()" :key="m.id">
|
||||
<person-render-box render="badge"
|
||||
:person="m.person"
|
||||
:options="{
|
||||
isHolder: m.holder,
|
||||
addLink: true
|
||||
}">
|
||||
</person-render-box>
|
||||
</template>
|
||||
</li>
|
||||
<li v-else class="members">
|
||||
<i class="fa fa-li fa-user" :title="$t('current_members')"></i>
|
||||
</div>
|
||||
<div v-else class="members" :title="$t('current_members')">
|
||||
<p class="chill-no-data-statement">{{ $t('no_members_yet') }}</p>
|
||||
</li>
|
||||
</div>
|
||||
|
||||
<!-- address part -->
|
||||
<li v-if="hasAddress()" class="where">
|
||||
<i class="fa fa-li fa-map-marker"></i>
|
||||
<show-address :address="household.current_address"></show-address>
|
||||
</li>
|
||||
<li v-else class="where">
|
||||
<i class="fa fa-li fa-map-marker"></i>
|
||||
<p class="chill-no-data-statement">{{ $t('no_current_address') }}</p>
|
||||
</li>
|
||||
<div v-if="hasAddress()" class="where">
|
||||
<i class="fa fa-fw fa-map-marker"></i>
|
||||
<show-address :address="household.current_address" isMultiline="false"></show-address>
|
||||
</div>
|
||||
<div v-else class="where">
|
||||
<i class="fa fa-fw fa-map-marker"></i>
|
||||
<span class="chill-no-data-statement">{{ $t('no_current_address') }}</span>
|
||||
</div>
|
||||
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -117,15 +110,17 @@ export default {
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
section.chill-entity {
|
||||
&.entity-household {
|
||||
|
||||
/*
|
||||
.identifier {
|
||||
//grid-area: iden;
|
||||
font-size: 1.3em;
|
||||
font-weight: 700;
|
||||
color: var(--chill-blue);
|
||||
}
|
||||
/*
|
||||
display: grid;
|
||||
grid-template-columns: auto auto 30%;
|
||||
grid-template-areas:
|
||||
|
@@ -9,7 +9,7 @@
|
||||
|
||||
<div :class="'denomination h' + options.hLevel">
|
||||
|
||||
<a v-if="this.options.addLink == true" href="#">
|
||||
<a v-if="this.options.addLink === true" :href="getUrl">
|
||||
<span class="firstname">{{ person.firstName }}</span>
|
||||
<span class="lastname">{{ person.lastName }}</span>
|
||||
<span v-if="person.altNames && options.addAltNames == true" class="altnames">
|
||||
@@ -88,6 +88,27 @@
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<span v-if="render === 'badge'"
|
||||
class="chill-entity entity-person badge-person">
|
||||
|
||||
<a v-if="this.options.addLink === true" :href="getUrl">
|
||||
<span v-if="options.isHolder" class="fa-stack fa-holder" :title="$t('renderbox.holder')">
|
||||
<i class="fa fa-circle fa-stack-1x text-success"></i>
|
||||
<i class="fa fa-stack-1x">T</i>
|
||||
</span>
|
||||
{{ person.text }}
|
||||
</a>
|
||||
|
||||
<span v-else>
|
||||
<span v-if="options.isHolder" class="fa-stack fa-holder" :title="$t('renderbox.holder')">
|
||||
<i class="fa fa-circle fa-stack-1x text-success"></i>
|
||||
<i class="fa fa-stack-1x">T</i>
|
||||
</span>
|
||||
{{ person.text }}
|
||||
</span>
|
||||
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -132,12 +153,26 @@ export default {
|
||||
return this.person.altNames[i].key
|
||||
}
|
||||
},
|
||||
getUrl() {
|
||||
return `/fr/person/${this.person.id}/general`;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang='scss'>
|
||||
|
||||
span.fa-holder {
|
||||
width: 1em;
|
||||
margin: -10px 0.3em -8px 0;
|
||||
i:last-child {
|
||||
font-weight: 900;
|
||||
color: white;
|
||||
font-size: 70%;
|
||||
font-family: "Open Sans Extrabold";
|
||||
}
|
||||
}
|
||||
|
||||
.lastname:before{
|
||||
content: " "
|
||||
}
|
||||
@@ -150,6 +185,7 @@ div.flex-table {
|
||||
}
|
||||
div.item-col:last-child {
|
||||
justify-content: flex-start;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user