jaro/meranie
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Fancy fixs

Browse Source
This commit is contained in:
Jaro
2021-01-12 21:20:11 +01:00
parent 50c493e20f
commit 0d489ae54a
5 changed files with 126 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
resources/js/app.js vendored
View File

@@ -34,6 +34,9 @@ Vue.use(VueThermometer);
import VueDygraphs from 'vue-dygraphs';
Vue.use(VueDygraphs);
import VueTableDynamic from 'vue-table-dynamic'
Vue.use(VueTableDynamic);
//(function () {
var app = new Vue({
el: '#app',
@@ -45,31 +48,38 @@ Vue.use(VueDygraphs);
pressure: null,
voltage: null,
time: null,
temp_options: {
legend: 'always',
title: 'Teplotný graf',
xlabel: 'Dátum',
labels: ['Dátum','Teplota'],
ylabel: 'Stupeň',
fillGraph: true
params: {
data: [],
border: true,
stripe: true
},
hum_options: {
color: 'red',
legend: 'always',
title: 'Vlhkosť graf',
xlabel: 'Dátum',
labels: ['Dátum','Vlhkosť'],
ylabel: 'Percent',
fillGraph: true
},
p_options: {
color: 'blue',
legend: 'always',
title: 'Tlak graf',
xlabel: 'Dátum',
labels: ['Dátum','Tlak'],
ylabel: 'Tlak',
fillGraph: true
options: {
temperature: {
legend: 'always',
title: 'Teplotný graf',
xlabel: 'Dátum',
labels: ['Dátum','Teplota'],
ylabel: 'Stupeň',
fillGraph: true
},
humidity: {
color: 'red',
legend: 'always',
title: 'Vlhkosť graf',
xlabel: 'Dátum',
labels: ['Dátum','Vlhkosť'],
ylabel: 'Percent',
fillGraph: true
},
pressure: {
color: 'blue',
legend: 'always',
title: 'Tlak graf',
xlabel: 'Dátum',
labels: ['Dátum','Tlak'],
ylabel: 'Tlak',
fillGraph: true
}
},
series: { "temperature" : [], "humidity" : [], "pressure": [] },
},
@@ -94,11 +104,13 @@ Vue.use(VueDygraphs);
.then(function (response) {
console.log("GET DATA");
console.log(response.data.temperature);
app.temperature = response.data.temperature;
app.humidity = response.data.humidity;
app.pressure = response.data.pressure;
app.voltage = response.data.voltage;
app.time = moment(response.data.time);
let data = app.params.data = [];
data.push(['Teplota',response.data.temperature,'°C']);
data.push(['Vlhkosť',response.data.humidity,'%']);
data.push(['Tlak',response.data.pressure,'kHPa']);
data.push(['Napätie',response.data.voltage,'V']);
moment.locale('sk_SK');
app.time = moment(response.data.time).format('LLL');
})
.catch(function (error) {
console.log(error);

12
resources/views/welcome.blade.php
View File

@@ -92,19 +92,15 @@
<div class="row">
<vue-thermometer class="justify-content-center col-sm-3" :value="temperature" :min="tmin" :max="tmax"></vue-thermometer>
<div class="col-sm-9" id="values">
<vue-table-dynamic :params="params"></vue-table-dynamic>
<ul>
<li>Teplota: @{{temperature}} °C</li>
<li>Vlhkosť: @{{humidity}} %</li>
<li>Tlak: @{{pressure}} khPa</li>
<li>Napätie: @{{voltage}} V</li>
<li>Čas: @{{time}}</li>
</ul>
</div>
</div>
<dygraphs ref="dgt" :graph-data="series['temperature']" :graph-options="temp_options"></dygraphs>
<dygraphs ref="dgh" :graph-data="series['humidity']" :graph-options="hum_options"></dygraphs>
<dygraphs ref="dgp" :graph-data="series['pressure']" :graph-options="p_options"></dygraphs>
<dygraphs ref="dgt" :graph-data="series['temperature']" :graph-options="options['temperature']"></dygraphs>
<dygraphs ref="dgh" :graph-data="series['humidity']" :graph-options="options['humidity']"></dygraphs>
<dygraphs ref="dgp" :graph-data="series['pressure']" :graph-options="options['pressure']"></dygraphs>
</div>