Merge pull request #65 from Geode-solutions/feat/is_loadable

Feat/is loadable

Author: JulienChampagnol

components/ObjectSelector.vue

@@ -1,17 +1,36 @@
 <template>
   <FetchingData v-if="loading" />
-  <v-row v-else-if="allowed_objects.length" class="justify-left">
-    <v-col v-for="object in allowed_objects" :key="object" cols="2" md="2">
-      <v-card v-ripple class="card ma-2" hover rounded>
-        <v-img
-          :src="geode_objects[object].image"
-          cover
-          @click="set_geode_object(object)"
-        />
-        <v-tooltip activator="parent" location="bottom">
-          {{ geode_objects[object].tooltip }}
-        </v-tooltip>
-      </v-card>
+  <v-row v-else-if="Object.keys(allowed_objects).length" class="justify-left">
+    <v-col v-for="(value, key) in allowed_objects" :key="key" cols="2" md="2">
+      <v-tooltip
+        :disabled="value.is_saveable"
+        :text="
+          value['is_loadable']
+            ? geode_objects[key].tooltip
+            : `Data not loadable with this class (${key})`
+        "
+        location="bottom"
+      >
+        <template v-slot:activator="{ props }">
+          <span v-bind="props">
+            <v-card
+              v-ripple
+              class="card ma-2"
+              hover
+              rounded
+              :disabled="!value['is_loadable']"
+              :elevation="value['is_loadable'] ? 5 : 3"
+            >
+              <v-img
+                :src="geode_objects[key].image"
+                cover
+                @click="set_geode_object(key)"
+                :class="!value['is_loadable'] ? 'disabled' : ''"
+              />
+            </v-card>
+          </span>
+        </template>
+      </v-tooltip>
     </v-col>
   </v-row>
   <v-row v-else class="pa-5">
@@ -45,8 +64,7 @@
   const { filenames, key } = props
 
   const loading = ref(false)
-  const allowed_objects = ref([])
-
+  const allowed_objects = ref({})
   const toggle_loading = useToggle(loading)
 
   async function get_allowed_objects() {
@@ -95,3 +113,13 @@
     get_allowed_objects()
   })
 </script>
+
+<style scoped>
+  .disabled {
+    filter: opacity(0.7);
+    cursor: pointer;
+  }
+  .disabled div {
+    cursor: not-allowed;
+  }
+</style>

package-lock.json

@@ -4,13 +4,13 @@
     "lint": "eslint --fix --ext .js,.vue --ignore-path .gitignore ."
   },
   "devDependencies": {
-    "eslint": "^8.55.0",
-    "eslint-plugin-import": "^2.29.0",
+    "eslint": "^8.56.0",
+    "eslint-plugin-import": "^2.29.1",
     "eslint-plugin-nuxt": "^4.0.0",
     "eslint-plugin-prettier": "^5.0.1",
     "eslint-plugin-prettier-vue": "^5.0.0",
     "eslint-plugin-vue": "^9.19.2",
-    "eslint-plugin-vuetify": "^2.1.0",
+    "eslint-plugin-vuetify": "^2.1.1",
     "nuxt": "^3.8.2",
     "prettier": "3.1.1"
   },
@@ -25,7 +25,7 @@
     "@kitware/vtk.js": "^29.2.0",
     "@mdi/font": "^7.3.67",
     "@pinia/nuxt": "^0.5.1",
-    "@types/node": "^20.10.4",
+    "@types/node": "^20.10.5",
     "@vueuse/components": "^10.7.0",
     "@vueuse/core": "^10.7.0",
     "ajv": "^8.12.0",
@@ -34,7 +34,7 @@
     "sass": "^1.69.5",
     "semver": "^7.5.4",
     "vue-recaptcha": "^2.0.3",
-    "vuetify": "^3.4.6",
+    "vuetify": "^3.4.7",
     "wslink": "^1.12.4"
   },
   "repository": {