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

1977 dengan kapasitas produksi 630 m3/hr. Pada tanggal 1 Agustus 1977, kilang

LNG Bontang telah diresmikan. Seminggu kemudian dilakukan pengapalan

pertama dengan menggunakan tanker AQUARIUS dengan kapasitas 125.000 m3.

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

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

Utilities Plants

Process Plants

Process Plants

Storage and Loading Plants

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

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.

Safety Health and Environment Quality

Department

Safety Section

Safety Eng. &

Environmental Control Section

Fire Protection

Section

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

[Evaluation needed]

[Evaluation not needed]

[Rejected]

[Approved]

Event Registration Occ. Health & Industrial Hygiene CSMSRisk Assesment SHE-Q Employee

Measurement

Evaluation

Safety Performance Indicator

Re-evaluation

System is able to be expanded to

accomodate other sub systems.

Measurement Sub Systems

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 / Lain-Lain Administrasi SHEQ Manajemen / Public

Gambar 13. Flow of document dari SHEQ-IS yang sedang berjalan

SHEQ-IS yang diusulkan oleh peneliti dapat digambarkan sebagai berikut:

Karyawan / Kontraktor / Lain-Lain

Administrasi SHEQ Manajemen / Public

Gambar 14. Flow of document dari SHEQ-IS yang diusulkan

Kejadian yang berhubungan dengan SHEQ, kemudian buat laporan

Kejadian berhubungan

dengan SHEQ

Data laporan diinput

Indikator Leading atau lagging

Measurement SHEQ

Melihat chart dan tabel yang berisi kejadian PT. Badak setiap saat

Ada kejadian yang berhubungan SHEQ

Input, Edit dan Delete kejadian pada Event Form

Indikator Leading atau lagging

Measurement SHEQ

Melihat chart dan tabel yang berisi kejadian PT. Badak setiap saat

33

3.3.2.2. Diagram Context

Diagram Conteks adalah diagram yang terdiri dari suatu proses dan

menggambarkan ruang lingkup sistem.

Tabel kejadian

ChartData kejadianKaryawan

Kontraktor Lain Lain

1

Sistem Informasi SHEQ

Manajemen Publik

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

Input

Info

Info

Info

Info

Info

InfoInfo

UbahInfo

Ubah

Info Info

Info

Input

Tabel kejadian berindikator

Chart untuk Leading & Lagging Indicator

Indikator Leading Lagging

Data belum ada indikator

Tabel kejadianMasukkan Ubah dan Hapus data kejadian

Karyawan Kontraktor Lain Lain

1Event Form pada

Menu Event Registration Manajemen

Publik

2

Measurement

3Safety

Performance Indicator (SPI)

1 Measurement

2M_Company_Department

3 M_Company_Section

4M_Company_

Employee

5 M_Employee_Position

6 M_Person_Group

7 M_Event_Type

8M_Location_

Area

9M_SPI_Leading

_Indicator

10M_SPI_Lagging_

Indicator

Gambar 16. DFD Level 1 Sistem Informasi SHEQ penambahan pada Event Form

35

3.3.2.4. Entity Relational Diagram

Gambar 17. ERD Sistem Informasi SHEQ

M_COMPANY_EMPLOYEE *Badge (varchar2 (6)) Department_ID (varchar2 (6)) Section_ID (varchar2 (6)) Full_name (varhar2 (4000)) Birth_date (date) Email (varchar2 (255)) Position_ID (varchar2 (6)) Position_title (varchar2 (255))

M_COMPANY_SECTION *Section_id (varchar2 (6)) Name (varchar2 (255)) Department_ID (varchar2 (6))

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

M_COMPANY_DEPARTMENT *Department_id (varchar2 (6)) Name (varchar2 (255))

M_EMPLOYEE_POSITION *Position_id (varchar2 (6)) Name (varchar2 (400)) Position_superid (varchar2 (6)) Group_id (varchar2 (50))

M_PERSON_GROUP *Person_group_id (varchar2 (6)) Person_group_grouping (varchar2 (255)) Name (varchar2 (50))

M_EVENT_TYPE *Event_type_id (varchar2 (10)) Event_type_parent_id (varchar2 (10)) Related_leading_indicator (number (6)) Related_lagging_indicator (number (6)) Name (varchar2 (255))

M_SPI_LAGGING_INDICATOR *Lagging_indicator_id (number (6)) Name (varchar2 (255)) Short_description (varchar2 (255)) Description (varchar2 (4000)) Evaluation_needed (number (1)) Is_active (number (1))

