@extends('admin.layout.master')
@section('content')

@include('flash-message')
<div class="card sina-card">
    <div class="card-header d-flex justify-content-between align-items-center ">
       <h5 class="font-weight-bold mb-0">{{__('obs.add_amount_list')}}  </h5>
    </div> 

    <div class="row">
        <div class="col-lg-12">
            <div class="card">
                <div class="card-body">
                    <!-- Button trigger modal -->
                    <div class='row'>
                       
                        <div class='col-md-3'>
                            <div class="form-group">
                                <label for="">{{__('obs.name')}}/{{__('obs.code')}}</label>
                                <select class="form-control input-sm name_code_live_search" name="employee_id" id="employee_id">
                                {{-- @foreach ($employees as $employee)
                                <option value="{{$employee->id}}" selected >{{$employee->emp_name}}</option>
                                @endforeach --}}
                                </select>
                            </div>
                        </div>
                        <div class='col-md-2'>
                            <div class="form-group">
                                <label>{{__('obs.department')}} </label>
                                <select class="form-control select_2" id="department_id" name="department_id">
                                    <option value=" " selected>{{__('obs.choose')}}</option>
                                    @foreach ($departments as $department)
                                        <option value="{{ $department->id }}">{{ $department->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        <div class='col-md-2'>
                            <div class="form-group">
                                <label>{{__('obs.start_date')}}</label>
                                <input type="date" class="form-control" name="start_date" id="start_date">
                            </div>
                        </div>
                        <div class='col-md-2'>
                            <div class="form-group">
                                <label>{{__('obs.end_date')}}</label>
                                <input type="date" class="form-control" name="end_date" id="end_date">
                            </div>
                        </div>
                        <div class='col-md-2' style="margin-top:20px">
                            <div class="form-group">
                                <button onclick="SearchAddAmount()" id="searchBtn"
                                    class='btn btn-sm btn-danger'>{{__('obs.search')}}</button>
                            </div>
                        </div>
                    </div>
                    <div class="table-responsive mt-3" id="print " >
                        <table class="table table-bordered table-hover" id="searchresultTable">
                           
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
  
@endsection
@section('script')

<script src="{{ asset('payroll_assets/payroll_common.js') }}"></script>

<script>
     let start_date = $('start_date').val();
    
    $(document).ready(function() {
        $('.select_2').select2();
       
    });

const SearchAddAmount = () => {
    let start_date = $("#start_date").val();
    let end_date = $("#end_date").val();
    let employee_id = $("#employee_id").val();
    let department_id = $("#department_id").val();
    $.ajaxSetup({
        headers: {
            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
        },
    });
    $("#searchBtn").attr("disabled", true);
    $("#searchBtn").text("Loading.......");
    $.ajax({
        type: "GET",
        url: "/payroll/search-add-amount-list",
        data: {
            start_date: start_date,
            end_date: end_date,
            employee_id: employee_id,
            department_id: department_id,
        },
        success: function (data) {
            $("#searchresultTable").html(data);
            $("#searchBtn").attr("disabled", false);
            $("#searchBtn").text("Search");
        },
    });
};


</script>
@endsection