@extends('hr_main')
@section('title', '| ' . $data['pageTitle'])
@section('content')
    <div class="row add-data-form">
        <div class="col-md-12">
            <div class="col-md-1"></div>
            <div class="col-md-10 fullbody">
                <div class="viewTitle" style="border-bottom: 1px solid white;">
                    <a href="{!! $data['listBtnUrl'] !!}" class="btn btn-info pull-right addViewBtn"><i
                            class="glyphicon glyphicon-th-list viewIcon">
                        </i>Fixed Govt Holiday List</a>
                </div>
                <div class="panel panel-default panel-border">
                    <div class="panel-body">
                        <div class="row">
                            <div class="col-md-12">

                                <div class="panel-heading">
                                    <div class="panel-title">{!! $data['pageTitle'] !!}</div>
                                </div>

                                <div class="panel-body">

                                    <div class="row">
                                        <div class="col-md-12">
                                            {{-- {{ $data }} --}}

                                            {!! Form::open(['files' => 'false', 'role' => 'form', 'class' => 'form-horizontal form-groups']) !!}
                                            <div class="row form-group">
                                                <div class="col-sm-3">
                                                    {!! Form::label('Effect Date', 'Effect Date', ['class' => 'control-label']) !!}

                                                    <input class="form-control" {{ $data['view'] ? 'disabled' : '' }}
                                                        value="{{ date('d-m-Y', strtotime($data->effect_date)) }}"
                                                        id='datePicker' name="effect_date" placeholder="Effect Date"
                                                        required />

                                                    <p id='fiscal_year_id' style="max-height:3px; color: red!important;">
                                                        {{ $errors->error->first('effect_date') }}</p>
                                                </div>
                                                <div class="col-sm-3">
                                                    {{-- {!! Form::label('holiday_type', 'Holiday Type', ['class' => 'control-label']) !!} --}}
                                                    <input type="hidden" value="Govt. Holiday" class="form-control" readonly />
                                                    <p id='holiday_type' style="max-height:3px; color: red!important;">
                                                        {{ $errors->error->first('holiday_type') }}</p>
                                                </div>
                                            </div>

                                            {{-- Govt Holiday  --}}
                                            <div class="govtHoliday">
                                                <div class="row form-group">
                                                    <table class="table table-striped table-bordered table-condensed"
                                                        id="holiday-data">
                                                        <thead>
                                                            <tr>
                                                                <th>Holiday Name </th>
                                                                <th>Date </th>
                                                                <th></th>
                                                            </tr>
                                                        </thead>
                                                        <tbody class="appendTr">

                                                            @foreach ($data->govt_holiday_chilren as $item)
                                                                <tr>
                                                                    <td>
                                                                        <input type="text" class="form-control"
                                                                            id="holiday_name" value="{{ $item->title }}"
                                                                            name="holiday_name[]"
                                                                            {{ $data['view'] ? 'disabled' : '' }}
                                                                            placeholder="Holiday name" />

                                                                    </td>
                                                                    <td>
                                                                        <input type="text" name="holiday_date[]"
                                                                            value="{{ $item->holiday }}"
                                                                            class="form-control datepicker"
                                                                            {{ $data['view'] ? 'disabled' : '' }}
                                                                            placeholder="From Date " />

                                                                    </td>

                                                                    @if ($data['view'])
                                                                        <td></td>
                                                                    @else
                                                                        <td>
                                                                            <a href="javascript:;" id=""
                                                                                class="btn btn-xs btn-info addMore-2"><i
                                                                                    class="fa fa-plus-circle"></i></a>
                                                                            <a href="javascript:;" id=""
                                                                                class="btn btn-xs btn-danger delRow-2"><i
                                                                                    class="fa fa-times"></i></a>
                                                                        </td>
                                                                    @endif
                                                                </tr>
                                                            @endforeach
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>




                                            <div class="row form-group">
                                                <div class="col-sm-12 text-center">
                                                    @if (!$data['view'])
                                                        {!! Form::submit('Edit', ['id' => 'add', 'class' => 'btn btn-info']) !!}
                                                    @endif

                                                    <a href="{!! $data['listBtnUrl'] !!}"
                                                        class="btn btn-danger closeBtn">Close</a>
                                                </div>
                                            </div>
                                            {!! Form::close() !!}

                                        </div>
                                    </div>
                                @section('footerAssets')
                                    <script type="text/javascript">
                                        $("#datePicker").attr("autocomplete", "off").datepicker({
                                            format: "dd-mm-yyyy",
                                            startView: "days", // Start the datepicker with days view
                                            minViewMode: "days", // Set the minimum view mode to days
                                            autoclose: true,
                                            afterShow: function() {
                                                $(".ui-datepicker select").select2();
                                            }
                                        });
                                        $(".datepicker").attr("autocomplete", "off").datepicker({
                                            format: "dd-mm",
                                            startView: "days", // Start the datepicker with days view
                                            minViewMode: "days", // Set the minimum view mode to days
                                            autoclose: true,
                                            afterShow: function() {
                                                $(".ui-datepicker select").select2();
                                            }
                                        });



                                        function chkRowAddMoreButton(deleteButton, thisButton) {
                                            if (deleteButton.length > 1) {
                                                deleteButton.hide();
                                                deleteButton.last().show();
                                            } else {
                                                deleteButton.show();
                                            }
                                        }

                                        function chkRowDellMoreButton(deleteButton) {
                                            if (deleteButton.length > 1) {
                                                deleteButton.show();
                                            } else {
                                                deleteButton.hide();
                                            }
                                        }

                                        $(document).ready(function() {
                                            chkRowAddMoreButton($('.addMore-2'), $(this));
                                            chkRowDellMoreButton($('.delRow-2'));
                                            $(document).on('click', '.addMore-2', function() {
                                                var $row = $(this).parent().parent().clone().find('input:text').val('').end();
                                                $row.appendTo('.appendTr');
                                                $('.datepicker').datepicker({
                                                    format: 'dd-mm'
                                                });
                                                chkRowAddMoreButton($('.addMore-2'), $(this));
                                                chkRowDellMoreButton($('.delRow-2'));

                                            });
                                            $(document).on('click', '.delRow-2', function() {
                                                if (confirm('Are you sure to delete?'))
                                                    $(this).parent().parent().remove();
                                                chkRowAddMoreButton($('.addMore-2'), $(this));
                                                chkRowDellMoreButton($('.delRow-2'));
                                            });
                                        });
                                    </script>
                                @endsection



                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="footerTitle" style="border-top:1px solid white"></div>
        </div>
        <div class="col-md-1"></div>
    </div>
</div>
@endsection