Sistem Inf. Keselamatan Dan Kesehatan Kerja (SHEQ IS) PT Badak NGL Bontang - Junaini SKom MKom

1
ANALISA SISTEM INFORMASI KESELAMATAN DAN

KESEHATAN KERJA (SHEQ-IS) PT BADAK NGL
BERBASIS WEB MENGGUNAKAN TEKNIK
PENYAJIAN PROGRAM AJAX
TUGAS AKHIR
Oleh:
Aries Soesetijoko
NIM: 200512041
PROGRAM STUDI TEKNIK INFORMATIKA

SEKOLAH TINGGI TEKNOLOGI BONTANG (STITEK)
PEMERINTAH KOTA BONTANG
JUNI 2009
2
LEMBAR PENGESAHAN
ANALISA SISTEM INFORMASI KESELAMATAN DAN

KESEHATAN KERJA (SHEQ-IS) PT BADAK NGL BERBASIS
WEB MENGGUNAKAN TEKNIK PENYAJIAN PROGRAM AJAX
TUGAS AKHIR
Oleh:
Aries Soesetijoko
NIM: 2005 12 041
Telah disetujui dan disahkan sebagai Proposal Tugas Akhir
Bontang, 25 April 2009
Ketua STITEK Pemerintah Kota
Masagus .M. Yusuf, SKom, MKom

NIP :
Pembimbing 1 Pembimbing 2
Khairudin Karim, ST, MT M.F Andrijasa, Skom, Mkom

NIP : NIP :
3
BAB I
PENDAHULUAN
1.1. Latar Belakang
Dalam memproduksi barang dan produk yang dihasilkan kepada
pelanggan masih adanya bahaya terhadap Kesehatan dan Keselamatan Kerja (K3)
terhadap aktivitas kerja bidang industri. Isu terhadap Kesehatan dan Keselamatan
Kerja sangat diperhatikan pada bidang industri yang terus berkelanjutan setiap
waktu selama proses produksi berlangsung, isu tersebut adalah kecelakaan akibat
kerja. Karena tingginya angka kecelakaan kerja bidang industri, adanya bahaya
kebakaran sampai dengan menghilangkan seluruh asset perusahaan, adanya
kecelakaan lalu lintas menuju dan dari tempat kerja dari karyawan yang
bersangkutan sehingga asset perusahaan berupa tenaga kerja/tenaga ahli, waktu
bekerja yang hilang menjadi hilang atau bahkan bahkan sampai dengan proses
produksi terhenti akibat dari tenaga ahli tidak berada ditempat kerja. Hal ini akan
merugikan suatu perusahaan dan karyawan itu sendiri.
Isu yang tak kalah penting juga adalah Kesehatan Kerja dari gangguan
kesehatan di tempat kerja bidang industri diantaranya : penyakit paru, cedera otot
tulang, kanker, gangguan pendengaran akibat bising, maupun penyakit akibat
kerja.
Permasalahan-permasalahan tersebut diatas adalah diantaranya dari
berbagai masalah khususnya bidang industri terhadap isu Keselamatan dan
Kesehatan Kerja (K3). Permasalahan Keselamatan dan Kesehatan Kerja akibat

4
dari : 1. Tidak adanya sistem; 2. Kurangnya standar kerja; 3. Kurang peduli
tentang masalah K3; dan 4. Masih memakai paradigma lama.
Dari isu Keselamatan dan Kesehatan tersebut diatas perlu adanya : 1.
Mengelola K3 secara terstruktur, berkesinambungan dan sistematis; 2.
Menciptakan tempat kerja yang “safe”; 3. Mencegah dan mengurangi kecelakaan
dan penyakit akibat kerja; 4. Meningkatkan efisiensi dan produktifitas kerja; dan
5. Memenuhi peraturan yang berlaku (UU No.1 1970 dan Per.05/Men/96) untuk
tempat kerja yang jumlahnya seratus orang atau lebih, yang mengandung potensi
bahaya yang ditimbulkan oleh karakteristik proses atau bahan produksi, dan yang
dapat mengakibatkan kecelakaan kerja dan kerugian.
Isu tentang Keselamatan dan Kesehatan Kerja (K3) oleh PT Badak NGL
khususnya di Safety Health and Environment (SHE) Department dapat
dimonitoring dengan adanya “Sistem Informasi Keselamatan dan Kesehatan
Kerja” atau disebut juga Safety, Health, Environment & Quality Information
System (SHE-Q IS). SHE-Q IS diperlukan guna membantu pekerja PT Badak
NGL beserta kontraktor pada umumnya, agar lebih mudah mendapatkan informasi
khususnya masalah Keselamatan dan Kesehatan Kerja.
Penerapan Sistem informasi Keselamatan dan Kesehatan Kerja (SHE-Q
IS) masih adanya kendala, sistem informasi SHE-Q IS berfungsi untuk mengelola
data K3, proses bisnis, dan informasi yang berkaitan dengan keselamatan,
kesehatan, pengendalian lingkungan, dan pengendalian mutu di lingkungan PT
Badak NGL.
Dari hal tersebut maka dalam penelitian penulis menganilisis “Sistem
Informasi Keselamatan dan Kesehatan Kerja (SHE-Q IS) PT Badak NGL” dengan
5
Java 2 Paltform Enterprise Edition (J2SE versi 5.0) dan diterapkan pada Web
Server yaitu Aphace Tomcat 6.0 dari Jakarta Tomcat. Pengembangan Sistem
Informasi SHE-Q menggunakan AJAX (Asynchronous JavaScript and XML) dan
diintegrasikan dengan Oracle-Database versi 11.0.
1.2. Rumusan Masalah
Dari latar belakang yang telah diuraikan maka dapat dirumuskan beberapa
permasalahan yang akan dijadikan dasar dalam penelitian ini. Adapun rumusan
masalah dapat dijabarkan sebagai berikut :
Bagaimana mengetahui secara cepat dan akurat berdasarkan data yang terjadi di
lapangan tentang Safety Performance Indicator (SPI)?
1.2.1. Menganilisis Sistem Informasi Keselamatan dan Kesehatan Kerja,
sehingga data yang diterima lebih akurat, terintegrasi, up-to-date, serta
dapat diakses kapan saja dan dari mana saja dengan pemrograman AJAX
berbasis web.
1.2.2. Bagaimana membuat Event Form agar terintegrasi dengan Safety
Performance Indicator (SPI) dalam menentukan Leading Indicator dan
Lagging Indicator?
1.3. Batasan masalah
Agar masalah yang dikemukakan tidak meluas maka peneliti memberikan
batasan masalah pada Sistem Informasi Keselamatan dan Kesehatan Kerja
(SHEQ-IS):
1. Membuat Event Form pada Event Registrasi?

6
2. Membuat tampilan Event List.
3. Menentukan Event List sebagai Leading Indicator atau Lagging Indicator
oleh Administrator SHEQ-IS.
4. Mengintegrasikan dengan sistem yang lama, untuk penerapan Safety
Performance Indicator (SPI).
1.3. Tujuan Penelitian
Dari permasalahan yang ada maka tugas ini bertujuan untuk memahami
sistem dan masalah yang ada, untuk mengguraikan kebutuhan informasi dan untuk
menetapkan prioritas pekerjaan sistem selanjutnya.
Berikut adalah tujuan penelitian, yaitu:
1.3.1. Dapat diketahui secara cepat dan akurat dari hasil lapangan tentang Safety
Performance Indicator (SPI).
1.3.2. Monitoring dari SHEQ-IS dapat memberikan arahan secara lebih jelas
terhadap pekerjaan yang akan dilaksanakan, dengan mengutamakan
masalah Keselamatan dan Kesehatan Kerja.
1.3.3. Mengetahui kebutuhan sistem informasi yang dibutuhkan dan dibuat
penambahan sistem baru lagi sesuai keinginan pihak manajemen
Keselamatan dan Kesehatan Kerja.
1.3.4. Aktifitas pekerja dapat dilihat secara jelas Leading Indikcator dan Lagging
Indicator sejalan dengan visi, misi dan tujuan manajemen keselamatan dan
kesehatan kerja.
7
1.4. Manfaat Penelitian
1.4.1. Manfaat bagi mahasiswa
Adapun manfaat penelitian ini bagi peneliti, selain mendapat pengalaman,
peneliti pun dapat mengetahui dan menganalisa serta mambantu memberikan
solusi permasalahan yang terdapat di PT Badak NGL Bontang khususnya bagi
Safety Health & Enviroment Quality Department dengan teknologi informasi yang
ada serta kemampuan yang dimiliki peneliti, sehingga dapat mempermudah
memonitoring Safety Performance Indicator (SPI)..
1.4.2. Manfaat bagi perusahaan
Diharapkan dapat meningkatkan kinerja pada PT Badak NGL pada
penerapan Safety, Health, Environment & Quality Information System (SHEQ-IS)
sehingga dengan mudah memonitoring, dengan cepat, akurat dan lancar setelah
adanya sistem yang baru dibuat.
1.4.3. Manfaat bagi Peneliti dan STITEK Bontang
Diharapkan penelitian yang dibuat ini dapat menjadi tolak ukur buat bagi
peneliti lain maupun kalangan akademik untuk menilai sebesar peran dan
kemampuan yang diberikan kepada masyarakat atau instansi pemerintah/swasta,
dan sebesar apa keaktifan peneliti dapat mengelola proyek nantinya. Laporan
penelitian ini pun dapat menjadi bahan acuan buat peneliti lainnya, mahasiswa
atau pihak terkait untuk dapat ditingkatkan dalam menyusun penelitian lebih
lanjut. Hal lain adalah untuk menambah perbendaharaan perpustakaan.

8
BAB II
LANDASAN TEORI
Teori merupakan dasar pendukung yang dipakai dalam membahas suatu
masalah yang akan dijadikan sumber untuk merumuskan hipotensi yang khusus
dan diuji kebenarannya secara umum. Suatu penelitian yang tidak dilandasi
dengan teori yang lengkap, menyebabkan pemecahan masalah tidak akan
mencapai sasarannya.
Mengingat sangat pentingnya peranan teori dalam suatu penelitian
sehingga tidak dapat dipisahkan antara satu dengan lainnya. Dalam membahas
teori-teori yang berhubungan dengan variabel yang akan diteliti peneliti
menyajikan beberapa teori yang berkaitan dengan isi penelitian ini.
2.1. Definisi Sistem
Sistem adalah sekelompok elemen yang terintegrasi dengan maksud yang

sama untuk mencapai suatu tujuan. Mc.Leod (2001).
Sedangkan menurut Hall (2001), sistem adalah sebuah rangkaian prosedur

formal.
Menurut Ludwig Von Bartalanfy, sistem merupakan seperangkat unsur

yang saling terikat dalam suatu antar relasi diantara unsur-unsur tersebut dengan
lingkungan.
Menurut Anatol Raporot, sistem adalah suatu kumpulan kesatuan dan

perangkat hubungan satu sama lain.
Menurut L. Ackof, sistem adalah setiap kesatuan secara konseptual atau

fisik yang terdiri dari bagian-bagian dalam keadaan saling tergantung satu sama
lainnya.
Menurut Jogianto (2001), sistem adalah suatu jaringan kerja dari

prosedur-prosedur yang akan saling berhubungan, berkumpul bersama-sama untuk
9
melakukan suatu kegiatan atau untuk menyelesaikan suatu sasaran tertentu. Sistem
Mempunyai beberapa karakteristik yaitu :
a. Komponen Sistem
Suatu sistem terdiri dari sejumlah komponen yang berinteraksi, yang artinya
saling bekerja sama membentuk satu kesatuan komponen-komponen sistem
atau elemen-elemen sistem dapat berupa suatu sub sistem atau bagian-bagian
dari sistem. Setiap sistem tidak peduli betapapun kecilnya, selalu mengandung
komponen-komponen atau subsistem-subsistem. Setiap subsistem mempunyai
sifat-sifat dari sistem untuk menjalankan suatu fungsi tertentu dan
mempengaruhi prases sistem secara keseluruhan.
b. Batas sistem
Batas sistem (Boundary) merupakan daerah yang membatasi antara suatu
sistem dengan sistem yang lainnya atau dengan lingkungan luarnya. Batas
sistem ini memungkinkan suatu sistem dipandang sebagai satu kesatuan. Batas
suatu sistem menunjukan ruang lingkup (Scope) dari sistem tersebut.
c. Lingkungan luar sistem
Lingkunan luar (Environment) dari suatu sistem adalah apapun diluar batas
dari sistem yang mempengaruhi opersai sistem. Lingkungan luar sistem dapat
bersifat menguntungkan dan dapat juga bersifat merugikan sistem tersebut.
Lingkungan luar yang menguntungkan merupakan energi dari sistem dan
dengan demikian harus tetap dijaga dan dipelihara. Sedang lingkungan luar
yang merugikan harus ditahan dan dikendalikan, kalau tidak maka ekan
menggangu kelangsungan hidup dari sistem.
d. Penghubung sistem
Penghubung (Interface) merupakan media penghubung antara satu subsistem
dengan subsistem yang lainnya. Melalui penghubung ini memungkinkan
sumber-sumber daya mengalir dari satu subsistem ke subsistem lainya.
Keluaran (Output) dari subsistem akan menjadi masuksn (Input) untuk
subsistem yang lainnya dengan melalui penghubung.
e. Masukkan Sistem
Masukan (Input) adalah energi yang dimasukkan ke dalam sistem. Masukkan
dapat berupa masukan perawatan (Maintenance Input) dan masukkan sinyal
(Signal Input). Maintenance input adalah energi yang dimasukkan supaya
sistem tersebut dapat beroperasi. Signal input adalah energi yang diproses
untuk didapatkan keluaran.
f. Keluaran Sistem
Keluaran (Output) adalah hasil adari energi yang diolah dan diklarifikasikan
menjadi keluaran yang berguna dan sisa pembuangan. Keluaran dapat
merupakan masukkan untuk subsistem yang lain atau kepada supra sistem.
g. Pengolah Sistem
Suatu sistem dapat mempunyai suatu bagian pengolah yang akan mengubah
masukan berupa bahan baku dan bahan-bahan yang lain menjadi keluaran
berupa barang jadi. Sistem akuntansi akan mengolah data-data transaksi
menjadi laporan-laporan yang lain dibutuhkan oleh manajemen.
h. Sasaran Manjemen
Suatu sistem mempunyai tujuan (Goal) atau sasaran (Objective). Kalau suatu
sistem tidak mempunyai sasaran, maka operasi tidak akan ada gunanya.
Sasaran dari sistem sangat menentukan sekali masukan yang dibutuhkan dan
10
keluaran yang akan dihasilkan sistem. Suatu sistem dikatakan berhasil bila
mengenal sasaran atau tujuan.
Syarat-syarat sistem :
• Sistem harus dibentuk untuk menyelesaikan masalah.
• Elemen sistem harus mempunyai rencana yang ditetapkan.
• Adanya hubungan diantara elemen sistem.
• Unsur dasar dari proses (arus informasi, energi dan material) lebih penting dari
pada elemen sistem.
• Tujuan organisasi lebih penting dari pada tujuan elemen.
2.2. Definisi Informasi
Menurut Jogiyanto (2001), informasi adalah data yang diolah menjadi

