10
Pada Gambar 10 merupakan arsitektur sistem yang dibuat dimana sistem dapat digunakan oleh admin untuk mengatur notifikasi yang terhubung dengan
database dan sistem akan mengirimkan notifikasi ke user dengan memanfaatkan library phpMailer, yang akan dihubungkan ke server email lalu dari server email
akan mengirimkan pesan via email ke user. Server email yang digunakan adalah milik PT Pura Group dengan contoh format email : xxxxxkudus.puragroup.com.
User dapat melihat detail informasi produksi dengan mengakses link yang ada di notifikasi email.
4. Hasil dan Pembahasan
Penelitian ini menghasilkan sistem notifikasi via email pada problem mesin
produksi berbasis web yang dibangun menggunakan framework Codeigniter, framework twitter bootstrap, library Highchart dan libray ajax jQuery sebagai
pendukung pembuatan sistem ini. Dalam pembangunan sistem ini yang perlu kita siapkan pertama kali adalah framework Codeigniter sebagai back end dalam sistem
yang dibuat. Dengan kosep MVC yang ada di codeigniter sangat membantu programmer untuk melakukan konsep OOP pada PHP, didalam framework ini
sudah disediakan beberapa permodelan konsep, selain itu CodeIgniter juga sudah menyiapkan beberapa library yang dapat kita gunakan sebagai pendukung web
yang dibangun.
Gambar 11
Folder framework CodeIgniter
Pada Gambar 11 merupakan isi folder dari framework CodeIgniter yang dibangun dalam sistem ini. Dalam folder application adalah konfigurasi pertama
yang di lakukan dan yang akan dibangun. Pengaturan sistem dapat dilakukan di folder config. Lalu untuk menambahkan fungsi model ditaruh di folder model,
begitu juga fungsi controller dan view ditaruh di folder masing-masing.
11
Sesuai dengan perancangan sistem, bahwa aplikasi yang dibuat di bagi menjadi tiga akses, yaitu :
1 Setting Notifikasi
Bagian ini yang berhak mengakses adalah admin. Admin dapat memilih beberapa menu yang disediakan yang dapat dilihat pada Gambar 12.
Gambar 12 Tampilan Menu Setting Notif
Pada Gambar 12 admin dapat melihat data untuk pengaturan notifikasi dari setiap mesin yang ada di unit Rotogravure, dimana untuk setiap pengiriman notif
mempunyai level tersendiri. Pada saat admin mengklik salah satu data setting dari
mesin, akan memunculkan tampilan edit setting notifikasi, bisa dilihat pada Gambar 13.
Gambar 13 Tampilan Edit Setting Notifikasi
12
Pada tampilan edit setting notifikasi, admin dapat mengatur notif mesin yang dipilih, bisa menentukan mesin tersebut akan dinotifkan atau tidak, bisa
menentukan jumlah level penerima notif dan di setiap level bisa mengatur durasi waktu notif dan siapa saja penerima notif. Lalu admin juga bisa mengatur data
pengirim notif email, seperti pada Gambar 14.
Gambar 14 Tampilan Menu Setting Pengirim
Pada menu tersebut admin bisa melakukan menambah data pengirim, meng- edit data pengirim, dan juga menghapus data pengirim. Akan tetapi disini admin
hanya bisa meng-edit dan menghapus data ketika warna font pada data pengirim hitam dan tidak blur, jadi ketika salah satu pengirim dipilih pada saat mengatur
setting notif, data pengirim tersebut tidak bisa diubah maupun di hapus.
Pada saat insert data pengirim akan diperintahkan untuk memasukan password pengirim email. Untuk mengenkripsi data password sistem menggunakan
fungsi mcrypt dengan algoritma RIJNDAEL 256.
Kode Program 1 Fungsi Enkripsi dan Dekripsi Data Menggunakan Algoritma RIJNDAEL 256.
Pada Kode Program 1 merupakan perintah untuk mengenkripsi dan dekripsi data menggunakan algoritma RIJNDAEL. Baris 1-5 adalah fungsi enkripsi data.
Baris 7-11 merupakan fungsi untuk dekripsi data, kedua fungsi tersebut mengembalikan nilai string hasil enkripsi atau dekripsi data. Key yang di gunakan
dapat dilihat pada baris 2 dan 8.
Gambar 15 Hasil Enkripsi Data dari Algoritma RIJNDAEL 256.
1. function encryptItq { 2. cryptKey = qJB0rGtIn5UB1xG03efyCp;
3. qEncoded = base64_encodemcrypt_encryptMCRYPT_RIJNDAEL_256, md5cryptKey, q, MCRYPT_MODE_CBC, md5md5cryptKey;
4. return qEncoded ; 5. }
6. 7. function decryptItq {
8. cryptKey = qJB0rGtIn5UB1xG03efyCp; 9. qDecoded = rtrimmcrypt_decryptMCRYPT_RIJNDAEL_256,
md5cryptKey, base64_decodeq, MCRYPT_MODE_CBC, md5md5cryptKey, \0;
10. return qDecoded ; 11. }
13
Gambar 16 Tampilan Menu Data SINSE Grafik SINSE
Pada Gambar 16 merupakan tampilan grafik informasi produksi dengan memanfaatkan library Highchart.
Kode Program 2 Fungsi Menampilkan Grafik Menggunakan Highchart.
Pada Kode Program 2 merupakan fungsi untuk menampilkan grafik menggunakan highchart yang di buat dalam script javascript. Baris 2 dan 3 perintah
untuk memanggil library highchart pada javascript. Untuk perintah pengaturan grafik menggunakan library highchart dapat dilihat pada baris 6
– 28. Pengaturan tersebut sudah disediakan oleh library highchart, sehingga kita hanya panggil
fungsi tersebut dan mengisikan data yang dibutuhakan. 2
Monitoring Real Time Notifikasi Problem Mesin Produksi Aplikasi ini ditampilkan hanya pada satu layar komputer saja, yang
digunakan untuk memonitor jalannya produksi pada setiap mesin sekaligus
1. ... 2. script src=?= base_urldistjshighcharts.js ?script
3. script src=?= base_urldistjsexporting.js ?script 4. ...
5. function { 6. chartSip.highcharts{
7. chart: { 8. ...
9. }, 10. title: { text: Grafik Sistem Informasi Produksi },
11. xAxis: { 12. ...
13. categories: [?= category ?] 14. },
15. yAxis: { title: { text: Kecepatan mm } }, 16. tooltip: {
17. crosshairs: true, shared: true,pointFormat: brbMesin :
{series.name} , Speed : {point.y:,.0f} mmb 18. },
19. credits: { enabled: false }, 20. plotOptions: {
21. ... 22. },
23. series: [?= dataGrap ?] }; 24. ...
25. };
14
1. public function cekNotifdata { 2. if countdata 0 {
... 3. foreach data as row {
... 4. if row-SPEED == 0 {
... 5. if selisih = durasi cekStat == 1 strcasecmprow-NOTIF, ya
== 0 { ...
6. if detMes[flag] == 0 levelNM_now = jum_lvl { ...
7. echo this-notif_mod-kirimEmailProblem,levelNM_now, pengirim, penerima, subject, isi, getTgl, row-MESIN, row-UNIT, row-DEPT;
8. ...} } } ...
mengirimkan notifikasi via email secara otomatis, dengan pengecekan fungsi load_data pada data produksi mesin, setiap 10 detik sekali. Fungsi yang di baca
adalah fungsi untuk membaca data mesin produksi yang ada di database, sehingga ketika ditemukan data mesin produksi yang statusnya sedang problem atau
bermasalah maka sistem akan secara otomatis mengirimkan notifikasi ke user, dimana pengiriman notifikasi via email, menggunakan library phpMailer yang
sudah disediakan di framework CodeIgniter. Pengecekan fungsi php secara berulang-ulang di sistem, memanfaatkan code perintah yang disediakan oleh ajax
jQuery. Aplikasi ini jika dijalankan lebih dari satu komputer, maka akan terjadi penumpukan notifikasi atau duplikat notifikasi. Tampilan monitoring bisa dilihat
pada Gambar 17.
Gambar 17 Monitoring Real Time
Pada Gambar 17, terdapat beberapa bagian tampilan, yaitu : 1 Monitoring selang waktu problem, pada bagian ini akan menampilkan selang waktu problem
pada setiap mesin jika ada. Problem disini adalah ketika speed mesin 0 ms ; 2 Note pengiriman notif, pada bagian ini akan menampilkan pengiriman notif via
email berhasil terkirim atau tidak, disini pengiriman notif berdasarkan level pada masing-masing mesin ; 3 Data monitoring, pada bagian ini menampilkan data
terkahir dari setiap mesin. Data ini akan muncul jika mesin sudah di atur untuk notifikasinya dan data produksi mesin ada di database.
Kode Program 3 Fungsi Cek Notif jika Speed = 0 mm.
15
1. ... 2. this-load-libraryemail;
3. ... 4. public function configEmailpengirim {
... 5. config[useragent] = PHPMailer;
6. config[protocol] = smtp; 7. config[mailpath] = usrsbinsendmail;
8. config[smtp_host] = . host; 9. config[smtp_user] = . pengirim;
10. config[smtp_pass] = . pass_pengirim; 11. config[smtp_port] = port;
12. config[smtp_timeout] = 300; 13. config[smtp_crypto] = . crypto;
14. config[smtp_debug] = 0; 15. config[smtp_conn_options] = smtp_option;
16. config[wordwrap] = true; 17. ...
18. this-email-initializeconfig; }
Pada potongan Kode Program 3 adalah perintah untuk mem-filter jika di dapat data speed mesin menjadi 0 ms. Perintah pengecekan dan pembacaan data
dapat dilihat pada baris 2 – 4 , jika di dapati speed mesin adalah 0 maka di berikan
perintah untuk pengiriman notifikasi dengan melihat data pengaturan notifikasi yang di simpan didalam databse, yang dapat di lihat pada baris 5
– 8.
Kode Program 4 Fungsi Cek Notif jika Speed 0 mm.
Pada potongan Kode Program 4, di berikan perintah jika speed mesin lebih dari 0 mm atau berjalan kembali, maka akan di berkan berikan kondisi jika
memenuhi akan mengirimkan notif email bahwa mesin sudah berjalan kembali dengan data pengiriman notif yang diambil dari pengaturan notifikasi yang di
simpan didalam database, yang dapat dilihat pada baris 1 – 6.
Kode Program 5 Fungsi loadData Setiap 10 Detik Sekali
Pada Kode Program 3 dan Kode Program 4 akan di baca fungsinya setiap 10 detik sekali dengan menggunakan fungsi javascript yang di sediakan di library ajax
jQuery, dapat dilihat pada Kode Program 5.
Kode Program 6 Konfigurasi email pada phpMailer.
1. else if row-SPEED 0 { ...
2. if prevStat == 1 { ...
3. dDetailSN = this-notif_mod-dataSetNotDetailrow-MESIN, i; 4. if selisih durasi {
... 5. echo this-notif_mod-kirimEmailKembali Produksi,i, pengirim, penerima,
subject, isi, getTgl, row-MESIN, row-UNIT, row-DEPT; 6. }
... 7. }
1. function loadData { 2. setIntervalmy_data;, 10000;
3. .ajax{url: baseUrl + index.phpnotifloadDSM, success: function result { i. data.htmlresult;
b. } 4. };
5. }
16
Pada Kode Program 6 merupakan perintah untuk melakukan konfigurasi email. Library phpMailer sudah disediakan di framework CodeIgniter sehingga
pada baris 2 dilakukan perintah untuk memanggil library yang sudah di sediakan pada framework CodeIgniter. Pada baris 5-18 merupakan perintah konfigurasi
email, dengan dibutuhkan data pengirim email seperti alamat email, password , host server, port, crypto, dan konfigurasi sertifikat yang di gunakan pengirim. Data
pengirim email di ambil dari tabel pengirim email lalu disesuaikan konfigurasinya. Untuk isi notifikasi via email bisa dilihat pada Gambar 18. Pada gambar tersebut
dituliskan bahwa mesin sedang bermasalah atau sudah berjalan kembali.
Gambar 18 Tampilan Notifikasi via Email.
3 Detail Data Produksi Mesin
Aplikasi ini bisa diakses oleh user ketika mendapat notifikasi dari via email. Dimana link ini bisa di akses ketika terhubung dengan jaringan yang ada di unit
Rotogravure. Pada aplikasi ini terdapat tiga menu, yaitu home, tabel SINSE, dan grafik SINSE. Untuk fitur-fitur sama dengan menu Data SINSE yang ada di admin.
Gambar 19 Tampilan Responsive pada Menu Home
17
Pada Gambar 19 merupakan tampilan responsive web pada menu home yang di gunakan user ketikan mengakses link yang dikirimkan melalui notif email.
Tampilan ini menggunakan framework Twitter Bootstrap.
Kode Program 7 Penggunaan Framework Twitter Bootstrap.
Pada Kode Program 7 terdapat perintah untuk menggunakan framework twitter bootstrap yang dapat diimplentasikan pada script css di html. Baris 2 dan 3
merupakan perintah pemanggilan framework twitter bootstrap. Pada baris 5 – 23
perintah untuk membuat header pada aplikasi yang digunakan user. Perintah menggunakan tag html, di dalam tag tersebut terdapat pemanggilan class. Class
tersebut diisikan dengan nama – nama class yang sudah di sediakan di framework
twitter bootstrap. Pemanggilan nama class disesuaikan dengan jenis tag yang digunakan.
Pengujian aplikasi dilakukan untuk menguji fungsi-fungsi aplikasi hasil implementasi arsitektur dengan melihat use case. Pengujian aplikasi menggunakan
teknik black box, yaitu pengujian fungsional tanpa melihat alur eksekusi program, namun cukup dengan memperhatikan apakah setiap fungsi sudah berjalan dengan
baik sesuai dengan yang diharapkan. Hal yang diuji dan hasil pengujian dapat dilihat pada Tabel 1.
Tabel 1 Hasil Pengujian Blackbox.
No Point
Validasi Input
Data Input
Hasil Uji Status Uji
1 Manajemen data
setting notifikasi Data setting
notifikasi Data setting
notifikasi Sistem menampilkan data
setting notifikasi beserta fitur edit, reset, dan search
valid
2 Manajemen data
pengirim Data pengirim
Data pengirim Sistem menampilkan data
Pengirim beserta fitur insert, update, dan delete
valid
1. ... 2. link href=?= base_urldistcssbootstrap.min.css ? rel=stylesheet
3. script src=?= base_urldistjsbootstrap.min.js ?script 4. ...
5. div class=navbar navbar-invers navbar-fixed-top backHead 6. div class=container
7. div class=navbar-header 8. button type=button class=navbar-toggle collapsed data-toggle=collapse
data-target=navbar aria-expanded=false aria-controls=navbar style=background-color: white;
9. span class=sr-onlyToggle navigationspan 10. span class=icon-bar backHeadspan
11. span class=icon-bar backHeadspan 12. span class=icon-bar backHeadspan
13. button 14. a class=navbar-brand href=?= base_urlindex.phpnotif ?
15. span class=glyphicon glyphicon-homespan SINSE 16. a
17. div 18. div id=navbar class=collapse navbar-collapse
19. ul class=nav navbar-nav 20. li
21. a href=?= base_urlindex.phpcon_ocpageSetNot ? target=_blank 22. span class=glyphicon glyphicon-cogspan Setting
23. a li ul div div div
18
3 Manajemen data
penerima Data penerima
Data penerima Sistem akan menampilkan
data Penerima beserta fitur update, dan delete
valid 4
Edit data notif status mesin
Data status Edit notif ya atau
tidak Sistem menampilkan data
perubahan notif status mesin
valid 5
Lihat tabel produksi di setiap
mesin Data produksi
Data produksi Sistem menampilkan tabel
produksi beserta fitur pagination dan search
valid 6
Lihat grafik produksi di setiap
mesin Data produksi
Data produksi Sistem menampilkan
grafik produksi pada setiap mesin berserta fitur
zoom in out, search , dan downlad file.
valid
7 Lihat data
monitoring real time produksi
mesin Data produksi
Data produksi Sistem menampilkan data
monitoring real time produksi mesin beserta
fitur note time dan status kirim notifikasi
valid
8 Notif via email
problem mesin Data produksi
dan data setting notifikasi
Data produksi dan data setting
notifikasi Sistem mengirimkan
notifikasi via email ke user.
valid 9
Notif via email mesin kembali
produksi Data produksi
dan data setting notifikasi
Data produksi dan data setting
notifikasi Sistem mengirimkan
notifikasi via email ke user.
valid 10
Enkripsi algorithma
RIJNDAEL 256 Data password
Data password Sistem menyimpan
password ke database sesuai dengan enkripsi
yang dibuat valid
11 Dekripsi
algorithma RIJNDAEL 256
Data password Data Password
Sistem akan menampilkan hasil dekripsi dari enkripsi
password. valid
Berdasarkan hasil pengujian fungsionalitas program pada Tabel 1, pada setiap status uji valid berarti dapat disimpulkan bahwa sistem notifikasi problem mesin
produksi via email berbasis web sudah memenuhi tujuan penelitian yaitu sebagai pemberitahuan problem mesin atau mesin kembali produksi secara cepat dan real
time via email kepada user dengan pengaturan notifikasi dari admin, dapat dikirimkan secara real time, sehingga dapat segera ditindak lanjuti agar efektivitas
produksi meningkat.
5. Simpulan
