@extends('layouts.admin.index')

@section('content')
  <div id="main-wrapper">
    <!-- Sidebar -->
    @include('layouts.admin.sidebar')
    <div class="page-wrapper">
      <!--  Header -->
      @include('layouts.admin.header')

      <div class="body-wrapper">
        <div class="container-fluid">
          {{ $model->id ? \Diglactic\Breadcrumbs\Breadcrumbs::render('ActionPlanM1Edit',$model->id) : \Diglactic\Breadcrumbs\Breadcrumbs::render('ActionPlanM1Add') }}
          <div class="card w-100" x-data='matrix1({
              rads: @json($rads),
              oldPurposeId: {{ old('metadata_purpose_id', $model->metadata_purpose_id) ?? 'null' }},
              oldTargetId: {{ old('metadata_target_id', $model->metadata_target_id) ?? 'null' }},
              oldIndicatorId: {{ old('metadata_indicator_id', $model->metadata_indicator_id) ?? 'null' }}
            })'
               @set-load-jquery.window="loadedJquery()">
            <div class="card-body">
              <form role="form" action="{{ route('matrix1.store') }}" method="post" id="form-matrix">
                <div class="mb-3 fv-row">
                  <div>
                    <label class="form-label" for="rad_id">Periode RAD</label>
                  </div>
                  <select class="form-select select2" data-live-search="true" name="rad_id" id="rad_id" @disabled($model->id)>
                    <option value="">Pilih RAD</option>
                    @foreach($rads as $r)
                      <option value="{{ $r->id }}" @selected($r->id == old('rad_id', $model->rad_id)) >{{ $r->name }} ({{ $r->year_start }} - {{ $r->year_end }})</option>
                    @endforeach
                  </select>
                  @error('rad_id')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <div>
                    <label class="form-label" for="pillar_id">Pilar</label>
                  </div>
                  <select class="form-select select2" data-live-search="true" name="pillar_id" id="pillar_id" @disabled($model->id)>
                    <option value="">Pilih Pilar</option>
                    @foreach($pillars as $p)
                      <option value="{{ $p->id }}" @selected($p->id == old('pillar_id', $model->pillar_id)) >{{ $p->name }}</option>
                    @endforeach
                  </select>
                  @error('pillar_id')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <div>
                    <label class="form-label" for="metadata_purpose_id">Tujuan</label>
                  </div>
                  <select class="form-select select2" data-live-search="true" name="metadata_purpose_id" id="metadata_purpose_id" @disabled($model->id)>
                    <option value="">Pilih Tujuan</option>
                    @foreach($purposes as $p)
                      <option value="{{ $p->id }}" @selected($p->id == old('metadata_purpose_id', $model->metadata_purpose_id)) >{{ $p->name }}</option>
                    @endforeach
                  </select>
                  @error('metadata_purpose_id')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <div>
                    <label class="form-label" for="metadata_target_id">Target</label>
                  </div>
                  <select class="form-select select2" data-live-search="true" name="metadata_target_id" id="metadata_target_id" @disabled($model->id)>
                    <option value="">Pilih Target</option>
                    @foreach($targets as $p)
                      <option value="{{ $p->id }}" @selected($p->id == old('metadata_target_id', $model->metadata_target_id)) >{{ $p->name }}</option>
                    @endforeach
                  </select>
                  @error('metadata_target_id')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <div>
                    <label class="form-label" for="metadata_indicator_id">Indikator</label>
                  </div>
                  <select class="form-select select2" data-live-search="true" name="metadata_indicator_id" id="metadata_indicator_id" @disabled($model->id)>
                    <option value="">Pilih Indikator</option>
                    @foreach($indicators as $p)
                      <option value="{{ $p->id }}" @selected($p->id == old('metadata_indicator_id', $model->metadata_indicator_id)) >{{ $p->name }}</option>
                    @endforeach
                  </select>
                  @error('metadata_indicator_id')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <label class="form-label" for="source">Sumber Data</label>
                  <input class="form-control form-prefill" id="source" name="source" value="{{ old('source', $model->source) }}" placeholder="Sumber Data"/>
                  @error('source')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <label class="form-label" for="unit">Satuan</label>
                  <input class="form-control form-prefill" id="unit" name="unit" value="{{ old('unit', $model->unit) }}" placeholder="Satuan"/>
                  @error('unit')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="mb-3 fv-row">
                  <label class="form-label" for="baseline">Angka Dasar (Baseline)</label>
                  <input class="form-control form-prefill" id="baseline" name="baseline" value="{{ old('baseline', $model->baseline) }}" placeholder="Angka Dasar (Baseline)"/>
                  @error('baseline')
                  <div class="invalid-feedback d-block">
                    {{ $message }}
                  </div>
                  @enderror
                </div>
                <div class="d-flex flex-column mb-3 fv-row" id="rad-target-container">
                  @foreach($forms as $key => $form)
                    <div class="row mb-3">
                      <div class="col-3">
                        <label class="form-label" for="baseline">Tahun</label>
                        <input class="form-control form-prefill row-year" name="forms[{{ $forms[$key]['year'] }}][year]" value="{{ $forms[$key]['year'] }}" placeholder="Tahun" readonly/>
                      </div>
                      <div class="col-9">
                        <label class="form-label" for="baseline">Target SDGs</label>
                        <input class="form-control form-prefill row-target" name="forms[{{ $forms[$key]['year'] }}][target]" value="{{ $forms[$key]['target'] }}" placeholder="Target SDGs"/>
                      </div>
                      {{-- @if($model->id)
                        <input type="text" name="forms[{{ $forms[$key]['year'] }}][progress]" value="{{ $forms[$key]['progress'] }}" />
                        <input type="text" name="forms[{{ $forms[$key]['year'] }}][status]" value="{{ $forms[$key]['status'] }}" />
                      @endif --}}
                    </div>
                  @endforeach
                </div>
                <input type="hidden" name="id" value="{{ $model->id }}" />
                {{ csrf_field() }}
                <div class="d-flex w-100 justify-content-end">
                  <button class="btn btn-primary"><i class="ti ti-device-floppy me-2"></i>Simpan</button>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
@endsection