@extends('layouts.app')
@section('title', 'تكامل المنصات الحكومية')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">تكامل المنصات الحكومية</h1>
        <p class="page-subtitle">إدارة التكامل مع الأنظمة الحكومية السعودية</p>
    </div>
    <div class="page-actions">
        <a href="{{ route('gov-api.logs') }}" class="btn btn-secondary"><i class="fas fa-history"></i> سجل العمليات</a>
    </div>
</div>

@if(session('success'))
    <div class="alert alert-success">{{ session('success') }}</div>
@endif
@if(session('error'))
    <div class="alert alert-danger">{{ session('error') }}</div>
@endif

<!-- Stats -->
<div class="stats-grid cols-4">
    <div class="stat-card">
        <div class="stat-icon" style="background: var(--primary-light); color: var(--primary);"><i class="fas fa-plug"></i></div>
        <div class="stat-value">{{ $stats['active_platforms'] }}</div>
        <div class="stat-label">منصات مفعّلة</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background: #e3f2fd; color: #1565c0;"><i class="fas fa-exchange-alt"></i></div>
        <div class="stat-value">{{ $stats['total_calls'] }}</div>
        <div class="stat-label">إجمالي العمليات</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background: var(--success-light); color: var(--success);"><i class="fas fa-check"></i></div>
        <div class="stat-value">{{ $stats['success_calls'] }}</div>
        <div class="stat-label">عمليات ناجحة</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background: var(--danger-light); color: var(--danger);"><i class="fas fa-times"></i></div>
        <div class="stat-value">{{ $stats['failed_calls'] }}</div>
        <div class="stat-label">عمليات فاشلة</div>
    </div>
</div>

<!-- Platforms Grid -->
<div style="display:grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap:1.5rem; margin-top:1.5rem;">
    @foreach($platforms as $key => $platform)
    @php $config = $configs[$key] ?? null; @endphp
    <div class="card" style="display:flex; flex-direction:column;">
        <div class="card-body" style="flex:1;">
            <div style="display:flex; align-items:center; gap:1rem; margin-bottom:1rem;">
                <div style="width:56px; height:56px; border-radius:var(--radius-lg); background:{{ $platform['color'] }}15; color:{{ $platform['color'] }}; display:flex; align-items:center; justify-content:center; font-size:1.5rem;">
                    <i class="fas {{ $platform['icon'] }}"></i>
                </div>
                <div style="flex:1;">
                    <h3 style="margin:0; font-size:1.1rem;">{{ $platform['name'] }}</h3>
                    <div style="display:flex; align-items:center; gap:0.5rem; margin-top:0.25rem;">
                        @if($config && $config->is_active)
                            <span class="status-badge status-active">مفعّل</span>
                            @if($config->sandbox_mode)
                                <span class="status-badge status-pending">تجريبي</span>
                            @endif
                        @else
                            <span class="status-badge status-expired">غير مفعّل</span>
                        @endif
                    </div>
                </div>
            </div>
            <p style="color:var(--text-secondary); font-size:0.9rem; margin-bottom:1rem;">{{ $platform['description'] }}</p>

            @if($config && $config->last_sync_at)
            <p style="font-size:0.8rem; color:var(--text-muted);">
                <i class="fas fa-clock"></i> آخر مزامنة: {{ $config->last_sync_at->diffForHumans() }}
            </p>
            @endif
        </div>
        <div style="padding:0 1.25rem 1.25rem; display:flex; gap:0.5rem;">
            <a href="{{ route('gov-api.settings', $key) }}" class="btn btn-primary" style="flex:1;"><i class="fas fa-cog"></i> الإعدادات</a>
            @if($config && $config->is_active)
            <form method="POST" action="{{ route('gov-api.test', $key) }}" style="flex:0;">
                @csrf
                <button type="submit" class="btn btn-secondary"><i class="fas fa-plug"></i> اختبار</button>
            </form>
            @endif
        </div>
    </div>
    @endforeach
</div>

<!-- Recent Activity -->
@if($recentLogs->isNotEmpty())
<div class="card" style="margin-top:1.5rem;">
    <div class="card-header">
        <h3 class="card-title">آخر العمليات</h3>
        <a href="{{ route('gov-api.logs') }}" style="font-size:0.85rem;">عرض الكل</a>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="data-table">
                <thead><tr><th>المنصة</th><th>الإجراء</th><th>الحالة</th><th>الوقت</th><th>التاريخ</th></tr></thead>
                <tbody>
                @foreach($recentLogs as $log)
                <tr>
                    <td>{{ $log->platform_label }}</td>
                    <td>{{ $log->action }}</td>
                    <td>
                        @if($log->status === 'success')
                            <span class="status-badge status-active">ناجح</span>
                        @elseif($log->status === 'failed')
                            <span class="status-badge status-danger">فاشل</span>
                        @else
                            <span class="status-badge status-pending">قيد التنفيذ</span>
                        @endif
                    </td>
                    <td>{{ $log->response_time ? $log->response_time . 's' : '—' }}</td>
                    <td style="font-size:0.85rem; color:var(--text-muted);">{{ $log->created_at->diffForHumans() }}</td>
                </tr>
                @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
@endif
@endsection