232 lines
7.3 KiB
PHP
232 lines
7.3 KiB
PHP
@extends('user.layout')
|
|
@section('title','Hasil Klasifikasi')
|
|
@section('content')
|
|
<div class="modal fade" tabindex="-1" id="modalCalcClass" aria-labelledby="modalCalcClassLabel" role="dialog"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 id="modalCalcClassLabel" class="modal-title">
|
|
Hitung Klasifikasi
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Pilih tipe data yang akan dihitung hasil klasifikasinya.</p>
|
|
<form id="formCalcClass">@csrf
|
|
<div class="position-relative">
|
|
<select class="form-select" name="tipe" id="calc-select" required>
|
|
<option value="train">Data Training (Data Latih)</option>
|
|
<option value="test" selected>Data Testing (Data Uji)</option>
|
|
</select>
|
|
<div class="invalid-feedback" id="calc-error"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
<i class="fas fa-x"></i> Batal
|
|
</button>
|
|
<button type="submit" class="btn btn-primary" form="formCalcClass">
|
|
<i class="fas fa-calculator"></i> Hitung
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal fade" tabindex="-1" id="modalResetClass" aria-labelledby="modalResetClassLabel" role="dialog"
|
|
aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header bg-danger">
|
|
<h5 id="modalResetClassLabel" class="modal-title text-white">
|
|
Reset Klasifikasi?
|
|
</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<p>Anda akan mereset hasil klasifikasi.
|
|
Pilih tipe data yang akan direset hasil klasifikasinya.</p>
|
|
<form id="formResetClass">@csrf
|
|
<div class="position-relative">
|
|
<select class="form-select" name="tipe" id="reset-select" required>
|
|
<option value="" selected>Pilih</option>
|
|
<option value="train">Data Training (Data Latih)</option>
|
|
<option value="test">Data Testing (Data Uji)</option>
|
|
<option value="all">Semua</option>
|
|
</select>
|
|
<div class="invalid-tooltip" id="reset-error"></div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
|
|
<i class="fas fa-x"></i> Batal
|
|
</button>
|
|
<button type="submit" class="btn btn-danger" form="formResetClass">
|
|
<i class="fas fa-check"></i> Reset
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="btn-group mb-2" role="button">
|
|
@if (auth()->user()->level==1)
|
|
<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#modalCalcClass">
|
|
<i class="fas fa-calculator"></i> Hitung
|
|
</button>
|
|
<button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#modalResetClass">
|
|
<i class="fa-solid fa-arrow-rotate-right"></i> Reset
|
|
</button>
|
|
@endif
|
|
<button class="btn btn-success dropdown-toggle" id="expBtn" type="button" data-bs-toggle="dropdown"
|
|
aria-expanded="false" disabled>
|
|
<i class="fas fa-download"></i> Ekspor <i class="fa-solid fa-caret-down"></i>
|
|
</button>
|
|
<ul class="dropdown-menu">
|
|
<li>
|
|
<a class="dropdown-item" href="{{route('class.export','test')}}">
|
|
Data Testing
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item" href="{{route('class.export','train')}}">
|
|
Data Training
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a class="dropdown-item" href="{{route('class.export','all')}}">
|
|
Semua Data
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<table class="table table-bordered" id="table-classify" width="100%">
|
|
<thead>
|
|
<tr>
|
|
<th>#</th>
|
|
<th>Nama</th>
|
|
<th>Tipe Data</th>
|
|
<th>{{$hasil[true]}}</th>
|
|
<th>{{$hasil[false]}}</th>
|
|
<th>Kelas Prediksi Sistem</th>
|
|
<th>Kelas Prediksi Pakar</th>
|
|
</tr>
|
|
</thead>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
@section('js')
|
|
<script type="text/javascript">
|
|
let dt_classify = $("#table-classify"), errmsg;
|
|
$(document).ready(function () {
|
|
try {
|
|
$.fn.dataTable.ext.errMode = "none";
|
|
dt_classify = dt_classify.DataTable({
|
|
stateSave: true,
|
|
lengthChange: false,
|
|
serverSide: true,
|
|
processing: true,
|
|
responsive: true,
|
|
searching: false,
|
|
ajax: "{{ route('class.datatable') }}",
|
|
columns: [
|
|
{ data: "id" },
|
|
{ data: "name" },
|
|
{ data: "type" },
|
|
{ data: "true" },
|
|
{ data: "false" },
|
|
{ data: "predicted" },
|
|
{ data: "real" }
|
|
],
|
|
columnDefs: [{
|
|
targets: 0,
|
|
render: function (data, type, full, meta) {
|
|
return meta.settings._iDisplayStart + meta.row + 1;
|
|
}
|
|
}],
|
|
language: {
|
|
url: "https://cdn.datatables.net/plug-ins/2.0.0/i18n/id.json"
|
|
},
|
|
drawCallback: function(){
|
|
if(this.api().page.info().recordsTotal===0)
|
|
$('#expBtn').prop('disabled',true);
|
|
else $('#expBtn').prop('disabled',false);
|
|
}
|
|
}).on("dt-error", function (e, settings, techNote, message) {
|
|
errorDT(message, techNote);
|
|
});
|
|
} catch (dterr) {
|
|
initError(dterr.message);
|
|
}
|
|
});
|
|
$("#formResetClass").submit(function(e){
|
|
e.preventDefault();
|
|
$.ajax({
|
|
type: "DELETE",
|
|
data: $("#formResetClass").serialize(),
|
|
dataType: 'JSON',
|
|
url: "{{route('class.reset')}}",
|
|
beforeSend: function(){
|
|
Notiflix.Loading.standard('Mereset');
|
|
$('#reset-select').removeClass('is-invalid');
|
|
},
|
|
complete: function(){
|
|
Notiflix.Loading.remove();
|
|
},
|
|
success: function () {
|
|
if ($.fn.DataTable.isDataTable("#table-classify")) dt_classify.draw();
|
|
$("#modalResetClass").modal('hide');
|
|
Notiflix.Notify.success("Berhasil direset");
|
|
},
|
|
error: function (xhr, st) {
|
|
if (xhr.status === 422 || xhr.status === 400){
|
|
errmsg = xhr.responseJSON.message;
|
|
$('#reset-select').addClass('is-invalid');
|
|
$("#reset-error").text(xhr.responseJSON.message);
|
|
} else {
|
|
console.warn(xhr.responseJSON.message ?? st);
|
|
errmsg = `Kesalahan HTTP ${xhr.status}. ${xhr.statusText}`;
|
|
}
|
|
Notiflix.Notify.failure('Gagal reset: ' + errmsg);
|
|
}
|
|
});
|
|
});
|
|
$("#formCalcClass").submit(function(e){
|
|
e.preventDefault();
|
|
$.ajax({
|
|
url: "{{ route('class.create') }}",
|
|
type: "POST",
|
|
data: $("#formCalcClass").serialize(),
|
|
dataType: 'JSON',
|
|
beforeSend: function(){
|
|
resetvalidation();
|
|
Notiflix.Loading.standard('Menghitung');
|
|
},
|
|
complete: function(){
|
|
Notiflix.Loading.remove();
|
|
},
|
|
success: function (data) {
|
|
if ($.fn.DataTable.isDataTable("#table-classify")) dt_classify.draw();
|
|
$("#modalCalcClass").modal('hide');
|
|
Notiflix.Notify.success("Berhasil dihitung");
|
|
},
|
|
error: function (xhr, st) {
|
|
if (xhr.status === 422 || xhr.status === 400){
|
|
errmsg = xhr.responseJSON.message;
|
|
$('#calc-select').addClass('is-invalid');
|
|
$("#calc-error").text(xhr.responseJSON.message);
|
|
} else {
|
|
console.warn(xhr.responseJSON.message ?? st);
|
|
errmsg = `Gagal hitung: Kesalahan HTTP ${xhr.status}. ${xhr.statusText}`;
|
|
}
|
|
Notiflix.Notify.failure(errmsg);
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
@endsection
|