First Commit
This commit is contained in:
parent
3d4c04925e
commit
42d2973a05
16 changed files with 616 additions and 78 deletions
122
package-lock.json
generated
122
package-lock.json
generated
|
|
@ -1653,6 +1653,12 @@
|
|||
"integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM=",
|
||||
"dev": true
|
||||
},
|
||||
"amdefine": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/amdefine/-/amdefine-1.0.1.tgz",
|
||||
"integrity": "sha1-SlKCrBZHKek2Gbz9OtFR+BfOkfU=",
|
||||
"dev": true
|
||||
},
|
||||
"ansi-colors": {
|
||||
"version": "3.2.4",
|
||||
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
|
||||
|
|
@ -1918,6 +1924,15 @@
|
|||
"integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==",
|
||||
"dev": true
|
||||
},
|
||||
"axios": {
|
||||
"version": "0.18.0",
|
||||
"resolved": "https://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
|
||||
"integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=",
|
||||
"requires": {
|
||||
"follow-redirects": "^1.3.0",
|
||||
"is-buffer": "^1.1.5"
|
||||
}
|
||||
},
|
||||
"babel-code-frame": {
|
||||
"version": "6.26.0",
|
||||
"resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
|
||||
|
|
@ -3280,6 +3295,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"css-parse": {
|
||||
"version": "1.7.0",
|
||||
"resolved": "https://registry.npmjs.org/css-parse/-/css-parse-1.7.0.tgz",
|
||||
"integrity": "sha1-Mh9s9zeCpv91ERE5D8BeLGV9jJs=",
|
||||
"dev": true
|
||||
},
|
||||
"css-select": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/css-select/-/css-select-2.0.2.tgz",
|
||||
|
|
@ -4878,7 +4899,6 @@
|
|||
"version": "1.7.0",
|
||||
"resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.7.0.tgz",
|
||||
"integrity": "sha512-m/pZQy4Gj287eNy94nivy5wchN3Kp+Q5WgUPNy5lJSZ3sgkVKSYV/ZChMAQVIgx1SqfZ2zBZtPA2YlXIWxxJOQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"debug": "^3.2.6"
|
||||
},
|
||||
|
|
@ -4887,7 +4907,6 @@
|
|||
"version": "3.2.6",
|
||||
"resolved": "https://registry.npmjs.org/debug/-/debug-3.2.6.tgz",
|
||||
"integrity": "sha512-mel+jf7nrtEl5Pn1Qx46zARXKDpBbvzezse7p7LqINmdoIk8PYP5SySaxEmYv6TZ0JyEKA1hsCId6DIhgITtWQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ms": "^2.1.1"
|
||||
}
|
||||
|
|
@ -6304,8 +6323,7 @@
|
|||
"is-buffer": {
|
||||
"version": "1.1.6",
|
||||
"resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
|
||||
"integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
|
||||
"dev": true
|
||||
"integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
|
||||
},
|
||||
"is-callable": {
|
||||
"version": "1.1.4",
|
||||
|
|
@ -6858,6 +6876,12 @@
|
|||
"integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==",
|
||||
"dev": true
|
||||
},
|
||||
"lodash.clonedeep": {
|
||||
"version": "4.5.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz",
|
||||
"integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=",
|
||||
"dev": true
|
||||
},
|
||||
"lodash.defaultsdeep": {
|
||||
"version": "4.6.0",
|
||||
"resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.0.tgz",
|
||||
|
|
@ -7248,8 +7272,7 @@
|
|||
"ms": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
|
||||
"integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
|
||||
"dev": true
|
||||
"integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg=="
|
||||
},
|
||||
"multicast-dns": {
|
||||
"version": "6.2.3",
|
||||
|
|
@ -10033,6 +10056,62 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"stylus": {
|
||||
"version": "0.54.5",
|
||||
"resolved": "https://registry.npmjs.org/stylus/-/stylus-0.54.5.tgz",
|
||||
"integrity": "sha1-QrlWCTHKcJDOhRWnmLqeaqPW3Hk=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"css-parse": "1.7.x",
|
||||
"debug": "*",
|
||||
"glob": "7.0.x",
|
||||
"mkdirp": "0.5.x",
|
||||
"sax": "0.5.x",
|
||||
"source-map": "0.1.x"
|
||||
},
|
||||
"dependencies": {
|
||||
"glob": {
|
||||
"version": "7.0.6",
|
||||
"resolved": "https://registry.npmjs.org/glob/-/glob-7.0.6.tgz",
|
||||
"integrity": "sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fs.realpath": "^1.0.0",
|
||||
"inflight": "^1.0.4",
|
||||
"inherits": "2",
|
||||
"minimatch": "^3.0.2",
|
||||
"once": "^1.3.0",
|
||||
"path-is-absolute": "^1.0.0"
|
||||
}
|
||||
},
|
||||
"sax": {
|
||||
"version": "0.5.8",
|
||||
"resolved": "https://registry.npmjs.org/sax/-/sax-0.5.8.tgz",
|
||||
"integrity": "sha1-1HLbIo6zMcJQaw6MFVJK25OdEsE=",
|
||||
"dev": true
|
||||
},
|
||||
"source-map": {
|
||||
"version": "0.1.43",
|
||||
"resolved": "https://registry.npmjs.org/source-map/-/source-map-0.1.43.tgz",
|
||||
"integrity": "sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y=",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"amdefine": ">=0.0.4"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"stylus-loader": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/stylus-loader/-/stylus-loader-3.0.2.tgz",
|
||||
"integrity": "sha512-+VomPdZ6a0razP+zinir61yZgpw2NfljeSsdUF5kJuEzlo3khXhY19Fn6l8QQz1GRJGtMCo8nG5C04ePyV7SUA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"loader-utils": "^1.0.2",
|
||||
"lodash.clonedeep": "^4.5.0",
|
||||
"when": "~3.6.x"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
|
|
@ -10776,6 +10855,12 @@
|
|||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
|
||||
"integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ=="
|
||||
},
|
||||
"vue-cli-plugin-vuetify": {
|
||||
"version": "0.5.0",
|
||||
"resolved": "https://registry.npmjs.org/vue-cli-plugin-vuetify/-/vue-cli-plugin-vuetify-0.5.0.tgz",
|
||||
"integrity": "sha512-TigfiZUs7SN3Z6uxKilqJUtYxte8vp0F4QxabCli6hkKPqU97JzAZc3P7AL6omkRAd2DMI26fOrIGjuALTvXww==",
|
||||
"dev": true
|
||||
},
|
||||
"vue-eslint-parser": {
|
||||
"version": "2.0.3",
|
||||
"resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz",
|
||||
|
|
@ -10859,6 +10944,25 @@
|
|||
"integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==",
|
||||
"dev": true
|
||||
},
|
||||
"vuetify": {
|
||||
"version": "1.5.14",
|
||||
"resolved": "https://registry.npmjs.org/vuetify/-/vuetify-1.5.14.tgz",
|
||||
"integrity": "sha512-7iM+TfghR/wu/Gl+k37lKr0N8Ddr6SxzqHtoK1dIyHgCH6SJRkpaXPw2MC5/FsAg9aUDJbYNWrzSeu5eHw+Q/w=="
|
||||
},
|
||||
"vuetify-loader": {
|
||||
"version": "1.2.2",
|
||||
"resolved": "https://registry.npmjs.org/vuetify-loader/-/vuetify-loader-1.2.2.tgz",
|
||||
"integrity": "sha512-j6KWPuwQ4xTxPDksbFwbSJle7+3oSjNvJ/CViTEgbPLFPqnNsR8JUtRldURIQ0cmAmr0/CoLSZkj0B8JKqOBMA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"loader-utils": "^1.1.0"
|
||||
}
|
||||
},
|
||||
"vuex": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.1.1.tgz",
|
||||
"integrity": "sha512-ER5moSbLZuNSMBFnEBVGhQ1uCBNJslH9W/Dw2W7GZN23UQA69uapP5GTT9Vm8Trc0PzBSVt6LzF3hGjmv41xcg=="
|
||||
},
|
||||
"watchpack": {
|
||||
"version": "1.6.0",
|
||||
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.0.tgz",
|
||||
|
|
@ -11250,6 +11354,12 @@
|
|||
"integrity": "sha512-nqHUnMXmBzT0w570r2JpJxfiSD1IzoI+HGVdd3aZ0yNi3ngvQ4jv1dtHt5VGxfI2yj5yqImPhOK4vmIh2xMbGg==",
|
||||
"dev": true
|
||||
},
|
||||
"when": {
|
||||
"version": "3.6.4",
|
||||
"resolved": "https://registry.npmjs.org/when/-/when-3.6.4.tgz",
|
||||
"integrity": "sha1-RztRfsFZ4rhQBUl6E5g/CVQS404=",
|
||||
"dev": true
|
||||
},
|
||||
"which": {
|
||||
"version": "1.3.1",
|
||||
"resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
|
||||
|
|
|
|||
11
package.json
11
package.json
|
|
@ -8,8 +8,11 @@
|
|||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.18.0",
|
||||
"core-js": "^2.6.5",
|
||||
"vue": "^2.6.10"
|
||||
"vue": "^2.6.10",
|
||||
"vuetify": "^1.5.5",
|
||||
"vuex": "^3.1.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "^3.7.0",
|
||||
|
|
@ -18,7 +21,11 @@
|
|||
"babel-eslint": "^10.0.1",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint-plugin-vue": "^5.0.0",
|
||||
"vue-template-compiler": "^2.5.21"
|
||||
"stylus": "^0.54.5",
|
||||
"stylus-loader": "^3.0.1",
|
||||
"vue-cli-plugin-vuetify": "^0.5.0",
|
||||
"vue-template-compiler": "^2.5.21",
|
||||
"vuetify-loader": "^1.0.5"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"root": true,
|
||||
|
|
|
|||
|
|
@ -3,9 +3,11 @@
|
|||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title>keksaccountgui</title>
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Material+Icons">
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
|
|
|
|||
101
src/App.vue
101
src/App.vue
|
|
@ -1,28 +1,93 @@
|
|||
<template>
|
||||
<div id="app">
|
||||
<img alt="Vue logo" src="./assets/logo.png">
|
||||
<HelloWorld msg="Welcome to Your Vue.js App"/>
|
||||
</div>
|
||||
<v-app v-scroll="handleScroll" v-if="$store.state.settingsLoaded">
|
||||
<v-toolbar app :flat="flat" :prominent="big" :dense="!big" :color="bgcolor" clipped-left >
|
||||
<v-toolbar-title class="headline text-uppercase" >
|
||||
<span>{{ nameBig }}</span>
|
||||
<span class="font-weight-light">{{ nameSmall }}</span>
|
||||
</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
<v-toolbar-items class="hidden-sm-and-down">
|
||||
<v-btn
|
||||
v-for="item in menu"
|
||||
:key="item.icon"
|
||||
:to="item.link"
|
||||
flat
|
||||
>{{ item.title }}</v-btn>
|
||||
</v-toolbar-items>
|
||||
<v-menu class="hidden-md-and-up">
|
||||
<v-toolbar-side-icon slot="activator"></v-toolbar-side-icon>
|
||||
<v-list>
|
||||
<v-list-tile v-for="item in menu" :key="item.icon">
|
||||
<v-list-tile-content>
|
||||
<v-list-tile-title>{{ item.title }}</v-list-tile-title>
|
||||
</v-list-tile-content>
|
||||
</v-list-tile>
|
||||
</v-list>
|
||||
</v-menu>
|
||||
|
||||
</v-toolbar>
|
||||
|
||||
|
||||
<v-content style="background-color: #fff;">
|
||||
<Startpage/>
|
||||
</v-content>
|
||||
</v-app>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import HelloWorld from './components/HelloWorld.vue'
|
||||
import HelloWorld from './components/HelloWorld'
|
||||
import Startpage from './components/Startpage'
|
||||
|
||||
export default {
|
||||
name: 'app',
|
||||
name: 'App',
|
||||
components: {
|
||||
HelloWorld
|
||||
HelloWorld,
|
||||
Startpage
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
big: true,
|
||||
bgcolor: "transparent",
|
||||
flat: true,
|
||||
nameBig: '',
|
||||
nameSmall: '',
|
||||
menu: [
|
||||
{ icon: 'home', title: 'Login' },
|
||||
{ icon: 'info', title: 'Invited' },
|
||||
{ icon: 'warning', title: 'Register' }
|
||||
],
|
||||
menu2: [
|
||||
{ icon: 'home', title: 'Apps' },
|
||||
{ icon: 'info', title: 'Admin' },
|
||||
{ icon: 'warning', title: 'Account' }
|
||||
]
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
setting: (name) => {
|
||||
//this.$store.getters.getSettingValue(this.$store.state, name);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleScroll: function (evt, el) {
|
||||
if(evt.pageY > 100) {
|
||||
this.big = false;
|
||||
this.bgcolor = "#fff";
|
||||
this.flat = false;
|
||||
} else {
|
||||
this.big = true;
|
||||
this.bgcolor = "transparent";
|
||||
this.flat = true;
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted: function () {
|
||||
|
||||
this.$store.dispatch('getSettings').then(() => {
|
||||
this.nameBig = this.$store.getters.getSettingValue("name_big");
|
||||
this.nameSmall = this.$store.getters.getSettingValue("name_small");
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
#app {
|
||||
font-family: 'Avenir', Helvetica, Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
text-align: center;
|
||||
color: #2c3e50;
|
||||
margin-top: 60px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
BIN
src/assets/background-image-for-website-19.jpg
Normal file
BIN
src/assets/background-image-for-website-19.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 249 KiB |
BIN
src/assets/connect.png
Normal file
BIN
src/assets/connect.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 861 B |
BIN
src/assets/diagonal-squares.png
Normal file
BIN
src/assets/diagonal-squares.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
1
src/assets/logo.svg
Normal file
1
src/assets/logo.svg
Normal file
|
|
@ -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 |
BIN
src/assets/manhattan-407703_1920.jpg
Normal file
BIN
src/assets/manhattan-407703_1920.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 509 KiB |
|
|
@ -1,58 +1,108 @@
|
|||
<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>
|
||||
<v-container grid-list-md>
|
||||
|
||||
<v-layout row wrap >
|
||||
<v-flex xm12 md12>
|
||||
<h1>App Test</h1>
|
||||
<v-alert
|
||||
:value="true"
|
||||
type="warning"
|
||||
>
|
||||
This app is still in testing mode. To remove the testing flag contact the Administrator.
|
||||
</v-alert>
|
||||
<v-card class="mx-auto" flat style="margin-top: 10px;">
|
||||
<v-tabs
|
||||
background-color="white"
|
||||
color="fff"
|
||||
left
|
||||
|
||||
>
|
||||
<v-tab>Overview</v-tab>
|
||||
<v-tab>API Access</v-tab>
|
||||
<v-tab>Settings</v-tab>
|
||||
<v-tab disabled>Users</v-tab>
|
||||
|
||||
<v-tab-item :key="1" :transition="false" :reverse-transition="false" >
|
||||
<v-container style="padding-right: 0px; padding-left:0px;">
|
||||
<img src="https://account.keks.cloud/gui/apps/3/icon" style="float: right;width: 100px;">
|
||||
<b>Description</b><br>
|
||||
Keks Cloud Mattermost Chat App<br><br>
|
||||
<a href="https://chat.keks.cloud">https://chat.keks.cloud</a>
|
||||
</v-container>
|
||||
|
||||
</v-tab-item>
|
||||
<v-tab-item :key="2" :transition="false" :reverse-transition="false">
|
||||
<v-container style="padding-right: 0px; padding-left:0px;">
|
||||
<h2>oAuth Token</h2>
|
||||
<p>
|
||||
Here are the oAuth API-Keys. You use this Keys to start the oAuth authorization work flow.
|
||||
</p>
|
||||
<v-text-field
|
||||
label="API Key"
|
||||
value="d21ec9146c3c327211b8b7fd44003916b938d751d458fece25ef51fa9c8896c97ceb22d032e6dc7388c6143a3b3157764949a7b2cbb062e005dd5f009310ab00"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
label="API Secret"
|
||||
value="fc769296b4b411c93b22c296b2e8c979ca31de11aadaac9c73ff4972bfc9df57c021fe33575c6e080d21039ecfeb1ae4efb2566e6ad4c463b8e139d0612867a9"
|
||||
></v-text-field>
|
||||
<br>
|
||||
<h2>API Access</h2>
|
||||
<p>
|
||||
You can access the API to get informations about this APP with the following API Credentials:
|
||||
<v-text-field
|
||||
label="API Token"
|
||||
value="sadfwef42fwqefergw"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
label="Refresh Token"
|
||||
value="asdfdsafjöoiajsefoiaösjdfo"
|
||||
></v-text-field>
|
||||
<h2>Development Access</h2>
|
||||
<p>
|
||||
To test the App you can use the following Developer Access and Refresh token, they are connected to your user.
|
||||
<v-text-field
|
||||
label="Access Token"
|
||||
value="3916b938d751d458fece25ef51fa9c8896c97ceb22d032e6dc7388c6143a3b31577649"
|
||||
></v-text-field>
|
||||
<v-text-field
|
||||
label="Refresh Token"
|
||||
value="411c93b22c296b2e8c979ca31de11aadaac9c73ff4972bfc9df57c021"
|
||||
></v-text-field>
|
||||
</p>
|
||||
</v-container>
|
||||
</v-tab-item>
|
||||
<v-tab-item :key="3" :transition="false" :reverse-transition="false">
|
||||
<v-container style="padding-right: 0px; padding-left:0px;">
|
||||
FooBar
|
||||
</v-container>
|
||||
</v-tab-item>
|
||||
<v-tab-item :key="4" :transition="false" :reverse-transition="false">
|
||||
<v-container style="padding-right: 0px; padding-left:0px;">
|
||||
FooBar
|
||||
</v-container>
|
||||
</v-tab-item>
|
||||
|
||||
</v-tabs>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
props: {
|
||||
msg: String
|
||||
}
|
||||
}
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
menu: [
|
||||
{ icon: 'home', title: 'Login' },
|
||||
{ icon: 'info', title: 'Invited' },
|
||||
{ icon: 'warning', title: 'Register' }
|
||||
]
|
||||
}
|
||||
}
|
||||
}
|
||||
</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>
|
||||
|
||||
</style>
|
||||
|
|
|
|||
215
src/components/Startpage.vue
Normal file
215
src/components/Startpage.vue
Normal file
|
|
@ -0,0 +1,215 @@
|
|||
<template>
|
||||
<div style="">
|
||||
<div class="header">
|
||||
<h1>{{ nameBig }}<span class="small">{{ nameSmall }}</span></h1>
|
||||
<h2>{{ slogen }}</h2>
|
||||
</div>
|
||||
<v-container grid-list-md>
|
||||
<v-layout row wrap>
|
||||
<v-flex md12>
|
||||
<h1>Services</h1>
|
||||
<p>Mit deinem KeksAccount Username kannst du dich u.a. bei folgenden Servicen einloggen und diese nutzten. </p>
|
||||
</v-flex>
|
||||
<v-flex md4 text-xs-center>
|
||||
<v-card>
|
||||
<v-layout>
|
||||
<v-flex xs5>
|
||||
<v-img
|
||||
src="https://account.keks.cloud/gui/apps/1/icon"
|
||||
height="125px"
|
||||
contain
|
||||
></v-img>
|
||||
</v-flex>
|
||||
<v-flex xs7>
|
||||
<v-card-title primary-title>
|
||||
<div>
|
||||
<div class="headline">Git</div>
|
||||
<div>Git-Server von keks.cloud</div>
|
||||
</div>
|
||||
</v-card-title>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider light></v-divider>
|
||||
<v-card-actions class="pa-3">
|
||||
|
||||
<v-spacer></v-spacer>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
<v-flex md4 text-xs-center>
|
||||
<v-card>
|
||||
<v-layout>
|
||||
<v-flex xs5>
|
||||
<v-img
|
||||
src="https://account.keks.cloud/gui/apps/3/icon"
|
||||
height="125px"
|
||||
contain
|
||||
></v-img>
|
||||
</v-flex>
|
||||
<v-flex xs7>
|
||||
<v-card-title primary-title>
|
||||
<div>
|
||||
<div class="headline">Chat</div>
|
||||
<div>Mattermost Chat Server</div>
|
||||
</div>
|
||||
</v-card-title>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider light></v-divider>
|
||||
<v-card-actions class="pa-3">
|
||||
|
||||
<v-spacer></v-spacer>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
<v-flex md4 text-xs-center>
|
||||
<v-card>
|
||||
<v-layout>
|
||||
<v-flex xs5>
|
||||
<v-img
|
||||
src="https://account.keks.cloud/gui/apps/4/icon"
|
||||
height="125px"
|
||||
contain
|
||||
></v-img>
|
||||
</v-flex>
|
||||
<v-flex xs7>
|
||||
<v-card-title primary-title>
|
||||
<div>
|
||||
<div class="headline">Nextcloud</div>
|
||||
<div>Share Files with other Users</div>
|
||||
</div>
|
||||
</v-card-title>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider light></v-divider>
|
||||
<v-card-actions class="pa-3">
|
||||
|
||||
<v-spacer></v-spacer>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
<v-flex md4 text-xs-center>
|
||||
<v-card>
|
||||
<v-layout>
|
||||
<v-flex xs5>
|
||||
<v-img
|
||||
src="https://account.keks.cloud/gui/apps/5/icon"
|
||||
height="125px"
|
||||
contain
|
||||
></v-img>
|
||||
</v-flex>
|
||||
<v-flex xs7>
|
||||
<v-card-title primary-title>
|
||||
<div>
|
||||
<div class="headline">Jenkins</div>
|
||||
<div>Build pipelines for Developer</div>
|
||||
</div>
|
||||
</v-card-title>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider light></v-divider>
|
||||
<v-card-actions class="pa-3">
|
||||
|
||||
<v-spacer></v-spacer>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
<v-flex md4 text-xs-center>
|
||||
<v-card>
|
||||
<v-layout>
|
||||
<v-flex xs5>
|
||||
<v-img
|
||||
src="https://account.keks.cloud/gui/apps/7/icon"
|
||||
height="125px"
|
||||
contain
|
||||
></v-img>
|
||||
</v-flex>
|
||||
<v-flex xs7>
|
||||
<v-card-title primary-title>
|
||||
<div>
|
||||
<div class="headline">Wiki</div>
|
||||
<div>Dokumentation von Servicen und Projekten</div>
|
||||
</div>
|
||||
</v-card-title>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
<v-divider light></v-divider>
|
||||
<v-card-actions class="pa-3">
|
||||
|
||||
<v-spacer></v-spacer>
|
||||
<v-icon>exit_to_app</v-icon>
|
||||
</v-card-actions>
|
||||
</v-card>
|
||||
</v-flex>
|
||||
</v-layout>
|
||||
</v-container>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ServerService from '../services/Server'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
nameBig: '',
|
||||
nameSmall: '',
|
||||
slogen: '',
|
||||
menu: [
|
||||
{ icon: 'home', title: 'Login' },
|
||||
{ icon: 'info', title: 'Invited' },
|
||||
{ icon: 'warning', title: 'Register' }
|
||||
]
|
||||
}
|
||||
},
|
||||
mounted: function() {
|
||||
this.nameBig = this.$store.getters.getSettingValue("name_big");
|
||||
this.nameSmall = this.$store.getters.getSettingValue("name_small");
|
||||
this.slogen = this.$store.getters.getSettingValue("name_slogen");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.header {
|
||||
background-image: url('~@/assets/manhattan-407703_1920.jpg');
|
||||
background-repeat: no-repeat;
|
||||
margin-top: -100px;
|
||||
height: 45vh;
|
||||
height: 90vh;
|
||||
text-align: center;
|
||||
}
|
||||
.header h1{
|
||||
padding-top: 200px;
|
||||
font-size: 56px !important;
|
||||
font-weight: 400;
|
||||
line-height: 32px !important;
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
.header h1 .small{
|
||||
font-weight: 300 !important;
|
||||
}
|
||||
.header h2{
|
||||
padding-top: 30px;
|
||||
font-size: 34px !important;
|
||||
font-weight: 300;
|
||||
line-height: 32px !important;
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
h1{
|
||||
font-weight: 300;
|
||||
line-height: 32px !important;
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
h2{
|
||||
font-weight: 300;
|
||||
line-height: 32px !important;
|
||||
letter-spacing: normal !important;
|
||||
}
|
||||
</style>
|
||||
16
src/main.js
16
src/main.js
|
|
@ -1,8 +1,24 @@
|
|||
import Vue from 'vue'
|
||||
import './plugins/vuetify'
|
||||
import App from './App.vue'
|
||||
import store from './store/store'
|
||||
|
||||
|
||||
|
||||
Vue.directive('scroll', {
|
||||
inserted: function (el, binding) {
|
||||
let f = function (evt) {
|
||||
if (binding.value(evt, el)) {
|
||||
window.removeEventListener('scroll', f)
|
||||
}
|
||||
}
|
||||
window.addEventListener('scroll', f)
|
||||
}
|
||||
})
|
||||
|
||||
Vue.config.productionTip = false
|
||||
|
||||
new Vue({
|
||||
store,
|
||||
render: h => h(App),
|
||||
}).$mount('#app')
|
||||
|
|
|
|||
7
src/plugins/vuetify.js
Normal file
7
src/plugins/vuetify.js
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
import Vue from 'vue'
|
||||
import Vuetify from 'vuetify/lib'
|
||||
import 'vuetify/src/stylus/app.styl'
|
||||
|
||||
Vue.use(Vuetify, {
|
||||
iconfont: 'md',
|
||||
})
|
||||
12
src/services/Api.js
Normal file
12
src/services/Api.js
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
import axios from 'axios'
|
||||
|
||||
export default() => {
|
||||
return axios.create({
|
||||
baseURL: `http://localhost:8000/api/`,
|
||||
withCredentials: false,
|
||||
headers: {
|
||||
'Accept': 'application/json',
|
||||
'Content-Type': 'application/json'
|
||||
}
|
||||
})
|
||||
}
|
||||
7
src/services/Server.js
Normal file
7
src/services/Server.js
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
import Api from '@/services/Api'
|
||||
|
||||
export default {
|
||||
getSettings (params) {
|
||||
return Api().get('/v1/server/settings')
|
||||
}
|
||||
}
|
||||
46
src/store/store.js
Normal file
46
src/store/store.js
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
import Vuex from 'vuex'
|
||||
import Vue from 'vue'
|
||||
import ServerService from '../services/Server'
|
||||
|
||||
Vue.use(Vuex)
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
settingsLoaded: false,
|
||||
settings: [] // The TV inventory
|
||||
},
|
||||
|
||||
getters: {
|
||||
// Here we will create a getter
|
||||
getSettingValue: (state) => (name) => {
|
||||
if(state.settingsLoaded == false) {
|
||||
return null;
|
||||
}
|
||||
for(var i = 0; i < state.settings.length; i++) {
|
||||
if(state.settings[i]["name"] == name) {
|
||||
return state.settings[i]["value"];
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
mutations: {
|
||||
setSettings: function(state, settings) {
|
||||
state.settings = settings;
|
||||
state.settingsLoaded = true;
|
||||
}
|
||||
},
|
||||
|
||||
actions: {
|
||||
getSettings: function (context) {
|
||||
return new Promise((resolve, reject) => {
|
||||
ServerService.getSettings().then((res) => {
|
||||
console.log(res);
|
||||
context.commit('setSettings', res.data.data)
|
||||
resolve()
|
||||
});
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
});
|
||||
Reference in a new issue