Aplikasi Persediaan Barang (Sistem Inventory) Menggunakan Yii2 - Part #4

Aplikasi Persediaan Barang (Sistem Inventory) Menggunakan Yii2 - Transaksi Master Detail

Code Factory Sistem Inventory atau Aplikasi Persediaan Barang adalah salah satu aplikasi yang umum dan cukup menantang terutama bagi para programmer pemula yang sedang mengasah skill programming-nya. Artikel ini merupakan lanjutan dari artikel ketiga yang membahas Pembuatan Form Master Barang. Artikel ini akan melanjutkan pembuatan form transaksi dengan desain master-detail menggunakan bantun extension dynamic-form, dan kita buat sederhana saja sehingga akan cukup mudah dipahami para programmer pemula.

Extension Tambahan

Untuk memudahkan kita membangun user interface yang cukup nyaman maka kita memerlukan dua buah extension tambahan, yaitu datepicker untuk memilih tanggal, dan dynamic-form untuk form CRUD master-detail. Gunakan perintah composer berikut ini untuk instalasi-nya.

composer require kartik-v/yii2-widget-datepicker "*"
composer require wbraganca/yii2-dynamicform "*"

Generate CRUD Menggunakan Gii

Silakan generate CRUD untuk Table Transactions dan TransactionDetails dengan cara yang sama seperti saat membuat form master barang.


Modifikasi List Transaksi Barang

Hasil generate CRUD dari Yii sangat membantu kita mempercepat proses pengerjaan aplikasi ini, namun masih perlu beberapa penyesuaian dari code standard Gii yang dihasilkan,

'columns' => [
    ['class' => 'yii\grid\SerialColumn'],
    'id',
    'trans_code',
    'trans_date',
    'type_id',
    'remarks',
    ['class' => 'yii\grid\ActionColumn'],
],

Kita dapat menghapus field id yang hanya field identity sehingga tidak penting untuk ditampilkan. Kita juga dapat mengubah field type_id menjadi type.name agar data yang ditampilkan adalah nama jenis transaksinya dan bukan angka id-nya sehingga hasilnya menjadi seperti di bawah ini

'columns' => [
    ['class' => 'yii\grid\SerialColumn'],
    'trans_code',
    'trans_date',
    'type.name',
    'remarks',
    ['class' => 'yii\grid\ActionColumn'],
],

Hasilnya cukup user-friendly. Namun sayangnya dengan cara di atas, kita tidak bisa melakukan filter terhadap jenis transaksi. Oleh karena itu kita perlu melakukan perubahan agar filter terhadap jenis transaksi barang kita kita lakukan, filter menggunakan dropdown list. Pertama yang kita lakukan adalah mengambil data semua jenis transaksi yang ada di dalam database menggunakan code berikut,

$typeList = ArrayHelper::map(TransactionTypes::find()->asArray()->all(), 'id', 'name');

Kemudian ubah setting column type.name di GridView dengan menambahkan atribut setting filter dan value barupa Closure yang bentuknya spesifik untuk GridView, sehingga menjadi seperti di bawah ini

'columns' => [
    ['class' => 'yii\grid\SerialColumn'],
    'trans_code',
    'trans_date',
    [   'attribute' => 'type_id', 
        'filter' => $typeList, 
        'label' => 'Transaction Type', 
        'value' => function ($model, $index, $widget) { return $model->type->name; }
    ],
    'remarks',
    ['class' => 'yii\grid\ActionColumn'],
],

Modifikasi Form Transaksi Barang

Form input transaksi barang melibatkan dua buah table yaitu transactions dan transaction_details sehingga kita memerlukan extension dynamic-form untuk membuatnya. Instalasi dengan menggunakan perintah composer di bawah ini.

composer require wbraganca/yii2-dynamicform "*"

