File: /var/www/html/taxicamera/application/views/admin/roster/view_roster.php
<style>
/* Roster CSS */
/* .set_roster_frm select {
display: none;
width: 100%;
padding: 3px;
} */
.unselectable{
background-color: #ddd;
pointer-events: none;
cursor: not-allowed;
}
.set_roster_frm label {
width: 100%;
background: #ccc;
cursor: pointer;
}
.set_roster_frm .select2.select2-container .select2-selection {
margin-bottom: 0 !important;
}
#edit_roster_by_wk .select2.select2-container .select2-selection {
margin-bottom: 0 !important;
}
#edit_roster_by_wk .form-group,
#search_roster_by_wk .form-group,
.roster_form_s .form-group
{
margin-bottom: 0 !important;
}
.form-section2 {
color: #343A40;
line-height: 3rem;
font-size: 1.2rem;
letter-spacing: 0.5px;
font-weight: 400;
margin-bottom: 15px;
border-bottom: 1px solid #b7b5b5;
}
.roster_table .table thead tr td {
background: #1db5bd;
color: #fff;
font-size: 13px;
}
.roster_table.table-striped tbody tr:nth-of-type(odd) {
background-color: #edfaff !important;
}
.breakdown.hara_bhara {
background: #2bab11 !important;
color: #fff;
}
label.brek2.chk_custom_box.hara_bhara {
background: #2bab11 !important;
color: #fff;
margin-bottom: 0;
}
.brek2 {}
.brek2.chk_custom_box {
font-size: 13px !important;
padding-left: 0 !important;
}
.brek2.chk_custom_box:hover input~.checkmark,
.brek2.chk_custom_box .checkmark {
background-color: #5d6061 !important;
}
.rster-sift {
padding: 0;
margin: 0;
list-style: none;
display: flex;
}
.rster-sift li {
flex: 1;
text-align: center;
position: relative;
border: 1px solid #AED6FF;
color: #254566;
font-weight: 700;
font-size: 13px;
}
.view-driver {
position: absolute;
top: 33px;
right: 0;
width: 127px;
text-align: left;
background: #AED6FF;
padding: 5px;
color: #fff;
display: none;
z-index: 9;
box-shadow: 0px 0px 5px 3px
rgba(0,0,0,0.125);
}
.rster-sift li:hover .view-driver
{
display: block;
}
.view-driver span {
display: block;
color: #000;
font-size: 11px;
line-height: 1.6;
text-transform: capitalize;
}
.rster-sift li a {
display: block;
}
.view-roster-table table tr th {
background: #5199E1;
color: #fff;
font-weight: 700 !important;
font-size: 13px;
border: 1px solid #d0c7c7;
}
.search-tag .form-control {
margin: 0;
font-size: 13px;
border: none;
border-radius: 0px;
color: #000;
padding: 0 25px 0 7px;
}
.search-tag {
position: relative;
}
.search-tag::after {
content: "\f002";
position: absolute;
right: 5px;
top: 11px;
color: #a6a3a3;
font: normal normal normal 14px/1 FontAwesome;
}
/*===========================================================
RESPONSIVE CSS
=============================================================*/
@media only screen and (min-width:220px) and (max-width:767px) {}
@media only screen and (min-width:320px) and (max-width:479px) {
.card-header .title_btn {
float: none;
display: block;
width: 101px;
margin-top: 10px;
}
}
.btn-save-all {
background: #239c91;
padding: 5px 10px;
display: inline-block;
color: #fff;
border-radius: 3px;
font-size: 15px;
}
</style>
<div class="main-content">
<div class="content-wrapper">
<div class="container-fluid">
<!-- Basic form layout section start -->
<section id="basic-form-layouts">
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="card-header">
<div class="page-title-wrap">
<?php $date = new DateTime(date('Y-m-d')); ?>
<h4 class="card-title">View Roster (Current Week Number : <?= $date->format("W"); ?>)</h4>
<form id="view_roster_by_wk" action="<?= base_url(); ?>admin/roster/view_roster" method="post">
<div class="form-group">
<div class="row">
<div class="col-md-5">
<div class="form-group">
<label>Select From Year</label>
<select class="js-select2" data-show-subtext="true" data-live-search="true" name="get_year_roster" id="get_year_roster" required>
<option value="">Select Year</option>
<?php for($year = 1;$year >= -1;$year--){ ?>
<option value="<?= date('Y') + $year?>" <?=(date('Y') + $year == $years)?'selected':''?>> <?= date('Y') + $year?></option>
<?php } ?>
</select>
</div>
</div>
<div class="col-md-5">
<div class="form-group">
<label>Select Week No</label>
<select name="get_week_no_view" id="get_week_no_view" class="js-select2" data-show-subtext="true" data-live-search="true">
<option value="">Select Week</option>
<?php foreach ($weeks as $wk) : ?>
<option value="<?= $wk['week_name']; ?>" <?=($week_no==$wk['week_name'])?'selected':''?>><?= $wk['week_name']; ?></option>
<?php endforeach; ?>
</select>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<button type="button" class="btn btn-success" id="roster_search" name="roster_search" style="margin-top:30px;">Search</button>
</div>
</div>
</div>
</div>
<div class="view-roster-table table-responsive">
<table class="table table-striped table-bordered">
<thead>
<tr>
<?php if (!empty($get_car_by_wk)) { $count=0; ?>
<th>Car No.
<div class="">
<select name="get_car_no_view" id="get_car_no_view" class="js-select2" data-show-subtext="true" data-live-search="true">
<option value="">Select All</option>
<?php foreach ($cars as $car) : ?>
<option value="<?= $car['car_id']; ?>" <?=($car_no==$car['car_id'])?'selected':''?>><?= $car['registration_no']; ?></option>
<?php endforeach; ?>
</select>
</div>
</th>
<?php foreach ($get_car_by_wk as $car1) {$count++;
if($count == 1){
foreach ($car1 as $ax1) { ?>
<th><?= $ax1['roster']['dayname']; ?><br> (<?= date_format(date_create($ax1['roster']['day_date']),'d/m/Y') ?>)</th>
<?php } } } } ?>
</tr>
</thead>
</form>
<tbody>
<?php if (!empty($get_car_by_wk)) {
foreach ($get_car_by_wk as $car) {?>
<tr>
<td><?= $car[0]['roster']['registration_no']; ?></td>
<?php foreach ($car as $ax) { ?>
<?php if(empty($ax)){?> <td>No Shift</td>
<?php }else{?>
<td>
<?php if ($ax['roster']['breakdown'] == 1) {?>
<ul class="rster-sift">
<li class="notavl-shift">
<a class="go_for_edit">Breakdown/Accident</a>
<div class="view-driver">
<span><b>Reason:</b> <?=$ax['roster']['breakdown_reason']?></span>
<?php if(!empty($ax['roster']['shift'])){
foreach ($ax['roster']['shift'] as $shift) { ?>
<span><b>Dc:</b> <?=$shift['driver']['dc_no']?></span>
<span><b>Mob:</b> <?=$shift['driver']['mobile']?></span>
<span><b>Driver:</b> <?=$shift['driver']['full_name']?></span>
<span><b>Network:</b> <?=$shift['driver']['network_name']?></span>
<?php }
} ?>
</div>
</li>
</ul>
<?php
/*if(!empty($ax['roster']['shift'])){
foreach ($ax['roster']['shift'] as $shift) { ?>
<li>
<a class="go_for_edit"><?=$shift['shift_name']?></a>
<div class="view-driver">
<span><b>Dc:</b> <?=$shift['driver']['dc_no']?></span>
<span><b>Mob:</b> <?=$shift['driver']['mobile']?></span>
<span><b>Driver:</b> <?=$shift['driver']['full_name']?></span>
<span><b>Network:</b> <?=$shift['driver']['network_name']?></span>
</div>
</li>
<?php }
}
else { ?>
<li class="avl-shift">
<a class="go_for_edit">Available</a>
<div class="view-driver">
<span><b>Description: </b> No Shift Available</span>
</div>
</li>
<?php } */ ?>
<?php } else { ?>
<ul class="rster-sift">
<?php
if(!empty($ax['roster']['shift'])){
foreach ($ax['roster']['shift'] as $shift) { ?>
<li>
<a class="go_for_edit"><?=$shift['shift_name']?></a>
<div class="view-driver">
<span><b>Dc:</b> <?=$shift['driver']['dc_no']?></span>
<span><b>Mob:</b> <?=$shift['driver']['mobile']?></span>
<span><b>Driver:</b> <?=$shift['driver']['full_name']?></span>
<span><b>Network:</b> <?=$shift['driver']['network_name']?></span>
</div>
</li>
<?php }
} else { ?>
<li class="avl-shift">
<a class="go_for_edit">Available</a>
<div class="view-driver">
<span><b>Description: </b> No Shift Available</span>
</div>
</li>
<?php } ?>
</ul>
<?php } ?>
</td>
<?php } } ?>
</tr>
<?php } } ?>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
</div>
<script>
$('#get_car_no_view').change(function() {
$('#view_roster_by_wk').submit();
});
$('#roster_search').click(function() {
var get_year_roster=$('#get_year_roster').val();
var get_week_no_view=$('#get_week_no_view').val();
if(get_year_roster !='' && get_week_no_view !=''){
$('#view_roster_by_wk').submit();
}else{
if(get_year_roster ==''){
$.alert({
type: 'red',
title: 'Select Year',
content: 'Please Select Year',
});return false;
}
else if(get_week_no_view ==''){
$.alert({
type: 'red',
title: 'Select Week',
content: 'Please select Week',
});return false;
}
}
});
</script>