<x-filament-panels::page>
    <x-logistics.error-banner :message="$errorMessage" />

    {{-- Toggle Lecture / Ecriture --}}
    <div class="flex gap-2">
        <x-filament::button wire:click="$set('mode', 'read')" :color="$mode === 'read' ? 'primary' : 'gray'" icon="heroicon-o-arrow-down-tray">
            Lecture
        </x-filament::button>
        <x-filament::button wire:click="$set('mode', 'write')" :color="$mode === 'write' ? 'primary' : 'gray'" icon="heroicon-o-arrow-up-tray">
            Ecriture
        </x-filament::button>
    </div>

    @if ($mode === 'read')
        {{-- getserialnumber --}}
        <x-logistics.card>
            <x-logistics.section-header title="getserialnumber" description="Numéro de série du dossier comptable" />
            <div class="p-6">
                <div class="flex items-center gap-3">
                    <x-filament::button wire:click="getSerialNumber" icon="heroicon-o-finger-print">
                        Obtenir le numéro de série
                    </x-filament::button>
                    <div wire:loading wire:target="getSerialNumber" class="flex items-center gap-2">
                        <x-filament::loading-indicator class="h-4 w-4 text-primary-500" />
                        <span class="text-sm text-gray-500">Chargement...</span>
                    </div>
                </div>

                <div wire:loading.remove wire:target="getSerialNumber" class="mt-4">
                    <x-logistics.json-block :data="$serialData" :searched="$hasSerial" />
                </div>
            </div>
        </x-logistics.card>

        {{-- codes_list --}}
        <x-logistics.card>
            <x-logistics.section-header title="codes_list" description="Données associées à un code interne (table incodes)" />
            <div class="p-6">
                <div class="flex items-end gap-4">
                    <div class="flex-1">
                        <x-logistics.form-field
                            wire:model="code"
                            label="Début de code (code)"
                            id="code"
                            placeholder="Ex: PAY"
                        />
                    </div>
                    <x-filament::button wire:click="searchCodes" icon="heroicon-o-magnifying-glass">
                        Rechercher
                    </x-filament::button>
                </div>

                <div wire:loading wire:target="searchCodes" class="mt-4 flex items-center gap-2">
                    <x-filament::loading-indicator class="h-4 w-4 text-primary-500" />
                    <span class="text-sm text-gray-500">Chargement...</span>
                </div>

                <div wire:loading.remove wire:target="searchCodes" class="mt-4">
                    <x-logistics.json-block :data="$codesData" :searched="$hasCodes" />
                </div>
            </div>
        </x-logistics.card>
    @else
        {{-- custom_geninv_updatestock --}}
        <x-logistics.card>
            <x-logistics.section-header title="custom_geninv_updatestock" description="Mise à jour de l'inventaire" />
            <div class="p-6">
                <div class="mb-4 rounded-lg bg-amber-50 p-3 text-sm text-amber-700 dark:bg-amber-400/10 dark:text-amber-400">
                    Endpoint non fonctionnel -- la valeur attendue de STKID et la signification de certains paramètres (TOCHECK, TOCHECKDETAIL, MODE) sont inconnues.
                </div>
                <div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
                    <x-logistics.form-field
                        wire:model="stkArtId"
                        label="Article (ARTID)"
                        id="stkArtId"
                        placeholder="Ex: ART001"
                    />
                    <x-logistics.form-field
                        wire:model="stkId"
                        label="Identifiant stock (STKID)"
                        id="stkId"
                        placeholder="Valeur inconnue"
                    />
                    <x-logistics.form-field
                        wire:model="stkQty"
                        label="Quantité (QTY)"
                        id="stkQty"
                        placeholder="Ex: 10"
                    />
                    <x-logistics.form-field
                        wire:model="stkToCheck"
                        label="TOCHECK (signification inconnue)"
                        id="stkToCheck"
                        placeholder="Prix ?"
                    />
                    <x-logistics.form-field
                        wire:model="stkToCheckDetail"
                        label="TOCHECKDETAIL (signification inconnue)"
                        id="stkToCheckDetail"
                        placeholder="Remarques ?"
                    />
                    <x-logistics.form-field
                        wire:model="stkMode"
                        label="MODE (signification inconnue)"
                        id="stkMode"
                        placeholder="Valeur inconnue"
                    />
                </div>

                <div class="mt-4 flex items-center gap-3">
                    <x-filament::button wire:click="updateStock" icon="heroicon-o-arrow-path" color="warning">
                        Mettre à jour le stock
                    </x-filament::button>
                    <div wire:loading wire:target="updateStock" class="flex items-center gap-2">
                        <x-filament::loading-indicator class="h-4 w-4 text-primary-500" />
                        <span class="text-sm text-gray-500">Envoi en cours...</span>
                    </div>
                </div>

                <div wire:loading.remove wire:target="updateStock" class="mt-4">
                    <x-logistics.json-block :data="$updateStockResult" :searched="$hasUpdatedStock" />
                </div>
            </div>
        </x-logistics.card>
    @endif
</x-filament-panels::page>
