Gambar 4.2 Tampilan Layar Login

Transkripsi

1 4.2.1 Login sebagai Admin Gambar 4.2 Tampilan Layar Login Halaman login adalah halaman awal ketika mengakses aplikasi ini, nantinya user yang belum melakukan login harus login terlebih dahulu, yaitu dengan memasukan Username dan Password yang benar. Tampilan Layar Home Gambar 4.3

2 Halaman home adalah halaman yang diakses oleh pengguna yang telah melakukan login dengan benar. Di halaman ini terdapat pesan yang ditunjukan ke pegawai, dan juga foto pegawai yang melakukan login.terdapat icon jumlah pesan masuk yang belum dibaca. Pada halaman ini juga dilengkapi dengan Bintang Pagi yaitu pegawai teladan pada bulan kemarin. Gambar 4.4 Tampilan Layar Pemberitahuan Ganti Password Halaman Home terdapat button Pemberitahuan(Click Me),ini akan muncul apabila pengguna belum mengganti password default dengan password baru, hal ini untuk menghindari akun digunakan oleh orang lain.

3 Gambar 4.5 Tampilan Layar Bila Sukses Menginput Form di setiap modul Setiap hal yang berhubungan dengan insert dan update ke database khususnya di form inputan, update, dan approve. Apabila telah memenuhi persyaratan yang diminta maka akan memunculkan suatu pesan sebagai keterangan bahwa data sudah masuk ke database dengan benar. Gambar 4.6 Tampilan Layar Footer Di Setiap Halaman

4 Halaman footer ada di setiap halaman, di sini berisi keterangan tentang hak cipta pembuatan website dan tahun buat. Di halaman ini juga terdapat jquery untuk scroll to top apabila kita ingin langsung ke atas tanpa scroll mouse. Gambar 4.7 Tampilan Layar Input Gaji Halaman ini berisi Form input gaji pegawai, form ini berisi rincian gaji yang diperlukan yang akan muncul pada slip gaji perusahaan, halaman ini dilengkapi dengan pencarian pegawai berdasarkan nama pegawai dengan ajax search. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses.

5 Gambar 4.8 Tampilan Layar Input Pegawai Halaman ini berisi form input pegawai baru, form ini berisi rincian data pegawai yang diperlukan. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses. Gambar 4.9 Tampilan Layar Input Pelanggan

6 Halaman ini berisi form input pelanggan baru, form ini berisi rincian data pelanggan yang diperlukan. Field inputan dilengkapi dengan jquey date. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses. Gambar 4.10 Tampilan Layar Input Pesan Halaman ini berisi Form input Pesan, form ini berisi detail pesan yang hendak disampaikan. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan.apabila sukses maka akan muncul alert bahwa inputan sukses.

7 Gambar 4.11 Tampilan Layar Input Jabatan dan Divisi Halaman ini berisi Form input Jabatan dan Divisi yang terpisah, form ini berisi detail Jabatan dan Divisi yang diperlukan. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses.

8 Gambar 4.12 Tampilan Layar Input Proyek Baru Halaman ini berisi Form input proyek baru, form ini berisi detail kegiatan proyek yang diperlukan. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Gambar 4.13 Tampilan Layar Input Kegiatan Proyek Halaman ini berisi Form input Kegiatan proyek, Input ini berisi detail kegiatan keterangan pengerjaan proyek yang dikerjakan dan persentase pengerjaan proyek per hari. Input ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan.

9 Gambar 4.14 Tampilan Layar Jadwal Kerja Halaman ini berisi input jadwal hari kerja. Di halaman ini juga berisi daftar tanggal hari kerja yang telah ada, dan dilengkapi dengan perintah delete. Gambar 4.15 Tampilan Layar Input Dashboard Halaman ini berisi Form input Dashboard, form ini berisi keterangan dashboard yang akan ditampilkan di menu dashboard. Form ini dilengkapi dengan validasi error, apabila data yang

10 dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses. Gambar 4.16 Tampilan Layar Form Input Izin Halaman ini berisi form input izin, form ini berisi detail izin yang diperlukan. Halaman ini dilengkapi pencarian nama dengan ajax dan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan. Apabila sukses maka akan muncul alert bahwa inputan sukses.

11 Gambar 4.17 Tampilan Layar Form Input Cuti Halaman ini berisi Form input cuti, form ini berisi detail cuti yang diperlukan. Form ini dilengkapi pencarian nama dengan ajax dan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan.. Apabila sukses maka akan muncul alert bahwa inputan sukses. Gambar 4.18 Tampilan Layar Form Input Koreksi Absensi Halaman ini berisi Form input Koreksi absensi, form ini berisi detail keterangan koreksi absensi yang diperlukan. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan.

12 Gambar 4.19 Tampilan Layar Rekap Pesan / Informasi Bulanan Halaman ini berisi detail hasil rekap data pesan yang ada di database. Di halaman ini dilengkapi pencarian dengan bulan dan tahun. Di halaman ini terdapat link view, update dan delete. Gambar 4.20 Tampilan Layar Update Pesan Halaman ini berisi update pesan yang telah dipilih sebelumnya, halaman ini berisi detail pesan yang ingin diubah. Form ini dilengkapi dengan validasi error, apabila data yang dimasukan tidak sesuai dengan persyaratan.. Apabila sukses maka akan muncul alert bahwa update sukses.

