1. BAB III ANALISA DAN PERANCANGAN

Transkripsi

1 1. BAB III ANALISA DAN PERANCANGAN 1.1. Analisa Analisa dilakukan dengan proses mengumpulkan data yang diperlukan untuk membangun aplikasi yaitu analisa karakteristik database yang akan dijadikan objek penelitian, kemudian tools programing yang akan digunakan dalam membangun aplikasi Software Requirement Berikut adalah kebutuhan perangkat lunak dalam pembuatan Aplikasi. 1. Sistem Operasi : Windows Vista Home Edition 2. Development Tools : Adobe Dreamweaver CS5 3. UI Design : Adobe Photoshop CS4 4. DBMS : MySQL 5.1, ORACLE 10g, SQLServer 2000, dan SQL Server Aplikasi Server : Apache 2.2, PHP (dengan library php_mysql.dll, php_oci.dll, php_mssql.dll, php_sqlsrv_52_ts_vc6.dll) 6. Framework Aplikasi : Codeigniter (php framework), jquery (javascript framework). 7. Browser : Firefox (dengan plugin Firebug dan Firequery) Tools Analysis Untuk melakukan analisa karakteristik database maka diperlukan tools untuk melakukan kontrol pada database. Berikut adalah tools yang digunakan : 1. phpmyadmin digunakan sebagai interface untuk kontrol database MySQL TOAD digunakan sebagai interface untuk kontrol database ORACLE 10g 17

2 18 3. SQL Server Management Studio digunakan sebagai interface untuk kontrol database SQL Server 2000 dan SQL Server Analisa Karakteristik Database Produk database yang akan digunakan sebagai objek penelitian adalah MySQL 5.1, ORACLE 10g, SQLServer 2000, dan SQL Server Setiap produk database memiliki spesifikasi tipe data yang berbeda-beda, oleh karena itu perlu pengkategorian yang lebih global agar data lebih mudah dikonversi ke dalam DML yang lebih umum. Pengkategorian tipe data masing-masing database dibagi menjadi 3, yaitu string/text, numeric/angka, dan date/tanggal. Untuk melakukan pengkategorian diperlukan struktur informasi field seperti berikut dari setiap tabel pada database : table_name : informasi nama tabel name : informasi nama field type : tipe data field default : nilai default dari suatu field max_length : panjang maksimum string field primary_key : jika field adalah primary key maka bernilai 1 selain itu 0 precision : panjang maksimum numeric field scale : presisi angka di belakang koma untuk numeric field category : pengkategorian secara umum (string / numeric / date) size : pengkategorian secara umum panjang field not_null : jika field tidak boleh null maka bernilai 1 selain itu 0

3 19 Berikut adalah analisa karakteristik dari masing-masing produk database MySQL 5.1 Query untuk mendapatkan informasi field dalam MySQL 5.1 : SELECT a.table_name `table_name`,a.column_name `name`, DATA_TYPE `type`, IFNULL(COLUMN_DEFAULT,'NULL') `default`, CHARACTER_OCTET_LENGTH max_length, (CASE WHEN b.column_name IS NULL THEN '0' ELSE '1' END) `primary_key`, NUMERIC_PRECISION `precision`, NUMERIC_SCALE `scale`, (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN 'string' WHEN DATA_TYPE IN ('date', 'datetime') THEN 'date' ELSE 'numeric' END) category, (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN CHARACTER_OCTET_LENGTH WHEN DATA_TYPE IN ('date', 'datetime') THEN 10 WHEN (NUMERIC_PRECISION IS NOT NULL OR NUMERIC_SCALE IS NOT NULL) THEN CONCAT(IFNULL(NUMERIC_PRECISION,0)- IFNULL(NUMERIC_SCALE,0), ',', NUMERIC_SCALE) ELSE CHARACTER_OCTET_LENGTH END) size, (CASE UPPER(IS_NULLABLE) WHEN 'NO' THEN '1' ELSE '0' END) not_null FROM INFORMATION_SCHEMA.COLUMNS a LEFT OUTER JOIN INFORMATION_SCHEMA.KEY_COLUMN_USAGE b ON a.table_schema=b.table_schema AND a.table_name=b.table_name AND a.column_name=b.column_name AND a.ordinal_position=b.ordinal_position AND b.constraint_name='primary' ORDER BY a.table_name,a.ordinal_position

