Manajemen Pegawai Berbasis Web

BAB I
PENDAHULUAN

1.1. Latar Belakang Masalah
Seiring dengan perkembangan ilmu pengetahuan terutama dibidang Teknologi Informasi mengakibatkan perubahan yang sangat besar dalam hal penerapan sistem komputerisasi dalam berbagai bidang. Perubahan teknologi yang sangat pesat terjadi ini lebih cenderung pada kebutuhan manusia yang menginginkan kemudahan, kecepatan dan ketepatan dalam memperoleh informasi-informasi yang dibutuhkan .
Kemajuan teknologi informasi yang begitu pesat ini menuntut berbagai instansi maupun perusahaan untuk bisa mengikuti perkembangannya. Diantara upaya mengikuti perkembangan ini yaitu dengan memanfaatkan teknologi jaringan komputer khususnya internet. Dengan penggunaaan internet ini jalannya informasi menjadi lebih mudah dan cepat sehingga suatu intansi maupun perusahaan tersebut siap bersaing dan dapat meningkatkan mutu di berbagai bidang.
Instansi perusahaan khususnya perusahaan X. Karena dengan ini dapat memudahkan suatu perusahaan dalam memanajemen data pegewai yang terdapat di perusahaan tersebut. Dengan ini penulis mengangkat judul makalah ini dengan judul  “Manajemen Pegawai Berbasis Web”.

1.2. Perumusan Masalah
Berdasarkan latar belakang masalah di atas, maka penulis merumuskan masalah yaitu : Bagaimana merencanakan sebuah sistem manajemen pegawai berbasis web di suatu perusahaan yang masih manual khususnya karyawan baru ?

1.3. Maksud dan Tujuan
1.3.1. Maksud
Maksud dari penulisan laporan kerja praktek ini yaitu untuk merancang suatu sistem dengan memproses data karyawan baru. Dimana sistem tersebut digunakan untuk menyimpan data atau mem-back up data untuk jika suatu saat nanti diperlukan, sehingga dapat di search dengan mudah dan cepat.

1.3.2. Tujuan
Tujuan pembuatan laporan kerja praktek ini adalah untuk merancang sistem manajemen pegawai berbasis web yang dapat mempermudah proses input data dan pencarian data saat diperlukan.


1.4. Batasan Masalah
Batasan masalah yang digunakan dalam sebuah pembahasan bertujuan agar dalam pembahasannya lebih terarah dan sesuai dengan tujuan yang akan dicapai. Adapun batasan masalah dalam laporan kerja praktek ini adalah :
1. Pembuatan sistem manajemen pegawai hanya sebatas pengaksesan data karyawan baru saat seseorang benar-benar diterima di suatu perusahaan.
2. Implementasi dari   sistem   hanya sampai implementasi dari template antarmuka untuk Aplikasi Manajemen Pegawai.
3. Perancangan sistem ini tidak membahas pendaftaran secara online atau yang lainnya, hanya input data yang sudah ada diperusahaan untuk karyawan baru yang baru diterima.


BAB II
PEMBAHASAN

1.1. Php Myadmin
PHP adalah bahasa pemrograman script server-side yang didesain untuk pengembangan web. Selain itu, PHP juga bisa digunakan sebagai bahasa pemrograman umum. PHP disebut bahasa pemrograman server side karena PHP diproses pada komputer server. Hal ini berbeda dibandingkan dengan bahasa pemrograman client-side seperti JavaScript yang diproses pada web browser (client).
Saat ini PHP adalah singkatan dari PHP: Hypertext Preprocessor, sebuah kepanjangan rekursif, yakni permainan kata dimana kepanjangannya terdiri dari singkatan itu sendiri: PHP: Hypertext Preprocessor. PHP dapat digunakan dengan gratis (free) dan bersifat Open Source. PHP dirilis dalam lisensi PHP License, sedikit berbeda dengan lisensi GNU General Public License (GPL) yang biasa digunakan untuk proyek Open Source.

1.2.Fungsi PHP Dalam Pemrograman Web
Untuk membuat halaman web, sebenarnya PHP bukanlah bahasa pemrograman yang wajib digunakan. Kita bisa saja membuat website hanya menggunakan HTML saja. Web yang dihasilkan dengan HTML (dan CSS) ini dikenal dengan website statis, dimana konten dan halaman web bersifat tetap.
Sebagai perbandingan, website dinamis yang bisa dibuat menggunakan PHP adalah situs web yang bisa menyesuaikan tampilan konten tergantung situasi. Website dinamis juga bisa menyimpan data ke dalam database, membuat halaman yang berubah-ubah sesuai input dari user, memproses form, dll.

