Sistem Informasi Raport Online Berbasis Web dengan Menggunakan Aplikasi Php dan Mysql di Smp Negeri 1 Silima Punggapungga
(2)
SURAT KETERANGAN Hasil Uji Program Tugas Akhir
Yang bertanda tangan di bawah ini, menerangkan bahwa Mahasiswa Tugas Akhir program D3 Teknik Informatika :
Nama : Andry R Siringoringo
NIM : 132406007
Program Studi : D3 Teknik Informatika
Judul Tugas Akhir :
SISTEM INFORMASI RAPORT ONLINE BERBASIS WEB DENGAN MENGGUNAKAN PHP DAN MYSQL DI SMP NEGERI 1 SILIMA PUNGGA-PUNGGA
telah melakukan test program Tugas Akhir Mahasiswa tersebut di atas pada tanggal ……./06/2016.
Dengan Hasil : SUKSES / GAGAL
Demikian diterangkan untuk digunakan melengkapi Syarat Pendaftaran Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.
Medan, Juni 2016
Program Studi D3 Teknik Informatika Ketua,
Dr. Poltak Sihombing, M.Kom NIP. 196203171991031001
(3)
LISTING PROGRAM
INDEX.HTML
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-initial-scale=1, maximum-scale=1">
<meta name="description" content=""> <meta name="author" content="">
<meta name="theme-color" content="#3e454c">
<title>Harmony - Free responsive Bootstrap admin template by Themestruck.com</title>
<!-- Font awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css"> <!-- Sandstone Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- Bootstrap Datatables -->
<link rel="stylesheet" href="css/dataTables.bootstrap.min.css"> <!-- Bootstrap social button library -->
<link rel="stylesheet" href="css/bootstrap-social.css"> <!-- Bootstrap select -->
<link rel="stylesheet" href="css/bootstrap-select.css"> <!-- Bootstrap file input -->
(4)
<!-- Awesome Bootstrap checkbox -->
<link rel="stylesheet" href="css/awesome-bootstrap-checkbox.css"> <!-- Admin Stye -->
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]> <script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script >
<script
src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]-->
</head>
<body>
<div class="brand clearfix">
<a href="index.html" class="logo"><img src="img/logo.jpg" class="img-responsive" alt=""></a>
<span class="menu-btn"><i class="fa fa-bars"></i></span> <ul class="ts-profile-nav">
<li><a href="#">Help</a></li> <li><a href="#">Settings</a></li> <li class="ts-account">
<a href="#"><img src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt=""> Account <i class="fa fa-angle-down hidden-side"></i></a>
<ul>
<li><a href="#">My Account</a></li> <li><a href="#">Edit Account</a></li> <li><a href="#">Logout</a></li>
(5)
</li> </ul>
</div>
<div class="ts-main-content"> <nav class="ts-sidebar">
<ul class="ts-sidebar-menu">
<li class="ts-label">Search</li> <li>
<input type="text" class="ts-sidebar-search" placeholder="Search here...">
</li>
<li class="ts-label">Main</li>
<li class="open"><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li><a href="#"><i class="fa fa-desktop"></i> UI Elements</a>
<ul>
<li><a href="panels.html">Panels and Wells</a></li>
<li><a href="buttons.html">Buttons</a></li>
<li><a
href="notifications.html">Notifications</a></li> <li><a
href="typography.html">Typography</a></li>
<li><a href="icon.html">Icon</a></li> <li><a href="grid.html">Grid</a></li> </ul>
</li>
<li><a href="tables.html"><i class="fa fa-table"></i> Tables</a></li>
(6)
<li><a href="forms.html"><i class="fa fa-edit"></i> Forms</a></li>
<li><a href="charts.html"><i class="fa fa-pie-chart"></i> Charts</a></li>
<li><a href="#"><i class="fa fa-sitemap"></i> Multi-Level Dropdown</a>
<ul>
<li><a href="#">2nd level</a></li> <li><a href="#">2nd level</a></li> <li><a href="#">3rd level</a>
<ul>
<li><a href="#">3rd level</a></li>
<li><a href="#">3rd level</a></li>
</ul> </li>
</ul> </li>
<li><a href="#"><i class="fa fa-files-o"></i> Sample Pages</a>
<ul>
<li><a href="blank.html">Blank page</a></li>
<li><a href="login.html">Login page</a></li>
</ul> </li>
<!-- Account from above --> <ul class="ts-profile-nav">
<li><a href="#">Help</a></li> <li><a href="#">Settings</a></li>
(7)
<li class="ts-account">
<a href="#"><img
src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt=""> Account <i class="fa fa-angle-down hidden-side"></i></a>
<ul>
<li><a href="#">My Account</a></li>
<li><a href="#">Edit Account</a></li>
<li><a href="#">Logout</a></li> </ul>
</li> </ul>
</ul> </nav>
<div class="content-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<h2 class="page-title">Dashboard</h2>
<div class="row">
<div class="col-md-12"> <div class="row">
<div class="col-md-3">
<div class="panel panel-default">
<div class="panel-body bk-primary text-light">
(8)
<div class="stat-panel text-center">
<div class="stat-panel-number h1 ">24</div>
<div class="stat-panel-title text-uppercase">New Users</div>
</div>
</div> <a href="#" class="block-anchor panel-footer">Full Detail <i class="fa fa-arrow-right"></i></a>
</div> </div>
<div class="col-md-3">
<div class="panel panel-default">
<div class="panel-body bk-success text-light">
<div class="stat-panel text-center">
<div class="stat-panel-number h1 ">8</div>
<div class="stat-panel-title text-uppercase">Support Tickets</div>
</div>
</div> <a
href="#" class="block-anchor panel-footer text-center">See All <i class="fa fa-arrow-right"></i></a>
</div> </div>
(9)
<div class="col-md-3">
<div class="panel panel-default">
<div class="panel-body bk-info text-light">
<div class="stat-panel text-center">
<div class="stat-panel-number h1 ">58</div>
<div class="stat-panel-title text-uppercase">New Orders</div>
</div>
</div> <a
href="#" class="block-anchor panel-footer text-center">See All <i class="fa fa-arrow-right"></i></a>
</div> </div>
<div class="col-md-3">
<div class="panel panel-default">
<div class="panel-body bk-warning text-light">
<div class="stat-panel text-center">
<div class="stat-panel-number h1 ">18</div>
<div class="stat-panel-title text-uppercase">New Comments</div>
</div>
(10)
<a
href="#" class="block-anchor panel-footer text-center">See All <i class="fa fa-arrow-right"></i></a>
</div> </div>
</div> </div>
</div>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Sales Report</div>
<div class="panel-body">
<div class="chart">
<canvas id="dashReport" height="310" width="600"></canvas>
</div> <div id="legendDiv"></div>
</div> </div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Recent Oreders</div>
<div class="panel-body">
(11)
<div class="alert alert-dismissible alert-success">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-close"></i></button>
<strong>Well done!</strong> You successfully read <a href="#" class="alert-link">this important alert message</a>.
</div> <table class="table table-hover">
<thead> <tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Username</th>
</tr> </thead> <tbody>
<tr>
<th scope="row">1</th>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
</tr> <tr>
(12)
<th scope="row">2</th>
<td>Jacob</td>
<td>Thornton</td>
<td>@fat</td>
</tr> <tr>
<th scope="row">3</th>
<td>Larry</td>
<td>the Bird</td>
<td>@twitter</td>
</tr> </tbody> </table>
</div> </div>
</div> </div>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Pie Chart</div>
<div class="panel-body">
(13)
<div class="row">
<div class="col-md-4">
<ul class="chart-dot-list">
<li class="a1">date 1</li>
<li class="a2">data 2</li>
<li class="a3">data 3</li>
</ul> </div> <div class="col-md-8">
<div class="chart chart-doughnut">
<canvas id="chart-area3" width="1200" height="900" />
</div>
</div> </div>
</div> </div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Doughnut</div>
<div class="panel-body">
(14)
<div class="row">
<div class="col-md-4">
<ul class="chart-dot-list">
<li class="a1">date 1</li>
<li class="a2">data 2</li>
<li class="a3">data 3</li>
</ul> </div> <div class="col-md-8">
<div class="chart chart-doughnut">
<canvas id="chart-area4" width="1200" height="900" />
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
(15)
</div>
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script> <script src="js/main.js"></script>
<script>
window.onload = function(){
// Line chart from swirlData for dashReport var ctx =
document.getElementById("dashReport").getContext("2d"); window.myLine = new Chart(ctx).Line(swirlData, {
responsive: true,
scaleShowVerticalLines: false, scaleBeginAtZero : true,
multiTooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>",
});
// Pie Chart from doughutData
var doctx = document.getElementById("chart-area3").getContext("2d");
(16)
window.myDoughnut = new Chart(doctx).Pie(doughnutData, {responsive : true});
// Dougnut Chart from doughnutData
var doctx = document.getElementById("chart-area4").getContext("2d");
window.myDoughnut = new Chart(doctx).Doughnut(doughnutData, {responsive : true});
}
</script>
</body>
</html>
INDEX.PHP
<?php
error_reporting(0); ob_start();
session_start();
if ($_SESSION['id_admin'] or $_SESSION['nis'] or $_SESSION['nip']) { include 'koneksi.php';
?>
<!doctype html>
<html lang="en" class="no-js">
<head>
(17)
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-initial-scale=1, maximum-scale=1">
<meta name="description" content=""> <meta name="author" content="">
<meta name="theme-color" content="#3e454c">
<title>SMPN 1 SilimaPungga</title>
<!-- Font awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css"> <!-- Sandstone Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- Bootstrap Datatables -->
<link rel="stylesheet" href="css/dataTables.bootstrap.min.css"> <!-- Bootstrap social button library -->
<link rel="stylesheet" href="css/bootstrap-social.css"> <!-- Bootstrap select -->
<link rel="stylesheet" href="css/bootstrap-select.css"> <!-- Bootstrap file input -->
<link rel="stylesheet" href="css/fileinput.min.css"> <!-- Awesome Bootstrap checkbox -->
<link rel="stylesheet" href="css/awesome-bootstrap-checkbox.css"> <!-- Admin Stye -->
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]> <script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script >
<script
(18)
<![endif]-->
</head>
<body>
<div class="brand clearfix">
<a href="index.php" style="color:#fff; font-size:40px;" >SMPN 1 SilimaPungga</a>
<span class="menu-btn"><i class="fa fa-bars"></i></span> <ul class="ts-profile-nav">
<li class="ts-account">
<a href="#"><img src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt="">
<?php
if ($_SESSION['level']=="Admin") { ?>
<?php echo $_SESSION['username']; ?> <?php
}
else if ($_SESSION['nip']) { echo $_SESSION['nama_guru']; }
else if ($_SESSION['level']=="Wali Kelas") { echo $_SESSION['username'];
}
else if ($_SESSION['nis']) {
echo $_SESSION['nama_siswa']; }
?>
(19)
<ul>
<li><a href="logout.php">Logout</a></li> </ul>
</li> </ul>
</div>
<div class="ts-main-content"> <nav class="ts-sidebar">
<ul class="ts-sidebar-menu">
<li class="ts-label">Search</li> <li>
<input type="text" class="ts-sidebar-search" placeholder="Search here...">
</li> <li class="ts-label">Main</li>
<li class="open"><a href="index.php"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<?php if ($_SESSION['level']=="Admin") { ?>
<li><a href="index.php?page=data_user"><i class="fa fa-table"></i> Data User</a></li>
<li><a href="index.php?page=data_guru"><i class="fa fa-table"></i> Data Guru</a></li>
<li><a href="index.php?page=data_kelas"><i class="fa fa-table"></i> Data Kelas</a></li>
<li><a href="index.php?page=data_mata_pelajaran"><i class="fa fa-table"></i> Data Mata Pelajaran</a></li>
<li><a href="index.php?page=data_jadwal_mata_pelajaran"><i class="fa fa-table"></i> Data Jadwal Mata Pelajaran</a></li>
(20)
<li><a href="index.php?page=data_mengajar"><i class="fa fa-table"></i> Data Mengajar</a></li>
<li><a href="index.php?page=data_siswa"><i class="fa fa-table"></i> Data Siswa</a></li>
<li><a href="index.php?page=tambah_user"><i class="fa fa-edit"></i> Tambah User</a></li>
<?php } else if ($_SESSION['nama_guru']) { ?>
<li><a href="index.php?page=input_nilai_persiswa"><i class="fa fa-table"></i> Input Nilai Siswa</a></li>
<li><a href="index.php?page=mengajar"><i class="fa fa-table"></i> Mengajar</a></li>
<li><a href="index.php?page=profil_guru"><i class="fa fa-table"></i> Profile Guru</a></li>
<?php } else if ($_SESSION['level']=="Wali Kelas") { ?>
<li><a href="index.php?page=lihat_nilai_matapelajaran"><i class="fa fa-table"></i> Lihat Nilai </a></li>
<li><a href="index.php?page=mengajar1"><i class="fa fa-table"></i>Nilai Mata pelajaran</a></li>
<li><a href="index.php?page=profil_guru"><i class="fa fa-table"></i> Profile Guru</a></li>
<?php } else if ($_SESSION['nis']) { ?>
<li><a href="index.php?page=lihat_nilai_pribadi"><i class="fa fa-table"></i> Lihat Nilai </a></li>
(21)
<!-- Account from above --> <ul class="ts-profile-nav">
<li><a href="#">Help</a></li> <li><a href="#">Settings</a></li> <li class="ts-account">
<a href="#"><img
src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt=""> Account <i class="fa fa-angle-down hidden-side"></i></a>
<ul>
<li><a href="#">My Account</a></li>
<li><a href="#">Edit Account</a></li>
<li><a href="#">Logout</a></li> </ul>
</li> </ul>
</ul> </nav>
<div class="content-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<?php
include"koneksi.php"; if (isset($_GET['page'])) {
(22)
$page=htmlentities($_GET['page']); }
else {
$page="artikel";
}
$file="$page.php"; $cek=strlen($page);
if ($cek>30 || !file_exists($file)||empty($page)) { include ("home.php");
} else {
include ($file); }
?>
</div> </div>
</div> </div>
(23)
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script> <script src="js/main.js"></script>
<script>
window.onload = function(){
// Line chart from swirlData for dashReport var ctx =
document.getElementById("dashReport").getContext("2d"); window.myLine = new Chart(ctx).Line(swirlData, {
responsive: true,
scaleShowVerticalLines: false, scaleBeginAtZero : true,
multiTooltipTemplate: "<%if (label){%><%=label%>: <%}%><%= value %>",
});
// Pie Chart from doughutData
var doctx = document.getElementById("chart-area3").getContext("2d");
window.myDoughnut = new Chart(doctx).Pie(doughnutData, {responsive : true});
(24)
// Dougnut Chart from doughnutData
var doctx = document.getElementById("chart-area4").getContext("2d");
window.myDoughnut = new Chart(doctx).Doughnut(doughnutData, {responsive : true});
}
</script>
</body>
</html>
<?php } else {
header('location: login.php'); }
INPUT NILAI.PHP
<div class="row">
<div class="col-md-12">
<div class="panel panel-default"> <div class="panel-heading">Data Nilai Siswa</div>
<div class="panel-body"> <?php
(25)
$jumSis = $_POST['jumlah']; for ($i=1; $i<=$jumSis; $i++) {
$nilai = $_POST['nilai'.$i]; $id_siswa = $_POST['id_siswa'.$i]; $id_guru = $_POST['id_guru']; $id_kelas = $_POST['id_kelas'];
$id_mata_pelajaran = $_POST['id_mata_pelajaran']; $query = "update tbl_nilai set nilai='$nilai' where
id_siswa='$id_siswa' and id_mata_pelajaran='$id_mata_pelajaran' and id_kelas='$id_kelas' and id_guru='$id_guru'";
$hasil=mysql_query($query); }
if($hasil){ ?><script
language="javascript">document.location.href="?page=input_nilai_selesa i&id_guru=<?php echo $id_guru;?>&id_kelas=<?php echo
$id_kelas;?>&id_mata_pelajaran=<?php echo $id_mata_pelajaran;?>";</script><?php
}else{
?><script
language="javascript">document.location.href="?page=input_nilai_selesa i&status=0";</script><?php
}
}else{
unset($_POST['submit']); }
(26)
<table class="table table-bordered table-striped" cellpadding="6" align="center">
<?php
$nip = $_SESSION['nip'];
$sql_mengajar=mysql_query("SELECT * from mengajar INNER JOIN guru ON guru.id_guru=mengajar.id_guru INNER JOIN mata_pelajaran ON
mata_pelajaran.id_mata_pelajaran=mengajar.id_mata_pelajaran INNER JOIN kelas ON kelas.id_kelas=mengajar.id_kelas where nip='$nip'");
$tampilkan_mengajar=mysql_fetch_array($sql_mengajar); ?>
<tr>
<th valign="top">Nama Guru</th>
<td><input type="text" class="inp-form" name="nama_siswa" value="<?php echo $tampilkan_mengajar['nama_guru'];?>"
disabled="disabled"/></td> <td></td>
</tr> <tr>
<th valign="top">Pelajaran</th>
<td><input type="text" class="inp-form" name="telpon_siswa" value="<?php echo $tampilkan_mengajar['nama_mata_pelajaran'];?>" disabled="disabled"/></td>
<td></td> </tr> <tr>
<th valign="top">Kelas</th>
<td><input type="text" class="inp-form" name="nis" value="<?php echo $tampilkan_mengajar['nama_kelas'];?>" disabled="disabled"/></td> <td></td>
(27)
</table> <br>
<form id="mainform" action="index.php?page=input_nilai" method="post"> <table class="table table-bordered table-striped" cellpadding="6" align="center">
<tr>
<th width="10%" class="table-header-repeat line-left minwidth-1"><a href="">Nomor</a> </th>
<th width="60%" class="table-header-repeat line-left minwidth-1"><a href="">Nama Siswa</a></th>
<th width="60%" class="table-header-repeat line-left minwidth-1"><a href="">NIS</a></th>
<th width="30%" class="table-header-repeat line-left minwidth-1"><a href="">Nilai Siswa</a></th>
</tr>
<?php
$nip=$_SESSION['nip'];
$view=mysql_query("SELECT * from tbl_nilai INNER JOIN kelas ON kelas.id_kelas=tbl_nilai.id_kelas INNER JOIN siswa ON
siswa.id_siswa=tbl_nilai.id_siswa INNER JOIN guru ON guru.id_guru=tbl_nilai.id_guru where nip='$nip'");
$i = 1;
while($tampil=mysql_fetch_array($view)){ ?>
<input type="hidden" name="id_guru" value="<?php echo $tampil['id_guru'];?>" />
(28)
<input type="hidden" name="id_mata_pelajaran" value="<?php echo $tampil['id_mata_pelajaran'];?>" />
<input type="hidden" name="id_kelas" value="<?php echo $tampil['id_kelas'];?>" />
<?php echo "<input type='hidden' name='id_siswa".$i."' value='".$tampil['id_siswa']."' />"; ?>
<tr>
<td><?php echo $i;?></td>
<td><?php echo $tampil['nama_siswa'];?></td> <td><?php echo $tampil['nis'];?></td>
<td><?php echo "<input type='text' name='nilai".$i."' size='10' value='".$tampil['nilai']."'/>"; ?></td>
</tr> <?php $i++; }
$jumSis = $i-1; ?>
<tr>
<td><input type="hidden" name="jumlah" value="<?php echo $jumSis ?>" /></td>
<td colspan="4" align="center">
<input type="submit" onclick="return confirm('Apakah Anda yakin?')" value="Update" name="submit"/>
</td> </tr> </table>
(29)
</form>
</div> </div>
</div> </div>
INPUT NILAI PERISTIWA.PHP
<div class="row">
<div class="col-md-12">
<div class="panel panel-default"> <div
class="panel-heading">Tambah User</div>
<div class="panel-body"> <form method="post" action="index.php?page=proses_nilai_per_siswa" class="form-horizontal">
<div class="hr-dashed"></div>
<div class="form-group">
<label class="col-sm-2 control-label">Nama Siswa</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<select name="id_siswa" class="form-control" placeholder="Nama Siswa">
(30)
<?php
$sql_siswa=mysql_query("select * from siswa order by nis ASC ");
while($tampilkan_mysqlnya=mysql_fetch_array($sql_siswa)) {
?>
<option value="<?php echo $tampilkan_mysqlnya['id_siswa'];?>"><?php echo $tampilkan_mysqlnya['nama_siswa'];?> ( <?php echo
$tampilkan_mysqlnya['nis']; ?> )</option> <?php
} ?>
</select>
</div>
</div> </div>
</div> <div class="form-group">
<label class="col-sm-2 control-label">Mata Pelajaran</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<select name="id_mata_pelajaran" class="form-control" placeholder="Nama Mata Pelajaran">
(31)
$sql_mata_pelaajran=mysql_query("SELECT * from mata_pelajaran order by nama_mata_pelajaran ASC ");
while ($tampilkan_mapel=mysql_fetch_array($sql_mata_pelaajran)) {
?>
<option value="<?php echo
$tampilkan_mapel['id_mata_pelajaran'];?>"><?php echo $tampilkan_mapel['nama_mata_pelajaran']; ?></option>
<?php
} ?>
</select>
</div>
</div> </div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Kelas</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<select name="id_kelas" class="form-control" placeholder="Nama Kelas">
<?php
(32)
while
($tampilkan_mapel=mysql_fetch_array($sql_mata_pelaajran)) {
?>
<option value="<?php echo $tampilkan_mapel['id_kelas'];?>"><?php echo
$tampilkan_mapel['nama_kelas']; ?></option> <?php
} ?>
</select>
</div>
</div> </div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Guru</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<?php
$nip=$_SESSION['nip'];
$sql_siswa=mysql_query("select * from guru where nip='$nip'");
(33)
?>
<input type="text" name="id_guru" class="form-control"
value="<?php echo $tampilkan_mysqlnya['nama_guru'];?>" placeholder="">
</div>
</div> </div>
</div> <div class="form-group">
<label class="col-sm-2 control-label">Nilai</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<input type="text" name="nilai" class="form-control" placeholder="Masukkan Nilainya">
</div>
</div> </div>
</div>
<div class="hr-dashed"></div>
(34)
<div class="form-group">
<div class="col-sm-8 col-sm-offset-2">
<button class="btn btn-primary" value="submit" type="submit" name="submit">Simpan</button>
</div> </div>
</form>
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script>
(35)
<script src="js/main.js"></script>
KONEKSI.PHP
<?php
$host="localhost"; $user="root"; $pass="";
$db="raportonline";
$koneksi=mysql_connect($host,$user,$pass) or die(mysql_error()); mysql_select_db($db,$koneksi);
?>
KONEKSI2.PHP
<?php
$dbhost = 'localhost'; $dbuser = 'root'; $dbpass = '';
$dbname = 'raportonline';
$koneksi = new mysqli($dbhost,$dbuser,$dbpass,$dbname);
# check koneksi
if( $koneksi->connect_error ) {
die('Oops!! koneksi Gagal : '. $koneksi->connect_error ); }
(36)
LOGIN.PHP
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-initial-scale=1, maximum-scale=1">
<meta name="description" content=""> <meta name="author" content="">
<title>Harmony - Free responsive Bootstrap admin template by Themestruck.com</title>
<!-- Font awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css"> <!-- Sandstone Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- Bootstrap Datatables -->
<link rel="stylesheet" href="css/dataTables.bootstrap.min.css"> <!-- Bootstrap social button library -->
<link rel="stylesheet" href="css/bootstrap-social.css"> <!-- Bootstrap select -->
<link rel="stylesheet" href="css/bootstrap-select.css"> <!-- Bootstrap file input -->
<link rel="stylesheet" href="css/fileinput.min.css"> <!-- Awesome Bootstrap checkbox -->
(37)
<!-- Admin Stye -->
<link rel="stylesheet" href="css/style.css">
<!--[if lt IE 9]> <script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script >
<script
src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]-->
</head>
<body>
<div class="login-page bk-img" style="background-image: url(img/login-bg.jpg);">
<div class="form-content"> <div class="container">
<div class="row">
<div class="col-md-6 col-md-offset-3"> <h1 class="center bold text-light mt-4x">Sign in</h1>
<div class="well row pt-2x pb-3x bk-light">
<div class="8 col-md-offset-2">
<form action="proses_login.php" method="post" class="mt">
<label for="" class="text-uppercase text-sm">Your Username or Email</label>
<input type="text" name="username" placeholder="Username" class="form-control mb">
(38)
<label for="" class="uppercase text-sm">Password</label>
<input type="password" name="password" placeholder="Password" class="form-control mb">
<label for="" class="text-uppercase text-sm">Level</label> <select name="level" placeholder="Password"
class="form-control mb">
<option value="Admin">Admin</option> <option value="Siswa">Siswa</option> <option value="Guru">Guru</option>
<option value="Wali Kelas">Wali Kelas</option> </select>
<button class="btn btn-primary btn-block" type="submit">LOGIN</button>
</form> </div>
</div>
<div class="text-center text-light"> <a href="#"
class="text-light">Forgot password?</a>
</div> </div>
</div> </div>
</div> </div>
(39)
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script> <script src="js/main.js"></script>
</body>
</html>
LOGOUT.PHP
<?php
session_start(); session_unset(); session_destroy();
header("location:login.php"); ?>
NOTIFICATIONS.HTML
<!doctype html>
(40)
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-initial-scale=1, maximum-scale=1">
<meta name="description" content=""> <meta name="author" content="">
<meta name="theme-color" content="#3e454c">
<title>Harmony - Free responsive Bootstrap admin template by Themestruck.com</title>
<!-- Font awesome -->
<link rel="stylesheet" href="css/font-awesome.min.css"> <!-- Sandstone Bootstrap CSS -->
<link rel="stylesheet" href="css/bootstrap.min.css"> <!-- Bootstrap Datatables -->
<link rel="stylesheet" href="css/dataTables.bootstrap.min.css"> <!-- Bootstrap social button library -->
<link rel="stylesheet" href="css/bootstrap-social.css"> <!-- Bootstrap select -->
<link rel="stylesheet" href="css/bootstrap-select.css"> <!-- Bootstrap file input -->
<link rel="stylesheet" href="css/fileinput.min.css"> <!-- Awesome Bootstrap checkbox -->
<link rel="stylesheet" href="css/awesome-bootstrap-checkbox.css"> <!-- Admin Stye -->
<link rel="stylesheet" href="css/style.css">
(41)
<script
src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script >
<script
src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]-->
</head>
<body>
<div class="brand clearfix">
<a href="index.html" class="logo"><img src="img/logo.jpg" class="img-responsive" alt=""></a>
<span class="menu-btn"><i class="fa fa-bars"></i></span> <ul class="ts-profile-nav">
<li><a href="#">Help</a></li> <li><a href="#">Settings</a></li> <li class="ts-account">
<a href="#"><img src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt=""> Account <i class="fa fa-angle-down hidden-side"></i></a>
<ul>
<li><a href="#">My Account</a></li> <li><a href="#">Edit Account</a></li> <li><a href="#">Logout</a></li>
</ul> </li>
</ul> </div>
<div class="ts-main-content"> <nav class="ts-sidebar">
(42)
<ul class="ts-sidebar-menu">
<li class="ts-label">Search</li> <li>
<input type="text" class="ts-sidebar-search" placeholder="Search here...">
</li>
<li class="ts-label">Main</li>
<li><a href="index.html"><i class="fa fa-dashboard"></i> Dashboard</a></li>
<li class="open"><a href="#"><i class="fa fa-desktop"></i> UI Elements</a>
<ul>
<li><a href="panels.html">Panels and Wells</a></li>
<li><a href="buttons.html">Buttons</a></li>
<li class="open"><a href="notifications.html">Notifications</a></li>
<li><a href="typography.html">Typography</a></li>
<li><a href="icon.html">Icon</a></li> <li><a href="grid.html">Grid</a></li> </ul>
</li>
<li><a href="tables.html"><i class="fa fa-table"></i> Tables</a></li>
<li><a href="forms.html"><i class="fa fa-edit"></i> Forms</a></li>
<li><a href="charts.html"><i class="fa fa-pie-chart"></i> Charts</a></li>
<li><a href="#"><i class="fa fa-sitemap"></i> Multi-Level Dropdown</a>
<ul>
(43)
<li><a href="#">2nd level</a></li> <li><a href="#">3rd level</a>
<ul>
<li><a href="#">3rd level</a></li>
<li><a href="#">3rd level</a></li>
</ul> </li>
</ul> </li>
<li><a href="#"><i class="fa fa-files-o"></i> Sample Pages</a>
<ul>
<li><a href="blank.html">Blank page</a></li>
<li><a href="login.html">Login page</a></li>
</ul> </li>
<!-- Account from above --> <ul class="ts-profile-nav">
<li><a href="#">Help</a></li> <li><a href="#">Settings</a></li> <li class="ts-account">
<a href="#"><img
src="img/ts-avatar.jpg" class="ts-avatar hidden-side" alt=""> Account <i class="fa fa-angle-down hidden-side"></i></a>
<ul>
<li><a href="#">My Account</a></li>
(44)
<li><a href="#">Edit Account</a></li>
<li><a href="#">Logout</a></li> </ul>
</li> </ul>
</ul> </nav>
<div class="content-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-md-12">
<h2 class="page-title">Notifications and Alerts</h2>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">Alert Styles</div>
<div class="panel-body">
<div class="alert alert-dismissible alert-warning">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-remove"></i></button>
<h4>Warning!</h4>
<p>Best check yo self, you're not looking too good. Nulla vitae elit libero, a
(45)
pharetra augue. Praesent commodo cursus magna, <a href="#" class="alert-link">vel scelerisque nisl consectetur et</a>.</p>
</div> <div class="alert alert-dismissible alert-danger">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-remove"></i></button>
<strong>Oh snap!</strong><a href="#" class="alert-link">Change a few things
up</a> and try submitting again.
</div> <div class="alert alert-dismissible alert-success">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-remove"></i></button>
<strong>Well done!</strong> You successfully read <a href="#" class="alert-link">this important alert message</a>.
</div> <div class="alert alert-dismissible alert-info">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-remove"></i></button>
<strong>Heads up!</strong> This <a href="#"
class="alert-link">alert needs your attention</a>, but it's not super important. </div>
</div> </div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
(46)
<div class="panel-heading">Dialogs</div>
<div class="panel-body">
<h4>Popovers</h4>
<button type="button" class="btn btn-default" container="body" data-toggle="popover" data-placement="left" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">Left</button>
<button type="button" class="btn btn-default" container="body" data-toggle="popover" data-placement="top" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" title="">Top</button>
<button type="button" class="btn btn-default" container="body" data-toggle="popover" data-placement="bottom" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title="" data-original-title="">Bottom</button>
<button type="button" class="btn btn-default" container="body"
data-toggle="popover" data-placement="right" data-content="Vivamus sagittis lacus vel augue laoreet rutrum faucibus." data-original-title=""
title="">Right</button>
<hr>
<h4>Tooltips</h4>
<button type="button" class="btn btn-default" toggle="tooltip" data-placement="left" title="" data-original-title="Tooltip on
(47)
<button type="button" class="btn btn-default" toggle="tooltip" data-placement="top" title="" data-original-title="Tooltip on
top">Top</button>
<button type="button" class="btn btn-default" toggle="tooltip" data-placement="bottom" title="" data-original-title="Tooltip on bottom">Bottom</button>
<button type="button" class="btn btn-default" toggle="tooltip" data-placement="right" title="" data-original-title="Tooltip on
right">Right</button>
<hr>
<h4>Modals</h4> <!-- Button trigger modal -->
<button type="button" class="btn btn-primary" toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<!-- Modal --> <div
class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
(48)
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="panel panel-default"> <div
class="panel-heading">Progress Bars</div>
(49)
<h4>Basic</h4>
<div class="progress"> <div class="progress-bar" style="width: 60%;"></div>
</div>
<h4>Contextual alternatives</h4>
<div class="progress"> <div class="progress-bar progress-bar-info" style="width: 20%"></div>
</div>
<div class="progress"> <div class="progress-bar progress-bar-success" style="width: 40%"></div>
</div>
<div class="progress"> <div class="progress-bar progress-bar-warning" style="width: 60%"></div>
</div>
<div class="progress"> <div class="progress-bar progress-bar-danger" style="width: 80%"></div>
</div>
(50)
<div class="progress progress-striped">
<div class="progress-bar progress-bar-info" style="width: 20%"></div>
</div>
<div class="progress progress-striped">
<div class="progress-bar progress-bar-success" style="width: 40%"></div>
</div>
<div class="progress progress-striped">
<div class="progress-bar progress-bar-warning" style="width: 60%"></div>
</div>
<div class="progress progress-striped">
<div class="progress-bar progress-bar-danger" style="width: 80%"></div>
</div>
<h4>Animated</h4>
<div class="progress progress-striped active">
<div class="progress-bar" style="width: 45%"></div>
</div>
(51)
<div class="progress"> <div class="progress-bar progress-bar-success" style="width: 35%"></div>
<div class="progress-bar progress-bar-warning" style="width: 20%"></div>
<div class="progress-bar progress-bar-danger" style="width: 10%"></div>
</div>
</div> </div>
</div> </div>
<div class="row">
<div class="clearfix pt pb"> <div class="col-md-12">
<em>Thank you for using <a
href="http://themestruck.com/theme/harmony/"> Harmony Admin Theme </a> by <a href="http://themestruck.com/">ThemeStruck</a></em>
</div> </div>
</div>
</div> </div>
</div>
<!-- Loading Scripts -->
(52)
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script> <script src="js/main.js"></script>
</body>
</html>
PROSES NILAI.PHP
<?php
if( !isset( $_POST['id_mengajar'] ) ) {
header('location:input_nilai.php'); exit();
}
$id_mengajar = $_POST['id_mengajar']; $id_kelas = $_POST['id_kelas'];
$ruang = $_POST['ruang']; $semester = $_POST['semester']; $id_siswa = $_POST['id_siswa']; $nilai = $_POST['nilai'];
(53)
$count = count($id_mengajar);
$sql = "INSERT INTO nilai
(id_mengajar,id_kelas,ruang,semester,id_siswa,nilai,tahun_ajaran) VALUES ";
for( $i=0; $i < $count; $i++ ) {
$sql .=
"('{$id_mengajar[$i]}','{$id_kelas[$i]}','{$ruang[$i]}','{$semester[$i ]}','{$id_siswa[$i]}','{$nilai[$i]}','{$tahun_ajaran[$i]}')";
$sql .= ","; }
$sql = rtrim($sql,",");
if( !$sql ) {
echo mysql_error(); }else{
echo "sukses, silahkan check database anda"; }
?>
SIMPAN RAPORT.PHP
<?php
require( 'koneksi2.php' );
$delete_raport = mysql_query("DELETE FROM raport"); if( !isset( $_POST['id_siswa'] ) )
(54)
{
header('location:index.php?page=lihat_nilai_matapelajaran'); exit();
}
$id_siswa = $_POST['id_siswa']; $id_kelas = $_POST['id_kelas']; $total_nilai = $_POST['total_nilai']; $rata_rata = $_POST['rata_rata']; $rangking = $_POST['rangking']; $count = count($id_siswa);
$sql = "INSERT INTO raport
(id_siswa,id_kelas,total_nilai,rata_rata,rangking) VALUES "; for( $i=0; $i < $count; $i++ )
{
$sql .=
"('{$id_siswa[$i]}','{$id_kelas[$i]}','{$total_nilai[$i]}','{$rata_rat a[$i]}','{$rangking[$i]}')";
$sql .= ","; }
$sql = rtrim($sql,",");
$insert = $koneksi->query($sql);
if( !$insert ) {
echo "gagal insert : ".$koneksi->error; }else{
(55)
" <script>
alert ('sukses, silahkan check database anda');
window.location='index.php?page=lihat_nilai_matapelajaran' </script>";
} ?>
TAMPILKAN NILAI MATA PELAJARAN.PHP
<div class="row">
<div class="col-md-12">
<div class="panel panel-default"> <div class="panel-heading">Data Nilai Siswa</div>
<div class="panel-body">
<table id="zctb" class="display table table-striped table-bordered table-hover" cellspacing="0" width="100%">
<thead> <tr>
<th>Nama Pelajaran</th>
<th>Nama Siswa</th>
<th>Nama Kelas</th>
(56)
</tr> </thead>
<tbody>
<?php
$nama_mata_pelajaran=$_POST['nama_mata_pelajaran'];
$sql=mysql_query("SELECT * from tbl_nilai INNER JOIN mata_pelajaran ON
mata_pelajaran.id_mata_pelajaran=tbl_nilai.id_mata_pelajaran where nama_mata_pelajaran='$nama_mata_pelajaran' ");
while($tampilkanaja=mysql_fetch_array($sql)){
?> <tr>
<td><?php echo $tampilkanaja['nama_mata_pelajaran'] ;?></td>
</tr> <?php } ?>
</tbody> </table>
(57)
</div> </div>
</div> </div>
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
<script src="js/jquery.dataTables.min.js"></script> <script src="js/dataTables.bootstrap.min.js"></script> <script src="js/Chart.min.js"></script>
<script src="js/fileinput.js"></script> <script src="js/chartData.js"></script> <script src="js/main.js"></script>
TAMBAH USER.PHP
<div class="row">
<div class="col-md-12">
<div class="panel panel-default"> <div
class="panel-heading">Tambah User</div> <?php
(58)
if (isset($_POST['submit'])) { $username=$_POST['username'];
$password=$_POST['password']; $email=$_POST['email'];
$level=$_POST['level'];
$proses=mysql_query("INSERT INTO admin values
('','$username','$password','$email','$level')") or die(mysql_error());
if ($proses) {
echo "<script> window.location='index.php?page=data_user'; </script>";
} else { ?>
<div class="alert alert-dismissible alert-danger">
<button type="button" class="close" data-dismiss="alert"><i class="fa fa-remove"></i></button>
<strong>Gagal!</strong><a href="#" class="alert-link"> </div> <?php
} }
?>
<div class="panel-body"> <form method="post" action="" class="form-horizontal">
<div class="hr-dashed"></div>
<div class="form-group">
(59)
<label class="col-sm-2 control-label">Username</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<input type="text" name="username" class="form-control" placeholder="Username">
</div>
</div> </div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Password</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<input type="text" name="password" class="form-control" placeholder="Password">
</div>
</div> </div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Email</label>
(60)
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<input type="text" name="email" class="form-control" placeholder="Email">
</div>
</div> </div>
</div>
<div class="form-group">
<label class="col-sm-2 control-label">Level</label>
<div class="col-sm-10">
<div class="row">
<div class="col-xs-4">
<select name="level" class="form-control" placeholder="Level">
<option value="Admin">Admin</option> <option value="Kepala Sekolah">Kepala Sekolah</option>
</select>
</div>
</div> </div>
(61)
<div class="hr-dashed"></div>
<div class="form-group">
<div class="col-sm-8 col-sm-offset-2">
<button class="btn btn-default" type="submit">Cancel</button>
<button class="btn btn-primary" value="submit" type="submit"
name="submit">Simpan</button>
</div> </div>
</form>
</div> </div>
</div> </div>
</div> </div>
</div>
<!-- Loading Scripts -->
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap-select.min.js"></script> <script src="js/bootstrap.min.js"></script>
(62)
DAFTAR PUSTAKA
di akses pada tanggal 10 Mei 2016
Anhar.(2010). Panduan menguasai PHP & Mysql.jakarta: Media kita.
Virgi, A. H. (2011). CEPAT MAHIR PEMOGRAMAN WEB DENGAN PHP DAN MySQL. Jakarta: PT. Prestasi Pustakaraya.
Syaukani, M. (2005).Mengolah data pada Mysql server. Jakarta: Elex media komputindo.
(63)
SEKILAS MENGENAI
SMP NEGERI 1 SILIMAPUNGGA-PUNGGA
3.1 Profil SMP NEGERI 1 SILIMAPUNGGA-PUNGGA
Laporan Sekolah
Provinsi : Prop. Sumatera Utara
A. Identitas Sekolah
Nama Sekolah : SMP NEGERI 1 SILIMAPUNGGA-PUNGGA
NPSN / NSS : 10203508 / 021070505005
Jenjang Pendidikan : SMP
Status Sekolah : Negeri
B. Lokasi Sekolah
Kecamatan : PARONGIL
Kode pos : 22262
Kabupaten : Kab. Dairi
C. Data Pelengkap Sekolah
Status Kepemilikan : Pemerintah Daerah
SK Izin Operasional :
Tgl SK Izin Operasional :
SK Akreditasi : A
Jumlah Guru : 33
Jumlah Siswa laki-laki : 341
Jimlah Siswa Perempuan : 305
Semester Aktif : 2015/2016-2
Luas Tanah Milik : 12.800 M2
Ruang Kelas : 21
Laboratorium : 1
Perpusatakaan : 1
Nomor Telepon : 0627434028
Nomor Fax : -
D. Data Periodik
Kategori Wilayah :
Daya Listrik : 7400
Akses Internet Utama : Telkomsel Flash
Akses Internet Alternatif : Telkom Speedy
Akreditasi : A
(64)
3.2 Struktur Organisasi
Gambar 3.1 Struktur Organisasi
Organisasi merupakan salah satu alat untuk mencapai tujuan secara efektif dan
rasional. Pembentukan organisasi dan pembagian tugas merupakan unsur utama dan
alat utama untuk mencapai kontrol yang baik. Pengorganisasian berarti menetukan
bagian-bagian mana yang diperlukan untuk mencapai suatu hasil dan menentukan kerja sama
yang sesuai antara bagian.
Struktur organisasi adalah rangka atau bagian yang menunjukan tugas untuk mencapai
tujuan organisasi, hubungan antara fungsi-fungsi, dan tanggung jawab antara setiap
(65)
ada didalamnya akan mengetahui kegiatan-kegiatan yang harus dilakukan dan batas-batas
kekuasaan yang ada padanya.
3.3. Uraian Tugas dan Fungsi Organisasi
3.3.1 Kepala Sekolah
Kepala Sekolah berfungsi dan bertugas sebagai edukator, manejer, administrator,
supervisor serta pemimpin / Leader inovator.
3.3.2 Wakil Kepala Sekolah
Wakil Kepala Sekolah bertugas membantu Kepala Sekolah dalam kegiatan:
1. Menyusun kurikulum.
2. Mengatur segala program kesiswaan.
3. Merencanakan kebutuhan sarana dan prasarana.
4. Mengatur dan mengembangkan hubungan dengan masyarakat.
5. Mengatur dan mengawasi penyelenggaraan program pendidikan.
6. Mengatur mutasi siswa.
7. Menyusun program kegiatan ekstrakurikuler.
8. Mengatur penyusunan bahan pengajaran dan pengembangan kurikulum.
3.3.3 Tata Usaha
Kepala Tata Usaha mempunyai tugas melaksanakan ketatausahaan sekolah dan
bertanggung jawab kepada kepala sekolah dalam kegiatan-kegiatan sebagai berikut:
1. Penyusunan program kerja tata usaha sekolah.
(66)
3. Penyusunan administrasi perlengkapan sekolah.
4. Penyusunan laporan pelaksanaan kegiatan pengurusan ketatausahaan secara umum.
3.3.4 Komite Sekolah
Membantu sekolah dalam hal:
1. Peningkatan kegiatan sekolah.
2. Peningkatan kesejahteraan guru dan pegawai.
3.3.5 Guru
Guru bertanggung jawab kepada kepala sekolah dan mempunyai tugas melaksanakan
kegiatan proses belajar mengajar secara efektif dan efisien.
3.3.6 Wali Kelas
Membantu kepala sekolah dalam kegiatan:
1. Pengelolaan kelas.
2. Penyelenggaraan administrasi kelas.
3. Pembuatan catatan khusus tentang siswa.
4. Penyusunan statistik bulanan siswa.
3.4. Visi dan Misi Sekolah
3.4.1 Visi Sekolah
(67)
3.4.2 Misi Sekolah
Berdasarkan visi di atas, maka ditetapkan misi sebagai berikut :
1. Meningkatkan efektifitas dan efisiensi proses pembelajaran secara maksimal melalui
pembentukan kelas unggulan untuk percontohan bagi kelas lainnya.
2. Membuka les tambahan sore dengan mengacu kepada soal-soal UN dan
SPMB.
3. Membimbing siswa untuk persiapan kegiatan lomba seperti olimpiade sains, cerdas
cermat, olahraga, seni dan budaya.
4. Membekali siswa dengan life skills
5. Membina organisasi siswa yang bersifat sosial dan keagamaan seperti ROHIS.
6. Membudayakan wawasan wiyata mandala bagi seluruh warga sekolah.
7. Memupuk rasa persaudaraan dan sikap sopan santun terhadap orang lain.
8. Penggunaan busana muslim bagi guru dan siswa yang beragama Islam.
3.4.3 Tujuan Sekolah
a. Tujuan Jangka Pendek (1 – 2 tahun)
•
Terciptanya efektifitas dan efisiensi proses pembelajaran yang maksimal.
•
Membuka les tambahan sore dengan mengacu kepada soal-soal UN dan
SPMB.
•
Membimbing siswa untuk persiapan kegiatan lomba seperti olimpiade
sains, cerdas cermat, olahraga, seni dan budaya.
•
Membina organisasi siswa yang bersifat sosial dan keagamaan seperti
ROHIS.
(68)
•
Memupuk rasa persaudaraan dan sikap sopan santun terhadap orang lain.
•
Penggunaan busana muslim bagi guru dan siswa yang beragama Islam.
b. Jangka Menengah (2 – 4 tahun)
a. Sekolah unggulan ditingkat kecamatan Padangsidimpuan Utara
b.
Sekolah terlengkap sarana dan prasarana
c.
Memperoleh kejuaran dibidang olahraga dan seni
d.
80% kehadiran dan ketepatan waktu tercapai
e.
90% siswa warga sekolah memiliki sikap tulus dan ikhlas
dalam
mengemban tanggungjawab.
f. Dapat menjuarai olimpiade sains pada tingkat nasional
g. Lulusan bermutu dan terampil serta 50 % yang melanjut masuk PTN /PTS
h.
Tugas dan tanggungjawab dilaksanakan dengan tulus ikhlas oleh seluruh
warga sekolah
i. Rasa persaudaraan dan sikap sopan santun kepada orang lain dapat diamalkan
oleh setiap warga sekolah
(69)
BAB 4
ANALISIS DAN PERANCANGAN SISTEM
4.1 Analisis
Sebelum merancang sebuah aplikasi yang akan dibangun, faktor yang harus
diperhatikan adalah tahap analisis. Tahap analisis merupakan tahap pemahaman
dengan perangkat lunak yang akan digunakan, kebutuhan fungsional, diagram alir data,
kamus alir data dan enkripsi proses. Tahap analisis bertujuan untuk mengetahui
mekanisme sistem, proses–proses yang terlibat dalam sistem serta hubungan antara
proses tersebut.
4.2 Perencanaan dan Perancangan Sistem
Perencanaan dan perancangan merupakan sebuah tahap awal dalam membangun
sebuah situs. Membuat suatu situs memerlukan persiapan, perencanaan yang baik, tujuan
yang jelas dan percobaan yang berulang-ulang untuk dapat mendapatkan hasil yang terbaik
karena menyangkut semua elemen yang membentuk situs. Situs ini dirancang dengan
menggunakan PHP sebagai bahasa pemogramannya dan MySQL sebagai databasenya, serta
Dreamweaver 8 digunakan sebagai media untuk membuat layout dari situs yang telah
dirancang.
(70)
1. Situs apa yang akan dibuat?
2. Siapa saja pengunjung yang diharapkan berkunjung ke situs tersebut?
3. Apa saja aktivitas yang dapat pengunjung lakukan dalam situs tersebut?
4. Apa target yang ingin dicapai dari pembuatan situs tersebut?
Untuk semakin memperjelas dan mempermudah dalam membangun situs, maka
jawaban dari pertanyaan-pertanyaan di atas akan sangat membantu karena dari situlah
nantinya akan terbentuk kata kunci untuk membuat dan mengembangkan situs lebih lanjut.
Berkenaan dengan situs yang akan dibangun, maka jawaban untuk pertanyaan- pertanyaan
di atas sebagai berikut:
a. Situs akan dibuat adalah sistem informasi raport online sekolah berbasis web, dalam
hal ini adalah SMP Negeri 1 Silima Pungga-Pungga, yang menyediakan informasi raport
online sekolah tersebut.
b. Pengunjung dari website tersebut diharapkan adalah para siswa siswi, guru, wali
siswa SMP Negeri 1 Silima Pungga-Pungga.
c. Aktivitas yang akan dijumpai di dalam situs tersebut adalah pengunjung dapat
mengetahui informasi data-data nilai setiap siswa SMP Negeri 1 Silima Pungga-Pungga.
d. Target yang ingin dicapai dari situs tersebut adalah pengunjung mendapatkan
informasi tentang nilai raport setiap mata pelajaran di SMP Negeri 1 Silima
Pungga-Pungga, serta dapat membantu sekolah dalam mempromosikan sekolahnya.
(71)
4.3 Perancangan Data Flow Diagram (DFD)
Data Flow Diagram (DFD) merupakan diagram yang menggunakan notasi-notasi
(simbol-simbol) untuk menggambarkan arus dari data sistem. DFD sering digunakan untuk
menggambarkan suatu sistem yang telah ada atau sistem baru yang akan dikembangkan
secara logika tanpa mempertimbangkan lingkungan fisik dimana data tersebut mengalir.
Gambaran ini tidak tergantung pada perangkat keras, lunak, struktur data atau
organisasi. Adapun Data Flow Diagram yang penulis ajukan, yaitu:
(72)
2.0 Proses user ADMIN Info user USER Guru Siswa Data user 1.0 login Info user Data user siswa Data login Info login 3.0 Proses siswa 4.0 Proses guru 5.0 Proses kelas 6.0 Proses mata pelajaran 7.0 Proses jadwal 8.0 Proses nilai Info siswa Data siswa Info guru Data guru guru Info kelas Data kelas kelas
Info mata pelajaran
Data pelajaran Mata pelajaran Info jadwal Data jadwal jadwal Info nilai Data nilai nlai Info login Data login Data nilai Data login Info login Data nilai Info siswa Data siswa Info guru Data guru Info kelas Data kelas Data mapel Info mapel Info jadwal Data jadwal Data nilai Info nilai 9.0 Proses Mengajar Info Mengajar Data Mengajar mengajar 10.0
Proses Rapor Info Rapor
Data Rapor mengajar Wali Kelas Info login Data login Data nilai Info nilai Info Rapor Data nilai
(73)
4.4 Perancangan Flowchart
Tahap selanjutnya adalah tahap pembuatan flowchart (diagram alir) atau aliran informasi
dari situs tersebut. Flowchart atau diagram alir adalah gambaran yang menampilkan
struktur, hierarki, dan isi halaman per halaman. Dengan adanya flowchart, akan sangat
membantu untuk memvisualisasikan isi dari setiap halaman situs tersebut. Dengan
pembuatan flowchart dalam suatu situs dapat membantu mempermudah dalam
pemeliharaan dan pembaharuan isi situs. Hal ini sangat penting dilakukan karena isi situs
harus selalu diperbaharui sehingga pengunjung tidak bosan.
Penjelasan arti lambang-lambang flowchart dapat didefenisikan seperti berikut:
Simbol Fungsi
Terminator, untuk memulai dan mengakhiri suatu
program.
Process, suatu simbol yang menunjukkan setiap
pengolahan yang dilakukan oleh komputer.
Data, untuk memasukkan data maupun menunjukkan
hasil dari suatu proses.
Decision, suatu kondisi yang akan menghasilkan
beberapa kemungkinan jawaban atau pilihan.
Preparation, suatu simbol yang menyediakan
tempat-tempat pengolahan data dalam storage.
Connector, merupakan simbol untuk masuk dan
keluarnya suatu prosedur pada lembar kertas yang
sama.
Off-Page Connector, merupakan simbol untuk masuk
dan keluarnya suatu prosedur pada lembar kertas yang
lain.
Arus atau flow, prosedur yang dapat dilakukan dari
atas ke bawah, bawah ke atas, dari kiri ke kanan, atau
dari kanan ke kiri.
Document, merupakan simbol untuk data yang
berbentuk informasi.
Predefined process, untuk menyatakan sekumpulan
langkah proses yang ditulis sebagai prosedur.
Display, untuk output yang ditujukan suatu device,
seperti monitor.
(74)
Berikut adalah flowchart dari sistem informasi SMP Negeri 1 Silima
Pungga-Pungga
yang penulis rancang:
(75)
4.5 Mempersiapkan Database Server
Pada tahapan ini dipersiapkan tempat untuk menampung data di server, data tersebut
nantinya akan diproses oleh program yang kita buat pada tahap pemrograman, baik
penambahan, pengeditan, panghapusan dan menampilkan isi database ke halaman
website. Database terdiri atas tabel-tabel yang dibuat dengan menggunakan program
MySQL.
Adapun database yang dibuat oleh penulis adalah database dbsma dengan tabel-tabel
sebagai berikut:
Tabel 4.1 Admin
Nama Field Type Size Keterangan
Id_admin Integer 10 primary key
Username Varchar 30
Password Varchar 30
Email Varchar 30
Level Varchar 30
Tabel 4.2 Raport
Nama Field Type Size Keterangan
Id_raport Integer 100 primary key
Id_siswa Varchar 100
Id_kelas Varchar 100
Total_nilai Varchar 100
Rata-rata Varchar 100
Rangking Varchar 100 `
Tabel 4.3 Siswa
Nama Field Type Size Keterangan
Id_siswa Integer 100 primary key
Nis Integer 100
Nama_siswa Varchar 40
Jenis_kelamin Varchar 20
Alamat Varchar 40
Tempat_lahir Varchar 30
Tgl_lahir Varchar 20
Nama_ayah Varchar 40
Nama_ibu Varchar 30
No_telepon_wali Varchar 12
Email Varchar 30
Password Varchar 20
(76)
Tabel 4.4 Kelas
Nama Field Type Size Keterangan
Id_kelas Integer 10 primary key
Nama_kelas Varchar 30
Ruang Varchar 200
Tabel 4.5 Tabel Nilai
Nama Field Type Size Keterangan
Id_nilai Integer 5 primary key
Id_siswa Integer 5
Id_mata_pelajaran Integer 3
Id_kelas Integer 3
Id_guru Integer 3
Nilai Integer 3
Tabel 4.6 Mata Pelajaran
Nama Field Type Size Keterangan
Id_mata_pelajaran Integer 10 primary key Nama_mata_pelajaran Varchar 30
Tabel 4.7 Mengajar
Nama Field Type Size Keterangan
Id_mengajar Integer 10 primary key
Id_guru Integer 100
Id_mata_pelajaran Integer 10
Id_kelas Integer
10
Ruang Integer 100
Semester Integer 100
Tabel 4.8 Guru
Nama Field Type Size Keterangan
Id_guru Integer 100 primary key
Nip Integer 100
Nama_guru Varchar 40
Jenis_kelamin Varchar 20
Tempat_lahir Varchar 30
Tgl_lahir Varchar 20
Jabatan Varchar 30
Pendidikan_terakhir Varchar 10
Mulai_tugas Varchar 4
Email Varchar 30
(1)
DAFTAR ISI
Persetujuaan i
Pernyataan ii
Penghargaan iii
Abstrak v
Daftar Isi vi
Daftar Table ix
Daftar Gambar x
BAB 1 PENDAHULUAN
1.1 Latar Belakang 1
1.2 Rumusan Masalah 2
1.3 Batasan Masalah 3
1.4 Tujuan Penelitian 4
1.5 Manfaat Penelitian 4
1.6 Tinjauan pustaka 5
1.7 Metode penelitian 9
BAB 2 LANDASAN TEORI
2.1 Pengertian komputer 11
2.2 Pengertian internet 12
2.2.1 Fasilitas dalam dunia Internet 13
2.3 Network 14
2.4 Web Server 14
2.5 Pengenalan HTML 15
2.5.1 Bagian-Bagian HTML 16
2.5.2 Referensi HTML 17
2.6 Bahasa Pemrograman PHP 17
2.6.1 Sejarah PHP 18
2.6.2 Kelebihan Bahasa Pemrograman PHP 20
2.6.3 Contoh Pemrograman dengan menggunakan PHP 21
2.6.4 Proses Eksekusi kode PHP 21
2.6.5 Variabel pada PHP 22
2.6.6 Operator pada PHP 25
2.6.7 Integrasi PHP dengan DATABASE 27
2.7 Database MySQL 29
2.7.1 Perkembangan MySQL 30
2.7.2 Perintah Dasar MySQL 31
2.7.3 Keistimewaan MySQL 32
2.8 Macromedia Dreamweaver 8 34
2.8.1 Memulai Dreamweaver 8 34
2.8.2 Area kerja pada Dreamweaver 8 35
2.8.3 Menu Bar Area kerja 36
(2)
BAB 3 SEKILAS MENGENAI SMP NEGERI 1 SILIMA PUNGGA PUNGGA
Profil SMP NEGERI 1 SILIMA PUNGGA PUNGGA 38
3.2 Struktur Organisasi 39
3.3 Uraian Tugas dan Fungsi Organisasi 40
3.3.1 Kepala Sekolah 40
3.3.2 Wakil Kepala Sekolah 40
3.3.3 Tata Usaha 40
3.3.4 Komite Sekolah 41
3.3.5 Guru 41
3.3.6 Wali Kelas 41
3.4 Visi dan Misi Sekolah 42
3.4.1 Visi Sekolah 42
3.4.2 Misi Sekolah 42
3.4.3 Tujuan Sekolah 42
BAB 4 ANALISIS DAN PERANCANGAN SISTEM
4.1 Analisis 43
4.2 Perencanaan dan Perancangan Sistem 43
4.3 Perancangan Data Flow Diagram (DFD) 45
4.4 Perancangan Flow Chart 47
4.5 Mempersiapkan DataBase Server 49
4.6 Perancangan Halaman WebSite 51
4.7 Perancangan User Interface 54
BAB 5 IMPLEMENTASI SISTEM
5.1 Pengertian dan Tujuan Implementasi Sistem 55
5.2 Komponen Utama dalam Implementasi Sistem 56
5.2.1 Hardware (Perangkat Keras) 56
5.2.2 Software (Perangkat Lunak) 57
5.2.3 Brainware (Unsur Manusia) 57
5.3 Instalasi Apache,PHP dan MySQL 58
5.4 Prosedur penggunaan Program 59
5.5 Pemeliharaan Implementasi Sistem (WebSite) 61
5.6 Demonstrasi Program 62
5.6.1 Tampilan Home Page 62
5.6.2 Tampilan Halaman Admin 63
5.6.3 Tampilan User Admin 64
5.6.4 Tampilan Guru Admin 64
5.6.5 Tampilan Data Kelas Admin 65
5.6.6 Tampilan Halaman Data Mata Pelajaran 65
5.6.7 Tampilan Halaman Data Siswa 66
5.6.8 Tampilan Halaman Form Tambah User 66
5.6.9 Tampilan Halaman Form Tambah Data Guru 67
5.6.10 Tampilan Halaman Tambah Data Siswa 67
5.6.11 Tampilan Halaman Utama Login Sebagai Guru 68
5.6.12 Tampilan Penginputan Nilai Siswa Oleh Guru 68
(3)
5.6.14 Tampilan Halaman Utama Wali Kelas 69
5.6.15 Tampilan Data Nilai dan Peringkat Siswa 70
5.6.16 Tampilan Data Nilai Siswa Per Mata Pelajaran 70
5.6.17 Tampilan Data Profile Wali Kelas 71
5.6.18 Tampilan Halaman Utama Login Siswa 71
5.6.19 Tampilan Data Nilai Pribadi Siswa 72
BAB 6 KESIMPULAN DAN SARAN
6.1 Kesimpulan 73
6.2 Saran 74
LAMPIRAN
(4)
DAFTAR TABEL
Nomor Tabe Judul Halaman
2.1 perator Aritmatika pada PHP 25
2.2 Operator Perbandingan pada PHP 26
2.3 Operator Logika pada PHP 26
2.4 Daftar Database-Database yang
Didukung PHP 28
2.5 Simbol-Simbol pada Flowchart 37
4.1 Admin 49
4.2 Raport 49
4.3 Siswa 49
4.4 Kelas 50
4.5 Tabel Nilai 50
4.6 Mata Pelajaran 50
4.7 Mengajar 50
4.8 Guru 50
(5)
DAFTAR GAMBAR
Nomor Gambar Judul Halaman
2.1 Hasil Program dengan Menggunakan PHP 22
2.2 Proses Eksekusi Kode PHP 22
2.3 Tampilan Area Kerja Dreamweaver 35
3.1 Struktur Organisasi 39
4.1 Diagram Konteks 45
4.2 Diagram Kontels Level 0 (Nol) 46
4.3 Flowchart halaman Login Administrator 48
4.5 Tampilan Macromedia Dreamweaver 8 53
4.6 Header Situs 54
5.1 Tampilan Website pada Web Browser 60
5.2 Tampilan Bagian Homepage 62
5.3 Tampilan Halaman Admin 63
5.4 Halaman User Admin 64
5.5 Halaman Guru Admin 64
5.6 Halaman Data Kelas Admin 65
5.7 Halaman Data Mata Pelajaran 65
5.8 Halaman Data Siswa 66
5.9 Halaman Form Tambah User 66
5.10 Halaman Form Tambah Data Guru 67
5.11 Halaman Tambah Data Siswa 67
5.12 Halaman Utama Login Sebagai Guru 68
5.13 Halaman Penginputan Nilai Siswa Oleh Guru 68
5.14 Halaman Data Profil Guru 69
5.15 Halaman Utama Wali Kelas 69
5.16 Halaman Data Nilai dan Peringkat Siswa 70
(6)
5.18 Halaman Data Profil Wali Kelas 71
5.19 Halaman Penginputan Nilai Siswa Oleh guru 71