kwpayroll/app/Views/timekeeping/rawattloguploadview.php

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

<!-- Title of the page -->
<?= $this->section('title') ?>TK Raw Log Upload<?= $this->endSection() ?>
<!-- .Title -->

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

<!-- daterange picker -->
<link rel="stylesheet" href="<?= base_url() ?>adminlte/plugins/daterangepicker/daterangepicker.css">

<!-- DataTables -->
<link rel="stylesheet" href="<?= base_url() ?>adminlte/plugins/datatables-bs4/css/dataTables.bootstrap4.min.css">
<link rel="stylesheet" href="<?= base_url() ?>adminlte/plugins/datatables-responsive/css/responsive.bootstrap4.min.css">

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

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

<!-- Container title -->
<?= $this->section('containertitle') ?>Upload Raw Log<?= $this->endSection() ?>
<!-- .Container title -->

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

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

<!-- Modal Upload File -->
<div class="modal fade" id="mdlUploadFile">
  <div class="modal-dialog">
    <div class="modal-content">
      <?php if($selectedBranch != null && $attFromTo != null) ?>
        <form action="/tk/rawattlogupfile/<?= $selectedBranch . '/' . $attFrom . '/' . $attTo ?>" method="post" enctype="multipart/form-data">
        
          <div class="card-header">
            <h3 class="card-title">Attendance Log Uploading</h3>
          </div>
          <div class="card-body">
            <div class="row">
              <div class="col-12">
                <div class="form-group">
                  <label for="txtAttendanceFile">Select File to Upload</label>
                  <div class="input-group">
                    <div class="custom-file">
                      <input type="file" class="custom-file-input" id="txtAttendanceFile" name="att_file">
                      <label class="custom-file-label" for="exampleInputxtAttendanceFiletFile">Choose file</label>
                    </div>
                    <!--
                    <div class="input-group-append">
                      <span class="input-group-text">Upload</span>
                    </div>
                    -->
                  </div>
                </div>
              </div>
            </div>
          </div>
          <div class="card-footer">
            <button class="btn btn-primary">Upload</button>
          </div>
        </form>
      <?php ?>
    </div>
  </div>
</div>


<div class="row">
  <div class="col-12">
    <div class="card">
      <form action="#" method="get">
        <div class="card-header">
          <h3 class="card-title">Attendance Log Uploading</h3>
        </div>
        <div class="card-body">
          <div class="row">
            <div class="col-12 col-md-5">
              <div class="form-group">
                <label>Select Branch</label>
                <select class="form-control" name="branch_code">
                    <?php 
                    foreach($branches as $branch): 
                    $selected = ($branch->branch_code == $selectedBranch) ? 'selected' : '';  
                    ?>
                      <option value="<?= $branch->branch_code ?>" <?= $selected ?>><?= $branch->branch_name ?></option>
                    <?php endforeach; ?>
                </select>
              </div>
            </div>
            <div class="col-12 col-md-7">
              <div class="form-group">
                  <label>Attendance Period:</label>
                  <div class="input-group">
                      <div class="input-group-prepend">
                      <span class="input-group-text">
                          <i class="far fa-calendar-alt"></i>
                      </span>
                      </div>
                      <input type="text" class="form-control float-right" id="txtAttendanceFromTo" name="att_from_to" value="<?= $attFromTo ?>">
                      <input type="hidden" id="hdnAttendanceFrom" name="att_from" value="<?= $attFrom ?>">
                      <input type="hidden" id="hdnAttendanceTo" name="att_to" value="<?= $attTo ?>">
                      <div class="input-group-append">
                        <button class="btn btn-info btn-flat">Get Uploaded Log</button>
                      </div>
                  </div>
                  <!-- /.input group -->
              </div>
            </div>
          </div>
        </div>
      </form>
    </div>
  </div>
</div>

<?php if($selectedBranch != null && $attFromTo != null): ?>
  <div class="row">
      <div class="col-12">
          <div class="card">
            <div class="card-header">
              <h3 class="card-title">Uploaded Attendance Log for Branch <?= $selectedBranch ?> from <?= $attFrom ?> to <?= $attTo ?></h3>
            </div>
            <div class="card-body">
              <div class="card-body table-responsive p-0">
                <?= $tblAttLog ?>
              </div>
            </div>
            <div class="card-footer">
              <button class="btn btn-primary" data-toggle="modal" data-target="#mdlUploadFile">Upload Attendance Log</button>
              <a href="<?= base_url('tk/rawattlogdelete/'. $selectedBranch . '/' . $attFrom . '/' . $attTo . '/') ?>" onclick="return confirm('Are you sure you want to delete the data appeared on the list?')" class="btn btn-danger">Delete Data</a>
            </div>
          </div>
      </div>
  </div>
<?php endif; ?>

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

<!-- Javascript -->

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

<!-- InputMask -->
<script src="<?= base_url() ?>adminlte/plugins/moment/moment.min.js"></script>
<script src="<?= base_url() ?>adminlte/plugins/inputmask/jquery.inputmask.min.js"></script>
<!-- date-range-picker -->
<script src="<?= base_url() ?>adminlte/plugins/daterangepicker/daterangepicker.js"></script>

<!-- bs-custom-file-input -->
<script src="<?= base_url() ?>adminlte/plugins/bs-custom-file-input/bs-custom-file-input.min.js"></script>

<!-- DataTables  & Plugins -->
<script src="<?= base_url() ?>adminlte/plugins/datatables/jquery.dataTables.min.js"></script>
<script src="<?= base_url() ?>adminlte/plugins/datatables-bs4/js/dataTables.bootstrap4.min.js"></script>
<script src="<?= base_url() ?>adminlte/plugins/datatables-responsive/js/dataTables.responsive.min.js"></script>
<script src="<?= base_url() ?>adminlte/plugins/datatables-responsive/js/responsive.bootstrap4.min.js"></script>


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

  //Date range picker
  $('#txtAttendanceFromTo').daterangepicker();

  $("#txtAttendanceFromTo").on("change", function() {
      var from = $(this).data('daterangepicker').startDate.format('YYYY-MM-DD');
      var to = $(this).data('daterangepicker').endDate.format('YYYY-MM-DD');

      $("#hdnAttendanceFrom").val(from);
      $("#hdnAttendanceTo").val(to);
  });

  $('#tblAttLog').DataTable({
      "paging": true,
      "lengthChange": false,
      "searching": true,
      "ordering": true,
      "info": true,
      "autoWidth": false,
      "responsive": true,
    });
});



</script>

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

<!-- .Javascript -->