Restructures project with feature-based organization
Refactors project structure to support modular, feature-driven development Introduces comprehensive language localization support Adds menu management with role-based access control Implements dynamic sidebar and theme switching capabilities Enhances project scalability and maintainability
This commit is contained in:
Janus C. H. Knudsen
parent
fac7754d7a
commit
d7f3c55a2a
60 changed files with 3214 additions and 20 deletions
39
app/Views/Shared/Components/SideMenu/Default.cshtml
Normal file
39
app/Views/Shared/Components/SideMenu/Default.cshtml
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
@model CalendarServer.Features.Menu.SideMenuViewModel
|
||||
|
||||
<swp-side-menu>
|
||||
<swp-side-menu-header>
|
||||
<i class="ph ph-squares-four"></i>
|
||||
<swp-side-menu-logo localize="sidebar.appName">Salon OS</swp-side-menu-logo>
|
||||
<swp-menu-toggle id="menuToggle">
|
||||
<i class="ph ph-caret-left"></i>
|
||||
</swp-menu-toggle>
|
||||
</swp-side-menu-header>
|
||||
|
||||
<swp-side-menu-nav>
|
||||
@foreach (var group in Model.Groups)
|
||||
{
|
||||
<swp-side-menu-group>
|
||||
<swp-side-menu-label>@group.Label</swp-side-menu-label>
|
||||
@foreach (var item in group.Items)
|
||||
{
|
||||
<a href="@item.Url" is="swp-side-menu-item"
|
||||
data-active="@(item.IsActive ? "true" : "false")"
|
||||
data-tooltip="@item.Label">
|
||||
<i class="ph @item.Icon"></i>
|
||||
<span>@item.Label</span>
|
||||
</a>
|
||||
}
|
||||
</swp-side-menu-group>
|
||||
}
|
||||
</swp-side-menu-nav>
|
||||
|
||||
<swp-side-menu-footer>
|
||||
<swp-side-menu-action class="lock" id="lockScreen" title="Lås skærm">
|
||||
<i class="ph ph-lock"></i>
|
||||
<span localize="sidebar.lockScreen">Lås skærm</span>
|
||||
</swp-side-menu-action>
|
||||
</swp-side-menu-footer>
|
||||
</swp-side-menu>
|
||||
|
||||
<!-- Tooltip for collapsed menu -->
|
||||
<span id="menuTooltip" class="swp-menu-tooltip" popover="manual"></span>
|
||||
49
app/Views/Shared/Components/_ProfileDrawer.cshtml
Normal file
49
app/Views/Shared/Components/_ProfileDrawer.cshtml
Normal file
|
|
@ -0,0 +1,49 @@
|
|||
<swp-profile-drawer id="profileDrawer">
|
||||
<swp-drawer-header>
|
||||
<swp-drawer-title>Profil</swp-drawer-title>
|
||||
<swp-drawer-close id="closeProfileDrawer">
|
||||
<i class="ph ph-x"></i>
|
||||
</swp-drawer-close>
|
||||
</swp-drawer-header>
|
||||
|
||||
<swp-drawer-content>
|
||||
<swp-profile-section>
|
||||
<swp-profile-avatar-large>MJ</swp-profile-avatar-large>
|
||||
<swp-profile-name-large>Maria Jensen</swp-profile-name-large>
|
||||
<swp-profile-email>maria@salon.dk</swp-profile-email>
|
||||
</swp-profile-section>
|
||||
|
||||
<swp-drawer-divider></swp-drawer-divider>
|
||||
|
||||
<swp-drawer-menu>
|
||||
<swp-drawer-menu-item>
|
||||
<i class="ph ph-user"></i>
|
||||
<span>Min profil</span>
|
||||
</swp-drawer-menu-item>
|
||||
<swp-drawer-menu-item>
|
||||
<i class="ph ph-gear"></i>
|
||||
<span>Indstillinger</span>
|
||||
</swp-drawer-menu-item>
|
||||
</swp-drawer-menu>
|
||||
|
||||
<swp-drawer-divider></swp-drawer-divider>
|
||||
|
||||
<swp-theme-toggle>
|
||||
<swp-theme-label>
|
||||
<i class="ph ph-moon"></i>
|
||||
<span>Mørk tilstand</span>
|
||||
</swp-theme-label>
|
||||
<swp-toggle-switch id="themeToggle">
|
||||
<input type="checkbox" id="themeCheckbox">
|
||||
<swp-toggle-slider></swp-toggle-slider>
|
||||
</swp-toggle-switch>
|
||||
</swp-theme-toggle>
|
||||
</swp-drawer-content>
|
||||
|
||||
<swp-drawer-footer>
|
||||
<swp-drawer-action class="logout" id="logoutBtn">
|
||||
<i class="ph ph-sign-out"></i>
|
||||
<span>Log ud</span>
|
||||
</swp-drawer-action>
|
||||
</swp-drawer-footer>
|
||||
</swp-profile-drawer>
|
||||
78
app/Views/Shared/Components/_SideMenu.cshtml
Normal file
78
app/Views/Shared/Components/_SideMenu.cshtml
Normal file
|
|
@ -0,0 +1,78 @@
|
|||
<swp-side-menu>
|
||||
<swp-side-menu-header>
|
||||
<i class="ph ph-squares-four"></i>
|
||||
<swp-side-menu-logo>Salon OS</swp-side-menu-logo>
|
||||
<swp-menu-toggle id="menuToggle">
|
||||
<i class="ph ph-caret-left"></i>
|
||||
</swp-menu-toggle>
|
||||
</swp-side-menu-header>
|
||||
|
||||
<swp-side-menu-nav>
|
||||
<!-- DASHBOARD -->
|
||||
<swp-side-menu-group>
|
||||
<swp-side-menu-label>Dashboard</swp-side-menu-label>
|
||||
<a asp-controller="Home" asp-action="Index" is="swp-side-menu-item" data-tooltip="Dashboard">
|
||||
<i class="ph ph-squares-four"></i>
|
||||
<span>Dashboard</span>
|
||||
</a>
|
||||
<a href="/poc-calendar.html" is="swp-side-menu-item" data-tooltip="Kalender">
|
||||
<i class="ph ph-calendar"></i>
|
||||
<span>Kalender</span>
|
||||
</a>
|
||||
<a href="#" is="swp-side-menu-item" data-tooltip="Kasse">
|
||||
<i class="ph ph-device-mobile"></i>
|
||||
<span>Kasse</span>
|
||||
</a>
|
||||
</swp-side-menu-group>
|
||||
|
||||
<!-- DATA -->
|
||||
<swp-side-menu-group>
|
||||
<swp-side-menu-label>Data</swp-side-menu-label>
|
||||
<a href="/poc-produkter.html" is="swp-side-menu-item" data-tooltip="Produkter & Lager">
|
||||
<i class="ph ph-package"></i>
|
||||
<span>Produkter & Lager</span>
|
||||
</a>
|
||||
<a href="/poc-leverandoerer.html" is="swp-side-menu-item" data-tooltip="Leverandører">
|
||||
<i class="ph ph-truck"></i>
|
||||
<span>Leverandører</span>
|
||||
</a>
|
||||
<a href="#" is="swp-side-menu-item" data-tooltip="Kunder">
|
||||
<i class="ph ph-users"></i>
|
||||
<span>Kunder</span>
|
||||
</a>
|
||||
<a href="/poc-medarbejdere.html" is="swp-side-menu-item" data-tooltip="Medarbejdere">
|
||||
<i class="ph ph-user"></i>
|
||||
<span>Medarbejdere</span>
|
||||
</a>
|
||||
</swp-side-menu-group>
|
||||
|
||||
<!-- ANALYSE -->
|
||||
<swp-side-menu-group>
|
||||
<swp-side-menu-label>Analyse</swp-side-menu-label>
|
||||
<a href="#" is="swp-side-menu-item" data-tooltip="Statistik & Rapporter">
|
||||
<i class="ph ph-chart-bar"></i>
|
||||
<span>Statistik & Rapporter</span>
|
||||
</a>
|
||||
</swp-side-menu-group>
|
||||
|
||||
<!-- SYSTEM -->
|
||||
<swp-side-menu-group>
|
||||
<swp-side-menu-label>System</swp-side-menu-label>
|
||||
<a href="/poc-indstillinger.html" is="swp-side-menu-item" data-tooltip="Indstillinger">
|
||||
<i class="ph ph-gear"></i>
|
||||
<span>Indstillinger</span>
|
||||
</a>
|
||||
<a href="/poc-konto.html" is="swp-side-menu-item" data-tooltip="Abonnement & Konto">
|
||||
<i class="ph ph-credit-card"></i>
|
||||
<span>Abonnement & Konto</span>
|
||||
</a>
|
||||
</swp-side-menu-group>
|
||||
</swp-side-menu-nav>
|
||||
|
||||
<swp-side-menu-footer>
|
||||
<swp-side-menu-action class="lock" id="lockScreen" title="Lås skærm">
|
||||
<i class="ph ph-lock"></i>
|
||||
<span>Lås skærm</span>
|
||||
</swp-side-menu-action>
|
||||
</swp-side-menu-footer>
|
||||
</swp-side-menu>
|
||||
26
app/Views/Shared/Components/_TopBar.cshtml
Normal file
26
app/Views/Shared/Components/_TopBar.cshtml
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
<swp-app-topbar>
|
||||
<swp-topbar-search>
|
||||
<i class="ph ph-magnifying-glass"></i>
|
||||
<input type="text" placeholder="Søg i Salon OS..." id="globalSearch">
|
||||
<kbd>⌘K</kbd>
|
||||
</swp-topbar-search>
|
||||
|
||||
<swp-topbar-actions>
|
||||
<!-- Notifications -->
|
||||
<swp-topbar-btn id="notificationsBtn" title="Notifikationer">
|
||||
<i class="ph ph-bell"></i>
|
||||
<swp-notification-badge>3</swp-notification-badge>
|
||||
</swp-topbar-btn>
|
||||
|
||||
<swp-topbar-divider></swp-topbar-divider>
|
||||
|
||||
<!-- Profile (opens drawer) -->
|
||||
<swp-topbar-profile id="profileTrigger">
|
||||
<swp-profile-avatar>MJ</swp-profile-avatar>
|
||||
<swp-profile-info>
|
||||
<swp-profile-name>Maria Jensen</swp-profile-name>
|
||||
<swp-profile-role>Administrator</swp-profile-role>
|
||||
</swp-profile-info>
|
||||
</swp-topbar-profile>
|
||||
</swp-topbar-actions>
|
||||
</swp-app-topbar>
|
||||
38
app/Views/Shared/_Layout.cshtml
Normal file
38
app/Views/Shared/_Layout.cshtml
Normal file
|
|
@ -0,0 +1,38 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="da">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>@ViewData["Title"] - Salon OS</title>
|
||||
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@@phosphor-icons/web@@2.1.2/src/regular/style.css" />
|
||||
<!-- Design System -->
|
||||
<link rel="stylesheet" href="~/css/design-system.css">
|
||||
<link rel="stylesheet" href="~/css/base.css">
|
||||
<!-- Layout Components -->
|
||||
<link rel="stylesheet" href="~/css/app-layout.css">
|
||||
<link rel="stylesheet" href="~/css/sidebar.css">
|
||||
<link rel="stylesheet" href="~/css/topbar.css">
|
||||
<link rel="stylesheet" href="~/css/drawers.css">
|
||||
<!-- Page Components -->
|
||||
<link rel="stylesheet" href="~/css/page.css">
|
||||
<link rel="stylesheet" href="~/css/stats.css">
|
||||
@await RenderSectionAsync("Styles", required: false)
|
||||
</head>
|
||||
<body>
|
||||
<swp-app-layout id="appLayout">
|
||||
@await Component.InvokeAsync("SideMenu")
|
||||
@await Html.PartialAsync("Components/_TopBar")
|
||||
|
||||
<swp-main-content>
|
||||
@RenderBody()
|
||||
</swp-main-content>
|
||||
</swp-app-layout>
|
||||
|
||||
@await Html.PartialAsync("Components/_ProfileDrawer")
|
||||
<swp-drawer-overlay id="drawerOverlay"></swp-drawer-overlay>
|
||||
|
||||
<script type="module" src="~/js/app.js"></script>
|
||||
@await RenderSectionAsync("Scripts", required: false)
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue