342 lines
16 KiB
Plaintext
342 lines
16 KiB
Plaintext
<!-- Tabler Dashboard -->
|
|
<div class="row row-deck row-cards">
|
|
<!-- Stats Cards -->
|
|
<div class="col-12">
|
|
<div class="row row-cards">
|
|
<div class="col-sm-6 col-lg-3">
|
|
<div class="card card-sm">
|
|
<div class="card-body">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<span class="bg-primary text-white avatar">
|
|
<i class="fas fa-briefcase"></i>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="font-weight-medium">
|
|
포트폴리오 프로젝트
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= stats.portfolioCount || 0 %>개 프로젝트
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-3">
|
|
<div class="card card-sm">
|
|
<div class="card-body">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<span class="bg-green text-white avatar">
|
|
<i class="fas fa-cogs"></i>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="font-weight-medium">
|
|
제공 서비스
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= stats.servicesCount || 0 %>개 서비스
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-3">
|
|
<div class="card card-sm">
|
|
<div class="card-body">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<span class="bg-yellow text-white avatar">
|
|
<i class="fas fa-envelope"></i>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="font-weight-medium">
|
|
문의 메시지
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= stats.contactsCount || 0 %>개 메시지
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-sm-6 col-lg-3">
|
|
<div class="card card-sm">
|
|
<div class="card-body">
|
|
<div class="row align-items-center">
|
|
<div class="col-auto">
|
|
<span class="bg-red text-white avatar">
|
|
<i class="fas fa-users"></i>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="font-weight-medium">
|
|
관리자 계정
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= stats.usersCount || 0 %>명 사용자
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Recent Portfolio Projects -->
|
|
<div class="col-lg-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">최근 포트폴리오 프로젝트</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<% if (recentPortfolio && recentPortfolio.length > 0) { %>
|
|
<div class="divide-y">
|
|
<% recentPortfolio.forEach(function(project, index) { %>
|
|
<div class="row <%= index < recentPortfolio.length - 1 ? 'py-2' : 'pt-2' %>">
|
|
<div class="col-auto">
|
|
<span class="avatar avatar-sm bg-blue-lt">
|
|
<i class="fas fa-code"></i>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="text-truncate">
|
|
<strong><%= project.title %></strong>
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= project.category %> •
|
|
<%= project.createdAt ? project.createdAt.toLocaleDateString('ko-KR') : '날짜 없음' %>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<span class="badge bg-<%= project.status === 'completed' ? 'green' : project.status === 'in-progress' ? 'yellow' : 'blue' %>">
|
|
<%= project.status === 'completed' ? '완료' : project.status === 'in-progress' ? '진행중' : '계획' %>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
<div class="mt-3">
|
|
<a href="/admin/portfolio" class="btn btn-primary btn-sm w-100">
|
|
모든 프로젝트 보기
|
|
</a>
|
|
</div>
|
|
<% } else { %>
|
|
<div class="empty">
|
|
<div class="empty-img">
|
|
<i class="fas fa-briefcase fa-3x text-muted"></i>
|
|
</div>
|
|
<p class="empty-title">포트폴리오가 없습니다</p>
|
|
<p class="empty-subtitle text-muted">
|
|
첫 번째 프로젝트를 추가해보세요
|
|
</p>
|
|
<div class="empty-action">
|
|
<a href="/admin/portfolio/add" class="btn btn-primary">
|
|
<i class="fas fa-plus"></i>
|
|
프로젝트 추가
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Recent Contact Messages -->
|
|
<div class="col-lg-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">최근 문의 메시지</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<% if (recentContacts && recentContacts.length > 0) { %>
|
|
<div class="divide-y">
|
|
<% recentContacts.forEach(function(contact, index) { %>
|
|
<div class="row <%= index < recentContacts.length - 1 ? 'py-2' : 'pt-2' %>">
|
|
<div class="col-auto">
|
|
<span class="avatar avatar-sm">
|
|
<%= contact.name ? contact.name.charAt(0).toUpperCase() : 'U' %>
|
|
</span>
|
|
</div>
|
|
<div class="col">
|
|
<div class="text-truncate">
|
|
<strong><%= contact.name %></strong>
|
|
</div>
|
|
<div class="text-muted">
|
|
<%= contact.email %> •
|
|
<%= contact.createdAt ? contact.createdAt.toLocaleDateString('ko-KR') : '날짜 없음' %>
|
|
</div>
|
|
</div>
|
|
<div class="col-auto">
|
|
<span class="badge bg-<%= contact.status === 'replied' ? 'green' : contact.status === 'pending' ? 'yellow' : 'blue' %>">
|
|
<%= contact.status === 'replied' ? '답변완료' : contact.status === 'pending' ? '대기중' : '신규' %>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<% }); %>
|
|
</div>
|
|
<div class="mt-3">
|
|
<a href="/admin/contacts" class="btn btn-warning btn-sm w-100">
|
|
모든 문의 보기
|
|
</a>
|
|
</div>
|
|
<% } else { %>
|
|
<div class="empty">
|
|
<div class="empty-img">
|
|
<i class="fas fa-envelope fa-3x text-muted"></i>
|
|
</div>
|
|
<p class="empty-title">새로운 문의가 없습니다</p>
|
|
<p class="empty-subtitle text-muted">
|
|
고객 문의가 들어오면 여기에 표시됩니다
|
|
</p>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Quick Actions -->
|
|
<div class="col-12">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">빠른 작업</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-md-3">
|
|
<a href="/admin/portfolio/add" class="card card-link bg-primary-lt">
|
|
<div class="card-body text-center">
|
|
<div class="text-primary mb-3">
|
|
<i class="fas fa-plus fa-2x"></i>
|
|
</div>
|
|
<div class="font-weight-medium">새 프로젝트</div>
|
|
<div class="text-muted">포트폴리오에 추가</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<a href="/admin/services" class="card card-link bg-green-lt">
|
|
<div class="card-body text-center">
|
|
<div class="text-green mb-3">
|
|
<i class="fas fa-cog fa-2x"></i>
|
|
</div>
|
|
<div class="font-weight-medium">서비스 관리</div>
|
|
<div class="text-muted">가격 및 내용 수정</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<a href="/admin/media" class="card card-link bg-yellow-lt">
|
|
<div class="card-body text-center">
|
|
<div class="text-yellow mb-3">
|
|
<i class="fas fa-images fa-2x"></i>
|
|
</div>
|
|
<div class="font-weight-medium">미디어 업로드</div>
|
|
<div class="text-muted">이미지 및 파일 관리</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<a href="/admin/settings" class="card card-link bg-red-lt">
|
|
<div class="card-body text-center">
|
|
<div class="text-red mb-3">
|
|
<i class="fas fa-wrench fa-2x"></i>
|
|
</div>
|
|
<div class="font-weight-medium">사이트 설정</div>
|
|
<div class="text-muted">전체 설정 관리</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- System Status & Analytics -->
|
|
<div class="col-lg-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">시스템 상태</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="d-flex align-items-center">
|
|
<div class="me-3">
|
|
<i class="fas fa-server fa-2x text-green"></i>
|
|
</div>
|
|
<div>
|
|
<div class="h4 mb-0">99.2%</div>
|
|
<div class="text-muted">서버 업타임</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="d-flex align-items-center">
|
|
<div class="me-3">
|
|
<i class="fas fa-clock fa-2x text-blue"></i>
|
|
</div>
|
|
<div>
|
|
<div class="h4 mb-0">2.3초</div>
|
|
<div class="text-muted">평균 응답시간</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Telegram Bot Status -->
|
|
<div class="col-lg-6">
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<h3 class="card-title">텔레그램 봇</h3>
|
|
</div>
|
|
<div class="card-body">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="d-flex align-items-center">
|
|
<div class="me-3">
|
|
<i class="fab fa-telegram fa-2x text-green"></i>
|
|
</div>
|
|
<div>
|
|
<div class="h4 mb-0 text-green">연결됨</div>
|
|
<div class="text-muted">봇 상태</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="d-flex align-items-center">
|
|
<div class="me-3">
|
|
<i class="fas fa-paper-plane fa-2x text-blue"></i>
|
|
</div>
|
|
<div>
|
|
<div class="h4 mb-0">24</div>
|
|
<div class="text-muted">오늘 전송</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mt-3">
|
|
<a href="/admin/telegram" class="btn btn-outline-primary w-100">
|
|
텔레그램 설정
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |