FIX: Dans les petits écrans, la modale d'accueil pourrait être plus large

This commit is contained in:
Boris Waaub
2025-12-09 11:12:21 +01:00
parent fc66d0e070
commit d3d2c06348

View File

@@ -30,7 +30,7 @@
<Modal
v-if="showTicketInitFormModal"
:show="showTicketInitFormModal"
modal-dialog-class="modal-lg"
:modal-dialog-class="modalDialogClass"
@close="closeModal"
>
<template #header>
@@ -58,7 +58,7 @@
<script setup lang="ts">
import { useToast } from "vue-toast-notification";
import { computed, onMounted, ref } from "vue";
import { computed, onMounted, onUnmounted, ref } from "vue";
import { useStore } from "vuex";
// Types
@@ -113,6 +113,16 @@ const ticketForm = ref({
emergency: ticket.value?.emergency,
} as TicketInitForm);
const modalDialogClass = ref(
window.innerWidth < 990 ? "modal-fullscreen" : "modal-lg",
);
function updateModalClass() {
modalDialogClass.value =
window.innerWidth < 990 ? "modal-fullscreen" : "modal-lg";
}
window.addEventListener("resize", updateModalClass);
async function handleFormSubmit() {
try {
if (!ticketForm.value.motive || ticketForm.value.content.trim() === "") {
@@ -167,6 +177,10 @@ onMounted(() => {
loading.value = false;
}
});
onUnmounted(() => {
window.removeEventListener("resize", updateModalClass);
});
</script>
<style lang="scss" scoped>