M_SPI_LEADING_INDICATOR *Leading_indicator_id (number (6)) Name (varchar2 (255)) Short_description (varchar2 (255)) Description (varchar2 (4000)) Evaluation_needed (number (1)) Is_active (number (1))

MEASUREMENT *Measurement_code (varchar2 (20)) Event_type_id (varchar2 (10)) Event_date (date) Badge (varchar2 (6)) Reported_date (date) Leading_indicator_id (number (6)) Lagging_indicator_id (number (6)) Location_department_id (varchar2 (6)) Location_section_id (varchar2 (6)) Location_area_id (number (4)) Location_scene (varchar2 (255)) Case_short_description (varchar2 (2000)) Evaluation_need (number (1)) Evaluation_status (varchar2 (12)) Last_modified_date (date) Last_modified_by (varchar2 (255)) Last_status (varchar2 (50)) Checkout_by (varchar2 (255)) Checkout_date (date) Investigation_required (number) Case_long_description (varchar2 (4000)) Action_taken (varchar2 (4000)) Recommendation (varchar2 (4000)) Creatby (varchar2 (255)) Createdate (date) Attnbadak (number) Attncontractor (number) Trainninghours (number) Sumoftraining (number)

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/reporting/reports

Path untuk menyimpan file jrxml, tidak 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 = [email protected] 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 = TIT.003

identifikasi ID untuk fatal injury type

workaccident.fatalNatureOfInjury = NOI.004

identifikasi ID untuk fatal nature injury type

mailto:[email protected]

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"

http://www.w3.org/1999/xhtml

http://java.sun.com/jsf/facelets

http://java.sun.com/jsf/core

http://java.sun.com/jsf/html

http://java.sun.com/JSP/Page

http://java.sun.com/jstl/core

http://www.icesoft.com/icefaces/component

http://www.dycode.com/jsf

http://sourceforge.net/projects/jsf-comp/acegijsf

http://java.sun.com/jsp/jstl/functions

http://www.w3.org/TR/html4/loose.dtd

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"> <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator" > <ice:outputText value="#{msgs['member.index.recapsText']}"/> </ice:panelGroup> </f:facet> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <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> <td width="15%" align="center"> <ice:outputText value="Event Own" style="font-weight:bold;width:15%"/> </td> <td width="15%" align="center"> <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 == ''}"> <ice:outputText value="#{recap.text}"/> </c:if> </div> <div style="width: 15%; float: left; text-align: right;"> <ice:outputText value="#{recap.valueDept}"/> </div> <div style="width: 15%; float: left; text-align: right;"> <ice:outputText value="#{recap.valueOwn}"/>

56

</div> <div style="width: 15%; float: left; text-align: right;"> <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:outputText value="#{recap.text}"/> </ice:outputLink> </c:if> <c:if test="${recap.detailPageUrl == ''}"> <ice:outputText value="#{recap.text}"/> </c:if> </div> <div style="width: 15%; float: left; text-align: right;"> <ice:outputText value="#{recap.valueDept}"/> </div> <div style="width: 15%; float: left; text-align: right;"> <ice:outputText value="#{recap.valueOwn}"/> </div> <div style="width: 15%; float: left; text-align: right;"> <ice:outputText value="#{recap.value}"/> </div> </li> </ice:panelSeries> </ul> </ice:panelGroup> </ice:panelCollapsible> </td> <td width="1%" valign="top"> </td> <td width="49%" valign="top">  </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 <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:fn="http://java.sun.com/jsp/jstl/functions" xmlns:d="http://www.dycode.com/jsf"> <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="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> <ui:define name="content"> <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

<div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo"> <f:facet name="header"> <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:selectOneMenu> <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:selectOneMenu> <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}"/> </ice:selectOneMenu>

61

