Scribd
Upload
44 views

Index Regis

This document contains code for a student registration page in Laravel. It displays the student's profile information and notes from their academic advisor. Tables are used to display available courses for each year/level that are awaiting approval. Styling is applied using CSS.

Uploaded by

Fadli Achsan
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
44 views

Index Regis

This document contains code for a student registration page in Laravel. It displays the student's profile information and notes from their academic advisor. Tables are used to display available courses for each year/level that are awaiting approval. Styling is applied using CSS.

Uploaded by

Fadli Achsan
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 13

@extends('layouts.

layout')
@section('url_back', url('pmo/master/tpp'))
@section('page_title', 'Registrasi')
@section('css_section')
<style>
.row {
margin-left: -5px;
margin-right: -5px;
}

.column {
float: left;
width: 100%;
/* padding: 5px; */
}

/* Clearfix (clear floats) */


.row::after {
content: "";
clear: both;
display: table;
}

table {
border-collapse: collapse;
width: 480px;
border-spacing: 0;
border: 1px solid #ddd;
}

th,
td {
text-align: left;
}

tr:nth-child(even) {
background-color: #f2f2f2;
}

.table> :not(caption)>*>* {
padding: 0.5rem 1rem;
}
</style>
@endsection

@section('content')
<div class="content-body">
<div class="row mb-2">
<div class="col">
<h3>Registrasi</h3>
</div>
</div>

<div class="card">
<div class="card-body my-25">
<div class="row">
<div class="col-3">
<span class="fw-bolder">Mahasiswa</span>
</div>
<div class="col-3">
: {{ $name->fullname }}
</div>
<div class="col-3">
<span class="fw-bolder">Tahun Akademik</span>
</div>
<div class="col-3">
: -
</div>
</div>

<div class="row mt-1">


<div class="col-3">
<span class="fw-bolder">Kelas/Program Studi</span>
</div>
<div class="col-3">
: {{ $name->class }} / {{ $name->study_program-
>studyprogramname }}
</div>
<div class="col-3">
<span class="fw-bolder">IP Semester (IPS)</span>
</div>
<div class="col-3">
: -
</div>
</div>

<div class="row mt-1">


<div class="col-3">
<span class="fw-bolder">Dosen Pembimbing Akademik</span>
</div>
<div class="col-3">
: -
</div>
<div class="col-3">
<span class="fw-bolder">IP Kumulatif (IPK)</span>
</div>
<div class="col-3">
: -
</div>
</div>
</div>
</div>
<div class="demo-spacing-0">
<div class="alert alert-danger" role="alert">
<div class="alert-body"><i
data-feather='alert-triangle'></i><strong>Catatan Dosen Wali : </strong> <p>Mata
Kuliah A Harus Diambil</p></div>

</div>
</div>
{{-- Tabel sebelum ACC --}}

<div class="row p-25 match-height belum-registrasi">

<div class="alert alert-warning text-center belum-acc" role="alert">


<div class="alert-body"><strong>Sedang Menunggu ACC.</strong></div>
</div>
{{-- <div class="col-xl-12 col-lg-12">
<div class="card">
<div class="card-body">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link " id="profile-tab" data-bs-
toggle="tab" href="#profile" aria-controls="profile" role="tab" aria-
selected="true">Profile</a>
</li>
<li class="nav-item">
<a class="nav-link" id="arsip-tab" data-bs-
toggle="tab" href="#arsip" aria-controls="arsip" role="tab" aria-
selected="false">Arsip KRS</a>
</li>
<li class="nav-item">
<a class="nav-link" id="rencana-tab" data-bs-
toggle="tab" href="#rencana" aria-controls="rencana" role="tab" aria-
selected="false">Rencana Studi Dan Nilai</a>
</li>
<li class="nav-item">
<a class="nav-link " id="kehadiran-tab" data-bs-
toggle="tab" href="#kehadiran" aria-controls="kehadiran" role="tab" aria-
selected="false">Kehadiran</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane " id="profile" aria-
labelledby="profile-tab" role="tabpanel">
<div class="card-header" style="height:71px;">
<h4 class="card-title">Ditawarkan</h4>
</div>
<div class="tab-content">
<div class="tab-pane active" id="1" aria-
labelledby="1-tab" role="tabpanel">
<div class="card-body">
<div class="table-responsive">
<table class="table text-nowrap
text-center table_matakuliah_tersedia">
<thead>
<tr>
<th
class="aksi">Aksi</th>
<th style="max-width:
70px;">Kode MK</th>
<th>Nama MK</th>
<th>SKS</th>
<th>Kelas</th>
</tr>
</thead>
<tbody class="awal" id="body1">

</tbody>
<tfoot>
<tr class="border-top-dark
border-top-1" id="coba1">
<td class="aksi"><input
type="checkbox" class="all"></td>
<td colspan="2">Total
SKS :</td>
<td
class="total_credit_tersedia">0</td>
<td></td>
</tr>
</tfoot>
</table>
</div>
<div class="col-12 text-end mr-25 mt-
2">
<button type="button" class="btn
btn-primary btn-sm move">Ambil Paket</button>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="arsip" aria-
labelledby="arsip-tab" role="tabpanel">
2
</div>
<div class="tab-pane" id="rencana" aria-
labelledby="rencana-tab" role="tabpanel">
3
</div>
<div class="tab-pane" id="kehadiran" aria-
labelledby="kehadiran-tab" role="tabpanel">
4
</div>
</div>
</div>
</div>
</div> --}}
<div class="col-xl-6 col-12 p-0">
<div class="card me-50">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active" id="tingkat-1-tab" data-bs-
toggle="tab" href="#tingkat-1" aria-controls="tingkat-1" role="tab" aria-
selected="true">Tingkat 1</a>
</li>
<li class="nav-item">
<a class="nav-link" id="tingkat-2-tab" data-bs-
toggle="tab" href="#tingkat-2" aria-controls="tingkat-2" role="tab" aria-
selected="false">Tingkat 2</a>
</li>
<li class="nav-item">
<a class="nav-link" id="tingkat-3-tab" data-bs-
toggle="tab" href="#tingkat-3" aria-controls="tingkat-3" role="tab" aria-
selected="false">Tingkat 3</a>
</li>
<li class="nav-item">
<a class="nav-link" id="tingkat-4-tab" data-bs-
toggle="tab" href="#tingkat-4" aria-controls="tingkat-4" role="tab" aria-
selected="false">Tingkat 4</a>
</li>
</ul>
<div class="card-header" style="height:71px;">
<h4 class="card-title">Ditawarkan</h4>
</div>
<div class="tab-content">
<div class="tab-pane active" id="tingkat-1" aria-
labelledby="tingkat-1-tab" role="tabpanel">
<div class="card-body">
<div class="table-responsive">
<table class="table text-nowrap text-center
table_matakuliah_tersedia">
<thead>
<tr>
<th class="aksi">Aksi</th>
<th style="max-width: 70px;">Kode
MK</th>
<th>Nama MK</th>
<th>SKS</th>
<th>Kelas</th>
</tr>
</thead>
<tbody class="awal" id="body1">

</tbody>
<tfoot>
<tr class="border-top-dark border-top-
1" id="coba1">
<td class="aksi"><input
type="checkbox" class="all"></td>
<td colspan="2">Total SKS :</td>
<td
class="total_credit_tersedia">0</td>
<td></td>
</tr>
</tfoot>
</table>
</div>
<div class="col-12 text-end mr-25 mt-2">
<button type="button" class="btn btn-primary
btn-sm move">Ambil Paket</button>
</div>
</div>
</div>
<div class="tab-pane" id="tingkat-2" aria-
labelledby="tingkat-2-tab" role="tabpanel">Tingkat 2</div>
<div class="tab-pane" id="tingkat-3" aria-
labelledby="tingkat-3-tab" role="tabpanel">Tingkat 3</div>
<div class="tab-pane" id="tingkat-4" aria-
labelledby="tingkat-4-tab" role="tabpanel">Tingkat 4</div>
</div>
</div>
</div>
<div class="col-xl-6 col-12 p-0">
<div class="card ms-50">
<div class="card-header">
<h4 class="card-title">Diambil</h4>
<button class="btn btn-primary btn-sm cek-jadwal" data-bs-
toggle="modal" data-bs-target="#large">Cek
Jadwal</button>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table text-nowrap text-center
table_matakuliah_diambil">
<thead>
<tr>
<th class="aksi">Aksi</th>
<th style="max-width: 70px;">Kode MK</th>
<th>Nama MK</th>
<th>SKS</th>
<th>Kelas</th>
</tr>
</thead>
<tbody id="body2">
</tbody>
<tfoot>
<tr class="border-top-dark border-top-1"
id="coba2">
<td class="aksi"><input type="checkbox"
class="all"></td>
<td colspan="2">Total SKS :</td>
<td class="total_credit_diambil">0</td>
<td></td>
</tr>
</tfoot>
</table>
</div>
<div class="col-12 text-end mr-25 mt-2">
<button class="btn btn-primary btn-sm moveright">Hapus
Paket</button>
</div>
</div>
</div>
</div>
</div>

<!-- Modal -->


<div class=" modal fade text-start" id="large" tabindex="-1" aria-
labelledby="myModalLabel17"
aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel17">Large
Modal</h4>
<button type="button" class="btn-close" data-bs-
dismiss="modal" aria-label="Close"></button>
</div>

<div class="modal-body">

<!-- Calendar -->


<div class="col position-relative">
<div class="card shadow-none border-0 mb-0 rounded-0">
<div class="card-body pb-0">
<div id="calendar"></div>
</div>
</div>
</div>
<!-- /Calendar -->
</div>

<div class="modal-footer">
<button type="button" class="btn btn-primary" data-bs-
dismiss="modal">Accept</button>
</div>
</div>
</div>
</div>

<!-- Tampilan Sudah ACC -->


<div class="card sudah-acc">
<div class="card-header text-black">
<b>Semester {{ $semester }}</b>
<span class="text-success fw-bolder text-krs">Anda Sudah Cetak
KRS</span>
<button class="btn create-new btn-primary cetak-krs" id="{{ $data-
>studentid }}">Cetak KRS</button>
</div>
<div class="card-body">
<table class="table datatables-acc">
<thead>
<tr>
<th>No</th>
<th>Kode Mata Kuliah</th>
<th>Nama Mata Kuliah</th>
<th>Kategori</th>
<th>SKS</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="4">Total SKS :</td>
<td id="total-sksacc"></td>
</tr>
</tfoot>
</table>
</div>
</div>

