amdin front: creating reponse (ressource) to besoin OK

src/assets/main.scss

@@ -1312,4 +1312,8 @@ div.add-entite-btn{
 
 div.add-besoin-btn{
   @include add-btn();
+}
+
+div.add-ressource-btn{
+  @include add-btn();
 }

src/components/contents/PuissanceAgir.vue

@@ -40,7 +40,8 @@ export default {
     ...mapState(UserStore,['isloggedin', 'csrf_token']),
     ...mapState(ConcernementsStore,['opened_concernement',
                                     'ct_concernement',
-                                    'ct_entite'
+                                    'ct_entite',
+                                    'allBesoinsById'
                                   ]),
     ...mapState(CommonStore,['hover_elmt'])
   },
@@ -155,6 +156,90 @@ export default {
         // resolve('test')
       })
     },
+    addRessource(besoin_id){
+      console.log('addRessource', besoin_id);
+      this.reloading_concernements = true;
+      // 1 create reponse node
+      this.createRessourceNode(besoin_id)
+        .then((ressource) => {
+          console.log('createRessourceNode then node', ressource);
+          // 2 record new besoin in concernement's field_besoin 
+          // this.recordBesoinRessourceField(besoin_id, ressource)
+          //   .then((besoin) => {
+          //     console.log('besoin', besoin);
+              // reload the map item
+              this.reloadConcernementBesoins(this.cid)
+                .then(() => {
+                  this.reloading_concernements = false;
+                });
+            // })
+        })
+    },
+    createRessourceNode(besoin_id){
+      return new Promise((resolve, reject) => {
+        // 1 create entite node
+        let besoin_title = this.allBesoinsById[besoin_id].title;
+        const params_node_ressource = {
+          type: 'reponse',
+          title: [{value:`reponse-${besoin_title}-${Date.now()}`}],
+          field_besoin_on_reponses: [{target_id: besoin_id}],
+          field_confidentialite: [{value:'confidentialite_public'}]
+        };
+        
+        const configs = {
+          headers: {'X-CSRF-Token': this.csrf_token}
+        };
+
+        REST.post(`/node?_format=json`, params_node_ressource, configs)
+          .then(({ data }) => {
+            console.log('REST post new node ressource', data);
+            resolve(data)
+          })
+          .catch(error => {
+            console.warn(`Issue with post new node ressource`, error)
+            reject(error)
+          })
+      })
+    },
+    recordBesoinRessourceField(besoin_id, new_reponse){
+      return new Promise((resolve, reject) => {
+        // 3 record concernement field_entite
+
+        // get all the field_entite values, we don't want to ersae everything
+        let reponses = [];
+        this.allBesoinsById[besoin_id].reponses.forEach((reponse) =>{
+          reponses.push({
+            target_id: reponse.id
+          })
+        })
+        // add the new field value
+        reponses.push({
+          target_id: new_reponse.nid[0].value
+        })
+        console.log('reponses', reponses);
+        
+        const params_node = {
+          type: 'besoin',
+          nid: [{value: besoin_id}],
+          'field_reponse': reponses
+        };
+        
+        const configs = {
+          headers: {'X-CSRF-Token': this.csrf_token}
+        };
+
+        REST.patch(`/node/${this.cid}?_format=json`, params_node, configs)
+          .then(({ data }) => {
+            console.log('REST patch besoin new field_reponse', data)
+            resolve(data)
+          })
+          .catch(error => {
+            console.warn(`Issue with patch node besoin field_reponse`, error)
+            reject(error)
+          })
+        // resolve('test')
+      })
+    }
   },
   components: {
     CartoucheLayout,
@@ -267,16 +352,27 @@ export default {
                 <label for="reponse-avec">Avec</label>
                 <p name="reponse-avec" v-html="reponse.avec" />
               </section>    
-            </li>
+            </li>      
+          
           </ul>
-          <a 
+          <!-- <a 
               v-if="isloggedin && !opened_concernement.can_update"
               :href="'/api/node/add/reponse?besoin_id='+besoin.id" 
               target="_blank" 
               rel="noopener noreferrer"
               class="contribute-link mdi mdi-pencil-plus">
                 <svg-icon type="mdi" :path="pencilplusoutline_path" /> contribuer à ce besoin
-            </a>
+            </a> -->
+            <template v-if="isloggedin && !opened_concernement.can_update">
+              <div v-if="!reloading_concernements" @click="addRessource(besoin.id)" class="add-ressource-btn">
+                <span>Proposer une ressource</span>
+                <svg-icon type="mdi" :path="mdiStickerPlusOutline_path"/>
+              </div>
+              <div v-else class="add-ressource-btn">
+                <div class="loading">Chargement</div>
+              </div>
+            </template>
+      
         </li>
       </ul>
     </template>
@@ -292,8 +388,10 @@ export default {
           <div class="loading">Chargement</div>
         </div>
       </template>
+
     </template>
 
+
   </CartoucheLayout>
   
 </template>

src/components/editable/ContentEditable.vue

@@ -63,7 +63,10 @@ export default {
       // console.log('onContentEditableFocusOut data', this.data);
       let new_field_content = this.html ? e.target.innerHTML : e.target.innerText;
       // console.log('onContentEditableFocusOut', new_field_content);
-      this.save(new_field_content)
+      this.$emit('focusout');
+      if (this.data) {
+        this.save(new_field_content)
+      }
     },
     save(content){
       // console.log('save csrf_token', this.csrf_token);

src/components/layout/CartoucheLayout.vue

@@ -31,7 +31,7 @@ export default {
       let scrolled = $main.scrollTop > 0;
       this.$emit('main_scrolled', scrolled);
       // TODO how to make this failsafe limit responsive ? 
-      if(scrolled && $main.scrollHeight > 700){
+      if(scrolled && $main.scrollHeight > 900){
         this.headerreduced = true;
       } else {
         this.headerreduced = false;