- npm updates - new SearchMap.vue component
This commit is contained in:
parent
7bc9f90cca
commit
a7142f694f
74 changed files with 3360 additions and 3577 deletions
|
@ -1,8 +1,8 @@
|
|||
<script lang="ts" setup>
|
||||
import { usePage, router } from '@inertiajs/vue3'
|
||||
<script lang="ts" setup>
|
||||
import { usePage, router } from '@inertiajs/vue3';
|
||||
// import { usePage } from '@inertiajs/inertia-vue3';
|
||||
// import { Inertia } from '@inertiajs/inertia';
|
||||
import {ComputedRef} from "vue";
|
||||
import { ComputedRef } from 'vue';
|
||||
|
||||
import { computed, ref } from 'vue';
|
||||
import { containerMaxW } from '@/config.js';
|
||||
|
@ -10,21 +10,21 @@ import { containerMaxW } from '@/config.js';
|
|||
import { StyleService } from '@/Stores/style';
|
||||
import { LayoutService } from '@/Stores/layout';
|
||||
import {
|
||||
mdiForwardburger,
|
||||
mdiBackburger,
|
||||
mdiClose,
|
||||
mdiDotsVertical,
|
||||
mdiMenu,
|
||||
// mdiClockOutline,
|
||||
mdiCloudDownloadOutline,
|
||||
mdiCloud,
|
||||
mdiCrop,
|
||||
mdiAccount,
|
||||
mdiCogOutline,
|
||||
mdiEmail,
|
||||
mdiLogout,
|
||||
mdiGithub,
|
||||
mdiThemeLightDark,
|
||||
mdiForwardburger,
|
||||
mdiBackburger,
|
||||
mdiClose,
|
||||
mdiDotsVertical,
|
||||
mdiMenu,
|
||||
// mdiClockOutline,
|
||||
mdiCloudDownloadOutline,
|
||||
mdiCloud,
|
||||
mdiCrop,
|
||||
mdiAccount,
|
||||
mdiCogOutline,
|
||||
mdiEmail,
|
||||
mdiLogout,
|
||||
mdiGithub,
|
||||
mdiThemeLightDark,
|
||||
} from '@mdi/js';
|
||||
import NavBarItem from '@/Components/NavBarItem.vue';
|
||||
import NavBarItemLabel from '@/Components/NavBarItemLabel.vue';
|
||||
|
@ -34,15 +34,13 @@ import UserAvatarCurrentUser from '@/Components/UserAvatarCurrentUser.vue';
|
|||
import BaseIcon from '@/Components/BaseIcon.vue';
|
||||
import NavBarSearch from '@/Components/NavBarSearch.vue';
|
||||
import { stardust } from '@eidellev/adonis-stardust/client';
|
||||
import type User from "App/Models/User";
|
||||
import type User from 'App/Models/User';
|
||||
|
||||
// const mainStore = MainService();
|
||||
// const userName = computed(() =>mainStore.userName);
|
||||
|
||||
|
||||
|
||||
const styleService = StyleService();
|
||||
// const props = defineProps({
|
||||
// const props = defineProps({
|
||||
// user: {
|
||||
// type: Object,
|
||||
// default: () => ({}),
|
||||
|
@ -50,13 +48,13 @@ const styleService = StyleService();
|
|||
// });
|
||||
// const userName = computed(() => usePage().props.user.login)
|
||||
|
||||
const user: ComputedRef<User>= computed(() => {
|
||||
return usePage().props.authUser as User;
|
||||
const user: ComputedRef<User> = computed(() => {
|
||||
return usePage().props.authUser as User;
|
||||
});
|
||||
// const userName = computed(() => props.user.login)
|
||||
|
||||
const toggleLightDark = () => {
|
||||
styleService.setDarkMode();
|
||||
styleService.setDarkMode();
|
||||
};
|
||||
|
||||
const layoutStore = LayoutService();
|
||||
|
@ -64,108 +62,101 @@ const layoutStore = LayoutService();
|
|||
const isMenuNavBarActive = ref(false);
|
||||
|
||||
const menuNavBarToggle = () => {
|
||||
isMenuNavBarActive.value = !isMenuNavBarActive.value;
|
||||
isMenuNavBarActive.value = !isMenuNavBarActive.value;
|
||||
};
|
||||
|
||||
const menuOpenLg = () => {
|
||||
layoutStore.isAsideLgActive = true;
|
||||
layoutStore.isAsideLgActive = true;
|
||||
};
|
||||
|
||||
// const logout = () => {
|
||||
// // router.post(route('logout'))
|
||||
// Inertia.get(stardust.route('app.index'));
|
||||
// };
|
||||
const logout = async() => {
|
||||
// router.post(route('logout'));
|
||||
await router.post(stardust.route('logout'));
|
||||
const logout = async () => {
|
||||
// router.post(route('logout'));
|
||||
await router.post(stardust.route('logout'));
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<nav
|
||||
class="top-0 left-0 right-0 fixed bg-gray-50 h-14 z-40 w-screen transition-position xl:pl-60 lg:w-auto dark:bg-slate-800"
|
||||
>
|
||||
<div class="flex lg:items-stretch" :class="containerMaxW">
|
||||
<div class="flex-1 items-stretch flex h-14">
|
||||
<NavBarItem type="flex lg:hidden" @click.prevent="layoutStore.asideMobileToggle()">
|
||||
<BaseIcon
|
||||
:path="layoutStore.isAsideMobileExpanded ? mdiBackburger : mdiForwardburger"
|
||||
size="24"
|
||||
/>
|
||||
</NavBarItem>
|
||||
<NavBarItem type="hidden lg:flex xl:hidden" @click.prevent="menuOpenLg">
|
||||
<BaseIcon :path="mdiMenu" size="24" />
|
||||
</NavBarItem>
|
||||
<NavBarItem>
|
||||
<NavBarSearch />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
<div class="flex-none items-stretch flex h-14 lg:hidden">
|
||||
<NavBarItem @click.prevent="menuNavBarToggle">
|
||||
<BaseIcon :path="isMenuNavBarActive ? mdiClose : mdiDotsVertical" size="24" />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
<div
|
||||
class="absolute w-screen top-14 left-0 bg-gray-50 shadow lg:w-auto lg:items-stretch lg:flex lg:grow lg:static lg:border-b-0 lg:overflow-visible lg:shadow-none dark:bg-slate-800"
|
||||
:class="[isMenuNavBarActive ? 'block' : 'hidden']"
|
||||
>
|
||||
<div
|
||||
class="max-h-screen-menu overflow-y-auto lg:overflow-visible lg:flex lg:items-stretch lg:justify-end lg:ml-auto"
|
||||
>
|
||||
<NavBarMenu>
|
||||
<NavBarItemLabel :icon="mdiMenu" label="Help menu" />
|
||||
<template #dropdown>
|
||||
<!-- <NavBarItem>
|
||||
<nav class="top-0 left-0 right-0 fixed bg-gray-50 h-14 z-40 w-screen transition-position xl:pl-60 lg:w-auto dark:bg-slate-800">
|
||||
<div class="flex lg:items-stretch" :class="containerMaxW">
|
||||
<div class="flex-1 items-stretch flex h-14">
|
||||
<NavBarItem type="flex lg:hidden" @click.prevent="layoutStore.asideMobileToggle()">
|
||||
<BaseIcon :path="layoutStore.isAsideMobileExpanded ? mdiBackburger : mdiForwardburger" size="24" />
|
||||
</NavBarItem>
|
||||
<NavBarItem type="hidden lg:flex xl:hidden" @click.prevent="menuOpenLg">
|
||||
<BaseIcon :path="mdiMenu" size="24" />
|
||||
</NavBarItem>
|
||||
<NavBarItem>
|
||||
<NavBarSearch />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
<div class="flex-none items-stretch flex h-14 lg:hidden">
|
||||
<NavBarItem @click.prevent="menuNavBarToggle">
|
||||
<BaseIcon :path="isMenuNavBarActive ? mdiClose : mdiDotsVertical" size="24" />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
<div
|
||||
class="absolute w-screen top-14 left-0 bg-gray-50 shadow lg:w-auto lg:items-stretch lg:flex lg:grow lg:static lg:border-b-0 lg:overflow-visible lg:shadow-none dark:bg-slate-800"
|
||||
:class="[isMenuNavBarActive ? 'block' : 'hidden']"
|
||||
>
|
||||
<div class="max-h-screen-menu overflow-y-auto lg:overflow-visible lg:flex lg:items-stretch lg:justify-end lg:ml-auto">
|
||||
<NavBarMenu>
|
||||
<NavBarItemLabel :icon="mdiMenu" label="Help menu" />
|
||||
<template #dropdown>
|
||||
<!-- <NavBarItem>
|
||||
<NavBarItemLabel :icon="mdiClockOutline" label="Item One" />
|
||||
</NavBarItem> -->
|
||||
<NavBarItem href="/docs/HandbuchTethys.pdf" target="_blank">
|
||||
<NavBarItemLabel :icon="mdiCloudDownloadOutline" label="Tethys Manual" />
|
||||
</NavBarItem>
|
||||
<NavBarItem href="/docs/geopackage_v01.pdf" target="_blank">
|
||||
<NavBarItemLabel :icon="mdiCloud" label="GeoPackage Help" />
|
||||
</NavBarItem>
|
||||
<BaseDivider nav-bar />
|
||||
<NavBarItem>
|
||||
<NavBarItemLabel :icon="mdiCrop" label="Item Last" />
|
||||
</NavBarItem>
|
||||
</template>
|
||||
</NavBarMenu>
|
||||
<NavBarItem href="/docs/HandbuchTethys.pdf" target="_blank">
|
||||
<NavBarItemLabel :icon="mdiCloudDownloadOutline" label="Tethys Manual" />
|
||||
</NavBarItem>
|
||||
<NavBarItem href="/docs/geopackage_v01.pdf" target="_blank">
|
||||
<NavBarItemLabel :icon="mdiCloud" label="GeoPackage Help" />
|
||||
</NavBarItem>
|
||||
<BaseDivider nav-bar />
|
||||
<NavBarItem>
|
||||
<NavBarItemLabel :icon="mdiCrop" label="Item Last" />
|
||||
</NavBarItem>
|
||||
</template>
|
||||
</NavBarMenu>
|
||||
|
||||
<NavBarMenu>
|
||||
<NavBarItemLabel v-bind:label="user.login">
|
||||
<UserAvatarCurrentUser class="w-6 h-6 mr-3 inline-flex" />
|
||||
</NavBarItemLabel>
|
||||
<NavBarMenu>
|
||||
<NavBarItemLabel v-bind:label="user.login">
|
||||
<UserAvatarCurrentUser class="w-6 h-6 mr-3 inline-flex" />
|
||||
</NavBarItemLabel>
|
||||
|
||||
<template #dropdown>
|
||||
<!-- <NavBarItem> -->
|
||||
<!-- <NavBarItem route-name="admin.account.info"> -->
|
||||
<NavBarItem :route-name="'admin.account.info'" >
|
||||
<NavBarItemLabel :icon="mdiAccount" label="My Profile" />
|
||||
</NavBarItem>
|
||||
<NavBarItem :route-name="'settings'">
|
||||
<NavBarItemLabel :icon="mdiCogOutline" label="Settings" />
|
||||
</NavBarItem>
|
||||
<NavBarItem>
|
||||
<NavBarItemLabel :icon="mdiEmail" label="Messages" />
|
||||
</NavBarItem>
|
||||
<BaseDivider nav-bar />
|
||||
<NavBarItem @click="logout">
|
||||
<NavBarItemLabel :icon="mdiLogout" label="Log Out" />
|
||||
</NavBarItem>
|
||||
</template>
|
||||
</NavBarMenu>
|
||||
<template #dropdown>
|
||||
<!-- <NavBarItem> -->
|
||||
<!-- <NavBarItem route-name="admin.account.info"> -->
|
||||
<NavBarItem :route-name="'admin.account.info'">
|
||||
<NavBarItemLabel :icon="mdiAccount" label="My Profile" />
|
||||
</NavBarItem>
|
||||
<NavBarItem :route-name="'settings'">
|
||||
<NavBarItemLabel :icon="mdiCogOutline" label="Settings" />
|
||||
</NavBarItem>
|
||||
<NavBarItem>
|
||||
<NavBarItemLabel :icon="mdiEmail" label="Messages" />
|
||||
</NavBarItem>
|
||||
<BaseDivider nav-bar />
|
||||
<NavBarItem @click="logout">
|
||||
<NavBarItemLabel :icon="mdiLogout" label="Log Out" />
|
||||
</NavBarItem>
|
||||
</template>
|
||||
</NavBarMenu>
|
||||
|
||||
<NavBarItem is-desktop-icon-only @click.prevent="toggleLightDark">
|
||||
<NavBarItemLabel v-bind:icon="mdiThemeLightDark" label="Light/Dark" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
<NavBarItem href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" is-desktop-icon-only>
|
||||
<NavBarItemLabel v-bind:icon="mdiGithub" label="GitHub" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
<NavBarItem is-desktop-icon-only @click="logout">
|
||||
<NavBarItemLabel v-bind:icon="mdiLogout" label="Log out" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
<NavBarItem is-desktop-icon-only @click.prevent="toggleLightDark">
|
||||
<NavBarItemLabel v-bind:icon="mdiThemeLightDark" label="Light/Dark" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
<NavBarItem href="https://gitea.geologie.ac.at/geolba/tethys" target="_blank" is-desktop-icon-only>
|
||||
<NavBarItemLabel v-bind:icon="mdiGithub" label="GitHub" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
<NavBarItem is-desktop-icon-only @click="logout">
|
||||
<NavBarItemLabel v-bind:icon="mdiLogout" label="Log out" is-desktop-icon-only />
|
||||
</NavBarItem>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
|
|
Loading…
Add table
editor.link_modal.header
Reference in a new issue