working websocket communication for recorder states and added recorder.vue

This commit is contained in:
Tobias Kurze
2019-12-11 08:32:08 +01:00
parent 6b7b9f8f09
commit 770942542f
6 changed files with 215 additions and 10 deletions

View File

@@ -17,6 +17,13 @@
<font-awesome-icon icon="list"/>&nbsp;<font-awesome-icon icon="circle"/>
<strong>{{$t('Recorders')}}</strong>&nbsp;{{$t('list')}}
</template>
<div class="mt-3">
<b-button-group>
<b-button variant="success" @click="filterShowAllRecorders()">{{$t('All recorders')}}</b-button>
<b-button variant="info" @click="filterOnlyShowOfflineRecorders()">{{$t('Offline recorders')}}</b-button>
<b-button variant="warning" @click="filterOnlyShowNonOfflineRecorders()">{{$t('Non offline recorders')}}</b-button>
</b-button-group>
</div>
<p>{{ $tc('recorders_defined', recorders.length, {num: recorders.length})}}:</p>
<b-card-group deck>
<b-card class="mb-2" style="max-width: 30rem; min-width:20rem;"
@@ -639,6 +646,8 @@
props: [],
data() {
return {
onlyShowOfflineRecorders: false,
onlyShowNonOfflineRecorders: false,
tabIndex: 0,
updateValues: {},
formEditField: {},
@@ -713,6 +722,18 @@
this.$parent.$data.showAlert = true;
this.$parent.$data.alertMessage = msg;
},
filterShowAllRecorders(){
this.onlyShowOfflineRecorders = false;
this.onlyShowNonOfflineRecorders = false;
},
filterOnlyShowOfflineRecorders(){
this.onlyShowOfflineRecorders = true;
this.onlyShowNonOfflineRecorders = false;
},
filterOnlyShowNonOfflineRecorders(){
this.onlyShowOfflineRecorders = false;
this.onlyShowNonOfflineRecorders = true;
},
},
mounted() {
this.$parent.$data.isLoading = true;
@@ -731,6 +752,16 @@
return this.$store.state.rooms;
},
recorders() {
if(this.onlyShowOfflineRecorders){
return this.$store.state.recorders.filter((item) => {
return item.offline;
});
}
else if(this.onlyShowNonOfflineRecorders){
return this.$store.state.recorders.filter((item) => {
return !item.offline;
});
}
return this.$store.state.recorders;
},
recorderModels() {