1.3. Tampilan Sistem Perancangan
Halaman Index

Source Code :
<?php
include("connection.php");
error_reporting(1);
?>
<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Master Data</title>

<!-- Bootstrap -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css">


<style>
.content {
margin-top: 80px;
}
</style>

</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand visible-xs-block visible-sm-block" href="index.php">Employee Data</a>
<a class="navbar-brand hidden-xs hidden-sm" href="index.php">Employee Data</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="active"><a href="index.php">Master Data</a></li>
<li><a href="add.php">Add Data</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="content">
<h2>Employee Data</h2>
<hr />

<?php
//koding delete ngahapus beb
if(isset($_GET['surat_id']) == 'delete'){
$del = $_GET['surat_id'];
$sql = mysqli_query($con, "SELECT * FROM employee WHERE surat_id='$del'");
if(mysqli_num_rows($sql) == 0){
echo '<div class="alert alert-info alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> Data not found.</div>';
}else{
$delete = mysqli_query($con, "DELETE FROM employee WHERE surat_id='$del'");
if($delete){
echo '<div class="alert alert-primary alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button>Data successfully deleted.</div>';
}else{
echo '<div class="alert alert-danger alert-dismissable"><button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> Data failed deleted.</div>';
}
}
}
?>
<!-- tampilan  -->

<form class="form-inline" method="get">
<div class="form-group">
<select name="filter" class="form-control" onChange="form.submit()">
<option value="0">Filter Employee Data</option>
<?php $filter = (isset($_GET['filter']) ? strtolower($_GET['filter']) : NULL);  ?>
<option value="Contract" <?php if($filter == 'Contract'){ echo 'selected'; } ?>>Contract</option>
<option value="Office" <?php if($filter == 'Office'){ echo 'selected'; } ?>>Office</option>
                        <option value="Outsourcing" <?php if($filter == 'Outsourcing'){ echo 'selected'; } ?>>Outsourcing</option>
</select>
</div>
</form>
<!-- batas -->
<br />
<!-- Tampilan Tabel -->
<div class="table-responsive">
<table class="table table-striped table-hover table-bordered">
<tr>
                    <th>No.</th>
<th>ID</th>
<th>Name</th>
                    <th>Address</th>
                    <th>Dob</th>
<th>Phone</th>
<th>Department</th>
<th>Status</th>
                    <th>Tools</th>
</tr>
<?php
//tampilken data ti database ka tabel beb
if($filter){
$sql = mysqli_query($con, "SELECT * FROM employee WHERE surat_status='$filter' ORDER BY surat_id ASC");//pencarian berdasarkan filter
}else{
$sql = mysqli_query($con, "SELECT * FROM employee ORDER BY surat_id ASC");
}
if(mysqli_num_rows($sql) == 0){
echo '<tr><td colspan="8">Data not found.</td></tr>';
}else{
//menampilkan data dari database ke table
$no = 1;
while($row = mysqli_fetch_assoc($sql)){
echo '
<tr>
<td>'.$no.'</td>
<td>'.$row['surat_id'].'</td>
<td><a href="profile.php?surat_id='.$row['surat_id'].'"><span class="glyphicon glyphicon-user" aria-hidden="true"></span> '.$row['surat_name'].'</a></td>
                            <td>'.$row['surat_address'].'</td>
                            <td>'.$row['surat_dob'].'</td>
<td>'.$row['surat_phone'].'</td>
                            <td>'.$row['surat_dept'].'</td>
<td>';
if($row['emp_status'] == 'Contract'){
echo '<span class="label label-success">Contract</span>';
}
                            else if ($row['surat_status'] == 'Office' ){
echo '<span class="label label-info">Office</span>';
}
                            else if ($row['surat_status'] == 'Outsourcing' ){
echo '<span class="label label-warning">Outsourcing</span>';
}
//Operasi
echo '
</td>
<td>


<a href="edit.php?surat_id='.$row['surat_id'].'" title="Edit Data" class="btn btn-primary btn-sm"><span class="glyphicon glyphicon-edit" aria-hidden="true"></span></a>

<a href="password.php?surat_id='.$row['surat_id'].'" title="Change Password" data-placement="bottom" data-toggle="tooltip" class="btn btn-warning btn-sm"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span></a>

<a href="index.php?surat_id='.$row['surat_id'].'" title="Delete Record" onclick="return confirm(\'You are sure will erase data. '.$row['surat_name'].'?\')" class="btn btn-danger btn-sm"><span class="glyphicon glyphicon-trash" aria-hidden="true"></span></a>
</td>
</tr>
';
$no++;
}
}
//batas data ke tabel
?>
</table>
</div>
</div>
</div><center>
<a href="laporan.php">Laporan</a>
<a href="laporan_pdf.php">Laporan PDF</a>
<p>&copy;  2017</p
></center>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>

