@extends('layouts.view')
@section('title',trans('lang.hrdocs'))
@section('content')



    <div class="container-fluid">
        <div class="row">
            <div class="col-sm-12">
                <div class="page-title-box">
                    <div class="float-right">
                        <a class="btn btn-primary" href="{{ route('hr_documents') }}"> {{trans('lang.back')}}</a>
                    </div>
                    <h4 class="page-title">{{trans('lang.hrdocs')}}</h4>
                </div><!--end page-title-box-->
            </div><!--end col-->
        </div><!--end row-->
        <div class="col-12">
            <div class="card">
                <div class="card-body">
                    <div id="viewtable">
                        <h4 class="mt-0 header-title">{{trans('lang.hrdocs')}} </h4>
                        <p>
                            @can('HrDocument-create')
                        <td><a id="create_record" style=" margin-bottom:20px; color: #fff;" class="btn btn-primary px-5 py-2">{{trans('lang.addhrdocs')}}</a></td>
                        @endcan
                        </p>

                        <table id="branch-table" class="table table-striped table-bordered dt-responsive nowrap" style="border-collapse: collapse; border-spacing: 0; width: 100%;">
                            <thead>
                            <tr>
                                <th>{{trans('lang.id')}}</th>
                                <th>{{trans('lang.arname')}}</th>
                                <th>{{trans('lang.enname')}}</th>
                                <th>{{trans('lang.expire_date')}}</th>
                                @canany(['HrDocument-edit','HrDocument-delete'])
                                <th>{{trans('lang.edit')}}</th>
                                @endcanany

                            </tr>
                            </thead>



                        </table>
                    </div>


                    <div id="formDialog" style="display: none;" class="card-body">
                        <h4 class="mt-0 header-title" id="titleheadar"> :</h4>



                        <div class="row">
                            <div class="col-lg-10">
                                <span id="form_result"></span>
                                <form  class="form-horizontal row-fluid" id="sample_form" method="post"  enctype="multipart/form-data">
                                    @csrf

                                    <input type="hidden" name="id" id="id" value="0" />



                                    <div class="form-group row">

                                        <label class="col-sm-2 col-form-label text-right" for="basicinput"> {{trans('lang.enname')}}</label>

                                        <div class="col-sm-10">

                                            <input type="text" id="en_name" name="en_name"  placeholder="{{trans('lang.enname')}} ..." class="form-control">



                                        </div>

                                    </div>

                                    <div class="form-group row">

                                        <label class="col-sm-2 col-form-label text-right" for="basicinput"> {{trans('lang.arname')}}</label>

                                        <div class="col-sm-10">

                                            <input type="text" id="ar_name" name="ar_name"  placeholder="{{trans('lang.arname')}} ..." class="form-control">



                                        </div>

                                    </div>
                                    <div class="form-group row">

                                        <label class="col-sm-2 col-form-label text-right" for="basicinput"> {{trans('lang.expire_date')}}</label>

                                        <div class="col-sm-10">

                                            <input type="date" id="expire_date" name="expire_date" data-date-format="yyyy-mm-dd"  placeholder="" class="form-control">



                                        </div>

                                    </div>
                                    <div class="form-group row">

                                        <label class="col-sm-2 col-form-label text-right" for="basicinput"> {{trans('lang.file_path')}}</label>

                                        <div class="col-sm-10">

                                            <input type="file" id="file_path" name="file_path"  placeholder="" class="form-control">

                                            <span id="store_file"></span>

                                        </div>

                                    </div>



                                    <div class="form-group row">
                                        <input type="hidden" name="action" id="action" />
                                        <input type="hidden" name="hidden_id" id="hidden_id" />
                                        <div class="col-sm-10">

                                            <button type="submit" name="action_button" id="action_button" class="btn btn-primary" >{{ trans('lang.submit') }}</button>

                                            <button id="cancelForm" class="btn btn-danger">{{ trans('lang.back') }}</button>
                                        </div>

                                    </div>
                                </form>


                            </div></div></div>

                    <div id="confirmModal" class="modal fade" role="dialog">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                                    <h2 class="modal-title"></h2>
                                </div>
                                <div class="modal-body">
                                    <h4 align="center" style="margin:0;">{{ trans('lang.doyouwantdel') }}</h4>
                                </div>
                                <div class="modal-footer">
                                    <button type="button" name="ok_button" id="ok_button" class="btn btn-danger">{{ trans('lang.ok') }}</button>
                                    <button type="button" class="btn btn-default" data-dismiss="modal">{{ trans('lang.cancel') }}</button>
                                </div>
                            </div>
                        </div>
                    </div>


                </div>


            </div>
        </div> <!-- end col -->
    </div>