bentuk yang lebih berguna dan berarti bagi yang menerimanya.
Informasi ini adalah suatu keterangan, baik berupa data-data atau fakta,
maupun analisis, pandangan dari yang menyampaikannya, mengenai hal-hal yang
berkaitan dengan kebutuhan di dalam memutuskan bidang pemasaran
(Tedjasutrisna, 1996).
Waluya (1996) / karakteristik informasi ada 4 yaitu :

a. Relevance
Informasi adalah relevan bilamana berguna dalam decision making.
b. Timeliness
Timeliness suatu informasi juga penting dalam kontek manajemen, informasi
sistem semakin lama, nilai informasi akan turun.
c. Accuracy
Disebut akurat apabila informasi bebas dari kesalahan (free of eror).
d. Variabelity
Variabelity artinya ketepatan (accuracy) dari informasi dapat di
konfirmasikan. Informasi dapat diperbaiki dengan cara membandingkan
dengan informasai yang lain sehingga menjadi akurat.
2.3. Defenisi Sistem Informasi
Menurut Oetomo (2002), sistem informasi (SI) dapat didefinisikan

sebagai kumpulan elemen yang saling berhubungan satu sama lain yang
membentuk satu kesatuan untuk mengintegrasikan data, memproses dan
menyimpan serta mendistribusikan informasi. Dengan katra lain, SI merupakan
kesatuan elemen-elemen yang saling berinteraksi secara sistematis dan teratur
untuk menciptakan dan membentuk aliran informasi yang akan mendukung
pembuatan keputusan dan melakukan kontrol terhadap jalannya perusahaan.
Sistem informasi merupakan suatu kumpulan dari komponen-komponen

dalam perusahaan atau organisasi yang berhubungan dengan proses penciptaan
dan pengaliran informasi (Indrajit, 2001).
11
2.4. Analisis Sistem
Suatu sistem akan dirancang oleh satu orang atau sekelompok orang yang
membentuk tim. Orang yang merancang sistem ini disebut Sistem Analis.
Ada yang mendefinisikan Sistem Analis sebagai :
• Seorang yang menggunakan pengetahuan aplikasi komputer yang dimilikinya
untuk memecahkan masalah-masalah bisnis, dibawah petunjuk Manajer
Sistem.
• Seorang yang bertanggung jawab menterjemahkan kebutuhankebutuhan si
pemakai sistem (user) ke dalam spesifikasi teknik yang diperlukan oleh
Programmer dan diawasi oleh Manajemen.
Pengertian sistem analis ini dapat digambarkan sebagai berikut :
Gambar 1. Proses Analisis Sistem
Fungsi Analisis Sistem adalah
• Mengidentifikasikan masalah-masalah dari user.
• Menyatakan secara spesifik sasaran yang harus dicapai untuk memenuhi
kebutuhan user.
• Memeilih alternatif-alternatif metode pemecahan masalah.
4.Merencanakan dan menerapkan rancangan sistemnya sesuai dengan permintaan
user
12
2.5. Tomcat
Gambar 2. Tampilan utama Aphace Tomcat
Aplikasi web mengimplementasikan teknologi client-server. Proses
pembangunan aplikasi dilakukan di sisi server. Ada tiga hal yang dibutuhkan oleh
developer dalam hal ini, web server, web editor, dan resource. Web server yang
diperkenalkan pada modul ini ada dua, yaitu Apache Tomcat 5.5.1 dan Apache
Ant. Apache Tomcat ini digunakan untuk menjalankan aplikasi atau website
berbasis Java Servlet dan Java Server Pages (JSP) yang memiliki keamanan
tinggi.
Tentunya harus dipastikan terlebih dahulu, bahwa sudah ada J2SE 5.0
yang berjalan di Sistem Operasi Windows anda sebelum proses penginstalan dan
konfigurasi web server dilakukan.

13
Gambar 3. Tampilan Administration Tool pada Aphace Tomcat
Gambar 4. Tampilan penggunaan Java 2 Standard Edition (J2SE) versi 5.0
Setelah penginstalan selesai dilakukan, hal yang dilakukan berikutnya
adalah mengenal pengorganisasian source di web server, melingkupi struktur
direktori, external dependencies, dan file konfigurasi build.xml.

14
Kemudian pada percobaan Proses Pembangunan, anda dapat mencoba
untuk membuat direktori source code, mengedit source code dan page, meng-
compile aplikasi, melakukan uji coba terhadap aplikasi, dan terakhir membuat
release aplikasi.
2.6. Pengertian AJAX
AJAX adalah kepanjangan dari Asynchronous Java and XML. Istilah
AJAX digunakan pada website yang berinteraksi dengan server melalui javascript
secara asinkron (background), sehingga pengguna tidak perlu me-load
keseluruhan isi page. Hal ini menyebabkan pengiritan waktu dan bandwidth, juga
menghasilkan website yang makin interaktif.
AJAX itu sendiri diperkenalkan oleh seorang pakar pembuat program
khususnya pemrograman berbasis web. Orang yang sangat berjasa tersebut tidak
lain dan tidak bukan adalah Rasmus Lerdorf, dari tangan dingin Rasmus Lerdorf
ini pulalah beberapa waktu yang lalu lahirlah PHP.
Untuk mengaplikasikan AJAX dalam website, yang dibutuhkan adalah
browser yang menyediakan layanan Javascript, dan komponen XMLHTTP bagi
pengguna Internet Explorer (IE), dan XMLHttpRequest untuk Firefox, Safary,
Opera dan browser lainnya. Syarat-syarat tersebut hampir pasti sudah terpenuhi,
mengingat pengguna internet banyak yang menggunakan IE dan Firefox.
Sebenarnya tidak ada hal baru dalam AJAX, karena yang digunakan
adalah teknologi javascript, yang notabene sudah lama digunakan. Oleh karena
itu, bagi yang sudah terbiasa dengan javascript, akan mudah sekali mempelajari
AJAX.
15
Pembahasan ini tidak menekankan pada salah satu teknologi (Javascript,
AJAX, HTML, PHP), akan tetapi keseluruhan dari hal tersebut. Hal ini karena
penggunaan AJAX tidak hanya pada sisi client (browser), tapi juga melibatkan
respon dari server.
Dengan menggunakan konsep ini, page HTML bisa membuat koneksi
secara asinkron ke server dengan cara mengambil XML atau dokumen text.
Selanjutnya XML atau dokumen text ini akan digunakan oleh javascript untuk
meng-update atau memodifikasi Document Object Model (DOM) pada page
HTML.
Untuk selanjutnya teknologi ini juga dikenal web remoting atau remote
scripting. Developer Web dapat mengkombinasikan plug in, java applets atau
hidden frame untuk mengemulasikan interaksi antara page HTML dengan
dokumen XML. Dalam teknologi Javascript telah disediakan sebuah object yaitu
XMLHTTPRequest. Object ini sudah banyak disupport oleh banyak browser
seperti Internet Explorer, Firefox, Opera, Netscape dan lain sebagainya.
AJAX merupakan teknologi web terbaru yang memungkinkan interaksi
pengguna dan web lebih aktraktif dan juga lebih efisien dalam transfer data.
Karena dengan AJAX kita dapat me-refresh atau me-load sebagian konten yang
perlu di-update. Dengan demikian, bagian web lainnya seperti header, footer,
sidebar, dan bagian lainnya tidak perlu di-load ulang. Kita hanya me-load konten
yang berubah saja. Dengan demikian akan lebih efisien dalam transfer data,
aplikasi lebih responsif, dan pengguna lebih mudah berinteraksi dengan web
layaknya aplikasi desktop. Pada teknologi web sebelum AJAX untuk

16
menampilkan konten yang berubah kita harus meload halaman web secara
keseluruhan tanpa peduli bahwa ada bagian web yang kontennya tidak berubah.
Biasanya pada aplikasi berbasis web tradisional, untuk merubah isi sebuah
page maka page tersebut harus di-load ulang, akan tetapi dengan menggunakan
javascript atau Cascading Style Sheets (CSS), programmer web bisa membuat
sebuah aplikasi yang dinamis tanpa harus me-load ulang keseluruhn isi page-nya.
Dalam tulisan ini penulis akan mencoba menjelaskan secara detail bagaimana
tehnik membuat aplikasi berbasis web yang menggunakan konsep AJAX.
Berikut ini ilustrasi yang menggambarkan interaksi AJAX dengan Server :
Gambar 5. Ilustrasi interaksi AJAX dengan Web Server
Konsep AJAX ini ide awalnya dikemukakan oleh Rasmus Lerdorf.
Rasmus Lerdorft mengemukakan konsep AJAX ini dalam sebuah miling list
(milist). Berawal dari milist tersebut konsep AJAX kemudian dikenal dan
dikembangkan oleh banyak orang.

17
2.7. Oracle Database Versi 11.0.0
Perusahaan Oracle didirikan pada tahun 1977 oleh tiga orang programmer,
Bob Miner, Ed Oates, dan Larry Ellison yang menjabat sebagai CEO (Chief
Executive Officer) selama beberapa tahun sampai saat ini. Perusahaan ini
berkonsentrasi pada pembuatan database server di mainframe.
Sekitar pertengahan tahun 1980an, Larry mendiversifikasi produk Oracle
(versi 6.x) keluar mainframe, yakni ke sistem operasi Unix. Selanjutnya tahun
1996 Oracle Corp mendiversifikasi Oracle (versi 7.x) ke sistem operasi Novell
Netware, Windows NT, dan Linux (versi 8.x, tahun 1997).
Mulai pertengahan tahun 1990an Oracle Corp mulai membuat juga produk-produk
nondatabase-server seperti application server (WebDB, OAS), development tools
(Oracle Developer, Oracle Designer), dan application suite (Oracle Apps).
2.7.1. Model Basis Data Relasional
Model basis data relasional adalah model formal tentang data. Sebagai
model formal, model ini menspesifikasikan struktur (tipe) data yang formal,
operasi-operasi yang formal, dan aturan integritas nilai yang formal.
Basis data relasional memiliki satu struktur logik yang disebut relasi (relation) dan
pada level fisik berupa tabel (table). Atribut (attribute) merepresentasikan elemen
dari data yang berkaitan dengan relasi. Sebagai contoh, relasi Pegawai memiliki
atribut-atribut seperti nama, nomor pegawai, dan alamat. Sebuah relasi
dinotasikan secara konvensional dengan : Relation (attribute1, attribute2,..)
Contoh : Pegawai (Nama, Nomor_Pegawai,Alamat,..)

18
Nilai data dari atribut dari sebuah relasi akan disimpan dalam tuple atau row
(baris) dari tabel.
2.7.2. Relational Database Management System (RDBMS)
RDBMS (Relational Database Management System) adalah perangkat
lunak untuk membuat dan mengelola database, sering juga disebut sebagai
database engine. Istilah RDBMS, database server-software, dan database engine
mengacu ke hal yang sama; sedangkan RDBMS bukanlah database. Beberapa
contoh dari RDBMS diantaranya Oracle, Ms SQL Server, MySQL, DB2, Ms
Access.
2.7.3. Pengertian Oracle Database
Oracle adalah relational database management system (RDBMS) untuk
mengelola informasi secara terbuka, komprehensif dan terintegrasi.
Oracle Server menyediakan solusi yang efisien dan efektif karena kemampuannya
dalam hal sebagai berikut :
• Dapat bekerja di lingkungan client/server (pemrosesan tersebar)
• Menangani manajemen space dan basis data yang besar
• Mendukung akses data secara simultan
• Performansi pemrosesan transaksi yang tinggi
• Menjamin ketersediaan yang terkontrol
• Lingkungan yang terreplikasi
2.7.4. Bahasa SQL
SQL (Structured Query Language) digunakan sebagai antarmuka dalam
pengelolaan data. SQL merupakan bahasa yang komprehensif untuk basis data,
19
sehingga dibuat standar untuk bahasa SQL oleh ANSI (American National
Standard Institute) dan ISO (International Standard Organization). Di dalamnya
terdapat perintah untuk pendefinisian data, melakukan query dan update terhadap
data. Perintah tersebut dikelompokkan dalam dua istilah: DDL (Data Definition
Language) untuk pendefinisian data dan DML (Data Manipulation Language)
untuk melakukan update dan query. Kebanyakan vendor dari RDBMS
menggunakan SQL dari ANSI/ISO, tetapi beberapa vendor RDBMS memasukkan
beberapa perintah tambahan sebagai fitur dari produknya. Di antaranya adalah
fitur untuk pemberian hak akses terhadap data ataupun untuk maintenance.
2.7.5. SQL*Plus
Dalam menerima masukan perintah SQL dari pengguna, vendor RDBMS
telah menyediakan library yang dapat digunakan oleh programmer agar program
yang dibuat dapat melakukan pengaksesan terhadap basis data. Selain itu, para
vendor memberikan pula program yang dapat menerima masukan bahasa SQL
yang kemudian dieksekusi oleh RDBMS. Oracle, sebagai salah satunya, telah
menyediakan program yang dinamakan SQL*Plus. SQL*Plus dapat digunakan
untuk melakukan eksekusi terhadap perintah SQL dari pengguna.
2.7.6. SQL vs SQL*Plus
SQL : Merupakan bahasa yang meliputi perintah-perintah untuk
menyimpan, menerima dan memelihara data dalam basis data.
SQL*Plus : Aplikasi yang dapat mengenali dan mengeksekusi perintah
SQL dan dapat menampilkan hasil dari perintah tersebut ke pengguna.

