feat(TournamentGroupsTab, TournamentTab): improve input normalization and event handling
All checks were successful
Deploy tt-tagebuch / deploy (push) Successful in 42s

- Enhanced input fields in TournamentGroupsTab to utilize a normalization function for numeric inputs, allowing for empty values and enforcing minimum constraints.
- Added blur event handlers to trigger updates on input loss of focus, improving user experience.
- Updated TournamentTab to remove redundant modus change handling on advancingPerGroup update, streamlining the event flow.
This commit is contained in:
Torsten Schulz (local)
2026-04-29 09:29:54 +02:00
parent cb7a027462
commit 715980d49c
2 changed files with 30 additions and 7 deletions

View File

@@ -20,11 +20,25 @@
<div class="groups-settings">
<label>
{{ $t('tournaments.advancersPerGroup') }}:
<input type="number" :value="advancingPerGroup" @input="$emit('update:advancingPerGroup', parseInt($event.target.value))" min="1" @change="$emit('modus-change')" />
<input
type="number"
:value="advancingPerGroup"
min="1"
@input="$emit('update:advancingPerGroup', normalizeNumberInput($event.target.value, { min: 1, allowEmpty: true }))"
@keydown.enter.prevent="$event.target.blur()"
@blur="onAdvancingPerGroupBlur($event.target.value)"
/>
</label>
<label>
{{ $t('tournaments.maxGroupSize') }}:
<input type="number" :value="maxGroupSize" @input="$emit('update:maxGroupSize', parseInt($event.target.value))" min="1" />
<input
type="number"
:value="maxGroupSize"
min="1"
@input="$emit('update:maxGroupSize', normalizeNumberInput($event.target.value, { min: 1, allowEmpty: true }))"
@keydown.enter.prevent="$event.target.blur()"
@blur="onMaxGroupSizeBlur($event.target.value)"
/>
</label>
</div>
@@ -43,7 +57,7 @@
type="number"
:value="groupsPerClassInput"
@input="$emit('update:groupsPerClassInput', normalizeNumberInput($event.target.value, { min: 0, allowEmpty: true }))"
@keydown.enter.prevent="onGroupsPerClassBlur($event.target.value)"
@keydown.enter.prevent="$event.target.blur()"
min="0"
@blur="onGroupsPerClassBlur($event.target.value)"
class="class-group-input"
@@ -61,7 +75,7 @@
:value="numberOfGroups"
min="1"
@input="$emit('update:numberOfGroups', normalizeNumberInput($event.target.value, { min: 1, allowEmpty: true }))"
@keydown.enter.prevent="onNumberOfGroupsBlur($event.target.value)"
@keydown.enter.prevent="$event.target.blur()"
@blur="onNumberOfGroupsBlur($event.target.value)"
/>
</label>
@@ -220,11 +234,11 @@ export default {
required: true
},
advancingPerGroup: {
type: Number,
type: [Number, String],
required: true
},
maxGroupSize: {
type: Number,
type: [Number, String],
default: null
},
groupsPerClassInput: {
@@ -328,6 +342,15 @@ export default {
this.$emit('update:numberOfGroups', normalized);
this.$emit('group-count-change');
},
onAdvancingPerGroupBlur(rawValue) {
const normalized = this.normalizeNumberInput(rawValue, { min: 1, allowEmpty: false });
this.$emit('update:advancingPerGroup', normalized);
this.$emit('modus-change');
},
onMaxGroupSizeBlur(rawValue) {
const normalized = this.normalizeNumberInput(rawValue, { min: 1, allowEmpty: false });
this.$emit('update:maxGroupSize', normalized);
},
groupRankingsForGroup(group) {
const key = `${group.groupId}-${group.classId ?? 'null'}`;
return this.groupRankings[key] || [];

View File

@@ -206,7 +206,7 @@
:active-group-cells="activeGroupCells"
:matches="matches"
@update:selectedViewClass="selectedViewClass = $event"
@update:advancingPerGroup="advancingPerGroup = $event; onModusChange()"
@update:advancingPerGroup="advancingPerGroup = $event"
@update:maxGroupSize="maxGroupSize = $event"
@update:groupsPerClassInput="groupsPerClassInput = $event"
@update:numberOfGroups="numberOfGroups = $event"