Halaman Tambah Data



Source Code :
<?php
include('connection.php');
extract($_POST);

if(isset($reg))
{

//check user exists or not
$que=mysqli_query($con,"select * from employee where surat_email='$eid'");
if(mysqli_num_rows($que))
{
$m= "<p style='color:red'>This user already exists</p>";
}
else
{
//$pass=md5($p);



$query="insert into employee values('','$eid','$name','$phone','$date','$address','$dept','$status','$p','$dob')";
if(mysqli_query($con,$query))
{
$m= "Data saved successfully";
}
else
{
$m= "some error";
}
}
}
?>

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

<script>function checkPass()
{
    //Store the password field objects into variables ...
    var pass1 = document.getElementById('pass1');
    var pass2 = document.getElementById('pass2');
    //Store the Confimation Message Object ...
    var message = document.getElementById('confirmMessage');
    //Set the colors we will be using ...
    var goodColor = "#66cc66";
    var badColor = "#ff6666";
    //Compare the values in the password field
    //and the confirmation field
    if(pass1.value == pass2.value){
        //The passwords match.
        //Set the color to the good color and inform
        //the user that they have entered the correct password
        pass2.style.backgroundColor = goodColor;
        message.style.color = goodColor;
        message.innerHTML = "Passwords Match"
    }else{
        //The passwords do not match.
        //Set the color to the bad color and
        //notify the user.
        pass2.style.backgroundColor = badColor;
        message.style.color = badColor;
        message.innerHTML = "Passwords Do Not Match!"
    }
}
function validatephone(phone)
{
    var maintainplus = '';
    var numval = phone.value
    if ( numval.charAt(0)=='+' )
    {
        var maintainplus = '';
    }
    curphonevar = numval.replace(/[\\A-Za-z!"£$%^&\,*+_={};:'@#~,.Š\/<>?|`¬\]\[]/g,'');
    phone.value = maintainplus + curphonevar;
    var maintainplus = '';
    phone.focus;
}
// validates text only
function Validate(txt) {
    txt.value = txt.value.replace(/[^a-zA-Z-'\n\r.]+/g, '');
}
// validate email
function email_validate(email)
{
var regMail = /^([_a-zA-Z0-9-]+)(\.[_a-zA-Z0-9-]+)*@([a-zA-Z0-9-]+\.)+([a-zA-Z]{2,3})$/;

    if(regMail.test(email) == false)
    {
    document.getElementById("status").innerHTML    = "<span class='warning'>Email address is not valid yet.</span>";
    }
    else
    {
    document.getElementById("status").innerHTML = "<span class='valid'>Thanks, you have entered a valid Email address!</span>";
    }
}
// validate date of birth
function dob_validate(dob)
{
var regDOB = /^(\d{1,2})[-\/](\d{1,2})[-\/](\d{4})$/;

    if(regDOB.test(dob) == false)
    {
    document.getElementById("statusDOB").innerHTML = "<span class='warning'>DOB is only used to verify your age.</span>";
    }
    else
    {
    document.getElementById("statusDOB").innerHTML = "<span class='valid'>Thanks, you have entered a valid DOB!</span>";
    }
}
// validate address
function add_validate(address)
{
var regAdd = /^(?=.*\d)[a-zA-Z\s\d\/]+$/;

    if(regAdd.test(address) == false)
    {
    document.getElementById("statusAdd").innerHTML = "<span class='warning'>Address is not valid yet.</span>";
    }
    else
    {
    document.getElementById("statusAdd").innerHTML = "<span class='valid'>Thanks, Address looks valid!</span>";
    }
}

</script>
 
 <style>body {
    padding-top:50px;
}
fieldset {
    border: thin solid #ccc;
    border-radius: 4px;
    padding: 20px;
    padding-left: 40px;
    background: #fbfbfb;
}
legend {
   color: #678;
}
.form-control {
    width: 95%;
}
label small {
    color: #678 !important;
}
span.req {
    color:maroon;
    font-size: 112%;
}
</style>   



</head>
<body>
 <nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand visible-xs-block visible-sm-block" href="">Employee Data</a>
<a class="navbar-brand hidden-xs hidden-sm" href="">Employee Data</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li><a href="index.php">Master Data</a></li>
<li class="active"><a href="add.php">Add Data</a></li>
</ul>
</div><!--/.nav-collapse -->
</div>
</nav> 
<br>
<div class="container">
<div class="row">
        <div class="col-md-6">
            <form action="" method="post" id="fileForm" role="form">
            <fieldset><legend class="text-center"><span style="color:#CC0000">Add New Employee Data</span></legend>


<div class="form-group">
                <label for="email"><span class="req">* </span> Email Address: </label>
                    <input class="form-control" required type="text" name="eid" id = "email"  onchange="email_validate(this.value);" placeholder="Enter email"/> 
                        <div class="status" id="status"></div>
            </div>


<div class="form-group">
                <label for="firstname"><span class="req">* </span> Employee Name: </label>
                    <input class="form-control" type="text" name="name" id = "txt" onkeyup = "Validate(this)" placeholder="Enter name" required />
                        <div id="errFirst"></div> 
            </div>

            <div class="form-group">
            <label for="phonenumber"><span class="req">* </span> Phone Number: </label>
                    <input required type="text" name="phone" id="phone" class="form-control phone" maxlength="28" onKeyUp="validatephone(this);" placeholder="Enter mobile no."/>
            </div>

<div class="form-group">
<label for="phonenumber"><span class="req">* </span> Date Of Birth: </label>
<input required type="date" name="date" class="form-control" placeholder="0000-00-00"/>
</div>

<div class="form-group">
                <label for="address"><span class="req">* </span> Address: </label>
<textarea name="address" class="form-control" placeholder="Enter address"></textarea>
                 
                        <div id="errFirst"></div> 
            </div>

<div class="form-group">
<label for="department"><span class="req">* </span> Depatment: </label>

<select name="dept" class="form-control" required>
<option value=""> ----- </option>
<option value="Operator">Operator</option>
<option value="Leader">Leader</option>
                            <option value="Supervisor">Supervisor</option>
<option value="Manager">Manager</option>
</select>

</div>

<div class="form-group">
<label for="status"><span class="req">* </span> Status: </label>

<select name="status" class="form-control">
<option value=""> ----- </option>
                            <option value="Outsourcing">Outsourcing</option>
<option value="Contract">Contract</option>
<option value="Office">Office</option>
</select>
</div>
         

          <div class="form-group">
                <label for="password"><span class="req">* </span> Password: </label>
                    <input required name="p" type="password" class="form-control inputpass" minlength="4" maxlength="16"  id="pass1" placeholder="Enter password"/> </p>
</div>
<div class="form-group">
                <label for="password"><span class="req">* </span> Password Confirm: </label>
                    <input required name="password" type="password" class="form-control inputpass" minlength="4" maxlength="16" placeholder="Enter again password to validate"  id="pass2" onKeyUp="checkPass(); return false;" />
                        <span id="confirmMessage" class="confirmMessage"></span>
            </div>

<div class="form-group">
<label for="join_date"><span class="req">* </span> Join Date: </label>
<input required type="date" name="dob" class="form-control" placeholder="0000-00-00"/>
</div>
         
             
                <hr>
<div>
                <input type="checkbox" required name="terms" onChange="this.setCustomValidity(validity.valueMissing ? 'Please indicate that you accept the Terms and Conditions' : '');" id="field_terms">  <label for="terms">I agree with the <a href="terms.php" title="You may read our terms and conditions by clicking on this link">terms and conditions</a> for Registration.</label><span class="req">* </span>
            </div>

            <div class="form-group">
                <input class="btn btn-success" type="submit" name="reg" value="Register">
            </div>
                   

            </fieldset>
            </form><!-- ends register form -->

<script type="text/javascript">
  document.getElementById("field_terms").setCustomValidity("Please indicate that you accept the Terms and Conditions");
</script>
        </div><!-- ends col-6 -->
 
            <div class="col-md-6">
                <h1 class="page-header">HMS =|= </h1>
<?php
 if(isset($m))
 {
 ?>
 <p style="background-color:#99FFCC"><?php echo $m; ?></p>

 </tr>
 <?php
  }
 ?>


             
            </div>

</div>
</div>

</body>
</html>

Tampilan Ketika Data Sudah Ditambahkan



Tampilan Report Aplikasi


Source Code :
<?php
include("connection.php");
// memanggil library FPDF
require('fpdf.php');
// intance object dan memberikan pengaturan halaman PDF
$pdf = new FPDF('L','mm','A4');
// membuat halaman baru
$pdf->AddPage();
// setting jenis font yang akan digunakan
$pdf->SetFont('Arial','B',16);
// mencetak string
$pdf->Cell(40,10,' Laporan PDF Manajemen Pegawai');

$pdf->SetFont('Arial','B',12);


// Memberikan space kebawah agar tidak terlalu rapat
$pdf->Cell(10,7,'',0,1);

$pdf->SetFont('Arial','B',10);
$pdf->Cell(20,6,'Pegawai ID',1,0);
$pdf->Cell(45,6,'Email Pegawai',1,0);
$pdf->Cell(27,6,'Nama Pegawai',1,0);
$pdf->Cell(25,6,'NO HP',1,0);
$pdf->Cell(25,6,'Tanggal Lahir',1,0);
$pdf->Cell(25,6,'Alamat',1,0);
$pdf->Cell(25,6,'Department',1,0);
$pdf->Cell(25,6,'Status',1,0);
$pdf->Cell(30,6,'Tanggal Masuk',1,1);


$pdf->SetFont('Arial','',10);
$pel= mysqli_query($con,"select * from employee");
while ($row = mysqli_fetch_array($pel)){
    $pdf->Cell(20,6,$row['surat_id'],1,0);
    $pdf->Cell(45,6,$row['surat_email'],1,0);
    $pdf->Cell(27,6,$row['surat_name'],1,0);
    $pdf->Cell(25,6,$row['surat_phone'],1,0);
    $pdf->Cell(25,6,$row['surat_dob'],1,0);
    $pdf->Cell(25,6,$row['surat_address'],1,0);
    $pdf->Cell(25,6,$row['surat_dept'],1,0);
    $pdf->Cell(25,6,$row['surat_status'],1,0);
    $pdf->Cell(30,6,$row['surat_joindate'],1,1);
}

$pdf->Output();

?>

Struktur Database



BAB III
PENUTUP


1.1. Kesimpulan
Berdasarkan hasil penelitian dan pengamatan yang telah dilakukan, maka dapat disimpulkan terhadap rumusan masalah diantaranya :
1. Dibeberapa perusahaan/sekolah yang berjalan saat ini manajemen pegawai atau input data pegawai sebagian masih manual, seperti masih menggunakan kertas sebagai alat utama. Sehingga dalam proses pengerjaannya membutuhkan waktu yang cukup lama dan resikonya pasti lebih berat, seperti hilang, rusak, dll.
2. Merancang sistem penerimaan siswa baru yang efektif dan efisien, menggunakan sublime text sebagai text editor, MySql sebagai database, AppServer sebagai server, PHP sebagai bahasa pemrograman, dan bootstrap sebagai desain webnya.

1.2. Saran
Untuk menanggulangi permasalahan yang ada pada sistem yang sedang berjalan, saran yang diberikan adalah :
1. Input data atau manajemen pegawai yang berjalan saat ini harus dirubah, diharapkan menggunakan aplikasi/web yang sudah terkomputerisasi agar menpermudah proses input data karyawan baru, dan penyimpanannya, serta pembuatan laporan.
2. Untuk merancang suatu sistem manajemen pegawai yang efektif dan efisien diperlukan prosedur-prosedur baru yang sesuai dengan kebutuhan system, dan untuk menjalankan suatu sistem yang terkomputerisasi diperlukannya tenaga ahli agar dapat menunjang pelaksanaan terhadap system baru tersebut.
3. Sistem manajemen pegawai ini dapat terus di kembangkan agar dapat mempermudah pegawai terutama dalam proses input data karyawan baru.


Kelompok 13 (TI-IIIA) :
1. Azis Ridwan
2. Deni Herdiansyah
3. Wilda Ainun Nisa
0 Komentar untuk "Manajemen Pegawai Berbasis Web"

Silakan tinggalkan komentar anda. DILARANG KERAS menyimpan link blog/web pada komentar dengan tujuan backlink, Spam.

 
Copyright © 2014 Tutorial Kampus - All Rights Reserved
Template By. Catatan Info