WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni...

50
1 ABSTRAK APLIKASI PENJUALAN PADA YAM YAM RESTAURANT BERBASIS WEB SERVICE DENGAN METODE REST Oleh Jeni Haryanto 12141413 Currently in Yamam restaurant, recap the data until the calculation is still done by typing the purchase note into Microsoft Excel, and the report is sent in the form of a file to the restaurant owner, so that the report cannot be obtained in real time. Yamyam restaurant requires an application to recap sales reports. In making this application each branch uses a different database, it requires a web service to integrate its data, in making this web service using the REST (Representation State Transfer) method. By way of work A client sends a data request to the server and then the server responds then sends data to the client. This application is able to assist cashiers in making sales reports, and yamyam restaurant owners can get sales reports from two branches simultaneously Keywords: web service, REST, sales report.

Transcript of WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni...

Page 1: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

1

ABSTRAK

APLIKASI PENJUALAN PADA YAM YAM RESTAURANT BERBASIS

WEB SERVICE DENGAN METODE REST

Oleh

Jeni Haryanto

12141413

Currently in Yamam restaurant, recap the data until the calculation is still

done by typing the purchase note into Microsoft Excel, and the report is sent in the

form of a file to the restaurant owner, so that the report cannot be obtained in real

time.

Yamyam restaurant requires an application to recap sales reports. In

making this application each branch uses a different database, it requires a web

service to integrate its data, in making this web service using the REST

(Representation State Transfer) method. By way of work A client sends a data

request to the server and then the server responds then sends data to the client.

This application is able to assist cashiers in making sales reports, and

yamyam restaurant owners can get sales reports from two branches simultaneously

Keywords: web service, REST, sales report.

Page 2: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

2

INTISARI

APLIKASI PENJUALAN PADA YAM YAM RESTAURANT BERBASIS

WEB SERVICE DENGAN METODE REST

Oleh

Jeni Haryanto

12141413

INTISARI

Saat ini di yamyam restaurant dalam merekap data sampai penghitungan

masih dengan cara mengetikkan ulang nota pembelian kedalam Microsoft Excel,

dan laporan dikirim dalam bentuk file kepada pemilik restaurant, sehingga laporan

tidak bisa di dapatkan secara real-time.

Yamyam restaurant membutuhkan aplikasi untuk merekap laporan

penjualan. Dalam pembuatan aplikasi ini masing-masing cabang menggunakan

database yang berbeda maka dibutuhkan web service untuk mengintegrasi data nya,

dalam pembuatan web service ini menggunakan metode REST (Representation

State Transfer). Dengan cara kerja Sebuah client mengirimkan sebuah request data

ke server dan kemudian server merespon lalu mengirimkan data ke client.

Aplikasi ini mampu membantu kasir dalam membuat laporan penjualan, dan

pemilik yamyam restaurant bisa mendapatkan laporan penjualan dari dua cabang

secara bersamaan

Kata kunci : web service, REST, laporan penjualan.

Page 3: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

3

BAB I

PENDAHULUAN

1.1. Latar Belakang

Pada masa kini teknologi sudah sangat berkembang, terutama internet. Bagi

masyarakat internet sudah menjadi hal pokok dalam kehidupan sehari-hari. Banyak

yang memanfaatkan internet dalam dunia pendidikan, politik, bisnis, dll. Dalam

dunia bisnis sudah bayak perusahaan yang menggunakan internet sebagai sarana

untuk mendapatkan laporan keuangan dengan menggunakan aplikasi web, karena

dengan internet pengiriman laporan keuangan menjadi lebih mudah dan cepat.

Yamyam restaurant merupakan salah satu restaurant yang berada di kota

Yogyakarta. Restaurant ini memiliki dua cabang yang berada di Jepara dan

Yogyakarta, saat ini di yamyam restaurant dalam perekapan data sampai

penghitungan masih manual. yaitu mengetikkan ulang nota pembelian kedalam

Microsoft Excel, dan pengiriman laporan penjualan dengan cara mengirim data

dalam bentuk file kepada pemilik restaurant.

Dengan sistem perekapan data yang masih maual, kasir memerlukan waktu

yang cukup lama dalam merekap laporan penjualan, dan pemilik juga mengalami

kesulitan dalam memantau salah satu cabang yang ditingalkan karena tidak bisa

mendapatkan laporan penjualan secara real-time. Bahkan untuk mendapatkan

laporan penjualan harian, mingguan, maupun bulanan masih terlalu lama. Dengan

berkembangnya teknologi yang semakin maju maka yamyam restaurant

membutuhkan aplikasi yang bisa membantu dalam perekapan laporan penjualan,

sehingga kasir lebih mudah dan cepat dalam perekapan data, dan pemilik bisa

mendapatkan laporan penjualan dari kedua cabang secara real-time.

Berdasarkan uraian diatas, maka dibutuhkan solusi untuk mengatasi

masalah-masalah tersebut. Salah satu solusinya adalah dengan cara membangun

“APLIKASI PENJUALAN PADA YAM YAM RESTAURANT BERBASIS

WEB SERVICE DENGAN METODE REST”. Aplikasi ini mencoba untuk

mempermudah kasir dalam perekapan laporan penjualan dan memprmudah pemilik

dalam medapatkan laporan penjualan.

Page 4: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

4

1.2. Rumusan Masalah

Berdasarkan permasalahan yang diuraikan di atas maka bisa dirumuskan.

a. Dalam membuat laporan penjualan yamyam restaurant masih

menggunakan sistem manual sehingga memerlukan waktu yang cukup

lama.

b. Pemilik tidak bisa mendapatkan laporan penjualan dari dua cabang secara

bersamaan

1.3. Batasan Masalah

Berdasarkan rumusan masalah yang diungkap di atas, maka dapat diambil

batasan masalah pada penelitian ini seperti berikut.

a. Dalam aplikasi ini menginputkan semua daftar menu dan harga kedalam

database.

b. Aplikasi ini dapat digunakan untuk transaksi penjualan.

c. Dalam aplikasi ini REST hanya menggunakan get.

1.4. Tujuan Penelitian

Adapun tujuan dari penelitian ini adalah membuat aplikasi penjualan pada

yamyam restaurant berbasis web service dengan metode REST.

1.5. Manfaat Penelitian

Manfaat yang dapat diperoleh dari pembuatan aplikasi ini adalah.

a. Memudahkan yamyam restaurant dalam membuat laporan penjualan.

b. Dengan menggunakan web service metode REST pemilik bisa

mendapatkan laporan penjualan secara bersamaan antara cabang

Yogyakarta dan Jepara.

Page 5: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

5

1.6. Metode Penelitian

1.6.1. Alat dan Bahan Penelitian

Kebutuhan perangkat keras dan perangkat lunak yang akan mendukung

proses pembuatan dan pemakaian program. Spesifikasi perangkat keras yang

digunakan adalah sebagai berikut.

a. Merek : HP Pavilion g4

