路由配置

This commit is contained in:
fofolee 2022-03-30 20:59:52 +08:00
parent 1c7c3c95b8
commit c631130edd
9 changed files with 46 additions and 225 deletions

View File

@ -8,14 +8,19 @@ import { defineComponent } from "vue";
export default defineComponent({
name: "App",
data() {
return {
};
return {};
},
computed: {},
created: function () {
// this.$router.push("/configuration");
this.$router.push("/code");
this.pluginEnterEvent();
},
methods: {
pluginEnterEvent() {
utools.onPluginEnter((enter) => {
localStorage["enterData"] = JSON.stringify(enter);
this.$router.push(enter.code);
});
},
},
methods: {},
});
</script>

View File

@ -1,49 +0,0 @@
<template>
<q-item
clickable
tag="a"
target="_blank"
:href="link"
>
<q-item-section
v-if="icon"
avatar
>
<q-icon :name="icon" />
</q-item-section>
<q-item-section>
<q-item-label>{{ title }}</q-item-label>
<q-item-label caption>{{ caption }}</q-item-label>
</q-item-section>
</q-item>
</template>
<script>
import { defineComponent } from 'vue'
export default defineComponent({
name: 'EssentialLink',
props: {
title: {
type: String,
required: true
},
caption: {
type: String,
default: ''
},
link: {
type: String,
default: '#'
},
icon: {
type: String,
default: ''
}
}
})
</script>

View File

@ -1,116 +0,0 @@
<template>
<q-layout view="lHh Lpr lFf">
<q-header elevated>
<q-toolbar>
<q-btn
flat
dense
round
icon="menu"
aria-label="Menu"
@click="toggleLeftDrawer"
/>
<q-toolbar-title>
Quasar App
</q-toolbar-title>
<div>Quasar v{{ $q.version }}</div>
</q-toolbar>
</q-header>
<q-drawer
v-model="leftDrawerOpen"
show-if-above
bordered
>
<q-list>
<q-item-label
header
>
Essential Links
</q-item-label>
<EssentialLink
v-for="link in essentialLinks"
:key="link.title"
v-bind="link"
/>
</q-list>
</q-drawer>
<q-page-container>
<router-view />
</q-page-container>
</q-layout>
</template>
<script>
import { defineComponent, ref } from 'vue'
import EssentialLink from 'components/EssentialLink.vue'
const linksList = [
{
title: 'Docs',
caption: 'quasar.dev',
icon: 'school',
link: 'https://quasar.dev'
},
{
title: 'Github',
caption: 'github.com/quasarframework',
icon: 'code',
link: 'https://github.com/quasarframework'
},
{
title: 'Discord Chat Channel',
caption: 'chat.quasar.dev',
icon: 'chat',
link: 'https://chat.quasar.dev'
},
{
title: 'Forum',
caption: 'forum.quasar.dev',
icon: 'record_voice_over',
link: 'https://forum.quasar.dev'
},
{
title: 'Twitter',
caption: '@quasarframework',
icon: 'rss_feed',
link: 'https://twitter.quasar.dev'
},
{
title: 'Facebook',
caption: '@QuasarFramework',
icon: 'public',
link: 'https://facebook.quasar.dev'
},
{
title: 'Quasar Awesome',
caption: 'Community Quasar projects',
icon: 'favorite',
link: 'https://awesome.quasar.dev'
}
]
export default defineComponent({
name: 'MainLayout',
components: {
EssentialLink
},
setup () {
const leftDrawerOpen = ref(false)
return {
essentialLinks: linksList,
leftDrawerOpen,
toggleLeftDrawer () {
leftDrawerOpen.value = !leftDrawerOpen.value
}
}
}
})
</script>

View File

@ -0,0 +1,7 @@
<template>
<div>commandPage</div>
</template>
<script>
export default {};
</script>

View File

@ -1,31 +0,0 @@
<template>
<div class="fullscreen bg-blue text-white text-center q-pa-md flex flex-center">
<div>
<div style="font-size: 30vh">
404
</div>
<div class="text-h2" style="opacity:.4">
Oops. Nothing here...
</div>
<q-btn
class="q-mt-xl"
color="white"
text-color="blue"
unelevated
to="/"
label="Go Home"
no-caps
/>
</div>
</div>
</template>
<script>
import { defineComponent } from 'vue'
export default defineComponent({
name: 'ErrorNotFound'
})
</script>

View File

@ -1,17 +0,0 @@
<template>
<q-page class="flex flex-center">
<img
alt="Quasar logo"
src="~assets/quasar-logo-vertical.svg"
style="width: 200px; height: 200px"
>
</q-page>
</template>
<script>
import { defineComponent } from 'vue'
export default defineComponent({
name: 'IndexPage'
})
</script>

11
src/pages/NewCommand.vue Normal file
View File

@ -0,0 +1,11 @@
<template>
<div>newCommand</div>
</template>
<script>
export default {
mounted() {
console.log(JSON.parse(localStorage["enterData"]));
},
};
</script>

5
src/pages/QuickPanel.vue Normal file
View File

@ -0,0 +1,5 @@
<template>
<div>
quickPanel
</div>
</template>

View File

@ -1,11 +1,4 @@
const routes = [
{
path: '/',
component: () => import('layouts/MainLayout.vue'),
children: [
{ path: '', component: () => import('pages/IndexPage.vue') }
]
},
{
path: '/configuration',
component: () => import('pages/ConfigurationPage.vue')
@ -13,7 +6,20 @@ const routes = [
{
path: '/code',
component: () => import('pages/CodeRunner.vue')
},
{
path: '/newcommand',
component: () => import('pages/NewCommand.vue')
},
{
path: '/:type(default|files|key|regex|window|professional)_:uid(\\w{11})',
component: () => import('pages/CommandPage.vue')
},
{
path: '/panel_:tags(\\w+)',
component: () => import('pages/QuickPanel.vue')
}
]
export default routes