76
1 BAB 2 PERANCANGAN APLIKASI 2.1. Rancangan Database Dalam pembuatan database kita harus menjalankan dulu aplikasi XAMPP Control Panel dengan klik aplikasinya. Setelah aplikasi berjalan, kita klik tombol Start untuk module Apache dan Mysql. Gambar 2.1.1. XAMPP control panel Kemudian pada module Mysql klik tombol admin, sehingga muncul halaman localhost pada browser yang kita gunakan, Gambar 2.1.2. Halaman localhost pada Broswer

PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

  • Upload
    others

  • View
    10

  • Download
    0

Embed Size (px)

Citation preview

Page 1: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

1

BAB 2 PERANCANGAN APLIKASI

2.1. Rancangan Database Dalam pembuatan database kita harus menjalankan dulu aplikasi XAMPP Control Panel dengan klik aplikasinya.

Setelah aplikasi berjalan, kita klik tombol Start untuk module Apache dan Mysql.

Gambar 2.1.1. XAMPP control panel

Kemudian pada module Mysql klik tombol admin, sehingga muncul halaman localhost pada browser yang kita gunakan,

Gambar 2.1.2. Halaman localhost pada Broswer

Page 2: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

2

A. Membuat Database Klik menu “Databases”, lalu ketikkan “dbsitus” apada kolom “create database”, kemudian klik tombol “Create”

Gambar 2.1.3. Tampilan menu create database

Kita dapat mengecek hasil database yang kita buat di menu “Home”,

Gambar 2.1.4. Menu home phpMyadmin

B. Membuat Tabel Admin Ketika telah masuk kedalam database “dbsitus”, kemudian klik “create table” Pada kolom “tabel name”, ketikkan “admin”, lalu dalam kolom nama field

Gambar 2.1.5. Tampilan menu create tabel

Ketikkan nama field sebagai berikut :

Page 3: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

3

Tabel 2. 1 Field admin Field Name Size Type Keterangan

admin_id 11 int Primary Key, Auto Increment

name long text email long text password long text level long text

Pada field “admin_id” pada menu “index” pilih “Primary key” kemudian checklist “Auto Increment”. Jika sudah selesai, kemudian klik tombol “save”, hasilnya sebagai berikut :

Gambar 2.1.6. Hasil tabel admin

C. Membuat Tabel Student Langkah-langkah yang dilakukan hampir sama seperti pembuatan tabel admin, kita hanya merubah nama dan isi field saja. Pada kolom “tabel name”, ketikkan “student”, lalu dalam kolom nama field ketikkan nama field sebagai berikut :

Tabel 2. 2 Field student Field Name Size Type Keterangan

student_id 11 Int Primary Key, Auto Increment

name Long text birthday Long text Sex Long text address Long text Phone Long text email Long text password Long text father_name Long text mother_name Long text class_id Long text Roll Long text

Page 4: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

4

Pada field “student_id” pada menu “index” pilih “Primary key” kemudian checklist “Auto Increment”. Jika sudah selesai, kemudian klik tombol “save”, hasilnya sebagai berikut :

Gambar 2.1.7. Hasil Tabel student D. Membuat Tabel Invoice Langkah-langkah yang dilakukan hampir sama seperti pembuatan tabel admin, kita hanya merubah nama dan isi field saja. Pada kolom “tabel name”, ketikkan “invoice”, lalu dalam kolom nama field ketikkan nama field sebagai berikut :

Tabel 2. 3 Field invoice Field Name Size Type Keterangan

invoice_id 11 int PrimaryKey, Auto Increment

student_id 11 int Title longtext description longtext Amount 11 int creation_timestamp 11 int Transaksi_id longtext payment_timestamp 11 int payment_method longtext Status longtext

Page 5: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

5

Pada field “invoice_id” pada menu “index” pilih “Primary key” kemudian checklist “Auto Increment”. Jika sudah selesai, kemudian klik tombol “save”, hasilnya sebagai berikut :

Gambar 2.1.8. Hasil tabel invoice

2.2. Rancangan Halaman Login Dalam pembuatan halaman web, kita menggunakan aplikasi “Sublime Text 3” dan file “CodeIgniter-3.1.10.zip” yang dapat kita unduh secara gratis lewat situs online.

file “CodeIgniter-3.1.10.zip” kita extract di Local Disk(C:)->xampp-> htdocs, ubah nama file tersebut menjadi “situs”. Lalu kita buka aplikasi “Sublime Text 3”, dalam menu file->open folder pilih lokasi file “situs” yang tadi kita simpan kemudian klik tombol “select folder” Setelah terbuka , tampilannya adalah sebagai berikut;

Gambar 2.2.1. Tampilan codeIgniter di Sublime text 3

Page 6: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

6

A. Menu config Dalam menu application pilih config->config.php. Dalam line Base Site url ketikkan kode berikut :

$config['base_url'] = 'http://localhost/situs/'; Koding ini berguna untuk menampilkan nama web yang akan kita buat, dimana nama web yang akan kita buat adalah “situs”.

Gambar 2.2.2. Hasil penamaan web

masih dalam menu application, sub menu config, kita pilih database.php. kita akan menghubungkan dengan database yang telah kita buat sebelumnya, konfigurasinya adalah sebagai berikut :

Gambar 2.2.3. Koding penghubung database

sedangkan dalam file autoload.php kita hanya merubah line autoload libararies dan helper. $autoload['libraries'] = array('session','pagination', 'xmlrpc' , 'form_validation', 'email','upload','encrypt'); $autoload['helper'] =array('url','file','form','security', 'string','inflector','directory','download');

Page 7: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

7

Gambar 2.2.4. Koding pada autoload

B. Menu Controller Dashboard Login Dalam menu controller kita buat file baru dengan nama login.php. Langkah-langkahnya adalah sebagai berikut : Klik kanan pada menu controller kemudian File->new file->tulis nama file”login.php”->save.

Gambar 2.2.5. Tampilan halaman login

Kemudian kita ketikkan koding sebagai berikut;

<?php if (!defined('BASEPATH')) exit('No direct script access allowed'); class Login extends CI_Controller { function __construct() { parent::__construct(); $this->load->model('crud_model'); $this->load->database(); } public function index()

Page 8: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

8

{ if ($this->session->userdata('admin_login') == 1) redirect(base_url() . 'admin/dashboard', 'refresh'); if ($this->session->userdata('student_login') == 1) redirect(base_url() . 'student/dashboard', 'refresh'); $config = array( array( 'field' => 'email', 'label' => 'Email', 'rules' => 'required|xss_clean|valid_email' ), array( 'field' => 'password', 'label' => 'Password', 'rules' => 'required|xss_clean|callback__validate_login' ) ); $this->form_validation->set_rules($config); $this->form_validation->set_message('_validate_login', ucfirst($this- >input->post('login_type')) . ' Login Gagal!'); $this->form_validation->set_error_delimiters('<div class="alert alert- error"> <button type="button" class="close" data-dismiss="alert">×</button>', '</div>'); if ($this->form_validation->run() == FALSE) { $this->load->view('login'); } else { if ($this->session->userdata('admin_login') == 1) redirect(base_url() . 'admin/dashboard', 'refresh'); if ($this->session->userdata('student_login') == 1) redirect(base_url() . 'student/dashboard', 'refresh'); } } function _validate_login($str) { if ($this->input->post('login_type') == '') { $this->session->set_flashdata('flash_message', get_phrase('pilih_tipe_akun')); redirect(base_url() . 'login', 'refresh');

Page 9: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

9

return FALSE; } $query = $this->db->get_where($this->input->post('login_type'), array( 'email' => $this->input->post('email'), 'password' => $this->input->post('password') )); if ($query->num_rows() > 0) { $row = $query->row(); if ($this->input->post('login_type') == 'admin') { $this->session->set_userdata('admin_login', '1'); $this->session->set_userdata('admin_id', $row->admin_id); $this->session->set_userdata('name', $row->name); $this->session->set_userdata('level', $row->level); $this->session->set_userdata('login_type', 'admin'); } if ($this->input->post('login_type') == 'student') { $this->session->set_userdata('student_login', '1'); $this->session->set_userdata('student_id', $row->student_id); $this->session->set_userdata('name', $row->name); $this->session->set_userdata('login_type', 'student'); } return TRUE; } else { $this->session->set_flashdata('flash_message', get_phrase ('login_gagal')); redirect(base_url() . 'login', 'refresh'); return FALSE; } } function four_zero_four() { $this->load->view('four_zero_four'); } function reset_password() { $account_type = $this->input->post('account_type'); if ($account_type == "") { redirect(base_url(), 'refresh'); } $email = $this->input->post('email'); $result=$this->email_model->assword_reset_email ($account_type, $email); if ($result == true) {

Page 10: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

10

$this->session->set_flashdata('flash_message', get_phrase('password_dikirim')); } else if ($result == false) { $this->session->set_flashdata('flash_message', get_phrase ('akun tidak ditemukan')); } redirect(base_url(), 'refresh'); } function logout() { $this->session->unset_userdata(); $this->session->sess_destroy(); $this->session->set_flashdata('logout_notification', 'logged_out'); redirect(base_url() . 'login', 'refresh'); } }

Setelah selesai kita klik “save”(ctrl + s). C. Menu Models Dalam menu Models kita buat file baru dengan nama crud_model.php dan email_model.php. crud_model.php berguna untuk proses pembacaan, update dan delete konten dari web yang akan kita buat. Sedangkan email_model.php berguna untuk menghubungkan web dengan email. Langkah-langkah pembuatan kedua file tersebut sama seperti dalam pembuatan file login.php. Berikut adalah koding program untuk file crud_model.php,