4 20 Pengkategorian tipe data field pada MySQL 5.1 : Kategori String Numeric Date char varchar blob text enum tinyint smallint mediumint int bigint date datetime time year Tipe Data Tabel 3.1. Kategori Tipe Data MySQL 5.1 Penanganan Tipe Data dalam DML MySQL 5.1 : 1. String : Diapit dengan tanda kutip ( ), dan handle string literal dengan menggunakan tanda backslash ( \ ) Contoh: SELECT HALO atau SELECT Da\ i Cilik 2. Numeric : Masukan harus angka dan gunakan titik (. ) untuk memisahkan angka di belakang koma. Contoh: SELECT Date : Format harus YYYY-MM-DD dan diapit tanda kutip ( ) Contoh: SELECT

5 ORACLE 10g Query untuk mendapatkan informasi field dalam ORACLE 10g : SELECT a.table_name table_name, a.column_name "name", DATA_TYPE "type", DATA_DEFAULT "default", DATA_LENGTH "max_length", (CASE WHEN pk.column_name IS NULL THEN '0' ELSE '1' END) "primary_key", DATA_PRECISION "precision", DATA_SCALE "scale", (CASE WHEN CHAR_LENGTH>0 THEN 'string' WHEN DATA_TYPE='DATE' THEN 'date' ELSE 'numeric' END) "category", (CASE WHEN CHAR_LENGTH>0 THEN TO_CHAR(CHAR_LENGTH) WHEN DATA_TYPE='DATE' THEN '10' ELSE TO_CHAR(NVL((DATA_PRECISION-DATA_SCALE),DATA_LENGTH)) DECODE(DATA_SCALE,NULL,'','.') TO_CHAR(DATA_SCALE) END) "size", DECODE(NULLABLE,'Y','0','1') "not_null" FROM all_tab_columns a LEFT OUTER JOIN (SELECT b.table_name, b.column_name, c.constraint_type FROM all_cons_columns b INNER JOIN all_constraints c ON b.owner=c.owner AND b.constraint_name=c.constraint_name AND c.constraint_type='p' ) pk ON a.table_name = pk.table_name AND a.column_name=pk.column_name ORDER BY a.table_name,a.column_id

6 22 Pengkategorian tipe data field pada ORACLE 10g: Kategori String Numeric Date CHAR NCHAR VARCHAR2 NVARCHAR2 DEC DECIMAL FLOAT REAL DECIMAL SMALLINT INT INTEGER NUMBER DATE Tipe Data Tabel 3.2 Kategori Tipe Data ORACLE 10g Penanganan Tipe Data dalam DML ORACLE 10g : 1. String : Diapit dengan tanda kutip ( ), dan handle string literal dengan menggunakan tanda kutip ( ) Contoh: SELECT HALO FROM DUAL atau SELECT Da i Cilik FROM DUAL 2. Numeric : Masukan harus angka dan gunakan titik (. ) untuk memisahkan angka di belakang koma. Contoh: SELECT FROM DUAL 3. Date : Untuk mengkonversi dari string ke date harus menggunakan to_date(string, format) Contoh: SELECT TO_DATE( , YYYY-MM-DD ) FROM DUAL Untuk mengkonversi dari date ke string harus menggunakan to_char(string, format) Contoh: SELECT TO_CHAR(SYSDATE, YYYY-MM-DD ) FROM DUAL

