116 lines
3.4 KiB
Vue
116 lines
3.4 KiB
Vue
<!-- components/Test.vue -->
|
|
<template>
|
|
<div>
|
|
<section class="hero is-primary">
|
|
<div class="hero-body">
|
|
<div class="container has-text-centered">
|
|
<b-alert
|
|
:show="dismissCountDown"
|
|
dismissible
|
|
variant="warning"
|
|
@dismissed="dismissCountDown=0"
|
|
@dismiss-count-down="countDownChanged"
|
|
>
|
|
This alert will dismiss after {{ dismissCountDown }} seconds...
|
|
</b-alert>
|
|
<b-button @click="showAlert" variant="info" class="m-1">
|
|
Show alert with count-down timer
|
|
</b-button>
|
|
<b-button @click="$parent.showErrorMessage('tolle error message')" variant="warning" class="m-1">
|
|
Show error message
|
|
</b-button>
|
|
<b-button @click="showTestMessageLonger" variant="danger" class="m-1">
|
|
Show test message longer
|
|
</b-button>
|
|
<h1>Toller Test</h1>
|
|
<span>{{ $socket.connected ? 'Connected' : 'Disconnected' }}</span>
|
|
<button v-if="$socket.connected" @click="disconnectWebsocket">Disconnect</button>
|
|
<button v-else="$socket.connected" @click="connectWebsocket">Connect</button>
|
|
<p>
|
|
<button v-if="$socket.connected" @click="sendWsMessage('Tolle Test Nachricht')">Send Message</button>
|
|
</p>
|
|
|
|
|
|
<router-link :to="{name: 'recorder', params: {recorder_id: 1}}">rec 1</router-link>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import {EventBus} from '@/utils';
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
email: '',
|
|
dismissSecs: 5,
|
|
dismissCountDown: 0,
|
|
|
|
};
|
|
},
|
|
methods: {
|
|
changeLocale(locale) {
|
|
this.$i18n.locale = locale;
|
|
// Vue.$moment.locale(locale);
|
|
},
|
|
sendWsMessage(msg) {
|
|
this.$socket.client.emit('my_event', msg);
|
|
},
|
|
connectWebsocket() {
|
|
this.$socket.client.connect();
|
|
},
|
|
disconnectWebsocket() {
|
|
this.$socket.client.disconnect();
|
|
},
|
|
countDownChanged(dismissCountDown) {
|
|
this.dismissCountDown = dismissCountDown;
|
|
},
|
|
showAlert() {
|
|
this.dismissCountDown = this.dismissSecs;
|
|
},
|
|
showTestMessageLonger(){
|
|
EventBus.$emit('normalMessage', {msg: 'message', time:100})
|
|
},
|
|
},
|
|
mounted() {
|
|
this.$socket.client.on('my_response', function(msg) {
|
|
});
|
|
this.$socket.client.on('server_event', function(msg) {
|
|
});
|
|
this.$socket.client.on('connect', function(msg) {
|
|
});
|
|
|
|
// this.$socket.$unsubscribe('even_name');
|
|
|
|
},
|
|
beforeDestroy() {
|
|
EventBus.$off('failedLoadingProfile');
|
|
},
|
|
computed: {
|
|
profile() {
|
|
return this.$store.state.profile;
|
|
},
|
|
access_token() {
|
|
return this.$store.state.access_token;
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.error-msg {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.lang-btn {
|
|
padding: 15px;
|
|
border: 2px solid green;
|
|
font-size: 18px;
|
|
margin: 15px;
|
|
}
|
|
</style>
|