splitted concernement content cartouche into components for each mapmode, completed terrain de vie concernement display

src/components/contents/TerrainDeVie.vue

@@ -0,0 +1,74 @@
+<script>
+
+import { mapActions, mapState } from 'pinia'
+import { ConcernementsStore } from '@stores/concernements'
+import { UserStore } from '@/stores/user'
+import { CommonStore } from '@/stores/common'
+
+export default {
+  props: ['id', 'eid', 'entite'],
+  data(){
+    return {
+
+    }
+  },
+  computed: {
+    ...mapState(ConcernementsStore,['opened_concernement']),
+    ...mapState(ConcernementsStore,['ct_concernement']),
+    ...mapState(ConcernementsStore,['ct_entite']),
+    ...mapState(UserStore,['name']),
+    created(){
+      let d = new Date(this.opened_concernement.created); 
+      console.log('d', d);
+      return d.toLocaleDateString("fr-FR");//.toISOString().split('T')[0];
+    },
+    changed(){
+      let d = new Date(this.opened_concernement.changed); 
+      console.log('d', d);
+      return d.toLocaleDateString("fr-FR");//.toISOString().split('T')[0];
+    }
+  },
+  created () {
+    console.log(`terrain de vie content created, id: ${this.id}, eid: ${this.eid}, opened_concernement:`, this.opened_concernement);
+  }
+}
+
+</script>
+
+<template>
+  <!-- concernement -->
+  <section
+    v-if="!entite"
+    class="content-concernement">
+    <section class="description">
+        <label v-if="ct_concernement">{{ ct_concernement.field_description.description }}</label>
+        <div v-html="opened_concernement.description"/>
+    </section>
+    <section class="caillou">
+        <label v-if="ct_concernement">{{ ct_concernement.field_caillou.description }}</label>
+        <div v-html="opened_concernement.caillou "/>
+    </section>
+    <section class="infos">
+      <p>
+        <span class="author"><span>une enquête de</span> {{ opened_concernement.author.username }}</span><br/>
+        <span class="structure" v-if="opened_concernement.author.structure"><span>avec</span> {{ opened_concernement.author.structure[0].name }}</span><br/>
+        <span class="lieu" v-if="opened_concernement.lieu"><span>à</span> {{ opened_concernement.lieu[0].name }}</span><br/>
+        <span class="created"><span>démarrée le</span> {{ created }}</span><br/>
+        <span class="changed"><span>mise à jour le</span> {{ changed }}</span>
+      </p>
+    </section>
+  </section>
+  <!-- entite -->
+  <section
+    v-if="entite"
+    class="content-entite">
+    <section class="action">
+        <label v-if="ct_entite">{{ ct_entite.field_action.description }}</label>
+        <div v-html="entite.action"/>
+    </section>
+    <section class="menace-maintien">
+        <label v-if="ct_entite">{{ ct_entite.field_menace_maintien.description }}</label>
+        <div v-html="entite.menacemaintien"/>
+    </section>
+  </section>
+</template>