7 SQL Server 2000 Query untuk mendapatkan informasi field dalam SQL Server 2000 : SELECT a.table_name [table_name], a.column_name [name], a.data_type [type], ISNULL(a.COLUMN_DEFAULT, 'NULL') [default], a.character_octet_length [max_length], (CASE WHEN b.column_name IS NULL THEN '0' ELSE '1' END) [primary_key], NUMERIC_PRECISION [precision], NUMERIC_SCALE [scale], (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN 'string' WHEN DATA_TYPE IN ('date', 'datetime') THEN 'date' ELSE 'numeric' END) [category], (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN CHARACTER_OCTET_LENGTH WHEN DATA_TYPE IN ('date', 'datetime') THEN 10 WHEN (NUMERIC_PRECISION IS NOT NULL OR NUMERIC_SCALE IS NOT NULL) THEN CONVERT(FLOAT,CONVERT(VARCHAR(10),ISNULL(NUMERIC_PRECISION,0)- ISNULL(NUMERIC_SCALE,0))+ '.'+ CONVERT(VARCHAR(10),NUMERIC_SCALE)) ELSE a.character_octet_length END) [size], (CASE UPPER(IS_NULLABLE) WHEN 'NO' THEN '1' ELSE '0' END) [not_null] FROM INFORMATION_SCHEMA.COLUMNS a LEFT OUTER JOIN INFORMATION_SCHEMA.CONSTRAINT_COLUMN_USAGE b ON a.table_schema=b.table_schema AND a.table_name=b.table_name AND a.column_name=b.column_name ORDER BY a.table_name,a.ordinal_position

8 24 Pengkategorian tipe data field pada SQL Server 2000 : Kategori Tipe Data Kode Numerik String nchar -8 ntext -10 nvarchar -9 char 1 varchar 12 text -1 Numeric tinyint -6 smallint 5 int 4 bigint -5 smallmoney 3 money 3 numeric 2 real 7 decimal 3 float 6 Date date 91 time -154 smalldatetime 93 datetime 93 Tabel 3.3 Kategori Tipe Data SQL Server 2000 Penanganan Tipe Data dalam DML SQL Server 2000 : 1. String : Diapit dengan tanda kutip ( ), dan handle string literal dengan menggunakan tanda kutip ( ) Contoh: SELECT HALO atau SELECT Da i Cilik 2. Numeric : Masukan harus angka dan gunakan titik (. ) untuk memisahkan angka di belakang koma. Contoh: SELECT FROM DUAL 3. Date : Untuk mengkonversi dari string ke date harus menggunakan CONVERT(datetime, string, format) Contoh: SELECT CONVERT(datetime, 22/10/2011,103) Untuk mengkonversi dari date ke string harus menggunakan CONVERT(VARCHAR, string, format) Contoh: SELECT CONVERT(VARCHAR, GETDATE(), 103)

9 SQL Server 2008 Query untuk mendapatkan informasi field dalam SQL Server 2008 : SELECT a.table_name [table_name], a.column_name [name], a.data_type [type], ISNULL(a.COLUMN_DEFAULT, 'NULL') [default], a.character_octet_length [max_length], ISNULL( (SELECT TOP 1 (CASE WHEN c.name IS NULL THEN '0' ELSE '1' END) FROM (SELECT b.constraint_name FROM INFORMATION_SCHEMA.CONSTRAINT_COLUMN_USAGE b WHERE a.table_schema=b.table_schema AND a.table_name=b.table_name AND a.column_name=b.column_name) b LEFT OUTER JOIN sys.objects c ON b.constraint_name = c.name AND UPPER(REPLACE(c.[type],' ',''))='PK' ),'0') [primary_key], NUMERIC_PRECISION [precision], NUMERIC_SCALE [scale], (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN 'string' WHEN DATA_TYPE IN ('date', 'datetime', 'datetime2', 'datetimeoffset') THEN 'date' ELSE 'numeric' END) [category], (CASE WHEN CHARACTER_OCTET_LENGTH IS NOT NULL THEN CHARACTER_OCTET_LENGTH WHEN DATA_TYPE IN ('date', 'datetime', 'datetime2', 'datetimeoffset') THEN 10 WHEN (NUMERIC_PRECISION IS NOT NULL OR NUMERIC_SCALE IS NOT NULL) THEN CONVERT(FLOAT,CONVERT(VARCHAR(10),ISNULL(NUMERIC_PRECISION,0)- ISNULL(NUMERIC_SCALE,0))+ '.'+ CONVERT(VARCHAR(10),NUMERIC_SCALE)) ELSE a.character_octet_length END) [size], (CASE UPPER(IS_NULLABLE) WHEN 'NO' THEN '1' ELSE '0' END) [not_null] FROM INFORMATION_SCHEMA.COLUMNS a LEFT OUTER JOIN sys.foreign_key_columns e ON OBJECT_NAME(e.parent_object_id)=a.TABLE_NAME AND COL_NAME(e.parent_object_id, e.parent_column_id) = a.column_name ORDER BY a.table_name,a.ordinal_position

