@extends('layouts/gnr_layout')
@section('title', '| ' . $data['title'])
@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-default" style="background-color:#708090;">
                <div class="panel-heading" style="padding-bottom:0px">

                    <div class="panel-options">
                        <a href="{{ Route('monitoringLayerObjectConfig.create', $data['layer']->title) }}"
                            class="btn btn-info pull-right addViewBtn">
                            <i class="glyphicon glyphicon-plus-sign addIcon"></i>
                            {{ $data['addTitle'] }}
                        </a>
                    </div>

                    <h1 align="center" style="font-family: Antiqua;letter-spacing: 2px">
                        <font color="white">{{ $data['title'] }}</font>
                    </h1>
                </div>
                <div class="panel-body panelBodyView">
                    <table class="table table-striped table-bordered">
                        <thead>
                            <tr>
                                <th style='width: 80px;'>SN#</th>
                                <th>{{ $data['layer']->title }}</th>
                                <th>Code</th>
                                <th>Assigned Employee</th>
                                <th style='width: 120px'>Action</th>
                            </tr>
                        </thead>
                        <tbody>

                            @if ($data['layer_objects'])
                                @foreach ($data['layer_objects'] as $key => $layer_object)
                                    <tr>
                                        <td style='color: black'>{{ $key + 1 }}</td>
                                        <td style='color: black'>{{ $layer_object->title }}</td>
                                        <td style='color: black'>{{ $layer_object->code }}</td>
                                        <td style='color: black'>
                                            {{ $layer_object->employee ? $layer_object->employee->employee_name : 'None' }}
                                        </td>
                                        <td>
                                            <a
                                                href="{{ route('monitoringLayerObjectConfig.edit', ['param' => $data['layer']->title, 'id' => $layer_object->id]) }}">
                                                <i class="fa fa-pencil-square-o fa-lg" aria-hidden="true"></i>
                                            </a>
                                            &nbsp;
                                            @if ($layer_object::eligiableToAssign($layer_object->management_level_id))
                                                <a
                                                    href="{{ route('monitoringLayerObjectAssign.assignObjectForm', ['param' => $data['layer']->title, 'id' => $layer_object->id]) }}">
                                                    <i class="fa fa-eye fa-lg" aria-hidden="true"></i>
                                                </a>
                                            @endif
                                            &nbsp;
                                            @if ($layer_object::eligiableToDelete($layer_object->management_level_id, $layer_object->id))
                                                <a href="javascript:;" class="delete-modal"
                                                    itemIdValue="{{ $layer_object->id }}"><span
                                                        class="glyphicon glyphicon-trash"></span>
                                                    &nbsp;
                                            @endif
                                            <a
                                                href="{{ Route('monitoringLayerObjectWiseEmpAssign.create', $layer_object->id) }}">
                                                <i class="fas fa-tag fa-lg" aria-hidden="true"></i>
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach
                            @endif

                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div id="deleteModal" class="modal fade" style="margin-top:3%;">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title"
                        style="clear:both;background-color:black;color:white; padding:10px;text-align:center;">Delete
                        {{ $data['layer']->title }}
                    </h4>
                </div>
                <div class="modal-body ">
                    <div class="row" style="padding-bottom:20px;"> </div>

                    <h4>Are You Confirm to Delete This Record?</h4>

                    <div class="modal-footer">

                        <input id="itemId" type="hidden" name="" value="" />
                        <button type="button" class="btn btn-danger" id="confirmDelete"
                            data-dismiss="modal">Confirm</button>

                        <button type="button" class="btn btn-warning" data-dismiss="modal"><span
                                class="glyphicon glyphicon-remove" style="padding-right:4px;"></span>Close</button>

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

    <script type="text/javascript">
        $(document).ready(function() {

            $(document).on('click', '.delete-modal', function() {
                $("#itemId").val($(this).attr('itemIdValue'));
                $("#deleteModal").find('.modal-dialog').css('width', '30%');
                $('#deleteModal').modal('show');

            });

            $("#confirmDelete").on('click', function() {

                var itemId = $("#itemId").val();
                var csrf = "{{ csrf_token() }}";

                $.ajax({
                        url: './delete',
                        type: 'POST',
                        dataType: 'json',
                        data: {
                            id: itemId,
                            _token: csrf
                        },
                    })
                    .done(function(__response) {

                        if (__response.status == true) {
                            toastr.success(__response.message);
                        }

                        if (__response.status == false) {
                            toastr.error(__response.message);
                        }

                        setTimeout(function() {
                            location.reload();
                        }, 500);

                    })
                    .fail(function() {
                        alert("Something went wrong, try again");
                    });
            });
        });
    </script>

@endsection