@php
    $selisih = $periode->tahun_akhir - $periode->tahun_awal + 1;
@endphp
<div id="tableSasaranRenstra" class="table-responsive" style="border-radius:2px !important; width:100%;">
    <table class="table table-bordered table-hover table-sm">
        <thead>
        <tr>
            <th rowspan="2" colspan="3" style="vertical-align: middle; width:10px !important;">
                SASARAN
            </th>
            <th rowspan="2" colspan="3" style="vertical-align: middle;">
                INDIKATOR SASARAN
            </th>
            <th rowspan="2" style="vertical-align: middle;" class="text-center">
                SATUAN
            </th>
            <th colspan="5" style="vertical-align: middle;" class="text-center">
                TARGET
            </th>
        </tr>
        <tr>
            @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                <th class="text-center">{!! $i !!}</th>
            @endfor
        </tr>
        </thead>
        <tbody>
        @if($renstraSasaran->isNotEmpty())
            @foreach($renstraSasaran as $idxTujuan => $tujuan)
                @php
                    $idxTujuan = $idxTujuan + 1;
                @endphp
                <tr>
                    <td colspan="{{ 8 + $selisih }}" class="bg-inverse-info-muted text-info">
                        <small>
                            <b>
                                Tujuan {!! $idxTujuan !!} : {!! $tujuan->tujuan !!}
                            </b>
                        </small>
                    </td>
                </tr>

                @foreach($tujuan->renstraSasaran as $idxSasaran => $sasaran)
                    @php
                        $idxSasaran = $idxSasaran + 1;
                        $indikators = $sasaran->renstraSasaranIndikator;
                        $indikatorCount = $indikators->count();
                    @endphp

                    @if($indikatorCount < 2)

                        <tr data-tujuan="{!! $idxTujuan.'. '.$tujuan->tujuan !!}">
                            <td class="text-center">
                                <small>
                                    <div class="dropdown">
                                        <button class="btn p-0" type="button" id="dropdownMenuButton"
                                                data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                            <i class="icon-lg text-muted pb-3px" data-feather="settings"></i>
                                        </button>
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a class="dropdown-item d-flex align-items-center renstraEditSasaran"
                                               href="#"
                                               data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="edit-2" class="icon-sm mr-1"></i>
                                                <span class="">Ubah</span>
                                            </a>
                                            <a class="dropdown-item d-flex align-items-center renstraDestroySasaran"
                                               href="#" data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="trash" class="icon-sm mr-1"></i>
                                                <span class="">Hapus</span>
                                            </a>
                                            <div class="dropdown-divider"></div>
                                            <a class="dropdown-item d-flex align-items-center renstraAddSasaranIndikator"
                                               href="#"
                                               data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="plus-circle" class="icon-sm mr-1"></i>
                                                <span class="">Tambah Indikator</span>
                                            </a>
                                        </div>
                                    </div>
                                </small>
                            </td>
                            <td class="text-center">
                                <small>
                                    {!! $idxSasaran !!}
                                </small>
                            </td>
                            <td>
                                <small>
                                    {!! $sasaran->sasaran !!}
                                </small>
                            </td>
                            @if($indikatorCount > 0)
                                @php
                                    $indikator = $indikators->first();
                                    $indikatorTarget = $indikator->renstraSasaranIndikatorTarget;
                                @endphp

                                <td class="text-center">
                                    <small>
                                        <div class="dropdown">
                                            <button class="btn p-0" type="button" id="dropdownMenuButton"
                                                    data-toggle="dropdown"
                                                    aria-haspopup="true" aria-expanded="false">
                                                <i class="icon-lg text-muted pb-3px" data-feather="settings"></i>
                                            </button>
                                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                                <a class="dropdown-item d-flex align-items-center renstraEditSasaranIndikator"
                                                   href="#"
                                                   data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                    <i data-feather="edit-2" class="icon-sm mr-1"></i>
                                                    <span class="">Ubah</span>
                                                </a>
                                                <a class="dropdown-item d-flex align-items-center renstraDestroySasaranIndikator"
                                                   href="#"
                                                   data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                    <i data-feather="trash" class="icon-sm mr-1"></i>
                                                    <span class="">Hapus</span>
                                                </a>
                                            </div>
                                        </div>
                                    </small>
                                </td>
                                <td class="text-center">
                                    <small>
                                        1
                                    </small>
                                </td>
                                <td>
                                    <small>
                                        {!! $indikator->indikator; !!}
                                    </small>
                                </td>
                                <td class="text-center">
                                    <small>
                                        {!! $indikator->satuan; !!}
                                    </small>
                                </td>
                                @if($indikatorTarget->isNotEmpty())
                                    @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                        <td class="text-center">
                                            <small>
                                                @if($indikatorTarget->where('tahun', $i)->first()->target != 0)
                                                    {!! $indikatorTarget->where('tahun', $i)->first()->target; !!}
                                                @else
                                                    N/A
                                                @endif
                                            </small>
                                        </td>
                                    @endfor
                                @else
                                    @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                        <td class="text-center">-</td>
                                    @endfor
                                @endif

                            @else
                                @for($i=1; $i <= 9; $i++)
                                    <td class="text-center"></td>
                                @endfor
                            @endif
                        </tr>

                    @else
                        @php
                            $indikator = $indikators->first();
                            $indikatorTarget = $indikator->renstraSasaranIndikatorTarget;
                        @endphp

                        <tr data-tujuan="{!! $idxTujuan.'. '.$tujuan->tujuan !!}">
                            <td rowspan="{!! $indikatorCount !!}" class="text-center">
                                <small>
                                    <div class="dropdown">
                                        <button class="btn p-0" type="button" id="dropdownMenuButton"
                                                data-toggle="dropdown"
                                                aria-haspopup="true" aria-expanded="false">
                                            <i class="icon-lg text-muted pb-3px" data-feather="settings"></i>
                                        </button>
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a class="dropdown-item d-flex align-items-center renstraEditSasaran"
                                               href="#" data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="edit-2" class="icon-sm mr-1"></i>
                                                <span class="">Ubah</span>
                                            </a>
                                            <a class="dropdown-item d-flex align-items-center renstraDestroySasaran"
                                               href="#" data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="trash" class="icon-sm mr-1"></i>
                                                <span class="">Hapus</span>
                                            </a>
                                            <div class="dropdown-divider"></div>
                                            <a class="dropdown-item d-flex align-items-center renstraAddSasaranIndikator"
                                               href="#"
                                               data-sasaran-id="{!! encrypt($sasaran->id) !!}">
                                                <i data-feather="plus-circle" class="icon-sm mr-1"></i>
                                                <span class="">Tambah Indikator</span>
                                            </a>
                                        </div>
                                    </div>
                                </small>
                            </td>
                            <td rowspan="{!! $indikatorCount !!}" class="text-center">
                                <small>
                                    {!! $idxSasaran !!}
                                </small>
                            </td>
                            <td rowspan="{!! $indikatorCount !!}">
                                <small>
                                    {!! $sasaran->sasaran !!}
                                </small>
                            </td>

                            <td class="text-center">
                                <small>
                                    <div class="dropdown">
                                        <button class="btn p-0" type="button" id="dropdownMenuButton"
                                                data-toggle="dropdown"
                                                aria-haspopup="true" aria-expanded="false">
                                            <i class="icon-lg text-muted pb-3px" data-feather="settings"></i>
                                        </button>
                                        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                            <a class="dropdown-item d-flex align-items-center renstraEditSasaranIndikator"
                                               href="#" data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                <i data-feather="edit-2" class="icon-sm mr-1"></i>
                                                <span class="">Ubah</span>
                                            </a>
                                            <a class="dropdown-item d-flex align-items-center renstraDestroySasaranIndikator"
                                               href="#"
                                               data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                <i data-feather="trash" class="icon-sm mr-1"></i>
                                                <span class="">Hapus</span>
                                            </a>
                                        </div>
                                    </div>
                                </small>
                            </td>
                            <td class="text-center">
                                <small>
                                    1
                                </small>
                            </td>
                            <td>
                                <small>
                                    {!! $indikator->indikator; !!}
                                </small>
                            </td>
                            <td class="text-center">
                                <small>
                                    {!! $indikator->satuan; !!}
                                </small>
                            </td>
                            @if($indikatorTarget->isNotEmpty())
                                @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                    <td class="text-center">
                                        <small>
                                            @if($indikatorTarget->where('tahun', $i)->first()->target != 0)
                                                {!! $indikatorTarget->where('tahun', $i)->first()->target; !!}
                                            @else
                                                N/A
                                            @endif
                                        </small>
                                    </td>
                                @endfor
                            @else
                                @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                    <td class="text-center">-</td>
                                @endfor
                            @endif
                        </tr>

                        @foreach($indikators->slice(1) as $idxIndikator => $indikator)
                            @php
                                $idxIndikator = $idxIndikator + 1;
                                $indikatorTarget = $indikator->renstraSasaranIndikatorTarget;
                            @endphp

                            <tr>
                                <td class="text-center">
                                    <small>
                                        <div class="dropdown">
                                            <button class="btn p-0" type="button" id="dropdownMenuButton"
                                                    data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                <i class="icon-lg text-muted pb-3px" data-feather="settings"></i>
                                            </button>
                                            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                                <a class="dropdown-item d-flex align-items-center renstraEditSasaranIndikator"
                                                   href="#" data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                    <i data-feather="edit-2" class="icon-sm mr-1"></i>
                                                    <span class="">Ubah</span>
                                                </a>
                                                <a class="dropdown-item d-flex align-items-center renstraDestroySasaranIndikator"
                                                   href="#"
                                                   data-sasaran-indikator-id="{!! encrypt($indikator->id) !!}">
                                                    <i data-feather="trash" class="icon-sm mr-1"></i>
                                                    <span class="">Hapus</span>
                                                </a>
                                            </div>
                                        </div>
                                    </small>
                                </td>
                                <td class="text-center">
                                    <small>
                                        {!! $idxIndikator !!}
                                    </small>
                                </td>
                                <td>
                                    <small>
                                        {!! $indikator->indikator; !!}
                                    </small>
                                </td>
                                <td class="text-center">
                                    <small>
                                        {!! $indikator->satuan; !!}
                                    </small>
                                </td>

                                @if($indikatorTarget->isNotEmpty())
                                    @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                        <td class="text-center">
                                            <small>
                                                @if($indikatorTarget->where('tahun', $i)->first()->target != 0)
                                                    {!! $indikatorTarget->where('tahun', $i)->first()->target; !!}
                                                @else
                                                    N/A
                                                @endif
                                            </small>
                                        </td>
                                    @endfor
                                @else
                                    @for($i=$periode->tahun_awal; $i <= $periode->tahun_akhir; $i++)
                                        <td class="text-center">-</td>
                                    @endfor
                                @endif
                            </tr>

                        @endforeach
                    @endif
                @endforeach
            @endforeach
        @else
            <tr>
                <td colspan="{{ 8 + $selisih }}">Data tidak ditemukan</td>
            </tr>
        @endif
    </table>
</div>