Skip to content

Commit 164d5e2

Browse files
mp-semp-se
committed
Adding beer status for active taps
1 parent 1308456 commit 164d5e2

File tree

7 files changed

+191
-92
lines changed

7 files changed

+191
-92
lines changed

‎src/components/BsProgress.vue

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<template>
2+
<div class="progress" style="height: 20px">
3+
<div class="progress-bar" role="progressbar" :style="progressStyle"></div>
4+
</div>
5+
</template>
6+
7+
<script setup>
8+
/**
9+
* 2024-05-28 Bootstrap VueJS wrapper, Magnus Persson
10+
*/
11+
12+
import { computed } from 'vue'
13+
/**
14+
* Purpose: Show a progress bar
15+
*/
16+
17+
/**
18+
* Ref that contains the value of the progress bar (0-100) (required).
19+
*/
20+
const progress = defineModel('progress')
21+
22+
const progressStyle = computed(() => {
23+
return 'width: ' + progress.value + '%'
24+
})
25+
</script>

‎src/main.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,14 @@ import BsInputBase from '@/components/BsInputBase.vue'
1515
import BsInputText from '@/components/BsInputText.vue'
1616
import BsInputRadio from '@/components/BsInputRadio.vue'
1717
import BsModalConfirm from '@/components/BsModalConfirm.vue'
18+
import BsProgress from '@/components/BsProgress.vue'
1819

1920
app.component('BsMessage', BsMessage)
2021
app.component('BsInputBase', BsInputBase)
2122
app.component('BsInputText', BsInputText)
2223
app.component('BsInputRadio', BsInputRadio)
2324
app.component('BsModalConfirm', BsModalConfirm)
25+
app.component('BsProgress', BsProgress)
2426

2527
import IconHome from './components/IconHome.vue'
2628
import IconTools from './components/IconTools.vue'

‎src/modules/brewfatherStore.js

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,10 @@ export class BrewfatherBatch {
1313
this.ibu = ibu === undefined ? 0 : ibu
1414
this.brewfatherId = brewfatherId === undefined ? '' : brewfatherId
1515
this.description = description === undefined ? '' : description
16+
17+
this.glasses = 0
18+
this.beerVolume = 0
19+
this.kegVolume = 0
1620
}
1721

