<!DOCTYPE html>
<html lang="en">
<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Admin Dashboard</title>
	<meta content='width=device-width, initial-scale=1.0, shrink-to-fit=no' name='viewport'>
	
	<!-- Fonts and icons -->
	<script src="{{ asset('admin/js/plugin/webfont/webfont.min.js') }}"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">

	<script>
		WebFont.load({
			google: {"families":["Lato:300,400,700,900"]},
			custom: {"families":["Flaticon", "Font Awesome 5 Solid", "Font Awesome 5 Regular", "Font Awesome 5 Brands", "simple-line-icons"], urls: ['../assets/css/fonts.min.css']},
			active: function() {
				sessionStorage.fonts = true;
			}
		});
	</script>

	<!-- CSS Files -->
	<link rel="stylesheet" href="{{ asset('admin/css/bootstrap.min.css') }}">
	<link rel="stylesheet" href="{{ asset('admin/css/atlantis.css') }}">
</head>

<body>
	<div class="wrapper">
	<div class="main-header">

	<!-- Logo Header -->
	<div class="logo-header" data-background-color="blue">		
		<div class="nav-toggle">
			<button class="btn btn-toggle toggle-sidebar"><i class="fas fa-bars"></i></button>
		</div>
	</div>
	<!-- End Logo Header -->

	<!-- Navbar Header -->
    @include('admin.navbar')
	<!-- End Navbar -->
	</div>

	<!-- Sidebar -->
    @include('admin.sidebar')
	<!-- End Sidebar -->

    <!-- Main Panel -->
    <div class="main-panel">
    <div class="content">
    <div class="panel-header bg-primary-gradient">
    <div class="page-inner py-5">
    <div class="d-flex align-items-left align-items-md-center flex-column flex-md-row">

    </div>  
    </div>  
    </div>  

    <div class="page-inner mt--5">
    <div class="row mt--2">
    <div class="col-12">
    <div class="card">
    <div class="card-header">
    <div class="card-head-row">
    <div class="card-tools">
        <a href="{{ route('download.opsub') }}" class="btn btn-info btn-border btn-round btn-sm">
        <span class="btn-label"><i class="fa fa-print"></i></span>
        Cetak
        </a>
    </div>
    </div>
    </div>
                        
    <div class="card-body">
    <!-- Button -->
    <div class="d-flex justify-content-between align-items-center mb-4 p-3">
        <div>
            <h4 class="card-title mb-1">Manajemen Opsi Subkriteria</h4>
            <p class="card-category text-muted mb-0">Mengelola dan memperbarui informasi sesuai kebutuhan secara tertata dan menyeluruh.</p>
        </div>
            <button class="btn btn-sm btn-primary btn-round" data-toggle="modal" data-target="#addRowModal"><i class="fa fa-plus"></i> Tambah</button>
    </div>

    <!-- Add Modal -->
    <div class="modal fade" id="addRowModal" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog" role="document">
    <div class="modal-content">
    <div class="modal-header">
        <h4 class="modal-title"><span class="fw-mediumbold">Tambah Data</span></h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    </div>
    <div class="modal-body">
        <p style="font-size: 0.9rem;" class="text-muted mb-3">Gunakan formulir ini untuk menambahkan entri baru. Pastikan seluruh data diisi dengan benar.</p>
        <form action="{{ route('tambah.opsub') }}" method="POST">
        @csrf
        <div class="form-group">
            <label for="subkriteria_id">Subkriteria</label>
            <select class="form-control input-square" id="subkriteria_id" name="subkriteria_id" required>
                <option value="">Pilih Subkriteria</option>   
                @foreach($subkriterias as $subkriteria)
                <option value="{{ $subkriteria->id }}">{{ $subkriteria->pertanyaan }}</option>
                @endforeach
            </select>
        </div>
        <div class="form-group">
            <label for="alternatif_id">Alternatif</label>
            <select class="form-control input-square" id="alternatif_id" name="alternatif_id" required>
                <option value="">Pilih Alternatif</option>
                @foreach($alternatifs as $alternatif)
                <option value="{{ $alternatif->id }}">{{ $alternatif->nama }}</option>
                @endforeach
            </select>
        </div>
        <div class="form-group">
            <label for="nama">Nama Opsi</label>
            <input type="text" class="form-control input-square" id="opsi" name="opsi" placeholder="Masukkan Nama Opsi" required>
        </div>
        <div class="form-group">
            <label for="crips_id">Crips</label>
            <select class="form-control input-square" id="crips_id" name="crips_id" required>
                <option value="">Pilih Nilai</option>
                @foreach($crips as $crip)
                <option value="{{ $crip->id }}">{{ $crip->nilai }}</option>
                @endforeach
            </select>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-primary">Tambah</button>
            <button type="button" class="btn btn-danger" data-dismiss="modal">Batal</button>
        </div>
        </form>
    </div>
    </div>
    </div>
    </div>

    <!-- Update Modal -->
