Membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana menggunakan yii2 (Part 1 CRUD dan Login)

Membuat Sistem Informasi Kepegawaian(SIMPEG) Sederhana
menggunakan Yii2 – part 1 (CRUD Pegawai dan Login)
1
Sistem Informasi Kepegawaian adalah sistem yang biasa ada di perkantoran yang membantu
mengatur data-data kepegawaian seperti biodata pegawai, kenaikan pangkat golongan, gaji,
cuti dan lain sebagainya. Pada tutorial kali ini kita akan belajar tentang bagaimana membuat
SIMPEG sederhana menggunakan Yii2. Fitur-fitur yang akan dibuat adalah fitur-fitur standar
pada SIMPEG yang biasanya ada di perkantoran khususnya kantor pemerintahan.
Pada tutorial kali ini saya menggunakan XAMPP untuk development web server dan database
nya.
1. Instalasi Yii2 PHP Framework
Instalasi dapat dilakukan melalui cara download source yii2 secara langsung ataupun
menggunakan composer, saya lebih senang menggunakan composer karena cukup
praktis dan tinggal copy-paste command dari web yii2.
Jalankan perintah berikut pada folder htdocs anda melalui command line ataupun
terminal.
composer create-project –prefer-dist yiisoft/yii2-app-basic simpeg
Yii2 pada dasarnya menyediakan template advance dan basic, pada tutorial kali ini kita
menggunakan template basic yang terlihat pada command diatas (yii2-app-basic).
Pada bagian terakhir command diatas terdapat nama folder sekaligus nama project
yang akan kita buat menggunakan Yii2 yaitu simpeg.
Gambar 1. Struktur Project Yii2 Basic
m
edium
.com
/@
deavenditam
a

2
Pada Gambar 1 diatas terlihat struktur project default dari Yii2 Basic template. Seperti
pada framework MVC lainnya terdapat folder models (untuk melakukan hubungan
dengan database), folder Views (untuk mengatur tampilan pada pengguna) dan folder
controllers (untuk mengatur logika yang ada di aplikasi ketika menerima request dan
memberikan response terhadap sesuatu).
Buka browser anda dan ketikkan URL berikut :
http://localhost/simpeg/web
maka akan muncul tampilan default Yii2 seperti berikut
Gambar 2. Tampilan Default Yii2
2. Install Admin LTE
Pada tutorial ini akan menggunakan admin LTE sebagai template dari tampilan yang
akan digunakan untuk memudahkan dalam membuat tampilan. Untuk instalasi masuk
ke folder project yang telah kita buat tadi lalu jalankan command berikut :
composer require dmstr/yii2-adminlte-asset "^2.1"
Setelah proses composer untuk instalasi adminlte selesai maka akan muncul folder
dmstr pada folder vendor pada project yii2 anda seperti gambar berikut.
m
edium
.com
/@
deavenditam
a

3
Gambar 3. Hasil Instalasi AdminLTE
Walaupun instalasi adminLTE pada composer sudah selesai, namun ketika kita coba
jalankan aplikasi tampilannya masih belum berubah, untuk merubahnya kita harus
mencopykan folder layouts dan site yang ada di dalam dmstr/yii2-adminlte-
asset/example-views/yiisoft/yii2-app ke dalam folder views.
Gambar 4. Copy example adminlte ke views
m
edium
.com
/@
deavenditam
a

4
Jalankan aplikasi nya maka tampilan akan berubah menjadi seperti berikut
Gambar 5. Tampilan default yii2-AdminLTE
3. Konfigurasi Database
Untuk menghubungkan aplikasi yii2 kita dengan database tentunya kita harus
membuat database terlebih dahulu. Pada tutorial ini saya menggunakan phpMyAdmin
yang terdapat pada XAMPP untuk melakukan manajemen database. Buka
phpMyAdmin, buat database simpeg lalu buat table pegawai dengan struktur seperti
gambar 7.
Gambar 6. database simpeg
m
edium
.com
/@
deavenditam
a

