Perancangan Sistem Inventori Kantor Menggunakan
Framework RIA (Rich Internet Application)
(Studi Kasus: BISTEK – FTI UKSW)
1)Priska Alfa Mardanik, 2)Wiranto H. Utomo, 3)Frederik Samuel Papilaya
Fakultas Teknologi Informasi Universitas Kristen Satya Wacana Jl. Diponegoro 52-60, Salatiga 50711, Indonesia Email : 1)p1215ka@yahoo.com, 2)wiranto.uksw@gmail.com,
3)samuel.papilaya@gmail.com
Abstract
The inventori information system such as recording and book keeping in BISTEK Salatiga is still done manually or it is still in a form of paper. So, it is difficult to know the amount of goods owned by the company. A computerization and integrated system which is designed using technology-based RIA (Rich Internet Application) and integrated of the database using the action script Flash, PHP script, and the web server by AppServ. It can be used to design the inventori system which can be access in three interfaces by desktop, web browser and mobile.
Keywords : Office inventori, RIA
1. Pendahuluan
Perkembangan teknologi memang tidak pernah surut dari masa ke masa sejalan dengan perkembangan ilmu pengetahuan, sehingga kemampuan komputer untuk membantu manusia dan menyelesaikan masalah semakin meningkat, baik permasalahan yang sederhana maupun permasalahan yang komplek sekalipun dalam berbagai aspek. Selain digunakan untuk menyimpan data, komputer juga menyajikan data ke dalam bentuk yang lebih mudah dipahami dan lebih akurat kepada user. Informasi yang cepat dan akurat menjadi hal yang penting dalam membuat suatu keputusan yang membantu dalam peningkatan kinerja dan perkembangan sebuah perusahaan. Maka dari itu di dalam perusahaan diperlukan manajemen yang baik, salah satunya dalam memanajemen barang inventori kantor mereka dalam mendukung kinerja para staf kantor. Manajemen inventori perlu dikelola dengan baik agar pekerjaan perawatan barang inventori dapat menjadi lebih mudah karena dengan pengadaan pencatatan inventoriasi perusahaan dapat mendaftar semua fasilitas yang ada di seluruh bagian, termasuk gedung dan isinya. Maka diperlukan sebuah teknologi Perancangan dan Implementasi (Manuputty, dkk)
berupa aplikasi yang dapat membantu dalam pengelolaan barang-barang inventori kantor. Dalam penelitian ini penulis memilih Satya Wacana Bussines Technology Center-FTI UKSW (BISTEK) yang merupakan salah satu perusahaan yang sedang
berkembang di kota Salatiga sebagai objek penelitian. Perusahaan ini memfasilitasi pengembangan bisnis teknologi di kalangan mahasiswa UKSW dalam aspek manajerial, pelatihan bidang teknologi informasi, pemanfaatan hasil riset (kerjasama dengan Puslit TIK FTI UKSW), pemasaran produk dan jasa, permodalan, dan lain-lain. Dengan dukungan fasilitas perkantoran yang memadai serta jaringan dengan berbagai pihak pendukung. Namun sistem informasi dalam pengelolaan maupun pencatatan barang inventori di BISTEK masih menggunakan metode manual yaitu pencatatan dan pembukuan yang ditulis pada form kertas kemudian disimpan dalam berkas. Kondisi ini mengakibatkan proses pengolahan data menjadi kurang baik, misalnya dalam pencarian data karena harus membuka berkas satu per satu sehingga perlu waktu yang mungkin cukup lama saat mencari keberadaan data tersebut disimpan. Kendala lainnya adalah mengalami kesulitan untuk mengetahui berapa banyak atau apa saja barang yang telah dimiliki perusahaan karena harus menghitung satu per satu, atau mungkin data tersebut bisa hilang atau rusak karena ada bencana maupun hal yang tidak diinginkan.Alangkah baiknya jika proses pengolahan data barang inventori dilakukan dengan sistem terkomputerisasi serta dengan menggunakan aplikasi yang menggambarkan antar muka bagi pengguna dalam entry dan pencarian data yang terhubung dengan database. Maka untuk mempermudah proses pengolahan data barang inventori pada kantor perusahaan diperlukan sebuah program aplikasi yang mampu untuk mengolah data barang inventori tersebut, sehingga proses data barang inventori dapat secara langsung dilihat dan ditemukan informasi yang tersimpan dalam database. Dengan aplikasi inventori kantor ini diharapkan agar dapat lebih cepat dalam pencarian informasi data inventori yang dimiliki kantor dan informasi yang tersimpan dalam database tersebut dapat diolah sehingga dapat dicetak sebagai laporan guna mendukung keputusan perusahaan nantinya. Secara garis besar BISTEK merupakan perusahaan yang bergerak alam bidang teknologi informasi, selayaknya dalam pengelolaan data seperti inventori diperlukan sebuah pengelolaan yang menerapkan sistem komputerisasi sehingga dapat membantu proses inventoriasi dengan menerapkan tertib administrasi inventori. Dalam merancang sistem informasi inventoriasi barang tersebut dilakukan tahapan-tahapan pembangunan aplikasi diantaranya adalah sistem yang dirancang akan menerapkan teknologi baru bernama RIA (Rich Internet Application). Pemilihan framework dengan memakai RIA ini dilatarbelakangi oleh keunggulan RIA yang berbeda dengan framework lainnya yaitu suatu aplikasi web yang berfungsi layaknya aplikasi multimedia di desktop atau dengan kata lain memiliki fitur dan menerapkan fungsi-fungsi layaknya aplikasi multimedia berbasis desktop. RIA adalah suatu teknologi yang menggabungkan kelebihan-kelebihan dari aplikasi berbasis web dan desktop. Sifatnya tidak tergantung terhadap suatu sistem operasi menjadikan RIA bisa menjangkau pengguna komputer lebih banyak lagi. Pada dasarnya penulis ingin menerapkan sebuah teknologi baru untuk merancang sebuah sistem pada aplikasi inventori kantor. Dengan adanya perancangan sistem ini dapat menjadi masukan serta bahan pertimbangan dalam membangun sistem informasi inventoriasi barang di BISTEK serta menjadi tambahan wawasan bagi pembaca dan penulis tentang
Perancangan Sistem (Papilaya, dkk) perancangan sistem inventoriasi barang dengan menggunakan RIA. Dengan begitu teknologi komputer masih menjadi solusi terbaik karena inovasi, keakuratan, serta kecepatannya dalam mengolah suatu data menjadi informasi yang berguna.
2. Kajian Pustaka
Pengertian Rich Internet Application adalah suatu teknologi yang menggabungkan kelebihan-kelebihan dari aplikasi berbasis web dan desktop.[1] RIA menyajikan antarmuka visual yang cantik dan interaktif. Sifatnya tidak tergantung terhadap suatu sistem operasi menjadikan RIA bisa menjangkau pengguna komputer lebih banyak lagi. Definisi Adobe mengenai RIA yaitu tentang bagaimana suatu aplikasi
web yang berfungsi layaknya aplikasi multimedia di desktop PC dengan akses tanpa
batas ke berbagai jaringan komputer lainnya. Dengan kata lain, RIA adalah aplikasi web yang sebagian besar karakteristik dari aplikasi desktop. Contoh RIA framework adalah Curl, GWT, Adobe Flash/Adobe Flex/AIR, Java/JavaFX, Mozilla XUL dan Microsoft Silverlight. Diagram Ria dapat digambarkan pada Gambar 1, dimana diagram tersebut menggambarkan bahwa teknologi RIA menggabungkan antara
Desktop Application, Web Application dan Communication Technologies.
Gambar 1 Diagram RIA
RIA dapat dikatakan sebuah teknologi yang baru karena pada perkembangannya nama Rich Internet Application diperkenalkan pada bulan Maret 2002 oleh Macromedia (sekarang bernama ADOBE). Namun konsep RIA sebenarnya sudah lama dipakai seperti Remote Scripting, oleh Microsoft, circa pada tahun 1998, X Internet, oleh Forrester Research pada Oktober 2000, Rich
(web) clients, Rich web application. Beberapa karakteristik RIA secara umum,
antara lain (a) Responsif. Sebagai aplikasi web, RIA memiliki perbedaan yang amat mencolok dengan web konvensional. Aplikasi yang dibangun dengan konsep RIA ini tidak me-reload halaman ketika suatu tombol atau link diklik karena hanya
meng-update bagian-bagian tertentu ketika kita melakukan suatu aksi. Sementara pada
web konvensional, halaman akan di-update secara keseluruhan ketika kita melakukan suatu aksi; (b) Dapat melakukan banyak hal. Dengan memanfaatkan RIA, aplikasi yang dirancang ini dapat melakukan sesuatu seperti apa yang dilakukan pada sebuah aplikasi desktop. Tingkat interaktifitas yang tinggi memungkinkan
developer untuk memindahkan fitur-fitur pada sebuah aplikasi desktop ke dalam
aplikasi web. Komponen yang terdapat pada software pendukung RIA lebih lengkap ketimbang komponen yang dimiliki oleh software untuk membangun web biasanya. Sudah banyak aplikasi RIA yang dimanfaatkan seperti word processor, instant
mesengger, dan sebagainya; (c.) Menjangkau user yang lebih banyak. Aplikasi RIA
yang akan dirancang ini bisa dijalankan pada sistem operasi apapun dengan spesifikasi
hardware yang tidak harus tinggi. Asalkan sistem operasi itu bisa menjalankan browser dan flash player maka aplikasi RIA dapat dijalankan dengan baik. Dengan
begitu aplikasi dapat digunakan oleh pengguna yang memakai sistem operasi apa saja; (d.) Komunikasi Menjadi Lebih Mudah. Dengan menerapkan RIA pada aplikasi ini, developer bisa memanfaatkan banyak media untuk melakukan sesuatu. Misalnya
Chatting berbasis teks, misalnya melalui Yahoo! Web Mesengger, Gmail Chat,
Ebuddy, Meebo, Facebook Chat. Disamping itu ada juga Audio-Video Conference melalui Gmail Video Chat, dll.
Ada beberapa perangkat teknologi untuk membangun aplikasi berbasis RIA, yaitu AJAX dan Javascript, AJAX merupakan singkatan dari Asynchronous Javascript and XML. Teknologi ini adalah pemain lama yang juga masih setiap digunakan oleh perusahaan besar pembuat aplikasi berbasis RIA. Beberapa contoh aplikasi berbasis AJAX yang mudah kita jumpai di internet adalah Wordpress,
Facebook, dan beberapa produk Google seperti Gmail, Calendar, Docs, Maps. Flash, sangat banyak kita jumpai di internet. Beberapa diantaranya dalam bentuk
iklan, animasi, situs profil hingga aplikasi yang sifatnya spesifik. Aplikasi berbasis
Flash ini sifatnya browser friendly, jadi aplikasi Flash ini bisa dijalan di setiap
browser asalkan pada browser itu telah terinstal Flash Player yang sesuai. Java, sama seperti Flash, aplikasi berbasis Java membutuhkan aplikasi tambahan yang disebut Java Runtime Environment (JRE) agar bisa berjalan dengan lancar pada browser. Saat ini, aplikasi berbasis Java belum bisa bersaing dengan aplikasi lain yang berbasis AJAX maupun Flash. Silverlight, merupakan produk buatan Microsoft yang digunakan untuk membuat aplikasi berbasis RIA. Sama seperti Java dan Flash, untuk menjalankan aplikasi berbasis Silverlight dibutuhkan suatu plugin. Saat ini, sudah banyak situs-situs yang sudah memanfaatkan teknologi ini untuk membangun aplikasi RIA. Walaupun demikian, popularitasnya masih kalah jika dibandingkan dengan AJAX dan Flash. JavaFX, produk yang dinamakan JavaFX ini menawarkan interaktivitas, animasi dan tipe pemograman yang konsisten dengan AJAX, Flash dan teknologi Silverlight Microsoft yang baru. JavaFX ini merupakan sebuah tambahan baru untuk platform Java yang menjanjikan pemakaian konsisten dari desktop ke alat-alat portabel. JavaFX ini memungkinkan RIA untuk tampil di layar mobile device, desktop, televisi dan sebagainya. Pada penelitian ini penulis memilih Flash untuk membangun aplikasi teknologi RIA. Jadi, RIA adalah suatu teknologi yang akan memberikan pengalaman yang berbeda dari sebelumnya bagi pengguna internet karena RIA menggabungkan kelebihan dari aplikasi berbasis web
dan aplikasi berbasis desktop. RIA memungkinkan kita untuk melakukan sesuatu seperti apa yang kita lakukan pada aplikasi desktop namun tidak lepas dari aktifitas
online bersama pengguna internet lainnya seperti chatting, video conference, serta
3. Metode Penelitian
Metode yang dipakai untuk membuat sistem dan perancangan yang dilakukan dalam membangun aplikasi sistem inventori dengan teknologi RIA adalah model
prototyping. Secara umum tahapan pada dapat dijelaskan dan d ilihat pada Gambar
2.
1. Tahap pertama pengumpulan kebutuhan pengguna yang dievaluasi oleh pelanggan dan digunakan untuk mengelola kembali kebutuhan dari perangkat lunak yang dikembangkan. Proses iterasi terjadi sebanyak dua kali, setelah prototipe disesuaikan dengan kebutuhan pelanggan, pada pihak pengembang aplikasi makin mengerti keinginan pemakai.
2. Tahap perancangan sistem dilakukan dengan menggunakan menggambarkan aliran data serta alur sistem dengan menggunakan UML.
3. Tahap implementasi ini akan menerapkan bagaimana pengkodean yang dilakukan dalam membuat sebuah aplikasi yang telah dirancang sebelumnya.
Gambar 2 Bagan Prototype Model
4. Perancangan dan Pengujian Sistem
Sebelum mengimplementasikan, sistem harus didesainkan terlebih dahulu. Dengan adanya desain sistem diharapkan dapat membantu proses pengembangan dari pembuata aplikasi. Pada bagian ini akan dibahas diagram use case, activity
diagram dan class diagram. Use Case Diagram, diagram ini menggambarkan
fungsionalitas yang diharapkan sebuah sistem, use case diagram merepresentasikan sebuah interaksi antar actor dan sistem. Use case merupakan langkah-langkah yang diikuti User dalam memanfaatkan sistem dengan kata lain dapat menggambarkan secara garis besar sistem yang akan dikembangkan. Sedangkan actor merupakan orang, organisasi atau sistem lain yang dapat menginisialisasi sebuah instance dari
use case. Diagram use case perancangan sistem untuk aplikasi inventori kantor
dapat dilihat pada Gambar 3.
tam bah data
edit data
hapus data
mencari data barang
tam bah data
edi t data
hapus data mengol ah data inventaris
<<i ncl ude>>
<<include>>
<<incl ude>>
m engolah data kategori <<i ncl ude>>
<<incl ude>>
<<include>>
mengol ah data vendor
tambah data edi t data hapus data <<i ncl ude>> <<i ncl ude>> << incl ude>> sekretari s BIST EK
pegawai BISTEK mel ihat data dosen <<incl ude>>
Gambar 3 Use Case Diagram
Activity Diagram adalah diagram yang memperlihatkan aliran dari suatu
aktifitas ke aktifitas lainnya dalam suatu sistem. Gambar 4 adalah activity diagram dari Transaksi penjualan tunai.
sta rt
m em il ih m enu se arch
me ng in pu tka n kataku nci be rda sa rkan ka teg ori
me na mp il kan fo rm utam a m en am pi lka n for m sea rch e nd m en am pi lka n da ta cek va li di ta s s al ah be na r komput er user
Gambar 4 Diagram Aktifitas Cari Data
Dari Gambar 4 menerangkan aktifitas mencari data. Dimulai dari user masuk ke sistem kemudian komputer menampilkan form utama. Dengan memilih menu search maka User dapat melakukan pencarian data sekaligus melihat data dengan memasukkan kata kunci. Sistem akan memeriksa apakah keyword yang diinputkan cocok dengan data di database atau tidak. Apabila query tidak ditemukan maka
dengan memasukkan query dan parameter pencarian. Hasil yang diharapkan adalah aplikasi inventori kantor ini akan menampilkan daftar barang yang sesuai dengan masukan yang diberikan oleh user. Skenario pengujian fungsionalitas proses pencarian barang dapat dilihat pada Tabel 2. Secara umum, hasil pengujian yang diperoleh yaitu pertama komponen- komponen yang berkaitan dengan use case “Cari Barang” telah sesuai dengan spesifikasi yang didefinisikan. Kedua, integrasi tiap-tiap komponen tetap memenuhi spesifikasi yang telah didefinisikan.
Tabel 2 Skenario dan Hasil Pengujian Use Case “Cari Barang”
identifikasi U-F-01 dan U-F-02
Deskripsi Pengujian untuk melakukan proses
pencarian barang inventori
Prosedur Pengujian 1. Masukkan query pencarian pada
kotak masukan yang sudah tersimpan dalam database
2. Pilih parameter pencarian
berdasarkan nama atau merk barang inventori
3. Tekan tombol “Cari”
Masukan 1. Query pencarian
2. Parameter nama atau merk barang inventori
3. Aksi klik tombol “Cari” oleh pengguna
Keluaran yang Diharapkan Daftar barang inventori kantor yang
dicari pengguna berhasil ditampilkan
Kriteria Evaluasi Hasil Daftar barang inventori kantor yang
dicari pengguna berhasil ditampilkan
Hasil yang Didapat Daftar barang inventori kantor yang
dicari pengguna berhasil ditampilkan
Kesimpulan Diterima
5. Hasil dan Pembahasan
Desain antarmuka sistem dan tabel data yang telah dirancang pada bab sebelumnya kemudian diimplementasikan dan setelah tahap implementasi berhasil maka selanjutnya setiap unit proses akan diuji untuk mengetahui kesesuaian fungsinya dengan tujuan yang ingin dicapai. Dalam perancangan sistem, coding ditulis dengan bahasa pemrograman action script dan PHP. Sedangkan untuk pengujian unit dilakukan dengan menggunakan black box testing. Antar muka yang dikembangkan dibuat dalam satu projek dengan menggunakan software pembangun aplikasi berupa Adobe Flash CS3 Profesional, selain dalam format file .swf pada flash file juga dapat di-publish kedalam beberapa bentuk file seperti format .exe yang berbasis
desktop dan .html yang dapat dijalankan dengan menggunakan browser. Aplikasi
katego ri ko de_ kateg : Strin g n m_kateg ori : Stri ng ke t_ka te g tam bah _da ta () u ba h_d ata() h ap us_ data() lokasi
kode _lo kasi : String nam a_l okas i : Strin g ket_ lokasi tam ba h_l okas i() uba h_ loka si() hap us _lo kasi ()
vend or kod e_ven dor : Strin g na ma-vend or : Strin g ph on e : Stri ng em ai l : Stri ng al am at : String ta mb ah_ ko de () ub ah _kode () ha pu s_kod e() i nventari s id : Stri ng nama_ item : Strin g katego ri : Strin g me rk_ti pe : Stri ng sn : Stri ng tg l_ trm : Strin g ti pe : Stri ng kon dis i_ brg : Strin g deskripsi : Stri ng cop yrig ht : Stri ng garans i : Strin g id _vend or : String qty : Integ er hrg : Stri ng to t : Strin g ta mbah_ data() ubah_da ta () hapus_d ata() 1 1 1 1 1 1 1 1 1 1 1 1
Gambar 6 Class Diagram 7. Pengujian Sistem
Pengujian terhadap perancangan aplikasi inventori kantor ini untuk mengujicobakan penerapan rangkaian aktifitas proses perancangan aplikasi inventori kantor studi kasus BISTEK. Spesifikasi lingkungan perangkat lunak yang digunakan dalam pengujian sama dengan spesifikasi lingkungan perangkat lunak yang digunakan dalam proses perancangan perangkat lunak. Konsep Black Box Testing atau kotak hitam digunakan untuk merepresentasikan yang cara kerja didalamnya tidak tersedia untuk diinspeksi. Di dalam kotak hitam, item yang diuji dianggap “gelap” karena logiknya tidak diketahui, yang diketahui hanya apa yang masuk dan apa yang keluar dari kotak hitam.[2] Pada pengujian kotak hitam, kasus-kasus pengujian berdasarkan pada spesifikasi sistem. Rencana pengujian dapat dimulai sedini mungkin dari proses pengembangan aplikasi. Pada pengujian ini akan dicoba beragam masukan dan memeriksa keluaran yang dihasilkan sehingga akan dapat dipelajari apa yang dilakukan kotak, namun tidak dapat mengetahui sama sekali mengenai cara konversi dilakukan.Skenario Pengujian atau rencana pengujian yang akan dilakukan dapat dilihat pada Tabel 1.
Tabel 1 Rencana Pengujian Fungsionalitas Perangkat Lunak
No. Use Case Pengujian Jenis
Pengujian Identifikasi 1. Search Book 1. Skenario Normal Black box U-F-01
Pengujian yang dilakukan pada perangkat lunak inventori kantor studi kasus BISTEK adalah pengujian fungsionalitas proses pencarian barang inventori. Pengujian dilakukan
sistem akan menampilkan kembali form cari data. Apabila data ditemukan maka sistem menampilkan data yang dicari. Sedangkan diagram aktifitas untuk melihat data.
Sequence Diagram adalah secara khusus menjabarkan behavior sebuah
skenario tunggal. Gambar 5 menjelaskan bahwa pada saat masuk ke form inventori
user akan melihat data yang tersimpan dalam database. Controller cari barang
membaca semua record inventori ke database kemudian menampilkan data tersebut ke form inventori. Kemudian contoller “caribarang” membaca record berdasar
input-an, jika ada data yang sesuai dengan input-an maka data tersebut tertampil
pada form cari dan lihat barang inventori.
: form Cari : Inventaris : caribarang
2: baca data inventaris
3: baca s em ua record inventaris 4: tam pil data inventaris
5: caridata ses uai input
6: baca record data s es uai input
8: tampil data inventaris yang dicari 1: openDB
7: clos eDB
Gambar 5 Diagram Sequence Cari Data Inventori
Class diagram adalah diagram yang memperlihatkan himpunan kelas–kelas,
kolaborasi serta relasi antara use case dengan aktor. Gambar 6 adalah gambar
class diagram dari proses user dan admin. Yang menggambarkan struktur dan
deskripsi class, class merupakan sebuah spesifikasi yang jika diinstansiasi akan menghasilkan sebuah objek dan merupakan inti dari pengembangan sistem. Diagram tersebut menjelaskan bahwa terdapat empat kelas yaitu kelas inventori, kelas kategori, kelas vendor, dan kelas lokasi yang memiliki nilai atau atribut masing-masing. dengan menggunakan emulator. Pemakaian ketiga format file aplikasi ini merupakan pengimplementasian dari konsep RIA. Form Halaman Utama dalam perancangannya memiliki fungsi untuk lihat dan cari data barang inventori, input data barang inventori,
input dan lihat jenis kategori, input dan lihat data lokasi, input dan lihat data vendor.
Adapun tampilan halaman utama aplikasi pada desktop adalah Gambar 7, sedangkan untuk tampilan web serupa dengan tampilan antarmuka pada desktop.
Gambar 7 Form Utama Desktop dan Web
Sedangkan halaman utama yang akses melalui teknologi mobile dapat dilihat pada Gambar 8, yang mana disimulasikan pada sebuah emulator yang tersedia pada program Flash.Form Inventori.
Gambar 8 Form Utama Mobile
Jika memilih tombol “inventori”, user akan menemui form inventori dimana
user dapat menyimpan data barang, mengubah data maupun menghapus data barang inventori. Disamping itu juga dapat menambahkan jenis kategori dengan memilih
tombol “add” yang digambarkan dengan tanda tambah (plus) yang terletak disamping
combo box kategori. Begitu juga halnya dengan penambahan lokasi maupun
ven-dor dapat memilih tombol “add” yang digambarkan dengan tanda tambah yang terletak disamping combo box lokasi atau vendor jika belum ada pilihan yang sesuai.
Terdapat pilihan tombol “reset” untuk mengosongkan data yang tampil pada tiap kolom supaya dapat menambahkan data baru ke dalam kolom. Tombol “simpan” digunakan untuk menyimpan data barang yang telah diisikan dalam setiap kolom. Sedangkan beberapa tombol “move” yang digambarkan dengan anak panah merupakan tombol menampilkan data dari awal sampai akhir. Tombol-tombol tersebut berguna memilih data yang ingin diubah atau diperbaharui kemudian pilih tombol “ubah” untuk mengeksekusinya. Disamping itu tombol “move” berguna juga untuk mencari data barang mana yang ingin dihapus, kemudian pilih tombol “hapus” untuk menghapus data barang. Hasil tampilannya dapat lebih jelas pada Gambar 9.
Gambar 9 Form Inventori pada Desktop dan Web
Aliran data yang terjadi pada saat penyimpanan data barang diawali dengan
user memasukkan data baru ke dalam kolom yang tersedia kemudian pada saat
memilih tombol “simpan”, data tersebut dieksekusikan ke dalam perintah SQL yang menghubungkan inputan dari form dengan database MySQL yang terdapat pada “add_item.php”. Apabila user memilih “hapus” maka id yang tertampil pada form dieksekusikan ke alamat “delete_item.php” dimana terdapat perintah SQL untuk menghapus. Begitu pula saat user menginginkan perubahan data pada data tertentu
user dapat memilih “edit” yang kemudian dieksekusikan langsung pada
“edit_item.php” untuk memproses pembaharuan data pada perintah SQL update.
Form Vendor. Form ini memberikan informasi mengenai data perusahaan yang
telah bekerjasama dengan BISTEK seperti dalam memberikan beberapa sarana seperti komputer misalanya guna mendukung aktifitas yang dijalankan oleh BISTEK dan juga data toko-toko tempat pembelian barang-barang yang diperlukan kantor. Terdapat pilihan tombol “reset” untuk mengosongkan data yang tampil pada tiap kolom supaya dapat menambahkan data baru ke dalam kolom yang ada. Tombol “simpan” digunakan untuk menyimpan data yang telah diisikan disetiap kolom. Data yang telah tersimpan dalam database dapat dilihat dalam tabel data. Sedangkan beberapa tombol “move” yang digambarkan dengan anak panah merupakan tombol menampilkan data vendor yang tersimpan dari awal sampai akhir. Tombol-tombol
tersebut berguna memilih data yang ingin diubah atau diperbaharui kemudian pilih tombol “ubah” untuk mengeksekusinya. Disamping itu tombol “move” berguna juga untuk mencari data vendor mana yang ingin dihapus, kemudian pilih tombol “hapus” untuk menghapus data vendor. Hasil tampilannya dapat dilihat pada Gambar 10.
Gambar 10 Form Vendor pada Desktop atau Web
Aliran data yang terjadi pada saat penyimpanan data vendor diawali dengan
user memasukkan data baru ke dalam kolom yang tersedia kemudian pada saat
memilih tombol “simpan”, data tersebut dieksekusikan ke dalam perintah SQL yang menghubungkan input-an dari form dengan database MySQL yang terdapat pada “add_vendor.php” sehingga data yang telah dimasukkan user dapat tersimpan.
Gambar 11 Form Vendor pada Mobile
Apabila user memilih “hapus” maka id yang tertampil pada form dieksekusikan ke alamat “delete_vendor.php” dimana terdapat perintah SQL untuk menghapus. Begitu pula saat user menginginkan perubahan data pada data tertentu user dapat memilih “edit” yang kemudian dieksekusikan langsung ke dalam “edit_vendor.php” untuk memproses pembaharuan data pada perintah SQL update. Jika diakses melalui
mobile dapat dilihat pada Gambar 11.
Form Lokasi, memberikan informasi mengenai data lokasi atau diruang mana
barang inventori berada. Sama halnya dengan beberapa fungsi pada form inventori dan vendor, pada form lokasi terdapat juga pilihan tombol “reset” untuk mengosongkan data yang tampil pada tiap kolom supaya dapat menambahkan data baru ke dalam kolom yang ada. Tombol “simpan” digunakan untuk menyimpan data lokasi yang telah diisikan disetiap kolom. Data yang telah tersimpan dalam
data-base dapat dilihat dalam tabel data. Beberapa tombol “move” yang digambarkan
dengan anak panah merupakan tombol menampilkan data lokasi yang tersimpan dari data awal sampai data paling akhir sesuai urutan id-nya. Tombol-tombol tersebut berguna memilih data lokasi mana yang ingin diubah atau diperbaharui kemudian pilih tombol “ubah” untuk mengeksekusinya. Disamping itu tombol “move” berguna juga untuk mencari data lokasi mana yang ingin dihapus, kemudian pilih tombol “hapus” untuk menghapus data lokasi yang diinginkan. Hasil tampilannya dapat dilihat pada Gambar 12.
Gambar 12 Form Lokasi pada Desktop dan Web
Pada lokasi, aliran data yang terjadi pada saat penyimpanan data lokasi yaitu diawali dengan user memasukkan data baru ke dalam kolom yang tersedia kemudian pada saat memilih tombol “simpan”, data tersebut dieksekusikan ke dalam perintah SQL yang menghubungkan input-an dari form dengan database MySQL yang terdapat pada “add_lokasi.php” sehingga data yang telah dimasukkan user dapat tersimpan. Apabila user memilih “hapus” maka id yang tertampil pada form dieksekusikan ke alamat “delete_lokasi.php” dimana terdapat perintah SQL untuk menghapus. Begitu pula saat user menginginkan perubahan data pada data tertentu user dapat memilih “edit” yang kemudian dieksekusikan langsung ke dalam “edit_lokasi.php” untuk
