@extends('layouts.administrator.master')

@section('title')
    Form Keanggotaan Perseorangan
@endsection

@section('content')
    <div class="nk-content-body">
        <div class="nk-block-head nk-block-head-sm">
            <div class="nk-block-between">
                <div class="nk-block-head-content">
                    <h3 class="nk-block-title page-title">{{ __('Formulir Keanggotaan Perseorangan Pertapindo') }}</h3>
                    <p>{{ __('Kelola data keanggotaan perseorangan') }}</p>
                </div>
            </div>
        </div>
        <div class="nk-block nk-block-lg">
            <div class="card card-preview">
                <div class="card-inner">
                    @include('pages.registration.personal._navbar', ['model' => $registration])
                    <div class="tab-content">
                        <h5 class="text-primary">Riwayat Sertifikasi</h5>
                        <div>
                            <form
                                action="{{ route('services.membership.registration.personal.certificate.store', ['no_reg' => $registration->no_reg]) }}"
                                method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="form-group">
                                    <div class="form-control-wrap">
                                        <div class="control-group other" style="margin-top:10px">
                                            @if (isset($registration->certificate) && !empty($registration->certificate))
                                                @foreach (json_decode($registration->certificate) as $key => $value)
                                                    <div class="control-group">
                                                        <input type="hidden" name="index[]" value="clone">
                                                        <div class="row gy-4">
                                                            <div class="col-sm-6">
                                                                <div class="form-group">
                                                                    <label class="form-label">Nomor Sertifikasi</label>
                                                                    <div class="form-control-wrap">
                                                                        <input type="text" name="no_certificate[]"
                                                                            class="form-control"
                                                                            placeholder="Nomor Sertifikasi"
                                                                            value="{{ optional($value)->no_certificate ?? '' }}"
                                                                            required>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-sm-6">
                                                                <div class="form-group">
                                                                    <label class="form-label">Nama Sertifikasi</label>
                                                                    <div class="form-control-wrap">
                                                                        <input type="text" name="name_certificate[]"
                                                                            class="form-control"
                                                                            placeholder="Nama Sertifikasi"
                                                                            value="{{ optional($value)->name_certificate ?? '' }}"
                                                                            required>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-sm-6">
                                                                <div class="form-group">
                                                                    <label class="form-label">Jenis Sertifikasi</label>
                                                                    <div class="form-control-wrap">
                                                                        <input type="text" name="type_certificate[]"
                                                                            class="form-control"
                                                                            placeholder="Jenis Sertifikasi"
                                                                            value="{{ optional($value)->type_certificate ?? '' }}"
                                                                            required>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-sm-6">
                                                                <div class="form-group mb-3">
                                                                    <label class="mb-1">{{ __('Lokasi') }}</label>
                                                                    <select name="location[]" class="form-control">
                                                                        <option value="">
                                                                            {{ __('Pilih Lokasi') }}
                                                                        </option>
                                                                        @foreach ($province as $item)
                                                                            <option value="{{ $item->nama }}"
                                                                                {{ $item->nama == $value->location ? 'selected' : '' }}>
                                                                                {{ $item->nama }}</option>
                                                                        @endforeach
                                                                    </select>
                                                                    <span class="text-muted">
                                                                        <i class="icon ni ni-info"></i> Lokasi
                                                                        Pelatihan/Sertifikasi/Workshop/Seminar
                                                                    </span>
                                                                </div>
                                                            </div>
                                                            <div class="col-sm-6">
                                                                <div class="form-group">
                                                                    <label class="form-label">Mulai</label>
                                                                    <div class="form-control-wrap">
                                                                        <input type="date" name="start_date[]"
                                                                            value="{{ optional($value)->start_date ?? '' }}"
                                                                            class="form-control" required>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col-sm-6">
                                                                <div class="form-group">
                                                                    <label class="form-label">Selesai</label>
                                                                    <div class="form-control-wrap">
                                                                        <input type="date" name="end_date[]"
                                                                            value="{{ optional($value)->end_date ?? '' }}"
                                                                            class="form-control" required>
                                                                    </div>
                                                                </div>
                                                            </div>

                                                            <div class="col-sm-12">
                                                                <div class="form-group">
                                                                    <label class="form-label">Dokumen
                                                                        <span class="text-primary">
                                                                            (Format : (PDF) Maksimal 512KB)
                                                                        </span>
                                                                    </label>
                                                                    <div class="form-control-wrap">
                                                                        <div class="form-file">
                                                                            <input type="file" name="documents[]"
                                                                                accept="application/pdf"
                                                                                class="form-control">
                                                                            <input type="hidden" name="text_documents[]"
                                                                                value="{{ isset($value->documents) ? $value->documents : '' }}">
                                                                            <span>{{ isset($value->documents) ? $value->documents : '' }}</span>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="col">
                                                                <div class="form-group">
                                                                    <div class="form-control-wrap">
                                                                        @if ($key == 0)
                                                                            <button class="btn btn-success px-2"
                                                                                type="button">
                                                                                <i class="icon ni ni-plus"></i> Tambah
                                                                            </button>
                                                                        @else
                                                                            <button class="btn btn-danger" type="button">
                                                                                <i class="icon ni ni-trash"></i> Hapus
                                                                            </button>
                                                                        @endif
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <hr>
                                                    </div>
                                                @endforeach
                                            @else
                                                <div class="control-group">
                                                    <input type="hidden" name="index[]" value="clone">
                                                    <div class="row gy-4">
                                                        <div class="col-sm-6">
                                                            <div class="form-group">
                                                                <label class="form-label">Nomor Sertifikasi</label>
                                                                <div class="form-control-wrap">
                                                                    <input type="text" name="no_certificate[]"
                                                                        class="form-control"
                                                                        placeholder="Nomor Sertifikasi"
                                                                        value="{{ old('no_certificate.0') }}" required>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-6">
                                                            <div class="form-group">
                                                                <label class="form-label">Nama Sertifikasi</label>
                                                                <div class="form-control-wrap">
                                                                    <input type="text" name="name_certificate[]"
                                                                        class="form-control"
                                                                        placeholder="Nama Sertifikasi"
                                                                        value="{{ old('name_certificate.0') }}" required>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-6">
                                                            <div class="form-group">
                                                                <label class="form-label">Jenis Sertifikasi</label>
                                                                <div class="form-control-wrap">
                                                                    <input type="text" name="type_certificate[]"
                                                                        class="form-control"
                                                                        placeholder="Jenis Sertifikasi"
                                                                        value="{{ old('type_certificate.0') }}" required>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-6">
                                                            <div class="form-group mb-3">
                                                                <label class="mb-1">{{ __('Lokasi') }}</label>
                                                                <select name="location[]" class="form-control" required>
                                                                    <option value="">
                                                                        {{ __('Pilih Lokasi') }}
                                                                    </option>
                                                                    @foreach ($province as $item)
                                                                        <option value="{{ $item->nama }}"
                                                                            {{ $item->nama == old('location.0') ? 'selected' : null }}>
                                                                            {{ $item->nama }}</option>
                                                                    @endforeach
                                                                </select>
                                                                <span class="text-muted">
                                                                    <i class="icon ni ni-info"></i> Lokasi Sertifikasi
                                                                </span>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-6">
                                                            <div class="form-group">
                                                                <label class="form-label">Mulai</label>
                                                                <div class="form-control-wrap">
                                                                    <input type="date" name="start_date[]"
                                                                        value="{{ old('start_date.0') }}"
                                                                        class="form-control" required>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col-sm-6">
                                                            <div class="form-group">
                                                                <label class="form-label">Selesai</label>
                                                                <div class="form-control-wrap">
                                                                    <input type="date" name="end_date[]"
                                                                        value="{{ old('end_date.0') }}"
                                                                        class="form-control" required>
                                                                </div>
                                                            </div>
                                                        </div>

                                                        <div class="col-sm-12">
                                                            <div class="form-group">
                                                                <label class="form-label">Dokumen
                                                                    <span class="text-primary">
                                                                        (Format : (PDF) Maksimal 512KB)
                                                                    </span>
                                                                </label>
                                                                <div class="form-control-wrap">
                                                                    <div class="form-file">
                                                                        <input type="file" name="documents[]"
                                                                            value="{{ old('documents.0') }}"
                                                                            accept="application/pdf" class="form-control">
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="col">
                                                            <div class="form-group">
                                                                <div class="form-control-wrap">
                                                                    <button class="btn btn-success px-2" type="button">
                                                                        <i class="icon ni ni-plus"></i> Tambah</button>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <hr>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                </div>

                                <div class="mx-auto mt-4 text-end">
                                    <button class="btn btn-primary me-2">{{ __('Selanjutnya') }}</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="control-group" hidden>
        <input type="hidden" name="index[]" value="clone">
        <div class="row gy-4">
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="form-label">Nomor Sertifikasi</label>
                    <div class="form-control-wrap">
                        <input type="text" name="no_certificate[]" class="form-control"
                            placeholder="Nomor Sertifikasi" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="form-label">Nama Sertifikasi</label>
                    <div class="form-control-wrap">
                        <input type="text" name="name_certificate[]" class="form-control"
                            placeholder="Nama Sertifikasi" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="form-label">Jenis Sertifikasi</label>
                    <div class="form-control-wrap">
                        <input type="text" name="type_certificate[]" class="form-control"
                            placeholder="Jenis Sertifikasi" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group mb-3">
                    <label class="mb-1">{{ __('Lokasi') }}</label>
                    <select name="location[]" class="form-control" required>
                        <option value="">
                            {{ __('Pilih Lokasi') }}
                        </option>
                        @foreach ($province as $item)
                            <option value="{{ $item->nama }}">
                                {{ $item->nama }}</option>
                        @endforeach
                    </select>
                    <span class="text-muted">
                        <i class="icon ni ni-info"></i> Lokasi Sertifikasi
                    </span>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="form-label">Mulai</label>
                    <div class="form-control-wrap">
                        <input type="date" name="start_date[]" class="form-control" required>
                    </div>
                </div>
            </div>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="form-label">Selesai</label>
                    <div class="form-control-wrap">
                        <input type="date" name="end_date[]" class="form-control" required>
                    </div>
                </div>
            </div>

            <div class="col-sm-12">
                <div class="form-group">
                    <label class="form-label">Dokumen
                        <span class="text-primary">
                            (Format : (PDF) Maksimal 512KB)
                        </span>
                    </label>
                    <div class="form-control-wrap">
                        <div class="form-file">
                            <input type="file" name="documents[]" accept="application/pdf" class="form-control">
                        </div>
                    </div>
                </div>
            </div>
            <div class="col">
                <div class="form-group">
                    <div class="form-control-wrap">
                        <button class="btn btn-danger" type="button">
                            <i class="icon ni ni-trash"></i> Hapus
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <hr>
    </div>
@endsection
@push('script')
    <script type="text/javascript">
        $(document).ready(function() {

            $(".btn-success").click(function() {
                $('.control-group:hidden').clone().appendTo('.other').removeAttr('hidden');
            });

            $(".other").on("click", ".btn-danger", function() {
                $(this).closest(".control-group").remove();
            });


        });
    </script>
@endpush