Fixed Error und Warnings

This commit is contained in:
Tim Gröger 2020-10-13 11:27:27 +02:00
parent 6d56d5847f
commit dddafef3a1
17 changed files with 172 additions and 119 deletions

30
package-lock.json generated
View File

@ -1376,6 +1376,12 @@
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
"integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==", "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
"dev": true "dev": true
},
"typescript": {
"version": "3.9.5",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.5.tgz",
"integrity": "sha512-hSAifV3k+i6lEoCJ2k6R2Z/rp/H3+8sdmcn5NrS3/3kE7+RyZXm9aqvxWqjEXHAd8b0pShatpcdMTvEdvAJltQ==",
"dev": true
} }
} }
}, },
@ -8645,15 +8651,6 @@
"lower-case": "1.1.4" "lower-case": "1.1.4"
} }
}, },
"node-dir": {
"version": "0.1.17",
"resolved": "https://registry.npmjs.org/node-dir/-/node-dir-0.1.17.tgz",
"integrity": "sha1-X1Zl2TNRM1yqvvjxxVRRbPXx5OU=",
"dev": true,
"requires": {
"minimatch": "3.0.4"
}
},
"node-forge": { "node-forge": {
"version": "0.10.0", "version": "0.10.0",
"resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz", "resolved": "https://registry.npmjs.org/node-forge/-/node-forge-0.10.0.tgz",
@ -10912,15 +10909,6 @@
} }
} }
}, },
"require-context": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/require-context/-/require-context-1.1.0.tgz",
"integrity": "sha512-nfYSy3Q9W3W1fCo0nief19bDq216IGY9+wOUsmCWAJ5jssyak0r110rvqIj4KJYoUYDxLDaeA66ONOYy4PJEUw==",
"dev": true,
"requires": {
"node-dir": "0.1.17"
}
},
"require-directory": { "require-directory": {
"version": "2.1.1", "version": "2.1.1",
"resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@ -12947,9 +12935,9 @@
"dev": true "dev": true
}, },
"typescript": { "typescript": {
"version": "3.9.5", "version": "4.0.3",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.9.5.tgz", "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.0.3.tgz",
"integrity": "sha512-hSAifV3k+i6lEoCJ2k6R2Z/rp/H3+8sdmcn5NrS3/3kE7+RyZXm9aqvxWqjEXHAd8b0pShatpcdMTvEdvAJltQ==", "integrity": "sha512-tEu6DGxGgRJPb/mVPIZ48e69xCn2yRmCgYmDugAVwmJ6o+0u1RI18eO7E7WBTLYLaEVVOhwQmcdhQHweux/WPg==",
"dev": true "dev": true
}, },
"uglify-js": { "uglify-js": {

View File

@ -28,7 +28,7 @@
"eslint-config-prettier": "^6.9.0", "eslint-config-prettier": "^6.9.0",
"eslint-loader": "^3.0.3", "eslint-loader": "^3.0.3",
"eslint-plugin-vue": "^6.1.2", "eslint-plugin-vue": "^6.1.2",
"require-context": "^1.1.0" "typescript": "^4.0.3"
}, },
"browserslist": [ "browserslist": [
"last 10 Chrome versions", "last 10 Chrome versions",

View File

@ -8,7 +8,6 @@
/* eslint-env node */ /* eslint-env node */
/* eslint-disable @typescript-eslint/no-var-requires */ /* eslint-disable @typescript-eslint/no-var-requires */
const { configure } = require('quasar/wrappers'); const { configure } = require('quasar/wrappers');
const { path } = require('path');
module.exports = configure(function(ctx) { module.exports = configure(function(ctx) {
return { return {
@ -75,11 +74,6 @@ module.exports = configure(function(ctx) {
exclude: /node_modules/ exclude: /node_modules/
}); });
} }
cfg.resolve.alias = {
...cfg.resolve.alias
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
//flaschngeist_plugin: path.resolve(__dirname, './src/plugins')
};
} }
}, },

View File

@ -1,6 +1,7 @@
import VueCompositionApi from '@vue/composition-api'; import VueCompositionApi from '@vue/composition-api';
import { VueConstructor } from 'vue';
import { boot } from 'quasar/wrappers'; import { boot } from 'quasar/wrappers';
export default boot(({ Vue }) => { export default boot(({ Vue }: { Vue: VueConstructor }) => {
Vue.use(VueCompositionApi); Vue.use(VueCompositionApi);
}); });

