• Tidak ada hasil yang ditemukan

T1__Full text Institutional Repository | Satya Wacana Christian University: Perancangan Aplikasi Sistem Pengolahan Data BBM dan KEPOKMAS Berbasis Web dengan Framework CodeIgniter: Studi Kasus Dinas Perdagangan Kota Salatiga T1 Full text

N/A
N/A
Protected

Academic year: 2018

Membagikan "T1__Full text Institutional Repository | Satya Wacana Christian University: Perancangan Aplikasi Sistem Pengolahan Data BBM dan KEPOKMAS Berbasis Web dengan Framework CodeIgniter: Studi Kasus Dinas Perdagangan Kota Salatiga T1 Full text"

Copied!
24
0
0

Teks penuh

(1)

Perancangan Aplikasi Sistem Pengolahan Data BBM dan

KEPOKMAS Berbasis

Web dengan Framework CodeIgniter

( Studi Kasus : Dinas Perdagangan Kota Salatiga )

Artikel Ilmiah

Diajukan kepada Fakultas Teknologi Informasi untuk memperoleh Gelar Sarjana Komputer

Peneliti

Ajik Sulistyo Hadi

672013182

Program Studi Teknik Informatika

Fakultas Teknologi Informasi

Universitas Kristen Satya Wacana

(2)
(3)
(4)
(5)
(6)
(7)
(8)

8

1. Pendahuluan

Perkembangan teknologi informasi yang sangat pesat telah membawa dunia ke era baru yang belum pernah terbayangkan sebelumnya. Teknologi informasi dapat menunjang dan meningkatkan produktivitas untuk berbagai jenis kegiatan khususnya dalam bidang pekerjaan. Banyak perusahaan atau instansi sekarang menggunakan aplikasi web untuk menunjang pekerjaan karyawan dalam hal komunikasi, hiburan serta mengolah data dan informasi.

Dinas Perdagangan Kota Salatiga merupakan instansi yang membantu walikota dalam menyelenggarakan pelayanan, penyediaan informasi, pemantauan dan pemberian fasilitas usaha perdagangan serta melaksanakan penataan usaha perdagangan secara sinergis dengan usaha ekonomi kerakyatan dalam memajukan potensi daerah[1]. Dinas Perdagangan saat ini merupakan bidang independen yang sebelumnya bergabung di Dinas Perindustrian Perdagangan dan Koperasi (Disperindagkop), sehingga saat ini merupakan bidang yang sedang berkembang dalam hal teknologi informasi khususnya yang memiliki platfrom web sesuai dengan kemampuan dalam bidang web engineering.

Dinas Perdagangan Kota Salatiga mempunyai tugas melakukan pelayanan memantau dan mengolah data terhadap usaha perdagangan seperti pemantauan data BBM (Bahan Bakar Minyak) perbulan yang ada di SPBU (Stasiun Pengisian Bahan Bakar Umum) untuk mengetahui realisasi pemakaian BBM di Kota Salatiga dan pemantauan stabilitas harga produk KEPOKMAS (Kebutuhan Pokok Masyarakat). SPBU perlu menyerahkan data BBM yang berisi stock awal, Jumlah penerimaan, jumlah penjualan, stock akhir, dan vol.tera dalam bentuk liter yang akan di ambil pegawai. Pemantauan stabilitas harga produk KEPOKMAS yang dilakukan petugas dengan mengambil sempel harga produk ditempat dan merekapitulasi data harga untuk mendapatkan harga rata-rata produk dan perubahan harga produk setiap hari di Kota Salatiga yang akan dilaporkan ke Disperindakop Provinsi khususnya pada tim pengendali inflasi daerah.

(9)

9

Sistem berbasis web ini dapat diakses dimana saja, dapat berjalan di semua sistem operasi, dapat diakses lewat computer. Sistem ini juga menggunakan framework codeigniter. Framework ini mempunyai kelebihan yaitu open source, berjalan di semua versi PHP. Program hanya membutuhkan resource yang sedikit sehingga program berjalan dengan ringan dan cepat. Framework ini menggunakan model, view, controller (MVC). Proses kerja framework memudahkan programmer dalam membuat web. Dokumentasi yang lengkap mulai dari langkah instalasi sampai dengan fungsi / class dalam pembuatan web, dan memiliki pustaka yang lengkap [2].

2. Tinjauan Pustaka

Penelitian mengenai sistem informasi pelaporan telah beberapa kali dilakukan. Pada penelitian sebelumnya yang berjudul Perancangan dan Pengembangan Sistem Pelaporan Terpadu Sistem Informasi Puskesmas (SPT SIMPUS) dengan Metode BPR (Business Process Redesign). Pembuatan aplikasi ini menggunakan framework CakePHP untuk menerapkan arsitektur MVC, Fpdf untuk menghasilkan berkas pdf, Open Flash Chart untuk menampilkan grafik peyebaran penyakit di setiap desa, grafik cakupan pasien per kelompok umur, grafik

