CreatBotMainsail/src/components/panels/KlippyStatePanel.vue
Stefan Dej f12d0dd89b fix: dont polling printer.info in klipper state disconnected
Signed-off-by: Stefan Dej <meteyou@gmail.com>
2021-11-09 21:49:49 +01:00

73 lines
2.6 KiB
Vue

<template>
<panel
v-if="klipperState !== 'ready' && socketIsConnected"
icon="mdi-alert-circle"
:title="$t('Panels.KlippyStatePanel.KlippyState')+': '+klipperState"
card-class="klippy-state-panel"
>
<template v-if="klippyIsConnected">
<v-card-text class="py-1">
<pre style="white-space: pre-wrap;">{{ klippy_message }}</pre>
</v-card-text>
<v-divider class="mt-2"></v-divider>
<v-card-actions class="py-4 px-5">
<v-btn small @click="restart" color="error" class=""><v-icon class="mr-sm-2">mdi-restart</v-icon>{{ $t('Panels.KlippyStatePanel.Restart') }}</v-btn>
<v-btn small @click="firmwareRestart" class="ml-4" color="error"><v-icon class="mr-sm-2">mdi-restart</v-icon>{{ $t('Panels.KlippyStatePanel.FirmwareRestart') }}</v-btn>
</v-card-actions>
</template>
<template v-else>
<v-card-text class="pt-5 pb-1">
<connection-status :moonraker="true" :klipper="false"></connection-status>
<p class="mt-2 mb-0 text-center">{{ $t('Panels.KlippyStatePanel.MoonrakerCannotConnect') }}</p>
<v-divider class="my-2"></v-divider>
<p class="mt-2">{{ $t('Panels.KlippyStatePanel.KlipperCheck') }}</p>
</v-card-text>
</template>
</panel>
</template>
<script lang="ts">
import Component from 'vue-class-component'
import {Mixins, Watch} from 'vue-property-decorator'
import BaseMixin from '../mixins/base'
import ConnectionStatus from '../ui/ConnectionStatus.vue'
import Panel from '@/components/ui/Panel.vue'
@Component({
components: {Panel, ConnectionStatus}
})
export default class KlippyStatePanel extends Mixins(BaseMixin) {
private timer: number | null = null
get klippy_message() {
return this.$store.state.server.klippy_message ?? ''
}
restart() {
this.$socket.emit('printer.restart', { }, { loading: 'restart' })
}
firmwareRestart() {
this.$socket.emit('printer.firmware_restart', { }, { loading: 'firmwareRestart' })
}
requestKlippyState() {
this.$socket.emit('printer.info', {}, { action: 'printer/getInfo' })
}
@Watch('klipperState')
klipperStateChanged(newVal: string) {
if (['ready', 'disconnected'].includes(newVal)) {
if (this.timer) {
clearInterval(this.timer)
this.timer = null
}
} else if (this.timer === null) {
this.timer = setInterval(() => {
this.requestKlippyState()
}, 2000)
}
}
}
</script>