View File

@ -1,7 +1,6 @@
import { boot } from 'quasar/wrappers'; import { boot } from 'quasar/wrappers';
import { RouteConfig } from 'vue-router'; import { RouteConfig } from 'vue-router';
import { Module } from 'vuex'; import { Module } from 'vuex';
import {} from 'webpack';
interface PluginRouteConfig extends RouteConfig { interface PluginRouteConfig extends RouteConfig {
example?: unknown; example?: unknown;
@ -15,30 +14,35 @@ interface EssentialLink {
interface Plugin { interface Plugin {
router: PluginRouteConfig[]; router: PluginRouteConfig[];
store?: Module<any, any>; store?: Module<never, never>;
mainLink: EssentialLink; mainLink: PluginMainLink;
} }
export { PluginRouteConfig, Plugin }; interface PluginMainLink extends PluginChildLink {
children: PluginChildLink[] | [];
}
interface PluginChildLink {
name: string;
title: string;
link: string;
icon: string;
}
export { PluginRouteConfig, Plugin, PluginChildLink, PluginMainLink };
// "async" is optional; // "async" is optional;
// more info on params: https://quasar.dev/quasar-cli/cli-documentation/boot-files#Anatomy-of-a-boot-file // more info on params: https://quasar.dev/quasar-cli/cli-documentation/boot-files#Anatomy-of-a-boot-file
// eslint-disable-next-line @typescript-eslint/ban-ts-comment export default boot(({ Vue, router }) => {
// @ts-ignore const plugins = require.context('src/plugins', true, /.+\/plugin.ts$/);
export default boot(({ Vue, router, store }) => { const pluginMainLinks: PluginMainLink[] = [];
// eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-unsafe-member-access plugins.keys().forEach((fileName: string) => {
const plugins: any = require.context('src/plugins', true, /.+\/plugin.ts$/); // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
// eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
let mop = [];
// eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
plugins.keys().forEach((fileName: any) => {
// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access,@typescript-eslint/no-unsafe-call
// eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
router.addRoutes(plugins(fileName).default.router); router.addRoutes(plugins(fileName).default.router);
// eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
mop.push(plugins(fileName).default.mainLink); pluginMainLinks.push(plugins(fileName).default.mainLink);
}); });
Vue.prototype.$flaschengeist_plugins = mop; // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
Vue.prototype.$flaschengeist_plugins = pluginMainLinks;
console.log(plugins); console.log(plugins);
}); });

View File

@ -1,28 +0,0 @@
<template>
<div>
<essential-link
v-for="(link, index) in links"
:key="index"
:title="link.title"
:link="link.link"
:icon="link.icon"
/>
</div>
</template>
<script lang="ts">
const links = [
{ title: 'Neues About', link: 'newAbout', icon: 'mdi-information-outline' },
{ title: 'Altes About', link: 'oldAbout', icon: 'mdi-information-variant' }
];
import { defineComponent } from '@vue/composition-api';
import EssentialLink from 'components/navigation/EssentialLink.vue';
export default defineComponent({
// name: 'ComponentName'
components: { EssentialLink },
setup() {
return { links };
}
});
</script>

View File

