added folder deletion confirmation

web/themes/custom/materiotheme/assets/scripts/main.js

@@ -21,7 +21,7 @@ import CoolLightBox from 'vue-cool-lightbox'
 Vue.use(CoolLightBox)
 
 import VModal from 'vue-js-modal'
-Vue.use(VModal)
+Vue.use(VModal, { dialog: true })
 
 import store from 'vuejs/store'
 import router from 'vuejs/route'

web/themes/custom/materiotheme/vuejs/components/Content/ModalCard.vue

@@ -170,7 +170,7 @@
           </vsa-content>
         </vsa-item> -->
 
-        <vsa-item v-if="material.linked_materials">
+        <vsa-item v-if="material.linked_materials.length">
           <vsa-heading>
             <span class="label">{{ $t("materio.Linked materials") }}</span>
           </vsa-heading>

web/themes/custom/materiotheme/vuejs/components/User/UserFlags.vue

@@ -31,6 +31,7 @@
         />
       </li>
     </ul>
+    <v-dialog/>
   </div>
 </template>
 
@@ -88,11 +89,39 @@ export default {
       const flagcollid = e.target.getAttribute('flagcollid');
       console.log("UserFlags onDeleteFlagColl", flagcollid);
       this.is_deleting_folder = flagcollid;
-      this.deleteFlagColl(flagcollid)
-        .then(() => {
-          // console.log("onDeleteFlagColl then", data);
-          this.is_deleting_folder = false;
-        })
+      // TODO: confirm suppression
+      this.confirmDeleteFlagColl(flagcollid)
+    },
+    confirmDeleteFlagColl (flagcollid){
+      console.log('confirmDeleteFlagCOll', flagcollid, this.flagcolls);
+      // const index = this.flagcolls.findIndex(i => i.id === flagcollid)
+      let coll = this.flagcolls[flagcollid]
+      // console.log("coll to delete", coll);
+      this.$modal.show('dialog', {
+        title:  "Folder delete",
+        text: `Please confirm the definitive deletion of ${coll.name} ?`,
+        buttons: [
+          {
+            title: 'Cancel',
+            default: true,
+            handler: () => {
+              this.$modal.hide('dialog')
+            }
+          },
+          {
+            title: 'Delete',
+            handler: () => {
+              console.log('deletion confirmed', flagcollid);
+              this.deleteFlagColl(flagcollid)
+                .then(() => {
+                  // console.log("onDeleteFlagColl then", data);
+                  this.is_deleting_folder = false;
+                  this.$modal.hide('dialog')
+                })
+            }
+          }
+        ]
+      })
     },
     onOpenFlagColl (e) {
       const flagcollid = e.target.getAttribute('flagcollid');