<ice:outputLabel value="#{msgs['eventreg.eventform.tab.general.sectionLabel']}" for="detailSection"/> <ice:selectOneMenu id="#{msgs['sectionLocation']}" value="#{eventRegistrationFormController.eventRegForm.locationSection.sectionId}" partialSubmit="true" style="width:200px;"> <f:selectItems value="#{eventRegistrationFormController.locationSections}"/> </ice:selectOneMenu> </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:panelGrid columns="2" style="width:100%" columnClasses="form_fieldLabel,form_fieldValue"> <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> <ice:panelGrid columns="2" style="width:100%" 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:panelGrid columns="2" style="width:100%" columnClasses="form_fieldLabel,form_fieldValue"> <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}" columnClasses="form_fieldLabel,form_fieldValue"> <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" style="width:200px;"> <f:selectItems value="#{masterDataController.departmentSelectItems}"/> </ice:selectOneMenu> <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}" style="width:200px;"> <f:selectItems value="#{eventRegistrationFormController.reporterSections}"/> </ice:selectOneMenu> <ice:message for="reporterSection" errorClass="errorMsg"/> </ice:panelGroup> </ice:panelGrid> <ice:panelGrid columns="2" 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:panelGrid columns="2" style="width:100%" columnClasses="form_fieldLabel,form_fieldValue"> <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/> </ice:panelCollapsible>  <br/>  <ice:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo" > <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator"> <ice:outputText value="#{msgs['eventreg.eventform.detailLabel']}"/> </ice:panelGroup> </f:facet>

64

<br/> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <ice:panelTabSet style="width:99.5%" id="detailPanelTabSet"> <d:dynamictab tabs="${eventRegistrationFormController.dynamicDetailTabs}"/> </ice:panelTabSet> </ice:panelGroup> <br/> </ice:panelCollapsible>  <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:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:jsp="http://java.sun.com/JSP/Page" 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

<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"> <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="browserTitle">Event List</ui:define> <ui:define name="title">Event List</ui:define> <ui:define name="content"> <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}" closeButtonIcon="/resources/images/icon/popupclose.gif" icon="/resources/images/icon/icon_information.png" message="You Cannot Modify this data" yesActionListenerMethod="closeGrantModifyDisplayed" backingBean="${eventRegistrationController}" /> <ice:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo"> <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator" > <ice:outputText value="#{msgs['general.filterText']}"/> </ice:panelGroup> </f:facet> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <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:selectInputDate> <ice:panelGroup> <ice:commandButton style="vertical-align: middle;" accesskey="F" image="/resources/images/icon/icon_search.gif"










67

actionListener="#{eventRegistrationController.handleFilterOKButton}"></ice:commandButton> <ice:outputLabel value="#{msgs['general.filterButtonText']}" /> </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" partialSubmit="true" style="overflow: auto;" value="#{eventRegistrationController.filterEventTypeId}" valueChangeListener="#{masterDataController.handleEventTypeChange}"> <f:selectItems value="#{masterDataController.eventTypeSelectItems}"/> </ice:selectOneMenu> <ice:outputLabel value="#{msgs['eventreg.eventlist.eventSubTypeText']}: " for="eventSubTypeFilterSelectOneMenu"/> <ice:selectOneMenu id="eventSubTypeFilterSelectOneMenu" style="overflow: auto;" value="#{eventRegistrationController.filterEventSubTypeId}"> <f:selectItems value="#{masterDataController.eventSubTypeSelectItems}"/> </ice:selectOneMenu> <ice:outputLabel/> <ice:outputLabel value="#{msgs['eventreg.eventlist.departmentText']}: " for="deptFilterSelectOneMenu"/> <ice:selectOneMenu id="deptFilterSelectOneMenu" partialSubmit="true" style="overflow: auto;" value="#{eventRegistrationController.filterLocationDeptId}" valueChangeListener="#{masterDataController.handleDepartmentChange}"> <f:selectItems value="#{masterDataController.departmentSelectItems}"/> </ice:selectOneMenu> <ice:outputLabel value="#{msgs['eventreg.eventlist.sectionText']}: " for="sectionFilterSelectOneMenu"/> <ice:selectOneMenu id="sectionFilterSelectOneMenu" style="overflow: auto;" value="#{eventRegistrationController.filterLocationSectionId}"> <f:selectItems value="#{masterDataController.sectionSelectItems}"/> </ice:selectOneMenu> <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> </ice:panelCollapsible> <div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0" /></div>  <table border="0" cellpadding="0" cellspacing="0" class="toolbar"> <tr> <td valign="middle" style="padding:1px;"> <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;" title="Add" accesskey="a" id="eventlistAddButton" action="eventRegistrationForm" type="submit"/> <ice:outputLabel value="#{msgs['general.addButtonText']}" for="eventlistAddButton"/> </div> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <ice:commandButton image="/resources/images/icon/icon_edit.gif" style="vertical-align: middle;" title="Edit" accesskey="e" id="eventlistEditButton" actionListener="#{eventRegistrationController.handleEditButton}"/> <ice:outputLabel value="#{msgs['general.editButtonText']}" for="eventlistEditButton"/> </div> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <ice:commandButton image="/resources/images/icon/icon_delete.gif" style="vertical-align: middle;" title="Delete" accesskey="d" id="eventlistDeleteButton" actionListener="#{eventRegistrationController.openDeleteConfirm}"/> <ice:outputLabel value="#{msgs['general.deleteButtonText']}" for="eventlistDeleteButton"/> </div> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <ice:commandButton image="/resources/images/icon/icon_pdf.gif" style="vertical-align: middle;" 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" style="border:none;" title="Last Page"/> </f:facet> <f:facet name="previous"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-previous.gif" style="border:none;" title="Previous Page"/> </f:facet> <f:facet name="next"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-next.gif" style="border:none;" title="Next Page"/> </f:facet> <f:facet name="fastforward"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-ff.gif" style="border:none;" title="Fast Forward"/> </f:facet> <f:facet name="fastrewind"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-fr.gif" style="border:none;" 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:dataPaginator> </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}" /> <f:facet name="header"> <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> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.eventDateColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.eventDateColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.eventDate}"> <f:convertDateTime pattern="MMMM dd, yyyy HH:mm" timeZone="Asia/Jakarta"/> </ice:outputText> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.reportedDateColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.reportedDateColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.reportedDate}"> <f:convertDateTime pattern="MMMM dd, yyyy HH:mm" timeZone="Asia/Jakarta"/> </ice:outputText> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.locationSceneColumnName']}" arrow="true">