epidemiologi, dan rekapitulasi pemakaian obat, format gambar GIF (Graphic Interchange Format) dengan warna hitam sebagai garis pembatas desa dan warna putih sebagai wilayah desa, dan untuk pemetaan menggunakan Pustaka GD (Graphics Draw) untuk memanipulasi gambar. Sistem ini dikembangkan tanpa login dengan tujuan agar seluruh pegawai dapat menggunakannya di jaringan lokal [3].

Penelitian lain dengan judul Perancangan Sistem Informasi Pelaporan Monografi Berbasis Web (Studi Kasus Pada Kantor Kecamatan Semarang Utara) yang membahas tentang penggunaan PHP dan MySQL dalam pembuatan sebuah sitem informasi pelaporan yang menjadikan pelaporan monografi dapat mempercepat rekapitulasi data karena data telah tersedia tinggal di-download menurut filter sehingga mempermudah dan mempercepat pekerjaan dalam pengelolaan data laporan monografi[4].

Berdasarkan penelitian di atas, persamaan yang dibahas ini pada teknologi yang digunakan berbasis web, mengunakan PHP, dan MySQL. Persamaan lain dari penelitian ini untuk merekap dan pengarsipan data. Jika dibandingkan dengan penelitian terdahulu, penelitian yang dilakukan ini berfokus pada bagaimana membuat Perancangan Sistem pengolahan data BBM dan KEPOKMAS Berbasis Web dan menggunakan teknologi bahasa pemograman framework CodeIgniter dan library DataTables. Penggunaan bahasa pemograman CodeIgniter membuat program lebih terstruktur, mudah untuk mengelola, mudah untuk dikembangkan dengan adanya fitur MVC (Model-View-Controller)[5].

(10)

10

prakteknya, hal itu memungkinkan halaman web untuk memuat script kecil karena presentasi terpisah dari scripting PHP.

Model merepresentasikan struktur data. Biasanya kelas model akan berisi fungsi yang membantu mengambil, memasukkan, dan men-update informasi dalam database.

View adalah informasi yang sedang disajikan kepada pengguna. sebuah View biasanya akan menjadi halaman web, tetapi dalam CodeIgniter, view dapat juga menjadi fragmen halaman seperti header atau footer. Hal ini juga dapat menjadi halaman RSS, atau jenis lain dari "halaman website ".

Controller berfungsi sebagai perantara antara Model, View, dan resource lainnya yang dibutuhkan untuk memproses request dan menghasilkan suatu halaman web[5].

DataTables adalah plugin yang di bangun dari jquery untuk menampilkan data dalam bentuk tabel dan sudah terintegrasi search form dan pagination untuk penomoran data pada tabel. Sehingga tidak perlu lagi membuat form pencarian pada aplikasi, dan tidak perlu lagi membuat pagination sendiri. Kelebihan dari datatables ini adalah dapat mengintegrasikan pagination dan search form pada tabel data yang di buat. Fitur dari datatables yang digunkanan untuk aplikasi sebagai berikut. Pagination, instant search and multi-column ordering, memungkinkan aplikasi untuk melakukan pembuatan halaman secara otomatis, melakukan pencarian secara langsung berdasarkan data yang ingin di cari dan melakukan multi order dari ascending ke descending atau sebaliknya. Easily theme-able DataTables, jQueryUI, Bootstrap, Foundation memungkinkan aplikasi untuk menggunakan tema dalam dataTables, Jquery UI, Bootstrap ,dan fundation guna untuk memperindah tampilan. Smart handling of column widths, Memungkinkan aplikasi melakukan auto width column mengikuti ukuran layar. Fitur tersebut dapat di jalankan dengan menggunakan fungsi tertentu dan semua sudah di berikan oleh dataTables[6].

3. Metode dan Perancangan Sistem

Pada penelitian ini, akan dilakukan beberapa tahapan penelitian yang secara garis besar terbagi ke dalam lima tahapan, yaitu : 1) Analisis kebutuhan dan pengumpulan data yang diperlukan; 2) Perancangan sistem; 3) Implementasi dan pengujian sistem, serta analisis hasil pengujian; dan 4) Penulisan laporan hasil penelitian. Tahapan yang dilakukan dalam penelitian ini dapat dilihat pada Gambar 1.

(11)

11

Gambar 1 dapat dijelaskan bahwa tahapan penelitian yang dilakukan adalah sebagai berikut: Tahap pertama: analisis kebutuhan serta pengumpulan data merupakan tahapan dalam identifikasi permasalahan yang dihadapi oleh pegawai dalam melaksanakan tugasnya terkait dengan Perancangan Sistem pengolahan data BBM dan KEPOKMAS. Identifikasi permasalahan dilakukan berdasarkan hasil wawancara dengan pegawai pemantauan stabilitas harga produk dan pelaporan SPBU, guna mendapatkan data, proses bisnis sebelum aplikasi serta menentukan system requirement pada pembuatan Sistem Informasi Pelaporan SPBU.