<div class="text-center">
<button class="btn btn-primary siap_acc">Siap ACC Wali</button>
</div>

</div>
@endsection

@section('js_section')
<script>
function reload_table(table_class, target) {
let list = $(table_class + ' tbody tr');
let total_sks = 0;
list.each(function(index, item) {

let currentRow = $(item).closest("tr");

let sks = parseInt(currentRow.find("td:eq(3)").text());


total_sks += sks;

});
$(".total_credit_" + target).text(total_sks)
}

$(document).ready(function() {
let id = "{{ $name->studentid }}";
console.log(id);
//Mata Kuliah Pindah Ke Kanan
$(document).on('click', '.move', function() {

var body = $('.table_matakuliah_diambil tbody');


$
('.table_matakuliah_tersedia .update:checked').each(function(index, item) {
var checkbox = $(item);

body.append(checkbox.closest('tr'));

$.ajax({
url: "{{ url('api/registrasi/store_mk') }} ",
success: function(result) {

},
method: 'POST',
data: "id=" + $(this).attr('id') +
'&_token=' + $('meta[name="csrf-
token"]').attr('content')
})
// checkbox.closest('td').remove();
// $('input[type=checkbox]').hide();
$('input[type=checkbox]').prop('checked', true);
$('.all').prop('checked', false);
});
reload_table(".table_matakuliah_diambil", "diambil");
reload_table(".table_matakuliah_tersedia", "tersedia");

});

// Mata Kuliah Pindah Ke Kiri


$(document).on('click', '.moveright', function() {
var body = $('.table_matakuliah_tersedia tbody');
$('.table_matakuliah_diambil .update:checked').each(function(index,
item) {
var checkbox = $(item);
body.append(checkbox.closest('tr'));

$.ajax({
url: "{{ url('api/registrasi/delete_mk') }} ",

method: 'DELETE',
data: "id=" + $(this).attr('id') +
'&_token=' + $('meta[name="csrf-
token"]').attr('content')
})
// checkbox.closest('td').remove();
$('input[type=checkbox]').prop('checked', false);
});

reload_table(".table_matakuliah_tersedia", "tersedia");
reload_table(".table_matakuliah_diambil", "diambil");
});

// Siap ACC
$(document).on('click', '.siap_acc', function() {
var body = $('.table_matakuliah_diambil tbody');
$('.table_matakuliah_diambil .update:checked').each(function(index,
item) {
var checkbox = $(item);
let id = "{{ $name->studentid }}";
console.log(id);
body.append(checkbox.closest('tr'));

$.ajax({
url: "{{ url('api/registrasi/siap_acc') }} ",
success: Swal.fire({
title: 'Anda sudah yakin?',
text: "Untuk mengambil mata kuliah ini",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Lanjutkan',
confirmButtonClass: 'btn btn-success',
cancelButtonClass: 'btn btn-danger mx-1',
buttonsStyling: false,
}).then(function(result) {
if (result.error) {

Swal.fire({
type: "error",
title: 'Oops...',
text: result.message,
});

} else {

Swal.fire({
icon: "success",
title: 'Data Berhasil Ditambah!',
text: result.message,
timer: 2000,
showConfirmButton: false
});
location.reload();

}),
method: 'POST',
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr(
'content')
},
data: {
id: $(this).attr('id'),
studentid: id
}
})
// checkbox.closest('td').remove();
$('input[type=checkbox]').prop('checked', true);
$('.all').prop('checked', false);
});

reload_table(".table_matakuliah_diambil", "diambil");
reload_table(".table_matakuliah_tersedia", "tersedia");
});

// Select ALL Mata Kuliah


$(document).ready(function() {
$('.all').click(function() {
var checked = $(this).prop('checked');
$('.matakuliah').find('input:checkbox').prop('checked',
checked);
});
})

// Isi Table Kiri


$.ajax({
url: "{{ url('api/registrasi/list_mk') }}/" + id,
success: function(result) {
var credit = 0;
for (i = 0; i < result.data.length; i++) {

let credit = (result.data[i].credit) ?


result.data[i].credit : 0;

$('#body1').append(`<tr>
<td class="matakuliah"><input type="checkbox"
class="update" id="${result.data[i].id}"></td>
<td>${result.data[i].subjectcode}</td>
<td>${result.data[i].subjectname}</td>
<td>${credit}</td>
<td>Kelas A</td>
</tr>`)

$total_credit = result.data[i].credit;

// $('.total_ftf_tersedia').html($total_creditftf);
$('.total_credit_tersedia').html($total_credit);
}
}
})

// Isi Table Kanan


$.ajax({
url: "{{ url('api/registrasi/list_studyplan') }}/" + id,
success: function(result) {
var credit = 0;
let status = "{{ $status }}";
for (i = 0; i < result.data.length; i++) {
let credit = (result.data[i].credit) ?
result.data[i].credit : 0;

$('#body2').append(`<tr>
<td class="matakuliah" id="hilang"><input
type="checkbox" class="update" id="${result.data[i].id}"></td>
<td>${result.data[i].subjectcode}</td>
<td>${result.data[i].subjectname}</td>
<td>${credit}</td>
<td>Kelas A</td>
</tr>`)

$total_credit = result.data[i].credit;

$('.total_credit_diambil').html($total_credit);
if (status == "Siap ACC") {
$('input[type=checkbox]').hide();
} else {
$('input[type=checkbox]').show();
}
$('input[type=checkbox]').prop('checked', true);
$('.all').prop('checked', false);
}
}
})

// Isi Tabel Sudah di ACC oleh DOSWAL

$('.datatables-acc').DataTable({
ajax: {
url: "{{ url('/api/registrasi/list_matakuliah_perwalian') }}/"
+ id,
dataSrc: function(json) {
let temp = json.data;
let total = 0;
temp.forEach(element => {
total += element.credit;
});

$('#total-sksacc').html(total);
return json.data;
},
},
columns: [{
data: 'DT_RowIndex'
}, {
data: 'subjectcode'
},
{
data: 'subjectname'
},
{
data: 'kategori'
},
{
data: 'credit'
}
],

"drawCallback": function(settings) {
feather.replace();

}
})

// Tombol Cetak KRS


$(document).on('click', '.cetak-krs', function() {
$.ajax({
url: "{{ url('registrasi/pdf') }} ",
success: Swal.fire({
title: 'Anda sudah yakin?',
text: "Untuk menyetujui",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Lanjutkan',
confirmButtonClass: 'btn btn-success',
cancelButtonClass: 'btn btn-danger mx-1',
buttonsStyling: false,
}).then(function(result) {
if (result.error) {

Swal.fire({
type: "error",
title: 'Oops...',
text: result.message,
});

} else {

Swal.fire({
icon: "success",
title: 'Data Berhasil Ditambah!',
text: result.message,
timer: 2000,
showConfirmButton: false
});
location.reload();

}),
method: 'POST',
data: "id=" + $(this).attr('id') +
'&_token=' + $('meta[name="csrf-token"]').attr(
'content')
})
})

// Hide and Show Tampilan

let status = "{{ $status }}";


if (status == "Belum Registrasi") {
$('.belum-registrasi').show();
$('.siap_acc').show();
$('.sudah-acc').hide();
$('.belum-acc').hide();
} else if (status == "Sudah ACC") {
$('.belum-registrasi').hide();
$('.sudah-acc').show();
$('.text-krs').hide();
$('.siap_acc').hide();
} else if (status == "Sudah Cetak KRS") {
$('.belum-registrasi').hide();
$('.sudah-acc').show();
$('.text-krs').show();
$('.cetak-krs').hide();
$('.siap_acc').hide();
} else {
$('.belum-registrasi').show();
$('.sudah-acc').hide();
$('.belum-acc').show();
$('.move').hide();
$('.moveright').hide();
$('.cek-jadwal').hide();
$('.aksi').hide();
$('.siap_acc').hide();
}

})
</script>
@endsection

You might also like