diff options
author | Ivan Topolnjak <ivantopo@gmail.com> | 2019-01-23 17:12:01 +0100 |
---|---|---|
committer | Ivan Topolnjak <ivantopo@gmail.com> | 2019-01-23 17:12:01 +0100 |
commit | 1db3f5c9c984dabbad7400c0c092942ff04580c0 (patch) | |
tree | fc2ec91cb15afdf217d7520782524060e182f63f /kamon-status/src/components | |
parent | e311df4b3a272f4f160857f718a96ec316a2fc06 (diff) | |
download | Kamon-1db3f5c9c984dabbad7400c0c092942ff04580c0.tar.gz Kamon-1db3f5c9c984dabbad7400c0c092942ff04580c0.tar.bz2 Kamon-1db3f5c9c984dabbad7400c0c092942ff04580c0.zip |
initial work on a embeded status page
Diffstat (limited to 'kamon-status/src/components')
-rw-r--r-- | kamon-status/src/components/HelloWorld.vue | 65 |
1 files changed, 65 insertions, 0 deletions
diff --git a/kamon-status/src/components/HelloWorld.vue b/kamon-status/src/components/HelloWorld.vue new file mode 100644 index 00000000..d9e77ef3 --- /dev/null +++ b/kamon-status/src/components/HelloWorld.vue @@ -0,0 +1,65 @@ +<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-typescript" target="_blank" rel="noopener">typescript</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 lang="ts"> +import { Component, Prop, Vue } from 'vue-property-decorator' +import axios from 'axios' + +@Component +export default class HelloWorld extends Vue { + @Prop() private msg!: string; + + private mounted() { + console.log("I'm mounting the thing") + axios.get("/status/base-config").then(result => { + console.log("GOT A RESULT", result.data) + }) + } +} +</script> + +<!-- Add "scoped" attribute to limit CSS to this component only --> +<style scoped lang="scss"> +h3 { + margin: 40px 0 0; +} +ul { + list-style-type: none; + padding: 0; +} +li { + display: inline-block; + margin: 0 10px; +} +a { + color: #42b983; +} +</style> |