20
2.7.7. Data Definition Language (DDL)
DDL merupakan bagian dari perintah SQL untuk membuat, memodifikasi
atau menghapus struktur basis data Oracle.
Pembuatan tabel dalam suatu basis data dilakukan setelah melalui tahapan
membuat model data dan membuat desain data. Elemen-elemen yang harus ada
dalam pembuatan suatu tabel yaitu: nama tabel, nama kolom dan tipe data kolom.
21
BAB III
METODE PENELITIAN
3.1. Waktu dan Tempat Penelitian
Penelitian ini dilaksanakan pada bulan April 2009 sampai dengan bulan
Juli 2009. Penelitian ini dilaksanakan di PT Badak NGL Bontang.
3.1.1. Sejarah PT Badak NGL
Pemanfaatan gas alam di Bontang diawali dengan adanya perjanjian
kerjasama antara Pertamina dan HUFFCO Inc. pada bulan Agustus 1968 dalam
menyelidiki cadangan minyak dan gas alam. Pada akhir tahun 1971 berhasil
ditemukan cadangan gas alam yang cukup besar di lapangan Badak, Kalimantan
Timur.
Selanjutnya Pertamina dan Huffco Inc. berusaha menjual proyek kepada
konsumen, penyandang dana, dan mitra yang potensial di seluruh dunia. Upaya
tersebut akhirnya membuahkan hasil dengan disepakatinya kontrak penjualan
LNG terhadap lima perusahaan Jepang : Chubu Electric Co., Kansai Electric
PowerCo., Kyushu Electric PowerCo., Nippon steel Corp., dan Osaka Gas Co.Ltd,
pada 5 Desember 1973.
Kontrak pada tahun 1973 tersebut berisi komitmen dari para pembeli untuk
mengimpor LNG Indonesia selama 20 tahun, yang saat itu kilang LNG belum
selesai didirikan. PT Badak NGL sendiri dibentuk pada 26 November 1974 oleh
Pertamina, dengan Huffco Inc., dan JILCO (Japan Indonesia LNG Company)
dengan komposisi kepemilikan saham : Pertamina (55%), Huffco Inc. (30%) dan
22
JILCO (15%). Dalam perjanjian kerjasama disebutkan bahwa PT Badak NGL
tidak akan memperoleh keuntungan dari usaha ini, dan hanya berperan sebagai
salah satu jaringan di tengah rantai bisnis LNG. Dengan demikian PT Badak NGL
merupakan operating organization yang bersifat non profit.
Dua unit pengilangan pertama, Train A dan B selesai dibangun pada bulan
Maret 1977, dan mulai memproduksi LNG (tetes pertama) pada tanggal 5 Juli
3
1977 dengan kapasitas produksi 630 m /hr. Pada tanggal 1 Agustus 1977, kilang
LNG Bontang telah diresmikan. Seminggu kemudian dilakukan pengapalan

3
pertama dengan menggunakan tanker AQUARIUS dengan kapasitas 125.000 m .
Selain LNG ternyata dihasilkan pula produk sampingan, yaitu berupa LPG
(Liquified Petroleum Gas). Pembahasan untuk perluasan proyek ini diselesaikan
pada bulan Desember 1984 dan kontraknya ditandatangani dengan pembeli dari
Jepang pada tanggal 15 Juli 1986, disusul dengan Chineese Petroleum Co. pada
tahun 1987. Setahun kemudian, proyek LPG selesai dibangun dan produksi
pertama dihasilkan pada tanggal 15 Oktober 1988, dan diresmikan pada tanggal
28 November 1988.
Di tahun 1990 terjadi perubahan kepemilikan dan komposisi saham.
Produsen gas Total Indonesie masuk menjadi stakeholder baru. Dengan adanya
restrukturisasi Huffco Inc. menjadi VICO, kepemilikan saham pun berubah
menjadi : Pertamina (55%), VICO (20%), Total E&P Indonesie (15%) serta
JILCO (10%).
23
Dengan beroperasinya Train H telah menempatkan kilang LNG Badak
merupakan kilang LNG terbesar didunia dengan kapasitas 22.4 juta ton LNG/thn
serta menjadikan Indonesia sebagai pengekspor LNG terbesar di dunia.
Selain memproduksi LNG, PT. Badak NGL Bontang juga sempat
memproduksi LPG selama kurang lebih 16 tahun, yakni dari tahun 1988 sampai
dengan tahun 31 Desember 2005. Alasan tidak diproduksinya LPG ialah karena
pasokan gas dari producer yang semakin berkurang, sehingga seluruh gas diolah
menjadi LNG dalam rangka memenuhi kontrak jangka panjang yang telah
disepakati.
3.1.2. Lokasi PT Badak NGL
Lokasi PT. Badak NGL terletak di pantai timur Kalimantan, tepatnya di
daerah Bontang Selatan, sekitar 105 km sebelah timur laut kota Samarinda.
Sebelum kilang LNG dibangun, Bontang merupakan daerah yang terpencil dan
belum maju. Jumlah penduduknya masih sedikit dan sebagian besar bermata
pencarian sebagai nelayan.
Gambar 6. Lokasi PT. Badak NGL dan daerah-daerah Sumur Gas Alam
24
Storage and Loading

Plants
Utilities
Plants
Process Plants
Process Plants
Gambar 7. Tata Letak Pabrik
PT. Badak NGL dibagi menjadi 3 daerah / zona yang masing-masing
memiliki fungsi sendiri. Zona tersebut adalah:
• Zona 1
Zona 1 merupakan daerah tempat proses berlangsung. Zona ini terdiri dari
pabrik, utilities, dan storage and loading.
• Zona 2
Zona 2 merupakan daerah perkantoran yang berhubungan langsung dengan
proses dan sarana pendukung proses.
• Zona 3
Zona 3 merupakan daerah tempat kantor yang tidak berhubungan langsung
dengan proses, perumahan karyawan, sarana olah raga, dan fasilitas-fasilitas

25
pendukung perumahan yang lain. Kantor pusat PT. Badak NGL terletak di zona
ini.
Gambar 8. Pembagian Zona
Pabrik tempat pencairan LNG dibagi menjadi 2 modul. Modul I terdiri dari
train A, B, C, D, dan utilitas penunjangnya. Modul II terdiri dari train E, F, G, H,
dan utilitas penunjangnya.
3.1.3. Struktur Organisasi PT Badak NGL
PT Badak NGL dipimpin oleh Presiden Direktur yang berkedudukan di
Jakarta, yang bertanggung jawab kepada Share Holder. Sebagai pelaksana
kegiatan operasi kilang LNG Bontang adalah Direktur / General Manager yang
26
berkedudukan di Bontang untuk memimpin seluruh kegiatan di kilang LNG
Bontang, Kalimantan Timur, dan bertanggung jawab kepada Presiden Direktur.
General Manager membawahi tiga divisi dan empat departemen, yaitu:
• Manufacturing Division.
• Administration Division.
• Development Division.
• Finance and Accounting Department.
• Internal Audit Department.
• Safety Health & Enviroment Quality Department
• Strategic Planning department.
PT Badak Natural Gas Liquefaction

Organization Chart June 2007
Gambar 9. Bagan Struktur Organisasi PT Badak NGL

27
Safety Health and

Environment Quality
Department
Fire Safety Eng. & Safety

Protection Environmental
Section
Section Control Section
Gambar 10. Struktur Organisasi Safety Health and Environment Quality

Department
Bertanggungjawab atas keselamatan yang berhubungan dengan
pengoperasian, perencanaan, pengawasan dan pemeliharaan kilang, serta
keselamatan karyawan.
Department ini terdiri dari tiga seksi yaitu:
• Fire Protection Section.

• Safety Eng. & Environmental Control Section.
• Safety Section.
3.2. Metode Pengumpulan Data
Dalam penulisan skripsi ini penulis menggunakan beberapa metode
penelitian sebagai berikut:
3.2.1. Studi Literatur
Dalam penelitian ini penulis mengumpulkan dan mempelajari berbagai
macam literatur atau sumber-sumber referensi yang berkaitan erat dengan teori-
teori penunjang penelitian. Hal ini dilakukan agar dari tahap penelitian hingga
penulisan tidak menyimpang dari Rumusan Masalah dan Batasan Masalah.

28
3.2.2. Wawancara
Wawancara dilakukan kepada pihak-pihak yang bersangkutan yaitu di
Departemen Safety Health and Environment Quality PT Badak NGL Bontang.
3.2.3. Internet
Dalam pengumpulan bahan penulisan, literatur dan referensi, penulis juga
menggunakan internet sebagai penunjang penulisan penelitian ini.
3.3. Metode Pengembangan Sistem
3.3.1 Teknik Analisis
Teknik analisis merupakan teknik penguraian dari suatu sistem informasi
yang utuh kedalam bagian komponen-komponen dengan maksud untuk
mengidentifikasikan dan mengevaluasi permasalahan-permasalahan, kesempatan-
kesempatan, hambatan-hambatan yang terjadi dan kebutuhan yang diharapkan
sehingga dapat diusulkan perbaikan-perbaikannya. Teknik analisis yang
digunakan dalam penelitian ini mencakup:
3.3.1.1. Analisis Data
Analisis data merupakan identifikasi permasalahan melalui informasi atau
data yang dihasilkan dari suatu proses tertentu yang ditampilkan untuk
menghasilkan kesimpulan-kesimpulan berdasarkan tujuan untuk membangun
sistem, metode pengumpulan data, dan desain sistem yang dirancang. Seluruh data
yang diperoleh dari hasil penelitian dikumpulkan dan diproses agar dapat
digunakan dalam sistem dan dalam pengembangan sistem nantinya.
3.3.1.2. Analisis Kebutuhan
Analisis kebutuhan merupakan pemilihan sumber daya yang digunakan
pada software, hardware, brainware yang akan dipakai sebagai sarana yang
29
digunakan untuk perancangan dan berjalannya sistem nantinya. Menurut Hartono
(2001), dalam menganalisis kebutuhan sistem, yang harus diperhatikan adalah
keandalan (reability) untuk menunjukkan seberapa besar sistem dapat diandalkan
dalam melakukan suatu proses, ketersediaan (availability) yang berarti sistem
mudah diakses oleh user, installition schedule yang berarti dapat mendesain
sistem yang terbaik dalam batas waktu yang dibutuhkan, keluwesan (flexibility)
untuk menunjukkan bahwa sistem mudah beradaptasi, umur yang diharapkan dan
potensi pertumbuhan (life expectancy and growth potential) dan yang terakhir
adalah kemudahan dipelihara (maintainability). Spesifikasi kebutuhan sistem yang
dibuat antara lain:
3.3.1.2.1. Software
Menganalisis kebutuhan perangkat lunak yang akan dipakai ketika
membangun sistem. Software yang digunakan dalam penelitian ini adalah:
1) Sistem Operasi yang digunakan adalah Windows XP Service Pack 2.
2) Bahasa Pemrograman AJAX (Java versi 1.4) dalam mengembangkan Sistem
Informasi SHEQ.
3) Application Server adalah Apache Tomcat 5.5.1 Server.
4) Menggunakan Database Oracle versi 11.0.0.
Pada saat penerapan SHEQ-IS di PT Badak menggunakan komputer
dengan spesifikasi dibawah ini:
1) Sistem Operasi yang digunakan adalah Windows IBM AIX 5.2
2) Bahasa Pemrograman AJAX (Java versi 1.4)
3) Application Server : IBM Websphere 5.1
4) Menggunakan Database Oracle versi 9.2.0

30
3.3.1.2.2. Hardware
Menganalisis kebutuhan perangkat keras yang akan dimanfaatkan untuk
membangun sistem. Spesifikasi komputer yang direkomendasikan untuk
menjalankan aplikasi program ini adalah komputer yang minimal, sebagai berikut:
1) Prosesor minimal Intel Pentium IV 2.00 Ghz atau lebih
2) RAM minimal 1 Gigabyte
3) Resolusi screen minimal 1024 x 768 pixel
4) Hardisk minimal 160 Gigabyte
Di PT Badak NGL digunakan Server IBM.
3.3.2 Desain Sistem
Sistem yang sedang berjalan sampai saat ini dapat digambarkan sebagai
berikut:
Gambar 11. Sistem yang sedang berjalan sampai saat ini
Sedangkan dengan Flowchart dapat digambarkan sebagai berikut:

31
System i s able to
be expanded to
Event Registration Occ. Health & Industrial Hygi ene Ri sk Assesment SHE-Q Employee CSMS accomodate other
sub systems.
Measurement Sub Systems
Measurement
[Evaluation not needed]
[Evaluation needed]
Re-evaluation Evaluation
[Rej ected]
[Approved]
Safety Performance Indicator
Gambar 12. Flowchart Sistem Informasi SHEQ yang sedang berjalan
Desain sistem yang baru bertujuan untuk memberikan gambaran tentang
sistem yang ada yang akan dibuat dengan menggunakan desain-desain sistem
yang antara lain:
3.3.2.1. Flow Of Document
Flow Of Document digunakan untuk memodelkan masukan, keluaran,
proses maupun transaksi dengan menggunakan simbol Flowchart.
Alur Dokumen yang sedang berjalan dapat digambarkan sebagai berikut:

32
Karyawan / Kontraktor /
Administrasi SHEQ Manajemen / Public
Lain-Lain
Kejadian yang berhubungan

Data laporan Melihat chart dan
dengan SHEQ, kemudian
diinput tabel yang berisi
buat laporan
kejadian PT. Badak
setiap saat
Kejadian berhubungan
Indikator
dengan SHEQ
Leading
atau lagging
Measurement
SHEQ
Gambar 13. Flow of document dari SHEQ-IS yang sedang berjalan
SHEQ-IS yang diusulkan oleh peneliti dapat digambarkan sebagai berikut:
Karyawan / Kontraktor /
Administrasi SHEQ Manajemen / Public
Lain-Lain
Ada kejadian yang

berhubungan SHEQ Indikator Melihat chart dan
Leading tabel yang berisi
atau lagging kejadian PT. Badak
setiap saat
Input, Edit dan
Delete kejadian
pada Event Form
Measurement
SHEQ
Gambar 14. Flow of document dari SHEQ-IS yang diusulkan

33
3.3.2.2. Diagram Context