5
Gambar 7. Struktur table pegawai
Setelah database dan tabel dibuat, lakukan konfigurasi database pada folder
config/db.php. Sesuaikan dbname, username dan password dengan konfigurasi
database yang digunakan.
<?php
return [
'class' => 'yiidbConnection',
'dsn' => 'mysql:host=localhost;dbname=simpeg',
'username' => 'root',
'password' => '',
'charset' => 'utf8',
// Schema cache options (for production environment)
//'enableSchemaCache' => true,
//'schemaCacheDuration' => 60,
//'schemaCache' => 'cache',
];
4. Membuat (Create, Read, Update, Delete) CRUD Pegawai
CRUD merupakan operasi dasar yang biasanya ada dalam database maupun sistem,
untuk saat ini kita akan membuat CRUD pegawai terlebih dahulu. Pada Yii2 kita dapat
menggunakan bantuan GII untuk melakukan generate model dan CRUD pada tabel
pegawai. Untuk membuka GII dapat menggunakan URL berikut.
m
edium
.com
/@
deavenditam
a

6
http://localhost/simpeg/web/index.php?r=gii
Gambar 8. Tampilan GII
Klik tombol start pada bagian Model Generator, isikan Table Name sesuai dengan
tabel yang sudah kita buat sebelumya yaitu tabel pegawai. Model Class name akan
terisi secara otomatis setelah kita mengisi Table Name. Klik preview lalu generate
Gambar 9. Model Generator
Pilih menu CRUD Generator di sebelah kiri untuk masuk ke menu CRUD generator GII.
Isikan Model Class dengan appmodelsPegawai sesuai model yang telah kita generate
sebelumnya, Search Model Class dengan appmodelsPegawaiSearch dan Controller
Class dengan appcontrollersPegawaiController, klik preview lalu akan muncul folder
m
edium
.com
/@
deavenditam
a

7
apa saja yang akan degenerate. Klik generate untuk melakukan ekseksusi pembuatan
CRUD secara otomatis.
Gambar 10. CRUD Generator
Gambar 11. Generate CRUD
Pada proses generate CRUD yang telah dilakukan menggunakan GII akan
menghasilkan file seperti berikut.
1. models/PegawaiSearch.php (digunakan untuk search data)
2. controllers/PegawaiController.php (controller untuk mendefinisikan logika
sistem)
3. views/pegawai/_form.php (form untuk update dan delete)
m
edium
.com
/@
deavenditam
a

8
4. views/pegawai/_search.php (form search data)
5. views/pegawai/create.php (tampilan untuk create data, pada code didalamnya
terdapat code untuk melakukan render file _form.php)
6. views/pegawai/index.php (tampilan index pegawai, berisi tabel list data yang
sudah diinput ke database)
7. views/pegawai/update.php (tampilan untuk update data, pada code didalamnya
terdapat code untuk melakukan render file _form.php)
8. views/pegawai/view.php (tampilan untuk melihat detail data pada tabel)
Untuk melihat apakah CRUD yang kita generate berhasil atau tidak, kita bisa langsung
melihatnya pada url berikut.
http://localhost/simpeg/web/index.php?r=pegawai
Gambar 12. Hasil Generate CRUD pegawai
Tampilan default dari index pegawai adalah seperti gambar 12, untuk menggunakan
template adminLTE ganti code pada views/pegawai/index.php menjadi seperti
berikut.
<?php
use yiihelpersHtml;
use yiigridGridView;
/* @var $this yiiwebView */
/* @var $searchModel appmodelsPegawaiSearch */
/* @var $dataProvider yiidataActiveDataProvider */
m
edium
.com
/@
deavenditam
a