Gambar 2Proses Bisnis Pemantauan Harga Produk Dinas Perdagangan Kota Salatiga. Gambar 2 menjelaskan proses bisnis Pemantauan stabilitas harga produk oleh pegawai di Dinas Perdagangan Kota Salatiga di mana pegawai melaksanakan tugas pemantauan stabilitas harga produk KEPOKMAS datang langsung ke tempat, mengambil beberapa sempel harga produk dan merekapitulasi data harga untuk mendapatkan harga rata-rata produk dan perubahan harga produk setiap hari. Pegawai mulai men-input, merekap, mengelola dan menyusun laporan hasil pemantauan stabilitas harga produk menggunakan Microsoft Office Excel. Laporan diserahkan kepada Kepala pegawai untuk diserahkan ke Kepala Kasi Perdagangan untuk diteliti. Setelah menerima laporan dari Kepala pegawai, Kepala Kasi Perdagangan meneliti, jika merasa sudah benar maka memaraf hasil pemantauan stabilitas harga produk dan mengajukan hasil laporan ke Sekertaris Dinas Perdagangan kemudian Sekertaris memeriksa dan memaraf hasil laporan dan mengajukan penandatangangan ke Kepala Dinas Perdagangan. Kepala Dinas Perdagangan menandatangani laporan hasil pemantauan produk dan di kembalikan ke pegawai, kemudian laporan hasil pemantauan stabilitas harga produk dimintakan nomor agenda ke bagian kesekretariatan untuk mengirim laporan ke Disperindakop Povinsi.

(12)

12

Tahap berikutnya yaitu pembuatan aplikasi/sistem. Model Prototype digunakan sebagai metode pengembangan sistem. Model Prototype merupakan metode yang menyajikan gambaran lengkap tentang sistemnya, user dapat melihat pemodelan sistem dari sisi tampilan maupun teknik prosedural yang akan dibangun[7]. Gambar mengenai model prototype dapat dilihat pada Gambar 2.

Gambar 3 Metode Prototyping [6]

Tahap - tahap dalam model prototype pada Gambar 2 adalah : (1) Listen To Costumer, (2) Build, (3) Customer Test. Pada tahap pertama didapatkan kebutuhan sistem yaitu aplikasi mengolah data serta melakukan perhitungan strata secara otomatis yang kemudian hasil dari perhitungan data tersebut terintegrasi. Kebutuhan tersebut didapatkan melalui tahap analisis kebutuhan dan pengumpulan data dari tahapan penelitian yang dilakukan. Tahap Build merupakan tahapan perancangan serta pembuatan aplikasi. Perancangan sistem dalam penelitian ini dibuat dalam bentuk diagram UML, meliputi use case diagram, activity diagram, sequence diagram dan class diagram[6].

Use case digunakan untuk membentuk tingkah laku benda/ things dalam sebuah model serta dalam realisasikan oleh sebuah collaboration. Umumnya sebuah use case digambarkan dengan elips dengan garis yang solid, biasanya mengandung nama.

Pada use casediagram dibawah ini, dapat di lihat bahwa sistem pengolahan data BBM dan KEPOKMAS Kota Salatiga memiliki tiga pengguna yaitu Manager SPBU , Petugas dan Pegawai Dinas Perdagangan.

(13)

13

no.SPBU, alamat, nama manager, no.telepon, dapat di-update oleh meneger kecuali no.SPBU karena no.SPBU tidak dapat berubah atau sudah dipantenkan oleh pegawai.

Pegawai hanya bisa melihat data report SPBU karea yang bisa melakukan CRUD adalah manager SPBU. Pegawai dapat melakukan proses mengelola data

pengguna yang terdiri dari view data pengguna, insert pengguna baru, update pengguna, dan delete pengguna. Pegawai juga dapat mengelola semua harga produk kemudian merata-rata harga produk perhari dan perbulan untuk mendapatkan report yang diinginkan. Petugas dapat mengelola data harga produk menggunakan CRUD (update, insert, delete) dan men-update data profil petugas itu sendiri.

Activity Diagram memberikan gambaran bagaimana sistem berinteraksi dengan pengguna dan/atau dengan sistem lain. Berikut merupakan Activity Diagram dari fungsi pengolahan data BBM dan KEPOKMAS. Aktivitas dimulai dengan login terlebih dahulu kemudian akan masuk ke tampilan menu utama. Di dalam sistem ini terdapat pegawai, manager SPBU dan petugas dimana manager dan petugas bisa masuk ke sistem jika sudah mempunyai username dan password yang akan didaftarkan dan diberikan oleh pegawai terlebih dahulu.

Gambar 5 Activity Diagram Download Data Report

