@extends('AdminLte.template')

<!--Title-->
@section('title')
Monthly Overtime Input Master
@endsection
<!--Title Close-->

<!--External CSS-->
@section('ExternalCss')
@parent
@endsection
<!--External CSS Close--> 
 
@section('Content')
<!-- Your Page Content Here -->

<!--View Content of database-->
<div class="table-responsive">
    <div class="col-md-12">

    <div class="row" id="monthlyOvertimeModal">
    {{ Form::open(['action' => 'MonthlyOvertimeInputController@create','id' => 'monthlyovertimeForm','autocomplete' => 'off']) }}
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
         
                    <div class="row" style="margin-top:10px;">
                   <h3 style="margin-top:3px !important; margin-bottom:2px !important;" class="txtCenter">Monthly Overtime Input</h3> <br/>
                    </div>

                    <div class="col-md-8 padding3 borderSearchBox">
                        <div class="input-group" style="float:left;">
                            <div class="col-md-3 txtRight">
                              <label>Month<span style="margin-left: 2px;">: </span></label>
                        </div>
                        
                        <div class="col-md-2">
                        <input name="salarymonth" id="salarymonth" value="{{date($yearMonth)}}" class="inputType borderNone borderBottom blue noPadding salarymonth" type="month" style="width: 135px;">
                        </div>
                    </div>
                    <div class="input-group" style="float:left; margin-left: -30px;">
                       <label>Department<span style="margin-left: 5px;">: </span></label>
                    </div>

                    <div class="col-md-2">
                            <select id="departmentlist" name="departmentlist" class="form-control departmentlist borderNone borderBottom blue noPadding" style="width: 120px; height: 20px;font-size: 12px;padding: 0px;">
                             <option value = "0">All</option>
                              @foreach($department as $key=>$select)
                              <option value="{{$select->department_id}}">{{$select->department_name}}</option>    
                              @endforeach  
                            </select>      
                    </div>
                    
                    <div class="col-md-2 txtRight" style="margin-left: 15px;">
                            <label>Category<span style="margin-left: 5px;">: </span></label>
                        </div>
                        
                        <div class="col-md-2">
                        <select id="categorylist" name="categorylist" class="form-control categorylist borderNone borderBottom blue noPadding" style="width: 120px; height: 20px;font-size: 12px;padding: 0px;margin-left: -10px;">
                         <option value = "0">All</option>
                         @foreach($category as $key=>$select)
                              <option value="{{$select->job_category_id}}">{{$select->job_category_name}}</option>    
                            @endforeach  
                         </select>      
                        </div>

                </div>

                        <div class='row' style="overflow: scroll; height: 430px;width: 100%;">
                            
                                <table class="table borderNone commonFontSize" id="maintable" style="margin: 15px;width: 95%; align: left;">
                                    <thead>
                                        <tr style="height: 5%;">
                                            <!-- <th class="TopBottomBorder tdPadding5px warning" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;" width="5%">#</th>   -->
                                            <!-- <th class="th warning borderTopBottom textRight" width="4%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;">Emp.ID</th> -->
                                            <th class="th warning borderTopBottom" width="20%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;">Employee Name</th>
                                            <th class="th warning borderTopBottom" width="5%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;">Department</th>
                                            <th class="th warning borderTopBottom" width="5%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;">Category</th>
                                            <th class="th warning borderTopBottom textRight" width="3%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important;font-size: 12px;padding: 0px;">OT.Hours</th>  
                                            <th class="th warning borderTopBottom textRight" width="3%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important;font-size: 12px;padding: 0px;">Created / Updated By</th>  
                                            <th class="th warning borderTopBottom textRight" width="5%" style="border-bottom: 1px solid #000 !important; border-top: 1px solid #000 !important; border-left: 1px solid #000 !important;border-right: 1px solid #000 !important; height: 20px;font-size: 12px;padding: 0px;">  </th>
                                        </tr>
                                    </thead>
                                    <tbody id="mainbody">
                                    </tbody>
                                </table>
                            
                        </div>
                        </div></div>

                 <div class="modal-footer" style="width: 60%;">
                    <button type="submit" name="submit1" id="submit1" accesskey="s" value="Submit" class="btn btn-sm btn-success submit1"><u>S</u>ubmit</button>
                    {{-- <button type="submit" name="submit1" id="submit1" value="Finalize" class="btn btn-sm btn-danger finalize1" accesskey="c" data-dismiss="modal"><u>F</u>inalize</button> --}}
                    <button type="button" onclick="location.reload()" class="btn btn-sm btn-danger" accesskey="c" data-dismiss="modal"><u>C</u>ancel</button>
                </div>

                {{ Form::close() }}
                <!--from end-->
    </div>
</div>
@endsection

<!--Bootstrap Modals-->      
@section('BootstrapModals')
@include('Components/Bootstrap Modals/monthly_salary_input_modal')
@endsection
<!--Bootstrap Modals Close-->

<!--External JS-->
@section('ExternalJs')
<script src=    "{{     asset ("/js/monthly_overtime_input.js?$releaseVersion") }}"></script>
    @endsection
    <!--External JS Close-->