@extends('pages.production.layout')

@section('body')
    <div id="kt_content_container" class="container-xxl">
        @if($pending_production)
            <div class="row">
                <div class="col">
                    <form action="{{ route('production.update', ['production' => $production]) }}" method="POST">
                        @csrf
                        @method("PUT")
                        <!--begin::Input group-->
                        <div class="row">
                            <div class="col-6 col-md-4">
                                <select name="status"
                                        aria-label="Select a status"
                                        data-control="select2"
                                        data-placeholder="Choisir un status"
                                        data-allow-clear="true"
                                        data-kt-select2="true"
                                        class="form-select form-select-solid">
                                    <option value=""></option>
                                    @foreach(\App\Enums\ProductionEnum::get_statuses() as $status)
                                        <option value="{{ $status }}" @if($status === \App\Enums\ProductionEnum::STATUS_PENDING->value) disabled @endif>{{ \App\Services\ProductionService::humanize_status($status) }}</option>
                                    @endforeach
                                </select>
                            </div>
                            <div class="col-6 col-md-4">
                                <!--end::Input group-->
                                <button type="submit" class="btn btn-sm btn-success">Traiter la production</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        @endif
        <!--begin::Layout-->
        <div class="d-flex flex-column flex-xl-row">
            <!--begin::Sidebar-->
            <div class="flex-column flex-lg-row-auto w-100 w-xl-350px mb-10">
                <!--begin::Card-->
                <div class="card mb-5 mb-xl-8">
                    <!--begin::Card body-->
                    <div class="card-body pt-15">
                        <!--begin::Summary-->
                        <div class="d-flex flex-center flex-column mb-5">
                            <!--begin::Position-->
                            <h2 class="fw-bold mb-6">Production #{{ $production->id }}</h2>
                            <!--end::Position-->
                        </div>
                        <!--end::Summary-->
                        @if($pending_production)
                            <!--begin::Details toggle-->
                            <div class="d-flex flex-stack fs-4 py-3">
                                <div class="fw-bolder rotate collapsible" data-bs-toggle="collapse" href="#kt_customer_view_details" role="button" aria-expanded="false" aria-controls="kt_customer_view_details">Details
                                    <span class="ms-2 rotate-180">
														<!--begin::Svg Icon | path: icons/duotune/arrows/arr072.svg-->
														<span class="svg-icon svg-icon-3">
															<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
																<path d="M11.4343 12.7344L7.25 8.55005C6.83579 8.13583 6.16421 8.13584 5.75 8.55005C5.33579 8.96426 5.33579 9.63583 5.75 10.05L11.2929 15.5929C11.6834 15.9835 12.3166 15.9835 12.7071 15.5929L18.25 10.05C18.6642 9.63584 18.6642 8.96426 18.25 8.55005C17.8358 8.13584 17.1642 8.13584 16.75 8.55005L12.5657 12.7344C12.2533 13.0468 11.7467 13.0468 11.4343 12.7344Z" fill="black" />
															</svg>
														</span>
                                        <!--end::Svg Icon-->
													</span>
                                </div>
                                <span data-bs-toggle="tooltip" data-bs-trigger="hover" title="Modifier la production">
                                <button class="btn btn-sm btn-light-primary" data-bs-toggle="modal" data-bs-target="#editProductionModal-{{ $production->id }}">Modifier</button>
                            </span>
                            </div>
                            <!--end::Details toggle-->

                            <!--begin::Modal - New Card-->
                            <div class="modal fade" id="editProductionModal-{{ $production->id }}" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="editProductionModal-{{ $production->id }}Label" tabindex="-1" aria-hidden="true">
                                <!--begin::Modal dialog-->
                                <div class="modal-dialog modal-dialog-centered mw-650px">
                                    <!--begin::Modal content-->
                                    <div class="modal-content">
                                        <!--begin::Modal header-->
                                        <div class="modal-header">
                                            <!--begin::Modal title-->
                                            <h2>Modifier la production #{{ $production->id }}</h2>
                                            <!--end::Modal title-->
                                            <!--begin::Close-->
                                            <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                                <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                                <span class="svg-icon svg-icon-1">
														<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
															<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="black" />
															<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black" />
														</svg>
													</span>
                                                <!--end::Svg Icon-->
                                            </div>
                                            <!--end::Close-->
                                        </div>
                                        <!--end::Modal header-->
                                        <!--begin::Modal body-->
                                        <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                                            <!--begin::Form-->
                                            <form class="form" action="{{ route('production.update', ['production' => $production]) }}" method="POST">
                                                @csrf
                                                @method("PUT")
                                                <!--begin::Input group-->
                                                <div class="d-flex flex-column mb-7 fv-row">
                                                    <!--begin::Label-->
                                                    <label class="d-flex align-items-center fs-6 fw-bold form-label mb-2">
                                                        <span class="required">Le responsable</span>

                                                    </label>
                                                    <!--end::Label-->
                                                    <select name="staff_id"
                                                            aria-label="Select a staff"
                                                            data-control="select2"
                                                            data-placeholder="Choisir un responsable"
                                                            data-allow-clear="true"
                                                            data-kt-select2="true"
                                                            class="form-select form-select-solid" required>
                                                        <option value=""></option>
                                                        @foreach(\App\Models\Staff::all() as $staff)
                                                            <option value="{{ $staff->id }}" @if($production->staff_id === $staff->id) selected @endif>{{ $staff->first_name }} {{ $staff->last_name }} - {{ $staff->phone }}</option>
                                                        @endforeach

                                                    </select>
                                                </div>
                                                <!--end::Input group-->
                                                <div class="text-center pt-15">
                                                    <button type="button" id="editProductionModal-{{ $production->id }}_close" data-bs-dismiss="modal" class="btn btn-light me-3">Fermer</button>
                                                    <button type="reset" id="editProductionModal-{{ $production->id }}_cancel" class="btn btn-light me-3">Reinitialiser</button>
                                                    <button type="submit" id="editProductionModal-{{ $production->id }}_submit" class="btn btn-primary">Enregistrer</button>
                                                </div>
                                                <!--end::Actions-->
                                            </form>
                                            <!--end::Form-->
                                        </div>
                                        <!--end::Modal body-->
                                    </div>
                                    <!--end::Modal content-->
                                </div>
                                <!--end::Modal dialog-->
                            </div>
                            <!--end::Modal - New Card-->
                        @endif
                        <div class="separator separator-dashed my-3"></div>
                        <!--begin::Details content-->
                        <div id="kt_customer_view_details" class="collapse show">
                            <div class="py-5 fs-6">
                                <!--begin::Badge-->
                                @switch($production->status)
                                    @case(\App\Enums\ProductionEnum::STATUS_PENDING->value)
                                        <div class="badge badge-light-warning">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                        @break
                                    @case(\App\Enums\ProductionEnum::STATUS_FINISHED->value)
                                        <div class="badge badge-light-success">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                        @break
                                    @case(\App\Enums\ProductionEnum::STATUS_CANCELLED->value)
                                        <div class="badge badge-light-danger">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                        @break
                                @endswitch
                                <!--begin::Badge-->
                                <!--begin::Details item-->
                                <div class="fw-bolder mt-5">ID Production</div>
                                <div class="text-gray-600">#{{ $production->id }}</div>
                                <!--begin::Details item-->
                                <!--begin::Details item-->
                                <div class="fw-bolder mt-5">Date de la production</div>
                                <div class="text-gray-600">
                                    <a href="#" class="text-gray-600 text-hover-primary">
                                        {{ \Carbon\Carbon::parse($production->production_date)->locale('fr')->translatedFormat('l, d M y') }} à
                                        {{ \Carbon\Carbon::parse($production->production_date)->locale('fr')->translatedFormat('H:i:s') }}
                                    </a>
                                </div>
                                <!--begin::Details item-->
                                <!--begin::Details item-->
                                <div class="fw-bolder mt-5">Statut</div>
                                <div class="text-gray-600">
                                    @switch($production->status)
                                        @case(\App\Enums\ProductionEnum::STATUS_PENDING->value)
                                            <div class="badge badge-light-warning">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                            @break
                                        @case(\App\Enums\ProductionEnum::STATUS_FINISHED->value)
                                            <div class="badge badge-light-success">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                            @break
                                        @case(\App\Enums\ProductionEnum::STATUS_CANCELLED->value)
                                            <div class="badge badge-light-danger">{{ \App\Services\ProductionService::humanize_status($production->status) }}</div>
                                            @break
                                    @endswitch
                                </div>
                                <!--begin::Details item-->
                                <!--begin::Details item-->
                                <div class="fw-bolder mt-5">Le responsable</div>
                                <div class="text-gray-600">
                                    {{ $production->staff->first_name }} {{ $production->staff->last_name }}
                                </div>
                                <!--begin::Details item-->
                            </div>
                        </div>
                        <!--end::Details content-->
                    </div>
                    <!--end::Card body-->
                </div>
                <!--end::Card-->
            </div>
            <!--end::Sidebar-->

            <!--begin::Content-->
            <div class="flex-lg-row-fluid ms-lg-15">
                <!--begin::Card-->
                <div class="card pt-4 mb-6 mb-xl-9">
                    <!--begin::Card header-->
                    <div class="card-header border-0">
                        <!--begin::Card title-->
                        <div class="card-title">
                            <h2>Les plats</h2>
                        </div>
                        <!--end::Card title-->
                        @if($pending_production)
                            <!--begin::Card toolbar-->
                            <div class="card-toolbar">
                                <!--begin::Filter-->
                                <button type="button" class="btn btn-sm btn-flex btn-light-primary" data-bs-toggle="modal" data-bs-target="#addIngredientToSupply">
                                    <!--begin::Svg Icon | path: icons/duotune/general/gen035.svg-->
                                    <span class="svg-icon svg-icon-3">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
                                        <rect opacity="0.3" x="2" y="2" width="20" height="20" rx="5" fill="black" />
                                        <rect x="10.8891" y="17.8033" width="12" height="2" rx="1" transform="rotate(-90 10.8891 17.8033)" fill="black" />
                                        <rect x="6.01041" y="10.9247" width="12" height="2" rx="1" fill="black" />
                                    </svg>
                                </span>
                                    <!--end::Svg Icon-->Ajouter un plat</button>
                                <!--end::Filter-->
                            </div>
                            <!--end::Card toolbar-->
                        @endif
                    </div>
                    <!--end::Card header-->
                    <!--begin::Card body-->
                    <div class="card-body pt-0 pb-5">
                        <div class="table-responsive">
                            <!--begin::Table-->
                            <table class="table align-middle table-row-dashed gy-5" id="kt_table_customers_payment">
                                <!--begin::Table head-->
                                <thead class="border-bottom border-gray-200 fs-7 fw-bolder">
                                <!--begin::Table row-->
                                <tr class="text-start text-muted text-uppercase gs-0">
                                    <th class="min-w-100px">Plat</th>
                                    <th>Quantité</th>
                                    <th class="min-w-100px">Montant</th>
                                    <th class="text-end min-w-100px pe-4">Actions</th>
                                </tr>
                                <!--end::Table row-->
                                </thead>
                                <!--end::Table head-->
                                <!--begin::Table body-->
                                <tbody class="fs-6 fw-bold text-gray-600">
                                @forelse($production->products as $product)
                                    <!--begin::Table row-->
                                    <tr>
                                        <!--begin::Invoice=-->
                                        <td>
                                            <a href="#" class="text-gray-600 text-hover-primary mb-1">{{ $product->name }}</a>
                                        </td>
                                        <!--end::Invoice=-->
                                        <!--begin::Status=-->
                                        <td>
                                            <span class="text-muted fw-bold">{{ number_format($product->price, 0, '.', ' ') }}</span> x {{ $product->pivot->quantity }}
                                        </td>
                                        <!--end::Status=-->
                                        <!--begin::Amount=-->
                                        <td>{{ number_format($product->price * $product->pivot->quantity, 2, '.', ' ') }}</td>
                                        <!--end::Amount=-->
                                        <!--begin::Action=-->
                                        <td class="pe-0 text-end">
                                            @if($pending_production)
                                                <a href="#" class="btn btn-sm btn-light btn-active-light-primary" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end">Actions
                                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr072.svg-->
                                                    <span class="svg-icon svg-icon-5 m-0">
																			<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
																				<path d="M11.4343 12.7344L7.25 8.55005C6.83579 8.13583 6.16421 8.13584 5.75 8.55005C5.33579 8.96426 5.33579 9.63583 5.75 10.05L11.2929 15.5929C11.6834 15.9835 12.3166 15.9835 12.7071 15.5929L18.25 10.05C18.6642 9.63584 18.6642 8.96426 18.25 8.55005C17.8358 8.13584 17.1642 8.13584 16.75 8.55005L12.5657 12.7344C12.2533 13.0468 11.7467 13.0468 11.4343 12.7344Z" fill="black" />
																			</svg>
																		</span>
                                                    <!--end::Svg Icon--></a>
                                                <!--begin::Menu-->
                                                <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-600 menu-state-bg-light-primary fw-bold fs-7 w-125px py-4" data-kt-menu="true">
                                                    <!--begin::Menu item-->
                                                    <div class="menu-item px-3">
                                                        <a data-bs-toggle="modal" data-bs-target="#editProductToProduction-{{ $product->id }}{{ $production->id }}" class="menu-link px-3">Modifier</a>
                                                    </div>
                                                    <!--end::Menu item-->
                                                    <!--begin::Menu item-->
                                                    <div class="menu-item px-3">
                                                        <a data-bs-toggle="modal" data-bs-target="#deleteProductToProduction-{{ $product->id }}{{ $production->id }}" class="menu-link px-3" data-kt-customer-table-filter="delete_row">Retirer</a>
                                                    </div>
                                                    <!--end::Menu item-->
                                                </div>
                                                <!--end::Menu-->
                                                <!--begin::Modal - New Card-->
                                                <div class="modal fade" id="editProductToProduction-{{ $product->id }}{{ $production->id }}" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="editProductToProduction-{{ $product->id }}{{ $production->id }}Label" tabindex="-1" aria-hidden="true">
                                                    <!--begin::Modal dialog-->
                                                    <div class="modal-dialog modal-dialog-centered mw-650px">
                                                        <!--begin::Modal content-->
                                                        <div class="modal-content">
                                                            <!--begin::Modal header-->
                                                            <div class="modal-header">
                                                                <!--begin::Modal title-->
                                                                <h2>Modifier la ligne {{ $product->name }}</h2>
                                                                <!--end::Modal title-->
                                                                <!--begin::Close-->
                                                                <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                                                    <span class="svg-icon svg-icon-1">
														<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
															<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="black" />
															<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black" />
														</svg>
													</span>
                                                                    <!--end::Svg Icon-->
                                                                </div>
                                                                <!--end::Close-->
                                                            </div>
                                                            <!--end::Modal header-->
                                                            <!--begin::Modal body-->
                                                            <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                                                                <!--begin::Form-->
                                                                <form class="form" action="{{ route('production.update_product', ['production' => $production, 'product' => $product]) }}" method="POST">
                                                                    @csrf
                                                                    @method("PUT")
                                                                    <!--begin::Input group-->
                                                                    <div class="d-flex flex-column mb-7 fv-row">
                                                                        <!--begin::Label-->
                                                                        <label class="d-flex align-items-center fs-6 fw-bold form-label mb-2">
                                                                            <span class="required">Quantité/Nombre</span>

                                                                        </label>
                                                                        <!--end::Label-->
                                                                        <input type="number"
                                                                               class="form-control form-control-solid"
                                                                               placeholder=""
                                                                               min="1"
                                                                               name="quantity" value="{{ $product->pivot->quantity }}" />
                                                                    </div>
                                                                    <!--end::Input group-->
                                                                    <div class="text-center pt-15">
                                                                        <button type="button" id="editProductToProduction-{{ $product->id }}{{ $production->id }}_close" data-bs-dismiss="modal" class="btn btn-light me-3">Fermer</button>
                                                                        <button type="reset" id="editProductToProduction-{{ $product->id }}{{ $production->id }}_cancel" class="btn btn-light me-3">Reinitialiser</button>
                                                                        <button type="submit" id="editProductToProduction-{{ $product->id }}{{ $production->id }}_submit" class="btn btn-primary">Enregistrer</button>
                                                                    </div>
                                                                    <!--end::Actions-->
                                                                </form>
                                                                <!--end::Form-->
                                                            </div>
                                                            <!--end::Modal body-->
                                                        </div>
                                                        <!--end::Modal content-->
                                                    </div>
                                                    <!--end::Modal dialog-->
                                                </div>
                                                <!--end::Modal - New Card-->
                                                <!--begin::Modal - New Card-->
                                                <div class="modal fade" id="deleteProductToProduction-{{ $product->id }}{{ $production->id }}" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="deleteProductToProduction-{{ $product->id }}{{ $production->id }}Label" tabindex="-1" aria-hidden="true">
                                                    <!--begin::Modal dialog-->
                                                    <div class="modal-dialog modal-dialog-centered mw-650px">
                                                        <!--begin::Modal content-->
                                                        <div class="modal-content">
                                                            <!--begin::Modal header-->
                                                            <div class="modal-header">
                                                                <!--begin::Modal title-->
                                                                <h2>Suppression de la ligne {{ $product->name }}</h2>
                                                                <!--end::Modal title-->
                                                                <!--begin::Close-->
                                                                <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                                                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                                                    <span class="svg-icon svg-icon-1">
														<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
															<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="black" />
															<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black" />
														</svg>
													</span>
                                                                    <!--end::Svg Icon-->
                                                                </div>
                                                                <!--end::Close-->
                                                            </div>
                                                            <!--end::Modal header-->
                                                            <!--begin::Modal body-->
                                                            <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                                                                <!--begin::Form-->
                                                                <form class="form" action="{{ route('production.delete_product', ['production' => $production, 'product' => $product]) }}" method="POST">
                                                                    @csrf
                                                                    @method("DELETE")
                                                                    Êtes vous sûr de vouloir supprimer cette ligne ?
                                                                    <div class="text-center pt-15">
                                                                        <button type="button" id="deleteProductToProduction-{{ $product->id }}{{ $production->id }}_close" data-bs-dismiss="modal" class="btn btn-light me-3">Fermer</button>
                                                                        <button type="submit" id="deleteProductToProduction-{{ $product->id }}{{ $production->id }}_submit" class="btn btn-danger">Supprimer</button>
                                                                    </div>
                                                                    <!--end::Actions-->
                                                                </form>
                                                                <!--end::Form-->
                                                            </div>
                                                            <!--end::Modal body-->
                                                        </div>
                                                        <!--end::Modal content-->
                                                    </div>
                                                    <!--end::Modal dialog-->
                                                </div>
                                                <!--end::Modal - New Card-->
                                            @endif
                                        </td>
                                        <!--end::Action=-->
                                    </tr>
                                    <!--end::Table row-->
                                @empty
                                    <tr>
                                        <td colspan="4">
                                            <div class="text-center text-muted fs-3">
                                                Aucun plat trouvé
                                                <div>
                                                    <span class="fa fa-folder-open display-3"></span>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforelse
                                </tbody>
                                <!--end::Table body-->
                            </table>
                            <!--end::Table-->
                        </div>
                        <div class="row justify-content-center">
                            <div class="fs-4 text-center text-muted">Total production</div>
                            <div class="fs-3 text-center fw-bold btn btn-danger d-inline-block">CFA {{ number_format(\App\Services\ProductionService::total_production($production), 2, '.', ' ') }}</div>
                        </div>
                    </div>
                    <!--end::Card body-->
                </div>
                <!--end::Card-->
            </div>
            <!--end::Content-->
        </div>
        <!--end::Layout-->
        <!--begin::Modals-->
        <!--begin::Modal - New Card-->
        <div class="modal fade" id="addIngredientToSupply" data-bs-backdrop="static" data-bs-keyboard="false" aria-labelledby="addIngredientToSupplyLabel" tabindex="-1" aria-hidden="true">
            <!--begin::Modal dialog-->
            <div class="modal-dialog modal-dialog-centered mw-650px">
                <!--begin::Modal content-->
                <div class="modal-content">
                    <!--begin::Modal header-->
                    <div class="modal-header">
                        <!--begin::Modal title-->
                        <h2>Ajout de plat à la production</h2>
                        <!--end::Modal title-->
                        <!--begin::Close-->
                        <div class="btn btn-sm btn-icon btn-active-color-primary" data-bs-dismiss="modal">
                            <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                            <span class="svg-icon svg-icon-1">
														<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
															<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="black" />
															<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="black" />
														</svg>
													</span>
                            <!--end::Svg Icon-->
                        </div>
                        <!--end::Close-->
                    </div>
                    <!--end::Modal header-->
                    <!--begin::Modal body-->
                    <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                        <!--begin::Form-->
                        <form class="form" action="{{ route('production.attach_product', ['production' => $production]) }}" method="POST">
                            @csrf
                            <!--begin::Input group-->
                            <div class="d-flex flex-column mb-7 fv-row">
                                <!--begin::Label-->
                                <label class="d-flex align-items-center fs-6 fw-bold form-label mb-2">
                                    <span class="required">Le plat</span>
                                </label>
                                <!--end::Label-->
                                <select name="product_id"
                                        aria-label="Select a product"
                                        data-control="select2"
                                        data-placeholder="Choisir un plat"
                                        data-dropdown-parent="#addIngredientToSupply"
                                        data-allow-clear="true"
                                        data-kt-select2="true"
                                        class="form-select form-select-solid">
                                    <option value=""></option>
                                    @foreach($products as $product)
                                        <option value="{{ $product->id }}" @if($production->product_id === $product->id) selected @endif>{{ $product->name }} - {{ $product->price }} CFA</option>
                                    @endforeach

                                </select>
                            </div>
                            <!--end::Input group-->
                            <!--begin::Input group-->
                            <div class="d-flex flex-column mb-7 fv-row">
                                <!--begin::Label-->
                                <label class="d-flex align-items-center fs-6 fw-bold form-label mb-2">
                                    <span class="required">Quantité/Nombre</span>

                                </label>
                                <!--end::Label-->
                                <input type="number"
                                       class="form-control form-control-solid"
                                       placeholder=""
                                       min="1"
                                       name="quantity" value="1" />
                            </div>
                            <!--end::Input group-->
                            <div class="text-center pt-15">
                                <button type="button" id="addIngredientToSupply_close" data-bs-dismiss="modal" class="btn btn-light me-3">Fermer</button>
                                <button type="reset" id="addIngredientToSupply_cancel" class="btn btn-light me-3">Reinitialiser</button>
                                <button type="submit" id="addIngredientToSupply_submit" class="btn btn-primary">Enregistrer</button>
                            </div>
                            <!--end::Actions-->
                        </form>
                        <!--end::Form-->
                    </div>
                    <!--end::Modal body-->
                </div>
                <!--end::Modal content-->
            </div>
            <!--end::Modal dialog-->
        </div>
        <!--end::Modal - New Card-->
        <!--end::Modals-->
    </div>
@endsection