feature: add klipper warnings panel on the dashboard (#355)

* feature: add klipper warnings panel on the dashboard

klipper pr for warnings: KevinOConner/klipper#4659

Signed-off-by: Stefan Dej <meteyou@gmail.com>

* bugfix: display KlipperWarningsPanel.vue only when klipper is ready

Signed-off-by: Stefan Dej <meteyou@gmail.com>

* feature: add deprecated_value message to translations
feature: add link to mainsail docs for each entry

Signed-off-by: Stefan Dej <meteyou@gmail.com>

* bugfix: fix icon size in download log button

Signed-off-by: Stefan Dej <meteyou@gmail.com>
This commit is contained in:
Stefan Dej 2021-09-20 20:48:52 +02:00 committed by GitHub
parent 10a867227f
commit 6d5a31cc39
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 64 additions and 2 deletions

View File

@ -0,0 +1,54 @@
<template>
<v-card class="mb-6" v-if="klipperReadyForGui && warnings.length">
<v-toolbar flat dense color="orange darken-2">
<v-toolbar-title>
<span class="subheading">
<v-icon class="mdi mdi-alert-circle" left></v-icon>{{ $t("Panels.KlipperWarningsPanel.KlipperWarnings") }} ({{ warnings.length }})
</span>
</v-toolbar-title>
</v-toolbar>
<v-card-text :class="index > 0 ? 'py-0' : 'pt-3 pb-0'" v-for="(warning, index) in warnings" v-bind:key="warning">
<v-divider class="my-2" v-if="index"></v-divider>
<v-row>
<v-col>
<p class="orange--text mb-0" v-if="warning.type === 'deprecated_option'">{{ $t('Panels.KlipperWarningsPanel.DeprecatedOption', { section: warning.section, option: warning.option }) }}</p>
<p class="orange--text mb-0" v-else-if="warning.type === 'deprecated_value'">{{ $t('Panels.KlipperWarningsPanel.DeprecatedValue', { section: warning.section, option: warning.option, value: warning.value }) }}</p>
<p class="orange--text mb-0" v-else>{{ warning.message }}</p>
</v-col>
<v-col class="col-auto d-flex align-center">
<a :href="getDocsLink(warning)" target="_blank" class="text-decoration-none"><v-icon>mdi-information</v-icon></a>
</v-col>
</v-row>
</v-card-text>
<v-divider class="mb-2 mt-3"></v-divider>
<v-card-actions class="px-4 pt-2 pb-4 text-center text-lg-left">
<v-btn small :href="apiUrl+'/server/files/klipper.log'" target="_blank" color="primary" class=""><v-icon class="mr-2" small>mdi-download</v-icon>{{ $t("Panels.KlipperWarningsPanel.DownloadLog") }}</v-btn>
</v-card-actions>
</v-card>
</template>
<script lang="ts">
import Component from 'vue-class-component'
import BaseMixin from '../mixins/base'
import {Mixins} from 'vue-property-decorator'
import {caseInsensitiveSort} from '@/plugins/helpers'
@Component
export default class KlipperWarningsPanelPanel extends Mixins(BaseMixin) {
get warnings() {
let warnings = this.$store.state.printer.configfile?.warnings ?? []
return caseInsensitiveSort(warnings, 'option')
}
getDocsLink(warning: { type: string, option: string, value: string }) {
let url = 'https://docs.mainsail.xyz/faq/' + warning.type
if (warning.type === 'deprecated_option') url += '#' + warning.option
else if (warning.type === 'deprecated_value') url += '#' + warning.value
return url
}
}
</script>

View File

@ -25,7 +25,7 @@
</v-card-text>
<v-divider class="mb-2 mt-3"></v-divider>
<v-card-actions class="px-4 pt-2 pb-4 text-center text-lg-left">
<v-btn small :href="apiUrl+'/server/files/moonraker.log'" target="_blank" color="primary" class=""><v-icon class="mr-2">mdi-download</v-icon>{{ $t("Panels.MoonrakerStatePanel.DownloadLog") }}</v-btn>
<v-btn small :href="apiUrl+'/server/files/moonraker.log'" target="_blank" color="primary" class=""><v-icon class="mr-2" small>mdi-download</v-icon>{{ $t("Panels.MoonrakerStatePanel.DownloadLog") }}</v-btn>
</v-card-actions>
</v-card>
</template>

View File

@ -9,6 +9,7 @@
<min-settings-panel></min-settings-panel>
<moonraker-state-panel></moonraker-state-panel>
<klippy-state-panel></klippy-state-panel>
<klipper-warnings-panel></klipper-warnings-panel>
<v-card v-if="klipperState === 'ready'" class="mb-6">
<v-toolbar flat dense>
<v-toolbar-title>
@ -277,9 +278,10 @@ import VueLoadImage from 'vue-load-image'
import MinSettingsPanel from '@/components/panels/MinSettingsPanel'
import MoonrakerStatePanel from '@/components/panels/MoonrakerStatePanel'
import KlippyStatePanel from '@/components/panels/KlippyStatePanel'
import KlipperWarningsPanel from '@/components/panels/KlipperWarningsPanel'
@Component({
components: {KlippyStatePanel, MoonrakerStatePanel, MinSettingsPanel},
components: {KlipperWarningsPanel, KlippyStatePanel, MoonrakerStatePanel, MinSettingsPanel},
VueLoadImage
})
export default class StatusPanel extends Mixins(BaseMixin) {

View File

@ -266,6 +266,12 @@
"Restart": "Restart",
"FirmwareRestart": "Firmware Restart"
},
"KlipperWarningsPanel": {
"KlipperWarnings": "Klipper Warnings",
"DownloadLog": "download log",
"DeprecatedOption": "Option '{option}' in section '{section}' is deprecated.",
"DeprecatedValue": "Value '{value}' in option '{option}' in section '{section}' is deprecated."
},
"MiniconsolePanel": {
"Headline": "Console",
"SetupConsole": "Setup Console",