276 lines
9.0 KiB
Vue
276 lines
9.0 KiB
Vue
<template>
|
|
<div>
|
|
<AppHeader />
|
|
|
|
<div class="container-fluid py-4">
|
|
<div class="row mb-4">
|
|
<div class="col">
|
|
<h4>
|
|
<i class="bi bi-speedometer2 me-2"></i>대시보드
|
|
</h4>
|
|
<p class="text-muted mb-0">
|
|
{{ currentWeek.weekString }} ({{ currentWeek.startDateStr }} ~ {{ currentWeek.endDateStr }})
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 요약 카드 -->
|
|
<div class="row g-4 mb-4">
|
|
<div class="col-md-3">
|
|
<div class="card border-primary h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<h6 class="text-muted">이번 주 내 보고서</h6>
|
|
<h2 class="mb-0">{{ stats.myReportsThisWeek }}</h2>
|
|
</div>
|
|
<div class="text-primary">
|
|
<i class="bi bi-journal-text display-4"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<div class="card border-success h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<h6 class="text-muted">참여 프로젝트</h6>
|
|
<h2 class="mb-0">{{ stats.myProjects }}</h2>
|
|
</div>
|
|
<div class="text-success">
|
|
<i class="bi bi-folder-check display-4"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<div class="card border-info h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<h6 class="text-muted">이번 주 취합</h6>
|
|
<h2 class="mb-0">{{ stats.summariesThisWeek }}</h2>
|
|
</div>
|
|
<div class="text-info">
|
|
<i class="bi bi-collection display-4"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-md-3">
|
|
<div class="card border-warning h-100">
|
|
<div class="card-body">
|
|
<div class="d-flex justify-content-between">
|
|
<div>
|
|
<h6 class="text-muted">전체 프로젝트</h6>
|
|
<h2 class="mb-0">{{ stats.totalProjects }}</h2>
|
|
</div>
|
|
<div class="text-warning">
|
|
<i class="bi bi-briefcase display-4"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-4">
|
|
<!-- 내 주간보고 -->
|
|
<div class="col-lg-6">
|
|
<div class="card h-100">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<span><i class="bi bi-journal-text me-2"></i>내 주간보고</span>
|
|
<NuxtLink to="/report/weekly/write" class="btn btn-primary btn-sm">
|
|
<i class="bi bi-plus"></i> 작성
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<div class="list-group list-group-flush" v-if="myReports.length > 0">
|
|
<NuxtLink
|
|
v-for="report in myReports"
|
|
:key="report.reportId"
|
|
:to="`/report/weekly/${report.reportId}`"
|
|
class="list-group-item list-group-item-action"
|
|
>
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<strong>{{ report.projectName }}</strong>
|
|
<br />
|
|
<small class="text-muted">
|
|
{{ report.reportYear }}-W{{ String(report.reportWeek).padStart(2, '0') }}
|
|
</small>
|
|
</div>
|
|
<span :class="getStatusBadgeClass(report.reportStatus)">
|
|
{{ getStatusText(report.reportStatus) }}
|
|
</span>
|
|
</div>
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="p-4 text-center text-muted" v-else>
|
|
<i class="bi bi-inbox display-4"></i>
|
|
<p class="mt-2 mb-0">작성한 보고서가 없습니다.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 최근 취합 보고서 -->
|
|
<div class="col-lg-6">
|
|
<div class="card h-100">
|
|
<div class="card-header d-flex justify-content-between align-items-center">
|
|
<span><i class="bi bi-collection me-2"></i>최근 취합 보고서</span>
|
|
<NuxtLink to="/report/summary" class="btn btn-outline-secondary btn-sm">
|
|
전체보기
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="card-body p-0">
|
|
<div class="list-group list-group-flush" v-if="summaries.length > 0">
|
|
<NuxtLink
|
|
v-for="summary in summaries"
|
|
:key="summary.summaryId"
|
|
:to="`/report/summary/${summary.summaryId}`"
|
|
class="list-group-item list-group-item-action"
|
|
>
|
|
<div class="d-flex justify-content-between align-items-center">
|
|
<div>
|
|
<strong>{{ summary.projectName }}</strong>
|
|
<br />
|
|
<small class="text-muted">
|
|
{{ summary.reportYear }}-W{{ String(summary.reportWeek).padStart(2, '0') }}
|
|
· {{ summary.memberCount }}명 참여
|
|
</small>
|
|
</div>
|
|
<span :class="getSummaryBadgeClass(summary.summaryStatus)">
|
|
{{ getSummaryStatusText(summary.summaryStatus) }}
|
|
</span>
|
|
</div>
|
|
</NuxtLink>
|
|
</div>
|
|
<div class="p-4 text-center text-muted" v-else>
|
|
<i class="bi bi-inbox display-4"></i>
|
|
<p class="mt-2 mb-0">취합된 보고서가 없습니다.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const { currentUser, fetchCurrentUser } = useAuth()
|
|
const { getCurrentWeekInfo } = useWeekCalc()
|
|
const router = useRouter()
|
|
|
|
const currentWeek = getCurrentWeekInfo()
|
|
|
|
const stats = ref({
|
|
myReportsThisWeek: 0,
|
|
myProjects: 0,
|
|
summariesThisWeek: 0,
|
|
totalProjects: 0
|
|
})
|
|
|
|
const myReports = ref<any[]>([])
|
|
const summaries = ref<any[]>([])
|
|
|
|
// 로그인 체크 및 데이터 로드
|
|
onMounted(async () => {
|
|
const user = await fetchCurrentUser()
|
|
if (!user) {
|
|
router.push('/login')
|
|
return
|
|
}
|
|
|
|
await loadDashboardData()
|
|
})
|
|
|
|
async function loadDashboardData() {
|
|
try {
|
|
// 내 주간보고 목록
|
|
const reportsRes = await $fetch<{ reports: any[] }>('/api/report/weekly/list', {
|
|
query: { limit: 5 }
|
|
})
|
|
myReports.value = reportsRes.reports || []
|
|
|
|
// 취합 보고서 목록
|
|
const summariesRes = await $fetch<{ summaries: any[] }>('/api/report/summary/list', {
|
|
query: { limit: 5 }
|
|
})
|
|
summaries.value = summariesRes.summaries || []
|
|
|
|
// 내 프로젝트
|
|
const projectsRes = await $fetch<{ projects: any[] }>('/api/project/my-projects')
|
|
|
|
// 전체 프로젝트
|
|
const allProjectsRes = await $fetch<{ projects: any[] }>('/api/project/list')
|
|
|
|
// 통계 계산
|
|
stats.value = {
|
|
myReportsThisWeek: myReports.value.filter(r =>
|
|
r.reportYear === currentWeek.year && r.reportWeek === currentWeek.week
|
|
).length,
|
|
myProjects: projectsRes.projects?.length || 0,
|
|
summariesThisWeek: summaries.value.filter(s =>
|
|
s.reportYear === currentWeek.year && s.reportWeek === currentWeek.week
|
|
).length,
|
|
totalProjects: allProjectsRes.projects?.length || 0
|
|
}
|
|
} catch (e) {
|
|
console.error('Dashboard data load error:', e)
|
|
}
|
|
}
|
|
|
|
function getStatusBadgeClass(status: string) {
|
|
const classes: Record<string, string> = {
|
|
'DRAFT': 'badge bg-secondary',
|
|
'SUBMITTED': 'badge bg-success',
|
|
'AGGREGATED': 'badge bg-info'
|
|
}
|
|
return classes[status] || 'badge bg-secondary'
|
|
}
|
|
|
|
function getStatusText(status: string) {
|
|
const texts: Record<string, string> = {
|
|
'DRAFT': '작성중',
|
|
'SUBMITTED': '제출완료',
|
|
'AGGREGATED': '취합완료'
|
|
}
|
|
return texts[status] || status
|
|
}
|
|
|
|
function getSummaryBadgeClass(status: string) {
|
|
const classes: Record<string, string> = {
|
|
'AGGREGATED': 'badge bg-info',
|
|
'REVIEWED': 'badge bg-success'
|
|
}
|
|
return classes[status] || 'badge bg-secondary'
|
|
}
|
|
|
|
function getSummaryStatusText(status: string) {
|
|
const texts: Record<string, string> = {
|
|
'AGGREGATED': '취합완료',
|
|
'REVIEWED': '검토완료'
|
|
}
|
|
return texts[status] || status
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.card {
|
|
border-radius: 0.5rem;
|
|
}
|
|
.card-header {
|
|
background-color: #f8f9fa;
|
|
font-weight: 500;
|
|
}
|
|
</style>
|