b. Processor : Intel (R) Core(TM) i5-2430M

c. RAM : 4 GB

d. VGA : ATI RADEON R5

e. Hard Disk Drive : 500 GB

Adapun spesifikasi perangkat lunak yang digunakan adalah sebagai berikut.

a. Sistem Operasi Windows 7,

b. Notepad++,

c. sublime tex 3,

d. XAMPP.

1.6.2. Metode Pengumpulan Data

a. Observasi

Penelitian dilakukan dengan cara melakukan pengamatan secara

langsung di yamyam restaurant tentang bagaimana proses transaksi

penjualan dan pembuatan laporan penjualan di lakukan.

b. Wawancara

Penelitian dilakukan dengan cara mewawancarai pemilik yamyam

restaurant tentang bagaimana proses transaksi penjualan dan pembuatan

laporan.

1.6.3. Metode Perancangan Sistem

Metode yang digunakan dalam proses perancangan sistem adalah dengan

menggunakan metode Waterfall. Beberapa proses diagram waterfall adalah sebagai

berikut (Rosa A.S & M. Shalahuddin, 2014).

Page 6: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

6

Requirement

Analisis

System

Design

Implementation

Integration &

Testing

Operation &

Maintenance

Gambar 2.1 Metode Waterfall

1) Requirement Analisis

Analisis Kebutuhan Perangkat Lunak Proses pengumpulan kebutuhan

dilakukan secara intensif untuk menspesifikasikan kebutuhan perangkat

lunak agar dapat dipahami seperti apa yang dibutuhkan oleh user. Spesifikasi

kebutuhan perangkat lunak pada tahap ini perlu di dokumentasikan.

2) System Design

Desain perangkat lunak adalah proses multi langkah yang fokus pada

desain pembuatan program perangkat lunak termasuk struktur data, arsitektur

perangkat lunak, representasi antar muka dan prosedur pengkodean. Tahap

ini mentranslasi kebutuhan perangkat dari tahap analisis kebutuhan ke

reprentasi desain agar dapat di implementasikan program pada tahap

selanjutnya. Desain perangkat lunak yang di hasilkan pada tahap ini juga

perlu di dokumentasikan.

3) Implementation

Desain harus ditranslasikan kedalam program perangkat lunak. Hasil

dari tahap ini adalah program komputer sesuai dengan desain yang telah

dibuat pada tahap desain.

4) Integration & Testing

Pengujian fokus pada perangkat lunak dari segi logik dan fungsional

serta memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

Page 7: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

7

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai dengan yang diinginkan.

5) Operation & Maintenance

Tidak menutup kemungkinan sebuah perangkat lunak mengalami

perubahan ketika sudah dikirimkan ke user. Perubahan bisa terjadi karena

adanya kesalahan yang muncul dan tidak terdeteksi saat pengujian atau

perangkat lunak harus beradaptasi dengan lingkungan baru. Tahap

pendukung atau pemeliharaan dapat mengulangi proses pengembangan mulai

dari analisis spesifikasi untuk perubahan perangkat lunak yang sudah ada, tapi

tidak untuk membuat perangkat lunak baru.

1.7. Sistematika Penulisan

Dalam penyusunan dan penulisan laporan menggunakan sistematika

penulisan sebagai berikut.

BAB I PENDAHULUAN

Berisi tentang latar belakang masalah, batasan masalah,

rumusan masalah, batasan masalah, tujuan penelitian,

manfaat penelitian, metode penelitian, sistematika penulisan.

BAB II TINJAUAN PUSTAKA

Berisi tentang penelitian yang dilakukan sebelumnya diambil

berdasarkan judul yang berkaitan dengan web service.

BAB III LANDASAN TEORI

Berisi tentang teori yang digunakan sebagai landasan untuk

membuat aplikasi meliputi teori umum, perancangan sistem

dan perancangan antarmuka (interface).

BAB IV RANCANGAN PENELITIAN

Berisi tentang perancangan sistem yang meliputi arsitektur

sistem, data Flow diagram, normalisasi database, kamus data

tabel, rancangan tampilan user interface.

BAB V IMPLEMENTASI

Page 8: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

8

Berisi tentang implementasi perancangan sistem pada Bab IV

ke dalam program aplikasi web service, sehingga aplikasi

yang dirancang dapat berjalan.

BAB VI KESIMPULAN DAN SARAN

Menguraikan tentang kesimpulan hasil penelitian dan saran

mengenai sistem yang telah dibuat.

Page 9: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

9

BAB IV

RANCANGAN PENELITIAN

Perancangan sistem secara umum dilakukan dengan tujuan untuk

memberikan gambaran mengenai sistem yang akan dibuat. Pada tahap perancangan

ini akan dijelaskan mengenai cara kerja, alur, dan rancangan tampilan aplikasi yang

di buat.

4.1 Analisis Kebutuhan

4.1.1 Analisis Kebutuhan Fungsional

Analisis yang meliputi fungsi yang berjalan dalam sistem, menunjukkan

fasilitas apa yang dibutuhkan serta aktivitas apa saja yang terjadi dalam sistem.

Analisis kebutuhan fungsional menggambarkan proses kegiatan yang akan

diimplementasikan dalam sebuah system dan menjelaskan kebutuhan yang

diperlukan sistem agar dapat berjalan sesuai dengan yang diharapkan. Dalam hal

ini kebutuhan fungsional yang harus dimiliki sistem adalah sebagai berikut.

a. Sistem klien (owner) dapat menampilkan data yang direquest dari web

service menggunakan metode REST.

b. Sistem klien (owner) dapat mengakses laporan penjualan dari dua server

secara bersamaan.

c. Sistem dapat menampilkan data sesuai dengan data yang ada di web server.

4.1.2 Analisis Kebutuhan non Fungsional

Untuk menunjang kinerja sistem syarat non-fungsional yang harus dipenuhi

adalah koneksi internet yang memadai untuk menjalankan sistem.

4.2 Arsitektur Sistem

Implementasi web service pada aplikasi laporan penjualan ini merupakan

implementasikan dari arsitektur RESTful web service. Web Server dan aplikasi klien

berinteraksi dengan interface platform yang berbeda dimana server mengirim data

yang direquest oleh web service client.

Page 10: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

10

Rancangan arsitektur implementasi web service pada aplikasi laporan

penjualan dapat dilihat pada gambar 4.1.

Gambar 4.1 Arsitektur web service pada aplikasi laporan penjualan

Pada gambar 4.1 dapat dilihat arsitektur sistem yang digunakan dalam

implementasi web service pada aplikasi penjualan. Web server sebagai penyedia

data yang berhubungan dengan sistem klien dengan menggunakan internet dan

REST sebagai jembatan aliran data

Sistem klien (owner) meminta (request) data ke web server melalui web

service menggunakan REST sebagai penghubung, dan data yang ada pada database

server akan ditampilkan dalam sistem klien sesuai dengan data yang di request.

Berikut adalah kebutuhan service yang digunakan pada aplikasi ini dapat dilihat