Dari Gambar 5 merupakan Activity Diagram Download Data Report yang dilakukan oleh pegawai. Setelah login berjalan sukses, pegawai akan masuk ke menu utama yang berisi menu BBM dan menu KEPOKMAS. Pegawai bisa memilih menu BBM atau KEPOKMAS untuk men-download data report yang diinginkan. Pilih menu downloadReport danmen-filter untuk memilih data report yang diinginkandan men-download .

(14)

14

Gambar 6 merupakan Activity Diagram Upload Data Report BBM yang dilakukan oleh manager SPBU. Manager SPBU akan login menggunakan username dan password terlebih dahulu. Jika login berjalan sukses, akan masuk menu utama di mana terdapat beberapa pilihan dan melengengkapi data SPBU terlebih dahulu. Pilih menu Upload data report kemudian men-upload data report dalam bentuk excel. Pilih menu data report untuk mengecek data report yang di -upload sudah benar atau belum. Manager SPBU dapat men-update dan men-delete data yang salah.

Sequence diagram, digunakan untuk menggambarkan interaksi yang tersedia antar komponen di dalam dan di sekitar sistem (pengguna, interface, dan sebagainya) dalam bentuk pesan dan digambarkan terhadap waktu. Sequence diagram dapat menggambarkan skenario dan langkah-langkah yang dilakukan sehingga mendapatkan sebuah hasil.

Gambar 7 SequenceDiagram Tambah Data Pengguna

Gambar 7 merupakan sequence diagram untuk melakukan tambah data penggna. Pegawai menambah data pengguna dengan memasukkan Username, password , dan level. Setelah pegawai mengisi maka klik tombol tambah, data akan disimpan kedalam database dan di tampilkan pada menu data pengguna.

Class diagram menggambarkan keadaan (atribut/poperti) suatu sistem. Sekaligus menawarkan lanyanan untuk memanipulasi keadaan tersebut (metode/fungsi) suatu sistem. Class diagram juga menggambarkan struktur dan diskripsi class, packing dan objek beserta hubungan satu sama lain seperti pewarisan, asosiasi, dan lain-lain.

Gambar 8 Class Diagram Sistem Pengolahan Data BBM.

(15)

15

memiliki fungsi/method seperti insert, update, delete yang digunakan. Class yang digunakan juga memiliki beberapa entity class yang bersangkutan seperti report_entity, BBM_entity, SPBU_entity, dan pengguna_entity.

Gambar 9 Class Diagram Sistem Pengolahan Data KEPOKMAS.

Gambar 9 merupakan class diagram sistem pengolahan Data KEPOKMAS. Class Produk memiliki relasi dengan class Harga_Produk_Perpasar, class Rata-rata_Harga_Produk_perhari, class Rata-rata_Harga_Produk_perbulan dimana setiap class memiliki satu data produk dari class Produk. Rata-rata_Harga_Produk_perhari memiliki attribut yaitu Nama_Produk, Satuan, Rata-rata_Harga_Kemarin, Rata-rata_Harga_Sekarang, Naik_Turun, Persen, Keterangan. Penghitungan rata-rata perhari dilakukan dengan mengambil data di class Harga_Produk_Perpasar yang menghitung rata-rata harga produk dari setiap data laporan pasar perhari yang masuk setiap hari.

Perancangan interface dilakukan agar pembuatan sistem lebih mudah dan terarah. Interface yang dibuat dapat berupa input maupun output data untuk menampilkan informasi. interface yang dirancang bersifat user friendly dengan tujuan agar pengguna dapat menggunakan sistem yang telah dibuat dengan nyaman dan mudah.

Gambar 10 Desain Interface Halaman Utama Pegawai

(16)

16

menu Rata-rata Harga Produk Perhari, menu Rata-rata Harga Produk Perbulan, dan menu Grafik. Konten menampilkan menu yang dipilih dari menu utama.

Gambar 11 Desain Arsitektur Pengolahan Data KEPOKMAS

Gambar 11 merupakan desain arsitektur pengolahan data KEPOKMAS. Sistem pengolahan data KEPOKMAS ini user interface dibagi dalam 4 bagian yaitu : user interface data pengguna, profil pasar, produk, dan harga produk. Controller berfungsi sebagai penghubung user interface dengan database yang dibagi menjadi 6 bagian yaitu : controller untuk kelola data pengguna, kelola data profil pasar, kelola produk, kelola harga produk pasar perhari, kelola rata-rata harga produk perhari, dan kelola rata-rata harga produk perbulan. Database memiliki 6 entity yaitu: Pengguna_Entity, Profil_Pasar_Entity, Produk_Entity, Harga_Produk_Pasar_Perhari_Entity.

Gambar 12 Desain Arsitektur Pengolahan DataBBM

(17)

17

4. Hasil dan Pembahasan

