parent
7001052fe3
commit
646bdc695e
|
|
@ -1989,6 +1989,48 @@
|
||||||
"integrity": "sha512-Uvq6hVe90D0B2WEnUqtdgY1bATGz3mw33nH9Y+dmA+w5DHvUmBgkr5rM/KCHpCsiFNRUfokW/szpPPgMK2hm4A==",
|
"integrity": "sha512-Uvq6hVe90D0B2WEnUqtdgY1bATGz3mw33nH9Y+dmA+w5DHvUmBgkr5rM/KCHpCsiFNRUfokW/szpPPgMK2hm4A==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"axios": {
|
||||||
|
"version": "0.19.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/axios/-/axios-0.19.0.tgz",
|
||||||
|
"integrity": "sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"follow-redirects": "1.5.10",
|
||||||
|
"is-buffer": "^2.0.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"debug": {
|
||||||
|
"version": "3.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
|
||||||
|
"integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"ms": "2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"follow-redirects": {
|
||||||
|
"version": "1.5.10",
|
||||||
|
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.5.10.tgz",
|
||||||
|
"integrity": "sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"debug": "=3.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-buffer": {
|
||||||
|
"version": "2.0.4",
|
||||||
|
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.4.tgz",
|
||||||
|
"integrity": "sha512-Kq1rokWXOPXWuaMAqZiJW4XxsmD9zGx9q4aePabbn3qCRGedtH7Cm+zV8WETitMfu1wdh+Rvd6w5egwSngUX2A==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
|
"ms": {
|
||||||
|
"version": "2.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
|
||||||
|
"integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
|
||||||
|
"dev": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"babel-eslint": {
|
"babel-eslint": {
|
||||||
"version": "10.0.3",
|
"version": "10.0.3",
|
||||||
"resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.0.3.tgz",
|
"resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.0.3.tgz",
|
||||||
|
|
@ -2869,6 +2911,17 @@
|
||||||
"integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=",
|
"integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"clone-deep": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"is-plain-object": "^2.0.4",
|
||||||
|
"kind-of": "^6.0.2",
|
||||||
|
"shallow-clone": "^3.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"coa": {
|
"coa": {
|
||||||
"version": "2.0.2",
|
"version": "2.0.2",
|
||||||
"resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz",
|
||||||
|
|
@ -6914,6 +6967,12 @@
|
||||||
"object-visit": "^1.0.0"
|
"object-visit": "^1.0.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"material-design-icons-iconfont": {
|
||||||
|
"version": "5.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/material-design-icons-iconfont/-/material-design-icons-iconfont-5.0.1.tgz",
|
||||||
|
"integrity": "sha512-Xg6rIdGrfySTqiTZ6d+nQbcFepS6R4uKbJP0oAqyeZXJY/bX6mZDnOmmUJusqLXfhIwirs0c++a6JpqVa8RFvA==",
|
||||||
|
"dev": true
|
||||||
|
},
|
||||||
"md5.js": {
|
"md5.js": {
|
||||||
"version": "1.3.5",
|
"version": "1.3.5",
|
||||||
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
|
"resolved": "https://registry.npmjs.org/md5.js/-/md5.js-1.3.5.tgz",
|
||||||
|
|
@ -9183,6 +9242,36 @@
|
||||||
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
|
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"sass": {
|
||||||
|
"version": "1.23.7",
|
||||||
|
"resolved": "https://registry.npmjs.org/sass/-/sass-1.23.7.tgz",
|
||||||
|
"integrity": "sha512-cYgc0fanwIpi0rXisGxl+/wadVQ/HX3RhpdRcjLdj2o2ye/sxUTpAxIhbmJy3PLQgRFbf6Pn8Jsrta2vdXcoOQ==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"chokidar": ">=2.0.0 <4.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"sass-loader": {
|
||||||
|
"version": "8.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.0.tgz",
|
||||||
|
"integrity": "sha512-+qeMu563PN7rPdit2+n5uuYVR0SSVwm0JsOUsaJXzgYcClWSlmX0iHDnmeOobPkf5kUglVot3QS6SyLyaQoJ4w==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"clone-deep": "^4.0.1",
|
||||||
|
"loader-utils": "^1.2.3",
|
||||||
|
"neo-async": "^2.6.1",
|
||||||
|
"schema-utils": "^2.1.0",
|
||||||
|
"semver": "^6.3.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"semver": {
|
||||||
|
"version": "6.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz",
|
||||||
|
"integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==",
|
||||||
|
"dev": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
"sax": {
|
"sax": {
|
||||||
"version": "1.2.4",
|
"version": "1.2.4",
|
||||||
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
|
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
|
||||||
|
|
@ -9397,6 +9486,15 @@
|
||||||
"safe-buffer": "^5.0.1"
|
"safe-buffer": "^5.0.1"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"shallow-clone": {
|
||||||
|
"version": "3.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz",
|
||||||
|
"integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"kind-of": "^6.0.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
"shebang-command": {
|
"shebang-command": {
|
||||||
"version": "1.2.0",
|
"version": "1.2.0",
|
||||||
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
|
"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
|
||||||
|
|
@ -10813,6 +10911,20 @@
|
||||||
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
|
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
|
"vuetify": {
|
||||||
|
"version": "2.1.15",
|
||||||
|
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-2.1.15.tgz",
|
||||||
|
"integrity": "sha512-M35NJvlzkbCpFfsK08xraNvCpiNCIbYUXI/hkzjWHQV1MFIZnjrDTVtYoiudCyJ52zlrhWezAr4pzFOCLAr6RA=="
|
||||||
|
},
|
||||||
|
"vuetify-loader": {
|
||||||
|
"version": "1.4.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/vuetify-loader/-/vuetify-loader-1.4.3.tgz",
|
||||||
|
"integrity": "sha512-fS0wRil682Ebsj2as+eruBoMPKaQYDhu/fDAndnTItzSY4RK4LOEIsssVL4vD6QY8dvUgoGL84SUQ6vGr777CA==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"loader-utils": "^1.2.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
"vuex": {
|
"vuex": {
|
||||||
"version": "3.1.2",
|
"version": "3.1.2",
|
||||||
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.2.tgz",
|
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.2.tgz",
|
||||||
|
|
|
||||||
|
|
@ -11,6 +11,7 @@
|
||||||
"core-js": "^3.4.3",
|
"core-js": "^3.4.3",
|
||||||
"vue": "^2.6.10",
|
"vue": "^2.6.10",
|
||||||
"vue-router": "^3.1.3",
|
"vue-router": "^3.1.3",
|
||||||
|
"vuetify": "^2.1.0",
|
||||||
"vuex": "^3.1.2"
|
"vuex": "^3.1.2"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
|
@ -19,11 +20,16 @@
|
||||||
"@vue/cli-plugin-router": "^4.1.1",
|
"@vue/cli-plugin-router": "^4.1.1",
|
||||||
"@vue/cli-plugin-vuex": "^4.1.1",
|
"@vue/cli-plugin-vuex": "^4.1.1",
|
||||||
"@vue/cli-service": "^4.1.0",
|
"@vue/cli-service": "^4.1.0",
|
||||||
|
"axios": "^0.19.0",
|
||||||
"babel-eslint": "^10.0.3",
|
"babel-eslint": "^10.0.3",
|
||||||
"eslint": "^5.16.0",
|
"eslint": "^5.16.0",
|
||||||
"eslint-plugin-vue": "^5.0.0",
|
"eslint-plugin-vue": "^5.0.0",
|
||||||
|
"material-design-icons-iconfont": "^5.0.1",
|
||||||
|
"sass": "^1.19.0",
|
||||||
|
"sass-loader": "^8.0.0",
|
||||||
"vue-cli-plugin-vuetify": "^2.0.2",
|
"vue-cli-plugin-vuetify": "^2.0.2",
|
||||||
"vue-template-compiler": "^2.6.10"
|
"vue-template-compiler": "^2.6.10",
|
||||||
|
"vuetify-loader": "^1.3.0"
|
||||||
},
|
},
|
||||||
"eslintConfig": {
|
"eslintConfig": {
|
||||||
"root": true,
|
"root": true,
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,8 @@
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||||
<title>newgruecht-vue</title>
|
<title>newgruecht-vue</title>
|
||||||
|
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
|
||||||
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<noscript>
|
||||||
|
|
|
||||||
37
src/App.vue
37
src/App.vue
|
|
@ -1,32 +1,19 @@
|
||||||
<template>
|
<template>
|
||||||
<div id="app">
|
<v-app>
|
||||||
<div id="nav">
|
|
||||||
<router-link to="/">Home</router-link> |
|
|
||||||
<router-link to="/about">About</router-link>
|
|
||||||
</div>
|
|
||||||
<router-view/>
|
<router-view/>
|
||||||
</div>
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style>
|
<script>
|
||||||
#app {
|
|
||||||
font-family: 'Avenir', Helvetica, Arial, sans-serif;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
text-align: center;
|
|
||||||
color: #2c3e50;
|
|
||||||
}
|
|
||||||
|
|
||||||
#nav {
|
export default {
|
||||||
padding: 30px;
|
name: 'App',
|
||||||
}
|
|
||||||
|
|
||||||
#nav a {
|
components: {
|
||||||
font-weight: bold;
|
},
|
||||||
color: #2c3e50;
|
|
||||||
}
|
|
||||||
|
|
||||||
#nav a.router-link-exact-active {
|
data: () => ({
|
||||||
color: #42b983;
|
//
|
||||||
}
|
}),
|
||||||
</style>
|
};
|
||||||
|
</script>
|
||||||
|
|
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 322 KiB |
|
|
@ -0,0 +1 @@
|
||||||
|
<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 87.5 100"><defs><style>.cls-1{fill:#1697f6;}.cls-2{fill:#7bc6ff;}.cls-3{fill:#1867c0;}.cls-4{fill:#aeddff;}</style></defs><title>Artboard 46</title><polyline class="cls-1" points="43.75 0 23.31 0 43.75 48.32"/><polygon class="cls-2" points="43.75 62.5 43.75 100 0 14.58 22.92 14.58 43.75 62.5"/><polyline class="cls-3" points="43.75 0 64.19 0 43.75 48.32"/><polygon class="cls-4" points="64.58 14.58 87.5 14.58 43.75 100 43.75 62.5 64.58 14.58"/></svg>
|
||||||
|
After Width: | Height: | Size: 539 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
|
|
@ -1,58 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="hello">
|
|
||||||
<h1>{{ msg }}</h1>
|
|
||||||
<p>
|
|
||||||
For a guide and recipes on how to configure / customize this project,<br>
|
|
||||||
check out the
|
|
||||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
|
|
||||||
</p>
|
|
||||||
<h3>Installed CLI Plugins</h3>
|
|
||||||
<ul>
|
|
||||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
|
|
||||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
|
|
||||||
</ul>
|
|
||||||
<h3>Essential Links</h3>
|
|
||||||
<ul>
|
|
||||||
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
|
|
||||||
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
|
|
||||||
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
|
|
||||||
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
|
|
||||||
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
|
|
||||||
</ul>
|
|
||||||
<h3>Ecosystem</h3>
|
|
||||||
<ul>
|
|
||||||
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
|
|
||||||
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
|
|
||||||
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
|
|
||||||
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
|
|
||||||
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'HelloWorld',
|
|
||||||
props: {
|
|
||||||
msg: String
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
||||||
<style scoped>
|
|
||||||
h3 {
|
|
||||||
margin: 40px 0 0;
|
|
||||||
}
|
|
||||||
ul {
|
|
||||||
list-style-type: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
li {
|
|
||||||
display: inline-block;
|
|
||||||
margin: 0 10px;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
color: #42b983;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -0,0 +1,46 @@
|
||||||
|
<template>
|
||||||
|
<v-app-bar
|
||||||
|
app
|
||||||
|
flat
|
||||||
|
clipped-left
|
||||||
|
absolute
|
||||||
|
color="blue accent-4"
|
||||||
|
class="elevation-4"
|
||||||
|
dark>
|
||||||
|
|
||||||
|
<v-btn icon>
|
||||||
|
<v-img src="@/assets/logo-big.png" contain height="40"></v-img>
|
||||||
|
</v-btn>
|
||||||
|
<v-toolbar-title>WU5-Dashboard</v-toolbar-title>
|
||||||
|
<v-spacer/>
|
||||||
|
<v-btn icon v-if="isFinanzer">
|
||||||
|
<v-icon>local_bar</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
<v-btn v-if="isLoggedIn" @click="logout">Logout</v-btn>
|
||||||
|
</v-app-bar>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {mapActions} from "vuex";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "TitleBar",
|
||||||
|
computed: {
|
||||||
|
isFinanzer() {
|
||||||
|
return this.$store.getters.getGroup === 'moneymaster' ? true : false
|
||||||
|
},
|
||||||
|
isLoggedIn() {
|
||||||
|
return this.$store.getters.getToken
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
...mapActions([
|
||||||
|
'logout'
|
||||||
|
])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,58 @@
|
||||||
|
<template>
|
||||||
|
<v-content>
|
||||||
|
<v-container>
|
||||||
|
<v-card raised shaped>
|
||||||
|
<v-container>
|
||||||
|
<v-row>
|
||||||
|
<v-col align-self="center">
|
||||||
|
<v-container>
|
||||||
|
<v-btn>Col 1</v-btn>
|
||||||
|
</v-container>
|
||||||
|
</v-col>
|
||||||
|
<v-row>
|
||||||
|
<v-col>
|
||||||
|
<v-row>
|
||||||
|
<v-container>
|
||||||
|
<v-btn>Col 2.1.1</v-btn>
|
||||||
|
</v-container>
|
||||||
|
</v-row>
|
||||||
|
<v-row>
|
||||||
|
<v-container>
|
||||||
|
<v-btn>Col 2.1.2</v-btn>
|
||||||
|
</v-container>
|
||||||
|
</v-row>
|
||||||
|
</v-col>
|
||||||
|
<v-col>
|
||||||
|
<v-row>
|
||||||
|
<v-btn>Col 2.2.1</v-btn>
|
||||||
|
</v-row>
|
||||||
|
<v-row>
|
||||||
|
<v-btn>Col 2.2.2</v-btn>
|
||||||
|
</v-row>
|
||||||
|
</v-col>
|
||||||
|
<v-col>
|
||||||
|
<v-row>
|
||||||
|
<v-btn>Col 2.3.1</v-btn>
|
||||||
|
</v-row>
|
||||||
|
<v-row>
|
||||||
|
<v-btn>Col 2.3.2</v-btn>
|
||||||
|
</v-row>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
<v-col><v-btn>Col 3</v-btn></v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
|
</v-card>
|
||||||
|
</v-container>
|
||||||
|
</v-content>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "CreditLists"
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
<template>
|
||||||
|
<v-data-table></v-data-table>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "Overview",
|
||||||
|
props: {
|
||||||
|
year: null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -2,11 +2,13 @@ import Vue from 'vue'
|
||||||
import App from './App.vue'
|
import App from './App.vue'
|
||||||
import router from './router'
|
import router from './router'
|
||||||
import store from './store'
|
import store from './store'
|
||||||
|
import vuetify from './plugins/vuetify';
|
||||||
|
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
|
|
||||||
new Vue({
|
new Vue({
|
||||||
router,
|
router,
|
||||||
store,
|
store,
|
||||||
|
vuetify,
|
||||||
render: h => h(App)
|
render: h => h(App)
|
||||||
}).$mount('#app')
|
}).$mount('#app')
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import Vuetify from 'vuetify/lib';
|
||||||
|
import 'material-design-icons-iconfont'
|
||||||
|
|
||||||
|
Vue.use(Vuetify);
|
||||||
|
|
||||||
|
export default new Vuetify({
|
||||||
|
icons: {
|
||||||
|
iconfont: 'md',
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
@ -1,27 +1,57 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import VueRouter from 'vue-router'
|
import VueRouter from 'vue-router'
|
||||||
import Home from '../views/Home.vue'
|
import FinanzerView from "@/views/FinanzerView";
|
||||||
|
import Login from "@/views/Login";
|
||||||
|
import store from "@/store/index";
|
||||||
|
import BarView from "@/views/BarView";
|
||||||
|
|
||||||
Vue.use(VueRouter)
|
Vue.use(VueRouter)
|
||||||
|
|
||||||
const routes = [
|
const routes = [
|
||||||
|
|
||||||
{
|
{
|
||||||
path: '/',
|
path: "/login",
|
||||||
name: 'home',
|
name: "login",
|
||||||
component: Home
|
component: Login
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/about',
|
path: "/finanzer",
|
||||||
name: 'about',
|
name: "finanzer",
|
||||||
// route level code-splitting
|
component: FinanzerView
|
||||||
// this generates a separate chunk (about.[hash].js) for this route
|
},
|
||||||
// which is lazy-loaded when the route is visited.
|
{
|
||||||
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
|
path: "/bar",
|
||||||
|
name: "bar",
|
||||||
|
component: BarView
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: '*',
|
||||||
|
redirect: {
|
||||||
|
name: "login"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|
||||||
const router = new VueRouter({
|
const router = new VueRouter({
|
||||||
|
mode: 'history',
|
||||||
|
base: process.env.BASE_URL,
|
||||||
routes
|
routes
|
||||||
})
|
})
|
||||||
|
|
||||||
|
router.beforeEach((to, from, next) => {
|
||||||
|
store.dispatch('fetchAccessToken');
|
||||||
|
if (to.fullPath === '/finanzer') {
|
||||||
|
if (!store.state.user.accessToken) {
|
||||||
|
next('/login')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (to.fullPath === '/login') {
|
||||||
|
if (store.state.user.accessToken) {
|
||||||
|
next('/finanzer')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
next();
|
||||||
|
});
|
||||||
|
|
||||||
export default router
|
export default router
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,97 @@
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import Vuex from 'vuex'
|
import Vuex from 'vuex'
|
||||||
|
import router from "@/router";
|
||||||
|
import axios from 'axios'
|
||||||
|
|
||||||
Vue.use(Vuex)
|
Vue.use(Vuex)
|
||||||
|
|
||||||
|
const url = 'http://localhost:5000/'
|
||||||
|
|
||||||
export default new Vuex.Store({
|
export default new Vuex.Store({
|
||||||
state: {
|
state: {
|
||||||
|
user: {
|
||||||
|
username: null,
|
||||||
|
accessToken: null,
|
||||||
|
group: null
|
||||||
|
},
|
||||||
|
loggingIn: false,
|
||||||
|
loginError: null
|
||||||
},
|
},
|
||||||
mutations: {
|
mutations: {
|
||||||
|
loginStart: state => state.loggingIn = true,
|
||||||
|
loginStop (state, errorMessage){
|
||||||
|
state.loggingIn = false;
|
||||||
|
state.loginError = errorMessage;
|
||||||
|
},
|
||||||
|
updateAccessToken (state, data) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
if (typeof(data) === typeof("")) {
|
||||||
|
data = JSON.parse(data)
|
||||||
|
}
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log("updateAccessToken data:", typeof (data), data)
|
||||||
|
if (data === null || data === undefined) {
|
||||||
|
state.user.username = null;
|
||||||
|
state.user.accessToken = null;
|
||||||
|
state.user.group = null;
|
||||||
|
} else {
|
||||||
|
this.state.user.username = data.username;
|
||||||
|
state.user.accessToken = data.accessToken;
|
||||||
|
state.user.group = data.group;
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log("state: ", state.user)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
logout (state) {
|
||||||
|
state.user.accessToken = null;
|
||||||
|
state.user.username = null;
|
||||||
|
state.user.group = null;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
|
doLogin({ commit }, loginData) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log("loginData:", loginData)
|
||||||
|
commit('loginStart');
|
||||||
|
axios.post(url+'login', {...loginData})
|
||||||
|
.then(response => {
|
||||||
|
localStorage.setItem('user', JSON.stringify({ username: response.data.username, accessToken: response.data.token, group: response.data.group}));
|
||||||
|
commit('loginStop', null);
|
||||||
|
commit('updateAccessToken', response.data)
|
||||||
|
if (this.state.user.group === 'moneymaster') {
|
||||||
|
router.push('/finanzer');
|
||||||
|
}
|
||||||
|
if (this.state.user.group === 'bar') {
|
||||||
|
router.push('/bar')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
commit('loginStop', error.response.data.error)
|
||||||
|
commit('updateAccessToken', {username: null, accessToken: null, group: null})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fetchAccessToken({ commit }) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log("localStorage: ", localStorage.getItem('user'))
|
||||||
|
commit('updateAccessToken', localStorage.getItem('user'))
|
||||||
|
},
|
||||||
|
logout({ commit }) {
|
||||||
|
localStorage.removeItem('user');
|
||||||
|
commit('logout');
|
||||||
|
router.push('/login');
|
||||||
|
},
|
||||||
|
resetLoginError({ commit }) {
|
||||||
|
commit("loginStop")
|
||||||
|
}
|
||||||
},
|
},
|
||||||
modules: {
|
modules: {
|
||||||
|
},
|
||||||
|
getters: {
|
||||||
|
getGroup: state => {
|
||||||
|
return state.user.group
|
||||||
|
},
|
||||||
|
getToken: state => {
|
||||||
|
return state.user.accessToken
|
||||||
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,38 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<TitleBar/>
|
||||||
|
<CreditLists></CreditLists>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import TitleBar from "@/components/TitleBar";
|
||||||
|
import axios from 'axios'
|
||||||
|
import CreditLists from "@/components/baruser/CreditLists";
|
||||||
|
export default {
|
||||||
|
name: "BarView",
|
||||||
|
components: {CreditLists, TitleBar},
|
||||||
|
created() {
|
||||||
|
this.getUser()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getUser() {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(this.$store.getters.getToken)
|
||||||
|
axios.get("http://localhost:5000/bar", {headers: {Token: this.$store.getters.getToken}})
|
||||||
|
.then(response => {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(response.data)
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(error)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,61 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<TitleBar/>
|
||||||
|
<v-navigation-drawer permanent width="auto" app clipped class="elevation-2">
|
||||||
|
<v-container>
|
||||||
|
<h1 v-for="user in users" v-bind:key="user.id">{{user.firstname}} {{user.lastname}}</h1>
|
||||||
|
</v-container>
|
||||||
|
</v-navigation-drawer>
|
||||||
|
<v-content>
|
||||||
|
<v-container>
|
||||||
|
|
||||||
|
</v-container>
|
||||||
|
</v-content>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import TitleBar from "@/components/TitleBar";
|
||||||
|
import axios from 'axios'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "FinanzerView",
|
||||||
|
components: {TitleBar},
|
||||||
|
created() {
|
||||||
|
this.getUser()
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
users: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getUser() {
|
||||||
|
axios.get("http://localhost:5000/getFinanzerMain", {headers: {Token: this.$store.getters.getToken}})
|
||||||
|
.then(response => {
|
||||||
|
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(response.data)
|
||||||
|
for (let user in response.data) {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(response.data[user])
|
||||||
|
const lastId = this.users.length > 0 ? this.users[this.users.length - 1].id : 0
|
||||||
|
this.users.push({id: lastId + 1, username: response.data[user].username, firstname: response.data[user].firstname, lastname: response.data[user].lastname})
|
||||||
|
}
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log(this.users)
|
||||||
|
})
|
||||||
|
.catch(error => {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
console.log("error: ", error.response.data.error)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -1,18 +1,17 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="home">
|
<div>
|
||||||
<img alt="Vue logo" src="../assets/logo.png">
|
<TitleBar/>
|
||||||
<HelloWorld msg="Welcome to Your Vue.js App"/>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
// @ is an alias to /src
|
// @ is an alias to /src
|
||||||
import HelloWorld from '@/components/HelloWorld.vue'
|
|
||||||
|
|
||||||
|
import TitleBar from "@/components/TitleBar";
|
||||||
export default {
|
export default {
|
||||||
name: 'home',
|
name: 'home',
|
||||||
components: {
|
components: {
|
||||||
HelloWorld
|
TitleBar
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,96 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<TitleBar/>
|
||||||
|
<v-content>
|
||||||
|
<v-container
|
||||||
|
class="fill-height"
|
||||||
|
fluid
|
||||||
|
>
|
||||||
|
<v-row
|
||||||
|
align="center"
|
||||||
|
justify="center"
|
||||||
|
>
|
||||||
|
<v-col
|
||||||
|
cols="12"
|
||||||
|
sm="8"
|
||||||
|
md="4"
|
||||||
|
>
|
||||||
|
<v-card class="elevation-12">
|
||||||
|
<v-toolbar
|
||||||
|
color="blue accent-4"
|
||||||
|
dark
|
||||||
|
flat
|
||||||
|
>
|
||||||
|
<v-toolbar-title>Login form</v-toolbar-title>
|
||||||
|
<v-spacer />
|
||||||
|
</v-toolbar>
|
||||||
|
<v-card-text>
|
||||||
|
<v-form >
|
||||||
|
<v-text-field
|
||||||
|
label="Login"
|
||||||
|
name="login"
|
||||||
|
prepend-icon="person"
|
||||||
|
type="text"
|
||||||
|
v-model="username"
|
||||||
|
ref="first"
|
||||||
|
@keyup.enter="login"
|
||||||
|
@change="resetError"
|
||||||
|
/>
|
||||||
|
|
||||||
|
<v-text-field
|
||||||
|
id="password"
|
||||||
|
label="Password"
|
||||||
|
name="password"
|
||||||
|
prepend-icon="lock"
|
||||||
|
type="password"
|
||||||
|
v-model="password"
|
||||||
|
@keyup.enter="login"
|
||||||
|
@change="resetError"
|
||||||
|
/>
|
||||||
|
</v-form>
|
||||||
|
</v-card-text>
|
||||||
|
<v-alert v-if="loginFail" dense type="error">{{ loginFail }}</v-alert>
|
||||||
|
<v-card-actions>
|
||||||
|
<v-spacer />
|
||||||
|
<v-btn @click="login" @submit.prevent="login" color="primary">Login</v-btn>
|
||||||
|
</v-card-actions>
|
||||||
|
</v-card>
|
||||||
|
</v-col>
|
||||||
|
</v-row>
|
||||||
|
</v-container>
|
||||||
|
</v-content>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import TitleBar from "@/components/TitleBar";
|
||||||
|
export default {
|
||||||
|
name: "Login",
|
||||||
|
components: {TitleBar},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
username: null,
|
||||||
|
password: null
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
login() {
|
||||||
|
// eslint-disable-next-line no-console
|
||||||
|
let o = {username: this.username, password: this.password}
|
||||||
|
this.$store.dispatch("doLogin", o)
|
||||||
|
},
|
||||||
|
resetError() {
|
||||||
|
this.$store.dispatch("resetLoginError")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
loginFail() {
|
||||||
|
return this.$store.state.loginError
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,5 @@
|
||||||
|
module.exports = {
|
||||||
|
"transpileDependencies": [
|
||||||
|
"vuetify"
|
||||||
|
]
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue