<template>
    <div class="tab-content" key="config-tab">
        <div class="tournament-info">
            <label>
                {{ $t('tournaments.name') }}:
                <input type="text" :value="tournamentName" @input="$emit('update:tournamentName', $event.target.value)" />
            </label>
            <label>
                {{ $t('tournaments.date') }}:
                <input type="date" :value="tournamentDate" @change="$emit('update:tournamentDate', $event.target.value)" />
            </label>
            <label>
                {{ $t('tournaments.winningSets') }}:
                <input type="number" :value="winningSets" @input="$emit('update:winningSets', parseInt($event.target.value))" min="1" />
            </label>
                <label>
                    {{ $t('tournaments.numberOfTables') }}:
                    <input type="number" :value="numberOfTables" @input="$emit('update:numberOfTables', $event.target.value ? parseInt($event.target.value, 10) : null)" min="1" />
                </label>
                <button @click="$emit('generate-pdf')" class="btn-primary" style="margin-top: 1rem;">{{ $t('tournaments.exportPDF') }}</button>
                <!-- 'Freie Tische verteilen' removed from Konfiguration tab -->
        </div>
        <label class="checkbox-item">
            <input type="checkbox" :checked="isGroupTournament" @change="$emit('update:isGroupTournament', $event.target.checked)" />
            <span>{{ $t('tournaments.playInGroups') }}</span>
        </label>
        <TournamentClassList
            :tournament-classes="tournamentClasses"
            :show-classes="showClasses"
            :editing-class-id="editingClassId"
            :editing-class-name="editingClassName"
            :editing-class-is-doubles="editingClassIsDoubles"
            :editing-class-gender="editingClassGender"
            :editing-class-min-birth-year="editingClassMinBirthYear"
            :new-class-name="newClassName"
            :new-class-is-doubles="newClassIsDoubles"
            :new-class-gender="newClassGender"
            :new-class-min-birth-year="newClassMinBirthYear"
            @edit-class="$emit('edit-class', $event)"
            @save-class-edit="$emit('save-class-edit', $event)"
            @cancel-class-edit="$emit('cancel-class-edit')"
            @delete-class="$emit('delete-class', $event)"
            @add-class="(data) => $emit('add-class', data)"
            @add-class-error="$emit('add-class-error', $event)"
            @handle-class-input-blur="$emit('handle-class-input-blur', $event[0], $event[1])"
            @update:editingClassName="$emit('update:editingClassName', $event)"
            @update:editingClassIsDoubles="$emit('update:editingClassIsDoubles', $event)"
            @update:editingClassGender="$emit('update:editingClassGender', $event)"
            @update:editingClassMinBirthYear="$emit('update:editingClassMinBirthYear', $event)"
            @update:newClassName="$emit('update:newClassName', $event)"
            @update:newClassIsDoubles="$emit('update:newClassIsDoubles', $event)"
            @update:newClassGender="$emit('update:newClassGender', $event)"
            @update:newClassMinBirthYear="$emit('update:newClassMinBirthYear', $event)"
        />

        <div class="stage-config" style="margin-top: 1.5rem;">
            <h3>Zwischenrunde & Endrunde</h3>
            <div v-if="stageConfig.loading" style="opacity: 0.8;">
                Lade Zwischenrunden …
            </div>
            <div v-else>
                <p style="margin: 0.25rem 0 1rem; opacity: 0.8;">
                    Zwischenrunde ist optional. Wenn du sie aktivierst, gibt es danach immer eine Endrunde.
                    KO-Endrunde wird als <strong>ein einziges Feld</strong> erzeugt.
                </p>

                <div style="display: grid; gap: 0.75rem; max-width: 720px;">
                    <label class="checkbox-item" style="margin: 0.25rem 0;">
                        <input type="checkbox" v-model="stageConfig.useIntermediateStage" />
                        <span>Zwischenrunde verwenden</span>
                    </label>

                    <div v-if="stageConfig.useIntermediateStage" style="border: 1px solid #eee; border-radius: 6px; padding: 0.75rem;">
                        <strong>Zwischenrunde (Runde 2)</strong>
                    <label>
                        Runde 2 Modus:
                        <select v-model="stageConfig.stage2Type">
                            <option value="groups">Gruppen</option>
                            <option value="knockout">KO</option>
                        </select>
                    </label>

                    <label v-if="stageConfig.stage2Type === 'groups'">
                        Anzahl Gruppen in Runde 2 (pro Pool):
                        <input type="number" min="1" v-model.number="stageConfig.stage2GroupCount" />
                    </label>

                    <div class="pool-config" style="border: 1px solid #ddd; border-radius: 6px; padding: 0.75rem;">
                        <div style="display:flex; align-items:center; justify-content: space-between; gap: 1rem;">
                            <strong>Weiterkommen: Vorrunde → Zwischenrunde (1→2)</strong>
                            <button class="btn-secondary" @click="addPoolRule('12')" type="button">Pool-Regel hinzufügen</button>
                        </div>
                        <div v-if="stageConfig.pools12.length === 0" style="margin-top: 0.5rem; opacity: 0.8;">
                            Noch keine Regeln. Beispiel: Plätze 1 & 2 -> obere Runde-2-Gruppen.
                        </div>
                        <div v-for="(rule, idx) in stageConfig.pools12" :key="`12-${idx}`" style="display:grid; gap:0.5rem; margin-top:0.75rem; padding-top:0.75rem; border-top: 1px solid #eee;">
                            <label>
                                Plätze aus jeder Gruppe (z.B. 1,2):
                                <input type="text" v-model="rule.fromPlacesText" />
                            </label>

                            <div style="display:flex; gap: 0.75rem; flex-wrap: wrap; align-items: end;">
                                <label>
                                    Ziel:
                                    <select v-model="rule.targetType">
                                        <option value="groups">Gruppen</option>
                                        <option value="knockout">KO</option>
                                    </select>
                                </label>
                                <label v-if="rule.targetType === 'groups'">
                                    Ziel-Gruppenanzahl:
                                    <input type="number" min="1" v-model.number="rule.targetGroupCount" />
                                </label>
                                <button class="btn-danger" type="button" @click="removePoolRule(idx)">Entfernen</button>
                            </div>
                        </div>
                    </div>
                    </div>

                    <div style="border: 1px solid #eee; border-radius: 6px; padding: 0.75rem;">
                        <strong>Endrunde (Runde {{ stageConfig.useIntermediateStage ? 3 : 2 }})</strong>
                        <label style="margin-top: 0.5rem;">
                            Endrunde Modus:
                            <select v-model="stageConfig.finalStageType">
                                <option value="groups">Gruppen</option>
                                <option value="knockout">KO</option>
                            </select>
                        </label>
                        <label v-if="stageConfig.finalStageType === 'knockout'" style="margin-top: 0.5rem; display:block;">
                            <input
                                type="checkbox"
                                :checked="stageConfig.finalStageThirdPlace"
                                @change="onThirdPlaceToggle($event.target.checked)"
                                @click.stop
                            />
                            Platz 3 ausspielen
                        </label>
                        <label v-if="stageConfig.finalStageType === 'groups'">
                            Anzahl Gruppen in Endrunde:
                            <input type="number" min="1" v-model.number="stageConfig.finalStageGroupCount" />
                        </label>

                        <div class="pool-config" style="border: 1px solid #ddd; border-radius: 6px; padding: 0.75rem; margin-top: 0.75rem;">
                            <div style="display:flex; align-items:center; justify-content: space-between; gap: 1rem;">
                                <strong>Weiterkommen: {{ stageConfig.useIntermediateStage ? 'Zwischenrunde → Endrunde (2→3)' : 'Vorrunde → Endrunde (1→3)' }}</strong>
                                <button class="btn-secondary" @click="addPoolRule('final')" type="button">Pool-Regel hinzufügen</button>
                            </div>
                            <div v-if="finalPools.length === 0" style="margin-top: 0.5rem; opacity: 0.8;">
                                Beispiel: Plätze 1 & 2 -> Endrunde.
                            </div>
                            <div v-for="(rule, idx) in finalPools" :key="`final-${idx}`" style="display:grid; gap:0.5rem; margin-top:0.75rem; padding-top:0.75rem; border-top: 1px solid #eee;">
                                <label>
                                    Plätze aus jeder Gruppe (z.B. 1,2):
                                    <input type="text" v-model="rule.fromPlacesText" />
                                </label>
                                <div style="display:flex; gap: 0.75rem; flex-wrap: wrap; align-items: end;">
                                    <label>
                                        Ziel:
                                        <select v-model="rule.targetType" :disabled="stageConfig.finalStageType !== 'groups'">
                                            <option value="groups">Gruppen</option>
                                            <option value="knockout">KO</option>
                                        </select>
                                    </label>
                                    <label v-if="stageConfig.finalStageType === 'groups'">
                                        Ziel-Gruppenanzahl:
                                        <input type="number" min="1" v-model.number="rule.targetGroupCount" />
                                    </label>
                                    <button class="btn-danger" type="button" @click="removePoolRule(idx, 'final')">Entfernen</button>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div style="display:flex; gap: 0.75rem; flex-wrap: wrap;">
                        <button class="btn-primary" type="button" @click="onSaveClick">Runden speichern</button>
                        <button v-if="!stageConfig.useIntermediateStage" class="btn-secondary" type="button" @click="advanceStage(1, 3)">
                            Endrunde aus Vorrunde erstellen
                        </button>
                        <button v-else class="btn-secondary" type="button" @click="advanceStage(1, 2)">
                            Zwischenrunde aus Vorrunde erstellen
                        </button>
                        <button v-if="stageConfig.useIntermediateStage" class="btn-secondary" type="button" @click="advanceStage(2, 3)">
                            Endrunde aus Zwischenrunde erstellen
                        </button>
                    </div>
                    <div v-if="stageConfig.error" style="color: #b00020; white-space: pre-wrap;">
                        {{ stageConfig.error }}
                    </div>
                    <div v-if="stageConfig.success" style="color: #1b5e20;">
                        {{ stageConfig.success }}
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
import TournamentClassList from './TournamentClassList.vue';
import apiClient from '../../apiClient';