Diagram Conteks adalah diagram yang terdiri dari suatu proses dan
menggambarkan ruang lingkup sistem.
1
Karyawan Chart
Data kejadian Manajemen
Kontraktor Tabel kejadian Publik
Sistem Informasi
Lain Lain
SHEQ
Gambar 15. Diagram Context SHEQ-IS
Gambar tersebut diatas menunjukkan bahwa dari adanya data kejadian oleh
Karyawan/Kontraktor/Lain-Lain dimasukkan ke Sistem Informasi SHEQ, hasilnya
berupa Chart dan Tabel Kejadian yang setiap saat dapat dilihat oleh
Manajemen/Publik.
3.3.2.3. Data Flow Diagram
Data Flow Diagram digunakan untuk menggambarkan aliran data melalui
serangkaian proses yang saling berhubungan.
Dari Context Diagram di atas dapat di gambarkan lebih lanjut yaitu Data
Flow Diagram Level 1 sesuai dengan penambahan menu yang baru yaitu Event
Form pada Menu Event Registration.

34
3 M_Company_Section
5 M_Employee_Position
Info
M_Company_ 7 M_Event_Type
2
Department Info
M_Company_ Info
4 6 M_Person_Group
Employee
Info 1 Info
Info Event Form pada
Masukkan Ubah dan Hapus data kejadian Menu Event
Karyawan Tabel kejadian
Info Registration
Kontraktor Manajemen
Lain Lain Publik
1 Measurement Data belum ada indikator

Input
Info
2
M_Location_
8 Input Indikator Leading Lagging
Area
Info Info Measurement
M_SPI_Leading
9 3
_Indicator
Ubah Safety Tabel kejadian berindikator
M_SPI_Lagging_ Info Performance
10
Indicator Indicator (SPI) Chart untuk Leading & Lagging Indicator
Ubah
Gambar 16. DFD Level 1 Sistem Informasi SHEQ penambahan pada Event Form
35
3.3.2.4. Entity Relational Diagram

M_COMPANY_SECTION
MEASUREMENT *Section_id (varchar2 (6))
Name (varchar2 (255))
*Measurement_code (varchar2 (20)) Department_ID (varchar2 (6))
Event_type_id (varchar2 (10))
Event_date (date)
Badge (varchar2 (6)) M_COMPANY_DEPARTMENT
Reported_date (date)
Leading_indicator_id (number (6)) *Department_id (varchar2 (6))
Lagging_indicator_id (number (6)) Name (varchar2 (255))
Location_department_id (varchar2 (6))
Location_section_id (varchar2 (6)) M_COMPANY_EMPLOYEE
Location_area_id (number (4))
Location_scene (varchar2 (255))
*Badge (varchar2 (6))
Case_short_description (varchar2 (2000))
Department_ID (varchar2 (6))
Evaluation_need (number (1))
Section_ID (varchar2 (6))
Evaluation_status (varchar2 (12))
Full_name (varhar2 (4000))
Last_modified_date (date)
Birth_date (date)
Last_modified_by (varchar2 (255))
Email (varchar2 (255))
Last_status (varchar2 (50))
Position_ID (varchar2 (6))
Checkout_by (varchar2 (255))
Position_title (varchar2 (255))
Checkout_date (date)
Investigation_required (number)
Case_long_description (varchar2 (4000)) M_EMPLOYEE_POSITION
Action_taken (varchar2 (4000))
Recommendation (varchar2 (4000)) *Position_id (varchar2 (6))
Creatby (varchar2 (255)) Name (varchar2 (400))
Createdate (date) Position_superid (varchar2 (6))
Attnbadak (number) Group_id (varchar2 (50))
Attncontractor (number)
Trainninghours (number)
Sumoftraining (number) M_PERSON_GROUP
*Person_group_id (varchar2 (6))

Person_group_grouping (varchar2 (255))
M_LOCATION_AREA Name (varchar2 (50))
* Location_area_id (number (4))

Name (varchar2 (255)) M_EVENT_TYPE
*Event_type_id (varchar2 (10))

M_SPI_LEADING_INDICATOR
Event_type_parent_id (varchar2 (10))
Related_leading_indicator (number (6))
*Leading_indicator_id (number (6)) Related_lagging_indicator (number (6))
Name (varchar2 (255)) Name (varchar2 (255))
Short_description (varchar2 (255))
Description (varchar2 (4000))
Evaluation_needed (number (1)) M_SPI_LAGGING_INDICATOR
Is_active (number (1))
*Lagging_indicator_id (number (6))
Name (varchar2 (255))
Short_description (varchar2 (255))
Description (varchar2 (4000))
Evaluation_needed (number (1))
Is_active (number (1))
Gambar 17. ERD Sistem Informasi SHEQ

36
BAB IV
ANALISIS DAN IMPLEMENTASI SISTEM
4.1. Analisis
4.1.1. Form Login
Gambar 18. Form Login
Halaman pertama adalah halaman login. Pada halaman ini akan melakukan
proses login untuk dapat mengakses SHE-Q IS. Masukkan Username dan
Password pada textbox yang tersedia, lalu tekan tombol login untuk melakukan
proses login. Form ini masih tetap digunakan atau tidak ada perubahan sama
sekali.
Pada bagian bawah halaman ini terdapat 3 indikator. Indikator tersebut
adalah :
37
• Safety Performance Indicator, yaitu indikator yang menunjukkan performa
Safety performance.
• Leading Indicator, yaitu indikator yang menunjukkan nilai indikator Leading
untuk bulan berjalan.
• Lagging Indicator, yaitu indikator yang menunjukkan nilai indikator Leading
untuk bulan berjalan.
4.1.2. Form Home
Halaman home adalah halaman pertama yang akan anda temui setelah
berhasil melewati proses login. Pada halaman ini terdapat rekapitulasi event
berdasarkan tipenya dan measurement berdasarkan status approval-nya. Tiap-tiap
entri rekap merupakan link menuju halaman lain. Klik pada salah satu link untuk
membuka halaman yang anda inginkan.
Gambar 19. Form Home

38
4.1.3. Form Event Registration lama dan Event Form desain baru
Sistem Informasi SHEQ sampai saat ini diterapkan adalah sebagai berikut:
Gambar 20. Form Event Registration
Halaman Event List menampilkan daftar event yang telah dilaporkan ke
SHE-Q IS. Pada halaman ini akan ditampilkan daftar Event serta detail event yang
telah dimasukkan oleh Administrator SHEQ dari laporan Karyawan/Kontraktor/
lainnya.
Detail event akan bergantung terhadap event yang dipilih. Event yang
berbeda akan menampilkan detail yang berbeda. Detail event terdiri dari tiga,
yaitu General, Related Person, dan SHE-Q Reference; atau dapat dilihat seperti
gambar dibawah ini.

39
Gambar 20. Form detail Event Registration
Sedangkan usulan akan ada penambahan form, yaitu Event Form sehingga
tidak lagi Karyawan/Kontraktor atau Lain-Lain melaporkan dalam bentuk
Formulir yang telah disediakan, tetapi oleh langsung Karyawan/Kontraktor/
lainnya memasukkan data ke Server. Kemudian Administrator SHEQ memeriksa
data sebagai Data Feedback untuk menentukan apakah data/kejadian tersebut
berhubungan dengan SHEQ atau tidak, bila berhubungan akan ditindaklanjuti
untuk dimasukkan dalam kategori Leading Indicator atau Lagging Indicator.
Event Form yang peneliti tambahkan dimasukkan dalam menu Event Registration,
seperti gambar dibawah ini:
Gambar 21. Form Event Registration

40
Sehingga menu Event Registration menjadi tiga bagian seperti gambar
diatas, Event Form yang diusulkan tersebut disesuaikan dengan kebutuhan atau
dapat dilihat dalam desain gambar dibawah ini:
Gambar 22. Event Form yang diusulkan
4.1.4. Form Measurement
Form yang dari Sistem Informasi SHEQ yang lama dapat digunakan lagi
atau tanpa perubahan. Prosedur input selanjutnya adalah mencari data yang
41
berhubungan dengan Safety, Health, Environment and Quality untuk ditindak
lanjuti, form tersebut adalah Form Measurment untuk menentukan Leading
Indicator atau Lagging Indicator. Menu Measurement terdiri dari tiga yaitu:
Measurement List, Recomm.Followup dan Recomm.Followup Admin; masih
dibutuhkan Sistem Informasi SHEQ dapat digambarkan sebagai berikut:
Gambar 23. Menu Measurement
Gambar 24. Form Measurement List yang masih dapat digunakan

42
4.1.5. Form SPI
Hasil dari data feedback Measurement tersebut dapat dilihat menu
selanjutnya yaitu Menu SPI (Safety Performance Indicator), Form SPI dapat
dilihat pada gambar dibawah ini:
Gambar 25. Form tabel dan Safety Performance Indicator yang sudah
terintegrasi dengan Event Form yang baru
Dengan adanya Event Form yang baru, sangat membantu tugas dari
Administrator SHEQ karena Karyawan/Kontraktor/Lainnya yang mempunyai hak
akses untuk memasukkan data pada Event Form yang peneliti buat seperti gambar
diatas dengan tampilan tabel indikator. Sedangkan Administrator SHEQ hanya
mengevaluasi data yang berhubungan dengan SHEQ.
Dapat pula dilihat chart, Leading Indicator dan Lagging Indicator pada
Form Home dari hasil masukkan data pada Event Form yang telah peneliti desain
dan diintegrasikan dengan SHEQ-IS yang saat ini digunakan.

43
Gambar 26. Form Home
4.2. Implementasi
Dalam melakukan implementasi pada sistem Web Server dibutuhkan
beberapa syarat, yaitu :
• Development Platform : Java 1.4.2
• Operating System : IBM AIX 5.2
• Application Server : IBM Websphere Community Edition
• Database Server : Oracle Database 9.2.0
4.2.1. Instalasi IBM WebSphere Community Edition
Execute file binary Websphere community edition (ekstensi .exe untuk OS
Windows, extensi .bin atau .sh untuk OS unix/linux). Jika komputer kita berbasis
Graphic User Interface seperti gambar berikut tidak muncul maka anda harus
mengikuti langkah-langkah instalasi tanpa menggunakan GUI.

44
Gambar 27. Proses instalasi IBM WebSphere Community Edition

45
4.2.2. Instalasi Aplikasi SHEQ-IS
Jika melakukan instalasi untuk meng-update atau memindahkan aplikasi
SHEQ-IS, pastikan kita telah mem-backup file-file yang telah diupload kedalam
aplikasi SHEQ-IS sebelum menghapus aplikasi SHEQ-IS yang lama.
Buka browser lalu isi URL dengan http://<server>:<port>/console untuk
menuju menu admin console websphere. Kemudian Masukkkan data sebagai
berikut : username : system password : manager.
Gambar 28. Masukkan username dan password login pada IBM WebSphere
Community Edition
Setelah masuk kedalam menu utama pilihlah link deploy new, seperti
gambar dibawah ini. Pada menu instalasi aplikasi, klik tombol browse pada
archieve lalu pilih aplikasi yang akan diinstal, lalu klik install.
46
Gambar 29. Proses instalasi IBM WebSphere Community Edition
Berikut ini adalah tampilan saat aplikasi berhasil diinstall
Gambar 30. Instalasi IBM WebSphere Community Edition berhasil
4.2.3. Konfigurasi Aplikasi SHEQ-IS
Terdapat 6 file konfigurasi di SHE-Q IS. File-file tersebut harus dirubah
sesuai dengan lingkungan SHE-Q IS. Berikut adalah langkah-langkah konfigurasi
tersebut :
1. hibernate.cfg.xml
File ini berisikan konfigurasi koneksi database SHEQ-IS beserta autentikasinya.
Lokasi file terdapat di <application-dir>/sheqis/WEB-INF/classes
• Menggunakan teks editor, buka file hibernate.cfg.xml

47
• Edit pada bagian connection.url, connection.username dan
connection.password sehingga sesuai dengan setting pada server anda.
<property name="connection.url">jdbc:oracle:thin:@10.10.1.24:1521:ELLRPL</property>
<property name="connection.username">sheq</property>
<property name="connection.password">sheq</property>
2. config.properties
File ini berisikan konfigurasi perilaku aplikasi SHEQ-IS. Lokasi file
terdapat di <application-dir>/sheqis/WEB-INF/classes/com/badaklng/sheqis/
resources.
• Menggunakan teks editor, buka file config.properties
• Pada file ini terdapat beberapa item konfigurasi. Berikut adalah penjelasan tiap
item tersebut :
defaultPageSize=10 Konfigurasi untuk jumlah item yang ditmapilkan

per-page pada List
defaultUploadPath= Path default untuk file-file yang di-upload
temporaryPath= Path default untuk temporary
jasperReportsRelativePath=/modules/r Path untuk menyimpan file jrxml, tidak

eporting/reports disarankan untuk dirubah
memberHomeRenderInterval=30000 Konfigurasi interval refresh untuk recaps pada

halaman home user
mail.smtp.host = localhost Nama Host/IP Mail Server
mail.sender = sheq@badaklng.co.id Alamat email aplikasi SHE-Q IS. Alalamt email

ini digunakan sebagai alamat pengirim untuk
email konfirmasi.
industrialHygieneEventTypeId = 10 Konfigurasi id untuk industrial hygiene, tidak

disarankan untuk dirubah
trafficaccident.fatalInjuryType = identifikasi ID untuk fatal injury type

TIT.003
workaccident.fatalNatureOfInjury = identifikasi ID untuk fatal nature injury type

