Mercurial > gemma
diff client/src/systemconfiguration/systemconfiguration.vue @ 856:ce0d50b1d126
systemconfig WIP
author | Thomas Junk <thomas.junk@intevation.de> |
---|---|
date | Fri, 28 Sep 2018 14:13:51 +0200 |
parents | |
children | d1863e91b039 |
line wrap: on
line diff
--- /dev/null Thu Jan 01 00:00:00 1970 +0000 +++ b/client/src/systemconfiguration/systemconfiguration.vue Fri Sep 28 14:13:51 2018 +0200 @@ -0,0 +1,112 @@ +<template> + <div class="d-flex flex-row"> + <div class="card sysconfig"> + <div class="card-header shadow-sm text-white bg-info mb-3"> + Systemconfiguration + </div> + <div class="card-body"> + <div class="inputs form-group row"> + <div class="col-2"> + <label for="r"></label>R<input class="form-control form-control-sm" v-model="r" id="r" placeholder="r"> + </div> + <div class="col-2"> + <label for="g"></label>G<input class="form-control form-control-sm" v-model="g" id="g" placeholder="g"> + </div> + <div class="col-2"> + <label for="b"></label>B<input class="form-control form-control-sm" v-model="b" id="b" placeholder="b"> + </div> + <div class="col-2"> + + <label for="a"></label>A<input class="form-control form-control-sm" v-model="a" id="a" placeholder="a"> + </div> + </div> + <div class="sendbutton"> + <a @click="submit" class="btn btn-info">Send</a> + </div> + </div> + </div> + </div> +</template> + +<style lang="scss"> +.sendbutton { + position: absolute; + right: $large-offset; + bottom: $large-offset; +} +.inputs { + margin-left: auto; + margin-right: auto; +} +.sysconfig { + margin-top: $offset; + margin-left: auto; + margin-right: auto; + width: 30vw; + height: 40vh; +} +</style> + +<script> +import { HTTP } from "../application/lib/http"; +import { displayError } from "../application/lib/errors.js"; +export default { + name: "systemconfiguration", + data() { + return { + sent: false, + r: 224, + g: 215, + b: 216, + a: 90, + currentConfig: null + }; + }, + methods: { + submit() { + const payload = JSON.stringify({ + r: this.r, + g: this.g, + b: this.b, + a: this.a + }); + HTTP.put("/system/style/Bottlenecks/stroke", payload, { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-type": "text/xml; charset=UTF-8" + } + }) + .then() + .catch(error => { + this.loginFailed = true; + this.submitted = false; + const { status, data } = error.response; + displayError({ + title: "Backend Error", + message: `${status}: ${data.message || data}` + }); + }); + } + }, + mounted() { + HTTP.get("/system/style/Bottlenecks/stroke", { + headers: { + "X-Gemma-Auth": localStorage.getItem("token"), + "Content-type": "text/xml; charset=UTF-8" + } + }) + .then(response => { + console.log(response); + }) + .catch(error => { + this.loginFailed = true; + this.submitted = false; + const { status, data } = error.response; + displayError({ + title: "Backend Error", + message: `${status}: ${data.message || data}` + }); + }); + } +}; +</script>