9
$this->title = 'Pegawai';
$this->params['breadcrumbs'][] = $this->title;
?>
<div class="pegawai-index">
<div class="box box-success">
<div class="box-header with-border">
<h3 class="box-title"><?= Html::encode($this->title) ?></h3>
<div class="box-tools pull-right">
<?= Html::a('Tambah Pegawai', ['create'], ['class' => 'btn btn-
success']) ?>
</div>
</div>
<div class="box-body">
<?= GridView::widget([
'dataProvider' => $dataProvider,
'filterModel' => $searchModel,
'columns' => [
['class' => 'yiigridSerialColumn'],
'id',
'nip',
'nama:ntext',
'tempat_lahir',
'tanggal_lahir',
//'agama',
//'jenis_kelamin',
//'nikah',
//'status_pegawai',
//'alamat:ntext',
//'telepon',
//'email:email',
//'salt:ntext',
//'password:ntext',
//'created_date',
//'created_by',
//'updated_date',
//'updated_by',
['class' => 'yiigridActionColumn'],
],
]); ?>
</div>
</div>
</div>
Pada code diatas kita ubah beberapa html nya agar tampilan nya menjadi lebih baik.
Selain itu juga terdapat code Gridview yang merupakan hasil generate default dari GII
untuk file index.php. Gridview digunakan untuk menampilkan data dalam bentuk tabel
m
edium
.com
/@
deavenditam
a

10
dan sudah dilengkapi dengan button Create, Read, Update, Delete dan juga fitur
Search.
views/layouts/content.php
<?php
use yiiwidgetsBreadcrumbs;
use dmstrwidgetsAlert;
?>
<div class="content-wrapper">
<?=
Breadcrumbs::widget(
[
'links' => isset($this->params['breadcrumbs']) ? $this-
>params['breadcrumbs'] : [],
]
) ?>
<section class="content">
<?= Alert::widget() ?>
<?= $content ?>
</section>
</div>
…
Gambar 13. Tampilan pegawai/index.php setelah diedit
Masuk ke menu create pegawai dengan klik Tambah Pegawai maka akan muncul
tampilan berikut.
m
edium
.com
/@
deavenditam
a

11
Gambar 14. Create Pegawai
Sekarang install yii2-jui agar bisa menggunakan datepicker yang akan digunakan untuk
memilih tanggal pada field Tanggal Lahir.
composer require --prefer-dist yiisoft/yii2-jui
Kita juga akan membuat class helper yang nantinya dapat digunakan untuk membuat
fungsi yang reusable, fungsi yang dapat digunakan di berbagai model, view, maupun
controller. Untuk membuatnya kita buat folder components pada root project dan
membuat file helper.php.
Gambar 15. custom helper
m
edium
.com
/@
deavenditam
a

12
Berikut merupakan isi dari file helper.php
<?php
namespace appcomponents;
use Yii;
use yiibaseComponent;
class helper extends Component{
private $agama = [
'1' => 'Islam',
'2' => 'Kristen Protestan',
'3' => 'Kristen Katolik',
'4' => 'Hindu',
'5' => 'Budha',
'6' => 'Konghucu'
];
private $jenisKelamin = [
'1' => 'Laki-Laki',
'2' => 'Perempuan'
];
private $statusPegawai = [
'1' => 'PNS',
'2' => 'Kontrak'
];
private $statusNikah = [
'1' => 'Belum Menikah',
'2' => 'Menikah',
'3' => 'Cerai Hidup',
'4' => 'Cerai Mati'
];
public function listAgama()
{
return $this->agama;
}
public function listJenisKelamin()
{
return $this->jenisKelamin;
}
public function listStatusPegawai()
{
return $this->statusPegawai;
}
public function listStatusNikah()
{
return $this->statusNikah;
}
}
m
edium
.com
/@
deavenditam
a

13
file helper.php saat ini digunakan untuk menyimpan array nilai dari variable agama,
jenis kelamin, status pegawai dan status pernikahan. Saya lebih suka untuk
menyimpan variable yang nilainya cenderung statis secara hardcode dibandingkan
dibuat tabel tersendiri pada database. Fungsi yang terdapat pada helper.php
digunakan untuk mengembalikan array nilai dari variable yang telah disebutkan
sebelumnya untuk nantinya digunakan ke dalam form.
Sekarang mari kita edit dari views/pegawai/_form.php agar lebih baik lagi, ubah
_form.php menjadi seperti berikut.
<?php
use yiihelpersHtml;
use yiiwidgetsActiveForm;
use yiijuiDatePicker;
/* @var $model appmodelsPegawai */
/* @var $form yiiwidgetsActiveForm */
?>
<div class="pegawai-form">
<?php $form = ActiveForm::begin([]); ?>
<?= $form->field($model, 'nip')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'email')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'password')->passwordInput() ?>
<?= $form->field($model, 'telepon')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'nama')->textarea(['rows' => 1]) ?>
<?= $form->field($model, 'tempat_lahir')->textInput(['maxlength' => true]) ?>
<?= $form->field($model, 'tanggal_lahir')->widget(DatePicker::class, [
'language' => 'id',
'dateFormat' => 'dd-MM-yyyy',
'options'=>[
'class' => 'form-control',
'style' => [
'cursor'=>'pointer'
]
]
]) ?>
<?= $form->field($model, 'agama')->dropDownList(
m
edium
.com
/@
deavenditam
a

14
Yii::$app->helper->listAgama(),
['prompt'=>'Pilih Agama']
); ?>
<?= $form->field($model, 'jenis_kelamin')->radioList(
Yii::$app->helper->listJenisKelamin()
); ?>
<?= $form->field($model, 'nikah')->dropDownList(
Yii::$app->helper->listStatusNikah(),
['prompt'=>'Pilih Status Nikah']);
?>
<?= $form->field($model, 'status_pegawai')->radioList(
Yii::$app->helper->listStatusPegawai());
?>
<?= $form->field($model, 'alamat')->textarea(['rows' => 6]) ?>
<div class="form-group text-right">
<?= Html::submitButton('Simpan', ['class' => 'btn btn-lg btn-success']) ?>
</div>
<?php ActiveForm::end(); ?>
</div>
<?php
$this->registerCss("
input[type='radio']
{
margin-left: 10px;
margin-right: 5px;
}"
);
?>
_form.php hasil generate dari GII menggunakan active form untuk menghasilkan
tampilan form. Pada _form.php diatas field password diubah menjadi passwordInput,
field tanggal_lahir diubah menjadi datepicker, jenis_kelamin dan status_pegawai
diubah menjadi radioList dengan value dari helper.php yang telah kita buat, field nikah
dan agama diubah menjadi dropDownList dengan value yang berasal juga dari
helper.php. Pada bagian _form.php juga ditambahkan internal CSS yang digunakan
untuk merubah style bawaan dari radio button yii2 karena defaultnya saya anggap
terlalu rapat.
Buka URL berikut untuk melihat perubahan pada _form.php
m
edium
.com
/@
deavenditam
a