NOI.004
48
3. messages_en.properties
File ini berisi kumpulan label atau message yang ditampilkan pada aplikasi
SHE-Q IS. Silakan lakukan perubahan yang anda inginkan. Lokasi file terdapat di
<application-dir>/sheqis/WEB-INF/classes/com/badaklng/sheqis/resources.
4. web.xml
File ini berisikan konfigurasi perilaku aplikasi SHEQ-IS. Lokasi file
terdapat di <application-dir>/sheqis/WEB-INF/
- Menggunakan teks editor, buka file web.xml
- Edit pada bagian com.icesoft.faces.uploadMaxFileSize untuk menentukan
besar maksimum file yang dapat di-upload.
<context-param>
<param-name>com.icesoft.faces.uploadMaxFileSize</param-name>
<param-value>50000000</param-value>
</context-param>
- Edit pada bagian dibawah ini untuk menentukan lama waktu idle pada
halaman SHE-Q IS .
<session-config>
<session-timeout>
600
</session-timeout>
</session-config>
5. bootstrap.properties
File ini berisikan konfigurasi repository aplikasi SHEQ-IS. Lokasi file
terdapat di <application-dir>/sheqis/WEB-INF/
- Menggunakan teks editor, buka file bootstrap.properties
- Edit pada bagian repository.home untuk menentukan lokasi repository yang
akan digunakan.
repository.home=sheqis/repository
repository.name=sheqis.repository
49
6. applicationContext.xml
File ini berisikan konfigurasi database untuk login. Lokasi file terdapat di
<application-dir>/sheqis/WEB-INF/
- Menggunakan teks editor, buka file applicationContext.xml
- Edit pada bagian url, username dan password sehingga sesuai dengan setting
pada server anda.
<property name="url"><value>jdbc:oracle:thin:@10.10.1.24:1521:ELLRPL</value></property>
<property name="username"><value>sheq</value></property>
<property name="password"><value>penamatik</value></property>
4.2.4. Konfigurasi Database
Berikut langkah-langkah yang harus dilakukan untuk menginstal database
SHE-Q IS di server, yaitu:
1. Buka command prompt / console
2. Create user/schema untuk menyimpan objek-objek database yang diperlukan
SHE-Q IS, dengan cara:
create user <nama user> identified by <password>
Contoh :
create user sheq identified by sheqpassword
3. Import object-object database dari file dmp yang disediakan dengan cara:
imp <url file.dmp> userid=<nama user>/<password>
Contoh :
imp sheq_database.dmp userid=shequsername/sheqpassword
50
4. Install store procedure dan trigger yang telah disiapkan.
Jalankan store procedure sesuai urutan sebagai berikut :
• Store procedure SHEQ_SYNC_DEPARTEMENT,
• Store procedure SHEQ_SYNC_SECTION,
• Store procedure SHEQ_SYNC_EMPLOYEE_POSITION,
• Store procedure SHEQ_SYNC_EMPLOYEE,
• Store procedure SHEQ_SYNC_MEDICAL_CHECKUP,
• Store procedure SHEQ_SYNC_STOP.

51
BAB IV
PENUTUP
4.1. Kesimpulan
Dari pembahasan Analisis dan Implementasi Sistem, dapat disimpulkan sebagai
berikut:
4.1.1. Sistem yang lama dapat membebani pekerjaan Administrator SHEQ untuk
melakukan masukkan, mengubah dan menghapus data yang berhubungan
dengan Safety, Health, Environment dan Quality. Dengan adanya Event
Form pada menu Event Registration Karyawan/Kontraktor/Lainnya dapat
langsung memasukkan data, sehingga Administrator hanya mengevaluasi
data yang berhubungan dengan SHEQ.
4.1.2. Event Form yang dibuat peneliti sudah dapat terintegrasi dengan Sistem
Informasi SHEQ.
4.2. Saran
4.2.1. Formulir Event Registration yang berisi laporan kejadian tidak perlu lagi
diadakan, karena Karyawan/Kontraktor/Lainnya yang mempunyai hak
akses memanipulasi data sudah tidak memerlukan lagi. Hal lainnya karena
formulir Event Registration yang diserahkan ke Administrator SHEQ
banyak laporan yang tidak ada hubungan dengan SHEQ.
4.2.2. Desain sistem untuk Event Form segera dapat digunakan, karena sesuai
dengan kebutuhan Karyawan/Kontraktor/Lainnya apalagi karyawan
tersebut sedang melakukan tugas luar daerah, tetapi dapat memasukkan
dan memanipulasi datanya.

52
Daftar Pustaka
Business Requirement Analysis PT. Pena Telematics Indonesia
Software Requirement Specification PT. Pena Telematics Indonesia
Prasetyo Ambang Utomo, ST,2008, Membangun Aplikasi PHP + AJAX tanpa

mengenal Script, Yogyakarta.
Betha Sidik, Ir. Husni Iskandar Pohan, Ir., M.Eng., Pemrograman Web Dengan
HTML, Informatika Bandung
Andi Sunyoto, M.Kom, 2008, Membangun Web Dengan Teknologi

Asynchronous Java Script dan XML, Yogyakarta
53
LAMPIRAN-LAMPIRAN
54
Lampiran 1. Listing program Form Home dan menu utama
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:jsp="http://java.sun.com/JSP/Page"
xmlns:c="http://java.sun.com/jstl/core"
xmlns:ice="http://www.icesoft.com/icefaces/component"
xmlns:d="http://www.dycode.com/jsf"
xmlns:acegijsf="http://sourceforge.net/projects/jsf-comp/acegijsf"
xmlns:fn="http://java.sun.com/jsp/jstl/functions">
<ice:outputDeclaration doctypeRoot="HTML"
doctypePublic="-//W3C//DTD HTML 4.01 Transitional//EN"
doctypeSystem="http://www.w3.org/TR/html4/loose.dtd"/>
<ui:composition template="/WEB-INF/template/member.jspx">
<ui:define name="title">Member Home</ui:define>
<ui:define name="content">
<ice:form id="memberForm">
<div id="memberHomeHeader">
<div style="float: left; margin: 0px 5px 0px 5px; width: 35%;">
<ice:outputText value="#{msgs['general.welcome']}"/>
<ice:outputText value="#{user.userDetails.fullName}" styleClass="usernameLabel"/>
(<ice:outputText value=" #{user.roles}"/>)<br/>
<ice:outputLabel value="Server Time: "/>
<ice:outputText value="#{memberHomeController.serverTime}">
<f:convertDateTime type="both" timeZone="#{msgs['general.timezone']}"/>
</ice:outputText>
</div>
<div style="float: left; margin: 0px 5px 0px 5px; width: 10%;">
</div>
<div style="vertical-align: middle; float: right; margin: 0px 5px 0px 5px; width: 50%;
text-align: right;">
<ice:outputConnectionStatus activeLabel="Loading"
disconnectedLabel="Disconnected"
inactiveLabel="In Active" style="vertical-align:top"/>
</div>
</div>
<table width="100%" style="padding-top:10px;margin-left:-3px;">

<tr>
<td>
<ice:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo">
<f:facet name="header">
<ice:panelGroup styleClass="expandableStateIndicator" >
<ice:outputText value="Filter"/>
</ice:panelGroup>
</f:facet>
<ice:panelGroup style="padding-top:5px;padding-bottom:5px;">
<ice:panelGrid columns="3" width="100%" columnClasses="view_fieldLabel,
view_fieldValue">
<ice:outputLabel value="Year : " for="measurementcodeFilterInputText"/>
<ice:inputText id="yearFilter" size="10"
value="#{memberHomeController.filterYear}"/>
<ice:panelGroup>
<ice:commandButton style="vertical-align: middle;" accesskey="F"
image="/resources/images/icon/icon_search.gif"
55
actionListener="#{memberHomeController.handleFilterOKButton}"></ice:commandButton>
<ice:outputLabel value="#{msgs['general.filterButtonText']}" />
</ice:panelGroup>
</ice:panelGrid>
</ice:panelGroup>
</ice:panelCollapsible>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td width="50%" valign="top">
<ice:panelCollapsible style="width:100%;" expanded="true"
styleClass="pnlClpsblDemo">
<ice:outputText value="#{msgs['member.index.recapsText']}"/>
</ice:panelGroup>
</f:facet>
<ul class="shortcutLink">
<c:if test="${fn:length(memberHomeController.eventRecapsList) gt 0}">
<table width="100%">
<tr>
<td width="50%">
<ice:outputText value="Events" style="font-weight:bold;width:50%"/>
</td>
<td width="15%" align="center">
<ice:outputText value="Event Dept." style="font-weight:bold;width:15%"/>
</td>
<ice:outputText value="Event Own" style="font-weight:bold;width:15%"/>
</td>
<ice:outputText value="Events All Dept" style="font-
weight:bold;width:15%"/>
</td>
</tr>
</table>
</c:if>
<ice:panelSeries value="#{memberHomeController.eventRecapsList}"
var="recap">
<li class="shortcutLink">
<div style="width: 50%; float: left; text-align: left;">
<c:if test="${recap.detailPageUrl != ''}">
<ice:outputLink value="#{recap.detailPageUrl}">
<ice:outputText value="#{recap.text}"/>
</ice:outputLink>
</c:if>
<c:if test="${recap.detailPageUrl == ''}">
</c:if>
</div>
<div style="width: 15%; float: left; text-align: right;">

<ice:outputText value="#{recap.valueDept}"/>
</div>
<ice:outputText value="#{recap.valueOwn}"/>
56
</div>

<ice:outputText value="#{recap.value}"/>
</div>
</li>
</ice:panelSeries>
</ul>
<ul class="shortcutLink">
<c:if test="${fn:length(memberHomeController.measurementRecapsList) gt
0}">
<ice:outputText value="Measurements" style="font-weight:bold;"/>
</c:if>
<ice:panelSeries value="#{memberHomeController.measurementRecapsList}"
var="recap">
<li class="shortcutLink">
<div style="width: 50%; float: left; text-align: left;">
<c:if test="${recap.detailPageUrl != ''}">
<ice:outputLink value="#{recap.detailPageUrl}">
</ice:outputLink>
</c:if>
<c:if test="${recap.detailPageUrl == ''}">
</c:if>
</div>
<ice:outputText value="#{recap.valueDept}"/>
</div>
<ice:outputText value="#{recap.valueOwn}"/>
</div>

<ice:outputText value="#{recap.value}"/>
</div>
</li>
</ice:panelSeries>
</ul>
</ice:panelGroup>
</td>
</td>

</td>
57
</tr>
</table>
<ice:commandButton id="cmdRefresh" value="Refresh" visible="false"

action="#{memberHomeController.refreshPage}"/>
<ice:outputText visible="false" id="refreshInterval"
value="#{memberHomeController.renderInterval}"/>
</ice:form>
<script language="javascript">
function customRefresh(){
if (document.all)
document.getElementById('memberForm:cmdRefresh').click();
};
var refreshInterval = document.getElementById('memberForm:refreshInterval').innerText;
//alert(refreshInterval);
window.setInterval(customRefresh, refreshInterval);
</script>
</ui:define>
</ui:composition>
</html>
58
Lampiran 2. Listing program EventForm.JSPX
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
xmlns:d="http://www.dycode.com/jsf">
<ui:define name="browserTitle">Event Registration Form</ui:define>
<ui:define name="title">
<ice:form>
<ice:outputText value="Event Registration #{eventRegistrationFormController.eventType.name}
Form"/>
</ice:form>
</ui:define>
<ice:form id="eventRegForm">
<div>
<ice:messages title="Validation Error" layout="table" styleClass="border:1px solid #cccccc"
errorClass="errorMsg"/>
</div>
<table border="0" cellpadding="0" cellspacing="0" class="toolbar">
<tr>
<td valign="left" style="padding:1px;">
<ice:panelGroup>
<div class="toolbar_button" onmouseout="this.className='toolbar_button';"
onmouseover="this.className='toolbar_button_hover';">
<ice:commandButton image="/resources/images/icon/icon_add.gif" style="vertical-
align: middle;" accesskey="S"
title="#{msgs['general.saveButtonText']}" id="eventFormSaveButton"
actionListener="#{eventRegistrationFormController.handleSaveButtonListener}" type="submit"/>
<ice:outputLabel value="#{msgs['general.saveButtonText']}"
for="eventFormSaveButton"/>
</div>
</ice:panelGroup>

<ice:panelGroup>
59

<ice:commandButton image="/resources/images/icon/icon_cancel.gif" style="vertical-
align: middle;"
title="#{msgs['eventreg.eventform.general.button.cancelLabel']}"
id="eventFormCancelButton" action="eventRegistrationList" immediate="true"
actionListener="#{eventRegistrationFormController.handleCancelButtonListener}"/>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.button.cancelLabel']}"
for="eventFormCancelButton"/>
</div>
</ice:panelGroup>
</td>
</tr>
</table>

<ice:panelGroup styleClass="expandableStateIndicator">
<ice:outputText value="#{msgs['eventreg.eventform.generalLabel']}"/>
</ice:panelGroup>
</f:facet>
<ice:panelGroup style="padding: 5px;">

<ice:panelGrid columns="2" style="width:100%"
columnClasses="form_fieldLabel,form_fieldValue">
<ice:outputLabel value="#{msgs['eventreg.eventform.general.sheqcodeLabel']}"
for="sheqcode"/>
<ice:panelGroup>
<ice:inputText id="sheqcode" readonly="true"
value="#{eventRegistrationFormController.eventRegForm.measurementCode}"/>
<ice:message for="sheqcode" errorClass="errorMsg"/>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.reportedDateLabel']}"
for="reportedDate"/>
<ice:panelGroup>
<ice:inputText id="reportedDate" readonly="true"
value="#{eventRegistrationFormController.eventRegForm.reportedDate}">
<f:convertDateTime pattern="dd/MM/yyyy HH:mm" timeZone="Asia/Jakarta"/>
</ice:inputText>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.eventDateLabel']}
(mm/dd/yyyy)" for="eventDate"/>
<ice:panelGrid columns="2" cellspacing="0"
columnClasses="form_fieldLabel,form_fieldValue" width="100%">
<ice:panelGrid columns="2" cellspacing="0">
<ice:selectInputDate id="eventDate"
value="#{eventRegistrationFormController.eventRegForm.eventDate}" renderAsPopup="true"
required="true" validator="#{eventRegistrationFormController.validateEventDate}"/>
<ice:message id="eventDateMessage" for="eventDate" errorClass="errorMsg"/>
</ice:panelGrid>
<ice:panelGrid columns="2" cellspacing="0">

<ice:outputLabel value="#{msgs['eventreg.eventform.general.eventTimeLabel']}
(hh:mm)" for="eventTime"/>
<ice:panelGroup>
<ice:inputText id="eventTime"
value="#{eventRegistrationFormController.eventTime}" size="5" maxlength="5">
<f:convertDateTime pattern="HH:mm" timeZone="Asia/Jakarta"/>
</ice:inputText>
60
<ice:message id="eventTimeMessage" for="eventTime" errorClass="errorMsg"/>

