32 lines
No EOL
1 KiB
Vue
32 lines
No EOL
1 KiB
Vue
<template>
|
|
<div class="max-w-6xl mx-auto px-4 py-6 space-y-8" data-ui="dashboard_v1">
|
|
<!-- Header -->
|
|
<div class="flex items-center justify-between">
|
|
<h1 class="text-2xl font-semibold">Dashboard</h1>
|
|
<div class="flex items-center gap-3">
|
|
<span class="text-sm text-gray-600">Min</span>
|
|
<UToggle
|
|
:model-value="operatingMode === 'target'"
|
|
@update:model-value="(value) => setOperatingMode(value ? 'target' : 'min')"
|
|
/>
|
|
<span class="text-sm text-gray-600">Target</span>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Core Metrics -->
|
|
<DashboardCoreMetrics />
|
|
|
|
<!-- Member Coverage -->
|
|
<MemberCoveragePanel />
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
// Import components explicitly to avoid auto-import issues
|
|
import DashboardCoreMetrics from '~/components/dashboard/DashboardCoreMetrics.vue'
|
|
import MemberCoveragePanel from '~/components/dashboard/MemberCoveragePanel.vue'
|
|
|
|
// Access composable data
|
|
const { operatingMode, setOperatingMode } = useCoopBuilder()
|
|
</script> |