<!-- Extend area where template is defined -->
<?= $this->extend('templates/adminlte/generalcontent') ?>
<!-- .Extend -->

<!-- Title of the page -->
<?= $this->section('title') ?>Payroll Type<?= $this->endSection() ?>
<!-- .Title -->

<!-- CSS of the page -->
<?= $this->section('css') ?>
<?= $this->endSection() ?>
<!-- .CSS -->

<!-- body attribute - class definition -->
<?= $this->section('bodyclass') ?>sidebar-mini<?= $this->endSection() ?>
<!-- .body attribute -->

<!-- Container title -->
<?= $this->section('containertitle') ?>Payroll Type<?= $this->endSection() ?>
<!-- .Container title -->

<!-- Active breadcrumb -->
<?= $this->section('breadcrumbs') ?>
<li class="breadcrumb-item active">Payroll Type</li>
<?= $this->endSection() ?>
<!-- .Active breadcrumb -->

<!-- Main content -->
<?= $this->section('main') ?>

<!-- Modal Add Branch -->
<div class="modal fade" id="mdlAddBranch">
  <div class="modal-dialog">
    <div class="modal-content">
      <form action="<?= url_to('payroll/addpaytype') ?>" method="post">
        <div class="modal-header">
          <h4 class="modal-title" >New Payroll Type</h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <div class="row">
            <div class="col-12">
              <p class="lead">Payroll Type Information</p>
              <div class="row">
                <div class="col-12">
                    <div class="form-group">
                        <label for="txtPayName">Payroll Type Name</label>
                        <input class="form-control" type="text" id="txtPayName" name="paytype_name" value="<?= old('paytype_name') ?>">
                    </div>
                    <div class="form-group">
                        <label for="txtPayCode">Payroll Type Code</label>
                        <input class="form-control" type="text" id="txtPayCode" name="paytype_code" values="<?= old('paytype_code') ?>">
                    </div>
                    <div class="form-group">
                        <div class="form-check">
                            <input class="form-check-input" type="radio" id="rdoIsMonthly" name="paytype_sched" value="monthly">
                            <label for="rdoIsMonthly" class="form-check-label">Computation is based on monthly salary.</label>
                        </div>  
                        <div class="form-check">
                            <input class="form-check-input" type="radio" id="rdoIsSemiMonthly" name="paytype_sched" value="semi_monthly" checked>
                            <label for="rdoIsSemiMonthly" class="form-check-label">Computation is based on semi-monthly salary.</label>
                        </div>  
                        <div class="form-check">
                            <input class="form-check-input" type="radio" id="rdoIsDaily" name="paytype_sched" value="daily">
                            <label for="rdoIsDaily" class="form-check-label">Computation is based on daily salary.</label>
                        </div>  
                        <div class="form-check">
                            <input class="form-check-input" type="radio" id="rdoIsHourly" name="paytype_sched" value="hourly">
                            <label for="rdoIsHourly" class="form-check-label">Computation is based on daily salary.</label>
                        </div> 
                    </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="modal-footer">
            <button type="submit" class="btn btn-primary">Save changes</button>
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        </div>
      </form>
    </div>
  </div>
</div>


<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h3 class="card-title">List of Payroll Type</h3>
            </div>
            <div class="card-body">
                <div class="card-body table-responsive p-0">
                    <?= $tblPayrollType ?>
                </div>
            </div>
            <div class="card-footer">
                <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#mdlAddBranch">Add Payroll Type</button>
            </div>
        </div>
    </div>
</div>

<?= $this->endSection() ?>
<!-- .Main content -->

<!-- Javascript -->

<?= $this->section('js') ?>

<script>
$(document).ready(function() {
    
});



</script>

<?= $this->endSection() ?>

<!-- .Javascript -->