89 lines
3.8 KiB
Vue
89 lines
3.8 KiB
Vue
<template>
|
||
<div class="d-flex" id="wrapper">
|
||
<!-- Sidebar -->
|
||
<div class="bg-dark text-white p-3" id="sidebar-wrapper" style="min-width: 250px; min-height: 100vh;">
|
||
<div class="sidebar-heading text-center py-4 fs-4 fw-bold border-bottom">Admin Panel</div>
|
||
<div class="list-group list-group-flush my-3">
|
||
<NuxtLink to="/admin" class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-tachometer-alt me-2"></i> Dashboard
|
||
</NuxtLink>
|
||
<NuxtLink to="/admin/settings"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-cogs me-2"></i> Settings
|
||
</NuxtLink>
|
||
<NuxtLink to="/admin/security"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-shield-alt me-2"></i> Güvenlik & Ağ
|
||
</NuxtLink>
|
||
<NuxtLink to="/admin/users"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-users me-2"></i> Kullanıcılar
|
||
</NuxtLink>
|
||
|
||
<div class="sidebar-heading text-white-50 mt-3 mb-1 small text-uppercase">Blog</div>
|
||
<NuxtLink to="/admin/blog/categories"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-tags me-2"></i> Kategoriler
|
||
</NuxtLink>
|
||
<NuxtLink to="/admin/blog/tags"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-hashtag me-2"></i> Etiketler
|
||
</NuxtLink>
|
||
<NuxtLink to="/admin/blog/posts"
|
||
class="list-group-item list-group-item-action bg-transparent text-white border-0">
|
||
<i class="fas fa-newspaper me-2"></i> Postlar
|
||
</NuxtLink>
|
||
<NuxtLink to="/" class="list-group-item list-group-item-action bg-transparent text-white border-0 mt-5">
|
||
<i class="fas fa-home me-2"></i> Siteye Dön
|
||
</NuxtLink>
|
||
<button @click="handleLogout"
|
||
class="list-group-item list-group-item-action bg-transparent text-danger border-0">
|
||
<i class="fas fa-sign-out-alt me-2"></i> Çıkış
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Page Content -->
|
||
<div id="page-content-wrapper" class="w-100">
|
||
<nav class="navbar navbar-expand-lg navbar-light bg-light border-bottom px-4">
|
||
<button class="btn btn-primary" id="menu-toggle">Toggle Menu</button>
|
||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||
<ul class="navbar-nav ms-auto mt-2 mt-lg-0">
|
||
<li class="nav-item active">
|
||
<span class="nav-link">Hoşgeldin, Admin</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
|
||
<div class="container-fluid px-4 py-4">
|
||
<slot />
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
const { signOut } = useAuth();
|
||
|
||
const handleLogout = async () => {
|
||
await signOut({ callbackUrl: '/auth/login' });
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
#sidebar-wrapper {
|
||
transition: all 0.3s;
|
||
}
|
||
|
||
.list-group-item-action:hover {
|
||
background-color: rgba(255, 255, 255, 0.1) !important;
|
||
color: #fff !important;
|
||
}
|
||
|
||
.router-link-active {
|
||
background-color: rgba(255, 255, 255, 0.2) !important;
|
||
border-radius: 5px;
|
||
}
|
||
</style>
|