10 26 Pengkategorian tipe data field pada SQL Server 2008 : Kategori Tipe Data Kode Numerik String nchar -8 ntext -10 nvarchar -9 char 1 varchar 12 text -1 Numeric tinyint -6 smallint 5 int 4 bigint -5 smallmoney 3 money 3 numeric 2 real 7 decimal 3 float 6 Date date 91 time -154 smalldatetime 93 datetime 93 Tabel 3.4 Kategori Tipe Data SQL Server 2008 Penanganan Tipe Data dalam DML SQL Server 2008 : 1. String : Diapit dengan tanda kutip ( ), dan handle string literal dengan menggunakan tanda kutip ( ) Contoh: SELECT HALO atau SELECT Da i Cilik 2. Numeric : Masukan harus angka dan gunakan titik (. ) untuk memisahkan angka di belakang koma. Contoh: SELECT FROM DUAL 3. Date : Untuk mengkonversi dari string ke date harus menggunakan CONVERT(datetime, string, format) Contoh: SELECT CONVERT(datetime, 22/10/2011,103) Untuk mengkonversi dari date ke string harus menggunakan CONVERT(VARCHAR, string, format) Contoh: SELECT CONVERT(VARCHAR, GETDATE(), 103)

11 Perancangan Perancangan adalah proses untuk mempermudah seorang pembuat aplikasi dalam merancang suatu sistem. Perancangan yang dilakukan meliputi perancangan DFD, kamus data, perancangan struktur menu, dan perancangan tampilan antarmuka Context Diagram Diagram Context aplikasi dijelaskan sebagai berikut : Gambar 3.1. Context Diagram Aplikasi Export/Import Data mempunyai enam entitas yang terkait dalam proses aplikasi, keenam entitas itu dapat dijelaskan sebagai berikut : 1. User adalah data pengguna yang bisa menggunakan fungsi-fungsi yang tersedia dalam aplikasi. 2. Spreadsheet File adalah tipe berkas yang digunakan sebagai media import data (spreadsheet ke database) maupun export data (database ke spreadsheet). 3. MySQL 5.1 adalah DBMS yang akan berinteraksi dengan aplikasi untuk melakukan export/import data. 4. ORACLE 10g adalah DBMS yang akan berinteraksi dengan aplikasi untuk melakukan export/import data.

12 28 5. SQL Server 2000 adalah DBMS yang akan berinteraksi dengan aplikasi untuk melakukan export/import data. 6. SQL Server 2008 adalah DBMS yang akan berinteraksi dengan aplikasi untuk melakukan export/import data Data Flow Diagram (DFD) DFD Level 1 DFD level 1 memiliki lima proses yang dijelaskan sebagai berikut : Gambar 3.2. DFD Level 1

13 29 Proses Data In Data Out Keterangan Proses 1 : Login Data Login Baca Data User Konfirmasi Login If(username == DataUser[Username] && password == DataUser[password]) Then Login Sukses Tampilkan Form Export Import Else Pesan Kesalahan Proses 2 : Setup Connection Profile Proses 3 : Import Data Proses 4 : Export Data Proses 5 : Database Browser Data Connection Profile Baca Data Connection Profile DML Import MySQL 5.1 DML Import SQL Server 2000 DML Import SQL Server 2008 DML Import ORACLE 10g DML Export MySQL 5.1 DML Export SQL Server 2000 DML Export SQL Server 2008 DML Export ORACLE 10g Query MySQL 5.1 Query SQL Server 2000 Query SQL Server 2008 Query ORACLE 10g Informasi Connectin Profile Simpan Connection Profile Konfirmasi Proses Import Konfirmasi Proses Export Info Data (JSON) Tabel 3.5 Spesifikasi DFD Level 1 End If Tampilkan Data Connection Profile If(modified)Then Simpan Data Connection Profile End If Pilih Connection Profile; Baca Data Array; Mapping Array data ke Field Tabel; Foreach(Row in Array) Generate Row SQL Eksekusi SQL Pilih Connection Profile; Inisialisasi Array; Dataset := Eksekusi Query SELECT; Foreach(Row in Dataset) Append row to Array Return Array Pilih Connection Profile; Tampilkan List Tabel; Tampilkan Informasi Tabel;