@ -48,14 +48,14 @@
<q-list> <q-list>
<essential-link <essential-link
v-for="(link, index) in links" v-for="(link, index) in links"
:key="index" :key="'main' + index"
:title="link.title" :title="link.title"
:link="link.link" :link="link.link"
:icon="link.icon" :icon="link.icon"
/> />
<essential-link <essential-link
v-for="(link, index) in $flaschengeist_plugins" v-for="(link, index) in $flaschengeist_plugins"
:key="index" :key="'plugin' + index"
:title="link.title" :title="link.title"
:link="link.link" :link="link.link"
:icon="link.icon" :icon="link.icon"
@ -64,7 +64,18 @@
<q-separator /> <q-separator />
<!-- Plugin functions --> <!-- Plugin functions -->
<router-view name="plugin-nav" /> <!-- <router-view name="plugin-nav" /> -->
<q-list>
<essential-link
v-for="(link, index) in pluginChildLinks"
:key="'childPlugin' + index"
:title="link.title"
:link="link.link"
:icon="link.icon"
/>
</q-list>
<q-btn @click="showRoute" label="test"></q-btn>
<div class="q-mini-drawer-hide absolute" style="top: 15px; right: -11px"> <div class="q-mini-drawer-hide absolute" style="top: 15px; right: -11px">
<q-btn <q-btn
@ -87,18 +98,50 @@
<script lang="ts"> <script lang="ts">
import EssentialLink from 'components/navigation/EssentialLink.vue'; import EssentialLink from 'components/navigation/EssentialLink.vue';
import { event, Screen } from 'quasar'; import { Screen } from 'quasar';
import { defineComponent, ref, reactive, computed } from '@vue/composition-api'; import { PluginMainLink } from 'boot/plugins';
import { defineComponent, ref, computed } from '@vue/composition-api';
const links = [ const links = [
{ title: 'home', icon: 'mdi-home' }, {
{ title: 'about', link: 'about', icon: 'mdi-information' } name: 'home',
title: 'home',
icon: 'mdi-home',
children: [
{ title: 'Neues Home', link: 'newHome', icon: 'mdi-google-home' },
{ title: 'Altes Home', link: 'oldHome', icon: 'mdi-home-modern' }
]
},
{
name: 'about',
title: 'about',
link: 'about',
icon: 'mdi-information',
children: [
{
title: 'Neues About',
link: 'newAbout',
icon: 'mdi-information-outline'
},
{
title: 'Altes About',
link: 'oldAbout',
icon: 'mdi-information-variant'
}
]
}
]; ];
declare module 'vue/types/vue' {
interface Vue {
$flaschengeist_plugins: PluginMainLink[];
}
}
export default defineComponent({ export default defineComponent({
name: 'MainLayout', name: 'MainLayout',
components: { EssentialLink }, components: { EssentialLink },
setup() { setup(_, ctx) {
const leftDrawer = ref(false); const leftDrawer = ref(false);
const leftDrawerOpen = ref( const leftDrawerOpen = ref(
@ -114,7 +157,36 @@ export default defineComponent({
} }
} }
return { leftDrawerOpen, leftDrawerMini, leftDrawerClicker, links }; const pluginChildLinks = computed(() => {
const test:
| PluginMainLink
| undefined = ctx.root.$flaschengeist_plugins.find(
(plugin: PluginMainLink) => {
return plugin.name == ctx.root.$route.matched[1].name;
}
);
console.log(test);
if (typeof test == undefined) {
return [];
} else {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
//@ts-ignore
return test.children;
}
});
function showRoute() {
console.log(ctx.root.$route);
}
return {
leftDrawerOpen,
leftDrawerMini,
leftDrawerClicker,
links,
pluginChildLinks,
showRoute
};
} }
}); });
</script> </script>

View File

@ -1,12 +1,13 @@
<template> <template>
<q-layout view="hHh lpr lFf"> <!-- Be sure to play with the Layout demo on docs --> <q-layout view="hHh lpr lFf">
<!-- Be sure to play with the Layout demo on docs -->
<!-- (Optional) The Header --> <!-- (Optional) The Header -->
<q-header elevated> <q-header elevated>
<q-toolbar> <q-toolbar>
<q-toolbar-title> <q-toolbar-title>
<q-avatar> <q-avatar>
<img src="logo.svg"> <img src="logo.svg" />
</q-avatar> </q-avatar>
<span class="gt-xs"> <span class="gt-xs">
Flaschengeist Flaschengeist
@ -17,25 +18,18 @@
<!-- (Optional) The Footer --> <!-- (Optional) The Footer -->
<!-- (Optional) A Drawer; you can add one more with side="right" or change this one's side --> <!-- (Optional) A Drawer; you can add one more with side="right" or change this one's side -->
<q-page-container> <q-page-container>
<!-- This is where pages get injected --> <!-- This is where pages get injected -->
<router-view /> <router-view />
</q-page-container> </q-page-container>
</q-layout> </q-layout>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, ref } from '@vue/composition-api' import { defineComponent } from '@vue/composition-api';
export default defineComponent({ export default defineComponent({
name: 'OutLayout', name: 'OutLayout'
});
setup() {
return { }
}
})
</script> </script>

View File