</ice:panelGroup>
</ice:panelGrid>
</ice:panelGrid>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.eventTypeLabel']}"
for="eventType"/>
<ice:panelGroup>
<ice:selectOneMenu id="eventType"
value="#{eventRegistrationFormController.eventType.eventTypeId}"
disabled="#{eventRegistrationFormController.editData}"
valueChangeListener="#{eventRegistrationFormController.handleChangeEventTypeListener}"
partialSubmit="true" required="true">
<f:selectItems value="#{masterDataController.eventTypeSelectItems}"/>
</ice:selectOneMenu>
<ice:message for="eventType" errorClass="errorMsg"/>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.subEventTypeLabel']}"
for="subEventType"/>
<ice:selectOneMenu id="subEventType"
value="#{eventRegistrationFormController.subEventType.eventTypeId}"
disabled="#{eventRegistrationFormController.editData}" >
<f:selectItems value="#{eventRegistrationFormController.eventSubTypeSelectItems}"/>
<ice:outputLabel value="#{msgs['eventreg.eventform.tab.general.exactLocationLabel']}"
for="exactLocation"/>
<ice:panelGroup>
<ice:inputTextarea id="exactLocation" cols="80" rows="5"
value="#{eventRegistrationFormController.eventRegForm.locationScene}" required="true"
partialSubmit="true"/>
<ice:message errorClass="errorMsg" for="exactLocation"/>
</ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventform.tab.general.areaLabel']}" for="area"/>
<ice:panelGroup>
<ice:selectOneMenu id="area"
value="#{eventRegistrationFormController.eventRegForm.locationArea.locationAreaId}">
<f:selectItems
value="#{masterDataController.areaSelectItems}"/>
<ice:message errorClass="errorMsg" for="area"/>
</ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventform.tab.general.departmentLabel']}" for="detailDepartment"/>
<ice:panelGroup>
<ice:selectOneMenu id="#{msgs['departmentLocation']}"
valueChangeListener="#{eventRegistrationFormController.handleDepartmentChange}"
value="#{eventRegistrationFormController.eventRegForm.locationDepartment.departmentId}"
partialSubmit="true"
style="width:200px;">
<f:selectItems
value="#{masterDataController.departmentSelectItems}"/>
61

<ice:outputLabel
value="#{msgs['eventreg.eventform.tab.general.sectionLabel']}" for="detailSection"/>
<ice:selectOneMenu id="#{msgs['sectionLocation']}"
value="#{eventRegistrationFormController.eventRegForm.locationSection.sectionId}"
<f:selectItems
value="#{eventRegistrationFormController.locationSections}"/>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.shortDescriptionLabel']}"
for="shortDescription"/>
<ice:inputTextarea id="shortDescription" cols="80" rows="5"
value="#{eventRegistrationFormController.eventRegForm.caseShortDescription}"/>
</ice:panelGrid>


<fieldset>
<legend>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.reporter.reporterLabel']}"/>
</legend>
<ice:panelGrid columns="2" columnClasses="imageColumn">
<ice:graphicImage
url="#{fn:length(eventRegistrationFormController.reporterPersonForm.photoFilepath) eq 0 ?
'/resources/images/thumbnail/noimage.jpg' :
eventRegistrationFormController.reporterPersonForm.photoFilepath }"
styleClass="attachment_thumbnail"
title="#{eventRegistrationFormController.reporterPersonForm.fullName}"/>
<ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.reporterTypeLabel']}"/>
<ice:selectOneRadio id="reporterType"
value="#{eventRegistrationFormController.reporterPersonForm.reporterPersonType.personTypeId}"
valueChangeListener="#{eventRegistrationFormController.handleChangePersonTypeListener}"
partialSubmit="true" layout="table">
<f:selectItems value="#{masterDataController.personTypesSelectItems}"/>
</ice:selectOneRadio>
</ice:panelGrid>

columnClasses="form_fieldLabel,form_fieldValue"
rendered="#{!eventRegistrationFormController.isReporterUnknown}">
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.badgeNumberLabel']}"/>
<ice:panelGroup>
<ice:inputText id="badgeId"
value="#{eventRegistrationFormController.reporterPersonForm.reporterIdNo}" required="true"
partialSubmit="true" maxlength="6">
<f:validateLength minimum="6" maximum="6"/>
</ice:inputText>

<ice:commandButton id="reporterFindButton"
actionListener="#{eventRegistrationFormController.handleFindPersonButtonListener}"
62
value="#{msgs['eventreg.eventform.general.reporter.findButtonLabel']}" partialSubmit="true"
styleClass="buttonDefault"/>
<ice:message id="badgeIdMessage" for="badgeId" errorClass="errorMsg"/>
</ice:panelGroup>
</ice:panelGrid>

<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.fullNameLabel']}"/>
<ice:panelGroup>
<ice:inputText id="fullName" size="50" required="true"
value="#{eventRegistrationFormController.reporterPersonForm.fullName}"/>
<ice:message for="fullName" errorClass="errorMsg"/>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventform.general.reporter.titleLabel']}"/>
<ice:panelGroup>
<ice:inputText id="titleOccupation" size="50"
value="#{eventRegistrationFormController.reporterPersonForm.occupation}"/>
<ice:message for="titleOccupation" errorClass="errorMsg"/>
</ice:panelGroup>
</ice:panelGrid>
<ice:panelGrid columns="2"
rendered="#{eventRegistrationFormController.isReporterUnknown}"
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.departmentLabel']}"/>
<ice:panelGroup>
<ice:selectOneMenu id="#{msgs['departmentReporter']}"
value="#{eventRegistrationFormController.reporterPersonForm.companyDepartment.departmentId}"
valueChangeListener="#{eventRegistrationFormController.handleDepartmentChange}" partialSubmit="true"
<f:selectItems value="#{masterDataController.departmentSelectItems}"/>
<ice:message for="reporterDepartment" errorClass="errorMsg"/>
</ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.sectionLabel']}"/>
<ice:panelGroup>
<ice:selectOneMenu id="#{msgs['sectionReporter']}"
value="#{eventRegistrationFormController.reporterPersonForm.companySection.sectionId}"
<f:selectItems value="#{eventRegistrationFormController.reporterSections}"/>
<ice:message for="reporterSection" errorClass="errorMsg"/>
</ice:panelGroup>
</ice:panelGrid>
rendered="#{!eventRegistrationFormController.isReporterUnknown}"
columnClasses="view_fieldLabel,view_fieldValue">
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.departmentLabel']}"/>
<ice:outputText
value="#{eventRegistrationFormController.reporterPersonForm.companyDepartment.name eq null ?
63
msgs['general.noValueText'] :
eventRegistrationFormController.reporterPersonForm.companyDepartment.name}" />
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.sectionLabel']}"/>
<ice:outputText
value="#{eventRegistrationFormController.reporterPersonForm.companySection.name eq '' ?
msgs['general.noValueText'] :
eventRegistrationFormController.reporterPersonForm.companySection.name}"/>
</ice:panelGrid>

<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.companyLabel']}"/>
<ice:inputText id="company" value="PT Badak Employee" size="60" readonly="true"
rendered="#{eventRegistrationFormController.reporterPersonForm.reporterPersonType.personTypeId eq
'1'}"/>
<ice:inputText id="company"
value="#{eventRegistrationFormController.reporterPersonForm.contractor.name}" size="50"
readonly="true"
rendered="#{eventRegistrationFormController.reporterPersonForm.reporterPersonType.personTypeId !=
'1'}"/>
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.photoLabel']}"/>
<ice:panelGroup>
<ice:inputFile id="reporterUpload"
actionListener="#{eventRegistrationFormController.handleFileUploadListener}"
buttonClass="buttonDefault"/>
<ice:message for="reporterUpload" errorClass="errorMsg"/>
</ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.homeAddressLabel']}"/>
<ice:inputTextarea id="address" cols="80" rows="3"
value="#{eventRegistrationFormController.reporterPersonForm.address}"/>
<ice:outputLabel
value="#{msgs['eventreg.eventform.general.reporter.remarkLabel']}"/>
<ice:inputTextarea id="remark" cols="80" rows="3"
value="#{eventRegistrationFormController.reporterPersonForm.remark}"/>
</ice:panelGrid>
</ice:panelGroup>
</ice:panelGrid>
</fieldset>
</ice:panelGroup>
<br/>

<br/>


<ice:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo" >
<ice:panelGroup styleClass="expandableStateIndicator">
<ice:outputText value="#{msgs['eventreg.eventform.detailLabel']}"/>
</ice:panelGroup>
</f:facet>
64
<br/>
<ice:panelTabSet style="width:99.5%"
id="detailPanelTabSet">
<d:dynamictab tabs="${eventRegistrationFormController.dynamicDetailTabs}"/>
</ice:panelTabSet>
</ice:panelGroup>
<br/>

<br/>
</ice:form>
</ui:define>
</ui:composition>
</html>
65
Lampiran 2. Listing program EventForm_GeneralTab.JSPX
<div xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:ice="http://www.icesoft.com/icefaces/component">
<ice:panelTab id="tabGeneral" label="#{msgs['eventreg.eventform.tab.general.generalLabel']}">
<ice:panelGrid columns="2" style="width:100%" columnClasses="form_fieldLabel,form_fieldValue">

<ice:outputLabel value="#{msgs['eventreg.eventform.tab.general.narrativeDescriptionLabel']}"
for="narrativeDescription"/>
<ice:inputTextarea id="narrativeDescription" cols="80" rows="5"
value="#{eventRegistrationFormController.eventRegForm.caseLongDescription}"/>
<ice:outputLabel value="#{msgs['eventreg.eventform.tab.general.actionTakenLabel']}"
for="actionTaken"/>
<ice:inputTextarea id="actionTaken" cols="80" rows="5"
value="#{eventRegistrationFormController.eventRegForm.actionTaken}"/>
<ice:outputLabel value="#{msgs['eventreg.eventform.tab.general.recommendationLabel']}"
for="recommendation"/>
<ice:inputTextarea id="recommendation" cols="80" rows="5"
value="#{eventRegistrationFormController.eventRegForm.recommendation}"/>
</ice:panelGrid>
</ice:panelTab>
</div>
66
Lampiran 3. Listing program EventList.JSPX
<ui:define name="browserTitle">Event List</ui:define>
<ui:define name="title">Event List</ui:define>
<ice:form>
<d:confirm rendered="${eventRegistrationController.deleteConfirmDisplayed}"
closeButtonIcon="/resources/images/icon/popupclose.gif"
icon="/resources/images/icon/icon_information.png"
message="Are you sure to delete measurement code
#{eventRegistrationController.selectedEvent.measurementCode} ?"
noActionListenerMethod="closeDeleteConfirm"
yesActionListenerMethod="handleDeleteButton"
backingBean="${eventRegistrationController}" />
<d:accessDenied rendered="${eventRegistrationController.grantModifyDisplayed}"
message="You Cannot Modify this data"
yesActionListenerMethod="closeGrantModifyDisplayed"
backingBean="${eventRegistrationController}" />

<ice:outputText value="#{msgs['general.filterText']}"/>
</ice:panelGroup>
</f:facet>
<ice:panelGrid columns="5" width="95%" columnClasses="view_fieldLabel,
view_fieldValue">
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventDateFromFilterText']}: "
for="eventDateFromFilterInputDate"/>
<ice:selectInputDate renderAsPopup="true" id="eventDateFromFilterInputDate"
value="#{eventRegistrationController.filterEventDateFrom}">
</ice:selectInputDate>
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventDateToFilterText']}: "
for="eventDateToFilterInputDate"/>
<ice:selectInputDate renderAsPopup="true" id="eventDateToFilterInputDate"
value="#{eventRegistrationController.filterEventDateTo}">
<ice:panelGroup>
67
actionListener="#{eventRegistrationController.handleFilterOKButton}"></ice:commandButton>
</ice:panelGroup>
<ice:outputLabel
value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}: "
for="measurementcodeFilterInputText"/>
<ice:inputText id="measurementcodeFilterInputText" size="53" style="margin:0px"
value="#{eventRegistrationController.filterMeasurementCodeId}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.locationSceneText']}: "

for="locationSceneFilterInputText"/>
<ice:inputText id="locationSceneFilterInputText" size="50" style="margin:0px"
value="#{eventRegistrationController.filterLocationScene}"/>
<ice:panelGroup>
<ice:commandButton style="vertical-align: middle;" accesskey="R"
image="/resources/images/icon/icon_refresh.gif"
actionListener="#{eventRegistrationController.handleFilterResetButton}"></ice:commandButton>
<ice:outputLabel value="#{msgs['general.resetButtonText']}" />
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventTypeText']}: "

for="eventTypeFilterSelectOneMenu"/>
<ice:selectOneMenu id="eventTypeFilterSelectOneMenu"
style="overflow: auto;"
value="#{eventRegistrationController.filterEventTypeId}"
valueChangeListener="#{masterDataController.handleEventTypeChange}">
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventSubTypeText']}: "
for="eventSubTypeFilterSelectOneMenu"/>
<ice:selectOneMenu id="eventSubTypeFilterSelectOneMenu"
value="#{eventRegistrationController.filterEventSubTypeId}">
<f:selectItems value="#{masterDataController.eventSubTypeSelectItems}"/>
<ice:outputLabel/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.departmentText']}: "

for="deptFilterSelectOneMenu"/>
<ice:selectOneMenu id="deptFilterSelectOneMenu"
value="#{eventRegistrationController.filterLocationDeptId}"
valueChangeListener="#{masterDataController.handleDepartmentChange}">
<ice:outputLabel value="#{msgs['eventreg.eventlist.sectionText']}: "

for="sectionFilterSelectOneMenu"/>
<ice:selectOneMenu id="sectionFilterSelectOneMenu"
value="#{eventRegistrationController.filterLocationSectionId}">
<f:selectItems value="#{masterDataController.sectionSelectItems}"/>
<ice:outputLabel/>
68
<ice:outputLabel
value="#{msgs['eventreg.eventlist.descriptionKeywordFilterText']}: "
for="descriptionFilterInputText"/>
<ice:inputTextarea id="descriptionFilterInputText" cols="50" rows="3"
style="margin:0px;"
value="#{eventRegistrationController.filterDescriptionKeyword}"/>
</ice:panelGrid>
</ice:panelGroup>
<div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0"
/></div>

