@extends('payroll.employee_frontend.layouts.employee')
@section('custom_style')
    <link href="{{ asset('/') }}assets/plugins/datetimepicker/css/classic.css" rel="stylesheet"/>
    <link href="{{ asset('/') }}assets/plugins/datetimepicker/css/classic.time.css" rel="stylesheet"/>
    <link href="{{ asset('/') }}assets/plugins/datetimepicker/css/classic.date.css" rel="stylesheet"/>
    <link rel="stylesheet" href="{{ asset('/') }}treeview/tree_view.css"/>
@endsection
@section('content')

    @php
        $company_setting = \App\Models\Payroll\CompanySettings\PayCompanySetting::query()->first();
        $conveyance_consider_day = json_encode($company_setting->conv_consider_day);
    @endphp
    <section>
        <div class="col-12 mt-4">
            <h2 class="page-title text-center">@if(!empty($conveyance_info_details)) View @elseif (!empty($conveyance_info_details_edit)) Edit @else Create @endif Conveyance History</h2>
            <div class="mb-2 heading-border"></div>
        </div>
    </section>
    <section class="px-3  pt-3 pt-lg-5 row">
        <div class="col-12 mb-4">
            <div class="blu-card d-flex flex-wrap">
                <div class="col-12">
                    @if (session('success'))
                        <div class="alert alert-success" id="hide-alert">
                            {{ session('success') }}
                        </div>
                    @endif
                    @if (session('danger'))
                        <div class="alert alert-danger" id="hide-alert">
                            {{ session('danger') }}
                        </div>
                    @endif
                    @if ($errors->any())
                        <div class="alert alert-danger" id="hide-alert">
                            <ul>
                                @foreach ($errors->all() as $error)
                                    <li>{{ $error }}</li>
                                @endforeach
                            </ul>
                        </div>
                    @endif
                </div>
                <form class="leave-form col-12 col-md-12 border-right" action="{{route('employee.conveyance.store')}}"
                      method="post">
                    @csrf
                    <input type="hidden" name="row_id" value="@if(!empty($conveyance_info)){{$conveyance_info->id}} @endif">
                    <div class="row flex-wrap">
                        <div class="form-group col-12 col-md-3">
                            <label for="exampleInputEmail1">{{__('obs.voucher')}} {{__('obs.no')}}</label>
                            <input required id="voucher_no" name="voucher_no" class="form-control" type="text" readonly
                                   value="@if(!empty($conveyance_info)){{$conveyance_info->voucher_no}}@else{{$total_conveyance_count}}@endif">
                        </div>
                        <div class="form-group col-12 col-md-3">
                            <label for="exampleInputEmail1">{{__('obs.voucher')}} {{__('obs.date')}}</label>
                            <input required id="voucher_date" name="voucher_date" class="form-control datepicker"
                                   placeholder="Voucher Date" type="text"
                                   value="@if(!empty($conveyance_info)){{$conveyance_info->voucher_date}}@endif">
                        </div>
                        <div class="form-group col-12 col-md-3">
                            <label for="exampleInputEmail1">{{__('obs.type')}}</label>
                            <select name="conveyance_type" id="conveyance_type" class="form-control">
                                @foreach($conveyance_type as $type_val)
                                    <option value="{{$type_val->id}}"
                                            @if(!empty($conveyance_info) && $conveyance_info->conveyance_type==$type_val->id) selected @endif>{{$type_val->name}}</option>
                                @endforeach
                            </select>
                        </div>
                        <div class="form-group col-12 col-md-3">
                            <label for="exampleInputEmail1">{{__('obs.purpose')}}</label>
                            <textarea required placeholder="Enter Purpose" class="form-control" name="voucher_purpose"
                                      id="voucher_purpose" cols="30"
                                      rows="3">@if(!empty($conveyance_info)){{$conveyance_info->purpose}}@endif</textarea>
                        </div>

                        <div class="form-group col-12 col-md-12">
                            <table class="table table-bordered table-hover">
                                <thead class="thead-blu">
                                    <tr>
                                        <th class="text-center">{{__('obs.date')}}</th>
                                        <th class="text-center">{{__('obs.purpose')}}</th>
                                        <th class="text-center">{{__('obs.from')}}</th>
                                        <th class="text-center">{{__('obs.to')}}</th>
                                        <th class="text-center">{{__('obs.amount')}} {{__('obs.in')}} {{__('obs.tk')}}</th>
                                        @if(empty($conveyance_info_details))
                                            <th><button type="button" class="btn btn-rounded btn-success add_more_row">+</button></th>
                                        @endif
                                    </tr>
                                </thead>
                                <tbody class="row_tbody">
                                @if(!empty($conveyance_info_details))

                                    @php $total_amount = 0 @endphp
                                    @foreach($conveyance_info_details as $details_val)
                                        <tr>
                                            <td class="text-center">{{$details_val->conveyance_date}}</td>
                                            <td class="text-center">{{$details_val->conveyance_purpose}}</td>
                                            <td class="text-center">{{$details_val->conveyance_from}}</td>
                                            <td class="text-center">{{$details_val->conveyance_to}}</td>
                                            <td class="text-right">{{$details_val->conveyance_amount}}
                                                                                            </td>
                                        </tr>
                                    @endforeach
                                @elseif(!empty($conveyance_info_details_edit))
                                    @php $total_amount = 0 @endphp
                                    @foreach ($conveyance_info_details_edit as $cinfo)
                                        <tr>
                                            <td>
                                                <input type="hidden" name="d_row_id[]" value="{{$cinfo->id}}">
                                                <input id="conveyance_date" name="conveyance_date[]"
                                                    placeholder="Conveyance Date"
                                                    class="form-control datepicker" value="{{$cinfo->conveyance_date}}" type="text">
                                            </td>
                                            <td>
                                                <input id="conveyance_purpose" name="conveyance_purpose[]"
                                                    placeholder="Conveyance Purpose"
                                                    class="form-control" value="{{$cinfo->conveyance_purpose}}" type="text">
                                            </td>
                                            <td>
                                                <input id="conveyance_from" name="conveyance_from[]"
                                                    class="form-control"
                                                    type="text" value="{{$cinfo->conveyance_from}}" placeholder="For Travel Purpose">
                                            </td>
                                            <td>
                                                <input id="conveyance_to" name="conveyance_to[]" class="form-control"
                                                    type="text" value="{{$cinfo->conveyance_to}}" placeholder="For Travel Purpose">
                                            </td>
                                            <td>
                                                <input id="conveyance_amount" name="conveyance_amount[]"
                                                    class="form-control conveyance_amount" type="number"
                                                    onkeyup="total_amount()" value="{{$cinfo->conveyance_amount}}"
                                                    placeholder="Conveyance Amount">
                                                    @php $total_amount += $cinfo->conveyance_amount @endphp
                                            </td>
                                            <td>
                                                <button type="button" class="btn btn-danger remove_button">X</button>
                                            </td>
                                        </tr>
                                    @endforeach
                                @else
                                    <tr>
                                        <td>
                                            <input id="conveyance_date" name="conveyance_date[]"
                                                placeholder="Conveyance Date"
                                                class="form-control datepicker" required type="text">
                                        </td>
                                        <td>
                                            <input id="conveyance_purpose" name="conveyance_purpose[]"
                                                placeholder="Conveyance Purpose"
                                                class="form-control" type="text">
                                        </td>
                                        <td>
                                            <input id="conveyance_from" name="conveyance_from[]"
                                                class="form-control"
                                                type="text" placeholder="For Travel Purpose">
                                        </td>
                                        <td>
                                            <input id="conveyance_to" name="conveyance_to[]" class="form-control"
                                                type="text" placeholder="For Travel Purpose">
                                        </td>
                                        <td>
                                            <input id="conveyance_amount" name="conveyance_amount[]"
                                                class="form-control conveyance_amount" type="number"
                                                onkeyup="total_amount()"
                                                required placeholder="Conveyance Amount">
                                        </td>
                                        <td>
                                            <button type="button" class="btn btn-danger remove_button">X</button>
                                        </td>
                                    </tr>
                                @endif
                            </tbody>
                            </table>
                        </div>
                        <div class="form-group col-3 offset-md-9">
                            <input type="number" readonly class="form-control text-right" name="total_conveyance_amount"
                                   id="total_conveyance_amount" placeholder="Total Amount" value="@if(!empty($conveyance_info_details_edit) || !empty($conveyance_info_details)){{$total_amount}}@endif">
                        </div>
                        <input type="hidden" name="emp_id" value="{{$emp_id}}">
                        <input type="hidden" name="type" value="1">

                        <div class="form-group col-12 text-center">
                            @if(empty($conveyance_info))
                                <input class="btn btn-success px-4" type="submit" value="Create">
                            @endif
                            @if(!empty($conveyance_info_details_edit))
                                <input class="btn btn-success px-4" type="submit" value="Update">
                            @endif
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </section>

