From 9bc564dbf92284c2b0073b7df9ae3cae0535332b Mon Sep 17 00:00:00 2001 From: chfhtw Date: Mon, 27 Apr 2026 15:35:29 +0200 Subject: [PATCH] min size & delete loading id when adding widgets --- .../js/components/Dashboard/Admin/Presets.js | 34 ++++++++++++++++++ public/js/components/Dashboard/Dashboard.js | 36 +++++++++++++++++++ public/js/components/Dashboard/Section.js | 2 +- 3 files changed, 71 insertions(+), 1 deletion(-) diff --git a/public/js/components/Dashboard/Admin/Presets.js b/public/js/components/Dashboard/Admin/Presets.js index 117b5d8ba..042286ab7 100644 --- a/public/js/components/Dashboard/Admin/Presets.js +++ b/public/js/components/Dashboard/Admin/Presets.js @@ -23,6 +23,32 @@ export default { computed: { pickerWidgets() { return this.widgets.filter(widget => widget.allowed); + }, + sizeLimits() { + return Object.fromEntries(this.widgets.map(({ setup, widget_id: type }) => { + const result = {}; // work on a copy + if (setup.height === undefined) + result.height = { min: 1, max: undefined }; + else if (Number.isInteger(setup.height)) + result.height = { min: setup.height, max: setup.height }; + else + result.height = { + min: setup.height.min ?? 1, + max: setup.height.max + }; + + if (setup.width === undefined) + result.width = { min: 1, max: undefined }; + else if (Number.isInteger(setup.width)) + result.width = { min: setup.width, max: setup.width }; + else + result.width = { + min: setup.width.min ?? 1, + max: setup.width.max + }; + + return [type, result]; + })); } }, watch: { @@ -35,6 +61,12 @@ export default { widgetAdd(widget, section_name) { this.$refs.widgetpicker.getWidget().then(widget_id => { widget.widget = widget_id; + // NOTE(chris): min size + widget.place = Object.fromEntries(Object.entries(widget.place).map(([key, value]) => { + value.w = this.sizeLimits[widget_id].width.min; + value.h = this.sizeLimits[widget_id].height.min; + return [key, value]; + })); widget.id = 'loading_' + String((new Date()).valueOf()); delete widget.custom; widget.preset = 1; @@ -45,6 +77,8 @@ export default { section.widgets.push(loading); }); + delete widget.id; + const params = { dashboard: this.dashboard, funktion_kurzbz: section_name, diff --git a/public/js/components/Dashboard/Dashboard.js b/public/js/components/Dashboard/Dashboard.js index 428c2ebdc..bf45ad227 100644 --- a/public/js/components/Dashboard/Dashboard.js +++ b/public/js/components/Dashboard/Dashboard.js @@ -36,16 +36,52 @@ export default { timezone: this.timezone } }, + computed: { + sizeLimits() { + return Object.fromEntries(this.widgetsSetup.map(({ setup, widget_id: type }) => { + const result = {}; // work on a copy + if (setup.height === undefined) + result.height = { min: 1, max: undefined }; + else if (Number.isInteger(setup.height)) + result.height = { min: setup.height, max: setup.height }; + else + result.height = { + min: setup.height.min ?? 1, + max: setup.height.max + }; + + if (setup.width === undefined) + result.width = { min: 1, max: undefined }; + else if (Number.isInteger(setup.width)) + result.width = { min: setup.width, max: setup.width }; + else + result.width = { + min: setup.width.min ?? 1, + max: setup.width.max + }; + + return [type, result]; + })); + } + }, methods: { widgetAdd(widget) { this.$refs.widgetpicker .getWidget() .then(widget_id => { widget.widget = widget_id; + // NOTE(chris): min size + widget.place = Object.fromEntries(Object.entries(widget.place).map(([key, value]) => { + value.w = this.sizeLimits[widget_id].width.min; + value.h = this.sizeLimits[widget_id].height.min; + return [key, value]; + })); widget.id = 'loading_' + String((new Date()).valueOf()); let loading = { ...widget }; loading.loading = true; this.widgets.push(loading); + + delete widget.id; this.$api .call(ApiDashboardUser.addWidget(this.dashboard, widget)) diff --git a/public/js/components/Dashboard/Section.js b/public/js/components/Dashboard/Section.js index 04e8fe9f7..e8c56fd4e 100644 --- a/public/js/components/Dashboard/Section.js +++ b/public/js/components/Dashboard/Section.js @@ -240,7 +240,7 @@ export default {