<tr>
<td valign="middle" style="padding:1px;">
<div class="toolbar_button"
onmouseout="this.className='toolbar_button';"
<ice:commandButton image="/resources/images/icon/icon_add.gif"
style="vertical-align: middle;"
title="Add" accesskey="a" id="eventlistAddButton"
action="eventRegistrationForm" type="submit"/>
<ice:outputLabel value="#{msgs['general.addButtonText']}"
for="eventlistAddButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_edit.gif"
title="Edit" accesskey="e" id="eventlistEditButton"
actionListener="#{eventRegistrationController.handleEditButton}"/>
<ice:outputLabel value="#{msgs['general.editButtonText']}"
for="eventlistEditButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_delete.gif"
title="Delete" accesskey="d" id="eventlistDeleteButton"
actionListener="#{eventRegistrationController.openDeleteConfirm}"/>
<ice:outputLabel value="#{msgs['general.deleteButtonText']}"
for="eventlistDeleteButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_pdf.gif"
title="Preview" accesskey="V" id="eventlistPreviewButton"
actionListener="#{eventRegistrationController.handlePreviewDetailButton}"/>
<ice:outputLabel value="View" for="eventlistPreviewButton"/>
</div>
<div style="float:right;">
<ice:panelGrid columns="2" cellpadding="0" cellspacing="0">

<ice:dataPaginator id="eventListPaginator"
for="eventList"
69
paginator="true"
fastStep="3"
paginatorMaxPages="4"
actionListener="#{eventRegistrationController.handleEventListPageChange}"
style="background-color:#ffffff;border: 1px solid #CCCCCC;">
<f:facet name="first">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-first.gif"
style="border:none;"
title="First Page"/>
</f:facet>
<f:facet name="last">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-last.gif"
title="Last Page"/>
</f:facet>
<f:facet name="previous">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-previous.gif"
title="Previous Page"/>
</f:facet>
<f:facet name="next">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-next.gif"
title="Next Page"/>
</f:facet>
<f:facet name="fastforward">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-ff.gif"
title="Fast Forward"/>
</f:facet>
<f:facet name="fastrewind">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-fr.gif"
title="Fast Backwards"/>
</f:facet>
</ice:dataPaginator>

<ice:dataPaginator id="eventListPaginatorInfo"
for="eventList"
rowsCountVar="rowsCount"
displayedRowsCountVar="displayedRowsCountVar"
firstRowIndexVar="firstRowIndex"
lastRowIndexVar="lastRowIndex"
pageCountVar="pageCount"
pageIndexVar="pageIndex">
<ice:outputFormat value="   {0} events found, displaying
{1} events, from {2} to {3}. Page {4}/{5}."
styleClass="pagination_info">
<f:param value="#{rowsCount}" />
<f:param value="#{displayedRowsCountVar}" />
<f:param value="#{firstRowIndex}" />
<f:param value="#{lastRowIndex}" />
<f:param value="#{pageIndex}" />
<f:param value="#{pageCount}" />
</ice:outputFormat>
</ice:panelGrid>
</div>
</td>
</tr>
70
</table>

<ice:dataTable id="eventList" rows="#{eventRegistrationController.pageSize}"

width="100%"
style="margin:0px;font-size:8pt;"
var="event" value="#{eventRegistrationController.eventListDataModel}"
columnWidths="10%,10%,10%,20%,40%,10%"
sortAscending="#{eventRegistrationController.eventListDataModel.sortedAscending}"
sortColumn="#{eventRegistrationController.eventListDataModel.sortedColumnName}"
binding="#{eventRegistrationController.eventListDataTable}">
<ice:column>
<ice:rowSelector value="#{event.selected}" multiple="false" toggleOnClick="true"
selectionListener="#{eventRegistrationController.handleEventListSelection}" />
<ice:commandSortHeader
columnName="#{msgs['eventreg.eventlist.measurementCodeColumnName']}"
arrow="true">
<ice:outputText
value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}"/>
</ice:commandSortHeader>
</f:facet>
<ice:outputText value="#{event.measurementCode}">
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.eventDateColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.eventDateColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.eventDate}">
<f:convertDateTime pattern="MMMM dd, yyyy HH:mm"
timeZone="Asia/Jakarta"/>
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.reportedDateColumnName']}"
arrow="true">
<ice:outputText
value="#{msgs['eventreg.eventlist.reportedDateColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.reportedDate}">
<f:convertDateTime pattern="MMMM dd, yyyy HH:mm"
timeZone="Asia/Jakarta"/>
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.locationSceneColumnName']}"
arrow="true">
71
<ice:outputText
value="#{msgs['eventreg.eventlist.locationSceneColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.locationScene}"/>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.caseShortDescriptionColumnName']}"
arrow="true">
<ice:outputText
value="#{msgs['eventreg.eventlist.caseShortDescriptionColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.caseShortDescription}"/>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.createByColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.createByColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.userGet.fullname}"/>
</ice:column>
</ice:dataTable>
<div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0"
/></div>
<ice:panelCollapsible style="width:100%;"
expanded="true"
styleClass="pnlClpsblDemo"
binding="#{eventRegistrationController.detailPanelCollapsible}"
rendered="false">
<ice:outputText value="#{msgs['general.detailText']}"/>
</ice:panelGroup>
</f:facet>
<ice:panelTabSet binding="#{eventRegistrationController.detailTabSet}"
tabChangeListener="#{eventRegistrationController.handleTabChange}"
style="width:99.5%"
<d:dynamictab tabs="${eventRegistrationController.dynamicDetailTabs}"
backingBean="${eventRegistrationController}"/>
</ice:panelTabSet>
</ice:panelGroup>
</ice:form>
</ui:define>
</ui:composition>
</html>
72
Lampiran 4. Listing program EventList_GeneralTab.JSPX
<div xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:ice="http://www.icesoft.com/icefaces/component">
<ice:panelGrid columns="2" style="width:100%" columnClasses="view_fieldLabel,view_fieldValue">


<ice:outputLabel
value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.measurementCode}"/>


<ice:outputLabel
value="#{msgs['eventreg.eventlist.reportedDateColumnText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.reportedDate}">
<f:convertDateTime type="both"/>
</ice:outputText>


<ice:outputLabel
value="#{msgs['eventreg.eventlist.eventDateColumnText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.eventDate}">
<f:convertDateTime type="both"/>
</ice:outputText>


<ice:outputLabel value="#{msgs['eventreg.eventlist.eventTypeText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.eventType.name}"/>
<ice:outputLabel
value="#{msgs['eventreg.eventlist.leadingIndicatorText']}: "
rendered="#{backingBean.selectedEvent.leadingIndicator != null}"/>
<ice:outputText
value="#{backingBean.selectedEvent.leadingIndicator.name}"
rendered="#{backingBean.selectedEvent.leadingIndicator != null}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.laggingIndicatorText']}: "

rendered="#{backingBean.selectedEvent.laggingIndicator != null}"/>
<ice:outputText value="#{backingBean.selectedEvent.laggingIndicator.name}"
rendered="#{backingBean.selectedEvent.laggingIndicator != null}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.investigationRequiredLabel']}:"/>
<ice:outputText value="#{backingBean.selectedEvent.investigationRequired ? 'Yes' : 'No'}"/>
</ice:panelGrid>
73
<br/>
<fieldset>
<legend>Location</legend>
columnClasses="view_fieldLabel, view_fieldValue">
<ice:outputLabel
value="#{msgs['eventreg.eventlist.locationSceneText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.locationScene}"/>
<ice:outputLabel
value="#{msgs['eventreg.eventlist.locationAreaText']}: "/>
<ice:outputText
value="#{backingBean.selectedEvent.locationArea.name}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.sectionText']}:
"/>
<ice:outputText
value="#{backingBean.selectedEvent.locationSection.name}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.departmentText']}:
"/>
<ice:outputText
value="#{backingBean.selectedEvent.locationDepartment.name}"/>
</ice:panelGrid>
</fieldset>
<br/>
<fieldset>
<legend>Reporter/Observer</legend>
columnClasses="view_fieldLabel, view_fieldValue">
<ice:outputLabel value="#{msgs['eventreg.eventlist.reportertypeText']}:"/>
<ice:outputText value="#{backingBean.selectedEvent.reporters[0].reporterPersonType.name}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.reporterbadgeidText']}:"/>
<ice:outputText value="#{backingBean.selectedEvent.reporters[0].reporterIdNo}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.reporternameText']}:"/>
<ice:outputText value="#{backingBean.selectedEvent.reporters[0].fullName}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.reporteroccupationText']}: "/>

<ice:outputText value="#{backingBean.selectedEvent.reporters[0].occupation}"/>
</ice:panelGrid>
</fieldset>
<br/>
<ice:panelGrid columns="2" style="width:100%" columnClasses="view_fieldLabel,view_fieldValue">
<ice:outputLabel value="#{msgs['eventreg.eventlist.caseShortDescriptionColumnText']}: "/>
<ice:inputTextarea id="caseShortDescription" cols="80" rows="5"
value="#{backingBean.selectedEvent.caseShortDescription}" readonly="true"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.caseNarativeDescriptionText']}: "/>
<ice:inputTextarea id="caseLongDescription" cols="80" rows="5"
value="#{backingBean.selectedEvent.caseLongDescription}" readonly="true"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.actionTakenText']}:"/>
<ice:inputTextarea id="actionTaken" cols="80" rows="5"
value="#{backingBean.selectedEvent.actionTaken}" readonly="true"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.recommendationText']}: "/>
<ice:inputTextarea id="recommendation" cols="80" rows="5"
value="#{backingBean.selectedEvent.recommendation}" readonly="true"/>
</ice:panelGrid>
</div>
74
Lampiran 5. Listing program My_EventList.JSPX
xmlns:fn="http://java.sun.com/jsp/jstl/functions"
<ui:define name="browserTitle">Measurement List</ui:define>
<ui:define name="title">Measurement List</ui:define>
<ice:form id="measurementForm" partialSubmit="true">
<d:confirm rendered="${measurementController.deleteConfirmDisplayed}"
message="Are you sure to delete measurement code
#{measurementController.selectedEvent.measurementCode} ?"
noActionListenerMethod="closeDeleteConfirm"
yesActionListenerMethod="handleDeleteButton"
backingBean="${measurementController}" />
<d:accessDenied rendered="${measurementController.grantModifyDisplayed}"
message="You cannot modify this data"
yesActionListenerMethod="closeGrantModifyDisplayed"
backingBean="${measurementController}" />


<ice:panelPopup styleClass="panelPopup" id="addIndicatorPanel" draggable="true"
rendered="#{measurementController.addIndicatorPanelVisible}"
visible="#{measurementController.addIndicatorPanelVisible}"
style="z-index: 3100; top: 35%; left: 20%; position: absolute; width: 650px; height:
180px;">
<ice:panelGrid id="indicatorPopupHeader" width="100%"
cellpadding="0" cellspacing="0"
columns="3" columnClasses="popupIcon,popupTitle,popupButton">
<h:graphicImage id="popupIcon" value="/resources/images/icon/icon_edit.gif" />
<ice:outputText value="#{msgs['measurement.measurementlist.addIndicatorPanel.title']}"/>
<ice:commandButton id="popupClose" type="button"
image="/resources/images/icon/popupclose.gif"
actionListener="#{measurementController.closeAddIndicatorPanel}"
style="cursor: pointer;"/>
</ice:panelGrid>
</f:facet>
<f:facet name="body">
cellpadding="2" cellspacing="0" width="100%">
<ice:outputLabel value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}:"/>
75
<ice:outputText styleClass="view_fieldValue"
value="#{measurementController.selectedEvent.measurementCode}"/>
<ice:panelGroup>
<ice:selectBooleanCheckbox id="leadingIndicatorSelected" partialSubmit="true"
value="#{measurementController.leadingIndicatorSelected}"
disabled="#{measurementController.approvedButNotIndicatorSelected}"/>
<ice:outputLabel for="leadingIndicatorSelected"
value="#{msgs['measurement.measurementlist.leadingCheckBoxLabel']}"/>
</ice:panelGroup>
<ice:panelGroup>
<ice:selectOneMenu disabled="#{!measurementController.leadingIndicatorSelected}"
value="#{measurementController.leadingIndicatorSelectId}"
valueChangeListener="#{measurementController.handleChangeEventTypeOfTrainingListener}"
partialSubmit="true" >
<f:selectItems value="#{measurementController.leadingIndicatorSelectItems}"/>
</ice:panelGroup>
<ice:outputText
value="#{msgs['measurement.measurementlist.leadingTrainingHoursLabel']}"/>
<ice:panelGroup>
<ice:inputText id="trainingHours"
disabled="#{!measurementController.trainingHoursEvent}"
value="#{measurementController.eventTrainingValue}"/>
</ice:panelGroup>
<ice:panelGroup>
<ice:selectBooleanCheckbox id="laggingIndicatorSelected" partialSubmit="true"
value="#{measurementController.laggingIndicatorSelected}"
disabled="#{measurementController.approvedButNotIndicatorSelected}"/>
<ice:outputLabel for="laggingIndicatorSelected"
value="#{msgs['measurement.measurementlist.laggingCheckBoxLabel']}"/>
</ice:panelGroup>
<ice:panelGroup>
<ice:selectOneMenu disabled="#{!measurementController.laggingIndicatorSelected}"
value="#{measurementController.laggingIndicatorSelectId}">
<f:selectItems value="#{measurementController.laggingIndicatorSelectItems}"/>
</ice:panelGroup>
<ice:panelGroup>
<ice:selectBooleanCheckbox id="approvedSelected" partialSubmit="true"
value="#{measurementController.approvedButNotIndicatorSelected}"
disabled="#{measurementController.laggingIndicatorSelected or
measurementController.leadingIndicatorSelected}"/>
<ice:outputLabel for="approvedSelected" value="Approved"/>
</ice:panelGroup>
<ice:outputText value=""/>
<ice:outputText value=""/>
<ice:panelGroup>
<ice:commandButton image="/resources/images/icon/icon_save.gif" style="vertical-
align: middle;"
title="Save" accesskey="s" id="saveIndicatorButton"
actionListener="#{measurementController.handleSaveAddIndicator}"/>
76
<ice:outputLabel value="#{msgs['general.saveButtonText']}"
for="saveIndicatorButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_cancel.gif" style="vertical-
align: middle;"
title="#{msgs['general.cancelButtonText']}" id="cancelIndicatorButton"
actionListener="#{measurementController.closeAddIndicatorPanel}"/>
<ice:outputLabel value="#{msgs['general.cancelButtonText']}"
for="cancelIndicatorButton"/>
</div>
</ice:panelGroup>
</ice:panelGrid>
</f:facet>
</ice:panelPopup>