71

<ice:outputText value="#{msgs['eventreg.eventlist.locationSceneColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.locationScene}"/> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.caseShortDescriptionColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.caseShortDescriptionColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.caseShortDescription}"/> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.createByColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.createByColumnText']}"/> </ice:commandSortHeader> </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"> <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator" > <ice:outputText value="#{msgs['general.detailText']}"/> </ice:panelGroup> </f:facet> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <ice:panelTabSet binding="#{eventRegistrationController.detailTabSet}" tabChangeListener="#{eventRegistrationController.handleTabChange}" style="width:99.5%" id="detailPanelTabSet"> <d:dynamictab tabs="${eventRegistrationController.dynamicDetailTabs}" backingBean="${eventRegistrationController}"/> </ice:panelTabSet> </ice:panelGroup> </ice:panelCollapsible> </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:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" xmlns:jsp="http://java.sun.com/JSP/Page" 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> <ice:panelGrid columns="2" style="width:100%" 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> <ice:panelGrid columns="2" style="width:100%" 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 <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:fn="http://java.sun.com/jsp/jstl/functions" xmlns:d="http://www.dycode.com/jsf"> <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="browserTitle">Measurement List</ui:define> <ui:define name="title">Measurement List</ui:define> <ui:define name="content"> <ice:form id="measurementForm" partialSubmit="true"> <d:confirm rendered="${measurementController.deleteConfirmDisplayed}" closeButtonIcon="/resources/images/icon/popupclose.gif" icon="/resources/images/icon/icon_information.png" message="Are you sure to delete measurement code #{measurementController.selectedEvent.measurementCode} ?" noActionListenerMethod="closeDeleteConfirm" yesActionListenerMethod="handleDeleteButton" backingBean="${measurementController}" /> <d:accessDenied rendered="${measurementController.grantModifyDisplayed}" closeButtonIcon="/resources/images/icon/popupclose.gif" icon="/resources/images/icon/icon_information.png" 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;"> <f:facet name="header"> <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"> <ice:panelGrid columns="2" 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:selectOneMenu> </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:selectOneMenu> </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> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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:panelCollapsible style="width:100%;" expanded="true" styleClass="pnlClpsblDemo"> <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator" > <ice:outputText value="#{msgs['general.filterText']}"/> </ice:panelGroup> </f:facet> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <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:selectInputDate> <ice:outputLabel value="#{msgs['eventreg.eventlist.eventDateToFilterText']}: " for="eventDateToFilterInputDate"/> <ice:selectInputDate renderAsPopup="true" id="eventDateToFilterInputDate" value="#{measurementController.filterEventDateTo}"> </ice:selectInputDate> <ice:panelGroup> <ice:commandButton style="vertical-align: middle;" accesskey="F" image="/resources/images/icon/icon_search.gif" actionListener="#{measurementController.handleFilterOKButton}"></ice:commandButton> <ice:outputLabel value="#{msgs['general.filterButtonText']}" /> </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" partialSubmit="true" style="overflow: auto;" value="#{measurementController.filterEventTypeId}" valueChangeListener="#{masterDataController.handleEventTypeChange}"> <f:selectItems value="#{masterDataController.eventTypeSelectItems}"/> </ice:selectOneMenu> <ice:outputLabel value="#{msgs['eventreg.eventlist.eventSubTypeText']}: " for="eventSubTypeFilterSelectOneMenu"/> <ice:selectOneMenu id="eventSubTypeFilterSelectOneMenu" style="overflow: auto;" value="#{measurementController.filterEventSubTypeId}"> <f:selectItems value="#{masterDataController.eventSubTypeSelectItems}"/> </ice:selectOneMenu> <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" partialSubmit="true" style="overflow: auto;" value="#{measurementController.filterLocationDeptId}" valueChangeListener="#{masterDataController.handleDepartmentChange}"> <f:selectItems value="#{masterDataController.departmentSelectItems}"/> </ice:selectOneMenu> <ice:outputLabel value="#{msgs['eventreg.eventlist.sectionText']}: " for="sectionFilterSelectOneMenu"/> <ice:selectOneMenu id="sectionFilterSelectOneMenu" style="overflow: auto;" value="#{measurementController.filterLocationSectionId}"> <f:selectItems value="#{masterDataController.sectionSelectItems}"/> </ice:selectOneMenu> <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> </ice:panelCollapsible> <div style="height:3px;width:100%;clear:both"><img src="" alt="" width="0" height="0" /></div>

