7e6a087049
Add comprehensive documentation for AI assistants: - .cursorrules with project context and conventions - ARCHITECTURE.md with technical details - DEVELOPMENT.md with practical guides - JSDoc comments in all JavaScript modules - Update README.md with AI-Friendly Development section This enables AI tools (Cursor, Claude Code, GitHub Copilot) to understand the project and generate code following CoreUI Vue patterns.
57 lines
1.3 KiB
Vue
57 lines
1.3 KiB
Vue
<script setup>
|
|
/**
|
|
* App.vue - Main Application Component
|
|
*
|
|
* This is the root component of the CoreUI Free Vue Admin Template.
|
|
* It handles theme initialization and provides the router-view for all routes.
|
|
*
|
|
* Key responsibilities:
|
|
* - Theme detection from URL parameters
|
|
* - Theme persistence with localStorage
|
|
* - Router view rendering for SPA navigation
|
|
*
|
|
* @component
|
|
*/
|
|
import { onBeforeMount } from 'vue'
|
|
import { useColorModes } from '@coreui/vue'
|
|
|
|
import { useThemeStore } from '@/stores/theme.js'
|
|
|
|
// Initialize CoreUI color modes with local storage key
|
|
const { isColorModeSet, setColorMode } = useColorModes(
|
|
'coreui-free-vue-admin-template-theme',
|
|
)
|
|
const currentTheme = useThemeStore()
|
|
|
|
onBeforeMount(() => {
|
|
const urlParams = new URLSearchParams(window.location.href.split('?')[1])
|
|
let theme = urlParams.get('theme')
|
|
|
|
if (theme !== null && theme.match(/^[A-Za-z0-9\s]+/)) {
|
|
theme = theme.match(/^[A-Za-z0-9\s]+/)[0]
|
|
}
|
|
|
|
if (theme) {
|
|
setColorMode(theme)
|
|
return
|
|
}
|
|
|
|
if (isColorModeSet()) {
|
|
return
|
|
}
|
|
|
|
setColorMode(currentTheme.theme)
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<router-view />
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
// Import Main styles for this application
|
|
@use 'styles/style';
|
|
// We use those styles to show code examples, you should remove them in your application.
|
|
@use 'styles/examples';
|
|
</style>
|