Hasil dari penelitian ini merupakan aplikasi dalam bentuk website yang di implementasikan menggunakan browser. Seperti yang telah dijelaskan sebelumnya mengenai CodeIgniter, aplikasi ini dibuat menggunakan metode Model, View, Controller, berikut hasil dan pembahasan sistem. Router digunakan untuk memetakan permintaan atau request ke dalam class controller di dalam aplikasi yang dibuat. Saat mengakses suatu alamat website, permintaan tersebut tidak menyertakan nama controller apa yang akan dibuka tetapi secara default bisa diarahkan agar otomatis akan membuka controller sesuai yang telah definisikan pada router. Konfigurasi router dapat dilihat pada Kode Program 1. Kode Program 1 Konfigurasi Router

Default controller pada sistem pengolahan data BBM dan KEPOKMAS adalah controller Welcome. Sistem dijalankan, controller Welcome akan menjalankan function index yang mengarah ke halaman Login.

Aplikasi sistem pengolahan data BBM da KEPOKMAS memiliki 3 user yang berbeda yaitu pegawai Dinas Perdagangan, petugas pasar dan manager. Pegawai Dinas memiliki hak akses penuh untuk pengoperasisan aplikasi seperti melihat,merekap,men-download data yang dimiliki semua SPBU dan Pasar. Petugas pasar dan manager SPBU hanya bisa melihat dan men-upload data yang dimiliki pasar atau SPBU itu sendiri. 3 user dapat di akses melalui halaman login yang sama karena halaman login dibuat menggunakan login multi user. Perbedaan 3 user saat melakukan login terletak dalam hak akses yang dimiliki user.

Gambar 13 Tampilan Menu Beranda Pelaporan BBM

Gambar 13 merupakan tampilan beranda setelah manager SPBU melakukan login. Dalam tampilan beranda terdapat form profil seperti nomor telepon, alamat dan manager yang harus di-update terlebih dahulu saat pertama kali melakukan login untuk memenuhi data profil.

1.$route['default_controller'] = ‘Welcome';

2.$route['404_override'] = '';

(18)

18 Kode Program 2. Controller Update Profil SPBU

Kode Program 2 merupakn fungsi update profil pada controller. Baris 3 samapi 6 merupakan kode program untuk menampilkan atribut yang akan di-update pada profil SPBU. Baris 7 digunakan untuk melakukan validasi terhadap data mana yang akan di-update berdasarkan nomor SPBU.

Terdapat 4 menu utama yang dapat di akses oleh menager SPBU setelah melakukan login yaitu menu Beranda yang menampil halaman profil SPBU seperti Gambar 13 diatas. Menu Data Laporan BBM yang berisi data-data laporan BBM perbulan yang telah di-upload terlebih dahulu di menu Upload Data. Menu Ganti Password adalah halaman menu yang digunakan untuk mengganti password.

Gambar 14 Tampilan Menu Upload Data BBM

Tampilan menu upload data BBM pada Gambar 14 terdapat atribut kategori seperti bulan dan tahun yang dipilih dahulu. Menyiapkan file dalam format excel (.xlsx) sebelum melakukan upload data pasar dan setelah melakukan upload data BBM maka akan disimpan dan dapat dilihat di menu Data Laporan BBM.

Kode Program 3 Controller Upload DataBBM

