@extends('layouts.dashboard')


@section('title-content')

    <title>{{ config('app.name') }} | Audits Index</title>

@endsection

@section('content')
    <div class="content">
        <div class="boxpane">
            <div class="boxpane-header">
                <h2 class="blue"><i class="fa-fw fa fa-dashboard"></i>
                    Audits Dashboard
                </h2>

                <div class="boxpane-icon">
                    <ul class="btn-tasks">
                        <li class="dropdown">
                            <a data-toggle="dropdown" href="#">
                                <i class="icon fa fa-tasks" data-placement="left" title="{{ 'Actions' }}"></i>
                            </a>

                        </li>
                    </ul>
                </div>
            </div>
            <div class="boxpane-content">
                <div class="row">
                    <div class="col-md-12">
                        <p class="introtext">

                            AUDIT Summary
                        </p>
                        <div class="row">
                            <div class="col-md-12">
                                <div class="table-responsive">
                                    <table class="table">
                                        <thead class="thead-dark">
                                            <tr>
                                                <th scope="col">Model</th>
                                                <th scope="col">Action</th>
                                                <th scope="col">User</th>
                                                <th scope="col">Time</th>
                                                <th scope="col">Old Values</th>
                                                <th scope="col">New Values</th>
                                            </tr>
                                        </thead>
                                        <tbody id="audits">
                                            @foreach ($audits as $audit)
                                                <tr>
                                                    <td>{{ $audit->auditable_type }} (id: {{ $audit->auditable_id }})</td>
                                                    <td>{{ $audit->event }}</td>
                                                    <td>{{ $audit->user->last_name . ' ' . $audit->user->first_name . ' ' . $audit->user->middle_name }}
                                                    </td>
                                                    <td>{{ $audit->created_at }}</td>
                                                    <td>
                                                        <table class="table">
                                                            @foreach ($audit->old_values as $attribute => $value)
                                                                <tr>
                                                                    <td><b>{{ $attribute }}</b></td>
                                                                    <td>{{ $value }}</td>
                                                                </tr>
                                                            @endforeach
                                                        </table>
                                                    </td>
                                                    <td>
                                                        <table class="table">
                                                            @foreach ($audit->new_values as $attribute => $value)
                                                                <tr>
                                                                    <td><b>{{ $attribute }}</b></td>
                                                                    <td>{{ $value }}</td>
                                                                </tr>
                                                            @endforeach
                                                        </table>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('scripts')
    <script src="{{ asset('assets/dashboard/js/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('assets/dashboard/js/dataTables.bootstrap4.min.js') }}"></script>
    <!-- X-editable Plugin -->
    <script src="{{ asset('assets/plugins/moment/moment.js') }}"></script>
    <script type="text/javascript"
        src="{{ asset('assets/plugins/x-editable/bootstrap3-editable/js/bootstrap-editable.min.js') }}"></script>


    <script type="text/javascript">
        $('#index_type').select2({
            minimumResultsForSearch: -1,
            placeholder: 'Select Level Index',
        });
        $('#srs,#sps,#acs,#dvs,#ras,#gender,#program').select2({
            minimumResultsForSearch: -1,
            // placeholder: 'Select SRS',
        });
        $(document).ready(function() {
            let admTable = $('#admTable').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    url: '{{ route('audits.get-audits') }}',
                    data: function(d) {
                        // d.index_type  = $('select[name=index_type]').val();
                        // d.index_no = $('input[name=index_no]').val();
                        // d.surname  = $('input[name=surname]').val();
                        // d.gender   = $('input[name=gender]').val();
                        // d.All      = $('select[name=All]').val();
                        // d.program = $('select[name=program]').val();

                    }
                },
                columns: [{
                        data: 'DT_RowIndex',
                        name: 'id'
                    },
                    {
                        data: 'auditable_type',
                        name: 'auditable_type'
                    },
                    {
                        data: 'event',
                        name: 'event'
                    },
                    {
                        data: 'name',
                        name: 'name'
                    },
                    {
                        data: 'created_at',
                        name: 'created_at'
                    },
                    {
                        data: 'old_values',
                        name: 'old_values'
                    },
                    {
                        data: 'new_values',
                        name: 'new_values'
                    },

                ]
            });
            $('#filter-form').on('submit', function(e) {
                admTable.draw();
                e.preventDefault();
            });
        })