<script>

    $(document).ready(function(){
        // var table = $('#datatable-buttons').DataTable();
  //      $('#expire_date').datepicker();
        var table = $('#branch-table').DataTable({
            lengthChange: false,
            buttons: ['copy', 'excel', 'pdf', 'colvis'],
            processing: true,
            serverSide: true,
            ajax:{
                url: "{{ route('hr_documents') }}",
            },
            columns:[
                {
                    data: 'id',
                    name: 'id',
                    orderable: false
                },
                {
                    data: 'ar_name',
                    name: 'ar_name'
                },
                {
                    data: 'en_name',
                    name: 'en_name'
                },
                {
                    data: 'expire_date',
                    name: 'expire_date'
                },
                @canany(['HrDocument-edit','HrDocument-delete'])
                {
                    data: 'action',
                    name: 'action',
                    orderable: false
                }
                @endcanany
            ],
        });
        table.buttons().container()
            .appendTo('#datatable-buttons_wrapper .col-md-6:eq(0)');

        $('#row_callback').DataTable( {
            "createdRow": function ( row, data, index ) {
                if ( data[5].replace(/[\$,]/g, '') * 1 > 150000 ) {
                    $('td', row).eq(5).addClass('highlight');
                }
            }
        } );

        $('#create_record').click(function(){
            $('#titleheadar').text("{{ trans('lang.addhrdocs') }}");
            $('#action_button').val("Add");
            $('#action').val("Add");
            $('#formDialog').show();
            $('#viewtable').hide();
            document.getElementById('formDialog').style.display="block";
        });

        $('#sample_form').on('submit', function(event){
            event.preventDefault();
            if($('#action').val() == 'Add')
            {
                $.ajax({
                    url:"{{ route('hr_documents.store') }}",
                    method:"POST",
                    data: new FormData(this),
                    contentType: false,
                    cache:false,
                    processData: false,
                    dataType:"json",
                    success:function(data)
                    {
                        var html = '';
                        if(data.errors)
                        {
                            html = '<div class="alert alert-danger">';
                            for(var count = 0; count < data.errors.length; count++)
                            {
                                html += '<p>' + data.errors[count] + '</p>';
                            }
                            html += '</div>';
                            $('#form_result').html(html);
                        }
                        if(data.success)
                        {
                            html = '<div class="alert alert-success">' + data.success + '</div>';
                            $('#sample_form')[0].reset();
                            $('#store_file').html('');
                            $('#branch-table').DataTable().ajax.reload();
                            $('#form_result').html(html);
                            setTimeout(function () {
                                window.location.reload();
                            }, 1000);
                        }

                    }
                })
            }

            if($('#action').val() == "Edit")
            {
                $.ajax({
                    url:"{{ route('hr_documents.update') }}",
                    method:"POST",
                    data:new FormData(this),
                    contentType: false,
                    cache: false,
                    processData: false,
                    dataType:"json",
                    success:function(data)
                    {
                        var html = '';
                        if(data.errors)
                        {
                            html = '<div class="alert alert-danger">';
                            for(var count = 0; count < data.errors.length; count++)
                            {
                                html += '<p>' + data.errors[count] + '</p>';
                            }
                            html += '</div>';
                            $('#form_result').html(html);
                        }
                        if(data.success)
                        {
                            //  alert('ddd00');
                            html = '<div class="alert alert-success">' + data.success + '</div>';
                            $('#sample_form')[0].reset();

                            $('#branch-table').DataTable().ajax.reload();
                            $('#form_result').html(html);
                            setTimeout(function () {
                                window.location.reload();
                            }, 1000);
                        }
                    }
                });
            }
        });

        $(document).on('click', '.edit', function(){
            var id = $(this).attr('id');
            $('#titleheadar').text("{{ trans('lang.edithrdoc') }}");
            $('#form_result').html('');
            $.ajax({
                url:"hr_documents/"+id+"/edit",
                dataType:"json",
                success:function(html){
                    $('#en_name').val(html.data.en_name);
                    $('#ar_name').val(html.data.ar_name);
                    $('#expire_date').val(html.data.expire_date);
                    $('#hidden_id').val(html.data.id);
                    $('#store_file').html("<a target='_blank' href={{ URL::to('/') }}/files/hr_docs/" + html.data.file_path + ">"+ html.data.file_path + "</a>");
                    $('#store_file').append("<input type='hidden' name='hidden_file' value='"+html.data.file_path+"' />");
                    $('#action_button').val("Edit");
                    $('#action').val("Edit");
                    $('#formDialog').show();
                    $('#viewtable').hide();
                    document.getElementById('formDialog').style.display="block"
                }
            })
        });

        var user_id;

        $(document).on('click', '.delete', function(){
            user_id = $(this).attr('id');
            $('#confirmModal').modal('show');
        });

        $('#ok_button').click(function(){
            $.ajax({
                url:"hr_documents/destroy/"+user_id,
                beforeSend:function(){
                    $('#ok_button').text('{{ trans('lang.deleting') }}');
                },
                success:function(data)
                {
                    setTimeout(function(){
                        $('#confirmModal').modal('hide');
                        $('#branch-table').DataTable().ajax.reload();
                    }, 2000);
                }
            })
        });

    });

</script>
@endsection