78

<table border="0" cellpadding="0" cellspacing="0" class="toolbar"> <tr> <td valign="middle" style="padding:1px;"> <div class="toolbar_button" style="width:95px;" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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> <div class="toolbar_button" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';"> <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;" onmouseout="this.className='toolbar_button';" onmouseover="this.className='toolbar_button_hover';">  <ice:commandButton image="/resources/images/icon/icon_information.png" style="vertical-align: middle;" 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" style="border:none;"

79

title="First Page"/> </f:facet> <f:facet name="last"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-last.gif" style="border:none;" title="Last Page"/> </f:facet> <f:facet name="previous"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-previous.gif" style="border:none;" title="Previous Page"/> </f:facet> <f:facet name="next"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-next.gif" style="border:none;" title="Next Page"/> </f:facet> <f:facet name="fastforward"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-ff.gif" style="border:none;" title="Fast Forward"/> </f:facet> <f:facet name="fastrewind"> <ice:graphicImage url="/xmlhttp/css/xp/css-images/arrow-fr.gif" style="border:none;" 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:dataPaginator> </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}" /> <f:facet name="header"> <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> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.eventDateColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.eventDateColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.eventDate}"> <f:convertDateTime type="both" timeZone="Asia/Jakarta"/> </ice:outputText> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.reportedDateColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.reportedDateColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.reportedDate}"> <f:convertDateTime type="both" timeZone="Asia/Jakarta"/> </ice:outputText> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.locationSceneColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.locationSceneColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.locationScene}"/> </ice:column> <ice:column> <f:facet name="header"> <ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.caseShortDescriptionColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.caseShortDescriptionColumnText']}"/> </ice:commandSortHeader> </f:facet> <ice:outputText value="#{event.caseShortDescription}"/> </ice:column> <ice:column> <f:facet name="header">

81

<ice:commandSortHeader columnName="#{msgs['eventreg.eventlist.createByColumnName']}" arrow="true"> <ice:outputText value="#{msgs['eventreg.eventlist.createByColumnText']}"/> </ice:commandSortHeader> </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"> <f:facet name="header"> <ice:panelGroup styleClass="expandableStateIndicator" > <ice:outputText value="#{msgs['general.detailText']}"/> </ice:panelGroup> </f:facet> <ice:panelGroup style="padding-top:5px;padding-bottom:5px;"> <ice:panelTabSet binding="#{measurementController.detailTabSet}" tabChangeListener="#{measurementController.handleTabChange}" style="width:99.5%" id="detailPanelTabSet"> <d:dynamictab tabs="${measurementController.dynamicDetailTabs}" backingBean="${measurementController}"/> </ice:panelTabSet> </ice:panelGroup> </ice:panelCollapsible> </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

Documents