@extends('layouts.app', ['class' => 'g-sidenav-show bg-gray-100'])
@section('head-link')
    <link href="{{ asset('assets/summernote-0.9.0-dist/summernote-bs5.css') }}" rel="stylesheet">
    <script src="{{ asset('assets/summernote-0.9.0-dist/summernote-bs5.js') }}"></script>
@endsection
{{-- section content --}}
@section('content')
    @include('layouts.navbars.auth.topnav', ['title' => ''])
    <div class="card shadow-lg mx-4">
        <div class="card-body p-3">
            <div class="row gx-4">
                <div class="col-lg">
                    <div class="nav-wrapper">
                        {{-- button back --}}
                        <button class="btn btn-secondary mb-0" onclick="history.back()"><i class="fas fa-circle-left me-1">
                            </i><span class="font-weight-bold">Kembali</button>
                        {{-- check authorize edi --}}
                        {{-- check authorize edi --}}
                        @if ($authorize->edit == '1')
                            {{-- button save --}}
                            <button class="btn btn-primary mb-0" id="{{ $dmenu }}-save"
                                onclick="event.preventDefault(); $('#confirmEditModal').modal('show');">
                                <i class="fas fa-floppy-disk me-1"></i>
                                <span class="font-weight-bold">Simpan</span>
                            </button>
                        @endif

                        <!-- Modal Konfirmasi Edit -->
                        <div class="modal fade" id="confirmEditModal" tabindex="-1" aria-labelledby="confirmEditModalLabel"
                            aria-hidden="true">
                            <div class="modal-dialog modal-dialog-centered">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="confirmEditModalLabel">Konfirmasi Edit</h5>
                                        <button type="button" class="btn-close" data-bs-dismiss="modal"
                                            aria-label="Close"></button>
                                    </div>
                                    <div class="modal-body">
                                        Apakah kamu yakin ingin mengedit data ini?
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-secondary"
                                            data-bs-dismiss="modal">Batal</button>
                                        <button type="button" class="btn btn-primary"
                                            onclick="$('#confirmEditModal').modal('hide'); document.getElementById('{{ $dmenu }}-form').submit();">Ya,
                                            Edit</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="container-fluid py-4">
        <div class="card">
            <form role="form" method="POST" action="{{ URL::to($url_menu . '/' . $idencrypt) }}"
                id="{{ $dmenu }}-form" enctype="multipart/form-data">
                @csrf
                @method('PUT')
                <div class="card-body">
                    <p class="text-uppercase text-sm">Edit {{ $title_menu }}</p>
                    <hr class="horizontal dark mt-0">
                    <div class="row">
                        <div class="form-group">
                            <label for="example-text-input" class="form-control-label">Nama</label>
                            <input class="form-control" type="text" value="{{ $list ? $list->nama : old('nama') }}"
                                name="nama" maxlength="255">
                            @error('nama')
                                <div class="text-danger mt-1">{{ $message }}</div>
                            @enderror
                        </div>
                        @php
                            $selectedRoles = old('roles', !empty($list->roles) ? explode(',', $list->roles) : []);

                            // hilangkan spasi kiri kanan
                            $selectedRoles = array_map('trim', $selectedRoles);
                        @endphp
                        <div class="form-group">
                            <label for="roles" class="form-control-label">ID Roles</label>
                            <select name="roles[]" id="roles"
                                class="form-control select2-roles @error('roles') is-invalid @enderror" multiple="multiple"
                                data-placeholder="Pilih Roles">

                                @foreach ($idroles as $item)
                                    <option value="{{ $item->idroles }}"
                                        {{ in_array($item->idroles, $selectedRoles) ? 'selected' : '' }}>
                                        {{ $item->idroles }} - {{ $item->name }}
                                    </option>
                                @endforeach

                            </select>

                            @error('roles')
                                <div class="invalid-feedback d-block">{{ $message }}</div>
                            @enderror
                        </div>

                        <div class="form-group">
                            <label for="file" class="form-control-label">
                                Upload File
                            </label>

                            <input class="form-control @error('file') is-invalid @enderror" type="file" id="file"
                                name="file" accept=".pdf">

                            @error('file')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror

                            <small class="text-muted d-block">
                                Format file: PDF. Maksimal 10 MB.
                            </small>

                            @if (!empty($list->file))
                                <div class="mt-2">
                                    <span class="text-muted">File saat ini:</span>

                                    <a href="{{ route('user-manual.preview', $list->id) }}" target="_blank"
                                        class="btn btn-sm btn-danger ms-2">
                                        <i class="fas fa-file-pdf me-1"></i>
                                        Lihat File
                                    </a>
                                </div>
                            @endif
                        </div>
                    </div>
                    <hr class="horizontal dark">
                </div>
                <div class="card-footer align-items-center pt-0 pb-2">
                </div>
            </form>
        </div>
    </div>
    </div>
    {{-- check flag js on dmenu --}}
    @if ($jsmenu == '1')
        @if (view()->exists("js.{$dmenu}"))
            @push('addjs')
                {{-- file js in folder (resources/views/js) --}}
                @include('js.' . $dmenu);
            @endpush
        @else
            @push('addjs')
                <script>
                    Swal.fire({
                        title: 'JS Not Found!!',
                        text: 'Please Create File JS',
                        icon: 'error',
                        confirmButtonColor: '#028284'
                    });
                </script>
            @endpush
        @endif
    @endif
@endsection
@push('js')
    <script>
        $(document).ready(function() {
            $('.select2-roles').select2({
                placeholder: 'Pilih Roles',
                allowClear: true,
                width: '100%'
            });
        });


        $(document).ready(function() {
            $('#summernote').summernote({
                placeholder: 'Email Body',
                tabsize: 2,
                height: 400,
            });
        });
    </script>
@endpush