13 Gambar 4.21 Tampilan Layar View Rincian penerima Pesan Halaman ini berisi tampilan view dari rincian penerima pesan dari pesan yang telah dipilih sebelumnya, view ini berisi detail penerima pesan. Gambar 4.22 Rekap Absensi Per Pegawai Bulanan

14 Halaman ini berisi rekap data detail absensi bulanan per pegawai yang terdata dari hasil absensi, keterangan absensi, total hadir dan tidak hadir serta export file ke excel. Pada halaman ini dilengkapi pencarian nama dengan ajax search. Gambar 4.23 Print Excel Absensi Per Pegawai Per Bulan Pada halaman Rekap Absensi Per Pegawai Bulanan sebelumnya, bila icon excel di klik maka rekap absensi yang telah dipilih akan di export ke excel.

15 Gambar 4.24 Gambar Absensi Pegawai Per Hari Halaman ini berisi rekap absen detail beserta keterangan absen seluruh pegawai dalam 1 hari. Di halaman ini dilengkapi dengan pencarian berdasarkan tanggal, perhitungan hadir atau tidak hadir pegawai dan dilengkapi koreksi absensi serta delete. Gambar 4.25 Tampilan Layar Form Koreksi Absensi

16 Halaman untuk mengubah jam masuk atau jam keluar. Biasanya digunakan bagi pegawai yang lupa absen masuk atau pulang kantor. Apabila sukses maka akan muncul alert bahwa update sukses. Gambar 4.26 Tampilan Layar Rekap Izin Halaman ini berisi tampilan seluruh data rekap izin yang ada di PT Kreasi Teknologi Abadi, dilengkapi dengan pencarian bulan dan tahun serta perintah update dan delete.

17 Gambar 4.27 Tampilan Layar Update Izin Halaman Update izin digunakan untuk mengubah data izin yang telah dipilih dari halaman rekap izin. Data yang akan diupdate harus memenuhi persyaratan yang ditentukan. Apabila sukses maka akan muncul alert bahwa update sukses. Gambar 4.28 Tampilan Layar Rekap Cuti

18 Halaman ini berisi tampilan detail rekap cuti seluruh pegawai per bulan, halaman ini dilengkapi pencarian berdasarkan bulan dan tahun,serta perintah update atau delete. Gambar 4.29 Tampilan Layar Update Cuti Halaman Update cuti digunakan untuk mengubah data cuti yang telah dipilih dari halaman rekap cuti. Data yang akan diupdate harus memenuhi persyaratan yang ditentukan. Apabila sukses maka akan muncul alert bahwa update sukses.

19 Gambar 4.30 Tampilan Layar Rekap Lembur Halaman ini berisi tampilan seluruh jabatan yang ada di PT Kreasi Teknologi Abadi, dan dilengkapi dengan update dan delete. Gambar 4.31 Tampilan Layar Rekap Koreksi Absensi Halaman ini berisi tampilan detail rekap koreksi absensi seluruh pegawai, halaman ini dilengkapi pencarian berdasarkan bulan dan tahun, serta perintah update atau delete.

20 Gambar 4.32 Tampilan Layar Rekap Proyek Halaman ini berisi tampilan detail rekap proyek yang dikerjakan, Pada halaman ini dilengkapi dengan perintah input kegiatan, rincian tim, update dan delete untuk masing-masing proyek yang dipilih. Gambar 4.33 Tampilan Layar Input Kegiatan Proyek

21 Halaman ini berisi form kegiatan yang dilakukan selama pengerjaan proyek. Halaman ini dilengkapi dengan ajax saat memilih jumlah realisasi hari akan muncul rincian hari sesuai jumlah hari yang dipilih, dan validasi error apabila terjadi kesalahan input. Apabila data diisi dengan benar, maka akan muncul alert input rekap kegiatan sukses. Gambar 4.34 Tampilan Layar Update Proyek Halaman ini digunakan untuk mengubah detail proyek yang telah ada. Halaman ini dilengkapi dengan validasi error. Apabila data di input dengan benar maka akan muncul alert update sukses.

22 Gambar 4.35 Tampilan Layar View Rincian Tim Proyek Halaman ini didapat bila pada halaman rekap proyek memilih button rincian tim. Halaman ini berisi detail rincian anggota tim yang mengerjakan suatu proyek. Gambar 4.36 Tampilan Layar View Rincian Tim Proyek

23 Halaman ini didapat bila pada halaman rekap proyek memilih button rincian tim. Halaman ini berisi detail kegiatan proyek beserta persentase proses pengerjaan proyek per hari. Gambar 4.37 Tampilan Layar Rekap Promosi Halaman ini berisi tampilan seluruh data promosi pegawai yang ada di PT Kreasi Teknologi Abadi. Pada halaman ini dilengkapi dengan perintah update dan delete.

24 Gambar 4.38 Tampilan Layar Jabatan Halaman ini berisi tampilan seluruh jabatan yang ada di PT Kreasi Teknologi Abadi, halaman ini dilengkapi dengan perintah update dan delete. Gambar 4.39 Tampilan Layar Update Jabatan

25 Halaman ini digunakan untuk mengubah data jabatan yang telah ada. Halaman ini dilengkapi dengan validasi error. Apabila data di input dengan benar maka akan muncul alert update sukses.