pada tabel 4.5.

Page 11: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

11

Tabel 4.5 Kebutuhan Service

Request Respond Keterangan

Yamyamorderan Json orderan

(yamyam jogja)

Json orderan

(yamyamjepara)

Request data orderan dari

yamyam jogja dan yamyam

jepara

Jogja rest Json detail orderan

(yamyam jogja)

Request data detail orderan dari

yamyam jogja

Jepara rest Json detail orderan

(jepara rest)

Request data detail orderan dari

yamyam jepara

Index Json orderan (saat

database dalam

keadaan kosong)

Json laporan (saat

database sudah terisi)

Request laporan pendapatan

dari yamyam jogja dan yamyam

jepara serta menyimpan hasil

request pada data base

4.3 Normalisasi Database

4.3.1 Bentuk Tidak Normal

Pada bentuk ini semua atribut masih dalam satu tabel dan masih terjadi

duplikasi data, Berikut tampilan dari bentuk tidak normal seperti pada Gambar 4.2.

Gambar 4.2 Bentuk Tidak Normal

4.3.2 Bentuk Normal 1 (1NF)

Bentuk normal tahap pertama (1 NF) terpenuhi jika tabel tidak memiliki

atribut bernilai banyak atau lebih dari satu atribut dengan domain nilai yang sama.

seperti pada Gambar 4.3.

Page 12: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

12

Gambar 4.3 Bentuk Normal 1 (1NF)

4.3.3 Bentuk Normal 2 (2NF)

Pada bentuk normal kedua data dipisah dengan menggunakan primary key,

Dan pada bentuk normal kedua ini dihubungkan dengan menggunakan foreign key,

Berikut tampilan dari bentuk normal ketiga seperti pada Gambar 4.4.

Gambar 4.4 Bentuk Normal 2 (2NF)

Page 13: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

13

4.3.4 Relasi Antar Tabel

Pada rancangan ini terdapat 4 tabel yang saling berelasi diantaranya tabel

member, tabel pemesanan, tabel produk, dan tabel karyawan. Semua tabel yang

berelasi mempunyai kardinalitas one to many, Berikut rancangan dari Relasi Antar

Tabel seperti pada Gambar 4.5.

Gambar 4.5 Relasi Antar Tabel

4.4 Kamus Data Tabel

Kamus data atau disebut juga dengan istilah catalog system yang merupakan

penyimpanan terpusat dari informasi tentang database. Kamus data berisi nama

tabel, serta field-field yang ada di dalamnya seperti tipe data, primary key, dan

indeks.

4.4.1 Tabel Menu

Nama tabel : menu

Fungsi : menyimpan data menu

Kunci primer : id_menu

Kunci tamu : -

Page 14: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

14

Tabel 4.1 Tabel Menu

Nama Kolom Tipe Data Panjang/Nilai Keterangan

Id_menu int 10 Id artikel

Nma_menu varchar 30 Nama menu

Harga_menu int 15 Harga menu

Kategori_menu varchar 25 Kategori menu

4.4.2 Tabel Order

Nama tabel : order

Fungsi : menyimpan data order

Kunci primer : id_order

Kunci tamu : -

Tabel 4.2 Tabel Order

Nama Kolom Tipe Data Panjang/Nilai Keterangan

Id_order int 10 Id order

Id_karyawan varchar 30 Order di tempat

Jenis_order varchar 30 Reservasi

Nma_pembeli varchar 30 Nama pembeli

Alamat varchar 50 Alamat pembeli

No_tlp int 15 No tlp pembeli

Tgl date - Tgl beli

Nomor_meja varchar 10 Nomor meja

Total int 25 Total

4.4.3 Tabel Order Detail

Nama tabel : order_detail

Fungsi : menyimpan data order detail

Kunci primer : id_detail

Kunci tamu : id_order, id_menu

Page 15: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

15

Tabel 4.3 Tabel Order Detail

Nama Kolom Tipe Data Panjang/Nilai Keterangan

Id_detail int 10 Id detail

Id_order int 10 Id order

Id_menu int 10 Id menu

Jumlah int 25 Jumlah order

4.4.4 Tabel Karyawan

Nama tabel : karyawan

Fungsi : menyimpan data karyawan

Kunci primer : id_karyawan

Kunci tamu : -

Tabel 4.4 Tabel Order Detail

Nama Kolom Tipe Data Panjang/Nilai Keterangan

Id_karyawan int 10 Id detail

Nma_karyawan int 10 Id order

Alamat int 30 Alamat karywan

Username int 20 Username

Password int 10 Password

1.5 Data Flow Diagram

4.5.1 Diagram Konteks

Pada diagram konteks ini menggambarkan entitas apa saja yang

berhubungan dengan sistem, Ada 2 entitas yaitu entitas admin, dan kasir. Didalam

entitas admin bisa input data menu dan data karyawan. Didalam entitas kasir bisa

melakukan transaksi dan akses laporan. Berikut tampilan dari Diagram Konteks

seperti pada Gambar 4.6.

Page 16: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

16

Gambar 4.6 Diagram Konteks

4.5.2 DFD Level 0

DFD Level 0 akan menggambarkan alur keseluruhan proses pada sistem,

Pada diagram ini terdapat 3 proses utama dari sistem, Proses 1 input data yaitu

admin menginputkan data seperti data menu dan data karyawan. Proses 2 transaksi

proses ini kasir bisa menginputkan order, untuk transaksinya sistem mengakses data

dari data menu dan karyawan setelah proses pemesanan selesai maka data akan

disimpan kedalam store order. Proses 3 laporan proses ini adalah dimana sistem

mengambil data dari store order dan order detail untuk menapilkan laporan. Berikut

tampilan dari DFD Level 0 seperti pada Gambar 4.7.

Gambar 4.7 DFD Level 0

Page 17: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

17

4.5.3 DFD Level 1 Input Data

DFD Level 1 input data merupakan gambaran dari proses 1 yang ada pada

DFD Level 0, Pada diagram ini digambarkan bahwa admin bisa input data menu

dan data karyawan, ketika admin menginputkan data menu maka sistem akan

memproses dan akan disimpan kedalam store menu, dan apabila admin

menginputkan data karyawan maka akan disimpan kedalam store karyawan.

Berikut tampilan dari DFD Level 1 input data seperti pada Gambar 4.8.

Gambar 4.8 DFD Level 1 Input Data

4.5.4 DFD Level 1 Transaksi

DFD Level 1 transaksi merupakan gambaran dari proses 2 yang ada pada

DFD Level 0, Proses transaksi yang dijalankan oleh entitas kasir, Terdapat dua

sumber data yang berasal dari store menu dan karyawan yang diperlukan pada

proses transaksi, jika kasir menginputkan data pemesanan maka sistem akan

mengambil data menu dari store menu, setelah transaksi selesai maka data order

disimpan kedalam store order dan detail ordernya disimpan kedalam store order

