Tutorial Codeigniter (Studi Kasus Online Shop) Part 2

Setelah kita berhasil mendownload dan menginstall Code Generator Codeigniter, langkah berikutnya adalah kita membuat database dan mengeneratenya hingga menghasilkan code Crud secara otomatis.

Berikut Contoh desain database untuk Database Online Shop

Table of Contents

Desain Database

Pembuatan Database

Langkah pertama kita buat tabel dengan nama products dengan Query sebagai berikut:

CREATE TABLE `products` (
  `id` int(10) NOT NULL,
  `id_kategori` int(3) NOT NULL,
  `name` varchar(50) NOT NULL,
  `description` text NOT NULL,
  `price` int(9) NOT NULL,
  `stock` int(3) NOT NULL,
  `image` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;

ALTER TABLE `products`
  ADD PRIMARY KEY (`id`);

Berikutnya kita buat tabel dengan nama tbl_kategori dengan Query sebgai berikut :

CREATE TABLE `tbl_kategori` (
  `id` int(3) NOT NULL,
  `kategori` varchar(25) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
ALTER TABLE `tbl_kategori`
  ADD PRIMARY KEY (`id`);

Selanjutnya kita buat tabel invoices dengan Query sebagai berikut :

CREATE TABLE `invoices` (
  `id` int(10) NOT NULL,
  `id_user` int(3) NOT NULL,
  `date` datetime NOT NULL,
  `due_date` datetime NOT NULL,
  `status` enum('paid','unpaid','canceled','expired') NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
ALTER TABLE `invoices`
  ADD PRIMARY KEY (`id`);

Yang terakhir kita buat tabel dengan nama orders dengan Query sebagai berikut :

CREATE TABLE `orders` (
  `id` int(10) NOT NULL,
  `invoice_id` int(10) NOT NULL,
  `product_id` int(10) NOT NULL,
  `product_name` varchar(50) NOT NULL,
  `qty` int(3) NOT NULL,
  `price` int(9) NOT NULL,
  `options` text NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=latin1;
ALTER TABLE `products`
  ADD PRIMARY KEY (`id`);

Jika semua tabel sudah dibuat langkah berikutnya kita inputkan data dummy pada tabel produk dan kategori dengan query berikut ini

INSERT INTO `products` (`id`, `id_kategori`, `name`, `description`, `price`, `stock`, `image`) VALUES
(1, 3, 'Baju', 'Baju Kemeja', 79000, 5, '542.jpg'),
(2, 2, 'Sandal Casual', 'Sandal Jepit Casual', 35000, 10, '312618_011.jpg'),
(3, 1, 'Topi', 'Topi Casual', 80000, 12, '91qz+oNEDIL._SL1500__.jpg'),
(4, 3, 'Kaos', 'Kaos Inwepo', 50000, 1, 'kaos.png'),
(5, 1, 'Dasi', 'Dasi Formal', 77500, 1, 'Platinum-Ties-Mens-Red-Power-Tie-Necktie-P14034714.jpg'),
(6, 4, 'Celana Panjang', 'Chino', 200000, 3, 'celana_panjang.jpg'),
(7, 4, 'Celana Pendek', 'Jeans', 150000, 4, 'celana_pendek.jpg'),
(8, 2, 'Sepatu Futsal', 'Specs', 350000, 1, 'sepatu_futsal.jpg'),
(9, 2, 'Sepatu', 'Sepatu Harga 15K dijual 90K', 90000, 10, 'sepatu_futsal.jpg');

INSERT INTO `tbl_kategori` (`id`, `kategori`) VALUES
(1, 'Asesoris'),
(2, 'Sepatu'),
(3, 'Baju'),
(4, 'Celana');

Generate Tabel Kategori menggunakan Code Generator Codeigniter

Jika tabel pada database sudah siap digenerate, langkah selanjutnya buka project toko online yang sudah kalian buat sebelumnya menggunakan browser kemudian tambahkan code diakhir project kalian seperti berikut ini, http://localhost/lsp_toko_online/code/, sehingga muncul tampilan seperti gambar berikut ini
perhatikan menu sebelah kiri, di situ terdapat beberapa menu diantaranya, pilih tabel, menu ini digunakan untuk memilih tabel mana yang akan kita generate codenya, kemudian ada menu tabel Reguler dan Serverside Datatable, menu ini digunakan untuk memilih bagaiman,a kita ingin menampilkan data pada view, berupa tabel reguler atau menggunakan library Serverside Datatable.
Menu Export Excel dan Word jika kita Checklist maka pada menu form aplikasi kita nanti akan ditambahkan tombol untuk Export Data ke Excel dan Export data ke Word
Nama Controller diguunakan untuk memberi nama controller dari tabel yang akan kita generate, begitu pula untuk Nama Model, kalian bisa ubah nama controller dan modelnya sesuai keinginan kalian.
Jika Tabel dan Option lainnya sudah dipilih, langkah selanjutnya adalah menekan tombol generate Warna Biru, Apa bedanya dengan Generate All ?, generate All digunakan untuk mengenerate Semua table yang ada dalam database, pada contoh kali ini, kita gunakan Tombol Generate yang warna Biru
jika sudah berhasil, maka akan muncul tampilan seperti gambar di bawah ini
Untuk meyakinkan apakah file benar-benar tergenerate, silahkan buka folder project kalian kemudian cek pada folder View, Controller dan Model pada Folder Aplication.
Nah agar file yang kita generate tadi dapat kita akses, kita inputkan nama Controller hasil generate tadi pada Menu KELOLA MENU, caranya klik Menu KELOLA MENU pada Dashboard utama, kemudian klik Tambah Data, setelah itu inputkan sesuai gambar di bawah ini :
Perlu diingat, Title merupakan Nama untuk Menu di Sidebar, sedangkan URL adalah Controller yang sudah kita generate, dan icon adalah pilihan icon untuk menu kita, is Main Menu untuk memilih Menu Induk, jika menu induk tidak ada, silahkan buat terlebih dahulu menu induknya, untuk URL menu induk beri isian #
Jika sudah terisi semua, tekan tombol Create untuk Menyimpan
Jika sudah tersimpan, lihat Sidebar sebelah kiri, menu yang kita buat tadi sudahntertambah secara otomatis.
Lakukan untuk tabel-tabel yang lain

Generate Tabel Product

Setelah kita mengenerate Tabel Kategori, sekarang kita generate tabel produk, caranya sama seperti sebelumnya buka http://localhost/lsp_toko_online/code, Kemudian pilih tabel Product,
Sesuaikan nama Controller dan Modelnya Setelah itu Klik Tombol Generate.
Nah agar file yang kita generate tadi dapat kita akses, kita inputkan nama Controller hasil generate tadi pada Menu KELOLA MENU, Lihat Contoh berikut ini.
Jika sudah terisi semua, tekan tombol Create untuk Menyimpan
Jika sudah tersimpan, lihat Sidebar sebelah kiri, menu yang kita buat tadi tertambah secara otomatis.
Silahkan klik menu produk pada sidebar, jika berhasil akan mendapatkan tampilkan seperti ini

Pada data tabel diatas, terdapat kejanggalan pada kolom id_kategori dan Image, seharusnya dalam kolom id_kategori terisi Nama Kategori dari produk dan Image seharusnya menampilkan gambar produk, nah agar sama dengan keinginan kita, buka folder View > Products > products_list.php kemudian sesuaikan kodingnya pada baris ke 73 seperti listing berikut ini

CARI CODE BERIKUT 
<td><?php echo $products->image ?></td>

KEMUDIAN GANTI DENGAN 

<td><?php $products_image = ['src'=>'uploads/'.$products->image, 'height'=> '50'];
echo img($products_image)
?></td>


CARI CODE BERIKUT
<td><?php echo $products->id_kategori ?></td>

KEMUDIAN  GANTI DENGAN
<td><?php echo $products->kategori ?></td>

Selanjutnya buka file Products_model. php pada folder Model kemudian ubah isi function get_limit_data menjadi seperti ini

$this->db->select('a.id,b.kategori,a.name,a.description,a.price,a.stock,a.image');
$this->db->from('products as a');
$this->db->join('tbl_kategori as b', 'a.id_kategori = b.id', 'inner');
		
$this->db->order_by('a.id', $this->order);
$this->db->like('a.id', $q);
$this->db->or_like('name', $q);
$this->db->or_like('description', $q);
$this->db->or_like('price', $q);
$this->db->or_like('stock', $q);
$this->db->or_like('image', $q);
$this->db->limit($limit, $start);
$query = $this->db->get();
		
return $query->result();

yang saya beri warna merah, yang perlu kalian sesuaikan

Pertanyaannya, bagaimana jika kita ingin menampilkan Menu di level user tertentu?, jawabannya sangat mudah sekali, tinggal kita masuk ke menu LEVEL PENGGUNA, kemudian pilih level mana yang ingin kita setting tampilannya dengan cara klik icon mata, setelah itu tinggal checklist mana yang ingin ditampilkan dan tidak ditampilkan (Hak akses) pada level user tersebut

Kemudian kita akan menambahkan Upload Gambar dan Pilihan Kategori pada Form Produk, caranya buka file products_form.php di c:\xampp\htdocs\lsp_toko_online\application\views\products

CARI KODE BERIKUT INI
<form action="<?php echo $action; ?>" method="post">

GANTI DENGAN KODE BERIKUT
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data">

CARI KODE BERIKUT INI
<tr>
  <td width='200'>Id Kategori <?php echo form_error('id_kategori') ?></td>
  <td><input type="text" class="form-control" name="id_kategori" id="id_kategori" placeholder="Id Kategori" value="<?php echo $id_kategori; ?>" /></td>
</tr>

KEMUDIAN GANTI DENGAN KODE BERIKUT
<tr><td>Kategori</td><td><?php echo cmb_dinamis('id_kategori', 'tbl_kategori', 'kategori', 'id') ?></td></tr>

sedangkan untuk Upload Gambarnya

CARI CODING BERIKUT INI
<tr><td width='200'>Image <?php echo form_error('image') ?></td><td> <textarea class="form-control" rows="3" name="image" id="image" placeholder="Image"><?php echo $image; ?></textarea></td></tr>

KEMUDIAN GANTI DENGAN CODING BERIKUT
<tr><td width='200'>Foto Produk<?php echo form_error('image') ?></td><td> <input type="file" name="image"></td></tr>

Setelah semua sudah diganti, silahkan simpan dan buka file controller Produk.php

Setelah itu tambahkan Function Upload_foto kedalam controller produk, tepatnya di bawah function delete

function upload_foto(){
        $config['upload_path']          = './uploads/';
        $config['allowed_types']        = 'gif|jpg|png|jpeg';
        //$config['max_size']             = 100;
        //$config['max_width']            = 1024;
        //$config['max_height']           = 768;
        $this->load->library('upload', $config);
        $this->upload->do_upload('image');
        return $this->upload->data();
    }

Function ini juga terdapat di Controller User, anda juga bisa copy dari Controller tersebut

Kemudian cari function Create_Action(), dan tambahkan kode berikut ini di dalamnya

//di bawah kode $this->_rules(); tambahkan kode berikut
$foto = $this->upload_foto();

//kemudian cari kode birkut ini
'image' => $this->input->post('image',TRUE),

//Ganti dengan kode berikut
'image'        => $foto['file_name'],

Masih di controller Produk, Cari function update_action()

// Cari Kode berikut
'image' => $this->input->post('image',TRUE),

//Kemudian Ganti dengan ini
'image'        =>$foto['file_name'],

Cari function _rules()

//Cari Code berikut kemudian beri komentar
$this->form_validation->set_rules('image', 'image', 'trim|required');

//Sehingga jadi seperti ini
//$this->form_validation->set_rules('image', 'image', 'trim|required');

Simpan Controller Product.php kemudian coba tambahkan 1 produk baru dengan disertai gambar

Tutorial Codeigniter (Studi Kasus Online Shop) Part 2

Desain Database

Pembuatan Database

Generate Tabel Kategori menggunakan Code Generator Codeigniter

Generate Tabel Product

Leave a Reply Cancel reply

Tentang Kami

Halaman Informasi

Desain Database

Pembuatan Database

Generate Tabel Kategori menggunakan Code Generator Codeigniter

Generate Tabel Product

Share this:

Related posts:

Leave a Reply Cancel reply

Tentang Kami

Halaman Informasi