1822
static fromJson(d) {
@@ -56,6 +60,15 @@ export class BrewfatherBatch {
5660
get description() {
5761
return this._description
5862
}
63+
get glasses() {
64+
return this._glasses
65+
}
66+
get beerVolume() {
67+
return this._beerVolume
68+
}
69+
get kegVolume() {
70+
return this._kegVolume
71+
}
5972

6073
set brewfatherId(brewfatherId) {
6174
this._brewfatherId = brewfatherId
@@ -84,6 +97,15 @@ export class BrewfatherBatch {
8497
set description(description) {
8598
this._description = description
8699
}
100+
set glasses(glasses) {
101+
this._glasses = glasses
102+
}
103+
set beerVolume(beerVolume) {
104+
this._beerVolume = beerVolume
105+
}
106+
set kegVolume(kegVolume) {
107+
this._kegVolume = kegVolume
108+
}
87109
}
88110

89111
export const useBrewfatherStore = defineStore('brewfatherStore', {

‎src/modules/configStore.js

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,12 @@ export const useConfigStore = defineStore('config', {
1919
this.brewfather_apikey = localStorage.getItem('brewfather_apikey')
2020
this.brewfather_userkey = localStorage.getItem('brewfather_userkey')
2121

22-
if (this.dark_mode === undefined) this.dark_mode = false
23-
if (this.kegmon_url === undefined) this.kegmon_url = ''
24-
if (this.brewfather_apikey === undefined) this.brewfather_apikey = ''
25-
if (this.brewfather_userkey === undefined) this.brewfather_userkey = ''
22+
if (this.dark_mode === undefined || this.dark_mode === null) this.dark_mode = false
23+
if (this.kegmon_url === undefined || this.kegmon_url === null) this.kegmon_url = ''
24+
if (this.brewfather_apikey === undefined || this.brewfather_apikey === null)
25+
this.brewfather_apikey = ''
26+
if (this.brewfather_userkey === undefined || this.brewfather_userkey === null)
27+
this.brewfather_userkey = ''
2628
},
2729
save() {
2830
logDebug('configStore.save()')

‎src/views/BatchCardFragment.vue

Lines changed: 38 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,49 @@
11
<template>
2-
<div class="card">
3-
<div class="card-header">
4-
{{ batch.name }}
5-
</div>
6-
<div class="card-body">
7-
<div class="row">
8-
<div class="col col-sm-9">
9-
<div class="row">
10-
<div class="col">
11-
<p class="card-text">{{ batch.description }}</p>
12-
</div>
13-
</div>
14-
<div class="row">
15-
<div class="col col-sm-4">
16-
<p class="card-text">
17-
Date: {{ new Date(batch.brewDate).toISOString().substring(0, 10) }}
18-
</p>
19-
</div>
20-
<div class="col col-sm-8">
21-
<p class="card-text">Style: {{ batch.style }}</p>
22-
</div>
23-
</div>
24-
<div class="row">
25-
<div class="col col-sm-4">
26-
<p class="card-text">ABV: {{ batch.abv }}%</p>
27-
</div>
28-
<div class="col col-sm-4">
29-
<p class="card-text">EBC: {{ batch.ebc }}</p>
30-
</div>
31-
<div class="col col-sm-4">
32-
<p class="card-text">IBU: {{ batch.ibu }}</p>
33-
</div>
34-
</div>
35-
</div>
36-
<div class="col col-sm-3">
37-
<BsImageBeerColor :ebc="batch.ebc" width="100"></BsImageBeerColor>
38-
</div>
2+
<div class="card">
3+
<div class="card-header">
4+
{{ batch.name }}
5+
</div>
6+
<div class="card-body">
7+
<div class="row">
8+
<div class="col col-sm-9">
9+
<div class="row">
10+
<div class="col">
11+
<p class="card-text">{{ batch.description }}</p>
12+
</div>
13+
</div>
14+
<div class="row">
15+
<div class="col col-sm-4">
16+
<p class="card-text">
17+
Date: {{ new Date(batch.brewDate).toISOString().substring(0, 10) }}
18+
</p>
19+
</div>
20+
<div class="col col-sm-8">
21+
<p class="card-text">Style: {{ batch.style }}</p>
22+
</div>
23+
</div>
24+
<div class="row">
25+
<div class="col col-sm-4">
26+
<p class="card-text">ABV: {{ batch.abv }}%</p>
3927
</div>
28+
<div class="col col-sm-4">
29+
<p class="card-text">EBC: {{ batch.ebc }}</p>
30+
</div>
31+
<div class="col col-sm-4">
32+
<p class="card-text">IBU: {{ batch.ibu }}</p>
33+
</div>
34+
</div>
4035
</div>
36+
<div class="col col-sm-3">
37+
<BsImageBeerColor :ebc="batch.ebc" width="100"></BsImageBeerColor>
38+
</div>
39+
</div>
4140
</div>
42-
41+
</div>
4342
</template>
4443

4544
<script setup>
4645
defineOptions({
47-
inheritAttrs: false
46+
inheritAttrs: false
4847
})
4948
const batch = defineModel('batch')
5049
</script>

‎src/views/HomeView.vue

Lines changed: 59 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,15 @@
11
<template>
22
<div class="container">
3-
43
<div class="row">
54
<div class="col col-sm-6">
65
<div class="card border text-bg-light border-light h-100 gy-4">
7-
<KegmonCardFragment :batch="tap1" v-if="tap1 != null"></KegmonCardFragment>
6+
<KegmonCardFragment :batch="tap1" :progress="progress1" v-if="tap1 != null"></KegmonCardFragment>
87
</div>
98
</div>
109

1110
<div class="col col-sm-6">
1211
<div class="card border text-bg-light border-light h-100 gy-4">
13-
<KegmonCardFragment :batch="tap2" v-if="tap2 != null"></KegmonCardFragment>
12+
<KegmonCardFragment :batch="tap2" :progress="progress2" v-if="tap2 != null"></KegmonCardFragment>
1413
</div>
1514
</div>
1615
</div>
@@ -38,7 +37,7 @@
3837
<script setup>
3938
import { brewfatherStore, global, config } from '@/modules/pinia'
4039
import { logDebug, logError } from '@/modules/logger'
41-
import { onMounted, onBeforeUnmount, ref } from 'vue'
40+
import { onMounted, onBeforeUnmount, ref, computed } from 'vue'
4241
import BatchCardFragment from '@/views/BatchCardFragment.vue'
4342
import KegmonCardFragment from '@/views/KegmonCardFragment.vue'
4443
import { BrewfatherBatch } from '@/modules/brewfatherStore'
@@ -47,25 +46,48 @@ const polling = ref(null)
4746
const tap1 = ref(null)
4847
const tap2 = ref(null)
4948
49+
const progress1 = computed(() => {
50+
logDebug(tap1.value)
51+
if (tap1.value == null || tap1.value.kegVolume == 0) return 0
52+
return (tap1.value.beerVolume / tap1.value.kegVolume) * 100
53+
})
54+
55+
const progress2 = computed(() => {
56+
logDebug(tap2.value)
57+
if (tap2.value == null || tap2.value.kegVolume == 0) return 0
58+
return (tap2.value.beerVolume / tap2.value.kegVolume) * 100
59+
})
60+
5061
onBeforeUnmount(() => {
51-
if (polling.value != null)
52-
clearInterval(polling.value)
62+
if (polling.value != null) clearInterval(polling.value)
5363
})
5464
5565
function fetchStatus() {
66+
logDebug('HomeView.fetchStatus()')
67+
5668
global.clearMessages()
5769
70+
if (config.kegmon_url == '') return
71+
5872
fetch(config.kegmon_url + 'api/status', {
5973
method: 'GET',
6074
signal: AbortSignal.timeout(3000)
6175
})
6276
.then((res) => res.json())
6377
.then((json) => {
6478
logDebug('HomeView.fetchStatus()', json)
65-
//status.value = json
66-
67-
// TODO: Add status info on remaning volume
6879
80+
if (tap1.value != null) {
81+
tap1.value.glasses = json.glass1
82+
tap1.value.beerVolume = json.beer_volume1
83+
tap1.value.kegVolume = json.keg_volume1
84+
}
85+
86+
if (tap1.value != null) {
87+
tap2.value.glasses = json.glass2
88+
tap2.value.beerVolume = json.beer_volume2
89+
tap2.value.kegVolume = json.keg_volume2
90+
}
6991
})
7092
.catch((err) => {
7193
logError('HomeView.fetchStatus()', err)
@@ -77,8 +99,13 @@ onMounted(() => {
7799
logDebug('HomeView.onMounted()')
78100
polling.value = setInterval(fetchStatus, 5000)
79101
102+
if (config.kegmon_url == '') {
103+
global.messageError = 'No url to kegmon device is specified, go to settings.'
104+
return
105+
}
106+
80107
var base = btoa('kegmon:password')
81-
var token = ""
108+
var token = ''
82109
83110
fetch(config.kegmon_url + 'api/auth', {
84111
method: 'GET',
@@ -98,8 +125,28 @@ onMounted(() => {
98125
.then((json) => {
99126
logDebug('HomeView.onMounted()', json)
100127
101-
tap1.value = new BrewfatherBatch("", json.beer_name1, "", "", "", json.beer_abv1, json.beer_ebc1, json.beer_ibu1, "")
102-
tap2.value = new BrewfatherBatch("", json.beer_name2, "", "", "", json.beer_abv2, json.beer_ebc2, json.beer_ibu2, "")
128+
tap1.value = new BrewfatherBatch(
129+
'',
130+
json.beer_name1,
131+
'',
132+
'',
133+
'',
134+
json.beer_abv1,
135+
json.beer_ebc1,
136+
json.beer_ibu1,
137+
''
138+
)
139+
tap2.value = new BrewfatherBatch(
140+
'',
141+
json.beer_name2,
142+
'',
143+
'',
144+
'',
145+
json.beer_abv2,
146+
json.beer_ebc2,
147+
json.beer_ibu2,
148+
''
149+
)
103150
104151
global.disabled = false
105152
})
@@ -108,7 +155,6 @@ onMounted(() => {
108155
logError('HomeView.onMounted()', err)
109156
global.messageError = 'Failed to fetch configuration from Kegmon device'
110157
})
111-
112158
})
113159
.catch((err) => {
114160
logError('HomeView.importSettingsFromKegmon()', err)

0 commit comments

Comments
 (0)