plier deplier infos meta concernement #2232

This commit is contained in:
Bachir Soussi Chiadmi 2023-07-15 22:28:44 +02:00
parent 0bb60fe21e
commit 8fb1a716dc
2 changed files with 53 additions and 12 deletions

View File

@ -161,7 +161,7 @@ body{
display: block;
font-weight: 100;
font-size: 0.882em;
padding: 1em 0 1em 0;
padding: 0.5em 0;
}
}
div.concernement-cartouche-icons{
@ -359,10 +359,28 @@ body{
}
>footer{
section.infos{
>div{
position: relative;
svg.open-btn{
position: absolute;
right:0;
top: 0;
cursor: pointer;
}
div.wrapper{
overflow-y: hidden;
max-height: 0.1px;
transition: all 0.5s ease-in-out;
&.opened{
max-height: 200px;
}
}
div.info{
font-size: 0.882em;
font-weight: 100;
// white-space:nowrap;
&.author{
cursor: pointer;
}
>span.label{
font-weight: 100;
}
@ -408,7 +426,7 @@ body{
display: block;
font-weight: 100;
font-size: 0.882em;
padding: 0 0 1em 0;
padding: 0 0 0.5em 0;
}
ul, li{
padding:0; margin:0;

View File

@ -11,12 +11,19 @@ import Entite from '@components/contents/Entite.vue';
import VueSlider from 'vue-slider-component'
import 'vue-slider-component/theme/default.css'
import SvgIcon from '@jamescoyle/vue-icon';
import { mdiChevronRight } from '@mdi/js';
import { mdiChevronDown } from '@mdi/js';
export default {
props: ['id', 'eid', 'entite'],
data(){
return {
history_value: 0,
history_slider_ops: null
history_slider_ops: null,
infos_opened: false,
chevronright_path: mdiChevronRight,
chevrondown_path: mdiChevronDown,
}
},
computed: {
@ -79,12 +86,16 @@ export default {
}
},
methods: {
...mapActions(ConcernementsStore, ['setActiveRevision']) // 'loadConcernementsRevisions'
...mapActions(ConcernementsStore, ['setActiveRevision']), // 'loadConcernementsRevisions'
onClickInfos(){
this.infos_opened = !this.infos_opened;
}
},
components: {
CartoucheLayout,
Entite,
VueSlider
VueSlider,
SvgIcon
}
}
@ -120,12 +131,24 @@ export default {
<template v-slot:footer>
<section class="infos">
<div class="author"><span>une enquête de</span> {{ opened_concernement.author.username }}<br/></div>
<div class="structure" v-if="opened_concernement.author.structure.length"><span>avec</span> {{ opened_concernement.author.structure[0].name }}<br/></div>
<div class="lieu" v-if="opened_concernement.lieu.length"><span>à</span> {{ opened_concernement.lieu[0].name }}<br/></div>
<div class="created"><span>démarrée le</span> {{ created }}<br/></div>
<div class="changed"><span>mise à jour le</span> {{ changed }}</div>
<div class="recit-colophon" v-if="opened_concernement.recit_colophon" v-html="opened_concernement.recit_colophon"/>
<svg-icon
type="mdi"
:path="!infos_opened ? chevronright_path : chevrondown_path"
class="open-btn"
@click="onClickInfos"
></svg-icon>
<div
class="author info"
@click="onClickInfos">
<span>une enquête de</span> {{ opened_concernement.author.username }}<br/>
</div>
<div class="wrapper" :class="{ 'opened': infos_opened }">
<div class="info structure" v-if="opened_concernement.author.structure.length"><span>avec</span> {{ opened_concernement.author.structure[0].name }}<br/></div>
<div class="info lieu" v-if="opened_concernement.lieu.length"><span>à</span> {{ opened_concernement.lieu[0].name }}<br/></div>
<div class="info created"><span>démarrée le</span> {{ created }}<br/></div>
<div class="info changed"><span>mise à jour le</span> {{ changed }}</div>
<div class="info recit-colophon" v-if="opened_concernement.recit_colophon" v-html="opened_concernement.recit_colophon"/>
</div>
</section>
<section class="sliders" v-if="history_slider_ops">