@extends('adminlte::page')

@section('title', 'Event Logs')

@section('content_header')
@stop

@section('content')
    <div class="row">
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-header with-border">
                    <h3 class="box-title">
                        <i class="fa fa-calendar"></i> Event Logs for
                        <strong>{{ $member->member_name }}</strong> (#{{ $member->member_id }})
                    </h3>
                </div>
                <div class="box-body">
                    <a href="{{ route('members.index_v2') }}" class="btn btn-warning btn-sm">
                        <i class="fa fa-arrow-left"></i> Back to Members
                    </a>
                    <span class="pull-right text-muted">Total events: {{ $grouped->count() }} | Total logs: {{ $grouped->flatten()->count() }}</span>
                    <br><br>

                    <div id="event-alert" style="display:none;"></div>

                    @if($grouped->count() == 0)
                        <div class="alert alert-info">No event logs found for this member.</div>
                    @else
                        @foreach($grouped as $eventName => $logs)
                            <div class="box box-default" id="event-box-{{ md5($eventName) }}">
                                <div class="box-header with-border">
                                    <h4 class="box-title">
                                        <i class="fa fa-flag text-blue"></i>
                                        {{ $eventName }}
                                        <span class="label label-default">{{ $logs->count() }} reward(s)</span>
                                    </h4>
                                    <div class="box-tools pull-right">
                                        <button class="btn btn-danger btn-xs btn-delete-all-event"
                                                data-event="{{ $eventName }}">
                                            <i class="fa fa-trash"></i> Delete All
                                        </button>
                                        <button type="button" class="btn btn-box-tool btn-toggle-box">
                                            <i class="fa fa-minus"></i>
                                        </button>
                                    </div>
                                </div>
                                <div class="box-body">
                                    <table class="table table-bordered table-condensed table-striped">
                                        <thead>
                                            <tr>
                                                <th style="width:60px">ID</th>
                                                <th style="width:60px">Pivot</th>
                                                <th>Data</th>
                                                <th style="width:100px">Action</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            @foreach($logs as $log)
                                                <tr id="log-row-{{ $log->id }}">
                                                    <td>{{ $log->id }}</td>
                                                    <td>{{ $log->pivot_number }}</td>
                                                    <td>
                                                        @if($log->data)
                                                            @php
                                                                $parsed = json_decode(stripslashes($log->data), true);
                                                            @endphp
                                                            @if($parsed && isset($parsed['reward']))
                                                                @if(isset($parsed['reward']['items']))
                                                                    <small><strong>Items:</strong>
                                                                    @foreach($parsed['reward']['items'] as $itemId => $qty)
                                                                        {{ $itemId }}x{{ $qty }}@if(!$loop->last), @endif
                                                                    @endforeach
                                                                    </small><br>
                                                                @endif
                                                                @if(isset($parsed['reward']['gems']))
                                                                    <small><strong>Gems:</strong>
                                                                    @foreach($parsed['reward']['gems'] as $gemName => $val)
                                                                        {{ $gemName }}: {{ number_format($val) }}@if(!$loop->last), @endif
                                                                    @endforeach
                                                                    </small><br>
                                                                @endif
                                                                @if(isset($parsed['reward']['hero']))
                                                                    <small><strong>Heroes:</strong> {{ implode(', ', $parsed['reward']['hero']) }}</small><br>
                                                                @endif
                                                            @else
                                                                <small class="text-muted" style="word-break:break-all;">{{ substr($log->data, 0, 200) }}</small>
                                                            @endif
                                                        @else
                                                            <span class="text-muted">-</span>
                                                        @endif
                                                    </td>
                                                    <td>
                                                        <button class="btn btn-danger btn-xs btn-delete-log" data-log-id="{{ $log->id }}">
                                                            <i class="fa fa-trash"></i> Delete
                                                        </button>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        @endforeach
                    @endif
                </div>
            </div>
        </div>
    </div>
@stop

@section('js')
    <script type="text/javascript">
        function showAlert(type, message) {
            $('#event-alert').html('<div class="alert alert-' + type + ' alert-dismissible">' +
                '<button type="button" class="close" data-dismiss="alert">&times;</button>' +
                message + '</div>').show();
        }

        // Toggle collapse
        $(document).on('click', '.btn-toggle-box', function (e) {
            e.stopPropagation();
            var body = $(this).closest('.box').find('.box-body');
            var icon = $(this).find('i');
            body.slideToggle(200);
            icon.toggleClass('fa-minus fa-plus');
        });

        // Delete single log
        $(document).on('click', '.btn-delete-log', function () {
            var logId = $(this).data('log-id');
            if (!confirm('Delete event log #' + logId + '?')) return;

            var btn = $(this);
            btn.prop('disabled', true);

            $.ajax({
                url: '{{ route("members.delete_event_log", $member->member_id) }}',
                type: 'POST',
                data: { _token: '{{ csrf_token() }}', log_id: logId },
                dataType: 'json',
                success: function (response) {
                    if (response.success) {
                        $('#log-row-' + logId).fadeOut(300, function () { $(this).remove(); });
                        showAlert('success', '<i class="fa fa-check"></i> ' + response.message);
                    } else {
                        showAlert('danger', response.message);
                        btn.prop('disabled', false);
                    }
                },
                error: function () {
                    showAlert('danger', 'Error connecting to server');
                    btn.prop('disabled', false);
                }
            });
        });

        // Delete all logs for an event
        $(document).on('click', '.btn-delete-all-event', function (e) {
            e.stopPropagation();
            var eventName = $(this).data('event');
            if (!confirm('Delete ALL logs for "' + eventName + '" for this member?')) return;

            var btn = $(this);
            btn.prop('disabled', true);

            $.ajax({
                url: '{{ route("members.delete_event_log_by_event", $member->member_id) }}',
                type: 'POST',
                data: { _token: '{{ csrf_token() }}', event_name: eventName },
                dataType: 'json',
                success: function (response) {
                    if (response.success) {
                        btn.closest('.box').fadeOut(300, function () { $(this).remove(); });
                        showAlert('success', '<i class="fa fa-check"></i> ' + response.message);
                    } else {
                        showAlert('danger', response.message);
                        btn.prop('disabled', false);
                    }
                },
                error: function () {
                    showAlert('danger', 'Error connecting to server');
                    btn.prop('disabled', false);
                }
            });
        });
    </script>
@endsection