started map: drawing concernement with entities and contours

src/App.vue

@@ -1,27 +1,71 @@
+<script>
+import { RouterLink, RouterView } from 'vue-router'
 
+import { mapState, mapActions } from 'pinia'
+import { UserStore } from '@/stores/user'
+import { ConcernementsStore } from '@/stores/concernements'
 
-<script setup>
-  import { onMounted } from 'vue';
-  import { RouterLink, RouterView } from 'vue-router'
-  import { UserStore } from '@/stores/user'
-  import Header from '@components/Header.vue'
+import StaticMenu from '@components/block/StaticMenu.vue'
+import UserBlock from '@components/block/UserBlock.vue'
 
+import MapConcernements from '@components/MapConcernements.vue'
+import ConcernementMapItem from '@components/ConcernementMapItem.vue'
 
-  const userStore = UserStore()
-
-  onMounted(() => {
+export default {
+  created () {
+    this.loadConcernements()
+  },
+  mounted () {
     console.log('APP onMounted')
-    userStore.checkUser()
-  })
-
+    this.checkUser()      
+  },
+  computed: {
+    ...mapState(UserStore,['isloggedin']),
+    ...mapState(ConcernementsStore,['concernements'])
+  },
+  methods: {
+    ...mapActions(ConcernementsStore,['loadConcernements']),
+    ...mapActions(UserStore,['checkUser'])
+  },
+  components: {
+    MapConcernements,
+    ConcernementMapItem,
+    StaticMenu,
+    UserBlock
+  }
+}
 
 </script>
 
 <template>
-  <Header />
+  <header id="header">
+    <div class="row top">
+      <h1>
+        <router-link :to="{ name: 'home' }">Où atterrir</router-link>  
+      </h1>
+    </div>
+    <div class="row bottom">
+      <StaticMenu/>
+      <UserBlock/>
+    </div>
+  </header>
+
   <div id="main-content">
-    <RouterView />
+    <MapConcernements v-if="isloggedin">
+      <ConcernementMapItem
+        v-for="concernement in concernements"
+        :key="concernement.id"
+        :concernement="concernement"
+      />
+      <!-- <ConcernementMapItem
+        :concernement="concernements[0]"
+      /> -->
+    </MapConcernements>
+    <div class="row">
+      <RouterView />
+    </div>
   </div>
+
 </template>
 
 <style lang="scss" scoped>