loader timing and color

This commit is contained in:
voje 2019-04-25 18:31:56 +02:00
parent 2c5fef29df
commit fd94627fdb
5 changed files with 21 additions and 25 deletions

View File

@ -1,3 +1,3 @@
{ {
"api_addr": "http://193.2.76.103:8084" "api_addr": "http://0.0.0.0:8084"
} }

View File

@ -1,3 +1,3 @@
{ {
"api_addr": "http://193.2.76.103:8084" "api_addr": "http://0.0.0.0:8084"
} }

View File

@ -1,11 +1,5 @@
<template> <template>
<div> <div>
<p
v-if="this.$root.store.api_error !== null"
class="text-warning"
>
api_error: {{ this.$root.store.api_error }}
</p>
<Nav></Nav> <Nav></Nav>
<div class="my-home container-fluid"> <div class="my-home container-fluid">
<div class="row"> <div class="row">
@ -15,6 +9,9 @@
<LFunctors v-else></LFunctors> <LFunctors v-else></LFunctors>
</div> </div>
<div class="col-sm-10"> <div class="col-sm-10">
<p v-if="this.$root.store.api_error != null">
{{ this.$root.store.api_error }}
</p>
<router-view></router-view> <router-view></router-view>
</div> </div>
</div> </div>

View File

@ -1,6 +1,6 @@
<template> <template>
<!--load mode--> <!--load mode-->
<div v-if="show_loader"> <div v-if="state === 'loading'">
<pulse-loader :color="loader_color"></pulse-loader> <pulse-loader :color="loader_color"></pulse-loader>
</div> </div>
@ -76,16 +76,11 @@ export default {
}, },
state: "loading", // editing, normal state: "loading", // editing, normal
request_reload: false, request_reload: false,
loader_color: "#007bff", loader_color: "#b71511",
}}, }},
created: function () { created: function () {
this.reload() this.reload()
}, },
computed: {
show_loader: function () {
return this.state === "loading" && this.$root.store.api_error !== null
}
},
watch: { watch: {
hw: function () { hw: function () {
this.reload() this.reload()
@ -118,6 +113,7 @@ export default {
} }
} }
var component = this var component = this
component.state = "loading"
this.$http.get( this.$http.get(
this.$root.store.api_addr + this.$root.store.api_addr +
"/api/functor-frames" + "/api/functor-frames" +
@ -131,6 +127,7 @@ export default {
}) })
.catch(function(error) { .catch(function(error) {
component.$root.store.api_error = error component.$root.store.api_error = error
component.state = "error"
}) })
}, },
getFrames: function (hw, reduce_fun=null) { getFrames: function (hw, reduce_fun=null) {
@ -149,6 +146,7 @@ export default {
} }
} }
var component = this var component = this
component.state = "loading"
this.$http.get( this.$http.get(
this.$root.store.api_addr + "/api/frames" + this.$root.store.api_addr + "/api/frames" +
"?hw=" + hw + "&rf=" + reduce_fun + "?hw=" + hw + "&rf=" + reduce_fun +
@ -161,6 +159,7 @@ export default {
}) })
.catch(function(error) { .catch(function(error) {
component.$root.store.api_error = error component.$root.store.api_error = error
component.state = "error"
}) })
}, },
buildSentences: function () { buildSentences: function () {

View File

@ -7,15 +7,6 @@
<div class="alert alert-danger" v-if="error"> <div class="alert alert-danger" v-if="error">
<p>{{ error }}</p> <p>{{ error }}</p>
</div> </div>
<div class="form-group">
<input
type="text"
class="form-control js-login__username"
placeholder="Uporabnik"
v-model="credentials.username"
autocomplete="off"
>
</div>
<div class="form-group"> <div class="form-group">
<input <input
type="email" type="email"
@ -25,6 +16,15 @@
autocomplete="off" autocomplete="off"
> >
</div> </div>
<div class="form-group">
<input
type="text"
class="form-control js-login__username"
placeholder="Uporabnik"
v-model="credentials.username"
autocomplete="off"
>
</div>
<div class="form-group"> <div class="form-group">
<input <input
type="password" type="password"
@ -38,7 +38,7 @@
<input <input
type="password" type="password"
class="form-control js-login__password " class="form-control js-login__password "
placeholder="Ponovite geslo." placeholder="Ponovite geslo"
v-model="credentials.snd_password" v-model="credentials.snd_password"
autocomplete="off" autocomplete="off"
> >