@extends('layouts.app')
@section('page-metaSEO')
    <title>BCM Soft - Gravite</title>
@endsection
@section('page-css')
    <link rel="stylesheet" href="{{ env('APP_URL') }}/css/administration.css?v={{ env('CACHE_VERSION') }}">
@endsection
@section('content')
    @php
        $saveButtonLabel = ($mode == 'create') ? __('ST_AD_Create') : __('ST_AD_Save') ;
    @endphp
    <div class="gravite container">

        <form method="POST" action="{{ route('admin.store', $section) }}" id="admin-form">
            <div class="col-lg-12 mt-5 mb-5 d-flex justify-content-between align-items-center">
                <div class="label">
                    <h2>
                        {{ $title2 }}
                    </h2>
                </div>
                <div class="buttons d-flex" id="back-button">
                    <a href="{{ route('admin.list', ['section' => request()->route('section')]) }}"
                       class="button-nouveau btn-orange  mt-3">
                        <i class="fas fa-arrow-left"></i>
                        {{__("ST_RETOUR")}}
                    </a>
                    <button type="submit" class="submit-admin-form button-nouveau btn-green mt-3">
                        <i class="fas fa-save"></i>
                        {{ $saveButtonLabel }}
                    </button>
                </div>
            </div>
            <div class="col-lg-12 row justify-content-between">
                @csrf

                @if(isset($id_p) && isset($id_p))
                    <input type="hidden" name="id_p" value="{{ $id_p }}">
                @endif
                @foreach($config['columns'] as $field => $meta)
                    @php
                        $value = isset($row->$field) ? $row->$field : '';


                        if (isset($meta['editable']) && $meta['editable'] == 0) continue;// skip field

                        $type = isset($meta['type']) ? "{$meta['type']}" : "text";
                        $required = $meta['required'] ?? 'required' ;
                        $requiredLabel = (!empty($meta['required']) && $meta['required'] == true) ? '*' : '';
                        $multiselect = (isset($meta['multiselect']) && $meta['multiselect'] == true) ? ' multiple ' : '';


                        $width = isset($meta['width']) ? "{$meta['width']}" : 'col-6';
                        $customClass = isset($meta['class']) ? "{$meta['class']}" : '';
                        $label = $meta['label'] ?? ucfirst(str_replace('_', ' ', $field));
                    @endphp
                    <div class="d-block justify-content-between {{$width}} gap-5 mt-3">
                        @if($type === 'color')
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4">{!! $label !!} {{$requiredLabel}}</label>
                                <input type="color" value="{{ $value }}" name="{{ $field }}"
                                       class="col-8 {{$customClass}}" {{ $required }} />
                            </div>
                        @elseif($type === 'datetime')
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4">{!! $label !!}{{$requiredLabel}}</label>
                                <input type="datetime-local" value="{{ $value }}" name="{{ $field }}"
                                       class="col-8 {{$customClass}}" {{ $required }} />
                            </div>
                        @elseif($type === 'date')
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4">{!! $label !!}{{$requiredLabel}}</label>
                                <input type="date" value="{{ $value }}" name="{{ $field }}"
                                       {{ $required }}  class="col-8 {{$customClass}}"/>
                            </div>
                        @elseif($type === 'time')
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4">{!! $label !!}{{$requiredLabel}}</label>
                                <input type="time" value="{{ $value }}" name="{{ $field }}"
                                       {{ $required }}  class="col-8 {{$customClass}}"/>
                            </div>
                        @elseif($type === 'textarea')
                            <div class="description-risque ">
                                <div class="header d-flex justify-content-between">
                                    <span class="label">{!! $label !!}{{$requiredLabel}}</span>
                                </div>
                                <textarea name="{{ $field }}" id="note" placeholder=""
                                          class="col-8 {{$customClass}}">{{ $value }}</textarea>
                            </div>@elseif($type === 'checkbox')
                            <div class="checkbox-field">
                                {{--<div class="header d-flex justify-content-between">
                                    <span class="label">{{ $label }}{{ $requiredLabel }}</span>
                                </div>--}}
                                <div class="form-check">
                                    <input type="checkbox"
                                           name="{{ $name ?? 'checkbox_field' }}"
                                           id="{{ $name ?? 'checkbox_field' }}"
                                           class="form-check-input {{$customClass}}"
                                           value="1"
                                        {{ !empty($value) && $value ? 'checked' : '' }}>
                                    <label class="form-check-label" for="{{ $name ?? 'checkbox_field' }}">
                                        {{ $label }}
                                    </label>
                                </div>
                            </div>

                    @elseif($type === 'select')
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4 ">{!! $label !!}{{$requiredLabel}}</label>
                                <div class="col-8">
                                    <select class="select2 {{$customClass}} {{$multiselect}}" name="{{ $field }}" {{ $required }} {{$multiselect}} style="width:100%">
                                        <option value="">{{__("ST_AD_008")}}</option>
                                        @foreach ($meta['data'] AS $d)
                                            <option value="{{$d['id']}}" @if (isset($d['selected']) && $d['selected'] == true)  selected @endif>{{$d['value']}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>

                        @elseif($type == 'component')
                            @if (!empty($meta['component']))
                                <div class="{{$customClass}}">
                                @if (!empty($meta['data_for_component']))
                                    @php
                                     $aa = [
                                         $meta['data_name_for_component'] => $meta['data_for_component'] ?? null,
                                         'label'=>$label ?? null
                                         ];
                                     $aa['disabled'] = false;
                                     if (isset($meta['disabled']) && $meta['disabled'] == true){
                                        $aa['disabled'] = true;
                                     }

                                     $aa['selected_value'] = null;
                                     if (isset($meta['selected_value']) && $meta['selected_value'] != null){
                                        $aa['selected_value'] = $meta['selected_value'];
                                     }
                                     @endphp
                                    @include('components.' . $meta['component'], $aa)
                                @else
                                    @include('components.' . $meta['component'], ['row' => $row ?? null])
                                @endif
                                </div>
                            @endif
                        @else
                            <div class="height-auto item d-flex justify-content-between col-12  gap-5">
                                <label class="label col-4">{!! $label !!}{{$requiredLabel}}</label>
                                <input type="text" name="{{ $field }}" {{ $required }}  value="{{ $value }}"
                                       class="col-8"/>
                            </div>

                        @endif

                    </div>
                @endforeach
            </div>

            <p class="mt-3">* Champs obligatoire</p>

            <div class="col-lg-12 mt-5 mb-5 d-flex justify-content-between align-items-center">
                <div class="label">

                </div>
                <div class="buttons d-flex">
                    <a href="{{ route('admin.list', ['section' => request()->route('section')]) }}"
                       class="button-nouveau btn-orange  mt-3">
                        <i class="fas fa-arrow-left"></i>
                        {{__("ST_RETOUR")}}
                    </a>
                    <button type="submit" class="submit-admin-form button-nouveau btn-green mt-3">
                        <i class="fas fa-save"></i>
                        {{ $saveButtonLabel }}
                    </button>
                </div>
            </div>
        </form>

    </div>

    <div class="modal fade" id="validationErrorsModal" tabindex="-1" aria-labelledby="validationErrorsModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content ">
                <div class="modal-header bg-warning text-dark">
                    <h5 class="modal-title" id="validationErrorsModalLabel">
                        <i class="fas fa-exclamation-triangle me-2"></i> {{__("ST_WARBIATITRE")}}
                    </h5>

                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body" id="validationErrorsModalBody">
                    <!-- Errors will be injected here -->
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-warning" data-bs-dismiss="modal">{{__("ST_FERMER")}}</button>
                </div>
            </div>
        </div>
    </div>

    <!-- Success Modal -->
    <div class="modal fade" id="successModal" tabindex="-1" aria-labelledby="successModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered">
            <div class="modal-content border-success">
                <div class="modal-header bg-success text-white">
                    <h5 class="modal-title" id="successModalLabel">
                        <i class="fas fa-check-circle me-2"></i>Success
                    </h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"
                            aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <p id="successMessage">Your data has been saved successfully.</p>
                </div>
                <div class="modal-footer">
                    <a href="{{ route('admin.list', ['section' => request()->route('section')]) }}"
                       class="button-nouveau btn-orange">
                        <i class="fas fa-arrow-left"></i>Retour
                    </a>
                    @if (!isset($id_p) && isset($id_p))
                        )
                        <button class="button-nouveau btn-green" id="addAnotherBtn">Add Another</button>
                    @endif
                </div>
            </div>
        </div>
    </div>

    {{-- <div class="col-lg-12 d-flex justify-content-between">
         <div class="height-auto item d-flex justify-content-between col-2  gap-5">
             <div class="label">Code*</div>
             <input name="code" type="text" id="code" class="select2 col-12">
         </div>
         <div class="height-auto item d-flex justify-content-between col-9  gap-5">
             <div class="label">libelle*</div>
             <input name="code" type="text" id="code" class="select2 col-11">
         </div>
     </div>--}}
    {{--    <div class="col-lg-12 d-flex justify-content-between">
            <div class="description-risque mt-4">
                <div class="header d-flex justify-content-between">
                    <span class="label">Description</span>
                </div>
                <textarea name="description" id="note" placeholder=""></textarea>
            </div>
        </div>
--}}

@endsection
@section('scripts')
    @include('js.js-home')
@endsection