175 lines
8.6 KiB
PHP
175 lines
8.6 KiB
PHP
@extends('admin.layouts.app')
|
||
|
||
@section('header')
|
||
<!-- Page Header -->
|
||
<div class="bg-header text-white p-4 rounded-lg shadow-md flex justify-between items-center">
|
||
<h1 class="text-2xl font-medium">Basis Pengetahuan</h1>
|
||
<span class="text-sm">Good morning, <span class="font-bold">{{ Auth::user()->name }}</span></span>
|
||
</div>
|
||
@endsection
|
||
|
||
@section('content')
|
||
<div class="mt-6 bg-white p-6 rounded-lg shadow">
|
||
<!-- Title and Subheading -->
|
||
<div class="mb-4">
|
||
<h3 class="text-lg font-bold">Basis Pengetahuan</h3>
|
||
<p class="text-sm text-gray-500">View the existing Knowledge Base</p>
|
||
</div>
|
||
|
||
<!-- Search & Add Bar -->
|
||
<div class="flex justify-between items-center mb-4">
|
||
<button class="text-gray-600 flex items-center">
|
||
<i class="bi bi-funnel mr-1"></i> Filters
|
||
</button>
|
||
<div class="flex items-center space-x-2">
|
||
<div class="relative">
|
||
<input type="text" placeholder="Search Basis"
|
||
class="pl-8 pr-4 py-2 border rounded-lg bg-gray-100 w-56">
|
||
<i class="bi bi-search absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400"></i>
|
||
</div>
|
||
<button id="btnTambah" class="bg-teal-500 text-white px-4 py-2 rounded-lg flex items-center">
|
||
<i class="bi bi-plus-lg mr-2"></i> Add
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Data Table -->
|
||
<table class="w-full border-collapse bg-white shadow rounded-lg">
|
||
<thead class="bg-gray-100 border-b">
|
||
<tr>
|
||
<th class="p-3 text-gray-600">No</th>
|
||
<th class="p-3 text-gray-600">Kecerdasan</th>
|
||
<th class="p-3 text-gray-600">Kriteria</th>
|
||
<th class="p-3 text-gray-600">CF</th>
|
||
<th class="p-3 text-gray-600">Aksi</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
@foreach ($basis as $i => $b)
|
||
<tr class="border-b hover:bg-gray-50">
|
||
<td class="p-3">{{ $i + 1 }}</td>
|
||
<td>{{ optional($b->kecerdasan)->nama ?? '–' }}</td>
|
||
<td>{{ optional($b->kriteria)->nama ?? '–' }}</td>
|
||
|
||
<td class="p-3">{{ number_format($b->nilai, 2) }}</td>
|
||
<td class="p-3 flex space-x-2">
|
||
<button
|
||
onclick="openEditModal({{ $b->id }}, '{{ $b->nilai }}', '{{ $b->kecerdasan_id }}', '{{ $b->kriteria_id }}')"
|
||
class="bg-yellow-500 hover:bg-yellow-600 text-white px-3 py-1 rounded-lg flex items-center">
|
||
<i class="bi bi-pencil-square mr-1"></i> Edit
|
||
</button>
|
||
<form action="{{ route('admin.basispengetahuan.destroy', $b) }}" method="POST"
|
||
onsubmit="return confirm('Yakin ingin menghapus data?')">
|
||
@csrf @method('DELETE')
|
||
<button
|
||
class="bg-red-500 hover:bg-red-600 text-white px-3 py-1 rounded-lg flex items-center">
|
||
<i class="bi bi-trash-fill mr-1"></i> Delete
|
||
</button>
|
||
</form>
|
||
</td>
|
||
</tr>
|
||
@endforeach
|
||
</tbody>
|
||
</table>
|
||
|
||
<!-- Modal Form -->
|
||
<div id="modalForm" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50 hidden">
|
||
<div class="bg-white rounded-2xl shadow-2xl w-full max-w-md p-6">
|
||
<h2 id="modalTitle" class="text-xl font-semibold mb-4">Tambah Basis</h2>
|
||
<form id="formBasis" action="" method="POST" class="space-y-4">
|
||
@csrf
|
||
<input type="hidden" name="_method" id="methodInput" value="POST">
|
||
|
||
<div>
|
||
<label for="kecerdasanField" class="block text-sm font-medium">Kecerdasan</label>
|
||
<select name="kecerdasan_id" id="kecerdasanField" class="mt-1 block w-full border rounded px-3 py-2"
|
||
required>
|
||
<option value="" disabled selected>Pilih kecerdasan</option>
|
||
@foreach ($kecerdasans as $kec)
|
||
<option value="{{ $kec->id }}">{{ $kec->nama }}</option>
|
||
@endforeach
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label for="kriteriaField" class="block text-sm font-medium">Kriteria</label>
|
||
<select name="kriteria_id" id="kriteriaField" class="mt-1 block w-full border rounded px-3 py-2"
|
||
required>
|
||
<option value="" disabled selected>Pilih kriteria</option>
|
||
@foreach ($kriterias as $k)
|
||
<option value="{{ $k->id }}">{{ $k->nama }}</option>
|
||
@endforeach
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label for="nilaiField" class="block text-sm font-medium">Nilai (0–1)</label>
|
||
<input type="number" step="0.01" min="0" max="1" name="nilai" id="nilaiField"
|
||
class="mt-1 block w-full border rounded px-3 py-2" required>
|
||
</div>
|
||
|
||
<div class="flex justify-end space-x-3 pt-4">
|
||
<button type="button" id="btnBatal" class="px-4 py-2 rounded-lg hover:underline">Batal</button>
|
||
<button type="submit"
|
||
class="bg-blue-500 hover:bg-blue-600 text-white px-4 py-2 rounded-lg flex items-center">
|
||
<i id="modalIcon" class="bi bi-check-lg mr-1"></i>
|
||
<span id="modalButtonText">Simpan</span>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
@endsection
|
||
|
||
@push('scripts')
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
const btnTambah = document.getElementById('btnTambah');
|
||
const modal = document.getElementById('modalForm');
|
||
const btnBatal = document.getElementById('btnBatal');
|
||
const form = document.getElementById('formBasis');
|
||
const methodInput = document.getElementById('methodInput');
|
||
const nilaiField = document.getElementById('nilaiField');
|
||
const kecField = document.getElementById('kecerdasanField');
|
||
const kriField = document.getElementById('kriteriaField');
|
||
const modalTitle = document.getElementById('modalTitle');
|
||
const modalIcon = document.getElementById('modalIcon');
|
||
const modalText = document.getElementById('modalButtonText');
|
||
const storeUrl = '{{ route('admin.basispengetahuan.store') }}';
|
||
|
||
function openModal(isEdit = false, data = {}) {
|
||
if (isEdit) {
|
||
modalTitle.textContent = 'Edit Basis';
|
||
form.action = `/admin/basispengetahuan/${data.id}`;
|
||
methodInput.value = 'PUT';
|
||
nilaiField.value = data.nilai;
|
||
kecField.value = data.kecerdasan_id;
|
||
kriField.value = data.kriteria_id;
|
||
modalIcon.className = 'bi bi-pencil-fill mr-1';
|
||
modalText.textContent = 'Update';
|
||
} else {
|
||
modalTitle.textContent = 'Tambah Basis';
|
||
form.action = storeUrl;
|
||
methodInput.value = 'POST';
|
||
nilaiField.value = '';
|
||
kecField.value = '';
|
||
kriField.value = '';
|
||
modalIcon.className = 'bi bi-check-lg mr-1';
|
||
modalText.textContent = 'Simpan';
|
||
}
|
||
modal.classList.remove('hidden');
|
||
}
|
||
|
||
btnTambah.addEventListener('click', () => openModal());
|
||
btnBatal.addEventListener('click', () => modal.classList.add('hidden'));
|
||
window.openEditModal = (id, nilai, kec, kri) => openModal(true, {
|
||
id,
|
||
nilai,
|
||
kecerdasan_id: kec,
|
||
kriteria_id: kri
|
||
});
|
||
});
|
||
</script>
|
||
@endpush
|