detail. Berikut tampilan dari DFD Level 1 transaksi seperti pada Gambar 4.9.

Page 18: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

18

Gambar 4.9 DFD Level 1 Transaksi

4.5.5 DFD Level 1 Tampil Data

DFD Level 1 tampil data merupakan gambaran dari proses 3 yang ada pada

DFD Level 0, Pada diagram ini digambarkan aliran data yang berasal dari store

order dan order detail kemudian dirposes sehingga dapat menghasilkan laporan.

Berikut tampilan dari DFD Level 1 Cetak Laporan seperti pada Gambar 4.10.

Gambar 4.10 DFD Level 1 Transaksi

4.6 Flowchart

Flowchart adalah untuk menggambarkan, menyederhanakan rangkaian

proses atau prosedur sehingga mudah dipahami dan mudah dilihat berdasarkan

urutan langkah dari suatu proses.

4.6.1 Flowchart System Resto

Flowchart system resto merupakan bagan yang menunjukkan arus pekerjaan

secara keseluruhan dari sistem yogyakarta atau jepara. Dapat dilihat seperti pada

gambar 4.11.

Page 19: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

19

Gambar 4.11 Flowchart System Resto

4.6.2 Flowchart System Owner

Flowchart system owner merupakan bagan yang menunjukkan arus

pekerjaan secara keseluruhan dari sistem. Dapat dilihat seperti pada gambar 4.12

Gambar 4.12 Flowchart System Owner

Page 20: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

20

4.6.3 Flowchart Program Resto

Flowchart program resto menjelaskan tentang langkah-langkah proses

mengolah data di program yogyakarta atau jepara. Dapat dilihat seperti pada

gambar 4.13.

Gambar 4.13 Flowchart Program Server

4.6.4 Flowchart Program Owner

Flowchart program owner menjelaskan tentang langkah-langkah proses

mengolah data dibagian owner. Dapat dilihat seperti pada gambar 4.14.

Page 21: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

21

Gambar 4.14 Flowchart Program Owner

4.7 Rancangan Tampilan Resto

4.7.1 Halaman Login

Halaman login admin kasir merupakan halaman awal ketika seorang

petugas akan menjalankan aplikasi. Pada halaman login terdapat 2 input text yaitu

username dan password yang harus diisi oleh petugas, username berisikan

kombinasi antara huruf dan angka atau bisa hanya huruf saja dan untuk password

juga sama. Setelah kedua input text tersebut dimasukan, petugas bisa menekan

tombol login. Setelah login sukses maka akan menuju halaman selanjutnya. Berikut

tampilan dari halaman login seperti pada Gambar 4.15.

Page 22: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

22

Gambar 4.15 Halaman Login

4.7.2 Halaman Dashboard

Setelah login sukses maka akan langsung dihadapkan dengan halaman

utama admin, di halaman ini terdapat beberapa pilihan yaitu Dashboard sebagai

halaman utama, Orders untuk menginputkan semua yang sudah dipesan, dan Order

List untuk melihat semua yang sudah diinputkan. Lalu tombol Logout untuk keluar

dari halaman admin. Berikut ini adalah tampilan dari halaman dashboard atau

halaman utama pada admin seperti pada Gambar 4.16

Gambar 4.16 Halaman Dashboard

Page 23: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

23

4.7.3 Halaman Orders

Dihalaman orders ini petugas bisa menginputkan nama pembeli, alamat,

type dan nomor telepon, selanjutnya petugas perlu mencari menu yang sudah di

pesan, setelah menu ketemu lalu ceklist di bagian order dan memasukkan jumlah

makanan yang di pesan pada bagian count, jika ada tips maka petugas

menginputkan di kolom tips. Setelah selesai input semua tekan tombol save untuk

menyimpan. Berikut ini adalah tampilan dari halaman Orders seperti pada Gambar

4.17.

Gambar 4.17 Halaman Orders

4.7.4 Halaman Ordr List

Selanjutnya pada halaman order list ini petugas bisa semua transaksi yang

sudah di inputkan pada bagian order, didalam menu order list petugas bisa melihat

kode, nama pembeli, total dan access. Ketika petugas mengeklik tombol access

maka petugas bisa melihat transaksi dengan detail. Berikut ini adalah tampilan dari

halaman Orders List seperti pada Gambar 4.18.

Page 24: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

24

Gambar 4. 18 Halaman Ordeer list

4.7.5 Halaman Order List Detail

Jika petugas menekan tombol Detail pada order list maka akan arahkan ke

halaman Order List Detail, didalam halaman ini petugas bisa melihat secara detail

dari kode, nama pemesan, tanggal pesan, meja, setatus, dan semua menu yang sudah

dipesan bisa ditampilkan di halaman ini. Berikut ini adalah tampilan dari halaman

Orders Lis Detail seperti pada Gambar 4.19.

Gambar 4.19 Halaman Ordeer list

Page 25: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

25

4.8 Rancangan Tampilan Owner

4.8.1 Halaman Login Admin

Halaman login admin merupakan halaman awal ketika seorang petugas

akan menjalankan aplikasi. Pada halaman login terdapat 2 input text yaitu username

dan password yang harus diisi oleh petugas, username berisikan kombinasi antara

huruf dan angka atau bisa hanya huruf saja dan untuk password juga sama. Setelah

kedua input text tersebut dimasukan, petugas bisa menekan tombol login. Setelah

login sukses maka akan menuju halaman selanjutnya. Berikut tampilan dari

halaman login seperti pada Gambar 4.15.

4.8.2 Halaman Dashboard

Setelah login sukses maka akan langsung dihadapkan dengan halaman

utama admin, di halaman ini terdapat beberapa pilihan yaitu Dashboard sebagai

halaman utama, transaksi, harian, mingguan, bulanan. Lalu tombol Logout untuk

keluar dari halaman admin. Berikut ini adalah tampilan dari halaman dashboard

seperti pada Gambar 4.20.

Gambar 4.20 Halaman Dashboard

Page 26: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

26

4.8.3 Halaman Transaksi

Pada menu transaksi mangaer bisa melihat melihat secara onetime transaksi

dalam dua cabang sekaligus, ketika manager menekan tombol detail maka bisa

melihat menu yang terjual, jumlah menu yang terjual, harga per-item, dan total

pembayaran dalam satu nota. Adapun tampilan dari halaman transaksi seperti pada

Gambar 4.21, dan 4.22.

Gambar 4.21 Halaman Transaksi

Gambar 4.22 Halaman Transaksi

Page 27: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

27

4.8.4 Halaman Laporan Harian

Halaman laporan Harian ini manager bisa melihat laporan penghasilan per-

hari dari cabang jogja dan cabang jepara secara bersamaaan. Adapun tampilan dari

halaman Laporan Harian seperti pada Gambar 5.23.

Gambar 4.23 Halaman Laporan Harian

4.8.5 Halaman Laporan Mingguan

Halaman laporan Mingguan ini manager bisa melihat laporan penghasilan

