@extends('layout.app')

@section('title', 'Cron Job Monitor - Sistem Manajemen ISP')

@section('content')
<x-material-page-header 
    title="Cron Job Monitor" 
    subtitle="Monitor dan kelola Laravel Scheduler"
    :breadcrumbs="[
        ['name' => 'Pengaturan', 'url' => route('pengaturan.dashboard')],
        ['name' => 'Cron Monitor']
    ]"
>
    <button class="btn btn-sm bg-gradient-secondary mb-0 me-2" onclick="refreshStatus()">
        <i class="material-symbols-rounded" style="font-size: 16px; vertical-align: middle;">refresh</i> Refresh
    </button>
    <button class="btn btn-sm bg-gradient-primary mb-0" onclick="testScheduler()">
        <i class="material-symbols-rounded" style="font-size: 16px; vertical-align: middle;">play_arrow</i> Test Run
    </button>
</x-material-page-header>

<div class="container-fluid py-4">
    
    <!-- Status Cards -->
    <div class="row">
        <!-- Cron Job Status -->
        <x-material-card-stat 
            title="Cron Job Status" 
            :value="$cronStatus['installed'] ? '<span class=\"text-success\"><i class=\"material-symbols-rounded\" style=\"font-size: 20px; vertical-align: middle;\">check_circle</i> Installed</span>' : '<span class=\"text-danger\"><i class=\"material-symbols-rounded\" style=\"font-size: 20px; vertical-align: middle;\">cancel</i> Not Installed</span>'" 
            icon="schedule" 
            color="success" 
            growth="0" 
            growthColor="info" 
            :period="$cronStatus['message']"
            :rawValue="true"
        />

        <!-- Auto Isolir Status -->
        <x-material-card-stat 
            title="Auto Isolir" 
            :value="$autoIsolirSettings['enabled'] ? '<span class=\"text-success\"><i class=\"material-symbols-rounded\" style=\"font-size: 20px; vertical-align: middle;\">toggle_on</i> Enabled</span>' : '<span class=\"text-warning\"><i class=\"material-symbols-rounded\" style=\"font-size: 20px; vertical-align: middle;\">toggle_off</i> Disabled</span>'" 
            icon="block" 
            color="warning" 
            growth="0" 
            growthColor="warning" 
            :period="'Schedule: ' . $autoIsolirSettings['schedule_time'] . ' WIB'"
            :rawValue="true"
        />

        <!-- Last Run -->
        <x-material-card-stat 
            title="Last Run" 
            :value="$lastRun ? \Carbon\Carbon::parse($lastRun)->format('d/m/Y H:i') : 'Never'" 
            icon="history" 
            color="info" 
            growth="0" 
            growthColor="info" 
            period="Last scheduler execution"
        />
                            <span class="h2 font-weight-bold mb-0">
                                {{ $autoIsolirSettings['last_run_count'] ?? 0 }}
                            </span>
                        </div>
                        <div class="col-auto">
                            <div class="icon icon-shape bg-gradient-info text-white rounded-circle shadow">
                                <i class="material-symbols-rounded opacity-10">people</i>
                            </div>
                        </div>
                    </div>
                    <p class="mt-3 mb-0 text-muted text-sm">
                        <small>{{ $autoIsolirSettings['last_run'] ?? 'Never' }}</small>
                    </p>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <!-- Scheduled Tasks -->
        <div class="col-lg-6">
            <div class="card my-4">
                <div class="card-header pb-0 pt-3">
                    <h6 class="mb-0"><i class="material-symbols-rounded text-primary me-2" style="font-size: 20px; vertical-align: middle;">calendar_month</i> Scheduled Tasks</h6>
                </div>
                <div class="card-body">
                    @if(count($scheduledTasks) > 0)
                        <div class="table-responsive">
                            <table class="table table-sm table-hover">
                                <thead>
                                    <tr>
                                        <th>Schedule</th>
                                        <th>Command</th>
                                        <th>Next Run</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($scheduledTasks as $task)
                                        <tr>
                                            <td><code>{{ $task['schedule'] }}</code></td>
                                            <td><small>{{ $task['command'] }}</small></td>
                                            <td><small class="text-muted">{{ $task['next_run'] }}</small></td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @else
                        <div class="text-center py-4">
                            <i class="material-symbols-rounded" style="font-size: 48px; color: #6c757d; margin-bottom: 1rem;">event_busy</i>
                            <p class="text-muted">No scheduled tasks found</p>
                        </div>
                    @endif
                </div>
            </div>
        </div>

        <!-- Setup Instructions -->
        <div class="col-lg-6">
            <div class="card my-4">
                <div class="card-header pb-0 pt-3">
                    <h6 class="mb-0"><i class="material-symbols-rounded text-info me-2" style="font-size: 20px; vertical-align: middle;">terminal</i> Setup Instructions</h6>
                </div>
                <div class="card-body pt-0">
                    @if(!$cronStatus['installed'])
                        <div class="alert alert-warning text-white">
                            <strong><i class="material-symbols-rounded me-2" style="font-size: 20px; vertical-align: middle;">warning</i> Cron Job Belum Terinstall!</strong>
                            <p class="mb-0">Follow langkah-langkah di bawah untuk menginstall.</p>
                        </div>
                    @endif

                    @if(PHP_OS_FAMILY === 'Windows')
                        <h4 class="text-sm mb-3"><i class="fab fa-windows"></i> Windows - Task Scheduler</h4>
                        <ol class="text-sm">
                            <li>Buka Task Scheduler (<code>taskschd.msc</code>)</li>
                            <li>Create Basic Task → Name: "Laravel Scheduler"</li>
                            <li>Trigger: Daily, repeat every 1 minute</li>
                            <li>Action: Start a program</li>
                            <li>Program: <code>C:\laragon\bin\php\php.exe</code></li>
                            <li>Arguments: <code>artisan schedule:run</code></li>
                            <li>Start in: <code>{{ base_path() }}</code></li>
                        </ol>
                    @else
                        <h4 class="text-sm mb-3"><i class="fab fa-linux"></i> Linux - Crontab</h4>
                        <p class="text-sm">Jalankan command berikut di SSH:</p>
                        
                        <div class="bg-secondary text-white p-3 rounded mb-3">
                            <code style="color: #fff;">
                                crontab -e
                            </code>
                        </div>

                        <p class="text-sm">Tambahkan baris ini:</p>
                        <div class="bg-secondary text-white p-3 rounded mb-3 position-relative">
                            <code style="color: #fff; font-size: 11px;">
                                * * * * * cd {{ base_path() }} && php artisan schedule:run >> /dev/null 2>&1
                            </code>
                            <button class="btn btn-sm bg-gradient-light mb-0 position-absolute" 
                                    style="top: 10px; right: 10px;"
                                    onclick="copyCronCommand()"
                                    title="Copy">
                                <i class="material-symbols-rounded" style="font-size: 16px; vertical-align: middle;">content_copy</i>
                            </button>
                        </div>

                        <div class="alert alert-info text-white">
                            <strong><i class="material-symbols-rounded me-2" style="font-size: 20px; vertical-align: middle;">lightbulb</i> Quick Setup:</strong>
                            <p class="mb-2">Upload file <code>setup-cron.sh</code> ke server, lalu jalankan:</p>
                            <code>chmod +x setup-cron.sh && ./setup-cron.sh</code>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>

    <!-- Recent Logs -->
    <div class="row mt-4">
        <div class="col-12">
            <div class="card my-4">
                <div class="card-header pb-0 pt-3">
                    <div class="row align-items-center">
                        <div class="col">
                            <h6 class="mb-0"><i class="material-symbols-rounded text-success me-2" style="font-size: 20px; vertical-align: middle;">description</i> Recent Logs</h6>
                        </div>
                        <div class="col text-end">
                            <button class="btn btn-sm bg-gradient-primary mb-0" onclick="refreshLogs()">
                                <i class="material-symbols-rounded" style="font-size: 16px; vertical-align: middle;">refresh</i> Refresh
                            </button>
                        </div>
                    </div>
                </div>
                <div class="card-body p-0">
                    <div class="bg-dark text-white p-4" style="max-height: 400px; overflow-y: auto; font-family: monospace; font-size: 12px;" id="logContainer">
                        @if(count($recentLogs) > 0)
                            @foreach($recentLogs as $log)
                                <div>{{ $log }}</div>
                            @endforeach
                        @else
                            <div class="text-muted">No logs available</div>
                        @endif
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Quick Commands -->
    <div class="row mt-4">
        <div class="col-12">
            <div class="card my-4">
                <div class="card-header pb-0 pt-3">
                    <h6 class="mb-0"><i class="material-symbols-rounded text-warning me-2" style="font-size: 20px; vertical-align: middle;">terminal</i> Quick Commands</h6>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col-md-6">
                            <h5 class="text-sm">Artisan Commands:</h5>
                            <ul class="list-unstyled text-sm">
                                <li><code>php artisan cron:status</code> - Check status</li>
                                <li><code>php artisan cron:status --check</code> - Check cron installation</li>
                                <li><code>php artisan cron:status --test</code> - Test scheduler</li>
                                <li><code>php artisan schedule:list</code> - List tasks</li>
                                <li><code>php artisan pelanggan:auto-isolir --dry-run</code> - Test auto-isolir</li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            <h5 class="text-sm">Shell Scripts:</h5>
                            <ul class="list-unstyled text-sm">
                                <li><code>./setup-cron.sh</code> - Setup cron job automatically</li>
                                <li><code>./monitor-cron.sh</code> - Monitor cron status</li>
                                <li><code>./monitor-cron.sh --full</code> - Full status report</li>
                                <li><code>crontab -l</code> - View crontab</li>
                                <li><code>crontab -e</code> - Edit crontab</li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

