code postaux en code de départements (5 chiffres à 2) + changement du get le nid dans la liste étape à droite

config/sync/views.view.etapes.yml

@@ -348,7 +348,7 @@ display:
           entity_field: nid
           plugin_id: field
           label: ''
-          exclude: true
+          exclude: false
           alter:
             alter_text: false
             text: ''

web/themes/custom/caravane/assets/js/main.js

@@ -117,19 +117,11 @@ import router from './router/router';
     function processEtapeLinks(store, map) {
       let etape_li = document.querySelectorAll('#etapes-liste li');
       etape_li.forEach((li) => {
-        let field = li.querySelector('div.views-field-title');
+        let nidElement = li.querySelector('.views-field-nid');
-        let nid = null;
+        let nid = nidElement.innerText;
-        let classList = field.classList;
-        classList.forEach((classe) => {
-          let reg = /data-node-(\d+)/;
-          let result = classe.match(reg);
-          if (result) {
-            nid = result[1];
-          }
-        })
         
         if (nid) {
-          let a = field.querySelector('a');
+          let a = li.querySelector('a');
           a.setAttribute('data-node-nid', nid);
           li.addEventListener('click', (e) => onClickContentLink(e, store, map, 'etape'));
         }

web/themes/custom/caravane/assets/js/vuejs/components/ModaleHeader.vue

@@ -13,7 +13,7 @@
         <div class="locality">
             <div class="top-triangle"></div>
             <div class="locality-title">
-                <h1>{{content.title}} <em v-if="content.adresse">({{ content.adresse.postal_code }})</em></h1>
+                <h1>{{content.title}} <em v-if="content.adresse">({{ content.adresse.postal_code.slice(0, 2) }})</em></h1>
             </div>
         </div>
     </header>

web/themes/custom/caravane/assets/scss/main.scss

@@ -312,7 +312,7 @@ body{
                 }
               }
               .leaflet-tooltip-pane {
-                width: 20vw;
+                width: 25vw;
                 pointer-events: none;
                 > div {
                   padding: 0;
@@ -326,7 +326,7 @@ body{
                     max-height: 15vh;
                     overflow: hidden;
                     display: grid;
-                    grid-template-columns: minmax(10px, 10vw) 10vw;
+                    grid-template-columns: minmax(10px, 12.5vw) 12.5vw;
                     grid-template-rows: 1.5fr 0.5fr;
                     transform: translateY(-60%);
                     background-color: white;
@@ -337,10 +337,11 @@ body{
                       grid-row: 1 / span 1;
                       font-family: 'Joost', sans-serif;
                       font-size: $m-font-size;
-                      display: flex;
+/*                       display: flex;
                       flex-direction: column;
                       justify-content: center;
                       align-items: center;
+ */                      
                       padding-top: 10px;
                       padding-left: 20px;
                       padding-right: 20px;
@@ -349,7 +350,10 @@ body{
                         font-weight: bold;
                         text-decoration: none;
                         color: $main-color;
-                        padding-right: 10px;
+                        padding-right: 5px;
+                        > span {
+                          font-weight: lighter;
+                        }
                       }
                     }
                     > div:nth-of-type(2) {
@@ -500,6 +504,9 @@ body{
                       p {
                         margin: 0;
                       }
+                      > .views-field-nid {
+                        display: none;
+                      }
                       > .views-field-title {
                         grid-column: 1 / span 1;
                         grid-row: 1 / span 1;

web/themes/custom/caravane/templates/views-view-field--block-1--etape-list.html.twig

@@ -20,4 +20,12 @@
  * @ingroup themeable
  */
 #}
-<p>{{- output -}}</p>
+{% if output|length == 5 
+    and output|replace(
+        {'0':'', '1':'', '2':'', '3':'', '4':'', '5':'', '6':'', '7':'', '8':'', '9':''}
+    ) == '' 
+%}
+  <p>{{- output|slice(0, 2) -}}</p>
+{% else %}
+  <p>{{- output -}}</p>
+{% endif %}

web/themes/custom/caravane/templates/views-view-field--block-2--popup-map.html.twig

@@ -24,9 +24,20 @@
     {% if output %}
         {% set separated_contents = output|split('\n') %}
         {% for content in separated_contents %}
-            {% if content != '' %}
+            {% if (content|trim ends with ')') %}
-                <div class="separated-content">{{ content|trim }}</div>
+                {% if content != '' %}
+                    <div class="separated-content">
+                        {{ content|trim|slice(0, -12) }}
+                        <span>{{ content|trim|slice(-7, content|trim|length - 1)|slice(0, -4) }})</span></a>
+                    </div>
+                {% endif %} 
+            {% else %}
+                {% if content != '' %}
+                    <div class="separated-content">{{ content|trim }}</div>
+                {% endif %} 
             {% endif %}
+
+
         {% endfor %}
     {% endif %}
 </div