<ice:outputText value="#{msgs['general.filterText']}"/>
</ice:panelGroup>
</f:facet>
<ice:panelGrid columns="5" width="95%" columnClasses="view_fieldLabel, view_fieldValue">
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventDateFromFilterText']}: "
for="eventDateFromFilterInputDate"/>
<ice:selectInputDate renderAsPopup="true" id="eventDateFromFilterInputDate"
value="#{measurementController.filterEventDateFrom}">
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventDateToFilterText']}: "
for="eventDateToFilterInputDate"/>
<ice:selectInputDate renderAsPopup="true" id="eventDateToFilterInputDate"
value="#{measurementController.filterEventDateTo}">
<ice:panelGroup>
actionListener="#{measurementController.handleFilterOKButton}"></ice:commandButton>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}: "

for="measurementcodeFilterInputText"/>
<ice:inputText id="measurementcodeFilterInputText" size="53" style="margin:0px"
value="#{measurementController.filterMeasurementCodeId}"/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.locationSceneText']}: "

for="locationSceneFilterInputText"/>
<ice:inputText id="locationSceneFilterInputText" size="50" style="margin:0px"
value="#{measurementController.filterLocationScene}"/>
<ice:panelGroup>
<ice:commandButton style="vertical-align: middle;" accesskey="R"
image="/resources/images/icon/icon_refresh.gif"
actionListener="#{measurementController.handleFilterResetButton}"></ice:commandButton>
<ice:outputLabel value="#{msgs['general.resetButtonText']}" />
</ice:panelGroup>
77
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventTypeText']}: "

for="eventTypeFilterSelectOneMenu"/>
<ice:selectOneMenu id="eventTypeFilterSelectOneMenu"
value="#{measurementController.filterEventTypeId}"
valueChangeListener="#{masterDataController.handleEventTypeChange}">
<ice:outputLabel value="#{msgs['eventreg.eventlist.eventSubTypeText']}: "
for="eventSubTypeFilterSelectOneMenu"/>
<ice:selectOneMenu id="eventSubTypeFilterSelectOneMenu"
value="#{measurementController.filterEventSubTypeId}">
<f:selectItems value="#{masterDataController.eventSubTypeSelectItems}"/>
<ice:panelGroup>
<ice:commandButton style="vertical-align: middle;" accesskey="P"
image="/resources/images/icon/icon_pdf.gif"
actionListener="#{measurementController.handlePreviewList}"></ice:commandButton>
<ice:outputLabel value="Preview List" style="font-weight:normal"/>
</ice:panelGroup>
<ice:outputLabel value="#{msgs['eventreg.eventlist.departmentText']}: "

for="deptFilterSelectOneMenu"/>
<ice:selectOneMenu id="deptFilterSelectOneMenu"
value="#{measurementController.filterLocationDeptId}"
valueChangeListener="#{masterDataController.handleDepartmentChange}">
<ice:outputLabel value="#{msgs['eventreg.eventlist.sectionText']}: "

for="sectionFilterSelectOneMenu"/>
<ice:selectOneMenu id="sectionFilterSelectOneMenu"
value="#{measurementController.filterLocationSectionId}">
<f:selectItems value="#{masterDataController.sectionSelectItems}"/>
<ice:outputLabel/>
<ice:outputLabel value="#{msgs['eventreg.eventlist.descriptionKeywordFilterText']}: "

for="descriptionFilterInputText"/>
<ice:inputTextarea id="descriptionFilterInputText" cols="50" rows="3" style="margin:0px;"
value="#{measurementController.filterDescriptionKeyword}"/>
<ice:outputLabel value="Approval Status :" for="filterApprovalId"/>

<ice:selectOneRadio id="filterApprovalId"
value="#{measurementController.filterApprovalId}" style="overflow: auto;">
<f:selectItem itemValue="1" itemLabel="Approved"/>
<f:selectItem itemValue="2" itemLabel="Not Approved"/>
</ice:selectOneRadio>
<ice:outputLabel/>
</ice:panelGrid>
</ice:panelGroup>
<div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0" /></div>

78

<tr>
<td valign="middle" style="padding:1px;">
<div class="toolbar_button" style="width:95px;"
<ice:commandButton image="/resources/images/icon/icon_add.gif" style="vertical-align:
middle;"
title="#{msgs['measurement.measurementlist.addIndicatorButtonText']}"
id="addIndicatorEventButton"
actionListener="#{measurementController.showAddIndicatorPanel}"/>
<ice:outputLabel
value="#{msgs['measurement.measurementlist.addIndicatorButtonText']}"
for="addIndicatorEventButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_edit.gif" style="vertical-align:
middle;"
title="Edit" accesskey="e" id="eventlistEditButton"
actionListener="#{measurementController.handleEditButton}"/>
<ice:outputLabel value="#{msgs['general.editButtonText']}" for="eventlistEditButton"/>
</div>
<ice:commandButton image="/resources/images/icon/icon_delete.gif" style="vertical-
align: middle;"
title="Delete" accesskey="d" id="eventlistDeleteButton"
actionListener="#{measurementController.openDeleteConfirm}"/>
<ice:outputLabel value="#{msgs['general.deleteButtonText']}"
for="eventlistDeleteButton"/>
</div>
<div class="toolbar_button" style="width:130px;height:19px;"

<ice:commandButton image="/resources/images/icon/icon_information.png"
title="View Recomendation" accesskey="v" id="eventlistViewResponseButton"
action="#{measurementController.handleViewResponseButtonListener}"/>
<ice:outputLabel value="#{msgs['measurement.followuplist.button.viewresponseLabel']}"
for="eventlistViewResponseButton"/>
</div>
<div style="float:right;">
<ice:panelGrid columns="2" cellpadding="0" cellspacing="0">

<ice:dataPaginator id="eventListPaginator"
for="eventList"
paginator="true"
fastStep="3"
paginatorMaxPages="4"
actionListener="#{measurementController.handleEventListPageChange}"
style="background-color:#ffffff;border: 1px solid #CCCCCC;">
<f:facet name="first">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-first.gif"
79
title="First Page"/>
</f:facet>
<f:facet name="last">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-last.gif"
title="Last Page"/>
</f:facet>
<f:facet name="previous">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-previous.gif"
title="Previous Page"/>
</f:facet>
<f:facet name="next">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-next.gif"
title="Next Page"/>
</f:facet>
<f:facet name="fastforward">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-ff.gif"
title="Fast Forward"/>
</f:facet>
<f:facet name="fastrewind">
<ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-fr.gif"
title="Fast Backwards"/>
</f:facet>

<ice:dataPaginator id="eventListPaginatorInfo"
for="eventList"
rowsCountVar="rowsCount"
displayedRowsCountVar="displayedRowsCountVar"
firstRowIndexVar="firstRowIndex"
lastRowIndexVar="lastRowIndex"
pageCountVar="pageCount"
pageIndexVar="pageIndex">
<ice:outputFormat value="   {0} events found, displaying {1}
events, from {2} to {3}. Page {4}/{5}."
styleClass="pagination_info">
<f:param value="#{rowsCount}" />
<f:param value="#{displayedRowsCountVar}" />
<f:param value="#{firstRowIndex}" />
<f:param value="#{lastRowIndex}" />
<f:param value="#{pageIndex}" />
<f:param value="#{pageCount}" />
</ice:outputFormat>
</ice:panelGrid>
</div>
</td>
</tr>
</table>

<ice:dataTable id="eventList" rows="#{measurementController.pageSize}"

width="100%"
style="margin:0px;font-size:8pt;"
var="event" value="#{measurementController.eventListDataModel}"
columnWidths="10%,12%,12%,20%,35%,10%"
sortAscending="#{measurementController.eventListDataModel.sortedAscending}"
80
sortColumn="#{measurementController.eventListDataModel.sortedColumnName}"
binding="#{measurementController.eventListDataTable}">
<ice:column>
<ice:rowSelector value="#{event.selected}" multiple="false" toggleOnClick="true"
selectionListener="#{measurementController.handleEventListSelection}" />
columnName="#{msgs['eventreg.eventlist.measurementCodeColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.measurementCodeColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.measurementCode}">
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.eventDateColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.eventDateColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.eventDate}">
<f:convertDateTime type="both" timeZone="Asia/Jakarta"/>
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.reportedDateColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.reportedDateColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.reportedDate}">
<f:convertDateTime type="both" timeZone="Asia/Jakarta"/>
</ice:outputText>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.locationSceneColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.locationSceneColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.locationScene}"/>
</ice:column>
<ice:column>
columnName="#{msgs['eventreg.eventlist.caseShortDescriptionColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.caseShortDescriptionColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.caseShortDescription}"/>
</ice:column>
<ice:column>
81
columnName="#{msgs['eventreg.eventlist.createByColumnName']}"
arrow="true">
<ice:outputText value="#{msgs['eventreg.eventlist.createByColumnText']}"/>
</f:facet>
<ice:outputText value="#{event.userGet.fullname}"/>
</ice:column>
</ice:dataTable>
<div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0" /></div>
<ice:panelCollapsible style="width:100%;"
expanded="true"
styleClass="pnlClpsblDemo"
binding="#{measurementController.detailPanelCollapsible}"
rendered="false">
<ice:outputText value="#{msgs['general.detailText']}"/>
</ice:panelGroup>
</f:facet>
<ice:panelTabSet binding="#{measurementController.detailTabSet}"
tabChangeListener="#{measurementController.handleTabChange}"
style="width:99.5%"
<d:dynamictab tabs="${measurementController.dynamicDetailTabs}"
backingBean="${measurementController}"/>
</ice:panelTabSet>
</ice:panelGroup>
</ice:form>
</ui:define>
</ui:composition>
</html>
82
Lampiran 6. Contoh laporan Event List

83
Lampiran 7. Contoh laporan Event Detail

84
Lampiran 8. Contoh laporan SPI Indicator semua departemen

Sistem Inf. Keselamatan Dan Kesehatan Kerja (SHEQ IS) PT Badak NGL Bontang - Junaini SKom MKom

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Sistem Inf. Keselamatan Dan Kesehatan Kerja (SHEQ IS) PT Badak NGL Bontang - Junaini SKom MKom

Uploaded by

Copyright:

Available Formats

1

ANALISA SISTEM INFORMASI KESELAMATAN DAN

PROGRAM STUDI TEKNIK INFORMATIKA

ANALISA SISTEM INFORMASI KESELAMATAN DAN

NIM: 2005 12 041

Telah disetujui dan disahkan sebagai Proposal Tugas Akhir

Bontang, 25 April 2009

Ketua STITEK Pemerintah Kota

Masagus .M. Yusuf, SKom, MKom

Khairudin Karim, ST, MT M.F Andrijasa, Skom, Mkom

1.1. Latar Belakang

Dalam memproduksi barang dan produk yang dihasilkan kepada

kebakaran sampai dengan menghilangkan seluruh asset perusahaan, adanya

bersangkutan sehingga asset perusahaan berupa tenaga kerja/tenaga ahli, waktu

merugikan suatu perusahaan dan karyawan itu sendiri.

tulang, kanker, gangguan pendengaran akibat bising, maupun penyakit akibat

Permasalahan-permasalahan tersebut diatas adalah diantaranya dari

berbagai masalah khususnya bidang industri terhadap isu Keselamatan dan

Kesehatan Kerja (K3). Permasalahan Keselamatan dan Kesehatan Kerja akibat

dari : 1. Tidak adanya sistem; 2. Kurangnya standar kerja; 3. Kurang peduli

tentang masalah K3; dan 4. Masih memakai paradigma lama.

Dari isu Keselamatan dan Kesehatan tersebut diatas perlu adanya : 1.

Mengelola K3 secara terstruktur, berkesinambungan dan sistematis; 2.

Menciptakan tempat kerja yang “safe”; 3. Mencegah dan mengurangi kecelakaan

dapat mengakibatkan kecelakaan kerja dan kerugian.

khususnya di Safety Health and Environment (SHE) Department dapat

dimonitoring dengan adanya “Sistem Informasi Keselamatan dan Kesehatan

System (SHE-Q IS). SHE-Q IS diperlukan guna membantu pekerja PT Badak

khususnya masalah Keselamatan dan Kesehatan Kerja.

Penerapan Sistem informasi Keselamatan dan Kesehatan Kerja (SHE-Q

kesehatan, pengendalian lingkungan, dan pengendalian mutu di lingkungan PT

Dari hal tersebut maka dalam penelitian penulis menganilisis “Sistem

Informasi SHE-Q menggunakan AJAX (Asynchronous JavaScript and XML) dan

diintegrasikan dengan Oracle-Database versi 11.0.

1.2. Rumusan Masalah

masalah dapat dijabarkan sebagai berikut :

lapangan tentang Safety Performance Indicator (SPI)?

1.2.1. Menganilisis Sistem Informasi Keselamatan dan Kesehatan Kerja,

sehingga data yang diterima lebih akurat, terintegrasi, up-to-date, serta

1.2.2. Bagaimana membuat Event Form agar terintegrasi dengan Safety

Performance Indicator (SPI) dalam menentukan Leading Indicator dan

1.3. Batasan masalah

Agar masalah yang dikemukakan tidak meluas maka peneliti memberikan

batasan masalah pada Sistem Informasi Keselamatan dan Kesehatan Kerja

1. Membuat Event Form pada Event Registrasi?

2. Membuat tampilan Event List.

3. Menentukan Event List sebagai Leading Indicator atau Lagging Indicator

oleh Administrator SHEQ-IS.

4. Mengintegrasikan dengan sistem yang lama, untuk penerapan Safety

Performance Indicator (SPI).

1.3. Tujuan Penelitian

menetapkan prioritas pekerjaan sistem selanjutnya.

Berikut adalah tujuan penelitian, yaitu:

Performance Indicator (SPI).

terhadap pekerjaan yang akan dilaksanakan, dengan mengutamakan

masalah Keselamatan dan Kesehatan Kerja.

1.3.3. Mengetahui kebutuhan sistem informasi yang dibutuhkan dan dibuat

penambahan sistem baru lagi sesuai keinginan pihak manajemen

Keselamatan dan Kesehatan Kerja.

1.4. Manfaat Penelitian

1.4.1. Manfaat bagi mahasiswa

Adapun manfaat penelitian ini bagi peneliti, selain mendapat pengalaman,

peneliti pun dapat mengetahui dan menganalisa serta mambantu memberikan