14 DFD Level 2 Setup Connection Profile DFD Level 2 Setup Connection Profile memiliki tiga proses inti, yaitu baca, test, dan modifikasi data Connection Profile. Alur prosesnya dijelaskan sebagai berikut : Gambar 3.3. DFD Level 2 Setup Connection Profile Proses Data In Data Out Keterangan Data Connection Profile Baca Data Connection Profile Proses 1 : Baca Data Connection Profile Proses 2 : Test Connection Profile Data Connection Profile Baca Data Connection Profile Informasi Connection Profile Konfirmasi Data Connection Profile Konfirmasi Data Connection Profile Pilih Profile Id. Baca Data Connection Profile dari DataStore. Return Data Connection Profile Pilih Profile Id. Baca Data Connection Profile dari DataStore If(test koneksi == success)then Konfirmasi Modifikasi Data Connection Profile Else Tampilkan pesan kesalahan End If

15 31 Proses Data In Data Out Keterangan Data Connection Profile Baca Data Connection Profile Proses 3 : Modikasi Data Connection Profile Konfirmasi Data Connection Profile Simpan Data Connection Profile Pilih Profile Id. Baca Data Connection Profile dari DataStore If(test koneksi == success)then Modifikasi Data Connection Profile Else Tampilkan pesan kesalahan End If Tabel 3.6 Spesifikasi DFD Level 2 Setup Connection Profile DFD Level 2 Import Data DFD Level 2 Import Data memiliki tiga proses inti, yaitu eksekusi query import, baca file spreadsheet, dan Map Field & Generate SQL. Alur prosesnya dijelaskan sebagai berikut : Gambar 3.4. DFD Level 2 Import Data

16 32 Proses Data In Data Out Keterangan Informasi Konfirmasi Connection Profile Eksekusi Query Select Query MySQL 5.1 MySQL 5.1 Konfirmasi Select Query SQL Eksekusi Query Server 2000 SQL Server 2000 Select Query SQL Konfirmasi Server 2008 Eksekusi Query Select Query SQL Server 2008 ORACLE 10g Konfirmasi Eksekusi Query Eksekusi Query Insert ORACLE 10g Konfirmasi Proses 1 : Eksekusi Query Import Proses 2 : Baca File Spreadsheet Spreadsheet File Path Query Insert Konfirmasi Baca Data Baca Data Connection; Konek ke database; Parse Query; Result = Eksekusi Query; Return Result; If(file_exist(path))Then Open File; Result = Read File; Return Result; Else Tampilkan pesan kesalahan; End If Proses 3 : Map Field & Generate SQL Dataset Konfirmasi Eksekusi Query Eksekusi Query Insert Konfirmasi Proses Import While(Row= FetchObject(Result)) SQL= GenerateSQL( Row, MapField); Exec(SQL); AddLog(); End; Tabel 3.7 Spesifikasi DFD Level 2 Import Data

17 DFD Level 2 Export Data DFD Level 2 Export Data memiliki dua proses inti, yaitu eksekusi query export, dan tulis file spreadsheet. Alur prosesnya dijelaskan sebagai berikut : Gambar 3.5. DFD Level 2 Export Data Proses Data In Data Out Keterangan Informasi Connection Profile Select Query MySQL 5.1 Select Query SQL Server 2000 Select Query SQL Server 2008 Select Query ORACLE 10g Eksekusi Query Insert Proses 1 : Eksekusi Query Import Konfirmasi Eksekusi Query MySQL 5.1 Konfirmasi Eksekusi Query SQL Server 2000 Konfirmasi Eksekusi Query SQL Server 2008 Konfirmasi Eksekusi Query ORACLE 10g Konfirmasi Query Insert Baca Data Connection; Konek ke database; Parse Query; Result = Eksekusi Query; Return Result;