15
http://localhost/simpeg/web/index.php?r=pegawai/create
Gambar 16. Form Tambah Pegawai
Walaupun form tambah pegawai sudah ada, tetapi ketika kita menyimpan data, data
akan gagal tersimpan. Hal ini karena ada variabel pada tabel database yang nilainya
tidak boleh kosong atau null tetapi kita tidak masukkan nilainya seperti salt,
created_date dan created_by.
Ubah function actionCreate pada PegawaiController menjadi seperti berikut.
public function actionCreate()
{
$model = new Pegawai();
if ($model->load(Yii::$app->request->post())) {
$model->created_date = date('Y-m-d H:i:s');
$model->created_by = 0;
$model->save();
return $this->redirect(['view', 'id' => $model->id]);
}
return $this->render('create', [
m
edium
.com
/@
deavenditam
a

16
'model' => $model,
]);
}
Nilai created_date kita isi dengan tanggal dan jam terkini lalu created_by kita isikan 0
terlebih dahulu karena belum ada user terdaftar di database, untuk kedepannya 0
akan kita ganti dengan id user yang sedang login karena created_by memberikan
informasi tentang siapa yang menambahkan data pegawai baru. Untuk variable salt
dan password yang sudah diencrypt kita definisikan nilainya pada model Pegawai.
Ubah models/Pegawai.php menjadi seperti berikut.
<?php
namespace appmodels;
use Yii;
/**
* This is the model class for table "pegawai".
*
* @property int $id
* @property string $nip
* @property string $nama
* @property string $tempat_lahir
* @property string $tanggal_lahir
* @property int $agama
* @property int $jenis_kelamin
* @property int $nikah
* @property int $status_pegawai
* @property string $alamat
* @property string $telepon
* @property string $email
* @property string $salt
* @property string $password
* @property string $created_date
* @property int $created_by
* @property string|null $updated_date
* @property int|null $updated_by
*/
class Pegawai extends yiidbActiveRecord
{
/**
* {@inheritdoc}
*/
public static function tableName()
{
return 'pegawai';
}
m
edium
.com
/@
deavenditam
a

17
/**
* {@inheritdoc}
*/
public function rules()
{
return [
[['nip', 'nama', 'tempat_lahir', 'tanggal_lahir', 'agama',
'jenis_kelamin', 'nikah', 'status_pegawai', 'alamat', 'telepon', 'email',
'created_date', 'created_by'], 'required'],
[['nama', 'alamat', 'salt', 'password'], 'string'],
[['tanggal_lahir', 'created_date', 'updated_date'], 'safe'],
[['agama', 'jenis_kelamin', 'nikah', 'status_pegawai', 'created_by',
'updated_by'], 'integer'],
[['nip', 'tempat_lahir', 'email'], 'string', 'max' => 32],
[['telepon'], 'string', 'max' => 15],
];
}
/**
* {@inheritdoc}
*/
public function attributeLabels()
{
return [
'id' => 'ID',
'nip' => 'Nip',
'nama' => 'Nama',
'tempat_lahir' => 'Tempat Lahir',
'tanggal_lahir' => 'Tanggal Lahir',
'agama' => 'Agama',
'jenis_kelamin' => 'Jenis Kelamin',
'nikah' => 'Nikah',
'status_pegawai' => 'Status Pegawai',
'alamat' => 'Alamat',
'telepon' => 'Telepon',
'email' => 'Email',
'salt' => 'Salt',
'password' => 'Password',
'created_date' => 'Created Date',
'created_by' => 'Created By',
'updated_date' => 'Updated Date',
'updated_by' => 'Updated By',
];
}
public static function hashPassword($salt,$password) {// Function to create
password hash
return md5($salt.$password);
}
public function beforeSave($insert)
m
edium
.com
/@
deavenditam
a

18
{
if (!parent::beforeSave($insert))
return false;
if($insert)
{
$password=$this->password;
$salt = $this->generateSalt();
$this->salt = $salt;
$this->password = $this->hashPassword($salt,$password);
}
return true;
}
protected function generateSalt()
{
return uniqid('',true);
}
}
Pada code diatas ditambahkan 3 fungsi yang berfungsi untuk melakukan generate salt
dan encrypt password. Selain itu pada function rules() untuk validasi required kita
menghilangkan password dan salt, karena kedua variable ini tidak divalidasi pada form
tambah pegawai, kedua variable ini di encrypt dan di generate oleh ke tiga function
yang telah kita tambahkan. Berikut array variable yang harus didefinisikan sebagai
required.
[['nip', 'nama', 'tempat_lahir', 'tanggal_lahir', 'agama', 'jenis_kelamin',
'nikah', 'status_pegawai', 'alamat', 'telepon', 'email', 'created_date',
'created_by'], 'required'].
Silakan masuk ke Form Tambah Pegawai, isikan data lalu coba simpan, jika benar maka
data akan tersimpan pada tabel pegawai dan anda akan diarahkan ke halaman view
detail pegawai.
Berikut contoh jika data berhasil disimpan
m
edium
.com
/@
deavenditam
a