<?php if ( ! defined('BASEPATH')) exit ('No direct script access allowed'); class Crud_model extends CI_Model { function __construct() { parent::__construct(); } function get_type_name_by_id($type,$type_id='',$field='name') { return $this->db->get_where($type,array($type.'_id'=>$type_id))- >row()->$field; } function get_students($class_id)

{

Page 11: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

11

$query=$this->db->get_where('student' , array('class_id' => $class_id)); return $query->result_array(); } function get_student_info($student_id) { $query =$this->db->get_where('student' , array('student_id' => $student_id)); return $query->result_array(); } function get_teachers() { $query =$this->db->get('teacher' ); return $query->result_array(); } function get_teacher_name($teacher_id) { $query =$this->db->get_where('teacher' , array('teacher_id' => $teacher_id)); $res =$query->result_array(); foreach($res as $row) return $row['name']; } function get_teacher_info($teacher_id) { $query =$this->db->get_where('teacher' , array('teacher_id' => $teacher_id)); return $query->result_array(); } function get_subjects() { $query =$this->db->get('subject' ); return $query->result_array(); } function get_subject_info($subject_id) { $query =$this->db->get_where('subject' , array('subject_id' => $subject_id)); return $query->result_array(); } function get_subjects_by_class($class_id) {

Page 12: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

12

$query =$this->db->get_where('subject' , array('class_id' => $class_id)); return $query->result_array(); } function get_subject_name_by_id($subject_id) { $query =$this->db->get_where('subject' , array('subject_id' => $subject_id))->row(); return $query->name; } function get_class_name($class_id) { $query =$this->db->get_where('class' , array('class_id' => $class_id)); $res = $query->result_array(); foreach($res as $row) return $row['name']; } function get_class_name_numeric($class_id) { $query =$this->db->get_where('class' , array('class_id' => $ class_id)); $res = $query->result_array(); foreach($res as $row) return $row['name_numeric']; } function get_classes() { $query =$this->db->get('class' ); return $query->result_array(); } function get_class_info($class_id) { $query =$this->db->get_where('class' , array('class_id' => $class_id)); return $query->result_array(); } function get_exams() { $query =$this->db->get('exam' ); return $query->result_array(); } function get_exam_info($exam_id)

Page 13: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

13

{ $query =$this->db->get_where('exam' , array('exam_id' => $exam_id)); return $query->result_array(); } function get_grades() { $query =$this->db->get('grade' ); return $query->result_array(); } function get_grade_info($grade_id) { $query =$this->db->get_where('grade' , array('grade_id' => $grade_id)); return $query->result_array(); } function get_grade($mark_obtained) { $query =$this->db->get('grade' ); $grades=$query->result_array(); foreach($grades as $row) { if($mark_obtained >= $row['mark_from'] && $mark_obtained <= $row['mark_upto']) return $row; } } function get_system_settings() { $query =$this->db->get('settings' ); return $query->result_array(); } function create_backup($type) { $this->load->dbutil(); $options = array( 'format' => 'txt', 'add_drop' => TRUE, 'add_insert' => TRUE,

'newline' => "\n" ); if($type == 'all')

Page 14: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

14

{ $tables = array(''); $file_name='system_backup'; } else { $tables = array('tables'=>array($type)); $file_name='backup_'.$type; } $backup =& $this->dbutil->backup(array_merge($options , $tables)); $this->load->helper('download'); force_download($file_name.'.sql', $backup); } function restore_backup() { move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/backup.sql'); $this->load->dbutil(); $prefs = array( 'filepath'=> 'uploads/backup.sql', 'delete_after_upload' => TRUE,'delimiter'=> ';' ); $restore =& $this->dbutil->restore($prefs); unlink($prefs['filepath']); } function truncate($type) { if($type == 'all') { $this->db->truncate('student'); $this->db->truncate('mark'); $this->db->truncate('teacher'); $this->db->truncate('subject'); $this->db->truncate('class'); $this->db->truncate('exam'); $this->db->truncate('grade'); } else { $this->db->truncate($type); } } function get_image_url($type = '' , $id = '')

Page 15: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

15

{ if(file_exists('uploads/'.$type.'_image/'.$id.'.jpg')) $image_url=base_url().'uploads/'.$type.'_image/'.$id.'.jpg'; else $image_url = base_url().'uploads/user.jpg'; return $image_url; } }

D. Menu View dashboard login Menu view merupakan menu untuk tampilan di web yang akan kita buat, dimana koding program didalam menu view berguna untuk menampilkan hasil program di menu controller dan menu model. Untuk dashboard login, kita buat file baru di menu view denagan nama login.php, proses pembuatannya sama dengan file login.php di menu controlle, yang membedakan adalah koding program didalamnya. Koding program untuk login.php di menu view adalah sebgai berikut;

<!DOCTYPE > <html> <head> <meta name="viewport" content="width=device-width, maximum-scale=1, initial-scale=1, user-scalable=0"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible"> <?php include 'includes.php';?> <title><?php echo get_phrase('login');?> | <?php echo $system_title;?></title> </head> <body> <div id="main_body"> <?php if($this->session->flashdata('flash_message') != ""):?> <script> $(document).ready(function() { Growl.info({title:"<?php echo $this->session->flashdata ('flash_message');?>",text:" "}) }); </script> <?php endif;?> <div class="navbar navbar-top navbar-inverse"> <div class="navbar-inner"> <div class="container-fluid" align="center">

Page 16: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

16

<a class="brand" href="<?php echo base_url();?>"> <?php echo $system_name;?> </a> </div> </div> </div> <div class="container"> <div class="span4 offset4"> <div class="padded"> <center> <img src="<?php echo base_url();?>uploads/logo.png" style="max- height:100px;margin:20px 0px;" /> </center> <div class="login box" style="margin-top: 10px;"> <div class="box-header"> <span class="title"><?php echo get_phrase('login');?></span> </div> <div class="box-content padded"> <script> function check_account_type() { var account_type=document.getElementById ('account_selector').value; if (account_type == "") { Growl.info({title:"Pilih Tipe Akun Terlebih dahulu",text:" "}) return false; } else return true; } </script> <?php echo form_open('login' , array('class' => 'separate- sections', 'onsubmit' => 'return check_account_type()'));?> <center> <div style="height:100px;"> <div id="avatar" class="avatar"> <img src="<?php echo base_url();?>template/ images/icons_big/account.png" class="avatar-big" id="account_img" style=""/> </div> </div> <img src="<?php echo base_url();?>template/images/icons_big/ admin.png" style="display:none;"/>

Page 17: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

17

<img src="<?php echo base_url();?>template/images/icons_big/ student.png" style="display:none;"/> </center> <div class=""> <select id="account_selector" class="validate[required]" name= "login_type" style="width:100%;margin-bottom:0px !important;"> <option value=""><?php echo get_phrase('tipe akun');?></option> <option value="admin"><?php echo get_phrase('admin');?></option> <option value="student"><?php echo get_phrase('Siswa');?></option> </select> </div> <style> .flip_in{ opacity:0; -moz-transform:rotateY(-90deg); -webkit-transform:rotateY(-90deg); transform:rotateY(-90deg); transition:.2s; } .flip_out{ opacity:1; -moz-transform:rotateY(0deg); -webkit-transform:rotateY(0deg); transform:rotateY(0deg); transition:.2s; } </style> <script> $(document).ready(function(){ $("#account_selector").change(function(){ function rotate_in() { $('#avatar').toggleClass('flip_in'); } setTimeout(rotate_in, 0); function set_img() { var img = document.getElementById('account_selector').value; if(img == "") img='account'; $("#account_img").attr("src", "<?php echo base_url();?>template /images/icons_big/"+img+".png"); } setTimeout(set_img, 200); function rotate_out() { $('#avatar').toggleClass('flip_out'); } setTimeout(rotate_out, 200); function reset_class()

Page 18: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

18

{$("#avatar").attr("class", "avatar");} setTimeout(reset_class, 500); }); }); </script <div class="input-prepend"> <span class="add-on" href="#"> <i class="icon-envelope"></i> </span> <input name="email" type="text" placeholder="<?php echo get_phrase ('email');?>" autocomplete="off"> </div> <div class="input-prepend"> <span class="add-on" href="#"> <i class="icon-key"></i> </span> <input name="password" type="password" placeholder="<?php echo get_phrase('password');?>" autocomplete="off"> </div> <div class="row-fluid"> <div class="span6"> <a data-toggle="modal" href="#modal-simple" class="btn btn-blue btn- block" > <?php echo get_phrase('lupa_password ?');?> </a> </div> <div class="span6"> <input type="submit" class="btn btn-gray btn-block " value="<?php echo get_phrase('login');?>"/> </div> </div> </form> </div> </div> <hr /> <div style="color:#a5a5a5;"> </div> </div> </div> </div> </div> <!-----------password reset form ------> <div id="modal-simple" class="modal hide fade" style="top:30%;"> <div class="modal-header">

Page 19: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

19

<button type="button" class="close" data-dismiss="modal" aria- hidden="true">&times;</button> <h6 id="modal-tablesLabel"><?php echo get_phrase ('reset_password');?> </h6> </div> <div class="modal-body" style="padding:20px;"> <?php echo form_open('login/reset_password');?> <select class="validate[required]" name="account_type" style= "margin-bottom: 0px !important;"> <option value=""><?php echo get_phrase('type akun');?></option> <option value="admin"><?php echo get_phrase ('admin');?></option> <option value="student"><?php echo get_phrase('Siswa');?></option> </select> <input type="email" name="email" placeholder="<?php echo get_phrase('email');?>" style="margin-bottom: 0px !important;"/> <input type="submit" value="<?php echo get_phrase('reset');?>" class="btn btn-blue btn-medium"/> <?php echo form_close();?> </div> <div class="modal-footer"> <button class="btn btn-default" data-dismiss="modal"> Close</button> </div> </div> <!-----------password reset form ------> <body> </html>

Didalam web kita juga harus mengatur tampilan header dan footer, agar terlihat lebih menarik, dimana header dan footer ini akan ditampilkan dalam semua tampilan menu web. Pertama kita buat file baru di menu view dengan nama header.php dan header,php. Kemudian isikan koding berikut di file header,php;

<div class="navbar navbar-top navbar-inverse"> <div class="navbar-inner"> <div class="container-fluid"> <a class="brand" href="<?php echo base_url();?>"><?php echo $system_name;?></a>

Page 20: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

20

<ul class="nav pull-right"> <li class="toggle-primary-sidebar hidden-desktop" data-toggle="collapse" data-target=".nav-collapse-primary"><button type="button" class="btn btn-navbar"><i class="icon-th-list"></i></button></li> <li class="hidden-desktop" data-toggle="collapse" data-target=".nav-collapse-top"><button type="button" class="btn btn-navbar"><i class="icon-align-justify"></i></button></li> </ul> <div class="nav-collapse nav-collapse-top collapse"> <ul class="nav pull-right"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"><?php echo get_phrase('akun');?> <b class="caret"></b></a> <ul class="dropdown-menu"> <li class="with-image"> <div class="avatar"> <img src="<?php echo base_url();?>template/images/icons_big/<?php echo $this->session->userdata('login_type');?>.png" class="avatar-medium"/> </div> <span><?php echo $this->session->userdata('name');?></span> </li> <li class="divider"></li> <li><a href="<?php echo base_url();?><?php echo $account_type;?> /manage_profile"> <li class="icon-user"></li><span><?php echo get_phrase('profile');?>< /span></a></li> <li><a href="<?php echo base_url();?><?php echo $account_type;?> /manage_profile"> <li class="icon-lock"></li><span><?php echo get_phrase ('ganti_password');?></span></a></li> <li><a href="<?php echo base_url();?>login/logout"> <li class="icon-off"></li><span><?php echo get_phrase ('logout');?></span></a></li> </ul> </li> </ul> <ul class="nav pull-right"> <li class="dropdown"> <a href="#" ><i class="icon-user"></i><?php echo get_phrase($this->session->userdata('login_type')).' '.get_phrase('panel');?> </a> </li> </ul> </div>

Page 21: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

21

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

Dan koding berikut di file footer.php,

<div style="clear:both;color:#aaa; padding:20px;"> <center></center> </div>

2.3. Rancangan Halaman Dashboard Admin Dalam sub bab ini, kita akan mencoba membuat dashboard admin. Dimana dalam dashboard admin, seorang admin user dapat mengubah isi/konten web situs. Admin user memiliki hak akses dalam mengisi data siswa, data wali murid, data guru,jadwal mengajar dan nilai siswa. Berikut tampilan dari dashboard admin.

Gambar 2.3.1. Tampilan dashboard admin

Dalam membuat dashboard admin, kita hanya perlu menambahkan tiga file tambahan. File admin.php di menu controller, kemudian buat folder baru Admin di menu views untuk menampung file dashboard.php dan file navigation.php. Berikut koding untuk file admin.php di menu controller,

<?php if (!defined('BASEPATH')) exit('No direct script access allowed'); class Admin extends CI_Controller { function __construct() { parent::__construct();

Dashboar admin

navigatio

n

Page 22: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

22

$this->load->database(); } public function index() { if ($this->session->userdata('admin_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($this->session->userdata('admin_login') != 1) redirect(base_url() . 'admin/dashboard', 'refresh'); } /***ADMIN DASHBOARD***/ function dashboard() { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); $page_data['page_name'] = 'dashboard'; $page_data['page_title'] = get_phrase('ruang tata usaha'); $this->load->view('index', $page_data); } /****MANAGE STUDENTS CLASSWISE*****/ function student($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect('login', 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['birthday'] = $this->input->post('birthday'); $data['sex'] = $this->input->post('sex'); $data['address'] = $this->input->post('address'); $data['phone'] = $this->input->post('phone'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $data['father_name'] = $this->input->post('father_name'); $data['mother_name'] = $this->input->post('mother_name'); $data['class_id'] = $this->input->post('class_id'); $data['roll'] = $this->input->post('roll'); $this->db->insert('student', $data); $student_id = mysql_insert_id(); move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/ student_image/' . $student_id . '.jpg'); $this->email_model->account_opening_email('student', $data['email']); redirect(base_url() . 'admin/student/' . $data['class_id'], 'refresh'); } if ($param2 == 'do_update') {

Page 23: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

23

$data['name'] = $this->input->post('name'); $data['birthday'] = $this->input->post('birthday'); $data['sex'] = $this->input->post('sex'); $data['address'] = $this->input->post('address'); $data['phone'] = $this->input->post('phone'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $data['father_name'] = $this->input->post('father_name'); $data['mother_name'] = $this->input->post('mother_name'); $data['class_id'] = $this->input->post('class_id'); $data['roll'] = $this->input->post('roll'); $this->db->where('student_id', $param3); $this->db->update('student', $data); move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/ student_image/' . $param3 . '.jpg'); $this->crud_model->clear_cache(); redirect(base_url() . 'admin/student/' . $param1, 'refresh'); } else if ($param2 == 'edit') { $page_data['edit_data'] = $this->db->get_where('student', array( 'student_id' => $param3 ))->result_array(); } else if ($param2 == 'personal_profile') { $page_data['personal_profile'] = true; $page_data['current_student_id'] = $param3; } else if ($param2 == 'academic_result') { $page_data['academic_result'] = true; $page_data['current_student_id'] = $param3; } if ($param2 == 'delete') { $this->db->where('student_id', $param3); $this->db->delete('student'); redirect(base_url() . 'admin/student/' . $param1, 'refresh'); } $page_data['class_id'] = $param1; $page_data['students'] = $this->db->get_where('student', array( 'class_id' => $param1 ))->result_array(); $page_data['page_name'] = 'student'; $page_data['page_title'] = get_phrase('manajemen_siswa'); $this->load->view('index', $page_data); } /****MANAGE PARENTS CLASSWISE*****/ function parent($param1 = '', $param2 = '', $param3 = '')

Page 24: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

24

{ if ($this->session->userdata('admin_login') != 1) redirect('login', 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $data['student_id'] = $param2; $data['relation_with_student'] = $this->input->post ('relation_with_student'); $data['phone'] = $this->input->post('phone'); $data['address'] = $this->input->post('address'); $data['profession'] = $this->input->post('profession'); $this->db->insert('parent', $data); $this->email_model->account_opening_email('parent',$data['email']) $class_id = $this->db->get_where('student', array('student_id'=> $data['student_id']))->row()->class_id; redirect(base_url() . 'admin/parent/' . $class_id , 'refresh'); } if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $data['relation_with_student'] = $this->input->post ('relation_with_student'); $data['phone'] = $this->input->post('phone'); $data['address'] = $this->input->post('address'); $data['profession'] = $this->input->post('profession'); $this->db->where('parent_id', $param2); $this->db->update('parent', $data); redirect(base_url() . 'admin/parent/' . $param3, 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('parent', array( 'parent_id' => $param3 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('parent_id', $param2); $this->db->delete('parent'); redirect(base_url() . 'admin/parent/' . $param3, 'refresh'); } $page_data['class_id'] = $param1; $page_data['students'] = $this->db->get_where('student', array(

Page 25: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

25

'class_id' => $param1 ))->result_array(); $page_data['page_name'] = 'parent'; $page_data['page_title'] = get_phrase('manajemen_wali siswa'); $this->load->view('index', $page_data); } /****MANAGE TEACHERS*****/ function teacher($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['birthday'] = $this->input->post('birthday'); $data['sex'] = $this->input->post('sex'); $data['address'] = $this->input->post('address'); $data['phone'] = $this->input->post('phone'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $this->db->insert('teacher', $data); $teacher_id = mysql_insert_id(); move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/ teacher_image/' . $teacher_id . '.jpg'); $this->email_model->account_opening_email('teacher', $data['email']); redirect(base_url() . 'admin/teacher/', 'refresh'); } if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['birthday'] = $this->input->post('birthday'); $data['sex'] = $this->input->post('sex'); $data['address'] = $this->input->post('address'); $data['phone'] = $this->input->post('phone'); $data['email'] = $this->input->post('email'); $data['password'] = $this->input->post('password'); $this->db->where('teacher_id', $param2); $this->db->update('teacher', $data); move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/ teacher_image/' . $param2 . '.jpg'); redirect(base_url() . 'admin/teacher/', 'refresh'); } else if ($param1 == 'personal_profile') { $page_data['personal_profile'] = true; $page_data['current_teacher_id'] = $param2; } else if ($param1 == 'edit') {

Page 26: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

26

$page_data['edit_data'] = $this->db->get_where('teacher', array( 'teacher_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('teacher_id', $param2); $this->db->delete('teacher'); redirect(base_url() . 'admin/teacher/', 'refresh'); } $page_data['teachers'] = $this->db->get('teacher')->result_array(); $page_data['page_name'] = 'teacher'; $page_data['page_title'] = get_phrase('manajemen_guru'); $this->load->view('index', $page_data); } /****MANAGE SUBJECTS*****/ function subject($param1 = '', $param2 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['class_id'] = $this->input->post('class_id'); $data['teacher_id'] = $this->input->post('teacher_id'); $this->db->insert('subject', $data); redirect(base_url() . 'admin/subject/', 'refresh'); } if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['class_id'] = $this->input->post('class_id'); $data['teacher_id'] = $this->input->post('teacher_id'); $this->db->where('subject_id', $param2); $this->db->update('subject', $data); redirect(base_url() . 'admin/subject/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('subject', array( 'subject_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('subject_id', $param2); $this->db->delete('subject'); redirect(base_url() . 'admin/subject/', 'refresh');

Page 27: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

27

} $page_data['subjects'] = $this->db->get('subject')->result_array(); $page_data['page_name'] = 'subject'; $page_data['page_title'] = get_phrase('manajemen_Mata pelajaran'); $this->load->view('index', $page_data); } /****MANAGE CLASSES*****/ function classes($param1 = '', $param2 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['name_numeric'] = $this->input->post('name_numeric'); $data['teacher_id'] = $this->input->post('teacher_id'); $this->db->insert('class', $data); redirect(base_url() . 'admin/classes/', 'refresh'); } if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['name_numeric'] = $this->input->post('name_numeric'); $data['teacher_id'] = $this->input->post('teacher_id'); $this->db->where('class_id', $param2); $this->db->update('class', $data); redirect(base_url() . 'admin/classes/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('class', array( 'class_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('class_id', $param2); $this->db->delete('class'); redirect(base_url() . 'admin/classes/', 'refresh'); } $page_data['classes'] = $this->db->get('class')->result_array(); $page_data['page_name'] = 'class'; $page_data['page_title'] = get_phrase('manajemen_kelas'); $this->load->view('index', $page_data); } /****MANAGE EXAMS*****/ function exam($param1 = '', $param2 = '') {

Page 28: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

28

if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['date'] = $this->input->post('date'); $data['comment'] = $this->input->post('comment'); $this->db->insert('exam', $data); redirect(base_url() . 'admin/exam/', 'refresh'); } if ($param1 == 'edit' && $param2 == 'do_update') { $data['name'] = $this->input->post('name'); $data['date'] = $this->input->post('date'); $data['comment'] = $this->input->post('comment'); $this->db->where('exam_id', $param3); $this->db->update('exam', $data); redirect(base_url() . 'admin/exam/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('exam', array( 'exam_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('exam_id', $param2); $this->db->delete('exam'); redirect(base_url() . 'admin/exam/', 'refresh'); } $page_data['exams'] = $this->db->get('exam')->result_array(); $page_data['page_name'] = 'exam'; $page_data['page_title'] = get_phrase('manajemen_ujian'); $this->load->view('index', $page_data); } /****MANAGE EXAM MARKS*****/ function marks($exam_id = '', $class_id = '', $subject_id = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($this->input->post('operation') == 'selection') { $page_data['exam_id'] = $this->input->post('exam_id'); $page_data['class_id'] = $this->input->post('class_id'); $page_data['subject_id'] = $this->input->post('subject_id');

Page 29: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

29

if ($page_data['exam_id'] > 0 && $page_data['class_id'] > 0 && $page_data['subject_id'] > 0) { redirect(base_url() . 'admin/marks/' . $page_data['exam_id'] . '/' . $page_data['class_id'] . '/' . $page_data['subject_id'], 'refresh'); } else { $this->session->set_flashdata('mark_message', 'Choose exam, class and subject'); redirect(base_url() . 'admin/marks/', 'refresh'); } } if ($this->input->post('operation') == 'update') { $data['mark_obtained'] = $this->input->post('mark_obtained'); $data['attendance'] = $this->input->post('attendance'); $data['comment'] = $this->input->post('comment'); $this->db->where('mark_id', $this->input->post('mark_id')); $this->db->update('mark', $data); redirect(base_url() . 'admin/marks/' . $this->input->post('exam_id') . '/' . $this->input->post('class_id') . '/' . $this->input- >post('subject_id'), 'refresh'); } $page_data['exam_id'] = $exam_id; $page_data['class_id'] = $class_id; $page_data['subject_id'] = $subject_id; $page_data['page_info'] = 'Exam marks'; $page_data['page_name'] = 'marks'; $page_data['page_title'] = get_phrase('Manajemen_nilai_ujian'); $this->load->view('index', $page_data); } /****MANAGE GRADES*****/ function grade($param1 = '', $param2 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['grade_point'] = $this->input->post('grade_point'); $data['mark_from'] = $this->input->post('mark_from'); $data['mark_upto'] = $this->input->post('mark_upto'); $data['comment'] = $this->input->post('comment'); $this->db->insert('grade', $data); redirect(base_url() . 'admin/grade/', 'refresh'); }

Page 30: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

30

if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['grade_point'] = $this->input->post('grade_point'); $data['mark_from'] = $this->input->post('mark_from'); $data['mark_upto'] = $this->input->post('mark_upto'); $data['comment'] = $this->input->post('comment'); $this->db->where('grade_id', $param2); $this->db->update('grade', $data); redirect(base_url() . 'admin/grade/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('grade', array( 'grade_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('grade_id', $param2); $this->db->delete('grade'); redirect(base_url() . 'admin/grade/', 'refresh'); } $page_data['grades'] = $this->db->get('grade')->result_array(); $page_data['page_name'] = 'grade'; $page_data['page_title'] = get_phrase('manajemen_peringkat'); $this->load->view('index', $page_data); } /**********MANAGING CLASS ROUTINE******************/ function class_routine($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['class_id'] = $this->input->post('class_id'); $data['subject_id'] = $this->input->post('subject_id'); $data['time_start'] = $this->input->post('time_start') + (12 * ($this- >input->post('starting_ampm') - 1)); $data['time_end'] = $this->input->post('time_end') + (12 * ($this- >input->post('ending_ampm') - 1)); $data['day'] = $this->input->post('day'); $this->db->insert('class_routine', $data); redirect(base_url() . 'admin/class_routine/', 'refresh'); } if ($param1 == 'do_update') { $data['class_id'] = $this->input->post('class_id');

Page 31: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

31

$data['subject_id'] = $this->input->post('subject_id'); $data['time_start'] = $this->input->post('time_start') + (12 * ($this- >input->post('starting_ampm') - 1)); $data['time_end'] = $this->input->post('time_end') + (12 * ($this- >input->post('ending_ampm') - 1)); $data['day'] = $this->input->post('day'); $this->db->where('class_routine_id', $param2); $this->db->update('class_routine', $data); redirect(base_url() . 'admin/class_routine/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('class_routine', array( 'class_routine_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('class_routine_id', $param2); $this->db->delete('class_routine'); redirect(base_url() . 'admin/class_routine/', 'refresh'); } $page_data['page_name'] = 'class_routine'; $page_data['page_title'] = get_phrase('manajemen_jadwal_pelajaran'); $this->load->view('index', $page_data); } /******MANAGE BILLING / INVOICES WITH STATUS*****/ function invoice($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['student_id'] = $this->input->post('student_id'); $data['title'] = $this->input->post('title'); $data['description'] = $this->input->post('description'); $data['amount'] = $this->input->post('amount'); $data['status'] = $this->input->post('status'); $data['creation_timestamp'] = strtotime($this->input->post('date')); $this->db->insert('invoice', $data); redirect(base_url() . 'admin/invoice', 'refresh'); } if ($param1 == 'do_update') { $data['student_id'] = $this->input->post('student_id'); $data['title'] = $this->input->post('title');

Page 32: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

32

$data['description'] = $this->input->post('description'); $data['amount'] = $this->input->post('amount'); $data['status'] = $this->input->post('status'); $data['creation_timestamp'] = strtotime($this->input->post('date')); $this->db->where('invoice_id', $param2); $this->db->update('invoice', $data); redirect(base_url() . 'admin/invoice', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('invoice', array( 'invoice_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('invoice_id', $param2); $this->db->delete('invoice'); redirect(base_url() . 'admin/invoice', 'refresh'); } $page_data['page_name'] = 'invoice'; $page_data['page_title'] = get_phrase('manajemen_invoice'); $this->db->order_by('creation_timestamp', 'desc'); $page_data['invoices'] = $this->db->get('invoice')->result_array(); $this->load->view('index', $page_data); } /**********MANAGE LIBRARY / BOOKS********************/ function book($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect('login', 'refresh'); if ($param1 == 'create') { $data['name'] = $this->input->post('name'); $data['description'] = $this->input->post('description'); $data['price'] = $this->input->post('price'); $data['author'] = $this->input->post('author'); $data['class_id'] = $this->input->post('class_id'); $data['status'] = $this->input->post('status'); $this->db->insert('book', $data); redirect(base_url() . 'admin/book', 'refresh'); } if ($param1 == 'do_update') { $data['name'] = $this->input->post('name'); $data['description'] = $this->input->post('description'); $data['price'] = $this->input->post('price');

Page 33: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

33

$data['author'] = $this->input->post('author'); $data['class_id'] = $this->input->post('class_id'); $data['status'] = $this->input->post('status'); $this->db->where('book_id', $param2); $this->db->update('book', $data); redirect(base_url() . 'admin/book', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('book', array( 'book_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('book_id', $param2); $this->db->delete('book'); redirect(base_url() . 'admin/book', 'refresh'); } $page_data['books'] = $this->db->get('book')->result_array(); $page_data['page_name'] = 'book'; $page_data['page_title'] = get_phrase('manajemen_buku'); $this->load->view('index', $page_data); } /***MANAGE NOTICEBOARD, **/ function noticeboard($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'create') { $data['notice_title'] = $this->input->post('notice_title'); $data['notice'] = $this->input->post('notice'); $data['create_timestamp'] = strtotime($this->input->post ('create_timestamp')); $this->db->insert('noticeboard', $data); redirect(base_url() . 'admin/noticeboard/', 'refresh'); } if ($param1 == 'do_update') { $data['notice_title'] = $this->input->post('notice_title'); $data['notice'] = $this->input->post('notice'); $data['create_timestamp'] = strtotime($this->input->post ('create_timestamp')); $this->db->where('notice_id', $param2); $this->db->update('noticeboard', $data); $this->session->set_flashdata('flash_message', get_phrase

Page 34: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

34

('pengumuman_updated')); redirect(base_url() . 'admin/noticeboard/', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('noticeboard', array( 'notice_id' => $param2 ))->result_array(); } if ($param1 == 'delete') { $this->db->where('notice_id', $param2); $this->db->delete('noticeboard'); redirect(base_url() . 'admin/noticeboard/', 'refresh'); } $page_data['page_name'] = 'noticeboard'; $page_data['page_title'] = get_phrase('manajemen pengumuman'); $page_data['notices'] = $this->db->get('noticeboard')->result_array(); $this->load->view('index', $page_data); } /*****SITE/SYSTEM SETTINGS*********/ function system_settings($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($param2 == 'do_update') { $this->db->where('type', $param1); $this->db->update('settings', array( 'description' => $this->input->post('description') )); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/system_settings/', 'refresh'); } if ($param1 == 'upload_logo') { move_uploaded_file($_FILES['userfile']['tmp_name'], 'uploads/ logo.png'); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/system_settings/', 'refresh'); } $page_data['page_name'] = 'system_settings'; $page_data['page_title'] = get_phrase('system_settings'); $page_data['settings'] = $this->db->get('settings')->result_array(); $this->load->view('index', $page_data);

Page 35: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

35

} /*****LANGUAGE SETTINGS*********/ function manage_language($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($param1 == 'edit_phrase') { $page_data['edit_profile'] = $param2; } if ($param1 == 'update_phrase') { $language = $param2; $total_phrase = $this->input->post('total_phrase'); for($i = 1 ; $i < $total_phrase ; $i++) { //$data[$language] = $this->input->post('phrase').$i; $this->db->where('phrase_id' , $i); $this->db->update('language' , array($language => $this->input- >post('phrase'.$i))); } redirect(base_url() . 'admin/manage_language/edit_phrase/ '.$language, 'refresh'); } if ($param1 == 'do_update') { $language = $this->input->post('language'); $data[$language] = $this->input->post('phrase'); $this->db->where('phrase_id', $param2); $this->db->update('language', $data); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/manage_language/', 'refresh'); } if ($param1 == 'add_phrase') { $data['phrase'] = $this->input->post('phrase'); $this->db->insert('language', $data); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/manage_language/', 'refresh'); } if ($param1 == 'add_language') { $language = $this->input->post('language'); $this->load->dbforge(); $fields = array( $language => array(

Page 36: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

36

'type' => 'LONGTEXT' )); $this->dbforge->add_column('language', $fields); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/manage_language/', 'refresh'); } if ($param1 == 'delete_language') { $language = $param2; $this->load->dbforge(); $this->dbforge->drop_column('language', $language); $this->session->set_flashdata('flash_message', get_phrase ('settings_updated')); redirect(base_url() . 'admin/manage_language/', 'refresh'); } $page_data['page_name'] = 'manage_language'; $page_data['page_title'] = get_phrase('manajemen bahasa'); //$page_data['language_phrases'] = $this->db->get('language')- >result_array(); $this->load->view('index', $page_data); } /*****BACKUP / RESTORE / DELETE DATA PAGE**********/ function backup_restore($operation = '', $type = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url(), 'refresh'); if ($operation == 'create') { $this->crud_model->create_backup($type); } if ($operation == 'restore') { $this->crud_model->restore_backup(); $this->session->set_flashdata('backup_message', 'Backup Restored'); redirect(base_url() . 'admin/backup_restore/', 'refresh'); } if ($operation == 'delete') { $this->crud_model->truncate($type); $this->session->set_flashdata('backup_message', 'Data removed'); redirect(base_url() . 'admin/backup_restore/', 'refresh'); } $page_data['page_info'] = 'Create backup / restore from backup'; $page_data['page_name'] = 'backup_restore'; $page_data['page_title'] = get_phrase('manajemen backup data'); $this->load->view('index', $page_data);

Page 37: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

37

} /******MANAGE OWN PROFILE AND CHANGE PASSWORD***/ function manage_profile($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('admin_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($param1 == 'update_profile_info') { $data['name'] = $this->input->post('name'); $data['email'] = $this->input->post('email'); $this->db->where('admin_id', $this->session->userdata('admin_id')); $this->db->update('admin', $data); $this->session->set_flashdata('flash_message', get_phrase ('akun_updated')); redirect(base_url() . 'admin/manage_profile/', 'refresh'); } if ($param1 == 'change_password') { $data['password'] = $this->input->post('password'); $data['new_password'] = $this->input->post('new_password'); $data['confirm_new_password'] = $this->input->post ('confirm_new_password'); $current_password = $this->db->get_where('admin', array( 'admin_id' => $this->session->userdata('admin_id') ))->row()->password; if ($current_password == $data['password'] && $data['new_password'] == $data['confirm_new_password']) { $this->db->where('admin_id', $this->session->userdata('admin_id')); $this->db->update('admin', array( 'password' => $data['new_password'] )); $this->session->set_flashdata('flash_message', get_phrase ('password_updated')); } else { $this->session->set_flashdata('flash_message', get_phrase ('password_tidak sama')); } redirect(base_url() . 'admin/manage_profile/', 'refresh'); } $page_data['page_name'] = 'manage_profile'; $page_data['page_title'] = get_phrase('manajemen_profile'); $page_data['edit_data'] = $this->db->get_where('admin', array( 'admin_id' => $this->session->userdata('admin_id') ))->result_array();

Page 38: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

38

$this->load->view('index', $page_data); } }

Berikut koding untuk file dashboard.php di folder Admin di menu views;

Gambar 2.3.2. Tampilan file dashboard.php

<div class="container-fluid padded"> <div class="row-fluid"> <div class="span30"> <div class="action-nav-normal"> <div class="row-fluid"> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/student"> <img src="<?php echo base_url();?>template/images/icons/user.png"/> <span><?php echo get_phrase('Data Siswa');?></span> <span class="label label-blue"> <?php echo $this->db->count_all_results('student');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/teacher"> <img src="<?php echo base_url();?>template/images/icons/teacher.png" /> <span><?php echo get_phrase('Data Guru');?></span> <span class="label label-blue"><?php echo $this->db->count_all_results ('teacher');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/book">

Dashboard admin

Page 39: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

39

<img src="<?php echo base_url();?>template/images/icons/book.png" /> <span><?php echo get_phrase('buku');?></span> <span class="label label-blue"><?php echo $this->db->count_all_results ('book');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/marks"> <img src="<?php echo base_url();?>template/images/icons/marks.png" /> <span><?php echo get_phrase('nilai siswa');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/class_routine"> <img src="<?php echo base_url();?>template/images/icons/routine.png"/> <span><?php echo get_phrase('jadwal pelajaran');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/invoice"> <img src="<?php echo base_url();?>template/images/icons/payment.png"/> <span><?php echo get_phrase('pembayaran');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/noticeboard"> <img src="<?php echo base_url();?>template/images/icons/ noticeboard.png"/> <span><?php echo get_phrase('pengunmuman');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/system_settings"> <img src="<?php echo base_url();?>template/images/icons/settings.png" /> <span><?php echo get_phrase('pengaturan');?></span> </a></div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>admin/backup_restore"> <img src="<?php echo base_url();?>template/images/icons/backup.png" />

Page 40: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

40

<span><?php echo get_phrase('backup data');?></span> </a></div> </div> </div> </div> </div> <!---DASHBOARD MENU BAR ENDS HERE--> <div class="row-fluid"> <div class="span6"> <div class="box"> <div class="box-header"> <div class="title"> <i class="icon-calendar"></i> <?php echo get_phrase('Agenda sekolah');?> </div> </div> <div class="box-content"> <div id="calendar2"> </div> </div> </div> </div> <!---CALENDAR ENDS--> <!---TO DO LIST STARTS--> <div class="span6"> <div class="box"> <div class="box-header"> <span class="title"> <i class="icon-reorder"></i> <?php echo get_phrase('pengunguman');?> </span> </div> <div class="box-content scrollable" style="max-height: 500px; overflow-y: auto"> <?php $notices = $this->db->get('noticeboard')->result_array(); foreach($notices as $row): ?> <div class="box-section news with-icons"> <div class="avatar blue"> <i class="icon-tag icon-2x"></i>

Page 41: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

41

</div> <div class="news-time"> <span><?php echo date('d',$row['create_timestamp']);?></span> <?php echo date('M',$row['create_timestamp']);?> </div>

<div class="news-content"> <div class="news-title"> <?php echo $row['notice_title'];?> </div> <div class="news-text"> <?php echo $row['notice'];?> <div></div> </div> <?php endforeach;?> </div> </div> </div> </div> </div> <!---TO DO LIST ENDS--> <script> $(document).ready(function() { $("#calendar2").fullCalendar({ header: { left: "prev,next", center: "title", right: "month" }, editable: 0, droppable: 0, /*drop: function (e, t) { var n, r; r = $(this).data("eventObject"), n = $.extend({}, r), n.start = e, n.allDay = t, $("#calendar").fullCalendar("renderEvent", n, !0); if ($("#drop-remove").is(":checked")) return $(this).remove() }, nulled by Vokey*/events: [ <?php $notices = $this->db->get('noticeboard')->result_array(); foreach($notices as $row): ?> { title: "<?php echo $row['notice_title'];?>",

Page 42: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

42

start: new Date(<?php echo date('Y',$row['create_timestamp']);?>, <?php echo date('m',$row['create_timestamp'])-1;?>, <?php echo date('d',$row['create_timestamp']);?>), end: new Date(<?php echo date('Y',$row['create_timestamp']);?>, <?php echo date('m',$row['create_timestamp'])-1;?>, <?php echo date('d',$row['create_timestamp']);?>) }, <?php endforeach ?> ] }) }); </script>

Berikut koding untuk file navigation.php di folder admin di menu views,

Gambar 2.3.3. Menu navigasi.php

<div class="sidebar-background"> <div class="primary-sidebar-background"> </div> </div> <div class="primary-sidebar"> <!-- Main nav --> <br /> <div style="text-align:center;"> <a href="<?php echo base_url();?>"> <img src="<?php echo base_url();?>uploads/logo.png" style="max- height: 100px; max-width:100px;"/> </a>

navigatio

n

adm

in

Page 43: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

43

</div> <br/> <ul class="nav nav-collapse collapse nav-collapse-primary"> <!------dashboard-----> <li class="<?php if($page_name == 'dashboard')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/dashboard"> <!--<i class="icon-desktop icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/home.png"/> <span><?php echo get_phrase('dashboard');?></span> </a> </li> <!------student-----> <li class="<?php if($page_name == 'student')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/student"> <!--<i class="icon-user icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ user.png" /> <span><?php echo get_phrase('data siswa');?></span> </a> </li> <!------teacher-----> <li class="<?php if($page_name == 'teacher')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/teacher" > <!--<i class="icon-user icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ teacher.png" /> <span><?php echo get_phrase('Data guru');?></span> </a> </li> <!------parent-----> <li class="<?php if($page_name == 'parent')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/parent" > <!--<i class="icon-user icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ parent.png" /> <span><?php echo get_phrase('data wali siswa');?></span> </a> </li> <!------subject----->

Page 44: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

44

<li class="<?php if($page_name == 'subject')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/subject" > <!--<i class="icon-tasks icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ subject.png" /> <span><?php echo get_phrase('data mata pelajaran');?></span> </a> </li> <!------classes-----> <li class="<?php if($page_name == 'class')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/classes" > <!--<i class="icon-sitemap icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/class.png" /> <span><?php echo get_phrase('data kelas');?></span> </a></li> <!------exam-----> <li class="<?php if($page_name == 'exam')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/exam" > <!--<i class="icon-paste icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ exam.png" /> <span><?php echo get_phrase('ujian');?></span> </a></li> <!------marks-----> <li class="<?php if($page_name == 'marks')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/marks" > <!--<i class="icon-pencil icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/marks.png" /> <span><?php echo get_phrase('data nilai ujian');?></span> </a></li> <!------grade-----> <li class="<?php if($page_name == 'grade')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/grade" > <!--<i class="icon-list-ol icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/grade.png" />

Page 45: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

45

<span><?php echo get_phrase('Grade nilai');?></span> </a></li> <!------class routine-----> <li class="<?php if($page_name == 'class_routine')echo 'dark-nav active';?>"> span class="glow"></span> <a href="<?php echo base_url();?>admin/class_routine" > <!--<i class="icon-indent-right icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ routine.png" /> <span><?php echo get_phrase('jadwal pelajaran');?></span> </a></li> <!------invoice-----> <li class="<?php if($page_name == 'invoice')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/invoice" > <!--<i class="icon-money icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ payment.png" /> <span><?php echo get_phrase('data pembayaran');?></span> </a></li> <!------book-----> <li class="<?php if($page_name == 'book')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/book" > <!--<i class="icon-book icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/book.png" /> <span><?php echo get_phrase('buku');?></span> </a></li> <!------noticeboard-----> <li class="<?php if($page_name == 'noticeboard')echo 'dark-nav active';?>"> <span class="glow"></span> a href="<?php echo base_url();?>admin/noticeboard" > <!--<i class="icon-columns icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/ noticeboard.png" /> <span><?php echo get_phrase('pengumuman');?></span> </a></li>

Page 46: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

46

<!------system settings------> <li class="dark-nav <?php if($page_name == 'system_settings' || $page_name == 'manage_language' || $page_name == 'backup_restore' )echo 'active';?>"> <span class="glow"></span> <a class="accordion-toggle " data-toggle="collapse" href="#settings_submenu"> <!--<i class="icon-wrench icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/settings.png" /> <span><?php echo get_phrase('pengaturan');?><i class="icon-caret- down"></i></span></a> <ul id="settings_submenu" class="collapse <?php if($page_name == 'system_settings' || $page_name == 'manage_language' || $page_name == 'backup_restore' )echo 'in';?>"> <li class="<?php if($page_name == 'system_settings')echo 'active';?>"> <a href="<?php echo base_url();?>admin/system_settings"> <!--<i class="icon-h-sign"></i>--> <img src="<?php echo base_url();?>template/images/icons/ system_settings.png" /> <?php echo get_phrase('pengaturan aplikasi');?> </a> <!------manage backup restore---> <li class="<?php if($page_name == 'backup_restore')echo 'active';?>"> <a href="<?php echo base_url();?>admin/backup_restore"> <!--<i class="icon-download-alt"></i>--> <img src="<?php echo base_url();?>template/images/icons/backup.png" /> <?php echo get_phrase('backup_restore');?> </a> </li> </ul></li> <!------manage own profile---> <li class="<?php if($page_name == 'manage_profile')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>admin/manage_profile" > <!--<i class="icon-lock icon-1x"></i>--> <img src="<?php echo base_url();?>template/images/icons/profile.png" /> <span><?php echo get_phrase('profile');?></span> </a></li>

Page 47: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

47

</ul> </div>

Didalam tabel navigasi admin, admin user dapat mengetahui tentang data siswa, guru, pembayaran, mata pelajaran dan kegiatan sekolah lainnya, berikut contoh fungsi dari tabel navigasi untuk mengakses data siswa. Pertama kita buat file baru di menu views dalam folder admin, dengan nama student.php, kemudian ketikkan koding berikut;

Gambar 2.3.4. Tampilan Menu Data Siswa

<?php if($class_id != ""):?> <div class="box"> <div class="box-header"> <ul class="nav nav-tabs nav-tabs-left"> <li class="active"> <a href="#list" data-toggle="tab"><i class="icon-align-justify"></i> <?php echo get_phrase('list siswa');?> </a></li> <li> <a href="#add" data-toggle="tab"><i class="icon-plus"></i> <?php echo get_phrase('tambah siswa');?> </a></li> </ul> </div> <div class="box-content"> <div class="tab-content"> <div class="tab-pane active" id="list"> <center><br /> <select name="class_id" onchange="window.location='<?php echo base_url();?>admin/student/'+this.value"> <option value=""><?php echo get_phrase('pilih');?></option>

Page 48: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

48

<?php $classes = $this->db->get('class')->result_array(); foreach($classes as $row): ?> <option value="<?php echo $row['class_id'];?>" <?php if($class_id == $row['class_id'])echo 'selected';?>> <?php echo $row['name'];?></option>

<?php endforeach; ?> </select><br /><br /> <?php if($class_id== ''):?> <div id="ask_class" class=" alert alert-info " style="width:300px;"> <i class="icon-info-sign"></i> Pilih kelas terlebih dahulu. </div> <script> $(document).ready(function() { function shake(){ $( "#ask_class" ).effect( "shake" );} setTimeout(shake, 500); }); </script> <br /> <br /> <?php endif;?> <?php if($class_id != ''):?> <div class="action-nav-normal"> <div class=" action-nav-button" style="width:300px;"> <a href="#" title="Users"> <img src="<?php echo base_url();?>template/images/icons/ user.png" /> <span>Total <?php echo count($students);?> Siswa</span> </a> </div> </div> </center> <div class="box"> <div class="box-content"> <div id="dataTables"> <table cellpadding="0" cellspacing="0" border="0" class="dTable responsive "> <thead> <tr> <th><div><?php echo get_phrase('roll');?></div></th>

Page 49: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

49

<th width="80"><div><?php echo get_phrase('photo');?></div></th> <th><div><?php echo get_phrase('Nama');?></div></th> <th class="span3"><div><?php echo get_phrase ('alamat');?></div></th> <th><div><?php echo get_phrase('email');?></div></th> <th><div><?php echo get_phrase('aksi');?></div></th> </tr> </thead> <tbody> <?php $count = 1;foreach($students as $row):?> <tr> <td class="span1"><?php echo $row['roll'];?></td> <td><div class="avatar"><img src="<?php echo $this->crud_model-> get_image_url('student',$row['student_id']);?>" class="avatar-medium" /></div></td> <td><?php echo $row['name'];?></td> <td><?php echo $row['address'];?></td> <td><?php echo $row['email'];?></td> <td align="center" class="span5"> <a data-toggle="modal" href="#modal-form" click="modal ('student_profile',<?php echo $row['student_id'];?>)" class="btn btn-default btn-small"> <i class="icon-user"></i> <?php echo get_phrase('profile');?> </a> <a data- toggle="modal" href="#modal-form" onclick="modal ('student_academic_result',<?php echo $row['student_id'];?>)" class="btn btn-default btn-small"> <i class="icon-file-alt"></i> <?php echo get_phrase('result');?> </a> <a data-toggle="modal" href="#modal-form" onclick="modal ('student_id_card',<?php echo $row['student_id'];?>)" class="btn btn-default btn-small"> <i class="icon-credit-card"></i> <?php echo get_phrase('id_card');?> </a> <a data-toggle="modal" href="#modal-form" onclick="modal ('edit_student',<?php echo $row['student_id'];?>,<?php echo $class_id;?>)" class="btn btn-gray btn-small"> <i class="icon-wrench"></i> <?php echo get_phrase('edit');?></a> <a data-toggle="modal" href="#modal-delete" onclick="modal_delete ('<?php echo base_url();?>admin/student/<?php echo $class_id;?>/delete/<?php echo $row['student_id'];?>')" class="btn btn-red btn-small"> <i class="icon-trash"></i> <?php echo get_phrase('hapus');?></a> <a href="<?php echo base_url();?>admin/student/<?php echo $class_id;?>/

Page 50: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

50

personal_profile/<?php echo $row['student_id'];?>" class="btn btn-gray"> <i class="icon-wrench"></i> <?php echo get_phrase('profil_siswa');?> </a> <a href="<?php echo base_url();?>admin/student/<?php echo $class_id;?>/ academic_result/<?php echo $row['student_id'];?>" class="btn btn-gray"> <i class="icon-wrench"></i> <?php echo get_phrase ('hasil_akademik');?> </a> <a href="<?php echo base_url();?>admin/student/<?php echo $class_id;?>/ edit/<?php echo $row['student_id'];?>" class="btn btn-gray"> <i class="icon-wrench"></i> <?php echo get_phrase('edit');?> </a> <a href="<?php echo base_url();?>admin/student/<?php echo $class_id;?>/ delete/<?php echo $row['student_id'];?>" onclick="return confirm('delete?')" class="btn btn-red"> <i class="icon-trash"></i> <?php echo get_phrase('hapus');?> </a> </td> </tr> <?php endforeach;?> </tbody> </table> </div> </div> </div> <?php endif;?> </div> <div class="tab-pane box" id="add" style="padding: 5px"> <div class="box-content"> <?php echo form_open('admin/student/create/' , array('class' => 'form- horizontal validatable', 'enctype' => 'multipart/form-data'));?> <div class="padded"> <div class="control-group"> <label class="control-label"><?php echo get_phrase ('nama');?></label> <div class="controls"> <input type="text" class="validate[required]" name="name"/>

Page 51: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

51

</div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('tanggal lahir');?> </label> <div class="controls"> <input type="text" class="datepicker fill-up" name="birthday"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase ('jenis kelamin');?> </label> <div class="controls"> <select name="sex" class="uniform" style="width:100%;"> <option value="male"><?php echo get_phrase('laki-laki');?></option> <option value="female"><?php echo get_phrase('perempuan');?> </option></select> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase ('alamat');?></label> <div class="controls"> <input type="text" class="" name="address"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('no hp');?> </label> <div class="controls"> <input type="text" class="" name="phone"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase ('email');?></label> <div class="controls">

Page 52: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

52

<input type="text" class="" name="email"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase ('password');?></label> <div class="controls"> <input type="text" class="" name="password"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('nama ayah');?> </label> <div class="controls"> <input type="text" class="" name="father_name"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('nama ibu');?> </label> <div class="controls"> <input type="text" class="" name="mother_name"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('kelas');?> </label> <div class="controls"> <select name="class_id" class="uniform" style="width:100%;"> <?php $classes = $this->db->get('class')->result_array(); foreach($classes as $row): ?> <option value="<?php echo $row['class_id'];?>"> <?php echo $row['name'];?> </option> <?php endforeach; ?> </select> </div>

Page 53: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

53

</div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('roll');?></label> <div class="controls"> <input type="text" class="" name="roll"/> </div> </div> <div class="control-group"> <label class="control-label"><?php echo get_phrase('photo');?> </label> <div class="controls" style="width:210px;"> <input type="file" class="" name="userfile" id="imgInp" /> </div> </div> <div class="control-group"> <label class="control-label"></label> <div class="controls" style="width:210px;"> <img id="blah" src="<?php echo base_url();?>uploads/user.jpg" alt="your image" height="100" /> </div> </div> </div> <div class="form-actions"> <button type="submit" class="btn btn-gray"><?php echo get_phrase ('tambah siswa');?></button> </div> <?php echo form_close();?> </div> </div> </div> </div> </div> <?php endif;?> <?php if($class_id == ""):?> <center> <div class="span5" style="float:none !important;"> <div class="box">

Page 54: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

54

<div class="box-header"> <span class="title"> <i class="icon-info-sign"></i> Pilih kelas terlebih dahulu.</span> </div> <div class="box-content padded"><br /> <select name="class_id" onchange="window.location='<?php echo base_url();?>admin/student/'+this.value"> <option value=""><?php echo get_phrase('pilih');?></option> <?php $classes = $this->db->get('class')->result_array(); foreach($classes as $row): ?> <option value="<?php echo $row['class_id'];?>" <?php if($class_id == $row['class_id'])echo 'selected';?>> <?php echo $row['name'];?></option> <?php endforeach; ?> </select> <hr/> <script> $(document).ready(function() { function ask() { Growl.info({title:"Pilih Kelas terlebih dahulu ",text:" "}); } setTimeout(ask, 500); }); </script> </div> </div> </div> </center> <?php endif;?> <script> function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('#blah').attr('src', e.target.result); } reader.readAsDataURL(input.files[0]); } } $("#imgInp").change(function(){ readURL(this); }); </script>

Page 55: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

55

2.4. Rancangan Halaman Dashboard Siswa Dashboard siswa ini merupakan ruang akses buat siswa, dimana siswa dapat melihat hasil nilai ujian, jadwal pelajaran dan pembayaran biaya sekolah.

Gambar 2.4.1. Tampilan Halaman Dashboard Siswa

Dalam pembuatan dashboard siswa, kita perlu menambahkan file baru di menu controller dan menu views. Di menu controller, kita buat file baru student.php, sedangkan di menu views, kita buat folder baru denagan nama student yang akan kita gunakan untuk menampung segala koding tampilan dashboard student.

Gambar 2.4.2. Tampilan file student.php di menu controller koding untuk file student.php di menu controller adalah sebagai berikut;

<?php

Page 56: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

56

if (!defined('BASEPATH')) exit ('No direct script access allowed'); class Student extends CI_Controller { function __construct() { parent::__construct(); $this->load->database(); } public function index() { if ($this->session->userdata('student_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($this->session->userdata('student_login') == 1) redirect(base_url() . 'student/dashboard', 'refresh'); } /***student DASHBOARD***/ function dashboard() { if ($this->session->userdata('student_login') != 1) redirect(base_url(), 'refresh'); $page_data['page_name'] = 'dashboard'; $page_data['page_title'] = get_phrase('ruang siswa'); $this->load->view('index', $page_data); } /****MANAGE TEACHERS*****/ function guru($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'personal_profile') { $page_data['personal_profile'] = true; $page_data['current_teacher_id'] = $param2; } $page_data['teachers'] = $this->db->get('teacher')->result_array(); $page_data['page_name'] = 'guru'; $page_data['page_title'] = get_phrase('Manajemen guru'); $this->load->view('index', $page_data); } /****MANAGE SUBJECTS*****/ function mapel($param1 = '', $param2 = '') { if ($this->session->userdata('student_login') != 1)

Page 57: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

57

redirect(base_url(), 'refresh'); $student_profile = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->row(); $student_class_id = $student_profile->class_id; $page_data['subjects'] = $this->db->get_where('subject', array( 'class_id' => $student_class_id ))->result_array(); $page_data['page_name'] = 'mapel'; $page_data['page_title'] = get_phrase('manajemen mapel'); $this->load->view('index', $page_data); } /****MANAGE EXAM MARKS*****/ function nilai($exam_id = '', $class_id = '', $subject_id = '') { if ($this->session->userdata('student_login') != 1) redirect(base_url(), 'refresh'); $student_profile = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->row(); $page_data['class_id'] = $student_profile->class_id; if ($this->input->post('operation') == 'selection') { $page_data['exam_id'] = $this->input->post('exam_id'); //$page_data['class_id'] = $this->input->post('class_id'); $page_data['subject_id'] = $this->input->post('subject_id'); if ($page_data['exam_id'] > 0 && $page_data['class_id'] > 0 && $page_data['subject_id'] > 0) { redirect(base_url() . 'student/nilai/' . $page_data['exam_id'] . '/' . $page_data['class_id'] . '/' . $page_data['subject_id'], 'refresh'); } else { $this->session->set_flashdata('mark_message', 'Choose exam, class and subject'); redirect(base_url() . 'student/nilai/', 'refresh'); } } $page_data['exam_id'] = $exam_id; //$page_data['class_id'] = $class_id; $page_data['subject_id'] = $subject_id; $page_data['page_info'] = 'Exam marks'; $page_data['page_name'] = 'nilai'; $page_data['page_title'] = get_phrase('manajemen nilai');

Page 58: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

58

$this->load->view('index', $page_data); } /**********MANAGING CLASS ROUTINE******************/ function jadwal($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect(base_url(), 'refresh'); $student_profile = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->row(); $page_data['class_id'] = $student_profile->class_id; $page_data['page_name'] = 'jadwal'; $page_data['page_title'] = get_phrase('manajemen jadwal'); $this->load->view('index', $page_data); } /******MANAGE BILLING / INVOICES WITH STATUS*****/ function invoice($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect(base_url(), 'refresh'); if ($param1 == 'do_update') { $data['student_id'] = $this->input->post('student_id'); $data['amount'] = $this->input->post('amount'); $data['status'] = $this->input->post('status'); $data['creation_timestamp'] = strtotime($this->input->post('date')); $data['transaksi_id'] = $this->input->post('transaksi_id'); $data['payment_method'] = $this->input->post('payment_method'); $data['payment_timestamp'] = strtotime($this->input->post('date')); $this->db->where('invoice_id', $param2); $this->db->update('invoice', $data); redirect(base_url() . 'student/invoice', 'refresh'); } else if ($param1 == 'edit') { $page_data['edit_data'] = $this->db->get_where('invoice', array( 'invoice_id' => $param2 ))->result_array(); } $student_profile = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->row(); $student_id = $student_profile->student_id; $page_data['invoices'] = $this->db->get_where('invoice', array( 'student_id' => $student_id ))->result_array();

Page 59: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

59

$page_data['page_name'] = 'invoice'; $page_data['page_title'] = get_phrase('manajemen_invoice'); $this->load->view('index', $page_data); } /**********MANAGE LIBRARY / BOOKS********************/ function buku($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect('login', 'refresh'); $page_data['books'] = $this->db->get('book')->result_array(); $page_data['page_name'] = 'buku'; $page_data['page_title'] = get_phrase('manajemen buku'); $this->load->view('index', $page_data); } /**********WATCH NOTICEBOARD AND EVENT ********************/ function pengumuman($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect('login', 'refresh'); $page_data['notices'] = $this->db->get('noticeboard')->result_array(); $page_data['page_name'] = 'pengumuman'; $page_data['page_title'] = get_phrase('pengumuman'); $this->load->view('index', $page_data); } /******MANAGE OWN PROFILE AND CHANGE PASSWORD***/ function profile($param1 = '', $param2 = '', $param3 = '') { if ($this->session->userdata('student_login') != 1) redirect(base_url() . 'login', 'refresh'); if ($param1 == 'update_profile_info') { $data['name'] = $this->input->post('name'); $data['birthday'] = $this->input->post('birthday'); $data['sex'] = $this->input->post('sex'); $data['religion'] = $this->input->post('religion'); $data['blood_group'] = $this->input->post('blood_group'); $data['address'] = $this->input->post('address'); $data['phone'] = $this->input->post('phone'); $data['email'] = $this->input->post('email'); $this->db->where('student_id', $this->session->userdata ('student_id')); $this->db->update('student', $data); $this->session->set_flashdata('flash_message', get_phrase('akun update'));

Page 60: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

60

redirect(base_url() . 'student/manage_profile/', 'refresh'); } if ($param1 == 'change_password') { $data['password'] = $this->input->post('password'); $data['new_password'] = $this->input->post('new_password'); $data['confirm_new_password'] = $this->input->post ('confirm_new_password'); $current_password = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->row()->password; if ($current_password == $data['password'] && $data['new_password'] == $data['confirm_new_password']) { $this->db->where('student_id', $this->session->userdata ('student_id')); $this->db->update('student', array( 'password' => $data['new_password'] )); $this->session->set_flashdata('flash_message', get_phrase ('password_updated')); } else { $this->session->set_flashdata('flash_message', get_phrase ('password_tidak sama')); } redirect(base_url() . 'student/manage_profile/', 'refresh'); } $page_data['page_name'] = 'profile'; $page_data['page_title'] = get_phrase('profile'); $page_data['edit_data'] = $this->db->get_where('student', array( 'student_id' => $this->session->userdata('student_id') ))->result_array(); $this->load->view('index', $page_data); } }

Untuk menampilkan hasil dari menu controller tersebut, kita memerlukan file baru yang berisi koding tampilan, folder student di menu views yang sudah dibuat, kita isi file baru dengan nama dashboard.php, navigation.php dan header.php Untuk file dashboard.php kita isi koding berikut;

<div class="container-fluid padded"> <div class="row-fluid">

Page 61: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

61

<div class="span30"> <div class="action-nav-normal"> <div class="row-fluid"> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/nilai"> <img src="<?php echo base_url();?>template/images/icons/marks.png"/> <span><?php echo get_phrase('Nilai');?></span> </a> </div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/mapel"> <img src="<?php echo base_url();?>template/images/icons/subject.png" /> <span><?php echo get_phrase('mata pelajaran');?></span> </a> </div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/jadwal"> <img src="<?php echo base_url();?>template/images/icons/routine.png" /> <span><?php echo get_phrase('jadwal pelajaran');?></span> </a> </div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/invoice"> <img src="<?php echo base_url();?>template/images/icons/payment.png" /> <span><?php echo get_phrase('pembayaran');?></span> </a> </div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/buku"> <img src="<?php echo base_url();?>template/images/icons/book.png" /> <span><?php echo get_phrase('buku');?></span> </a> </div> <div class="span2 action-nav-button"> <a href="<?php echo base_url();?>student/pengumuman">

Page 62: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

62

<img src="<?php echo base_url();?>template/images/icons/ noticeboard.png" /> <span><?php echo get_phrase('pengumuman');?></span> </a> </div> </div> </div> </div> </div> <div class="row-fluid"> <div class="span6"> <div class="box"> <div class="box-header"> <div class="title"> <i class="icon-calendar"></i> <?php echo get_phrase('agenda sekolah');?> </div> </div> <div class="box-content"> <div id="calendar2"> </div> </div> </div> </div> <div class="span6"> <div class="box"> <div class="box-header"> <span class="title"> <i class="icon-reorder"></i> <?php echo get_phrase('pengumuman');?> </span> </div> <div class="box-content scrollable" style="max-height: 500px; overflow-y: auto"> <?php $notices = $this->db->get('noticeboard')->result_array(); foreach($notices as $row): ?> <div class="box-section news with-icons">

Page 63: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

63

<div class="avatar blue"> <i class="icon-tag icon-2x"></i> </div> <div class="news-time"> <span><?php echo date('d',$row['create_timestamp']);?></span> <?php echo date('M',$row['create_timestamp']);?> </div> <div class="news-content"> <div class="news-title"> <?php echo $row['notice_title'];?> </div> <div class="news-text"> <?php echo $row['notice'];?> </div> </div> </div> <?php endforeach;?> </div> </div> </div> </div> </div> <script> $(document).ready(function() { $("#calendar2").fullCalendar({ header: { left: "prev,next", center: "title", right: "month,agendaWeek,agendaDay" }, editable: 0, droppable: 0, /*drop: function (e, t) { var n, r; r = $(this).data("eventObject"), n = $.extend({}, r), n.start = e, n.allDay = t, $("#calendar").fullCalendar("renderEvent", n, !0); if ($("#drop-remove").is(":checked")) return $(this).remove() },*/ events: [ <?php $notices = $this->db->get('noticeboard')->result_array(); foreach($notices as $row):

Page 64: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

64

?> { title: "<?php echo $row['notice_title'];?>", start: new Date(<?php echo date('Y',$row['create_timestamp']);?>, <?php echo date('m',$row['create_timestamp'])-1;?>, <?php echo date('d',$row['create_timestamp']);?>), end: new Date(<?php echo date('Y',$row['create_timestamp']);?>, <?php echo date('m',$row['create_timestamp'])-1;?>, <?php echo date('d',$row['create_timestamp']);?>) }, <?php endforeach ?> ] }) }); </script>

Berikut koding untuk file navigasi.php,

Gambar 2.4.3. Hasil file navigasi.php dan student.php

<div class="sidebar-background"> <div class="primary-sidebar-background"> </div> </div> <div class="primary-sidebar"> <!-- Main nav --> <br />

Dashboard siswa

navigasi

Page 65: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

65

<div style="text-align:center;"> <a href="<?php echo base_url();?>"> <img src="<?php echo base_url();?>uploads/logo.png" style="max- height:100px; max-width:100px;"/> </a> </div><br /> <ul class="nav nav-collapse collapse nav-collapse-primary"> <!------dashboard-----> <li class="<?php if($page_name == 'dashboard')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/dashboard"> <i class="icon-desktop icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ home.png" /> <span><?php echo get_phrase('dashboard');?></span> </a> </li> <!------teacher-----> <li class="<?php if($page_name == 'teacher')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/guru"> <i class="icon-user icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ teacher.png" /> <span><?php echo get_phrase('Data Guru');?></span> </a> </li> <!------subject-----> <li class="<?php if($page_name == 'subject')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/mapel"> <i class="icon-tasks icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ subject.png" /> <span><?php echo get_phrase('data mata pelajaran');?></span> </a> </li> <!------marks-----> <li class="<?php if($page_name == 'marks')echo 'dark-nav active';?>"> <span class="glow"></span>

Page 66: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

66

<a href="<?php echo base_url();?>student/nilai"> <i class="icon-pencil icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ marks.png" /> <span><?php echo get_phrase('data nilai ujian');?></span> </a> </li> <!------class routine-----> <li class="<?php if($page_name == 'class_routine')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/jadwal"> <i class="icon-indent-right icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ routine.png" /> <span><?php echo get_phrase('jadwal pelajaran');?></span> </a> </li> <!------invoice-----> <li class="<?php if($page_name == 'invoice')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/invoice"> <i class="icon-money icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ payment.png" /> <span><?php echo get_phrase('pembayaran');?></span> </a> </li> <!------book-----> <li class="<?php if($page_name == 'book')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/buku"> <i class="icon-book icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ book.png" /> <span><?php echo get_phrase('buku');?></span> </a> </li>

Page 67: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

67

<!------noticeboard-----> <li class="<?php if($page_name == 'noticeboard')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/pengumuman"> <i class="icon-columns icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ noticeboard.png" /> <span><?php echo get_phrase('pengumuman');?></span> </a> </li> <!------manage own profile---> <li class="<?php if($page_name == 'manage_profile')echo 'dark-nav active';?>"> <span class="glow"></span> <a href="<?php echo base_url();?>student/profile"> <i class="icon-lock icon-1x"></i> <img src="<?php echo base_url();?>template/images/icons/ profile.png" /> <span><?php echo get_phrase('profile');?></span> </a> </li> </ul> </div>

Untuk file header.php, kodingnya sebagai berikut;

<div class="navbar navbar-top navbar-inverse"> <div class="navbar-inner"> <div class="container-fluid"> <a class="brand" href="<?php echo base_url();?>"><?php echo $system_name;?> </a> <ul class="nav pull-right"> <li class="toggle-primary-sidebar hidden-desktop" data-toggle= "collapse" data-target=".nav-collapse-primary"><button type= "button" class="btn btn-navbar"><i class="icon-th-list"> </i></button></li>

Page 68: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

68

<li class="hidden-desktop" data-toggle="collapse" data-target=".nav- collapse-top"><button type="button" class="btn btn-navbar"><i class="icon-align-justify"></i></button></li> </ul> <div class="nav-collapse nav-collapse-top collapse"> <ul class="nav full pull-right"> <li class="dropdown user-avatar"> <a href="#" class="dropdown-toggle" data-toggle="dropdown"> <span> <span><?php echo get_phrase('account');?><i class="icon-caret- down"></i></span> </span> </a> <ul class="dropdown-menu"> <li><a href="<?php echo base_url();?>index.php?student/ manage_profile"><i class="icon-user"></i><span><?php echo get_phrase('profile');?></span></a></li> <li><a href="<?php echo base_url();?>index.php?student/ system_settings"><i class="icon-cog"></i><span><?php echo get_phrase('settings');?></span></a></li> <li><a href="<?php echo base_url();?>index.php?login/logout"><i class="icon-off"></i><span><?php echo get_phrase ('logout');?></span></a></li> </ul> </li> </ul> <ul class="nav pull-right"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">Select Language <b class="caret"></b></a> <ul class="dropdown-menu"> <?php $fields = $this->db->list_fields('language'); foreach ($fields as $field) { if($field == 'phrase_id' || $field == 'phrase')continue; ?> <li> <a href="<?php echo base_url();?>index.php?multilanguage/ select_language/<?php echo $field;?>"> <?php echo $field;?> <?php //selecting current language if($this->session->userdata('current_language') == $field):?>

Page 69: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

69

<i class="icon-ok"></i> <?php endif;?> </a> </li> <?php }?> </ul> </li> </ul> </div></div></div></div>

Didalam bagian navigasi dashboard siswa, terdapat banyak menu, salah satunya adalah menu data mata pelajaran. Didalam menu data mata pelajaran, siswa dapat mengetahui daftar mata pelajaran, kelas, beserta guru yang mengajar. Untuk membuat menu data pelajaran, kita hanya perlu menambahkan satu file baru di folder student, buat file baru dengan nama mapel.php, kemudian isikan koding program berikut;

<div class="box"> <div class="box-header"> <ul class="nav nav-tabs nav-tabs-left"> <li class="active"> <a href="#list" data-toggle="tab"><i class="icon-align-justify"></i> <?php echo get_phrase('list jadwal pelajaran');?> </a></li> </ul> </div> <div class="box-content padded"> <div class="tab-content"> <!----TABLE LISTING STARTS---> <div class="tab-pane active" id="list"> <div class="accordion" id="accordion2"> <div class="accordion-group"> <div class="accordion-heading"> <a class="accordion-toggle" data-toggle="collapse" data- parent="#accordion2" href="#collapse<?php echo $row['class_id'];?>"> <i class="icon-rss icon-1x"></i> Kelas <?php echo $row['name'];?> </a> </div> <div id="collapse" class="accordion-body collapse in">

Page 70: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

70

<div class="accordion-inner"> <table cellpadding="0" cellspacing="0" border="0" class="table table- normal"> <tbody> <?php for($d=1;$d<=6;$d++): if($d==1)$day='senin'; else if($d==2)$day='selasa'; else if($d==3)$day='rabu'; else if($d==4)$day='kamis'; else if($d==5)$day='jumat'; else if($d==6)$day='libur'; ?> <tr class="gradeA"> <td width="100"><?php echo strtoupper($day);?></td> <td> <?php $this->db->order_by("time_start", "asc"); $this->db->where('day' , $day); $this->db->where('class_id' , $class_id); $routines = $this->db->get('class_routine')->result_array(); foreach($routines as $row2): ?> <div class="btn-group"> <button class="btn btn-gray btn-normal" > <?php echo $this->crud_model->get_subject_name_by_id ($row2['subject_id']);?> <?php echo '('.$row2['time_start'].'-'.$row2['time_end'].')';?> </button> </div> <?php endforeach;?> </td> </tr> <?php endfor;?> </tbody> </table> </div> </div> </div> </div> </div>

Page 71: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

71

<!----TABLE LISTING ENDS---> </div> </div> </div>

Dari semua koding diatas, terdapat dua koding lagi, yang mana berfungsi untuk mengatur tampilan dan perhitungan dalam web. Dalam desain web, kita pasti mengetahui CSS ( Cascading style sheets ). Dimana file yang memiliki tipe css, biasanya berguna untuk mengatur atau membagi layar tampilan, untuk dipakai buat navigasi, footer, header, dan konten web. Dalam pembuatan file tipe css, kita buat file baru dengan nama ekattor.css, kemudian isikan koding berikut;

*{ margin:0px; padding:0px; } body{ color:#444444; font-size:13px; background: #f2f2f2; font-family:"Century Gothic", Helvetica, sans-serif; } #content{ margin:15px auto; text-align:center; width:540px; position:relative; height:100%; } #wrapper{ -moz-box-shadow:0px 0px 3px #aaa; -webkit-box-shadow:0px 0px 3px #aaa; box-shadow:0px 0px 3px #aaa; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; border:2px solid #fff; background-color:#f9f9f9; width:540px; overflow:hidden;

Page 72: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

72

} #steps{ width:540px; /*height:320px;*/ overflow:hidden; } .result_error{ color:#C03; border:1px solid #F291A4; padding:10px; margin:10px 0px; background-color:#FBBDC7; -moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; } .step{ float:left; width:540px; /*height:320px;*/ } #navigation{ height:45px; background-color:#e9e9e9; border-top:1px solid #fff; -moz-border-radius:0px 0px 10px 10px; -webkit-border-bottom-left-radius:10px; -webkit-border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-bottom-right-radius:10px; } #navigation ul{ list-style:none; float:left; margin-left:22px; } #navigation ul li{ float:left; border-right:1px solid #ccc; border-left:1px solid #ccc; position:relative; margin:0px 2px; }

Page 73: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

73

#navigation ul li a{ display:block; height:45px; background-color:#444; color:#777; outline:none; font-weight:bold; text-decoration:none; line-height:45px; padding:0px 14px; border-right:1px solid #fff; border-left:1px solid #fff; background:#f0f0f0; background: -webkit-gradient( linear, left bottom, left top, color-stop(0.09, rgb(240,240,240)), color-stop(0.55, rgb(227,227,227)), color-stop(0.78, rgb(240,240,240)) ); background: -moz-linear-gradient( center bottom, rgb(240,240,240) 9%, rgb(227,227,227) 55%, rgb(240,240,240) 78% ) } #navigation ul li a:hover, #navigation ul li.selected a{ background:#d8d8d8; color:#666; text-shadow:1px 1px 1px #fff; } span.checked{ background:transparent url(images/checked.png) no-repeat top left; position:absolute; top:0px; left:1px; width:20px; height:20px;

Page 74: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

74

display:none; } span.error{ background:transparent url(images/error.png) no-repeat top left; position:absolute; top:0px; left:1px; width:20px; height:20px; display:none; } #steps form fieldset{ border:none; padding-bottom:20px; } #steps form legend{ text-align:left; background-color:#f0f0f0; color:#666; font-size:24px; text-shadow:1px 1px 1px #fff; float:left; width:590px; padding:5px 0px 5px 10px; margin:10px 0px; border-bottom:1px solid #fff; border-top:1px solid #d9d9d9; } #steps form p{ float:left; clear:both; margin:5px 0px; background-color:#f4f4f4; border:1px solid #fff; width:400px; padding:10px; margin-left:60px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-box-shadow:0px 0px 3px #aaa; -webkit-box-shadow:0px 0px 3px #aaa; box-shadow:0px 0px 3px #aaa;

Page 75: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

75

} #steps form p label{ width:120px; float:left; text-align:right; margin-right:15px; line-height:26px; color:#666; text-shadow:1px 1px 1px #fff; font-weight:bold; } #steps form input:not([type=radio]), #steps form textarea, #steps form select{ background: #ffffff; border: 1px solid #ddd; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; outline: none; padding: 5px; width: 200px; float:left; } #steps form input:focus{ -moz-box-shadow:0px 0px 3px #aaa; -webkit-box-shadow:0px 0px 3px #aaa; box-shadow:0px 0px 3px #aaa; background-color:#FFFEEF; } #steps form textarea:focus{ -moz-box-shadow:0px 0px 3px #aaa; -webkit-box-shadow:0px 0px 3px #aaa; box-shadow:0px 0px 3px #aaa; background-color:#FFFEEF; } #steps form p.submit{ background:none; border:none; -moz-box-shadow:none; -webkit-box-shadow:none; box-shadow:none; }

Page 76: PERANCANGAN APLIKASI - repository.bsi.ac.id · ika sudah selesai, kemudian klik tombol save ó, hasilnya sebagai berikut : Gambar 2.1.6. Hasil tabel admin C. Membuat Tabel Student

76

#steps form button { border:none; outline:none; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; color: #ffffff; display: block; cursor:pointer; margin: 0px auto; clear:both; padding: 7px 25px; text-shadow: 0 1px 1px #777; font-weight:bold; font-family:"Century Gothic", Helvetica, sans-serif; font-size:22px; -moz-box-shadow:0px 0px 3px #aaa; -webkit-box-shadow:0px 0px 3px #aaa; box-shadow:0px 0px 3px #aaa; background:#4797ED; } #steps form button:hover { background:#d8d8d8; color:#666; text-shadow:1px 1px 1px #fff; }