MALIO-DEV/Inventory
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

chore: update frontend configuration

Browse Source
This commit is contained in:
Matthieu
2025-09-26 11:29:47 +02:00
parent b7caa4f552
commit a78938a4d1
64 changed files with 5790 additions and 5129 deletions
Download Patch File Download Diff File Expand all files Collapse all files

135
app/app.vue
View File

@@ -13,8 +13,8 @@
>
<li class="pt-1 pb-2 lg:hidden">
<button
@click="openDisplaySettings"
class="w-full flex items-center gap-2 rounded-md px-2 py-1 transition-colors text-base-content hover:bg-primary/10 hover:text-primary"
@click="openDisplaySettings"
>
<IconLucideSettings class="w-4 h-4" aria-hidden="true" />
Paramètres d'affichage
@@ -125,7 +125,7 @@
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
:class="
isActive('/component-catalog') ||
isActive('/component-category')
isActive('/component-category')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
@@ -178,8 +178,8 @@
class="rounded-md px-2 py-1 transition-colors cursor-pointer"
:class="
isActive('/sites') ||
isActive('/documents') ||
isActive('/constructeurs')
isActive('/documents') ||
isActive('/constructeurs')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
@@ -241,9 +241,12 @@
<IconLucideBoxes class="w-6 h-6" aria-hidden="true" />
</div>
</div>
<NuxtLink to="/" class="btn btn-ghost text-xl"
>Inventaire Pro</NuxtLink
<NuxtLink
to="/"
class="btn btn-ghost text-xl"
>
Inventaire Pro
</NuxtLink>
</div>
</div>
<div class="navbar-center hidden lg:flex">
@@ -353,7 +356,7 @@
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
:class="
isActive('/component-category') ||
isActive('/component-catalog')
isActive('/component-catalog')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
@@ -406,8 +409,8 @@
class="transition-colors px-3 py-2 rounded-md inline-flex items-center gap-1 cursor-pointer"
:class="
isActive('/sites') ||
isActive('/documents') ||
isActive('/constructeurs')
isActive('/documents') ||
isActive('/constructeurs')
? 'bg-primary text-primary-content font-semibold shadow-sm'
: 'text-base-content hover:bg-primary/10 hover:text-primary'
"
@@ -465,9 +468,9 @@
<div class="flex items-center gap-2">
<!-- Bouton paramètres d'affichage -->
<button
@click="openDisplaySettings"
class="btn btn-ghost btn-circle hidden lg:inline-flex"
title="Paramètres d'affichage"
@click="openDisplaySettings"
>
<IconLucideSettings class="w-5 h-5" aria-hidden="true" />
</button>
@@ -507,7 +510,7 @@
</div>
<ClientOnly>
<div class="dropdown dropdown-end" v-if="activeProfile">
<div v-if="activeProfile" class="dropdown dropdown-end">
<div
tabindex="0"
role="button"
@@ -528,12 +531,12 @@
class="menu dropdown-content mt-3 p-2 shadow bg-base-100 rounded-box w-64"
>
<li class="px-2 py-1 text-sm text-base-content/70">
Connecté en tant que<br />
Connecté en tant que<br>
<span class="font-semibold text-base-content">{{
activeProfileLabel
}}</span>
</li>
<li><hr class="my-1" /></li>
<li><hr class="my-1"></li>
<li>
<NuxtLink to="/profiles/manage" class="justify-between">
Gestion des profils
@@ -583,99 +586,99 @@
</template>
<script setup>
import { ref, computed, onMounted, onUnmounted } from "vue";
import { useRoute, navigateTo } from "#imports";
import { useProfileSession } from "~/composables/useProfileSession";
import IconLucideMenu from "~icons/lucide/menu";
import IconLucideSettings from "~icons/lucide/settings";
import IconLucideBoxes from "~icons/lucide/boxes";
import IconLucidePlus from "~icons/lucide/plus";
import IconLucideCpu from "~icons/lucide/cpu";
import IconLucideFilePlus from "~icons/lucide/file-plus";
import IconLucideMapPin from "~icons/lucide/map-pin";
import IconLucideChevronRight from "~icons/lucide/chevron-right";
import IconLucideLogOut from "~icons/lucide/log-out";
import { ref, computed, onMounted, onUnmounted } from 'vue'
import { useRoute, navigateTo } from '#imports'
import { useProfileSession } from '~/composables/useProfileSession'
import IconLucideMenu from '~icons/lucide/menu'
import IconLucideSettings from '~icons/lucide/settings'
import IconLucideBoxes from '~icons/lucide/boxes'
import IconLucidePlus from '~icons/lucide/plus'
import IconLucideCpu from '~icons/lucide/cpu'
import IconLucideFilePlus from '~icons/lucide/file-plus'
import IconLucideMapPin from '~icons/lucide/map-pin'
import IconLucideChevronRight from '~icons/lucide/chevron-right'
import IconLucideLogOut from '~icons/lucide/log-out'
// État du modal des paramètres d'affichage
const displaySettingsOpen = ref(false);
const { activeProfile, ensureSession, logout } = useProfileSession();
const displaySettingsOpen = ref(false)
const { activeProfile, ensureSession, logout } = useProfileSession()
// Route active pour souligner l'onglet sélectionné dans la navbar
const route = useRoute();
const route = useRoute()
const isActive = (path) => {
if (path === "/") {
return route.path === "/";
if (path === '/') {
return route.path === '/'
}
return route.path.startsWith(path);
};
return route.path.startsWith(path)
}
// Ouvrir les paramètres d'affichage
const openDisplaySettings = () => {
displaySettingsOpen.value = true;
};
displaySettingsOpen.value = true
}
// Fermer les paramètres d'affichage
const closeDisplaySettings = () => {
displaySettingsOpen.value = false;
};
displaySettingsOpen.value = false
}
// Gérer les mises à jour des paramètres
const handleSettingsUpdate = (settings) => {
console.log("Paramètres d'affichage mis à jour:", settings);
};
console.log("Paramètres d'affichage mis à jour:", settings)
}
const handleLogout = async () => {
await logout();
await navigateTo("/profiles");
};
await logout()
await navigateTo('/profiles')
}
const openDropdown = ref(null);
let dropdownCloseTimer = null;
const openDropdown = ref(null)
let dropdownCloseTimer = null
const setDropdown = (name) => {
if (dropdownCloseTimer) {
clearTimeout(dropdownCloseTimer);
dropdownCloseTimer = null;
clearTimeout(dropdownCloseTimer)
dropdownCloseTimer = null
}
if (openDropdown.value !== name) {
openDropdown.value = name;
openDropdown.value = name
}
};
}
const scheduleDropdownClose = (name) => {
if (dropdownCloseTimer) {
clearTimeout(dropdownCloseTimer);
clearTimeout(dropdownCloseTimer)
}
dropdownCloseTimer = setTimeout(() => {
if (openDropdown.value === name) {
openDropdown.value = null;
openDropdown.value = null
}
dropdownCloseTimer = null;
}, 200);
};
dropdownCloseTimer = null
}, 200)
}
const activeProfileLabel = computed(() => {
if (!activeProfile.value) return "Profil inconnu";
return `${activeProfile.value.firstName} ${activeProfile.value.lastName}`;
});
if (!activeProfile.value) { return 'Profil inconnu' }
return `${activeProfile.value.firstName} ${activeProfile.value.lastName}`
})
const activeProfileInitials = computed(() => {
if (!activeProfile.value) return "??";
const { firstName = "", lastName = "" } = activeProfile.value;
if (!activeProfile.value) { return '??' }
const { firstName = '', lastName = '' } = activeProfile.value
return (
`${firstName.charAt(0) || ""}${lastName.charAt(0) || ""}`.toUpperCase() ||
"??"
);
});
`${firstName.charAt(0) || ''}${lastName.charAt(0) || ''}`.toUpperCase() ||
'??'
)
})
onMounted(async () => {
await ensureSession();
});
await ensureSession()
})
onUnmounted(() => {
if (dropdownCloseTimer) {
clearTimeout(dropdownCloseTimer);
dropdownCloseTimer = null;
clearTimeout(dropdownCloseTimer)
dropdownCloseTimer = null
}
});
})
</script>