@endsection

@section('script')

    <script src="{{ asset('/') }}assets/plugins/datetimepicker/js/legacy.js"></script>
    <script src="{{ asset('/') }}assets/plugins/datetimepicker/js/picker.js"></script>
    <script src="{{ asset('/') }}assets/plugins/datetimepicker/js/picker.time.js"></script>
    <script src="{{ asset('/') }}assets/plugins/datetimepicker/js/picker.date.js"></script>
    <script src="{{ asset('/') }}assets/plugins/bootstrap-material-datetimepicker/js/moment.min.js"></script>

    <script>
        function total_amount() {
            let total_amount = 0;
            $(".conveyance_amount").each(function () {
                total_amount += Number($(this).val());
            });
            $("#total_conveyance_amount").val(total_amount);
        }

        today = new Date();
        let days = 86400000; //number of milliseconds in a day;
        let conveyance_consider_day = ;

        // $('.datepicker').pickadate({ // this is used in the system
        //     selectMonths: true,
        //     selectYears: 100,
        //     format: 'dd-mm-yyyy',
        //     min: new Date(today - (7*days)),
        //     firstDay: 0
        // });


        $(document).on("focus",".datepicker",function(){
            $(this).pickadate({ // this is used in the system
                selectMonths: true,
                selectYears: 100,
                format: 'dd-mm-yyyy',
                min: new Date(today - (Number(conveyance_consider_day)*days)),
                firstDay: 0
            });
        });

        $('.datepicker_month').pickadate({ // this is used in the system
            selectMonths: true,
            selectYears: true,
            format: 'mm-yyyy'
        });
        $('.timepicker').pickatime()

        $('.add_more_row').click(function(){
            $('.row_tbody').append(
                '<tr>'+
                    '<td>'+
                        '<input type="hidden" name="d_row_id[]" value="">'+
                        '<input id="conveyance_date" name="conveyance_date[]" placeholder="Conveyance Date" class="form-control datepicker" required type="text">'+
                    '</td>'+
                    '<td>'+
                        '<input id="conveyance_purpose" name="conveyance_purpose[]" placeholder="Conveyance Purpose" class="form-control" type="text">'+
                    '</td>'+
                    '<td>'+
                        '<input id="conveyance_from" name="conveyance_from[]" class="form-control" type="text" placeholder="For Travel Purpose">'+
                    '</td>'+
                    '<td>'+
                        '<input id="conveyance_to" name="conveyance_to[]" class="form-control" type="text" placeholder="For Travel Purpose">'+
                    '</td>'+
                    '<td>'+
                        '<input id="conveyance_amount" name="conveyance_amount[]" class="form-control conveyance_amount" type="number" required onkeyup="total_amount()" placeholder="Conveyance Amount">'+
                    '</td>'+
                    '<td>'+
                        '<button class="btn btn-danger remove_button">X</button>'+
                    '</td>'+
                '</tr>'
            );
        });

        $(document).on('click','.remove_button',function(){
            $(this).closest('tr').remove();
            total_amount();
        });
    </script>

@endsection