renderer: implements of default layout structure
This commit is contained in:
1 parent
422719d295
commit
378795f265
9 files changed
+69
-15
No files matched your search
@@ -1,5 +1,11 @@
|
||||
<script setup>
|
||||
import { DefaultLayout } from './components/layout'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<router-view />
|
||||
<DefaultLayout>
|
||||
<router-view />
|
||||
</DefaultLayout>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
|
||||
@@ -0,0 +1,14 @@
|
||||
<script setup>
|
||||
import HeaderLayout from './HeaderLayout'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<v-app>
|
||||
<v-layout>
|
||||
<HeaderLayout />
|
||||
<v-main>
|
||||
<slot />
|
||||
</v-main>
|
||||
</v-layout>
|
||||
</v-app>
|
||||
</template>
|
||||
@@ -0,0 +1,8 @@
|
||||
<template>
|
||||
<v-app-bar
|
||||
color="primary"
|
||||
density="compact"
|
||||
>
|
||||
<v-app-bar-title>{{ $route.meta.title }}</v-app-bar-title>
|
||||
</v-app-bar>
|
||||
</template>
|
||||
@@ -0,0 +1,7 @@
|
||||
import DefaultLayout from './DefaultLayout.vue'
|
||||
import HeaderLayout from './HeaderLayout.vue'
|
||||
|
||||
export {
|
||||
DefaultLayout,
|
||||
HeaderLayout
|
||||
}
|
||||
@@ -1,14 +1,22 @@
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
import { useTempStore } from '../../store/temp'
|
||||
|
||||
const test = ref(1)
|
||||
const temp = useTempStore()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
Main Screen {{ test }}
|
||||
{{ temp.text }}
|
||||
</div>
|
||||
<v-container>
|
||||
<v-row
|
||||
align="center"
|
||||
class="text-center"
|
||||
>
|
||||
<v-col cols="12">
|
||||
<v-img
|
||||
class="ma-auto"
|
||||
src="/static/vutron-logo.png"
|
||||
width="600"
|
||||
/>
|
||||
</v-col>
|
||||
<v-col cols="12">
|
||||
{{ $t('desc.welcome') }}
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
</template>
|
||||
@@ -6,11 +6,17 @@ export default createRouter({
|
||||
routes: [
|
||||
{
|
||||
path: '/',
|
||||
component: MainScreen
|
||||
component: MainScreen,
|
||||
meta: {
|
||||
title: 'Main'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/error',
|
||||
component: ErrorScreen
|
||||
component: ErrorScreen,
|
||||
meta: {
|
||||
title: 'Unknown error occurred'
|
||||
}
|
||||
},
|
||||
{
|
||||
path: '/:pathMatch(.*)*',
|
||||
|
||||
Reference in new issue
Block a user