18 34 Proses Data In Data Out Keterangan Proses 2 : Tulis File Spreadsheet Info Path Baca Data Open File; While(Row= FetchObject(Result)) AppendToFile(Row); End; Return File; Tabel 3.8 Spesifikasi DFD Level 2 Export Data DFD Level 2 Database Browser DFD Level 2 Database Browser memiliki tiga proses inti, yaitu baca info tabel, baca field, dan baca data tabel. Alur prosesnya dijelaskan sebagai berikut : Gambar 3.6. DFD Level 2 Database Browser

19 35 Proses Data In Data Out Keterangan Informasi Info Tabel Connection Profile MySQL 5.1 Request Info Tabel Info Tabel SQL MySQL 5.1 Server 2000 Request Info Tabel Info Tabel SQL SQL Server 2000 Server 2008 Request Info Tabel Info Tabel SQL Server 2008 ORACLE 10g Request Info Tabel Info Data ORACLE 10g (JSON) Proses 1 : Baca Info Tabel Proses 2 : Baca Field Proses 3 : Baca Data Tabel Informasi Connection Profile Request Data Field MySQL 5.1 Request Data Field SQL Server 2000 Request Data Field SQL Server 2008 Request Data Field ORACLE 10g Informasi Connection Profile Request Data Tabel MySQL 5.1 Request Data Tabel SQL Server 2000 Request Data Tabel SQL Server 2008 Request Data Tabel ORACLE 10g Data Field MySQL 5.1 Data Field SQL Server 2000 Data Field SQL Server 2008 Data Field ORACLE 10g Info Data (JSON) Data Tabel MySQL 5.1 Data Tabel SQL Server 2000 Data Tabel SQL Server 2008 Data Tabel ORACLE 10g Info Data (JSON) Tabel 3.9 Spesifikasi DFD Level 2 Database Browser Baca Data Connection; Konek ke database; Ambil Info Tabel dari INFORMATION_SCHEMA; Result = Eksekusi Query; Return json_encode(result); Baca Data Connection; Konek ke database; Ambil Info Field dari INFORMATION_SCHEMA; Result = Eksekusi Query; Return json_encode(result); Baca Data Connection; Konek ke database; Result = Eksekusi Query( SELECT * FROM TABEL); Return json_encode(result); Kamus Alir Data Berikut adalah uraian aliran data yang terdapat pada DFD Aplikasi Export/Import Data. Nama Aliran Data Aliran Data Data Login username, password Data Connection Profile profile_id, profile_name, dbdriver, hostname, database, username, password Data User username, password Query MySQL 5.1 profile_id, sqlstring Query SQLServer 2000 profile_id, sqlstring Query SQLServer 2008 profile_id, sqlstring

20 36 Nama Aliran Data Aliran Data Query ORACLE 10g profile_id, sqlstring Info Data (JSON) { JSON data sesuai struktur tabel } Data Field MySQL 5.1 table_name, name, type, default, max_length, primary_key, precision, scale, category, size, not_null Data Field SQLServer 2000 table_name, name, type, default, max_length, primary_key, precision, scale, category, size, not_null Data Field SQLServer 2008 table_name, name, type, default, max_length, primary_key, precision, scale, category, size, not_null Data Field ORACLE 10g table_name, name, type, default, max_length, primary_key, precision, scale, category, size, not_null Upload Data File (csv, xls) Download Data File (text, csv, xls, xlsx) Tabel 3.10 Kamus Aliran Data Struktur Menu Gambar 3.7 Struktur Menu

21 Perancangan Antarmuka Form Login Gambar 3.8 Sketsa Form Login Keterangan Objek : 1. inputan untuk memasukan username 2. inputan untuk memasukan password 3. tombol untuk login Spesifikasi Proses : Gambar 3.9 Flowchart Form Login

