7c15f884c1
- docker-compose: add DEFAULT_ADMIN_* passthrough + CUSTOM_UI_OVERRIDE_STYLESHEETS + mount planka-custom/ - planka-custom/planka.css: hide Planka logo/title/footer, override to orange theme matching CC Dashboard - ProjectDetailView: inline edit form for display_name/client/job_number/repo_url via PATCH /api/projects/:id - ReportsView: download filename uses report.period_date + report.type (report-2026-05-07-daily.md) - AppLayout: add devops → 'Azure DevOps' title entry Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
67 lines
1.9 KiB
Vue
67 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { ref, computed } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import Sidebar from './Sidebar.vue'
|
|
import TopBar from './TopBar.vue'
|
|
|
|
const route = useRoute()
|
|
const sidebarOpen = ref(false)
|
|
|
|
const pageTitle = computed(() => {
|
|
const routeToTitle: Record<string, string> = {
|
|
dashboard: 'Dashboard',
|
|
calendar: 'Calendar',
|
|
projects: 'Projects',
|
|
'project-detail': 'Project Details',
|
|
live: 'Live Feed',
|
|
reports: 'AI Reports',
|
|
keys: 'API Keys',
|
|
devops: 'Azure DevOps',
|
|
settings: 'Settings',
|
|
admin: 'Admin',
|
|
}
|
|
return routeToTitle[route.name as string] ?? 'CC Dashboard'
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="h-screen flex overflow-hidden" style="background: linear-gradient(135deg, #f0f4fa 0%, #f8f9fd 50%, #fef9f5 100%)">
|
|
<!-- Mobile backdrop -->
|
|
<Transition
|
|
enter-active-class="transition-opacity duration-200"
|
|
enter-from-class="opacity-0"
|
|
enter-to-class="opacity-100"
|
|
leave-active-class="transition-opacity duration-200"
|
|
leave-from-class="opacity-100"
|
|
leave-to-class="opacity-0"
|
|
>
|
|
<div
|
|
v-if="sidebarOpen"
|
|
class="fixed inset-0 z-20 bg-black/60 lg:hidden"
|
|
@click="sidebarOpen = false"
|
|
/>
|
|
</Transition>
|
|
|
|
<!-- Sidebar - always visible on desktop, slide-in on mobile -->
|
|
<div
|
|
:class="[
|
|
'fixed inset-y-0 left-0 z-30 w-60 transform transition-transform duration-300 lg:relative lg:translate-x-0',
|
|
sidebarOpen ? 'translate-x-0' : '-translate-x-full',
|
|
]"
|
|
>
|
|
<Sidebar @close="sidebarOpen = false" />
|
|
</div>
|
|
|
|
<!-- Main content -->
|
|
<div class="flex-1 flex flex-col overflow-hidden min-w-0">
|
|
<TopBar
|
|
:title="pageTitle"
|
|
:sidebar-open="sidebarOpen"
|
|
@toggle-sidebar="sidebarOpen = !sidebarOpen"
|
|
/>
|
|
<main class="flex-1 overflow-y-auto">
|
|
<RouterView />
|
|
</main>
|
|
</div>
|
|
</div>
|
|
</template>
|