Fix: v-model chain

public/js/components/Dashboard/WidgetAdmin/Edit/Report/Vars.js

@@ -18,36 +18,14 @@ export default {
 	emits: [
 		"update:modelValue",
 	],
-	watch: {
-		details() {
-			this.cleanupVars();
-		},
-	},
-	methods: {
-		cleanupVars() {
-			/*const allowedKeys = this.details.map(detail => detail.kurzbz);
-			Object.keys(this.modelValue).forEach(key => {
-				if (!allowedKeys.includes(key))
-					delete this.modelValue[key];
-			});
-			this.details.forEach(detail => {
-				if (!this.modelValue[detail.kurzbz])
-					this.modelValue[detail.kurzbz] = { type: 'fix' };
-			});
-			this.$emit('update:modelValue', this.modelValue);*/
-		},
-	},
-	created() {
-		this.cleanupVars();
-	},
 	template: /*html*/ `
 	<div class="widgets-report-config-vars">
 		<label v-if="details.length">{{ $p.t('dashboard/widget_report_vars') }}</label>
 		<template v-for="detail in details" :key="detail.kurzbz">
 			<report-var
-				v-model="modelValue[detail.kurzbz]"
+				:model-value="modelValue[detail.kurzbz]"
 				:detail="detail"
-				@update:model-value="cleanupVars"
+				@update:model-value="$emit('update:modelValue', { ...modelValue, [detail.kurzbz]: $event })"
 			/>
 		</template>
 	</div>

public/js/components/Dashboard/WidgetAdmin/Edit/Report/Vars/Var.js

@@ -34,9 +34,6 @@ export default {
 				type: this.detail.type,
 			};
 
-			if (attrs.type == 'text')
-				attrs.type = 'input';
-
 			if (this.detail.placeholder)
 				attrs.placeholder = this.detail.placeholder;
 
@@ -80,9 +77,9 @@ export default {
 			return this.calcComponents[this.extendedType[1]];
 		},
 		options() {
-			if (this.extendedType.length < 1)
+			if (this.extendedType.length < 1 && !this.noType)
 				return [];
-			if (this.extendedType[0] == 'calc')
+			if (this.extendedType[0] == 'calc' && !this.noType)
 				return this.calcOptions;
 			if (this.detail.type == 'select')
 				return this.detail.options;
@@ -94,7 +91,7 @@ export default {
 			return 'Report' + capitalize(string);
 		},
 		setType(type) {
-			if (type == 'user') {
+			if (type == 'user' || type.substr(0, 5) == 'calc:') {
 				this.$emit('update:modelValue', { type, detail: this.detail });
 			} else {
 				this.$emit('update:modelValue', { type });
@@ -102,7 +99,7 @@ export default {
 		},
 		setSubType(subtype) {
 			let type = 'calc:' + subtype;
-			this.$emit('update:modelValue', { type });
+			this.$emit('update:modelValue', { type, detail: this.detail });
 		},
 		setValue(value) {
 			this.modelValue.value = value;
@@ -140,7 +137,7 @@ export default {
 		</form-input>
 		<form-input
 			v-if="modelValue.type == 'fix' || noType"
-			v-model="saveValue"
+			:modelValue="saveValue"
 			v-bind="fixedInputAttrs"
 			input-group
 			@update:modelValue="setValue"

public/js/components/DashboardWidget/Report/Config/Kpi.js

@@ -30,26 +30,46 @@ export default {
 				this.config.aggregator = v;
 			}
 		},
+		customVars() {
+			const uservars = this.config.uservars || {};
+
+			return Object.entries(this.config.vars).reduce((res, [key, variable]) => {
+				if (variable.type == 'user') {
+					res[key] = {
+						modelValue: uservars[key] || {},
+						detail: variable.detail,
+					};
+				} else if (this.sharedData[key]) {
+					res[key] = {
+						modelValue: uservars[key] || {},
+						detail: this.sharedData[key],
+					};
+				}
+				return res;
+			}, {});
+		},
 		hasCustomVars() {
-			return Object.values(this.config.vars).some(v => v.type == 'user');
+			return Object.keys(this.customVars).length;
+		},
+	},
+	methods: {
+		updateUserVar(key, { value }) {
+			if (!this.config.uservars)
+				this.config.uservars = {};
+			this.config.uservars[key] = { value };
 		},
 	},
 	template: /*html*/ `
 	<div class="widgets-report-kpi-config-kpi">
 		<template v-if="hasCustomVars">
 			// TODO(chris): label: vars
-			<template
-				v-for="(variable, key) in config.vars"
+			<vars-var
+				v-for="(variable, key) in customVars"
 				:key="key"
-			>
-				<vars-var
-					v-if="variable.type == 'user'"
-					v-model="variable"
-					:detail="variable.detail"
-					no-type
-				/>
-				// TODO(chris): type == 'calc'?
-			</template>
+				v-bind="variable"
+				no-type
+				@update:model-value="updateUserVar(key, $event)"
+			/>
 		</template>
 		<form-input
 			v-if="config.aggregators.length > 1"