@extends('layouts.app')
@section('title', $inventaire ? 'Modifier ' . $inventaire->numero : 'Nouvel inventaire')
@section('breadcrumb', $inventaire ? 'Stock / Inventaires / Modifier' : 'Stock / Nouvel inventaire')
@section('content')

@php
    $isEdit   = isset($inventaire) && $inventaire !== null;
    $action   = $isEdit ? route('stock.inventaires.update', $inventaire) : route('stock.inventaires.store');
    $initData = $isEdit
        ? $lignesJson->toJson()
        : $produits->map(fn($p) => ['produit_id' => $p->id, 'nom' => $p->nom, 'code' => $p->code_article, 'qte_theorique' => (float)$p->qte_stock, 'qte_reelle' => (float)$p->qte_stock])->toJson();
@endphp

<div class="page-header">
    <div>
        <h1 class="page-title"><i class="fas fa-clipboard-list" style="color:var(--primary)"></i> {{ $isEdit ? 'Modifier ' . $inventaire->numero : 'Nouvel inventaire' }}</h1>
        <p class="page-subtitle">{{ $produits->count() }} produits</p>
    </div>
    <a href="{{ $isEdit ? route('stock.inventaires.show', $inventaire) : route('stock.inventaires') }}" class="btn btn-secondary">
        <i class="fas fa-arrow-left"></i> Retour
    </a>
</div>

<form method="POST" action="{{ $action }}" x-data="{ lignes: {{ $initData }} }">
    @csrf
    @if($isEdit) @method('PUT') @endif

    @if($errors->any())
        <div class="alert alert-danger">
            @foreach($errors->all() as $e)<div>{{ $e }}</div>@endforeach
        </div>
    @endif

    <div class="card" style="margin-bottom:16px;">
        <div class="card-body">
            <div class="form-grid form-grid-3">
                <div class="form-group">
                    <label class="form-label">Date *</label>
                    <input type="date" name="date" class="form-control"
                           value="{{ $isEdit ? $inventaire->date->format('Y-m-d') : date('Y-m-d') }}" required>
                </div>
                <div class="form-group">
                    <label class="form-label">Emplacement</label>
                    <select name="emplacement_id" class="form-control">
                        <option value="">Tous</option>
                        @foreach($emplacements as $e)
                            <option value="{{ $e->id }}" {{ $isEdit && $inventaire->emplacement_id == $e->id ? 'selected' : '' }}>
                                {{ $e->label }}
                            </option>
                            @foreach($e->enfants as $se)
                                <option value="{{ $se->id }}" {{ $isEdit && $inventaire->emplacement_id == $se->id ? 'selected' : '' }}>
                                    &nbsp;&nbsp;↳ {{ $se->label }}
                                </option>
                            @endforeach
                        @endforeach
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">Famille</label>
                    <select name="famille_id" class="form-control">
                        <option value="">Toutes</option>
                        @foreach($familles as $f)
                            <option value="{{ $f->id }}" {{ $isEdit && $inventaire->famille_id == $f->id ? 'selected' : '' }}>
                                {{ $f->label }}
                            </option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>
    </div>

    <div class="card">
        <div class="card-header">
            <h3 class="card-title">Lignes d'inventaire ({{ $produits->count() }} produits)</h3>
        </div>
        <div class="table-wrap">
            <table class="table">
                <thead>
                    <tr>
                        <th>#</th>
                        <th>Code</th>
                        <th>Produit</th>
                        <th>Qté Théorique</th>
                        <th>Qté Réelle</th>
                        <th>Écart</th>
                    </tr>
                </thead>
                <tbody>
                <template x-for="(l, i) in lignes" :key="i">
                    <tr>
                        <td x-text="i + 1"></td>
                        <td>
                            <code x-text="l.code"></code>
                            <input type="hidden" :name="'lignes['+i+'][produit_id]'" :value="l.produit_id">
                        </td>
                        <td x-text="l.nom"></td>
                        <td>
                            <input type="number" :name="'lignes['+i+'][qte_theorique]'" x-model="l.qte_theorique"
                                   class="form-control form-control-sm" step="0.001" style="width:100px;" readonly>
                        </td>
                        <td>
                            <input type="number" :name="'lignes['+i+'][qte_reelle]'" x-model="l.qte_reelle"
                                   class="form-control form-control-sm" step="0.001" style="width:100px;">
                        </td>
                        <td>
                            <span :style="(parseFloat(l.qte_reelle||0) - parseFloat(l.qte_theorique||0)) < 0
                                    ? 'color:#ef4444;font-weight:600;'
                                    : ((parseFloat(l.qte_reelle||0) - parseFloat(l.qte_theorique||0)) > 0
                                        ? 'color:#10b981;font-weight:600;' : '')"
                                  x-text="(parseFloat(l.qte_reelle||0) - parseFloat(l.qte_theorique||0)).toFixed(3)">
                            </span>
                        </td>
                    </tr>
                </template>
                </tbody>
            </table>
        </div>
    </div>

    <div style="margin-top:20px; display:flex; gap:10px;">
        <button type="submit" class="btn btn-primary">
            <i class="fas fa-save"></i> {{ $isEdit ? 'Enregistrer les modifications' : 'Créer inventaire' }}
        </button>
        <a href="{{ $isEdit ? route('stock.inventaires.show', $inventaire) : route('stock.inventaires') }}" class="btn btn-secondary">
            Annuler
        </a>
    </div>
</form>

@endsection