1. public function updateprof_clientDB(){

7. $condition['no_spbu'] = $this->input->post('no_spbu'); 8. try {$this->m_profil->updateprof_client($data, $condition);

6. $error = array('error' => $this->upload->display_errors());

7. $this->session->set_flashdata('msg','Ada kesalaha dalam upload Data BBM!'); 8. redirect('Welcome/upload_report');

(19)

19

Kode Program 3 merupakan controller upload data BBM. Pada baris 2 sampai 4 merupakan config buat upload dan tipe file yang bisa di-upload. Pada baris 7 dan 8 untuk mengecek file jika validasi file gagal, kirim parameter error. Baris 9 merupakan kode program untuk mengecek nama BBM yang tersimpan pada halaman admin dan satuan terdaftar atau tidak di dalam data produk. Baris 11 sampai 16 kode program dimana data di dalam excel setelah di validasi akan dimasukkan dalam array dengan nama $data sebelum disimpan dan redirect ke data laporan BBM.

Data laporan BBM perbulan seluruh SPBU yang di-upload oleh setiap manager SPBU tersimpan di database dan akan di tampilkan pada halaman menu daftar laporan SPBU yang dimiliki admin atau pegawai seperti Gambar 15 di bawah ini.

Gambar 15 Tampilan Data Laporan BBM

Menu Data Laporan berisi data laporan BBM perbulan setiap SPBU yang telah di-upload terlebih dahulu oleh manager SPBU seperti Gambar 15. Dalam menu Data Laporan terdapat tambahan beberapa search filter no.SPBU, bulan Dan tahun yang terdapat pada bagian atas table untuk mempermudah pegawai mencari data laporan BBM yang dimiliki setiap SPBU.

Kode Program 4. ControllerSearch Filter Data Laporan BBM

Kode program 4 merupakan fungsi search filter pada controller. Pada baris 2 dan 3 merupakan function yang digunakan untuk memilih kategori yang akan di searchfilter dan baris 4 merupakan kode program untuk mengecek dalam database melalui model. Function memilih kategori dan mengecek akan dilakukan berulang kali sampai baris 16.

(20)

20

Gambar 16 Tampilan Menu Beranda Pelaporan KEPOKMAS

Gambar 16 merupakan tampilan beranda setelah petugas pasar melakukan login. Dalam tampilan beranda terdapat form profil seperti nomor telepon, alamat dan nama petugas yang harus di-update terlebih dahulu saat pertama kali melakukan login untuk memenuhi data profil.

Gambar 17 Tampilan Menu Data Laporan KEPOKMAS Perpasar

Tampilan Menu Data Laporan KEPOKMAS Perpasar pada Gambar 17 diatas merupakan halaman untuk menampilkan data KEPOKMAS hasil dari upload yang dilakukan petugas pasar. Terdapat form Search Filter yang digunakan untuk mencari data yang di inginkan dengan cara memilih kategori yang telah disediakan terlebih dahulu. Kode program Controller Search Filter KEPOKMAS hampir sama dengan kode program Controller Search Filter Data Laporan BBM yang membedakan class penyimpanan yang berada di model.

(21)

21

Gambar 18 Tampilan Menu Rata-Rata Perhari

Tampilan menu Rata-Rata Perhari pada Gambar 18 berisi sebelas atribut yaitu hari, tanggal ,bulan, tahun, nama produk, satuan, harga kemarin, harga sekarang, naik atu turun, persentase, dan keterangan. Harga kemarin dan harga sekarang yang terisi dari hasil rata-rata harga produk tiap pasar yang di-upload oleh petugas pasar sebelumnya. Harga naik atau turun dari hasil pengurangan harga sekarang dengan harga kemarin dan persentase dari harga sekarang – harga kemarin / 100.

Kode Program 5. Model Rata-rata Perhari

Kode program 5 menampilkan cara mencari rata-rata perhari dari data laporan pasar perhari. Baris 2 adalah function untuk mendapatkan rata-rata dari tabel_pasar_perhari. Baris 4 menggunakan function group_by untuk mengelompokkan beberapa data dan baris ke 7 terdapat order_bay perintah yang digunakan untuk menampilkan data secara terurut berdasarkan nilai tertentu.

Gambar 19 Tampilan Menu Rata-Rata Perbulan

Gambar 19 merupakan tampilan menu rata-rata perbulan yang berisi data dari hasil perhitungan rata-rata jumlah harga produk pada bulan dan tahun yang

1. function getrataperhari(){

2. $this->db->select("*, AVG(tabel_pasar_perhari.harga) 'rata'"); 3. $this->db->from("tabel_pasar_perhari");

4. $this->db-> group_by("tabel_pasar_perhari.tanggal, 5. tabel_pasar_perhari.bulan,tabel_pasar_perhari.tahun,

6. tabel_pasar_perhari.nama_produk, tabel_pasar_perhari.satuan"); 7. $this->db->order_by("tabel_pasar_perhari.nama_produk,

8. tabel_pasar_perhari.tahun, tabel_pasar_perhari.bulan, 9. tabel_pasar_perhari.hari");

(22)

22

sama dari rata-rata perhari. Atribut yang ada pada rata-rata bulan sama dengan atribut rata-rata perhari.

Data yang ditampilkan pada menu rata-rata perhari KEPOKMAS, rata-rata perbulan KEPOKMAS dan download data laporan BBM yang di miliki pegawai dapat langsung dicetak dalam bentuk excel, pdf, di-copy dan searching laporan menggunakan library datatables. Pada penggunaan fungsi dari library datatables mempermudah pegawai dalam melakukan cetak laporan, ordering laporan, dan searching data laporan yang diinginkan.

Kode Program 6. Fungsi Searcing menggunakan Library Datatables

Kode Program 6 merupakan Searcing data menggunakan Library Datatables

menampilkan data sesuai kategori yang dituliskan. Pada penggunaan fungsi

Searcing ditampilkan data sesuai coloum yang mana pada setiap coloum kategori menjadi row grouping sebagai pemisah antar kategori data.

Perbandingan pada proses bisnis sebelum dan sesudah menggunakan aplikasi yaitu validasi pelaporan sebelumnya masih menggunakan kertas yang disetujui oleh manager SPBU. Setelah adanya sistem, validasi pelaporan menggunakan hak akses yang diberikan dari pegawai Dinas Perdagangan.

Pengujian alpha menggunakan metode blackbox yaitu pengujian fungsi-fungsi sistem secara langsung tanpa memperhatikan alur eksekusi program. Pengujian ini dilakukan dengan memperhatikan apakah fungsi telah berjalan sesuai rancangan dan sesuai yang diharapkan. Tabel 1 adalah hasil pengujian dari sistem yang telah dilakukan.

Tabel 1 Hasil Pengujian Blackbox

Fungsi yang diuji Kondisi Output yang

diharapkan

Output yang dihasilkan sistem

Status Pengujian

Login Username dan password

benar

Tambah Data Pengguna Form diisi dengan benar

Form wajib diisi kosong

Ubah Data Profil Form diisi dengan benar Suksesubah data Sukses ubah data Valid

Tambah Data Produk/BBM

Form diisi dengan benar Sukses tambah data Sukses tambah data Valid

Hapus Data Produk/BBM

Pilih salah satu data Sukses hapus data Sukses hapus data Valid

Menampilkan data

Menampilkan data Buka halaman data Sukses menampilkan Sukses menampilkan Valid 1. function( elem ) {

2. return !Expr.pseudos["empty"]( elem );}, 3. "header": function( elem ) {

4. return rheader.test( elem.nodeName );}, 5. "input": function( elem ) {

6. return rinputs.test( elem.nodeName );}, 7. "button": function( elem ) {

8. var name = elem.nodeName.toLowerCase();

9. return name === "input" && elem.type === "button" || name === 10. "button";},"text": function( elem ) {

11. var attr;

(23)

23

Download Data Laporan Membuka halaman

Download Upload Data Laporan Buka halaman Upload

Data Laporan

Sukses Upload Sukses data upload

tersimpan

Valid

Ganti Password Buka halaman Ganti

Password

Sukses Ganti password password baru sukses tersimpan

Valid

Berdasarkan pengujian yang dilakukan pada aplikasi web dapat dilihat status pengujian dari setiap fungsi valid, maka disimpulkan bahwa aplikasi ini berjalan dengan baik dan sesuai yang diharapkan. Pengujian beta adalah pengujian yang dilakukan oleh orang yang tidak ikut dalam pembuatan aplikasi atau calon pengguna aplikasi. Pengujian beta dilakukan dengan menggunakan kuesioner, yaitu dengan melakukan tanya jawab melalui telfon kepada sampleuser. Sampleuser berjumlah 15 responden dan dipilih secara acak, sample user pada pengujian ini adalah pegawai Dinas Perdagangan Kota Salatiga.

Tabel 2 Hasil Jawaban Kuesioner

No Pernyataan STS TS CS S SS

1 Aplikasi aplikasi ini mudah digunakan 0 0 1 9 5

2 Tampilan, huruf dan gambar dari aplikasi ini dapat dilihat

dengan jelas

0 0 4 6 5

3 Menu-menu pada aplikasi ini mudah dipahami dan tidak

membingungkan

0 1 3 3 8

4 Aplikasi ini membantu dalam melakukan pengelolaan data

pekerjaan

0 0 1 10 4

5 Aplikasi ini membantu dalam melakukan pengelolaan hasil

pengujian sample

0 0 3 6 6

6 Aplikasi ini bermanfaat untuk menyimpan arsip hasil laporan 0 0 2 6 7

Setelah semua jawaban diketahui maka yang dilakukan adalah menghitung presentase jawaban responden yang telah mengisi kuesioner.

Rumus Index % = ∑ Skor:Y*100% (1)

Rumus 1 adalah rumus untuk menghitung presentase jawaban responden. Hasil analisa untuk pertanyaan pertama didapatkan index 93,33% responden setuju jika aplikasi sistem pengolah data mudah digunakan. Untuk pertanyaan kedua 73,33% responden setuju bahwa huruf dan gambar pada aplikasi sistem pengolahan data dapat dilihat dengan jelas. Untuk pertanyaan ketiga 73,33% responden setuju bahwa menu pada aplikasi sistem pengolahan data mudah untuk dipahami dan tidak membingungkan. Untuk pertanyaan keempat 93,33% responden setuju bahwa aplikasi sistem pengolahan data membantu dalam melakukan pengelolaan data hasil pekerjaan. Untuk pertanyaan kelima 80,00% responden setuju bahwa aplikasi sistem pengolahan data membantu dalam melakukan pengelolaan hasil pengujian sample. Untuk pertanyaan keenam 86,66% responden setuju bahwa aplikasi pengolahan data bermanfaat untuk menyimpan arsip hasil uji pengujian.

(24)

24

dan pengumpulan data pekerjaan pegawai dan dalam melakukan pencarian arsip laporan lebih cepat dan tertata dengan baik.

5. Simpulan

Berdasarkan penelitian yang telah dilakukan, Perancangan Aplikasi Pengolahan Data BBM dan KEPOKMAS dapat dirancang menggunakan Framework Codeigniter dan library Datatables. Pengunaan CodeIgniter dengan konsep MVC bermanfaat untuk penulisan kode program lebih terstruktur dan lebih aman karena user tidak berhubungan secara langsung dengan database. Selain itu, Codeigniter menyediakan fungsi insert, read, update dan delete yang mempermudah serta mempercepat dalam pembuatan aplikasi dan penggunaan DataTables yang di bangun dari jquery untuk menampilkan data dalam bentuk tabel yang sudah terintegrasi search form dan pagination untuk penomoran data pada tabel. Sehingga tidak perlu lagi membuat form pencarian pada aplikasi, dan tidak perlu lagi membuat pagination sendiri.

Hasil pengujian aplikasi menunjukkan bahwa aplikasi Sistem Pengolahan Data BBM dan KEPOKMAS dapat menyelesaikan permasalahan yang ada pada pelaporan data BBM dan KEPOKMAS di Dinas Perdagangan. Seperti pegawai dapat mengakses data pelaporan yang di-upload oleh manager SPBU dan petugas pasar secara online. Sebelum adanya sistem, anggaran untuk mengumpulkan laporan yaitu Rp. 20.000, waktu yang dibutuhkan ±2 jam dan input data ke excel dibutuhkan waktu ±2 hari. Setelah adanya sistem, tidak mengeluarkan anggaran untuk pengambilan laporan. Waktu yang dibutuhkan untuk input dan pengumpulan data ±8 jam. Dengan adanya aplikasi pelaporan data BBM dan KEPOKMAS juga mempermudah pegawai Dinas Perdagangan untuk merekap, mengelola dan menyimpan data pelaporan secara terstruktur.

6. Daftar Pustaka

[1] Supono. Vidiandry,P. 2016. ‘Pemograman Web Menggunakan PHP dan

Framework Codeigniter’. –Ed. 1(1). Yogyakarta : Deepublish.

[2] Roy,RW. Noor,I. Achmad,J. 2009. ‘Perancangan Dan Pengembangan

sistem Pelaporan Terpadu Sistem Informasi Puskesmas (SPT SIMPUS)

Dengan Metode BPR’. Jurnal Ilmiah Kursor Menuju Solusi Teknologi Informasi. vol 5. No 2.

[3] Danang,J. Qorinta,S. Fitro,N. 2013. ‘Perancangan Sistem Informasi

Pelaporan Monografi Berbasis Web (Studi Kasus Pada Kantor Kecamatan Semarang Utara)’. Jurnal Speed - Sentra penelitian Engineering dan Edukasi. vol 5. No 2.

[4] Eka,W,H. 2011. ‘Penerapan Pola Hierachical Model-View-Controller Pada

Rekayasa Sistem Berbasis Web Framework’. Jurnal Teknologi Technoscientia, v ol 3. No 2.

[5] Peraturan Walikota Salatiga, 2016, ‘Tugas Dan Fungsi Serta Tata Kerja

Dinas Perdagangan’, Salatiga, Dinas Perdangangan.

[6] DataTables, 2017. DataTables. Diakses tanggal 24 mei 2017 darihttps://datatables.net..

Gambar

tabel data yang di buat. Fitur dari datatables yang digunkanan untuk aplikasi
Gambar 1 dapat dijelaskan bahwa tahapan penelitian yang dilakukan adalah
Gambar 3 Metode Prototyping [6]
Gambar 5  Activity Diagram Download Data Report
+7

Referensi

Dokumen terkait

Membran silika yang optimum untuk menurunkan warna dan kekeruhan diperoleh dari massa campuran silika 5 gram (28,65 %wt) dengan % volume limbah 100%. Saran yang dapat

Proyek REDD+ yang berada di lokasi dengan karbon rendah dan keanekagaraman hayati tinggi tidak dapat memberikan hasil yang serentak antara reduksi emisi atau. peningkatan karbon,

[r]

buat ramuan buah mengkudu mengatasi kulit bersisik dengan metode, area kulit yang bersisik digosok dengan buah mengkudu tersebut hingga merata, serta diIzinkan sepanjang 5-10

KONSTRUKSI LEMBAR KERJA SISWA POLA 5M BERMUATAN NILAI KREATIF BAGI SISWA SMA KELAS X DALAM PERANCANGAN ALAT UJI DAYA HANTAR LISTRIK LARUTAN.. Universitas Pendidikan Indonesia |

KONSTRUKSI LEMBAR KERJA SISWA POLA 5M BERMUATAN NILAI KREATIF BAGI SISWA SMA KELAS X DALAM PERANCANGAN ALAT UJI DAYA HANTAR LISTRIK LARUTAN.. Universitas Pendidikan Indonesia |

Buah labu yang dimakan secara mentah lebih baik kerana seluruh kandungan vitaminnya dapat diserap oleh tubuh badan berbanding dengan buah labu yang telah dimasak yang boleh

Dengan menggunakan prangkat lunak yang disebut SolidWorks 2012, pengukuran parameter fisik seperti momen inersia dapat lebih mudah dilakukan dan hasilnya lebih presisi.