ETC/SAFEKISO
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
DESKTOP-RS140KH\IdeaPad
2026-04-07 14:50:23 +09:00
commit b4e485502b
4778 changed files with 2017091 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

130
safekiso_admin/base/layouts/SideNavbarAndFooter.vue Normal file
View File

@@ -0,0 +1,130 @@
<template>
<!--
This example requires updating your template:
```
<html class="h-full bg-gray-100">
<body class="h-full">
```
-->
<div>
<TransitionRoot as="template" :show="sidebarOpen">
<Dialog
as="div"
class="relative z-40 md:hidden bg-white"
@close="sidebarOpen = false"
>
<TransitionChild
as="template"
enter="transition-opacity ease-linear duration-300"
enter-from="opacity-0"
enter-to="opacity-100"
leave="transition-opacity ease-linear duration-300"
leave-from="opacity-100"
leave-to="opacity-0"
>
<div class="fixed inset-0 bg-gray-600 bg-opacity-75" />
</TransitionChild>
<div class="fixed inset-0 flex z-40">
<TransitionChild
as="template"
enter="transition ease-in-out duration-300 transform"
enter-from="-translate-x-full"
enter-to="translate-x-0"
leave="transition ease-in-out duration-300 transform"
leave-from="translate-x-0"
leave-to="-translate-x-full"
>
<DialogPanel
class="relative flex-1 flex flex-col max-w-xs w-full"
>
<TransitionChild
as="template"
enter="ease-in-out duration-300"
enter-from="opacity-0"
enter-to="opacity-100"
leave="ease-in-out duration-300"
leave-from="opacity-100"
leave-to="opacity-0"
>
<div class="absolute top-0 right-0 -mr-12 pt-2">
<button
type="button"
class="ml-1 flex items-center justify-center h-10 w-10 rounded-full focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white"
@click="sidebarOpen = false"
>
<span class="sr-only"
>Close sidebar</span
>
<XMarkIcon
class="h-6 w-6 text-white"
aria-hidden="true"
/>
</button>
</div>
</TransitionChild>
<BaseNavSideBar1 :on-move="onMoveHandler" />
</DialogPanel>
</TransitionChild>
<div class="flex-shrink-0 w-14" aria-hidden="true">
<!-- Force sidebar to shrink to fit close icon -->
</div>
</div>
</Dialog>
</TransitionRoot>
<!-- Static sidebar for desktop -->
<div class="hidden md:flex md:w-64 md:flex-col md:fixed md:inset-y-0">
<!-- Sidebar component, swap this element with another sidebar if you like -->
<div class="flex-1 flex flex-col min-h-0 bg-white">
<BaseNavSideBar1 :on-move="onMoveHandler" />
</div>
</div>
<div class="md:pl-64 flex flex-col flex-1">
<div
class="sticky top-0 z-10 md:hidden pl-1 pt-1 sm:pl-3 sm:pt-3 bg-gray-100"
>
<button
type="button"
class="-ml-0.5 -mt-0.5 h-12 w-12 inline-flex items-center justify-center rounded-md text-gray-500 hover:text-gray-900"
@click="sidebarOpen = true"
>
<span class="sr-only">Open sidebar</span>
<Bars3Icon class="h-6 w-6" aria-hidden="true" />
</button>
</div>
<main class="flex-1">
<!-- Replace with your content -->
<div class="mt-5 sm:px-3 lg:px-5"><slot /></div>
<!-- /End replace -->
</main>
<BaseModal1 />
</div>
</div>
</template>
<script setup lang="ts">
import {
Dialog,
DialogPanel,
TransitionChild,
TransitionRoot,
} from '@headlessui/vue';
import { Bars3Icon, XMarkIcon } from '@heroicons/vue/24/outline';
useHead({
htmlAttrs: {
class: 'h-full bg-gray-50',
},
bodyAttrs: {
class: 'h-full',
},
});
const sidebarOpen = ref(false);
function onMoveHandler() {
sidebarOpen.value = false;
}
</script>