piratezon_new/app/pages/site-manager/dashboard.vue

<template>
  <div class="admin--dashboard">
    <div class="admin--dashboard-stats">
      <div class="admin--stat-card">
        <div class="admin--stat-icon">📊</div>
        <div class="admin--stat-content">
          <h4>총 팝업</h4>
          <p class="admin--stat-number">{{ stats.popups }}</p>
        </div>
      </div>

      <div class="admin--stat-card">
        <div class="admin--stat-icon">🏢</div>
        <div class="admin--stat-content">
          <h4>총 지점</h4>
          <p class="admin--stat-number">{{ stats.branches }}</p>
        </div>
      </div>

      <div class="admin--stat-card">
        <div class="admin--stat-icon">👥</div>
        <div class="admin--stat-content">
          <h4>총 직원</h4>
          <p class="admin--stat-number">{{ stats.employees }}</p>
        </div>
      </div>

      <div class="admin--stat-card">
        <div class="admin--stat-icon">📝</div>
        <div class="admin--stat-content">
          <h4>브로셔 요청</h4>
          <p class="admin--stat-number">{{ stats.brochures }}</p>
        </div>
      </div>
    </div>

    <div class="admin--dashboard-recent">
      <h4>최근 활동</h4>
      <div class="admin--recent-list">
        <p class="admin--no-data">최근 활동 내역이 없습니다.</p>
      </div>
    </div>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'

definePageMeta({
  layout: 'admin',
  middleware: ['auth']
})

const stats = ref({
  popups: 0,
  branches: 0,
  employees: 0,
  brochures: 0
})

const { get } = useApi()

const loadDashboardStats = async () => {
  const { data, error } = await get('/dashboard/stats')

  console.log('[Dashboard] API 응답:', { data, error })

  if (error) {
    console.error('[Dashboard] 통계 로드 실패:', error)
    return
  }

  // API 응답: { success: true, data: { popups, branches, employees, brochures } }
  if (data?.success && data?.data) {
    stats.value = data.data
    console.log('[Dashboard] 통계 로드 성공:', stats.value)
  }
}

onMounted(() => {
  loadDashboardStats()
})
</script>