<div class="modal fade" id="updateRowModal" tabindex="-1" role="dialog" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h4 class="modal-title"><span class="fw-mediumbold">Update Data</span></h4>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <p style="font-size: 0.9rem;" class="text-muted mb-3">
          Gunakan formulir ini untuk mengupdate entri yang dipilih. Pastikan seluruh data diisi dengan benar.
        </p>
        <form id="formUpdateOpsi" method="POST">
          @csrf
          @method('PUT')

          <div class="form-group">
            <label for="updateSubkriteria_id">Subkriteria</label>
            <select class="form-control input-square" id="updateSubkriteria_id" name="subkriteria_id" required>
              <option value="">Pilih Subkriteria</option>
              @foreach($subkriterias as $subkriteria)
              <option value="{{ $subkriteria->id }}">{{ $subkriteria->pertanyaan }}</option>
              @endforeach
            </select>
          </div>

          <div class="form-group">
            <label for="updateAlternatif_id">Alternatif</label>
            <select class="form-control input-square" id="updateAlternatif_id" name="alternatif_id" required>
              <option value="">Pilih Alternatif</option>
              @foreach($alternatifs as $alternatif)
              <option value="{{ $alternatif->id }}">{{ $alternatif->nama }}</option>
              @endforeach
            </select>
          </div>

          <div class="form-group">
            <label for="updateOpsi">Opsi</label>
            <input type="text" class="form-control input-square" id="updateOpsi" name="opsi" placeholder="Masukkan Nama Opsi" required>
          </div>

          <div class="form-group">
            <label for="updateCrips_id">Crips</label>
            <select class="form-control input-square" id="updateCrips_id" name="crips_id" required>
              <option value="">Pilih Nilai</option>
              @foreach($crips as $crip)
              <option value="{{ $crip->id }}">{{ $crip->nilai }}</option>
              @endforeach
            </select>
          </div>

          <div class="modal-footer">
            <button type="submit" class="btn btn-primary">Update</button>
            <button type="button" class="btn btn-danger" data-dismiss="modal">Batal</button>
          </div>
        </form>
      </div>
    </div>
  </div>
</div>


                            <!-- Table -->
                            <div class="table-responsive">
                                <table id="add-row" class="display table table-striped table-hover">
                                    <thead>
                                        <tr>
                                            <th>No</th>
                                            <th>Subkriteria</th>
                                            <th>Alternatif</th>
                                            <th>Opsi</th>
                                            <th>Nilai</th>
                                            <th>Aksi</th>
                                        </tr>
                                    </thead>
                                    <tfoot>
                                        <tr>
                                            <th>No</th>
                                            <th>Subkriteria</th>
                                            <th>Alternatif</th>
                                            <th>Opsi</th>
                                            <th>Nilai</th>
                                            <th>Aksi</th>
                                        </tr>
                                    </tfoot>
                                    <tbody>
    @php $counter = 1; @endphp
    @foreach($subkriterias as $subkriteria)
        @foreach($subkriteria->opsisubkriterias as $opsisubkriteria)
            <tr>
                <td>{{ $counter }}</td>
                <td>{{ $subkriteria->pertanyaan }}</td>
                <td>{{ $opsisubkriteria->alternatif->nama }}</td>
                <td>{{ $opsisubkriteria->opsi }}</td>
                <td>{{ $opsisubkriteria->crips->nilai }}</td>
                <td>
                    <button type="button" class="btn btn-link text-primary editBtn"
                    data-id="{{ $opsisubkriteria->id }}"
                    data-opsi="{{ $opsisubkriteria->opsi }}"
                    data-alternatif_id="{{ $opsisubkriteria->alternatif_id }}"
                    data-subkriteria_id="{{ $opsisubkriteria->subkriteria_id }}"
                    data-crips_id="{{ $opsisubkriteria->crips_id }}"
                    data-toggle="modal" data-target="#updateRowModal">
                    <i class="fa fa-edit"></i>
                    </button>
                    <a href="{{ route('hapus.opsub', $opsisubkriteria->id) }}" class="btn btn-link text-danger" title="Hapus">
                        <i class="fas fa-trash-alt"></i>
                    </a>
                </td>
            </tr>
            @php $counter++; @endphp
        @endforeach
    @endforeach
</tbody>
                                </table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- End Main Panel -->




     
	</div>
	</div>
<!-- Script Files -->
@include('admin.script')
<script>
    // Inisialisasi DataTable
       // Inisialisasi DataTable
    var table = $('#add-row').DataTable({
            "pageLength": 10,
            "language": {
                "search": "Cari:",
                "lengthMenu": "Tampilkan _MENU_ data per halaman",
                "zeroRecords": "Tidak ada data yang ditemukan",
                "info": "Menampilkan halaman _PAGE_ dari _PAGES_",
                "infoEmpty": "Tidak ada data tersedia",
                "infoFiltered": "(difilter dari _MAX_ total data)"
            }
    });
</script>
<script>
    // Edit tombol untuk Opsi Subkriteria dengan event delegation
    $(document).on('click', '.editBtn', function () {
        let id = $(this).data('id');
        let opsi = $(this).data('opsi');
        let subkriteriaId = $(this).data('subkriteria_id');
        let alternatifId = $(this).data('alternatif_id');
        let cripsId = $(this).data('crips_id');

        // Mengisi nilai ke form update
        $('#updateOpsi').val(opsi);
        $('#updateSubkriteria_id').val(subkriteriaId);
        $('#updateAlternatif_id').val(alternatifId);
        $('#updateCrips_id').val(cripsId);

        // Set action form update
        $('#formUpdateOpsi').attr('action', '/admin/opsisubkriteria/update/' + id);
    });
</script>

<script>
    $(document).on('click', '.hapusBtn', function (e) {
        if (confirm("Apakah Anda yakin ingin menghapus data ini?")) {
            $.ajax({
                url: '/admin/opsisubkriteria/hapus/' + id,
                type: 'DELETE',
                data: {
                    _token: '{{ csrf_token() }}',
                },
                success: function(response) {
                    alert('Data berhasil dihapus');
                    location.reload();
                },
                error: function(xhr, status, error) {
                    alert('Terjadi kesalahan: ' + error);
                }
            });
        }
    });
</script>


<!-- End Script Files -->
</body>
</html>