@ -38,7 +38,7 @@ import { defineComponent, ref } from '@vue/composition-api';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'
setup() { setup(_, ctx) {
const username = ref(''); const username = ref('');
const password = ref(''); const password = ref('');
const rules = [ const rules = [
@ -47,7 +47,7 @@ export default defineComponent({
function doLogin() { function doLogin() {
console.log(username.value, password.value); console.log(username.value, password.value);
this.$router.push({ name: 'home' }); void ctx.root.$router.push({ name: 'home' });
} }
return { username, password, doLogin, rules }; return { username, password, doLogin, rules };

View File

@ -13,7 +13,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref } from '@vue/composition-api'; import { defineComponent } from '@vue/composition-api';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'
setup(_, ctx) { setup(_, ctx) {

View File

@ -10,7 +10,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref } from '@vue/composition-api'; import { defineComponent } from '@vue/composition-api';
import { mainLink } from '../plugin'; import { mainLink } from '../plugin';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'

View File

@ -1,10 +1,28 @@
import { PluginRouteConfig, Plugin } from 'boot/plugins'; import { Plugin } from 'boot/plugins';
import { RouteConfig } from 'vue-router';
import routes from 'src/plugins/plugin-example-2/routes'; import routes from 'src/plugins/plugin-example-2/routes';
const plugin: Plugin = { const plugin: Plugin = {
router: routes, router: routes,
mainLink: { title: 'Plugin2', link: 'plugin2', icon: 'mdi-toy-brick-plus' } mainLink: {
name: 'plugin2',
title: 'Plugin2',
link: 'plugin2',
icon: 'mdi-toy-brick-plus',
children: [
{
name: 'plugin2',
title: 'Neues Plugin2',
link: 'plugin2_1',
icon: 'mdi-information-outline'
},
{
name: 'plugin2',
title: 'Altes Plugin2',
link: 'plugin2_2',
icon: 'mdi-information-variant'
}
]
}
}; };
const mainLink = plugin.mainLink; const mainLink = plugin.mainLink;

View File

@ -10,7 +10,7 @@
</template> </template>
<script lang="ts"> <script lang="ts">
import { computed, defineComponent, ref } from '@vue/composition-api'; import { defineComponent } from '@vue/composition-api';
import { mainLink } from '../plugin'; import { mainLink } from '../plugin';
export default defineComponent({ export default defineComponent({
// name: 'PageName' // name: 'PageName'

View File

@ -1,10 +1,28 @@
import { PluginRouteConfig, Plugin } from 'boot/plugins'; import { Plugin } from 'boot/plugins';
import { RouteConfig } from 'vue-router';
import routes from 'src/plugins/plugin-example/routes'; import routes from 'src/plugins/plugin-example/routes';
const plugin: Plugin = { const plugin: Plugin = {
router: routes, router: routes,
mainLink: { title: 'Plugin1', link: 'plugin1', icon: 'mdi-toy-brick' } mainLink: {
name: 'plugin1',
title: 'Plugin1',
link: 'plugin1',
icon: 'mdi-toy-brick',
children: [
{
name: 'plugin1',
title: 'Neues Plugin1',
link: 'plugin1_1',
icon: 'mdi-information-outline'
},
{
name: 'plugin1',
title: 'Altes Plugin1',
link: 'plugin1_2',
icon: 'mdi-information-variant'
}
]
}
}; };
const mainLink = plugin.mainLink; const mainLink = plugin.mainLink;

View File

@ -20,11 +20,7 @@ const routes: RouteConfig[] = [
{ {
name: 'home', name: 'home',
path: 'home', path: 'home',
components: { component: () => import('pages/home/Home.vue'),
default: () => import('pages/home/Home.vue'),
'plugin-nav': () =>
import('components/navigation/PluginLinksHome.vue')
},
children: [ children: [
{ {
name: 'newHome', name: 'newHome',
@ -41,11 +37,7 @@ const routes: RouteConfig[] = [
{ {
name: 'about', name: 'about',
path: 'about', path: 'about',
components: { component: () => import('pages/about/About.vue'),
default: () => import('pages/about/About.vue'),
'plugin-nav': () =>
import('components/navigation/PluginLinksAbout.vue')
},
children: [ children: [
{ {
name: 'newAbout', name: 'newAbout',

View File

@ -1,7 +1,7 @@
{ {
"extends": "@quasar/app/tsconfig-preset", "extends": "@quasar/app/tsconfig-preset",
"compilerOptions": { "compilerOptions": {
"types": ["node", "webpack-env"], "types": ["node", "webpack-env", "@quasar/app"],
"baseUrl": "." "baseUrl": "."
} }
} }