fix: Remove fake hardcoded data, rebuild admin layout with real Tabler components
Root cause: user asked why logout was missing. Playwright audit against production found logout works fine, but surfaced two real defects and led to a wider audit that found extensive fabricated data across the admin pages -- none of it backed by the database despite CLAUDE.md's policy that all data must come from DB records. Layout (_AdminLayout.cshtml): - Full rewrite using Tabler's actual navbar-vertical/page-wrapper/footer component structure instead of ad-hoc inline CSS. The old layout had no footer element at all, and its mobile breakpoint CSS hid the sidebar off-screen (left: -260px) with no hamburger button to bring it back -- verified via Playwright screenshot at 375px width that the entire nav menu was inaccessible on mobile, leaving only Logout reachable. Tabler's navbar-toggler + Bootstrap collapse (bundled in tabler.min.js) now restores it; verified the toggle actually opens the menu via Playwright. - Active nav-link highlighting moved from client-side JS string matching to a server-side Razor helper against Context.Request.Path. Fake/hardcoded data removed or replaced with real DB/Hangfire state: - Dashboard: deleted the "최근 시스템 이벤트" table (3 rows hardcoded from DateTime.Now with fake descriptions like "시스템 초기화" / "데이터베이스 백업" -- no backing table exists). Removed hardcoded "정상"/"연결됨" status badges and "버전: v0.1.0"/"업타임: 정상"; replaced with a real IsDatabaseConnected flag (true only if the page's actual DB queries succeeded) and the real IWebHostEnvironment.EnvironmentName. - Monitoring: removed hardcoded "API 서버: 운영 중" (no real signal backs it) and wired "데이터베이스: 연결 정상/끊김" to the same real success/failure state as the page's own DB calls. - Operations: this page was entirely fabricated -- ScheduledJobs, RecentExecutions, IsJobProcessorRunning, PendingJobsCount, and StatusMessage were all static values with zero connection to Hangfire, despite Hangfire actually running in production (confirmed via journalctl: ServerWatchdog, RecurringJobScheduler dispatchers active) with 4 real recurring jobs registered in SchedulerService (daily-collection, hourly-price-update, weekly-report, monthly-optimization). Rewrote to query JobStorage.Current.GetConnection().GetRecurringJobs() and GetMonitoringApi() directly: real scheduled jobs, real succeeded/ failed executions, real server count, real enqueued count. Verified locally (SSH-tunneled to prod DB) that this now returns the actual 4 registered jobs with correct next-run times and one real RunDailyCollectionAsync execution. Also fixed the page-title duplication on Monitoring/Operations (ViewData["Title"] included "- QuantEngine" AND the layout appended it again -> "모니터링 - QuantEngine - QuantEngine" in the browser tab). Separately discovered (not fixed in this commit, flagging for follow-up): Hangfire's SchedulerService.InitializeSchedules() fails every startup with "Cannot resolve scoped service 'SchedulerService' from root provider" -- the 4 recurring jobs above still show up because they persist from an earlier successful registration, but re-registration is silently broken on every current boot. Verified end-to-end with Playwright against a local instance (SSH tunnel to production Postgres): login, all 5 admin pages render without errors, mobile hamburger opens the sidebar, and Operations shows genuine Hangfire data.
This commit is contained in:
@@ -1,5 +1,8 @@
|
||||
@{
|
||||
Layout = null;
|
||||
|
||||
var currentPath = Context.Request.Path.Value?.ToLowerInvariant() ?? "";
|
||||
string NavActive(string href) => currentPath.StartsWith(href.ToLowerInvariant()) ? "active" : "";
|
||||
}
|
||||
|
||||
<!DOCTYPE html>
|
||||
@@ -16,233 +19,106 @@
|
||||
|
||||
<!-- Custom Admin CSS -->
|
||||
<link rel="stylesheet" href="~/css/admin.css" asp-append-version="true" />
|
||||
|
||||
<style>
|
||||
html, body {
|
||||
height: 100%;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.page {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
width: 260px;
|
||||
background-color: #2c3e50;
|
||||
color: white;
|
||||
overflow-y: auto;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.sidebar-brand {
|
||||
padding: 1.5rem;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.sidebar-brand a {
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
font-weight: 600;
|
||||
font-size: 1.25rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
.sidebar-nav {
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.sidebar-nav .nav-link {
|
||||
padding: 0.75rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.8);
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.75rem;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
|
||||
.sidebar-nav .nav-link:hover,
|
||||
.sidebar-nav .nav-link.active {
|
||||
color: white;
|
||||
background-color: rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.sidebar-nav .nav-link i {
|
||||
width: 1.25rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.topbar {
|
||||
background-color: white;
|
||||
border-bottom: 1px solid #e0e0e0;
|
||||
padding: 1rem 1.5rem;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-shrink: 0;
|
||||
height: 64px;
|
||||
}
|
||||
|
||||
.topbar-left {
|
||||
font-weight: 600;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
.topbar-right {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.topbar-right .btn {
|
||||
padding: 0.375rem 0.75rem;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
.page-content {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 2rem;
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.container-xl {
|
||||
max-width: 1400px;
|
||||
margin: 0 auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
margin-bottom: 2rem;
|
||||
}
|
||||
|
||||
.page-header .page-title {
|
||||
font-size: 1.75rem;
|
||||
font-weight: 600;
|
||||
color: #2c3e50;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.page-header .page-subtitle {
|
||||
color: #7a8a99;
|
||||
font-size: 0.875rem;
|
||||
}
|
||||
|
||||
@@media (max-width: 768px) {
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
left: -260px;
|
||||
height: 100vh;
|
||||
z-index: 999;
|
||||
transition: left 0.3s;
|
||||
}
|
||||
|
||||
.sidebar.show {
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="wrapper">
|
||||
<!-- Topbar -->
|
||||
<div class="topbar">
|
||||
<div class="topbar-left">
|
||||
<span id="page-title">QuantEngine Admin</span>
|
||||
</div>
|
||||
<div class="topbar-right">
|
||||
<a href="/Account/Logout" class="btn btn-sm btn-outline-danger">
|
||||
<i class="ti ti-logout me-1"></i> 로그아웃
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Main -->
|
||||
<div class="page">
|
||||
<!-- Sidebar -->
|
||||
<nav class="sidebar">
|
||||
<div class="sidebar-brand">
|
||||
<a href="/Admin/Dashboard">
|
||||
<div class="page">
|
||||
<!-- Sidebar (left) -->
|
||||
<aside class="navbar navbar-vertical navbar-expand-lg navbar-dark" data-bs-theme="dark">
|
||||
<div class="container-fluid">
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#sidebar-menu" aria-controls="sidebar-menu" aria-expanded="false" aria-label="메뉴 토글">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<h1 class="navbar-brand navbar-brand-autodark">
|
||||
<a href="/Admin/Dashboard" class="d-flex align-items-center gap-2 text-decoration-none">
|
||||
<i class="ti ti-chart-line" style="font-size: 1.5rem;"></i>
|
||||
<span>QuantEngine</span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="sidebar-nav">
|
||||
<a href="/Admin/Dashboard" class="nav-link">
|
||||
<i class="ti ti-dashboard"></i>
|
||||
<span>대시보드</span>
|
||||
</a>
|
||||
<a href="/Admin/Collection" class="nav-link">
|
||||
<i class="ti ti-database"></i>
|
||||
<span>데이터 수집</span>
|
||||
</a>
|
||||
<a href="/Admin/Monitoring" class="nav-link">
|
||||
<i class="ti ti-eye"></i>
|
||||
<span>모니터링</span>
|
||||
</a>
|
||||
<a href="/Admin/Users" class="nav-link">
|
||||
<i class="ti ti-users"></i>
|
||||
<span>사용자 관리</span>
|
||||
</a>
|
||||
<a href="/Admin/Operations" class="nav-link">
|
||||
<i class="ti ti-settings"></i>
|
||||
<span>운영 관리</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Page Content -->
|
||||
<div class="main-content">
|
||||
<div class="page-content">
|
||||
<div class="container-xl">
|
||||
@RenderBody()
|
||||
</div>
|
||||
</h1>
|
||||
<div class="collapse navbar-collapse" id="sidebar-menu">
|
||||
<ul class="navbar-nav pt-lg-3">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link @NavActive("/Admin/Dashboard")" href="/Admin/Dashboard">
|
||||
<span class="nav-link-icon"><i class="ti ti-dashboard"></i></span>
|
||||
<span class="nav-link-title">대시보드</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link @NavActive("/Admin/Collection")" href="/Admin/Collection">
|
||||
<span class="nav-link-icon"><i class="ti ti-database"></i></span>
|
||||
<span class="nav-link-title">데이터 수집</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link @NavActive("/Admin/Monitoring")" href="/Admin/Monitoring">
|
||||
<span class="nav-link-icon"><i class="ti ti-eye"></i></span>
|
||||
<span class="nav-link-title">모니터링</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link @NavActive("/Admin/Users")" href="/Admin/Users">
|
||||
<span class="nav-link-icon"><i class="ti ti-users"></i></span>
|
||||
<span class="nav-link-title">사용자 관리</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link @NavActive("/Admin/Operations")" href="/Admin/Operations">
|
||||
<span class="nav-link-icon"><i class="ti ti-settings"></i></span>
|
||||
<span class="nav-link-title">운영 관리</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- Topbar -->
|
||||
<header class="navbar navbar-expand-md navbar-light d-print-none">
|
||||
<div class="container-xl">
|
||||
<div class="navbar-nav flex-row flex-fill justify-content-between align-items-center">
|
||||
<span class="fw-medium">@ViewData["Title"]</span>
|
||||
<a href="/Account/Logout" class="btn btn-sm btn-outline-danger">
|
||||
<i class="ti ti-logout me-1"></i> 로그아웃
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="page-wrapper">
|
||||
<!-- Center content -->
|
||||
<div class="page-body">
|
||||
<div class="container-xl">
|
||||
@RenderBody()
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer footer-transparent d-print-none">
|
||||
<div class="container-xl">
|
||||
<div class="row text-center align-items-center flex-row-reverse">
|
||||
<div class="col-lg-auto ms-lg-auto">
|
||||
<ul class="list-inline list-inline-dots mb-0">
|
||||
<li class="list-inline-item">
|
||||
<a href="/Admin/Dashboard" class="link-secondary">대시보드</a>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<a href="/Admin/Operations" class="link-secondary">운영 관리</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-auto mt-3 mt-lg-0">
|
||||
<ul class="list-inline list-inline-dots mb-0">
|
||||
<li class="list-inline-item">
|
||||
© @DateTime.UtcNow.Year QuantEngine
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Tabler JS -->
|
||||
<!-- Tabler JS (bundles Bootstrap JS, incl. the Collapse plugin used by the mobile sidebar toggle above) -->
|
||||
<script src="https://cdn.jsdelivr.net/npm/@@tabler/core@1.0.0/dist/js/tabler.min.js"></script>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
const links = document.querySelectorAll('.sidebar-nav .nav-link');
|
||||
const currentPath = window.location.pathname.toLowerCase();
|
||||
|
||||
links.forEach(link => {
|
||||
const href = link.getAttribute('href').toLowerCase();
|
||||
if (currentPath.startsWith(href)) {
|
||||
link.classList.add('active');
|
||||
} else {
|
||||
link.classList.remove('active');
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user