From cfc46dddd378ba24ae25e05fd11f2b08ef6ca131 Mon Sep 17 00:00:00 2001 From: Ferdinand Thiessen Date: Tue, 10 Nov 2020 01:33:55 +0100 Subject: [PATCH] Added Dashboard as start page * Plugins can register widgets on the dashboard * Added dummy widget for schedule and user ("greeting") * Added simple widget for balance --- package-lock.json | 10 ++++++ package.json | 2 ++ src/boot/login.ts | 2 +- src/boot/plugins.ts | 12 ++++--- src/layouts/MainLayout.vue | 17 ++++++---- src/pages/Dashboard.vue | 36 ++++++++++++++++++++ src/pages/Login.vue | 2 +- src/plugins.d.ts | 9 +++++ src/plugins/balance/components/Widget.vue | 34 +++++++++++++++++++ src/plugins/balance/plugin.ts | 6 +++- src/plugins/schedule/components/Widget.vue | 26 +++++++++++++++ src/plugins/schedule/plugin.ts | 13 ++++++++ src/plugins/user/components/Widget.vue | 38 ++++++++++++++++++++++ src/plugins/user/pages/User.vue | 37 --------------------- src/plugins/user/plugin.ts | 6 +++- src/plugins/user/routes/index.ts | 11 +------ src/router/routes.ts | 8 ++++- 17 files changed, 207 insertions(+), 62 deletions(-) create mode 100644 src/pages/Dashboard.vue create mode 100644 src/plugins/balance/components/Widget.vue create mode 100644 src/plugins/schedule/components/Widget.vue create mode 100644 src/plugins/schedule/plugin.ts create mode 100644 src/plugins/user/components/Widget.vue delete mode 100644 src/plugins/user/pages/User.vue diff --git a/package-lock.json b/package-lock.json index b477686..7940094 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1829,6 +1829,11 @@ "integrity": "sha1-6nrd907Ow9dimCegw54smt3HPQQ=", "dev": true }, + "@types/crypto-js": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/@types/crypto-js/-/crypto-js-4.0.1.tgz", + "integrity": "sha512-6+OPzqhKX/cx5xh+yO8Cqg3u3alrkhoxhE5ZOdSEv0DOzJ13lwJ6laqGU0Kv6+XDMFmlnGId04LtY22PsFLQUw==" + }, "@types/electron-packager": { "version": "14.0.0", "resolved": "https://registry.npmjs.org/@types/electron-packager/-/electron-packager-14.0.0.tgz", @@ -4402,6 +4407,11 @@ "randomfill": "^1.0.3" } }, + "crypto-js": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-4.0.0.tgz", + "integrity": "sha512-bzHZN8Pn+gS7DQA6n+iUmBfl0hO5DJq++QP3U6uTucDtk/0iGpXd/Gg7CGR0p8tJhofJyaKoWBuJI4eAO00BBg==" + }, "css": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/css/-/css-2.2.4.tgz", diff --git a/package.json b/package.json index caa7fca..4cd72cb 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,11 @@ }, "dependencies": { "@quasar/extras": "^1.9.10", + "@types/crypto-js": "^4.0.1", "@vue/composition-api": "^0.6.4", "axios": "^0.18.1", "core-js": "^3.7.0", + "crypto-js": "^4.0.0", "quasar": "^1.14.3", "vue-router": "3.3.2" }, diff --git a/src/boot/login.ts b/src/boot/login.ts index 38757d1..7b306a0 100644 --- a/src/boot/login.ts +++ b/src/boot/login.ts @@ -37,7 +37,7 @@ export default boot>(({ router, store }) => { } else { if (store.state.user.currentUser && !to.params['logout']) { // Called login while already logged in - void next({ name: 'user-main' }); + void next({ name: 'dashboard' }); } else { // Not logged in or from logout next(); diff --git a/src/boot/plugins.ts b/src/boot/plugins.ts index 7bcd890..1c6b647 100644 --- a/src/boot/plugins.ts +++ b/src/boot/plugins.ts @@ -9,7 +9,7 @@ const config = { // Do not change required Modules !! requiredModules: ['User'], // here you can import plugins. - loadModules: ['Balance'] + loadModules: ['Balance', 'Schedule'] }; // do not change anything here !! @@ -164,6 +164,9 @@ function loadPlugin( plugin.outRoutes ); } + if (plugin.widget) { + loadedPlugins.widgets.push(plugin.widget); + } if (plugin.store) { console.log(plugin.store); console.log(plugin.store.keys()); @@ -176,7 +179,7 @@ function loadPlugin( version: plugin.version }); } else { - console.exception(`Don't find required Plugin ${requiredModule}`); + console.exception(`Could not find required Plugin ${requiredModule}`); } }); return loadedPlugins; @@ -191,7 +194,8 @@ export default boot>(({ Vue, router, store }) => { plugins: [], mainLinks: [], shortcuts: [], - shortcutsOut: [] + shortcutsOut: [], + widgets: [] }; // get all plugins @@ -210,7 +214,7 @@ export default boot>(({ Vue, router, store }) => { ); loadedPlugins = loadPlugin(loadedPlugins, config.loadModules, plugins, store); - console.log(loadedPlugins.routes); + loadedPlugins.widgets.sort((a, b) => b.priority - a.priority); // add new routes for plugins router.addRoutes(loadedPlugins.routes); diff --git a/src/layouts/MainLayout.vue b/src/layouts/MainLayout.vue index 0f0e5b0..7701add 100644 --- a/src/layouts/MainLayout.vue +++ b/src/layouts/MainLayout.vue @@ -13,12 +13,17 @@ /> - - - - - Flaschengeist - + + + + + + Flaschengeist + + diff --git a/src/pages/Dashboard.vue b/src/pages/Dashboard.vue new file mode 100644 index 0000000..1bc4489 --- /dev/null +++ b/src/pages/Dashboard.vue @@ -0,0 +1,36 @@ + + + diff --git a/src/pages/Login.vue b/src/pages/Login.vue index c6e7566..323cdad 100644 --- a/src/pages/Login.vue +++ b/src/pages/Login.vue @@ -40,7 +40,7 @@ import { Loading } from 'quasar'; export default defineComponent({ // name: 'PageName' setup(_, { root }) { - const mainRoute = { name: 'user-main' }; + const mainRoute = { name: 'dashboard' }; /* Stuff for the real login page */ const userid = ref(''); diff --git a/src/plugins.d.ts b/src/plugins.d.ts index 3f92f4a..33f3079 100644 --- a/src/plugins.d.ts +++ b/src/plugins.d.ts @@ -1,6 +1,8 @@ import { RouteConfig } from 'vue-router'; import { Module } from 'vuex'; import { StateInterface } from 'src/store'; +import { AsyncComponentPromise } from 'vue/types/options'; + declare namespace FG_Plugin { interface ShortCutLink { link: string; @@ -21,6 +23,7 @@ declare namespace FG_Plugin { mainRoutes?: PluginRouteConfig[]; outRoutes?: PluginRouteConfig[]; store?: Map>; + widget?: Widget; requiredModules: string[]; version: string; } @@ -42,11 +45,17 @@ declare namespace FG_Plugin { version: string; } + interface Widget { + widget: AsyncComponentPromise; + priority: number; + } + interface LoadedPlugins { plugins: LoadedPlugin[]; routes: RouteConfig[]; mainLinks: PluginMainLink[]; shortcuts: ShortCutLink[]; shortcutsOut: ShortCutLink[]; + widgets: Widget[]; } } diff --git a/src/plugins/balance/components/Widget.vue b/src/plugins/balance/components/Widget.vue new file mode 100644 index 0000000..1485bc9 --- /dev/null +++ b/src/plugins/balance/components/Widget.vue @@ -0,0 +1,34 @@ + + + diff --git a/src/plugins/balance/plugin.ts b/src/plugins/balance/plugin.ts index 7a7a9d1..b90d338 100644 --- a/src/plugins/balance/plugin.ts +++ b/src/plugins/balance/plugin.ts @@ -11,7 +11,11 @@ const plugin: FG_Plugin.Plugin = { version: '0.0.1', store: new Map>([ ['balance', balance] - ]) + ]), + widget: { + widget: () => import('./components/Widget.vue'), + priority: 0 + } }; export default plugin; diff --git a/src/plugins/schedule/components/Widget.vue b/src/plugins/schedule/components/Widget.vue new file mode 100644 index 0000000..5f75ff5 --- /dev/null +++ b/src/plugins/schedule/components/Widget.vue @@ -0,0 +1,26 @@ + + + diff --git a/src/plugins/schedule/plugin.ts b/src/plugins/schedule/plugin.ts new file mode 100644 index 0000000..786a74e --- /dev/null +++ b/src/plugins/schedule/plugin.ts @@ -0,0 +1,13 @@ +import { FG_Plugin } from 'src/plugins'; + +const plugin: FG_Plugin.Plugin = { + name: 'Schedule', + requiredModules: [], + version: '0.0.1', + widget: { + widget: () => import('./components/Widget.vue'), + priority: 0 + } +}; + +export default plugin; diff --git a/src/plugins/user/components/Widget.vue b/src/plugins/user/components/Widget.vue new file mode 100644 index 0000000..4209dc0 --- /dev/null +++ b/src/plugins/user/components/Widget.vue @@ -0,0 +1,38 @@ + + + diff --git a/src/plugins/user/pages/User.vue b/src/plugins/user/pages/User.vue deleted file mode 100644 index fe57f56..0000000 --- a/src/plugins/user/pages/User.vue +++ /dev/null @@ -1,37 +0,0 @@ - - - diff --git a/src/plugins/user/plugin.ts b/src/plugins/user/plugin.ts index 7bf40e3..9d03f5f 100644 --- a/src/plugins/user/plugin.ts +++ b/src/plugins/user/plugin.ts @@ -13,7 +13,11 @@ const plugin: FG_Plugin.Plugin = { store: new Map>([ ['user', userStore], ['session', sessionsStore] - ]) + ]), + widget: { + priority: 1, + widget: () => import('./components/Widget.vue') + } }; export default plugin; diff --git a/src/plugins/user/routes/index.ts b/src/plugins/user/routes/index.ts index bd64eac..0c6d3d3 100644 --- a/src/plugins/user/routes/index.ts +++ b/src/plugins/user/routes/index.ts @@ -8,18 +8,9 @@ const mainRoutes: FG_Plugin.PluginRouteConfig[] = [ component: () => import('../pages/MainPage.vue'), meta: { permissions: ['user'] }, children: [ - { - title: 'Hauptkanal', - icon: 'mdi-account-hard-hat', - path: 'user-main', - name: 'user-main', - shortcut: false, - meta: { permissions: ['user'] }, - component: () => import('../pages/User.vue') - }, { title: 'Einstellungen', - icon: 'mdi-cog', + icon: 'mdi-account-edit', path: 'settings', name: 'user-settings', shortcut: true, diff --git a/src/router/routes.ts b/src/router/routes.ts index 666df2f..47f9882 100644 --- a/src/router/routes.ts +++ b/src/router/routes.ts @@ -20,9 +20,15 @@ const routes: RouteConfig[] = [ }, { path: '/main', - redirect: 'user', + redirect: 'dashboard', component: () => import('layouts/MainLayout.vue'), children: [ + { + name: 'dashboard', + path: 'dashboard', + meta: { permission: 'user' }, + component: () => import('pages/Dashboard.vue') + }, { name: 'about', path: 'about',