@push('scripts')
<script>
// Copy cron command to clipboard
function copyCronCommand() {
    const command = "* * * * * cd {{ base_path() }} && php artisan schedule:run >> /dev/null 2>&1";
    navigator.clipboard.writeText(command).then(() => {
        toastr.success('Command copied to clipboard!');
    });
}

// Refresh status
function refreshStatus() {
    $.ajax({
        url: '{{ route("pengaturan.cron-monitor.status") }}',
        method: 'GET',
        success: function(response) {
            if (response.success) {
                location.reload();
            }
        },
        error: function() {
            toastr.error('Failed to refresh status');
        }
    });
}

// Test scheduler
function testScheduler() {
    const btn = event.target.closest('button');
    const originalHtml = btn.innerHTML;
    btn.innerHTML = '<i class="material-symbols-rounded me-2" style="font-size: 18px; vertical-align: middle; animation: spin 1s linear infinite;">sync</i> Running...';
    btn.disabled = true;

    $.ajax({
        url: '{{ route("pengaturan.cron-monitor.test") }}',
        method: 'POST',
        data: {
            _token: '{{ csrf_token() }}'
        },
        success: function(response) {
            if (response.success) {
                toastr.success(response.message);
                
                // Show output in modal or alert
                if (response.output) {
                    alert('Scheduler Output:\n\n' + response.output);
                }
            }
        },
        error: function(xhr) {
            toastr.error('Failed to run scheduler test');
        },
        complete: function() {
            btn.innerHTML = originalHtml;
            btn.disabled = false;
        }
    });
}

// Refresh logs
function refreshLogs() {
    location.reload();
}

// Auto refresh every 60 seconds
setInterval(function() {
    $.ajax({
        url: '{{ route("pengaturan.cron-monitor.status") }}',
        method: 'GET',
        success: function(response) {
            if (response.success) {
                $('#cronStatus').html(
                    response.cron_installed 
                        ? '<span class="text-success"><i class="material-symbols-rounded me-1" style="font-size: 18px; vertical-align: middle;">check_circle</i> Installed</span>'
                        : '<span class="text-danger"><i class="material-symbols-rounded me-1" style="font-size: 18px; vertical-align: middle;">cancel</i> Not Installed</span>'
                );
            }
        }
    });
}, 60000);
</script>
@endpush

@endsection