<?php

use Livewire\Component;

use App\Models\Abandon;
use App\Models\ReportQuarter;
use App\Services\RepportService;
new class extends Component
{
    public $data = [];
    public $input = [];
    public $classes = [];
    public $school;
    public $cutting;

    public function mount() {
        $report = ReportQuarter::where('school_id', $this->school)->where('cutting_school_year_id', $this->cutting)->first();
        $dts = $report ? Abandon::where('report_quarter_id', $report->id)->orderBy('order')->get():[];
        $this->data = $dts;
    }

    public function myInput(RepportService $service) {
        $this->input = $this->data;
        $this->classes = $service->getClass($this->school, $this->cutting);
    }
};
?>

<div>
    <div class="card-header my-0 pb-0">
        <div class="d-flex justify-content-between">
            <h6>a - Les Cas d'Abandon</h6>
            <span>
                <button wire:click="myInput" class="btn btn-inverse btn-outline-inverse btn-sm py-1 mt-0" title="Edit Info" data-toggle="modal" data-target="#abdModal">
                <i class="fas fa-pen m-0"></i>
                </button>
            </span>
        </div>
    </div>
    <div class="card-body table-border-style mt-2">
        <div class="table-responsive">
            <table class="table table-bordered" style="width: 100%">
                <thead>
                    <tr>
                        <th class="text-center" style="width: 3%">N°</th>
                        <th class="text-center">Matricule</th>
                        <th class="text-center">Nom et Prénons</th>
                        <th class="text-center">Sexe</th>
                        <th class="text-center">Age</th>
                        <th class="text-center">Classe</th>
                        <th class="text-center">Motif</th>
                    </tr>
                </thead>
                <tbody>
                @php $i = 1; @endphp
                @forelse ($data as $item)
                    <tr>
                        <th class="text-center">{{ $i < 10 ? '0'.$i++:$i++ }}</th>
                        <td class="text-center">{{ $item->inscription->student->matricule }}</td>
                        <td>
                            {{ strtoupper($item->inscription->student->first_name).' '.ucwords($item->inscription->student->last_name) }}
                        </td>
                        <td class="text-center">{{ $item->inscription->student->sexe }}</td>
                        <td class="text-center">{{ $item->inscription->student->age.' ans' }}</td>
                        <td class="text-center">{{ $item->classe->libelle }}</td>
                        <td> {{ ucfirst($item->motif) }}</td>
                    </tr> 
                @empty
                    <tr>
                    <td colspan="7" class="text-center">Underdefined data</td>
                    </tr>
                @endforelse
                </tbody>
            </table>
        </div>
    </div>
    <!-- @Modal -->
    <div wire:ignore.self class="modal fade" id="abdModal" tabindex="-1" role="dialog">
        <div class="modal-dialog modal-lg modal-dialog-centered" role="document" style="max-width: 50%;">
            <div class="modal-content">
                <div class="modal-header bg-dark py-2">
                    <h4 class="modal-title">Cas d'Abandon</h4>
                    <strong style="font-size: 17px">
                        {{ sizeof($input) ? 'Edit':'Add' }}
                        <i class="fas fa-pencil-alt my-0"></i>
                    </strong>
                </div>
                <form action="{{ route('chapter_3.abdon') }}" method="post">
                    @csrf
                    <div class="modal-body">
                        <button type="button" class="btn mb-1 p-0 btnAbdn" style="width: 25px; float: right; border: 1px solid grey">+</button>
                        <table class="table table-bordered mt-" id="myTableAbdn" style="width: 100%">
                        <tbody>
                            @php $i = 1; @endphp
                            @forelse ($input as $item)
                            <tr>
                                <td style="width: 100%">
                                    <div class="row">
                                        <div class="col-sm-6">
                                            <label class="col-form-label" for="class_{{ $i }}">Classe<span class="text-danger">*</span> :</label>
                                            <select name="tab1[]" id="class_{{ $i }}" class="form-control getClass" data-id="{{ $i }}" data-lib="a_abd">
                                                <option value="">Select ...</option>
                                                @foreach ($classes as $classe)
                                                <option value="{{ $classe->id }}" {{ $classe->id == $item->classe_id  ? 'selected':null}}>{{ ucfirst($classe->libelle) }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="col-sm-6">
                                            <label class="col-form-label" for="std_abd_{{ $i }}">Elève<span class="text-danger">*</span> :</label>
                                            <select name="tab2[]" id="std_abd_{{ $i }}" class="form-control">
                                                <option class="{{ 'opt_abd_'.$i }}" value="{{ $item->inscription_id }}">
                                                    {{ strtoupper($item->inscription->student->first_name).' '.ucwords($item->inscription->student->last_name) }}
                                                </option>
                                            </select>
                                        </div>
                                        <div class="col-sm-12 mt-2">
                                            <label class="col-form-label" for="motif_{{ $i }}">Motif<span class="text-danger">*</span> :</label>
                                            <textarea name="tab3[]" id="motif_{{ $i }}" rows="3" cols="5" class="form-control" placeholder="Entrez le motif ici ..." style="resize: none;">{{ $item->motif }}</textarea>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            @php $i++ @endphp
                            @empty
                            <tr>
                                <td style="width: 100%">
                                    <div class="row">
                                        <div class="col-sm-6">
                                            <label class="col-form-label" for="class_1">Classe<span class="text-danger">*</span> :</label>
                                            <select name="tab1[]" id="class_1" class="form-control getClass" data-id="1" data-lib="a_abd">
                                                <option value="">Select ...</option>
                                                @foreach ($classes as $classe)
                                                <option value="{{ $classe->id }}">{{ ucfirst($classe->libelle) }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="col-sm-6">
                                            <label class="col-form-label" for="std_abd_1">Elève<span class="text-danger">*</span> :</label>
                                            <select name="tab2[]" id="std_abd_1" class="form-control">
                                                <option value="">Select ...</option>
                                            </select>
                                        </div>
                                        <div class="col-sm-12 mt-2">
                                            <label class="col-form-label" for="motif_1">Motif<span class="text-danger">*</span> :</label>
                                            <textarea name="tab3[]" id="motif_1" rows="3" cols="5" class="form-control" placeholder="Entrez le motif ici ..." style="resize: none;"></textarea>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                            @endforelse
                        </tbody>
                        </table>
                    </div>
                    <div class="modal-footer">
                        <input type="hidden" name="school" value="{{ $school }}">
                        <input type="hidden" name="cutting" value="{{ $cutting }}">
                        <button class="btn btn-inverse btn-outline-inverse btn-sm py-1 mx-2" data-dismiss="modal">Fermer</button>
                        <button class="btn btn-inverse btn-outline-inverse btn-sm py-1 mx-2">Valider</button>
                    </div>
                    </form>
            </div>
        </div>
    </div>
</div>