per-minggu dari cabang jogja dan cabang jepara secara bersamaaan. Adapun

tampilan dari halaman Laporan Mingguan seperti pada Gambar 5.24

Page 28: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

28

Gambar 4.24 Halaman Laporan Mingguan

4.8.6 Halaman Laporan Bulanan

Halaman laporan Bulanan ini manager bisa melihat laporan penghasilan

per-bulan dari cabang jogja dan cabang jepara secara bersamaaan. Adapun tampilan

dari halaman Laporan Bulanan seperti pada Gambar 5.25.

Gambar 4.25 Halaman Laporan Bulanan

Page 29: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

29

BAB V

IMPLEMENTASI

5.1 Implementasi REST

5.1.1 Refresh Data

Pada gambar 5.1 adalah kode api yang digunakan untuk rifresh data dan

mengambil data dari database server, Data tersebut kemudian di encode menjadi

file JSON berupa data mentah dengan bentuk array yang nantinya akan diolah di

dalam service tapi dalam halaman dashboard ini tidak di tampilkan karena hanya

merifresh data yang akan digunakan dalam transaksi yang lain data mentah JSON

dapat dilihat pada gambar 5.2

<?php include "koneksi.php"; $time = mysqli_query($conn, "SELECT MAX(tanggal) FROM laporan"); $row = mysqli_fetch_array($time); if ($row[0] != "") { $time1 = $row[0]; $server = array("http://localhost/yamyamjogja/index.php/json/laporan/$time1","http://localhost/yam/index.php/json/laporan/$time1"); } else { $server = array("http://localhost/yamyamjogja/index.php/json/index","http://localhost/yam/index.php/json/index"); } foreach ($server as $url) { getData($url); } function getData($url) {global $conn; $result = json_decode($response, true); if(is_array($result)){ foreach ($result as $r) { $id_order = $r['id_order']; $lokasi = $r['lokasi']; $tgl = $r['tgl']; $total = $r['total']; if($lokasi === "jogja"){ $query = mysqli_query($conn, "INSERT INTO laporan (id_lap,tanggal,total,lokasi) VALUES ('A$id_order','$tgl','$total','$lokasi') ON DUPLICATE KEY UPDATE tanggal=VALUES(tanggal), total=VALUES(total)");}else{ $query = mysqli_query($conn, "INSERT INTO laporan (id_lap,tanggal,total,lokasi) VALUES ('B$id_order','$tgl','$total','$lokasi')

Page 30: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

30

ON DUPLICATE KEY UPDATE tanggal=VALUES(tanggal), total=VALUES(total)" );}

Gambar 5.1 Source Code Api Refresh Data

Gambar 5.2 Tampilan JSON Refresh Data

5.1.2 API Transaksi

Dalam transaksi dibuat api yang terdiri atas kumpulan intruksi yang nanti

digunakan untuk mengirim data dari server. Berikut source code yang digunakan

untuk mengirim data dari server dapat dilihat pada gambar 5.3.

<?php foreach ($query->result() as $q) { $id_order[] = $q->id_order; $nama_pembeli[] = $q->nama_pembeli; $tgl[] = $q->tgl; $total[] = $q->total; } $orderan = array(); $i = 0; while ($i < $query->num_rows()) { array_push($orderan,array( 'id_order' => $id_order[$i], 'nama_pembeli' => $nama_pembeli[$i], 'lokasi' => "jogja", 'tgl' => $tgl[$i], 'total' => $total[$i] )); $i++; }

Page 31: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

31

echo json_encode($orderan); ?> Detaiil <?php foreach ($query->result() as $q) { $nama_menu[] = $q->nama_menu; $jumlah[] = $q->jumlah; $harga_menu[] = $q->harga_menu; } $result = array(); $i = 0; while ($i < $query->num_rows()) { array_push($result,array( 'nama_menu' => $nama_menu[$i], 'jumlah' => $jumlah[$i], 'harga_menu' => $harga_menu[$i] )); $i++; } echo json_encode($result); ?>

Gambar 5.3 Source Code Api Transaksi

Pada gambar 5.3 adalah kode api yang digunakan untuk mengambil data

dari database server, Data tersebut kemudian di encode menjadi file JSON berupa

data mentah dengan bentuk array yang nantinya akan diolah dalam service. Data

mentah JSON dapat dilihat pada gambar 5.4.

Gambar 5.4 Tampilan JSON Transaksi

5.1.3 API Detail

Page 32: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

32

Detail pada halaman transaksi sebelum menjadi tampilan ada proses JSON

untuk mengambil data dari database server. Berikut adalah source code API yang

digunakan untuk mengambil data dapat dilihat pada gambar 5.5.

<?php foreach ($query->result() as $q) { $id_order[] = $q->id_order; $nama_pembeli[] = $q->nama_pembeli; $tgl[] = $q->tgl; $total[] = $q->total; } $orderan = array(); $i = 0; while ($i < $query->num_rows()) { array_push($orderan,array( 'id_order' => $id_order[$i], 'nama_pembeli' => $nama_pembeli[$i], 'lokasi' => "jogja", 'tgl' => $tgl[$i], 'total' => $total[$i] )); $i++;} echo json_encode($orderan); ?>

Gambar 5.5 Source Code API Detail

Pada gambar 5.5 adalah kode api yang digunakan untuk mengambil data

dari database server, Data tersebut kemudian di encode menjadi file JSON berupa

data mentah dengan bentuk array yang nantinya akan diolah dalam service. Data

mentah JSON dapat dilihat pada gambar 5.6.

Gambar 5.6 Tampilan JSON Detail

5.2 Aplikasi Resto

5.2.1 Halaman Login

Page 33: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

33

Halaman ini merupakan halaman awal ketika petugas membuka aplikasi,

petugas harus melakukan Login agar bisa mengakses aplikasi. Adapun tampilan

dari halaman login seperti pada Gambar 5.7.

Gambar 5.7 Halaman Login

Pada halaman login ini terdapat 2 input text yaitu username dan password

yang harus diisi oleh petugas, username berisikan kombinasi antara huruf dan angka

atau bisa hanya huruf saja dan untuk password juga sama. Setelah kedua input text

tersebut diinputkan, petugas bisa menekan tombol login. Proses login dilakukan

dengan cara mengirimkan username dan password dengan menggunakan metode

POST, Data dikirimkan kepada Controller, diterima dan dicocokan dengan data

yang ada didalam database dan source code untuk mengecek bisa dilihat pada tabel

5.1. Adapun source code untuk halaman login seperti pada Gambar 5.8.

function login_proses(){ $username = $this->input->post('username'); $password = $this->input->post('password'); $where = array( 'username' => $username, 'password' => $password ); $cek = $this->m_login->cek_login("admin",$where)->num_rows(); if($cek > 0){ class M_login extends CI_Model{ function cek_login($table,$where){ return $this->db->get_where($table,$where);

Gambar 5.8 Source Code Halaman Login

Page 34: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

34

5.2.2 Halaman Dashboard

Halaman Dashboard merupakan menu utama yang ada pada aplikasi Resto

ini, Dalam halaman ini juga terdapat beberapa menu yaitu Orders dan Order List.

Adapun tampilan dari halaman beranda seperti pada Gambar 5.9. dan source code

untuk halaman dashboard seperti pada Gambar 5.10.

Gambar 5.9 Halaman Dashboard

<?php $this->load->view('header'); ?> <div id="page-wrapper" > <div id="page-inner"> <div class="row"> <div class="col-md-12"> <h2>Welcome </h2> </div> </div> <!-- /. ROW --> <hr /> <!-- /. ROW --> </div> <!-- /. PAGE INNER --> </div> <!-- /. PAGE WRAPPER --> <?php $this->load->view('footer'); ?>

Gambar 5.10 Source Code Halaman Dashboard

5.2.3 Halaman Orders

Pada menu Orders petugas bisa menginputkan data order. Order by diisi

dengan nama pembeli, type digunakan untuk memilih ststus pembelian, type ada

tiga kategori yaitu order, delivery, dan reservasi, sedangkan alamat dan telepone

boleh diisi apabila pembeli dengan ststus delivery. Selanjutnya di bagian appetizer

list, food list, drink list, dan dessert list petugas harus memberi ceklist menu yang

Page 35: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

35

di pesan dan memasukkan jumlah yang di pesan. Lalu bagian tips petugas

memasukkan jumlah tips yang diberikan oleh tamu, tombol save untuk menyimpan.

Adapun tampilan dari halaman beranda seperti pada Gambar 5.11. dan source code

untuk halaman orders seperti pada Gambar 5.12.

Gambar 5.11 Halaman Orders

<?php $this->load->view('header'); ?> <div id="page-wrapper" > <div id="page-inner"> <form action="<?php echo base_url(); ?>index.php/order/pesan" method="post"> <div class="row"> <div class="col-lg-2 col-md-2"> <b>Order by :</b> </div> <div class="col-lg-4 col-md-4"> <input type="text" name="nama_pembeli" size="10"> </div> <div class="col-lg-2 col-md-2"> <b>Type :</b> </div> <div class="col-lg-4 col-md-4"> <select name="jenis_order"> <option value="Order"><b>Order</b></option> <option value="Delivery"><b>Delivery</b></option> <option value="Reservasi"><b>Reservasi</b></option> </select> </div> </div> <div class="row"> <div class="col-lg-2 col-md-2"> <b>Alamat :</b> </div> <div class="col-lg-2 col-md-2">

Page 36: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

36

<input type="text" name="alamat" size="10"> </div> <div class="col-lg-2 col-md-2"> <b>Telepon :</b> </div> <div class="col-lg-2 col-md-2"> <input type="text" name="no_telp" size="10"> </div> <div class="col-lg-2 col-md-2"> <b>Table :</b> </div> <div class="col-lg-2 col-md-2"> <input type="text" name="meja" size="10"> </div> </div> <div class="row"> <div class="col-lg-12 col-md-12"> <h5><b>Appetizer List</b></h5> <div class="table-responsive"> <table width="100%" class="table table-striped table-bordered table-hover" id="dataTables-example"> <thead> <tr> <th>#</th> <th>Name</th> <th>Price</th> <th>Order</th> <th>Count</th> </tr> </thead> <tbody> <?php $no=1; foreach($appetizer as $a){ ?> <tr class="success"> <td><?php echo $no; ?></td> <td><?php echo $a->nama_menu; ?></td> <td><?php echo $a->harga_menu; ?></td>

Gambar 5.12 Source Code Halaman Orders

5.2.4 Halaman Order List

Pada menu order list petugas bisa melihat transaksi yang sudah dilakukan

seperti melihat data nama, total, dan juga bisa melihat dengan detail. Adapun

tampilan dari halaman order list seperti pada Gambar 5.13. dan source code untuk

halaman order list seperti pada Gambar 5.14.

Page 37: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

37

Gambar 5.13 Halaman Order List

<?php $this->load->view('header'); ?>

<div id="page-wrapper" >

<div id="page-inner">

<div class="row">

<div class="col-lg-12 col-md-12">

<h5>Order List</h5>

<div class="table-responsive">

<table width="100%" class="table table-striped table-bordered

table-hover" id="dataTables-example">

<thead>

<tr>

<th>#</th>

<th>Kode</th>

<th>Name</th>

<th>Total</th>

<th>Access</th>

</tr>

</thead>

<tbody>

<?php $no=1; foreach($laporan as $lap){ ?>

<tr>

<td><?php echo $no; ?></td>

Page 38: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

38

<td><?php echo $lap->id_order; ?></td>

<td><?php echo $lap->nama_pembeli; ?></td>

<td>Rp <?php echo $lap->total; ?>,-</td>

<td><a href="<?php echo base_url()

?>index.php/orderlist/detail/<?php echo $lap->id_order; ?>" class="btn btn-

default">Detail</a></td>

</tr>

<?php $no++; } ?>

Gambar 5.14 Source Code Halaman Order List

Apabila detail pada order detail di klik maka akan menuju ke halaman orders

list detail. Didalam halaman ini petugas bisa melihat secara detail menu-menu yang

dipesan. Adapun tampilan dari halaman order list seperti pada Gambar 5.15. dan

source code untuk halaman orders list seperti pada Gambar 5.16

Gambar 5.15 Halaman Order List Detail

<?php $this->load->view('header'); ?> <?php $total_harga_app = 0; $total_harga_food = 0; $total_harga_drink = 0; $total_harga_dessert = 0; ?> <div id="page-wrapper" > <div id="page-inner"> <div class="row"> <div class="col-lg-12 col-md-12"> <h5>Order List Details</h5>

Page 39: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

39

<div class="table-responsive"> <table class="table"> <tr> <td>Kode : <?php echo $kode; ?></td> <?php foreach($info as $inf) : ?> <td>Name : <?php echo $inf->nama_pembeli; ?></td> <td>Date : <?php echo $inf->tgl; ?></td> <td>Table : <?php echo $inf->nomor_meja; ?></td> <td>Status : <?php echo $inf->jenis_order; ?></td> <?php endforeach; ?> </tr> <tr> <td colspan="5" class="info">Appetizaers</td> </tr> <?php if ($detail_app->num_rows() == 0){ ?> <tr> <?php $harga_app = 0; ?> <td colspan="5"><p align="center">Tidak ada pesanan</p></td> </tr> <?php }else{ ?> <?php foreach($detail_app->result() as $app) : ?> <tr> <td colspan="2"><?php echo $app->nama_menu; ?></td> <td><?php echo $app->jumlah; ?></td> <td><?php echo '@'.$app->harga_menu; ?></td> <?php $harga_app = $app->harga_menu*$app->jumlah; ?> <td><?php echo $harga_app; ?></td> <?php $total_harga_app = $total_harga_app + $harga_app; ?> </tr>

Gambar 5.16 Source Code Halaman Order LIst Detail

5.3 Aplikasi Owner

5.3.1 Halaman Login

Halaman ini merupakan halaman awal ketika manager membuka aplikasi,

petugas harus melakukan Login agar bisa mengakses aplikasi. Adapun tampilan

dari halaman login seperti pada Gambar 5.7. Adapun source code dari halaman

Login seperti pada Gambar 5.17.

function login_proses(){ $username = $this->input->post('username'); $password = $this->input->post('password');

Page 40: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

40

$where = array( 'username' => $username, 'password' => $password ); $cek = $this->m_login->cek_login("admin",$where)->num_rows(); if($cek > 0){ class M_login extends CI_Model{ function cek_login($table,$where){ return $this->db->get_where($table,$where);

Gambar 5.17 Source Code Halaman Login

5.3.2 Halaman Dashboard

Halaman Dashboard merupakan menu utama yang ada pada aplikasi ini,

Dalam halaman ini juga terdapat beberapa menu yaitu, transaksi, laporan, harian,

mingguan, dan bulanan. Adapun tampilan dari halaman beranda seperti pada

Gambar 5.18. dan source code untuk halaman dashboard seperti pada Gambar 5.19.

Gambar 5.18 Halaman Dashboard

Adapun source code dari halaman Transaksi seperti pada Gambar 5.19.

<?php include "koneksi.php"; include "refresh.php"; include "header.php"; ?> <div id="page-wrapper"> <div class="row"> <div class="col-lg-12"> <h1 class="page-header"></h1> </div> <!-- /.col-lg-12 --> </div> <div class="row"> <div class="col-lg-12"> <div class="panel panel-default"> <div class="panel-body">

Page 41: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

41

<h3>Welcome</h3> </div> </div></div></div></div> <?php include "footer.php"; ?>

Gambar 5.19 Source Code Halaman Transaksi

5.3.3 Halaman Transaksi

Setelah data json diolah dalam service dapat dilihat tampilan dari halaman

transaksi seperti pada Gambar 5.20, dan 5.21 source code dari halaman Transaksi.

Pada menu transaksi manger bisa melihat transaksi dalam dua cabang sekaligus,

ketika manager menekan tombol detail, maka bisa melihat menu yang terjual,

jumlah menu yang terjual, harga per-item, dan total pembayaran dalam satu nota

penjualan.

Gambar 5.20 Tampilan Halaman Transaksi Jogja

Adapun source code dari halaman Transaksi seperti pada Gambar 5.21.

<?php require_once "koneksi.php"; include "header.php"; $server = array("http://localhost/yamyamjogja/index.php/json/index","http://localhost/yam/index.php/json/index"); $lok = 1; foreach ($server as $url) { getData($url,$lok); $lok++; if ($err) { echo "cURL Error #1" . $err; }else{ if ($lok == 1) { $tempat = "Jogja"; }else{ $tempat = "Jepara"; }

Page 42: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

42

?> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Kode</td> <td>Nama</td> <td>Akses</td> </tr> <?php $result = json_decode($response, true); foreach ($result as $r) { $id_order = $r['id_order']; $nama_pembeli = $r['nama_pembeli']; $lokasi = $r['lokasi'];?> <tr> <td><?php echo $id_order; ?></td> <td><?php echo $nama_pembeli; ?></td> <td> <?php if($lokasi == "jogja"){ ?> <a href="http://localhost/rest/jogjarest.php?id=<?php echo $id_order; ?>">Detail</a> <?php }elseif ($lokasi == "jepara") { ?> <a href="http://localhost/rest/jepararest.php?id=<?php echo $id_order; ?>">Detail</a>

Gambar 5.21 Source Code Halaman Transaksi

Pada halaman detail order ini manager bisa melihat nama menu yang di

pesan, jumlah menu yang dipesan, harga pe-item, dan total pembayaran. Detail

order dapat dilihat pada gambar 5.22.

Gambar 5.22 Tampilan Halaman Detail Orderan

Adapun source code dari halaman detail orderan seperti pada Gambar 5.23.

<?php require_once "koneksi.php"; include "header.php"; $id = $_GET['id'];

Page 43: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

43

$curl = curl_init(); curl_setopt_array($curl, array( CURLOPT_URL => "http://localhost/yamyamjogja/index.php/json/detailOrderan/$id", CURLOPT_RETURNTRANSFER => true, CURLOPT_ENCODING => "", CURLOPT_MAXREDIRS => 10, CURLOPT_TIMEOUT => 30, CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1, CURLOPT_CUSTOMREQUEST => "GET", CURLOPT_POSTFIELDS => "", CURLOPT_HTTPHEADER => array("content-type: application/x-www-form-urlencoded"), )); <tr> <td>Nama</td> <td>Jumlah</td> <td>Harga per Item</td> <td>Total</td> </tr> <?php $result = json_decode($response, true); if(is_array($result)){ foreach ($result as $r) { $nama_menu = $r['nama_menu']; $jumlah = $r['jumlah']; $harga_menu = $r['harga_menu']; ?> <tr> <td><?php echo $nama_menu; ?></td> <td><?php echo $jumlah; ?></td> <td>@<?php echo $harga_menu; ?></td> <?php $harga_food = $jumlah * $harga_menu; $total_harga_food = $total_harga_food + $harga_food; ?> <td><?php echo $total_harga_food; ?></td> </tr>

Gambar 5.23 Source Code Halaman Detail Jogja

5.3.4 Halaman Laporan Harian

Pada halaman ini manager bisa melihat laporan penghasilan per-hari dari

cabang jogja dan cabang jepara secara bersamaaan. Halaman Laporan Harian

seperti pada pada Gambar 5.24.

Page 44: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

44

Gambar 5.24 Tampilan Halaman Laporan Harian

Adapun source code dari halaman laporan harian seperti pada Gambar 5.25.

<?php include "koneksi.php"; $data = mysqli_query($conn,"SELECT tanggal, sum(total) FROM laporan WHERE lokasi = 'jogja' GROUP BY date(tanggal)"); $data2 = mysqli_query($conn,"SELECT tanggal, sum(total) FROM laporan WHERE lokasi = 'jepara' GROUP BY date(tanggal)"); include "header.php"; ?> <h3>Penghasilan Jogja</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Nomor</td> <td>Tanggal</td> <td>Total</td> </tr> <?php $no = 1; while($row = mysqli_fetch_array($data)){ ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $row[0]; ?></td> <td><?php echo $row[1]; ?></td>

</tr> <?php $no++; } ?> <h3>Penghasilan Jepara</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Nomor</td> <td>Tanggal</td> <td>Total</td> </tr>

Page 45: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

45

<?php $no = 1; while($row = mysqli_fetch_array($data2)){ ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $row[0]; ?></td> <td><?php echo $row[1]; ?></td> </tr> <?php $no++; } ?> </table>

Gambar 5.25 Source Code Halaman Laporan Harian

5.3.5 Halaman Laporan Mingguan

Pada halaman ini manager bisa melihat laporan penghasilan per minggu dari

cabang jogja dan cabang jepara. Dapat dilihat tampilan dari Halaman Laporan

Mingguan seperti pada pada Gambar 5.26.

Gambar 5.26 Tampilan Halaman Laporan Mingguan

Adapun source code dari halaman laporan mingguan seperti pada Gambar 5.27.

<?php include "koneksi.php"; $data = mysqli_query($conn,"SELECT yearweek(tanggal), sum(total) FROM laporan WHERE lokasi = 'jogja' GROUP BY yearweek(tanggal)"); $data2 = mysqli_query($conn,"SELECT yearweek(tanggal), sum(total) FROM laporan WHERE lokasi = 'jepara' GROUP BY yearweek(tanggal)"); include "header.php";

Page 46: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

46

?> <h3>Penghasilan Jogja</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Nomor</td> <td>Minggu</td> <td>Total</td> </tr> <?php $no = 1; while($row = mysqli_fetch_array($data)){ ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $row[0]; ?></td> <td><?php echo $row[1]; ?></td> </tr> <?php $no++; } ?> h3>Penghasilan Jepara</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Nomor</td> <td>Minggu</td> <td>Total</td> </tr> <?php $no = 1;

while($row = mysqli_fetch_array($data2)){ ?> <tr> <td><?php echo $no; ?></td> <td><?php echo $row[0]; ?></td> <td><?php echo $row[1]; ?></td> </tr> <?php $no++; } ?>

Gambar 5.27 Source Code Halaman Laporan Mingguan

5.3.6 Halaman Laporan Bulanan

Pada Halaman laporan Bulanan ini manager bisa melihat laporan

penghasilan per-bulan dari cabang jogja dan cabang jepara secara bersamaaan.

Untuk tampilan halaman laporan bulanan dapat pada Gambar 5.28.

Page 47: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

47

Gambar 5.28 Tampilan Halaman Laporan Bulanan

Adapun source code dari halaman laporan bulanan seperti pada Gambar 5.29.

<?php include "koneksi.php"; $data = mysqli_query($conn,"SELECT month(tanggal), sum(total) FROM laporan WHERE lokasi = 'jogja' GROUP BY month(tanggal)"); $data2 = mysqli_query($conn,"SELECT month(tanggal), sum(total) FROM laporan WHERE lokasi = 'jepara' GROUP BY month(tanggal)"); include "header.php"; ?> <h3>Penghasilan Jogja</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr><td>Nomor</td> <td>Bulan</td> <td>Total</td></tr> <h3>Penghasilan Jepara</h3> <table class="table table-striped table-bordered table-hover" id="dataTables-example"> <tr> <td>Nomor</td> <td>Bulan</td> <td>Total</td> </tr>

Gambar 5.29 Source Code Halaman Laporan Bulanan

Page 48: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

48

BAB VI

KESIMPULAN DAN SARAN

1.1 Kesimpulan

Berdasarkan proses penelitian yang telah dilakukan bahwa yamyam

restaurant membutuhkan aplikasi untuk membantu mempermudah kasir dalam

pembuatan laporan penjualan dan pemilik restaurant membutuhkan aplikasi yang

bisa membantu untuk monitoring semua cabang sehingga dapat disimpulkan

sebagai berikut.

1. Aplikasi ini bisa memberikan laporan penjualan kepada pemilik secara

bersamaan antara cabang Yogyakarta dan Jepara.

2. Aplikasi ini bisa membantu kasir dalam pembuatan laporan penjualan.

1.2 Saran

Adapun beberapahal yang diperlukan untuk pengembangan aplikasi yaitu

sebagai berikut.

1. Kedepannya aplikasi bisa ditambahkan metods yang lain.

2. Untuk web klien bisa dibuat responsif supaya bisa diakses dengan

mobile.

Page 49: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

49

DAFTAR PUSTAKA

Deviana, H. (2011). Penerapan XML Web service Pada Sistem Distribusi Barang.

Politeknik Negeri Sriwijaya, 6(2), 61–70.

Djuandi, F. (2016). Pemrograman Java dengan Spring 4. Jakarta: Elex Media

Komputindo.

Fathansyah. (2012). Basis Data Edisi Revisi. Bandung: Informatika.

Feridi. (2016). Mengenal RESTful Web Services,

https://www.codepolitan.com/mengenal-restful-web-services/, 25 Februari

2016, diakses 3 September 2018, pukul 16.00WIB

Hidayatullah, P., & Kawistara, J. K. (2014), Pemrograman Web, ,Bandung:

Informatika Bandung.

Jamhari. (2017). Web Service Client PDPT STMIK EL Rahma. Skripsi, STMIK El-

Rahma Yogyakarta.

Jogiyanto. (2005). Analisa dan Desain Sistem Informasi: Pendekatan Terstruktur

Teori dan Praktik Aplikasi Bisnis. Yogyakarta: Andi offset.

Kadir, A. (2003). Pengenalan Sistem Informasi. Yogyakarta : Andi.

Muchlisa, A. N. (2016). Rancang Bangun Aplikasi E-Commerce Berbasis Web

Service. Fakultas Sains Dan Teknologi UIN.

M. Rudyanto Arief. (2011). Pemrograman Web Dinamis Menggunakan PHP

dan MySQL. Yongyakarta: Andi Offset.

Raniastri, D. (2013). Implementasi Web Service Dengan Metode Representational

State Transfer (REST) Untuk Integrasi Data Transaksi di PT. Meliana Perkasa

Sejahtera (MPS).

Rosa A.S, & M. Shalahuddin. (2014). Rekayasa Perangkat Lunak Terstrutur dan

Berorientasi Objek. Bandung: Informatika.

Safaat H. N., (2012). Pemrograman Aplikasi Mobile Smartphone dan Tablet PC

Berbasis Android, Bandung:Informatika.

Solichin, A. (2016). Pemrograman Web Dengan Php Dan Mysql. Yogyakarta: Andi

Offset.

Utomo, W. H. (2016). Pemrograman Web Servis dan SOA dengan Netbeans.

Yogyakarta: Andi Offset.

Wiswakarma, K. (2010). 9 Langkah Menjadi Master Framework Codeigniter.

Page 50: WEB SERVICE DENGAN METODE REST - …jurnal.stmikelrahma.ac.id/assets/file/Jeni Haryanto--stmikelrahma.pdf · done by typing the purchase note into Microsoft Excel, and the report

50

Yogyakarta: Lokomedia.

Soran, (2017) Pengertian Aplikasi Dan Contohnya Serta Beberapa Jenisnya,

http://www.pengertianku.net/2017/07/pengertian-aplikasi-dan-contohnya-

serta-beberapa-jenisnya.html, 07 Juli 2017, diakses 3 september 2018, pukul

17.00WIB

Yunianto, E., & Riswanto, E. (n.d.). Pengamanan web service studi kasus sistem

informasi akademik stmik el rahma 1, 1–14.