Aggregators default item

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

@@ -9,6 +9,19 @@ export default {
 		FormInput,
 		ReportAggregator,
 	},
+	provide() {
+		return {
+			defaultAggregatorIndex: Vue.computed({
+				get: () => this.defaultAggregatorIndex,
+				set: v => {
+					const curr = this.modelValue.find(agg => agg.default);
+					if (curr)
+						delete curr.default;
+					this.modelValue[v].default = true;
+				},
+			}),
+		};
+	},
 	props: {
 		modelValue: {
 			type: Object,
@@ -24,17 +37,9 @@ export default {
 		};
 	},
 	computed: {
-		aggregatorDefault: {
-			get() {
-				return this.modelValue.findIndex(agg => agg.default);
-			},
-			set(v) {
-				const curr = this.modelValue.find(agg => agg.default);
-				if (curr)
-					delete curr.default;
-				this.modelValue[v].default = true;
-			},
-		},
+		defaultAggregatorIndex() {
+			return this.modelValue.findIndex(agg => agg.default);
+		}
 	},
 	methods: {
 		addAggregator() {
@@ -45,6 +50,16 @@ export default {
 				evt.preventDefault();
 			}
 		},
+		getHeaderStyle(isDefault) {
+			if (!isDefault)
+				return undefined;
+			return {
+				'--bs-accordion-btn-bg': 'var(--bs-success-bg-subtle)',
+				'--bs-accordion-btn-color': 'var(--bs-success-text-emphasis)',
+				'--bs-accordion-active-bg': 'var(--bs-success)',
+				'--bs-accordion-active-color': '#fff',
+			};
+		},
 	},
 	created() {
 		this.myId = counter++;
@@ -62,7 +77,10 @@ export default {
 				:key="i"
 				class="accordion-item"
 			>
-				<h3 class="accordion-header">
+				<h3
+					class="accordion-header"
+					:style="getHeaderStyle(defaultAggregatorIndex == i)"
+				>
 					<button
 						type="button"
 						class="accordion-button collapsed"
@@ -73,22 +91,10 @@ export default {
 					>
 						<span v-if="agg.label">{{ agg.label }}</span>
 						<i v-else>{{ $p.t('ui/neu') }}</i>
-						<div class="flex-grow-1">
-							<form-input
-								type="radio"
-								name="aggregatordefault"
-								v-model="aggregatorDefault"
-								class="btn-check"
-								:label="$p.t('ui/default')"
-								:value="i"
-								label-class="btn"
-								container-class="text-end pe-4"
-							/>
-						</div>
 					</button>
 				</h3>
 				<div :id="'aggregator_' + myId + '_' + i" class="accordion-collapse collapse">
-					<report-aggregator v-model="agg" class="accordion-body" />
+					<report-aggregator v-model="agg" class="accordion-body" :index="i" />
 				</div>
 			</div>
 		</div>

public/js/components/Dashboard/WidgetAdmin/Edit/Report/Aggregators/Aggregator.js

@@ -5,11 +5,18 @@ export default {
 	components: {
 		FormInput,
 	},
+	inject: {
+		defaultAggregatorIndex: 'defaultAggregatorIndex',
+	},
 	props: {
 		modelValue: {
 			type: Object,
 			required: true
 		},
+		index: {
+			type: Number,
+			required: true
+		},
 	},
 	emits: [
 		"update:modelValue",
@@ -17,24 +24,35 @@ export default {
 	template: /*html*/ `
 	<div class="widgets-report-config-aggregators-aggregator">
 		<form-input
-			type="text"
 			v-model="modelValue.label"
+			type="text"
 			:label="$p.t('global/label')"
+			class="mb-3"
 		/>
 		<form-input
-			type="select"
 			v-model="modelValue.type"
+			type="select"
 			:label="$p.t('global/typ')"
+			class="mb-3"
 		>
 			<option value="sum">{{ $p.t('dashboard/widget_report_kpi_aggregator_type_sum') }}</option>
 			<option value="count">{{ $p.t('dashboard/widget_report_kpi_aggregator_type_count') }}</option>
 		</form-input>
 		<form-input
 			v-if="modelValue.type == 'sum'"
-			type="text"
 			v-model="modelValue.fields"
+			type="text"
 			:label="$p.t('dashboard/widget_report_kpi_aggregator_fields')"
 			:placeholder="$p.t('dashboard/widget_report_kpi_aggregator_fields_placeholder')"
+			class="mb-3"
+		/>
+		<form-input
+			v-model="defaultAggregatorIndex"
+			type="radio"
+			name="aggregatordefault"
+			container-class="form-switch"
+			:label="$p.t('ui/default')"
+			:value="index"
 		/>
 	</div>
 	`,

system/phrasesupdate.php

@@ -2054,6 +2054,26 @@ $phrases = array(
 			)
 		)
 	),
+	array(
+		'app' => 'core',
+		'category' => 'ui',
+		'phrase' => 'default',
+		'insertvon' => 'system',
+		'phrases' => array(
+			array(
+				'sprache' => 'German',
+				'text' => 'Standard',
+				'description' => '',
+				'insertvon' => 'system'
+			),
+			array(
+				'sprache' => 'English',
+				'text' => 'Default',
+				'description' => '',
+				'insertvon' => 'system'
+			)
+		)
+	),
 	array(
 		'app' => 'core',
 		'category' => 'ui',