export default {
    name: 'TournamentConfigTab',
    components: {
        TournamentClassList
    },
    methods: {
        async onDistributeTables() {
            try {
                await apiClient.post('/tournament/matches/distribute', { clubId: this.clubId, tournamentId: this.tournamentId });
                this.stageConfig.success = this.$t('tournaments.tablesDistributed') || 'Tische wurden verteilt.';
            } catch (err) {
                this.stageConfig.error = err?.response?.data?.error || err.message || String(err);
            }
        },
    },
    props: {
        clubId: {
            type: [Number, String],
            required: true
        },
        tournamentId: {
            type: [Number, String],
            required: true
        },
        tournamentName: {
            type: String,
            required: true
        },
        tournamentDate: {
            type: String,
            required: true
        },
        winningSets: {
            type: Number,
            required: true
        },
        isGroupTournament: {
            type: Boolean,
            required: true
        },
        tournamentClasses: {
            type: Array,
            required: true
        },
        showClasses: {
            type: Boolean,
            default: false
        },
        editingClassId: {
            type: [Number, null],
            default: null
        },
        editingClassName: {
            type: String,
            default: ''
        },
        editingClassIsDoubles: {
            type: Boolean,
            default: false
        },
        editingClassGender: {
            type: [String, null],
            default: null
        },
        editingClassMinBirthYear: {
            type: [Number, null],
            default: null
        },
        newClassName: {
            type: String,
            default: ''
        },
        newClassIsDoubles: {
            type: Boolean,
            default: false
        },
        newClassGender: {
            type: [String, null],
            default: null
        },
        newClassMinBirthYear: {
            type: [Number, null],
            default: null
        }
        ,
        numberOfTables: {
            type: [Number, null],
            default: null
        }
    },
    data() {
        return {
            stageConfig: {
                loading: false,
                useIntermediateStage: true,
                stage2Type: 'groups',
                stage2GroupCount: 2,
                pools12: [],
                poolsFinal: [],
                finalStageType: 'knockout',
                finalStageThirdPlace: false,
                finalStageGroupCount: 1,
                error: null,
                success: null,
            },
        };
    },
    computed: {
        finalPools() {
            return this.stageConfig.poolsFinal;
        }
    },
    watch: {
        tournamentId: {
            immediate: true,
            handler() {
                this.loadStageConfig();
            }
        }
    },
    emits: [
        'update:tournamentName',
        'update:tournamentDate',
        'update:winningSets',
        'update:isGroupTournament',
        'generate-pdf',
        'edit-class',
        'save-class-edit',
        'cancel-class-edit',
        'delete-class',
        'add-class',
        'add-class-error',
        'handle-class-input-blur',
        'update:editingClassName',
        'update:editingClassIsDoubles',
        'update:editingClassGender',
        'update:editingClassMinBirthYear',
        'update:newClassName',
        'update:newClassIsDoubles',
        'update:newClassGender',
        'update:newClassMinBirthYear'
        , 'update:numberOfTables'
    ]
    ,
    methods: {
        onSaveClick() {
            this.saveStageConfig();
        },

        async onThirdPlaceToggle(checked) {
            // UI sofort aktualisieren
            this.stageConfig.finalStageThirdPlace = checked === true;
            this.stageConfig.error = null;
            this.stageConfig.success = null;

            if (!this.clubId || !this.tournamentId) {
                this.stageConfig.error = 'Kann nicht speichern: clubId oder tournamentId fehlt.';
                return;
            }

            // Unabhängig von Pool-Regeln speichern:
            // wir laden die aktuelle Stage-Konfiguration und patchen nur target.thirdPlace.
            try {
                const getRes = await apiClient.get('/tournament/stages', {
                    params: {
                        clubId: Number(this.clubId),
                        tournamentId: Number(this.tournamentId),
                    }
                });
                if (getRes.status >= 400) throw new Error(getRes.data?.error || 'Fehler beim Laden');

                if (!Array.isArray(getRes.data?.stages) || !Array.isArray(getRes.data?.advancements)) {
                    throw new Error('Fehlerhafte Antwort vom Server (stages/advancements fehlen).');
                }

                let stages = Array.isArray(getRes.data?.stages) ? getRes.data.stages : [];
                let advancements = Array.isArray(getRes.data?.advancements) ? getRes.data.advancements : [];

                // Wenn noch keine Konfiguration existiert, können wir das Flag nicht "isoliert" speichern.
                // Dann erzeugen wir eine minimale Stage+Advancement-Konfiguration (mit Default-Poolregel),
                // damit thirdPlace überhaupt persistiert werden kann.
                if (stages.length === 0 && advancements.length === 0) {
                    const built = this.buildPayload();
                    stages = built.stages;
                    advancements = built.advancements;

                    // Falls der Nutzer noch keine Pool-Regeln angelegt hat, legen wir eine Default-Regel an,
                    // damit der Backend-Validator nicht abbricht.
                    for (const adv of advancements) {
                        const pools = adv?.config?.pools;
                        if (!Array.isArray(pools) || pools.length === 0) {
                            adv.config = adv.config || {};
                            adv.config.pools = [{
                                fromPlaces: [1, 2],
                                target: { type: 'knockout', singleField: true, thirdPlace: checked === true },
                            }];
                        }
                    }
                }

                const patchedAdvancements = advancements.map(a => {
                    // Wenn wir gerade initial erzeugen (adv hat fromStageIndex/toStageIndex), patchen wir direkt.
                    if (a && a.fromStageIndex != null && a.toStageIndex != null) {
                        const isFinal = (Number(a.fromStageIndex) === 1 && Number(a.toStageIndex) === 3)
                            || (Number(a.fromStageIndex) === 2 && Number(a.toStageIndex) === 3);
                        if (!isFinal) return a;
                        const cfg = a?.config && typeof a.config === 'object' ? a.config : {};
                        const pools = Array.isArray(cfg.pools) ? cfg.pools : [];
                        return {
                            ...a,
                            config: {
                                ...cfg,
                                pools: pools.map(p => {
                                    const target = p?.target && typeof p.target === 'object' ? p.target : {};
                                    if (target.type === 'knockout') {
                                        return { ...p, target: { ...target, thirdPlace: checked === true } };
                                    }
                                    return p;
                                })
                            }
                        };
                    }

                    // Existing DB-shape: patch nur Final-Übergang (1->3 / 2->3) via stageId mapping
                    // Nur Final-Übergang patchen: (1->3) oder (2->3)
                    const stageById = new Map(stages.map(s => [Number(s.id), s]));
                    const fromIdx = Number(stageById.get(Number(a?.fromStageId))?.index);
                    const toIdx = Number(stageById.get(Number(a?.toStageId))?.index);
                    const isFinal = (fromIdx === 1 && toIdx === 3) || (fromIdx === 2 && toIdx === 3);
                    if (!isFinal) return a;

                    const cfg = a?.config && typeof a.config === 'object' ? a.config : {};
                    const pools = Array.isArray(cfg.pools) ? cfg.pools : [];
                    return {
                        ...a,
                        config: {
                            ...cfg,
                            pools: pools.map(p => {
                                const target = p?.target && typeof p.target === 'object' ? p.target : {};
                                if (target.type === 'knockout') {
                                    return { ...p, target: { ...target, thirdPlace: checked === true } };
                                }
                                return p;
                            })
                        }
                    };
                });

                const putRes = await apiClient.put('/tournament/stages', {
                    clubId: Number(this.clubId),
                    tournamentId: Number(this.tournamentId),
                    stages,
                    advancements: patchedAdvancements,
                });
                if (putRes.status >= 400) throw new Error(putRes.data?.error || 'Fehler beim Speichern');

                await this.loadStageConfig();
                this.stageConfig.success = 'Gespeichert.';
            } catch (e) {
                this.stageConfig.error = e?.message || String(e);
            }
        },
        async loadStageConfig() {
            if (!this.clubId || !this.tournamentId) return;
            this.stageConfig.loading = true;
            this.stageConfig.error = null;
            this.stageConfig.success = null;

            try {
                const res = await apiClient.get('/tournament/stages', {
                    params: {
                        clubId: Number(this.clubId),
                        tournamentId: Number(this.tournamentId),
                    }
                });
                if (res.status >= 400) throw new Error(res.data?.error || 'Fehler beim Laden der Zwischenrunden');

                const stages = Array.isArray(res.data?.stages) ? res.data.stages : [];
                const advancements = Array.isArray(res.data?.advancements) ? res.data.advancements : [];

                // Zwischenrunde optional: wenn Stage 2 fehlt, gehen wir von direkter Endrunde aus.
                const stage2 = stages.find(s => Number(s.index) === 2);
                this.stageConfig.useIntermediateStage = !!stage2;

                if (stage2) {
                    this.stageConfig.stage2Type = stage2.type || 'groups';
                    this.stageConfig.stage2GroupCount = stage2.numberOfGroups || 2;
                }

                const stage3 = stages.find(s => Number(s.index) === 3);
                if (stage3) {
                    this.stageConfig.finalStageType = stage3.type || 'knockout';
                    this.stageConfig.finalStageGroupCount = stage3.numberOfGroups || 1;
                } else {
                    // Fallback, wenn bisher nur 1->2 existierte
                    this.stageConfig.finalStageType = 'knockout';
                    this.stageConfig.finalStageGroupCount = 1;
                }

                const adv12 = advancements.find(a => Number(a?.fromStageId) && Number(a?.toStageId) && Number(stages.find(s => s.id === a.fromStageId)?.index) === 1 && Number(stages.find(s => s.id === a.toStageId)?.index) === 2) || null;
                const advFinal = advancements.find(a => {
                    const fromIdx = Number(stages.find(s => s.id === a.fromStageId)?.index);
                    const toIdx = Number(stages.find(s => s.id === a.toStageId)?.index);
                    return (fromIdx === 1 && toIdx === 3) || (fromIdx === 2 && toIdx === 3);
                }) || null;

                const pools12 = Array.isArray(adv12?.config?.pools) ? adv12.config.pools : [];
                this.stageConfig.pools12 = pools12.map(p => ({
                    fromPlacesText: Array.isArray(p.fromPlaces) ? p.fromPlaces.join(',') : '',
                    targetType: p?.target?.type || 'groups',
                    targetGroupCount: p?.target?.groupCount || this.stageConfig.stage2GroupCount || 2,
                }));

                const poolsFinal = Array.isArray(advFinal?.config?.pools) ? advFinal.config.pools : [];
                this.stageConfig.poolsFinal = poolsFinal.map(p => ({
                    fromPlacesText: Array.isArray(p.fromPlaces) ? p.fromPlaces.join(',') : '',
                    // final-stage Modus ist führend: wenn KO gewählt, setzen wir Ziel automatisch auf KO
                    targetType: (this.stageConfig.finalStageType === 'knockout') ? 'knockout' : (p?.target?.type || 'groups'),
                    targetGroupCount: p?.target?.groupCount || this.stageConfig.finalStageGroupCount || 1,
                }));

                // KO-Flag gilt für die gesamte Endrunde: true, sobald irgendeine Final-KO-Regel thirdPlace=true hat.
                this.stageConfig.finalStageThirdPlace = poolsFinal.some(p => p?.target?.type === 'knockout' && p?.target?.thirdPlace === true);
            } catch (e) {
                this.stageConfig.error = e?.message || String(e);
            } finally {
                this.stageConfig.loading = false;
            }
        },
        addPoolRule(which = '12') {
            const isFinal = which === 'final';
            const targetArray = isFinal ? this.stageConfig.poolsFinal : this.stageConfig.pools12;
            targetArray.push({
                fromPlacesText: '1,2',
                targetType: isFinal
                    ? (this.stageConfig.finalStageType === 'knockout' ? 'knockout' : 'groups')
                    : 'groups',
                targetGroupCount: isFinal
                    ? (this.stageConfig.finalStageGroupCount || 1)
                    : (this.stageConfig.stage2GroupCount || 2),
            });
        },
        removePoolRule(idx, which = '12') {
            const targetArray = (which === 'final') ? this.stageConfig.poolsFinal : this.stageConfig.pools12;
            targetArray.splice(idx, 1);
        },
    buildPoolsPayload(rules, defaultGroupCount, knockoutSingleField = false, knockoutThirdPlace = false) {
            return (rules || [])
                .map(r => {
                    const fromPlaces = String(r.fromPlacesText || '')
                        .split(',')
                        .map(x => Number(String(x).trim()))
                        .filter(n => Number.isFinite(n) && n > 0);
                    // Wenn Endrunde KO ist, erzwingen wir KO als Ziel, damit man KO nicht doppelt einstellen muss.
                    const forceKnockout = this.stageConfig.finalStageType === 'knockout';
                    return {
                        fromPlaces,
                        target: (forceKnockout || r.targetType === 'knockout')
                            ? { type: 'knockout', singleField: knockoutSingleField, thirdPlace: knockoutThirdPlace }
                            : { type: 'groups', groupCount: Math.max(1, Number(r.targetGroupCount || defaultGroupCount || 1)) }
                    };
                })
                .filter(p => p.fromPlaces.length > 0);
        },
        defaultPoolsForTarget(targetType, groupCount = 1, thirdPlace = false) {
            return [{
                fromPlaces: [1, 2],
                target: targetType === 'knockout'
                    ? { type: 'knockout', singleField: true, thirdPlace }
                    : { type: 'groups', groupCount: Math.max(1, Number(groupCount || 1)) }
            }];
        },
        buildPayload() {
            let pools12 = this.stageConfig.useIntermediateStage
                ? this.buildPoolsPayload(this.stageConfig.pools12, this.stageConfig.stage2GroupCount || 2, false)
                : [];
            if (this.stageConfig.useIntermediateStage && pools12.length === 0) {
                pools12 = this.defaultPoolsForTarget(this.stageConfig.stage2Type, this.stageConfig.stage2GroupCount || 2, false);
            }
            let poolsFinal = this.buildPoolsPayload(
                this.stageConfig.poolsFinal,
                this.stageConfig.finalStageGroupCount || 1,
                true,
                this.stageConfig.finalStageThirdPlace === true
            );
            if (poolsFinal.length === 0) {
                poolsFinal = this.defaultPoolsForTarget(
                    this.stageConfig.finalStageType,
                    this.stageConfig.finalStageGroupCount || 1,
                    this.stageConfig.finalStageThirdPlace === true
                );
            }

            const stages = [
                { index: 1, type: 'groups', name: 'Vorrunde' },
            ];
            const advancements = [];

            if (this.stageConfig.useIntermediateStage) {
                stages.push({
                    index: 2,
                    type: this.stageConfig.stage2Type,
                    name: 'Zwischenrunde',
                    numberOfGroups: this.stageConfig.stage2Type === 'groups'
                        ? Math.max(1, Number(this.stageConfig.stage2GroupCount || 1))
                        : null,
                });

                advancements.push({
                    fromStageIndex: 1,
                    toStageIndex: 2,
                    mode: 'pools',
                    config: { pools: pools12 },
                });

                stages.push({
                    index: 3,
                    type: this.stageConfig.finalStageType,
                    name: 'Endrunde',
                    numberOfGroups: this.stageConfig.finalStageType === 'groups'
                        ? Math.max(1, Number(this.stageConfig.finalStageGroupCount || 1))
                        : null,
                });

                advancements.push({
                    fromStageIndex: 2,
                    toStageIndex: 3,
                    mode: 'pools',
                    config: { pools: poolsFinal },
                });
            } else {
                stages.push({
                    index: 3,
                    type: this.stageConfig.finalStageType,
                    name: 'Endrunde',
                    numberOfGroups: this.stageConfig.finalStageType === 'groups'
                        ? Math.max(1, Number(this.stageConfig.finalStageGroupCount || 1))
                        : null,
                });

                advancements.push({
                    fromStageIndex: 1,
                    toStageIndex: 3,
                    mode: 'pools',
                    config: { pools: poolsFinal },
                });
            }

            return { stages, advancements };
        },
        async saveStageConfig() {
            this.stageConfig.error = null;
            this.stageConfig.success = null;
            try {
                const { stages, advancements } = this.buildPayload();

                const res = await apiClient.put('/tournament/stages', {
                    clubId: Number(this.clubId),
                    tournamentId: Number(this.tournamentId),
                    stages,
                    advancements,
                });
                if (res.status >= 400) throw new Error(res.data?.error || 'Fehler beim Speichern');

                await this.loadStageConfig();
                this.stageConfig.success = 'Gespeichert.';
            } catch (e) {
                this.stageConfig.error = e?.message || String(e);
            }
        },
        async advanceStage(fromStageIndex, toStageIndex) {
            this.stageConfig.error = null;
            this.stageConfig.success = null;
            try {
                // Lade aktuelle Stages, um passende IDs zu ermitteln
                const getRes = await apiClient.get('/tournament/stages', {
                    params: {
                        clubId: Number(this.clubId),
                        tournamentId: Number(this.tournamentId)
                    }
                });
                const stages = Array.isArray(getRes?.data?.stages) ? getRes.data.stages : [];
                const normalized = stages.map(s => ({
                    stageIndex: Number(s.stageIndex ?? s.index ?? s.id),
                    stageId: Number(s.id ?? s.stageId ?? s.stageIndex),
                    type: s.type || s.targetType || s.target
                }));
                const from = normalized.find(s => s.stageIndex === Number(fromStageIndex));
                const to = normalized.find(s => s.stageIndex === Number(toStageIndex));

                const payload = {
                    clubId: Number(this.clubId),
                    tournamentId: Number(this.tournamentId)
                };
                payload.fromStageIndex = Number(fromStageIndex);
                payload.toStageIndex = Number(toStageIndex);

                const res = await apiClient.post('/tournament/stages/advance', payload);
                if (res.status >= 400) throw new Error(res.data?.error || 'Fehler beim Erstellen der Runde');
                this.stageConfig.success = `Runde ${toStageIndex} wurde erstellt.`;
            } catch (e) {
                this.stageConfig.error = e?.message || String(e);
            }
        }
    }
};
</script>

