first commit
This commit is contained in:
Beyhan Oğur
88
app/layouts/admin.vue
Normal file
88
app/layouts/admin.vue
Normal file
@@ -0,0 +1,88 @@
|
||||
<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>
|
||||
72
app/layouts/default.vue
Normal file
72
app/layouts/default.vue
Normal file
@@ -0,0 +1,72 @@
|
||||
<template>
|
||||
<div>
|
||||
<slot />
|
||||
<div class="progress-wrap">
|
||||
<svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
|
||||
<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { computed, onMounted } from 'vue';
|
||||
import { useHeroStore } from '@/stores/hero';
|
||||
import { useSettingStore } from '@/stores/setting';
|
||||
|
||||
const heroStore = useHeroStore();
|
||||
const settingStore = useSettingStore();
|
||||
|
||||
useHead(computed(() => {
|
||||
const title = settingStore.settings?.title ?? heroStore.hero?.title ?? 'Blog details Sidebar Right || Avigo Multipurpose Theme';
|
||||
const meta: Array<Record<string, string>> = [
|
||||
{ charset: 'utf-8' },
|
||||
{ name: 'viewport', content: 'width=device-width, initial-scale=1.0' },
|
||||
];
|
||||
if (settingStore.settings?.meta_description) {
|
||||
meta.push({ name: 'description', content: settingStore.settings.meta_description });
|
||||
}
|
||||
|
||||
return {
|
||||
title,
|
||||
meta
|
||||
}
|
||||
}));
|
||||
|
||||
onMounted(() => {
|
||||
// page-progress
|
||||
const progressPath = document.querySelector(".progress-wrap path") as SVGPathElement | null;
|
||||
if (progressPath) {
|
||||
const pathLength = progressPath.getTotalLength();
|
||||
// use webkitTransition (lowercase) to satisfy TypeScript and cast style where needed
|
||||
progressPath.style.transition = (progressPath.style as any).webkitTransition = "none";
|
||||
progressPath.style.strokeDasharray = pathLength + " " + pathLength;
|
||||
progressPath.style.strokeDashoffset = String(pathLength);
|
||||
progressPath.getBoundingClientRect();
|
||||
progressPath.style.transition = (progressPath.style as any).webkitTransition = "stroke-dashoffset 10ms linear";
|
||||
const updateProgress = () => {
|
||||
const scroll = $(window).scrollTop();
|
||||
const height = $(document).height() - $(window).height();
|
||||
const prog = pathLength - (scroll * pathLength) / height;
|
||||
progressPath!.style.strokeDashoffset = String(prog);
|
||||
};
|
||||
updateProgress();
|
||||
$(window).scroll(updateProgress);
|
||||
const offset = 50;
|
||||
const duration = 550;
|
||||
jQuery(window).on("scroll", () => {
|
||||
if (jQuery(window).scrollTop() > offset) {
|
||||
jQuery(".progress-wrap").addClass("active-progress");
|
||||
} else {
|
||||
jQuery(".progress-wrap").removeClass("active-progress");
|
||||
}
|
||||
});
|
||||
jQuery(".progress-wrap").on("click", (event: any) => {
|
||||
event.preventDefault();
|
||||
jQuery("html, body").animate({ scrollTop: 0 }, duration);
|
||||
return false;
|
||||
});
|
||||
}
|
||||
})
|
||||
|
||||
</script>
|
||||
Reference in New Issue
Block a user