Browse Source

finalize UiImage and minor fixes

Olivier Massot 2 years ago
parent
commit
19efcb5c02

+ 1 - 1
components/Layout/Parameters/ResidenceAreas.vue

@@ -73,7 +73,7 @@ const { pending } = fetchCollection(ResidenceArea)
  * On récupère les Residence Area via le store
  * (sans ça, les mises à jour SSE ne seront pas prises en compte)
  */
- const residenceAreas: ComputedRef<Array<ResidenceArea>> = computed(() => {
+const residenceAreas: ComputedRef<Array<ResidenceArea>> = computed(() => {
   return residenceAreasRepo.getResidenceAreas()
 })
 

+ 5 - 63
components/Ui/Image.vue

@@ -28,30 +28,14 @@ Si la propriété 'upload' est à 'true', propose aussi un input pour uploader u
           </v-row>
         </template>
       </v-img>
-
-      <div>
-        <div v-if="upload" class="click-action hover" @click="openUpload=true"><v-icon>mdi-upload</v-icon></div>
-        <UiInputImage
-          v-if="openUpload"
-          @close="openUpload=false"
-          :existingImageId="id"
-          :field="field"
-          :ownerId="ownerId"
-          @update="$emit('update', $event, field); openUpload=false"
-          @reload="onReload"
-          @reset="reset"
-        ></UiInputImage>
-      </div>
     </div>
   </main>
 </template>
 
 
 <script setup lang="ts">
-import {ref, Ref} from "@vue/reactivity";
 import {useImageFetch} from "~/composables/data/useImageFetch";
 import {onUnmounted, watch, WatchStopHandle} from "@vue/runtime-core";
-import {useImageManager} from "~/composables/data/useImageManager";
 import ImageManager from "~/services/data/imageManager";
 
 const props = defineProps({
@@ -87,31 +71,18 @@ const props = defineProps({
   }
 })
 
-const { imageManager } = useImageManager()
 const { fetch } = useImageFetch()
 
 const defaultImagePath = props.defaultImage ?? ImageManager.defaultImage
 
-const openUpload: Ref<Boolean> = ref(false)
-
-const { data: imageSrc, pending, refresh } = fetch(props.id ?? null, defaultImagePath, props.height, props.width)
-
-const unwatch: WatchStopHandle = watch(() => props.id, async (newValue, oldValue) => {
-  await refresh()
-})
-
-const onReload = async () => {
-  await refresh()
-  openUpload.value = false
-}
+const { data: imageSrc, pending, refresh } = fetch(props.id ?? null, defaultImagePath, props.height, props.width) as any
 
 /**
- * Quand on souhaite faire un reset de l'image
+ * Si l'id change, on recharge l'image
  */
-const reset = () => {
-  imageSrc.value = defaultImagePath
-  openUpload.value = false
-}
+const unwatch: WatchStopHandle = watch(() => props.id, async () => {
+  await refresh()
+})
 
 /**
  * Lorsqu'on démonte le component, on supprime le watcher
@@ -129,34 +100,5 @@ onUnmounted(() => {
     img {
       max-width: 100%;
     }
-
-    .click-action {
-      position: absolute;
-      top:0;
-      left:0;
-      width: 100%;
-      height: 100%;
-      background: transparent;
-      opacity: 0;
-      transition: all .2s;
-      &:hover {
-        opacity: 1;
-        background: rgb(var(--v-theme-neutral-strong));
-        cursor: pointer;
-      }
-      i {
-        color: rgb(var(--v-theme-on-neutral-strong));
-        position: absolute;
-        top: 50%;
-        left: 50%;
-        transform: translate(-50% , -50%);
-        font-size: 50px;
-        z-index: 1;
-        opacity: 1;
-        &:hover{
-          color: rgb(var(--v-theme-primary-alt));
-        }
-      }
-    }
   }
 </style>

+ 1 - 1
components/Ui/Input/Autocomplete.vue

@@ -49,7 +49,7 @@ const props = defineProps({
    * v-model
    */
   modelValue: {
-    type: [String, Number, Object, Array],
+    type: [String, Number, Object, Array] as PropType<any>,
     required: false,
     default: null
   },

+ 2 - 1
components/Ui/Input/AutocompleteWithEnum.vue

@@ -19,10 +19,11 @@ import {useEnumFetch} from "~/composables/data/useEnumFetch";
 import ArrayUtils from "~/services/utils/arrayUtils";
 import {ComputedRef} from "@vue/reactivity";
 import {Enum} from "~/types/data";
+import {PropType} from "@vue/runtime-core";
 
 const props = defineProps({
   modelValue: {
-    type: String,
+    type: String as PropType<string | null>,
     required: false,
     default: null
   },

+ 2 - 1
components/Ui/Input/DatePicker.vue

@@ -24,13 +24,14 @@ Sélecteur de dates, à placer dans un composant `UiForm`
 <script setup lang="ts">
 import {useFieldViolation} from "~/composables/form/useFieldViolation";
 import {formatISO} from "date-fns";
+import {PropType} from "@vue/runtime-core";
 
 const props = defineProps({
   /**
    * v-model
    */
   modelValue: {
-    type: String,
+    type: String as PropType<string | null>,
     required: false,
     default: null
   },

+ 2 - 0
models/Organization/Parameters.ts

@@ -3,6 +3,7 @@ import { Bool, Num, Str, Uid, Attr } from 'pinia-orm/dist/decorators'
 import Access from "~/models/Access/Access";
 import ApiResource from "~/models/ApiResource";
 import {IriEncoded} from "~/models/decorators";
+import File from "~/models/Core/File";
 
 /**
  * AP2i Model : Parameters
@@ -104,6 +105,7 @@ export default class Parameters extends ApiModel {
   declare studentsAreAdherents: boolean
 
   @Str(null)
+  @IriEncoded(File)
   declare qrCode: string | null
 
   @Str('Europe/Paris')