22 Form Connection Profile Gambar 3.10 Sketsa Form Connection Profile Keterangan Objek : 1. inputan untuk memasukan nama profile 2. pilihan untuk opsi database driver yang terdiri dari mysql (MySQL 5.1), oci8 (ORACLE 10g), mssql (SQL Server 2000) dan sqlsrv (SQL Server 2008) 3. inputan untuk memasukan host database server 4. inputan untuk memasukan nama database 5. inputan untuk memasukan username login database 6. inputan untuk memasukan password login database 7. tombol untuk melakukan tes koneksi ke database 8. tombol untuk menyimpan connection profile Spesifikasi Proses : Gambar 3.11 Flowchart Connection Profile

23 Data Browser Gambar 3.12 Sketsa Form Data Browser Keterangan Objek : 1. inputan LOV (List Of Value) untuk memasukan profile connection 2. tampilan informasi database driver 3. tampilan informasi host database server 4. tampilan informasi nama database 5. tampilan informasi username login database 6. tampilan informasi status koneksi database 7. inputan pencarian nama tabel 8. daftar tabel database 9. tab informasi struktur tabel 10. tab informasi data tabel 11. tab informasi skrip DML tabel 12. kontainer informasi tabel

24 40 Spesifikasi Proses : Gambar 3.13 Flowchart Data Browser Export / Import Export/Import method (1) File Source File (2) Browse Upload File (3) Database Source Profile (4) Database (7) DB. Driver (5) Username (8) Host (6) Status (9) (10) List Tables (11) List Fields of Selected Table Query Expression : (12) (13) Execute

25 41 Gambar 3.14 Sketsa Form Export/Import Keterangan Objek : 1. pilihan untuk opsi metode Export/Import yang terdiri dari Spreadsheet To Database, Database To Spreadsheet, Database To Database. 2. inputan file yang akan diupload 3. tampilan informasi file yang telah diupload (muncul setelah proses upload) 4. inputan LOV (List Of Value) untuk memasukan profile connection Database Source 5. tampilan informasi database driver 6. tampilan informasi host database server 7. tampilan informasi nama database 8. tampilan informasi username login database 9. tampilan informasi status koneksi database 10. daftar tabel pada Database Source

26 daftar field pada Tabel Database Source (sesuai tabel yang dipilih) 12. inputan ekspresi query 13. tombol untuk mengeksekusi expresi query 14. inputan nama file yang akan didownload 15. pilihan tipe data file yang akan didownload yang terdiri dari csv, xls, xlsx 16. tombol untuk mengeksekusi proses export data 17. inputan LOV (List Of Value) untuk memasukan profile connection 18. tampilan informasi database driver 19. tampilan informasi host database server 20. tampilan informasi nama database 21. tampilan informasi username login database 22. tampilan informasi status koneksi database 23. daftar tabel pada Database Target 24. daftar field pada Tabel Database Target (sesuai tabel yang dipilih) 25. tabel data mapping kolom 26. tombol untuk mengeksekusi proses import data Tampilan Form Export/Import didesain dalam satu halaman dengan manipulasi antarmuka dengan menggunakan AJAX. Berikut adalah beberapa kondisi tampilan fieldset yang muncul sesuai pilihan metode Export/Import. Metode Export/Import Tampilan Fieldset Spreadsheet To Database File Source : tampil Database Source : sembunyi File Target : sembunyi Database Target : tampil Database To Spreadsheet File Source : sembunyi Database Source : tampil File Target : tampil Database Target : sembunyi

27 43 Metode Export/Import Tampilan Fieldset Database To Database File Source : sembunyi Database Source : tampil File Target : sembunyi Database Target : tampil Tabel 3.11 Tabel Tampilan Antarmuka Form Export/Import Spesifikasi Proses : Gambar 3.15 Flowchart Export/Import - Spreadsheet To Database Gambar 3.16 Flowchart Export/Import - Database To Spreadsheet

28 44 Gambar 3.17 Flowchart Export/Import - Database To Database