<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>
