init

2026-08-28 17:31:02 +02:00
commit 2b30e8bd39
694 changed files with 49243 additions and 0 deletions
@@ -0,0 +1,88 @@
+<template>
+    <el-container direction="vertical">
+        <el-header v-if="!route.meta.hideNav" height="auto" class="cms-header">
+            <div class="cms-header__bar flex items-center gap-12">
+                <div class="logo">Nullcart CMS</div>
+
+                <el-menu
+                    mode="horizontal"
+                    :ellipsis="true"
+                    menu-trigger="click"
+                    close-on-click-outside
+                    :default-active="menuActive"
+                    class="cms-nav-menu"
+                    router
+                >
+                    <el-menu-item index="/products">Products</el-menu-item>
+                    <el-menu-item index="/categories">Categories</el-menu-item>
+                    <el-menu-item index="/discount-codes">Discount codes</el-menu-item>
+                    <el-menu-item index="/orders">Orders</el-menu-item>
+                    <el-menu-item index="/wallet">Wallet</el-menu-item>
+                    <el-menu-item index="/settings">Settings</el-menu-item>
+                </el-menu>
+
+                <div class="cms-header__actions flex items-center gap-8">
+                    <theme-toggle />
+                    <el-button link type="primary" @click="onSignOut">Sign out</el-button>
+                </div>
+            </div>
+        </el-header>
+
+        <el-main class="main-wrapper">
+            <router-view />
+        </el-main>
+    </el-container>
+</template>
+
+<script setup lang="ts">
+import { computed, onBeforeMount } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import { ROUTE_NAMES } from '@/consts/routeNames';
+import { useAuthStore } from '@/stores/auth';
+import { useColorSchemeStore } from '@/stores/colorScheme';
+
+const route = useRoute();
+const router = useRouter();
+const authStore = useAuthStore();
+const colorSchemeStore = useColorSchemeStore();
+
+const menuActive = computed(() => route.meta.activeMenu ?? route.path);
+
+onBeforeMount(() => {
+    colorSchemeStore.initColorScheme();
+});
+
+const onSignOut = () => {
+    authStore.clearSession();
+
+    router.push({ name: ROUTE_NAMES.Login });
+};
+</script>
+
+<style scoped>
+.cms-header__bar {
+    min-width: 0;
+}
+
+.logo {
+    flex-shrink: 0;
+    font-size: var(--el-font-size-large);
+    font-weight: var(--el-font-weight-primary);
+    white-space: nowrap;
+}
+
+.cms-nav-menu {
+    flex: 1;
+    min-width: 0;
+    border-bottom: none;
+    background-color: transparent;
+}
+
+.cms-header__actions {
+    flex-shrink: 0;
+}
+
+.main-wrapper {
+    min-height: calc(100vh - var(--el-header-height));
+}
+</style>