From f82ec215be935a2cde428e93c15134b1dc3913d4 Mon Sep 17 00:00:00 2001 From: Stefan Dej Date: Sun, 24 Nov 2024 20:22:00 +0100 Subject: [PATCH] feat(Dashboard): add option to change length and filter files (#2051) Co-authored-by: rackrick <45207681+rackrick@users.noreply.github.com> --- src/components/panels/Status/Gcodefiles.vue | 27 ++++++++- src/components/panels/StatusPanel.vue | 11 +++- .../settings/SettingsUiSettingsTab.vue | 59 +++++++++++++++++++ src/locales/en.json | 8 +++ src/store/gui/index.ts | 2 + src/store/gui/types.ts | 4 ++ 6 files changed, 107 insertions(+), 4 deletions(-) diff --git a/src/components/panels/Status/Gcodefiles.vue b/src/components/panels/Status/Gcodefiles.vue index f8d5488c0..493a2d6f7 100644 --- a/src/components/panels/Status/Gcodefiles.vue +++ b/src/components/panels/Status/Gcodefiles.vue @@ -38,14 +38,37 @@ export default class StatusPanelGcodefiles extends Mixins(BaseMixin, ControlMixi filesGcodeCard: Vue } + get filesLimit() { + return this.$store.state.gui.uiSettings.dashboardFilesLimit ?? 5 + } + + get filesFilter() { + return this.$store.state.gui.uiSettings.dashboardFilesFilter ?? [] + } + get gcodeFiles() { let gcodes = this.$store.getters['files/getAllGcodes'] ?? [] + + if (this.filesFilter.length > 0 && this.filesFilter.length < 3) { + gcodes = gcodes.filter((file: FileStateGcodefile) => { + if (this.filesFilter.includes('new') && file.last_status === null) return true + if (this.filesFilter.includes('completed') && file.last_status === 'completed') return true + if ( + this.filesFilter.includes('failed') && + file.last_status !== null && + file.last_status !== 'completed' + ) + return true + + return false + }) + } + gcodes = gcodes - .slice() .sort((a: FileStateGcodefile, b: FileStateGcodefile) => { return b.modified.getTime() - a.modified.getTime() }) - .slice(0, 5) + .slice(0, this.filesLimit) const requestItems = gcodes.filter( (file: FileStateGcodefile) => !file.metadataRequested && !file.metadataPulled diff --git a/src/components/panels/StatusPanel.vue b/src/components/panels/StatusPanel.vue index d0a3833bb..6d2ec516b 100644 --- a/src/components/panels/StatusPanel.vue +++ b/src/components/panels/StatusPanel.vue @@ -90,7 +90,7 @@ {{ $t('Panels.StatusPanel.Status') }} - {{ $t('Panels.StatusPanel.Files') }} + {{ $t('Panels.StatusPanel.Files') }} {{ $t('Panels.StatusPanel.Jobqueue') }} @@ -102,7 +102,7 @@ - + @@ -362,8 +362,15 @@ export default class StatusPanel extends Mixins(BaseMixin) { return this.layer_count !== null && (this.existsSetPauseAtLayer || this.existsSetPauseNextLayer) } + get displayFilesTab() { + const count = this.$store.state.gui.uiSettings.dashboardFilesLimit ?? 5 + + return count > 0 + } + mounted() { if (this.current_filename !== '') this.activeTab = 'status' + if (!this.displayFilesTab) this.activeTab = 'jobqueue' } @Watch('current_filename') diff --git a/src/components/settings/SettingsUiSettingsTab.vue b/src/components/settings/SettingsUiSettingsTab.vue index 14bb0f33e..0d420a506 100644 --- a/src/components/settings/SettingsUiSettingsTab.vue +++ b/src/components/settings/SettingsUiSettingsTab.vue @@ -282,6 +282,32 @@ :dynamic-slot-width="true"> + + + + + + + + @@ -615,6 +641,39 @@ export default class SettingsUiSettingsTab extends Mixins(BaseMixin, ThemeMixin) this.$store.dispatch('gui/saveSetting', { name: 'uiSettings.hideUpdateWarnings', value: newVal }) } + get dashboardFilesLimit() { + return this.$store.state.gui.uiSettings.dashboardFilesLimit ?? 5 + } + + set dashboardFilesLimit(newVal) { + this.$store.dispatch('gui/saveSetting', { name: 'uiSettings.dashboardFilesLimit', value: newVal }) + } + + get dashboardFilesFilter() { + return this.$store.state.gui.uiSettings.dashboardFilesFilter ?? [] + } + + set dashboardFilesFilter(newVal) { + this.$store.dispatch('gui/saveSetting', { name: 'uiSettings.dashboardFilesFilter', value: newVal }) + } + + get dashboardFilesFilters() { + return [ + { + text: this.$t('Settings.UiSettingsTab.DashboardFilesFilterNew'), + value: 'new', + }, + { + text: this.$t('Settings.UiSettingsTab.DashboardFilesFilterFailed'), + value: 'failed', + }, + { + text: this.$t('Settings.UiSettingsTab.DashboardFilesFilterCompleted'), + value: 'completed', + }, + ] + } + clearColorObject(color: any): string { if (typeof color === 'object' && 'hex' in color) color = color.hex if (color.length > 7) color = color.substr(0, 7) diff --git a/src/locales/en.json b/src/locales/en.json index 36b87a326..3af1b9df3 100644 --- a/src/locales/en.json +++ b/src/locales/en.json @@ -1229,6 +1229,14 @@ "ConfirmOnEmergencyStopDescription": "Show a confirmation dialog on Emergency Stop", "ConfirmOnPowerDeviceChange": "Require confirm on Device Power changes", "ConfirmOnPowerDeviceChangeDescription": "Show a confirmation dialog on Device Power changes", + "DashboardFilesFilter": "Dashboard Files Filter", + "DashboardFilesFilterCompleted": "Completed", + "DashboardFilesFilterDescription": "Filter the files in the Dashbord Status Panel by their last status.", + "DashboardFilesFilterFailed": "Failed", + "DashboardFilesFilterNew": "New", + "DashboardFilesLimit": "Dashboard Files Limit", + "DashboardFilesLimitDescription": "Select the maximum number of files to display on the dashboard Status Panel. (0 hides the files tab)", + "DashboardFilesLimitLabel": "{count} files", "DefaultNavigationState": "Navigation default state", "DefaultNavigationStateAlwaysClosed": "always closed", "DefaultNavigationStateAlwaysOpen": "always open", diff --git a/src/store/gui/index.ts b/src/store/gui/index.ts index b8aaa2903..a9ffed150 100644 --- a/src/store/gui/index.ts +++ b/src/store/gui/index.ts @@ -183,6 +183,8 @@ export const getDefaultState = (): GuiState => { tempchartHeight: 250, hideUpdateWarnings: false, printstatusThumbnailZoom: true, + dashboardFilesLimit: 5, + dashboardFilesFilter: ['new', 'failed', 'completed'], }, view: { blockFileUpload: false, diff --git a/src/store/gui/types.ts b/src/store/gui/types.ts index fb3589081..e7f871344 100644 --- a/src/store/gui/types.ts +++ b/src/store/gui/types.ts @@ -125,6 +125,8 @@ export interface GuiState { tempchartHeight: number hideUpdateWarnings: boolean printstatusThumbnailZoom: boolean + dashboardFilesLimit: number + dashboardFilesFilter: GuiStateUiSettingsDashboardFilesFilter[] } view: { blockFileUpload: boolean @@ -214,3 +216,5 @@ export interface GuiStateLayoutoption { name: string visible: boolean } + +export type GuiStateUiSettingsDashboardFilesFilter = 'new' | 'failed' | 'completed'