19
Gambar 17. View data pegawai
Untuk mempercantik tampilan view diatas, ganti code pada views/pegawai/view.php
menjadi seperti berikut.
<?php
use yiihelpersHtml;
use yiiwidgetsDetailView;
$this->title = $model->nama;
$this->params['breadcrumbs'][] = ['label' => 'Pegawais', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
yiiwebYiiAsset::register($this);
?>
<div class="pegawai-view">
<div class="box-tools pull-right">
<?= Html::a('Update', ['update', 'id' => $model->id], ['class' => 'btn
btn-primary']) ?>
<?= Html::a('Delete', ['delete', 'id' => $model->id], [
'class' => 'btn btn-danger',
'data' => [
'confirm' => 'Are you sure you want to delete this item?',
'method' => 'post',
m
edium
.com
/@
deavenditam
a

20
],
]) ?>
</div>
</div>
<?= DetailView::widget([
'model' => $model,
'attributes' => [
'nip',
'nama:ntext',
'tempat_lahir',
'tanggal_lahir',
[
'attribute' => 'agama',
'value' => Yii::$app->helper->getAgama($model->agama),
],
[
'attribute' => 'jenis_kelamin',
'value' => Yii::$app->helper->getJenisKelamin($model-
>jenis_kelamin),
],
[
'attribute' => 'nikah',
'value' => Yii::$app->helper->getStatusNikah($model->nikah),
],
[
'attribute' => 'status_pegawai',
'value' => Yii::$app->helper->getStatusPegawai($model-
>status_pegawai),
],
'alamat:ntext',
'telepon',
'email:email',
],
]) ?>
</div>
</div>
</div>
Dan tambahkan keempat function berikut ke dalam class helper pada file
components/helper.php
public function getAgama($id)
{
return $this->agama[$id];
}
public function getJenisKelamin($id)
{
return $this->jenisKelamin[$id];
}
m
edium
.com
/@
deavenditam
a

21
public function getStatusPegawai($id)
{
return $this->statusPegawai[$id];
}
public function getStatusNikah($id)
{
return $this->statusNikah[$id];
}
http://localhost/simpeg/web/index.php?r=pegawai/view&id=1
Gambar 18. Tampilan View Detail Pegawai
Pada tampilan view detail pegawai, kita hapus beberapa data yang tidak perlu ditampilkan
seperti id, password, salt, created_by, created_date, updated_by dan updated_date. Selain
itu agama, jenis kelamin, status nikah dan status pegawai yang sebelumnya berupa angka kita
tampilkan sesuai arti dari angka tersebut menggunakan bantuan dari helper.php yang telah
kita buat sebelumnya.
Fungsi delete sudah berjalan dengan baik sedangkan fungsi update harus ada yang kita
tambahkan. Ubah views/pegawai/update.php menjadi seperti berikut.
<?php
use yiihelpersHtml;
$this->title = 'Update Pegawai: ' . $model->nama;
$this->params['breadcrumbs'][] = ['label' => 'Pegawai', 'url' => ['index']];
m
edium
.com
/@
deavenditam
a

22
$this->params['breadcrumbs'][] = ['label' => $model->id, 'url' => ['view', 'id' =>
$model->id]];
$this->params['breadcrumbs'][] = 'Update';
?>
<div class="pegawai-update">
</div>
<?= $this->render('_form', [
'model' => $model,
]) ?>
</div>
</div>
</div>
Berikan if passwordInput() pada views/pegawai/_form.php menjadi seperti berikut.
<?php if($this->context->action->id=='create'): ?>
<?= $form->field($model, 'password')->passwordInput() ?>
<?php endif ?>
Pada bagian passwordInput saya berikan if karena untuk sekarang kita belum melakukan
update password. Form password hanya akan ditampilkan jika action create pada controller
pegawai dipanggil atau ketika menu tambah pegawai dipilih.
Ubah action update pada controllers/PegawaiController.php menjadi seperti berikut
public function actionUpdate($id)
{
$model = $this->findModel($id);
if ($model->load(Yii::$app->request->post())) {
$model->updated_date = date('Y-m-d H:i:s');
$model->updated_by = 0;
$model->save();
return $this->redirect(['view', 'id' => $model->id]);
}
return $this->render('update', [
'model' => $model,
]);
}
Silakan tes apakah fungsi fungsi view, update dan delete sudah berfungsi dengan baik. CRUD
dapat dilakukan pada url http://localhost/simpeg/web/index.php?r=pegawai, anda dapat
menemukan tombol view, edit dan delete pada bagian kanan list tabel pegawai.
m
edium
.com
/@
deavenditam
a

23
5. Login
Setiap pegawai dapat login ke SIMPEG, agar fungsi login dapat berjalan kita harus mengubah
beberapa file menjadi seperti berikut.
models/LoginForm.php
<?php
use Yii;
use yiibaseModel;
/**
* LoginForm is the model behind the login form.
*
* @property User|null $user This property is read-only.
*
*/
class LoginForm extends Model
{
public $username;
public $password;
public $rememberMe = true;
private $_user = false;
/**
* @return array the validation rules.
*/
{
return [
// username and password are both required
[['username', 'password'], 'required'],
// rememberMe must be a boolean value
['rememberMe', 'boolean'],
// password is validated by validatePassword()
['password', 'validatePassword'],
];
}
/**
* Validates the password.
* This method serves as the inline validation for password.
*
* @param string $attribute the attribute currently being validated
m
edium
.com
/@
deavenditam
a

24
* @param array $params the additional name-value pairs given in the rule
*/
public function validatePassword($attribute, $params)
{
if (!$this->hasErrors()) {
$user = $this->getUser();
if (!$user || !$user->validatePassword($this->password)) {
$this->addError($attribute, 'Incorrect username or password.');
}
}
}
/**
* Logs in a user using the provided username and password.
* @return bool whether the user is logged in successfully
*/
public function login()
{
if ($this->validate()) {
return Yii::$app->user->login($this->getUser(), $this->rememberMe ?
3600*24*30 : 0);
}
return false;
}
/**
* Finds user by [[username]]
*
* @return User|null
*/
public function getUser()
{
if ($this->_user === false) {
$this->_user = Pegawai::find()->where(['nip'=>$this->username])->one();
}
return $this->_user;
}
}
models/Pegawai.php
<?php
use Yii;
use yiiwebIdentityInterface;
/**
m
edium
.com
/@
deavenditam
a

25
* This is the model class for table "pegawai".
*
* @property int $id
* @property string $nip
* @property string $nama
* @property string $tempat_lahir
* @property string $tanggal_lahir
* @property int $agama
* @property int $jenis_kelamin
* @property int $nikah
* @property int $status_pegawai
* @property string $alamat
* @property string $telepon
* @property string $email
* @property string $salt
* @property string $password
* @property string $created_date
* @property int $created_by
* @property string|null $updated_date
* @property int|null $updated_by
*/
class Pegawai extends yiidbActiveRecord implements yiiwebIdentityInterface
{
/**
* {@inheritdoc}
*/
public static function tableName()
{
return 'pegawai';
}
/**
* {@inheritdoc}
*/
{
return [
[['nip', 'nama', 'tempat_lahir', 'tanggal_lahir', 'agama',
'jenis_kelamin', 'nikah', 'status_pegawai', 'alamat', 'telepon', 'email',
'created_date', 'created_by'], 'required'],
[['nama', 'alamat', 'salt', 'password'], 'string'],
[['tanggal_lahir', 'created_date', 'updated_date'], 'safe'],
[['agama', 'jenis_kelamin', 'nikah', 'status_pegawai', 'created_by',
'updated_by'], 'integer'],
[['nip', 'tempat_lahir', 'email'], 'string', 'max' => 32],
[['telepon'], 'string', 'max' => 15],
];
}
/**
* {@inheritdoc}
m
edium
.com
/@
deavenditam
a

26
*/
public function attributeLabels()
{
return [
'id' => 'ID',
'nip' => 'Nip',
'nama' => 'Nama',
'tempat_lahir' => 'Tempat Lahir',
'tanggal_lahir' => 'Tanggal Lahir',
'agama' => 'Agama',
'jenis_kelamin' => 'Jenis Kelamin',
'nikah' => 'Nikah',
'status_pegawai' => 'Status Pegawai',
'alamat' => 'Alamat',
'telepon' => 'Telepon',
'email' => 'Email',
'salt' => 'Salt',
'password' => 'Password',
'created_date' => 'Created Date',
'created_by' => 'Created By',
'updated_date' => 'Updated Date',
'updated_by' => 'Updated By',
];
}
public static function hashPassword($salt,$password) {// Function to create
password hash
return md5($salt.$password);
}
public function beforeSave($insert)
{
if (!parent::beforeSave($insert))
return false;
if($insert)
{
$password=$this->password;
$salt = $this->generateSalt();
$this->salt = $salt;
$this->password = $this->hashPassword($salt,$password);
}
return true;
}
protected function generateSalt()
{
return uniqid('',true);
}
public function validatePassword($password)
{
m
edium
.com
/@
deavenditam
a

27
return $this->password === static::hashPassword($this->salt,$password);;
}
/**
* @inheritdoc
*/
public static function findIdentity($id)
{
$user = self::find()
->where([
"id" => $id
])
->one();
if (is_null($user)) {
return null;
}
return new static($user);
}
/**
* @inheritdoc
*/
public static function findIdentityByAccessToken($token, $userType = null) {
->where(["accessToken" => $token])
->one();
if (!count($user)) {
return null;
}
}
/**
* Finds user by username
*
* @param string $username
* @return static|null
*/
public static function findByUsername($username)
{
->where([
"username" => $username
])
->one();
if (is_null($user)) {
return null;
}
}
/**
m
edium
.com
/@
deavenditam
a

28
* @inheritdoc
*/
public function getId()
{
return $this->id;
}
/**
* @inheritdoc
*/
public function getAuthKey()
{
return $this->salt;
}
/**
* @inheritdoc
*/
public function validateAuthKey($authKey)
{
return $this->authKey === $authKey;
}
}
Pada models Pegawai kita implement IdentityInterface pada classnya, oleh karena itu harus
menambahkan beberapa fungsi agar class IdentityInterface ini dapat digunakan.
Ubah identityClass untuk merefer ke model Pegawai pada file config/web.php menjadi seperti
berikut.
'user' => [
'identityClass' => 'appmodelsPegawai',
'enableAutoLogin' => true,
],
views/site/login.php
<?php
use yiihelpersHtml;
use yiibootstrapActiveForm;
/* @var $form yiibootstrapActiveForm */
/* @var $model commonmodelsLoginForm */
$this->title = 'Sign In';
$fieldOptions1 = [
'options' => ['class' => 'form-group has-feedback'],
m
edium
.com
/@
deavenditam
a

29
'inputTemplate' => "{input}<span class='glyphicon glyphicon-envelope form-control-
feedback'></span>"
];
$fieldOptions2 = [
'options' => ['class' => 'form-group has-feedback'],
'inputTemplate' => "{input}<span class='glyphicon glyphicon-lock form-control-
feedback'></span>"
];
?>
<div class="login-box">
<div class="login-logo">
<a href="#"><b>SIMPEG</b></a>
</div>

<div class="login-box-body">
<p class="login-box-msg">Silakan Login</p>
<?php $form = ActiveForm::begin(['id' => 'login-form',
'enableClientValidation' => false]); ?>
<?= $form
->field($model, 'username', $fieldOptions1)
->label(false)
->textInput(['placeholder' => $model->getAttributeLabel('username')]) ?>
<?= $form
->field($model, 'password', $fieldOptions2)
->label(false)
->passwordInput(['placeholder' => $model->getAttributeLabel('password')])
?>
<div class="row">
<div class="col-xs-8">
<?= $form->field($model, 'rememberMe')->checkbox() ?>
</div>

<div class="col-xs-4">
<?= Html::submitButton('Login', ['class' => 'btn btn-primary btn-block
btn-flat', 'name' => 'login-button']) ?>
</div>

</div>
<?php ActiveForm::end(); ?>
</div>

</div>
m
edium
.com
/@
deavenditam
a

30
http://localhost/simpeg/web/index.php?r=site/login
Masukkan NIP dan password sesuai dengan data pegawai yang telah anda tambahkan
sebelumnya. Lalu klik Sign In. Ubah beberapa file menjadi seperti berikut.
views/layouts/header.php
<?php
use yiihelpersHtml;
/* @var $content string */
?>
<header class="main-header">
<?= Html::a('<span class="logo-mini">APP</span><span class="logo-
lg">SIMPEG</span>', Yii::$app->homeUrl, ['class' => 'logo']) ?>
<nav class="navbar navbar-static-top" role="navigation">
<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
<span class="sr-only">Toggle navigation</span>
</a>
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">
<span class="hidden-xs"><?= Yii::$app->user->identity->nama
?></span>
</a>
</li>
m
edium
.com
/@
deavenditam
a

31
</ul>
</div>
</nav>
</header>
views/layouts/left.php
<aside class="main-sidebar">
<section class="sidebar">

<div class="user-panel">
<div class="pull-left image">
<img src="<?= $directoryAsset ?>/img/user2-160x160.jpg" class="img-
circle" alt="User Image"/>
</div>
<div class="pull-left info">
<p><?= Yii::$app->user->identity->nama ?></p>
<a href="#"><i class="fa fa-circle text-success"></i> Online</a>
</div>
</div>
<?= dmstrwidgetsMenu::widget(
[
'options' => ['class' => 'sidebar-menu tree', 'data-widget'=> 'tree'],
'items' => [
['label' => 'Menu', 'options' => ['class' => 'header']],
['label' => 'Dashboard', 'icon' => 'file-code-o', 'url' =>
['site/dashboard']],
['label' => 'Pegawai', 'icon' => 'dashboard', 'url' =>
['pegawai/index']],
['label' => 'Login', 'url' => ['site/login'], 'visible' =>
Yii::$app->user->isGuest],
['label' => 'Logout', 'url' => ['site/logout'], 'visible' =>
!Yii::$app->user->isGuest],
],
]
) ?>
</section>
</aside>
m
edium
.com
/@
deavenditam
a

32
Maka tampilan SIMPEG and akan menjadi seperti berikut
Sekian untuk tutorial membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana
menggunakan YII2 – part 1 (CRUD pegawai dan Login). Pada part berikutnya akan dijelaskan
tentang bagaimana membuat fitur-fitur lain yang biasa ada pada SIMPEG.
Terimakasih
Dea Venditama
deavenditama@gmail.com
m
edium
.com
/@
deavenditam
a

Membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana menggunakan yii2 (Part 1 CRUD dan Login)

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to Membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana menggunakan yii2 (Part 1 CRUD dan Login)

Similar to Membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana menggunakan yii2 (Part 1 CRUD dan Login) (20)

Recently uploaded

Recently uploaded (20)

Membuat Sistem Informasi Kepegawaian (SIMPEG) sederhana menggunakan yii2 (Part 1 CRUD dan Login)