Yang perlu kita lakukan kemudian adalah

  • Membuat class Model untuk memudahkan kita membuat beberapa row TransactionDetails dalam satu baris code saja.
  • Modifikasi ActionCreate di TransactionController untuk proses pembuatan transaksi baru
  • Modifikasi ActionUpdate di TransactionController untuk proses pembuatan transaksi yang sudah ada di database
  • Modifikasi ActionDelete di TransactionController untuk proses penghapusan transaksi
  • Modifikasi form untuk Create dan Update.

Class Model

Class Model ini merupakan turunan dari class yii\base\Model namun kita menambahkan sebuah function createMultiple untuk memudahkan kita membuat beberapa row TransactionDetails berdasarkan isi dari variable POST menggunakan satu baris code saja. 

Modifikasi ActionCreate

Saat melakukan proses penyimpanan data transaksi baru ke database, kita mengikuti algoritma berikut ini,

  • Load master record
  • Load semua detail records
  • Assign foreign key field di detail records
  • Validate master record
  • Validate detail record
  • Jika validasi berhasil
    • Mulai transaksi database
    • Simpan master record
    • Simpan detail record satu-persatu
    • Jika berhasil semua, commit
    • Jika gagal rollback
    • Tampilkan hasilnya

Modifikasi ActionUpdate

Saat melakukan proses penyimpanan perubahan data transaksi ke database. Agak sedikit berbeda dengan proses pyimpanan transaksi baru, untuk proses edit, kita menghapus semua detail record yang sudah ada sebelumnya di database dan kemudian melakukan insert ulang sebagai record baru. Algoritma-nya adalah seperti berikut ini,

  • Load master record
  • Load semua detail records
  • Assign foreign key field di detail records
  • Validate master record
  • Validate detail record
  • Jika validasi berhasil
    • Mulai transaksi database
    • Simpan master record
    • Delete semua detail record yang sudah ada di database
    • Simpan detail record satu-persatu
    • Jika berhasil semua, commit
    • Jika gagal rollback
    • Tampilkan hasilnya

Modifikasi ActionDelete

Pada saat menghapus data transaksi maka yang perlu kita lakukan adalah terlebih dahulu menghapus detail record sebelum menghapus master/parent record. Algoritma-nya adalah sebagai berikut

  • Mulai transaksi database
  • Delete semua detail record satu-persatu
  • Delete master record
  • Jika berhasil semua, commit
  • Jika gagal rollback
  • Tampilkan index transaksi barang

Modifikasi create.php

​Kita perlu menambahkan variable $details agar dapat dikenali di dalam _form.php

​    <?= $this->render('_form', [
        'model' => $model,
        'details' => $details,
    ]) ?>

Modifikasi update.php

​Kita juga perlu menambahkan variable $details agar dapat dikenali di dalam _form.php

    <?= $this->render('_form', [
        'model' => $model,
        'details' => $details,
    ]) ?>

Modifikasi _form.php

​Code lengkapnya adalah seperti berikut ini


Membuat View Transaksi Barang

Untuk menampilkan data master-detail, maka kita harus record master dan semua record detail yang berelasi, sehingga kita perlu mengubah ActionView menjadi seperti ini

Dan jangan lupa mengubah view.php agar menampilkan data yang didapat dari controller. Kita akan menggunakan DetailView untuk master row, dan menggunakan GridView untuk menampilkan detail row.


Simpulan

Mudah-mudahan tutorial ini dapat membantu teman-teman yang sedang belajar membuat aplikasi inventory, khususnya yang menggunakan Yii Framework. Source code aplikasi ini dapat dilihat di GitHub, silakan digunakan untuk keperluan pembelajaran saja.

.

 

Category: 

Comments

Moch Yogi's picture

Moch Yogi

gan mau tanya tentang "Membuat class Model untuk memudahkan kita membuat beberapa row TransactionDetails dalam satu baris code saja" itu maksudnya gimana ya? kita bikin file php namanya model atau kita copy source dari agan ke Model yang basenya Yii2? mohon pencerahannya :D