@extends(backpack_view('blank'))
@section('after_styles')
    <link href="{{ asset('assets/css/custom-tailwind.css') }}" rel="stylesheet" media="all" />
    <link href="{{ asset('assets/css/form_rkp.css') }}" rel="stylesheet" media="all" />
    <link href="{{ asset('assets/css/print_form_rkp.css') }}" rel="stylesheet" media="print" />
@endsection

@section('content')
    <main id="page_form_rkp">
        <h2>
            <span class="text-capitalize text-mint-300">RENCANA KERJA PROYEK {{ strtoupper($client_name) }}</span>
        </h2>

        <form id="form_rkp" class="container-fluid" method="post"
            action="{{ route('form-rkp.update', $contract['uuid']) }}">
            @csrf
            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Mengajuakan</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_mengajuan" name="form_mengajukan" type="text" class="form-control"
                            value="{{ $contract['form_mengajukan'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Menyetujui</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4 relative">
                        <input id="input_menyetujui" name="form_menyetujui" type="text" class="form-control relative"
                            value="{{ $contract['form_menyetujui'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-start">
                        <span>Catatan</span> <span>:</span>
                    </div>
                    <div class="form-group col-9 col-md-10">
                        <textarea id="input_catatan" name="form_catatan" rows="3" class="form-control">{{ $contract['form_catatan'] ?? '' }}</textarea>
                    </div>
                </div>
            </section>


            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <div class="alert alert-primary bg-mint-50 text-mint-300 border-mint-200 mt-5">
                    1. Kick Off / Technical Meeting / Appointment
                </div>

                <div class="row">
                    <p>Diskusi dengan PIC Pemberi Tugas (jika dianggap perlu)</p>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-start">
                        <span>Catatan</span> <span>:</span>
                    </div>
                    <div class="form-group col-9 col-md-10">
                        <textarea id="input_kickoff_catatan" name="kickoff_catatan" rows="3" class="form-control">{{ $contract['kickoff_catatan'] ?? '' }}</textarea>
                    </div>
                </div>
            </section>


            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <div class="alert alert-primary bg-mint-50 text-mint-300 border-mint-200 mt-5">
                    2. Kontrak / SPK
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>No. Kontrak</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        {{-- No.Kontrak hanya bisa diedit jika nilainya null --}}
                        <input id="input_no_kontrak" {{ !$contract['no_kontrak'] ? 'name=no_kontrak' : 'readonly' }}
                            type="text" class="form-control" value="{{ $contract['no_kontrak'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Tanggal Kontrak</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_tgl_kontrak" name="tgl_kontrak" type="date" class="form-control"
                            value="{{ $contract['tgl_kontrak'] ?? '' }}" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>PIC Pemberi Tugas</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_pic" name="cp_nama" type="text" class="form-control"
                            value="{{ $contract['cp_nama'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Marketing</span> <span>:</span>
                    </div>
                    <div class="form-group col-9 col-md-6 col-lg-4 d-flex flex-row">
                        <input id="input_marketing" name="marketing" type="text" class="form-control"
                            value="{{ isset($contract['marketing']['name']) ? $contract['marketing']['name'] : '' }}"
                            disabled>

                        <a href="{{ route('tasks.kontrak.edit', $contract['uuid']) }}#tim" target="_blank"class="btn btn-link px-0 btn-print my-auto text-warning" style="width: min-content">
                            <i class="bi bi-pencil"></i>
                        </a>
                    </div>
                </div>
            </section>


            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <div class="alert alert-primary bg-mint-50 text-mint-300 border-mint-200 mt-5">
                    3. Objek Penilaian
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Objek Dinilai</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_object_dinilai" name="objek_penilaian" type="text" class="form-control"
                            value="{{ $contract['objek_penilaian'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Tujuan Penilaian</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_tujuan_penilaian" name="tujuan" type="text" class="form-control"
                            value="{{ $contract['tujuan'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Pendekatan / Metodologi</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_pendekatan" name="pendekatan" type="text" class="form-control"
                            value="{{ $contract['pendekatan'] ?? '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Dasar Nilai</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_dasar_nilai" name="dasar_nilai" type="text" class="form-control"
                            value="{{ $contract['dasar_nilai'] ?? '' }}">
                    </div>
                </div>
            </section>

            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <div class="alert alert-primary bg-mint-50 text-mint-300 border-mint-200 mt-5">
                    4. Tim Proyek
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Penanggung Jawab</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_penganggung_jawab" name="penganggung_jawab" type="text" class="form-control"
                            value="{{ isset($list_penanggung_jawab) ? implode(', ', $list_penanggung_jawab) : '' }}"
                            disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Reviewer</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_reviewer" name="reviewer" type="text" class="form-control"
                            value="{{ isset($list_reviewer) ? implode(', ', $list_reviewer) : '' }}" disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Penilai</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4  d-flex flex-row">
                        <input id="input_penilai" name="penilai" type="text" class="form-control"
                            value="{{ isset($list_penilai) ? implode(', ', $list_penilai) : '' }}" disabled>

                        <a href="{{ route('tasks.kontrak.edit', $contract['uuid']) }}#tim" target="_blank"class="btn btn-link px-0 btn-print my-auto text-warning" style="width: min-content">
                            <i class="bi bi-pencil"></i>
                        </a>
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Asisten Penilai</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4  d-flex flex-row">
                        <input id="input_asisten_penilai" name="asisten_penilai" type="text" class="form-control"
                            value="{{ isset($list_asisten_penilai) ? implode(', ', $list_asisten_penilai) : '' }}"
                            disabled>

                        <a href="{{ route('tasks.kontrak.edit', $contract['uuid']) }}#tim" target="_blank"class="btn btn-link px-0 btn-print my-auto text-warning" style="width: min-content">
                            <i class="bi bi-pencil"></i>
                        </a>
                    </div>
                </div>
            </section>


            <section class="d-flex page-break-avoid flex-col gap-2 mt-5">
                <input type="hidden" class="d-none" name="str_json_rkp" value="{{ isset($contract['rk_proyek']) ? $contract['rk_proyek'] : "" }}">
                <div class="alert alert-primary bg-mint-50 text-mint-300 border-mint-200 mt-5">
                    5. Timeline Pekerjaan
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Jangka Waktu Pengerjaan</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        @php
                            $duration_unit = isset($contract['is_hari_kalender']) && !!$contract['is_hari_kalender'] ? 'hari kalender' : 'hari';
                        @endphp
                        <input id="input_jangka_waktu" name="waktu_pengerjaan" type="text" class="form-control"
                            value="{{ isset($contract['waktu_pengerjaan']) ? $contract['waktu_pengerjaan'] . ' ' . $duration_unit : '' }}"
                            disabled>
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Tanggal Inspeksi</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_tgl_inspeksi" name="tgl_inspeksi" type="date" class="form-control"
                            value="{{ isset($rk_proyek['inspeksi']['dateawal']) ? $rk_proyek['inspeksi']['dateawal'] : '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Tanggal Target Resume</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_tgl_target_resume" name="tgl_target_resume" type="date" class="form-control"
                            value="{{ isset($rk_proyek['resume']['dateawal']) ? $rk_proyek['resume']['dateawal'] : '' }}">
                    </div>
                </div>

                <div class="row">
                    <div class="d-flex col-3 col-md-2 justify-between items-center">
                        <span>Tanggal Target Final</span> <span>:</span>
                    </div>
                    <div class="form-group col-9  col-md-6 col-lg-4">
                        <input id="input_tgl_target_final" name="tgl_target_final" type="date" class="form-control"
                            value="{{ isset($rk_proyek['final']['dateawal']) ? $rk_proyek['final']['dateawal'] : '' }}"
                            disabled>
                    </div>
                </div>
            </section>

            {{-- Button Action --}}
            <div class="my-5 not-printable d-flex gap-2">
                <button id="btn_submit" class="btn btn-primary" type="button"> Simpan </button>
                <button id="print_form" type="button" class="btn btn-primary btn-print bg-mint-200 border-mint-200">
                    Print
                </button>
                <a id="back" href="{{ route('tasks.index') }}" class="btn btn-default">
                    Back
                </a>
            </div>
        </form>

    </main>
@endsection

@section('after_scripts')
    @include('tasks.js')
    <script src="{{ asset('assets/js/jquery.validation.js') }}"></script>

    <script>
        $('form').each(function() {
            $(this).validate()
        });

        // Print Form
        $('#print_form').on('click', () => {
            window.print();
        })

        // Konfirmasi Submit
        $('#btn_submit').on('click', () => {
            window.validateAndConfirm("form#form_rkp", "Apakah anda yakin data yang anda isi telah sesuai ?")
        })
    </script>

    {{-- Rule Validasi --}}
    <script>
        $("#input_mengajuan").rules("add", {
            required: false,
            messages: {
                required: "Nama Pengaju harus diisi"
            }
        });
        // TODO: validasi form
    </script>
@endsection