@extends('layouts.app')
@section('title', 'سير عمل الاعتماد - DOTS HR Pro')

@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('approvals.workflows.create') }}" class="btn btn-primary"><i class="fas fa-plus"></i> إنشاء مسار جديد</a>
    </div>
</div>

<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-route"></i></div>
        <div class="stat-value">{{ $stats['total'] }}</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-circle"></i></div>
        <div class="stat-value">{{ $stats['active'] }}</div>
        <div class="stat-label">مسارات مفعّلة</div>
    </div>
    <div class="stat-card">
        <div class="stat-icon" style="background: var(--warning-light); color: var(--warning)"><i class="fas fa-clock"></i></div>
        <div class="stat-value">{{ $stats['pending'] }}</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-clipboard-check"></i></div>
        <div class="stat-value">{{ $stats['completed'] }}</div>
        <div class="stat-label">طلبات مكتملة</div>
    </div>
</div>

<div class="card">
    <div class="table-responsive">
        <table class="data-table">
            <thead>
                <tr>
                    <th>اسم المسار</th>
                    <th>النوع</th>
                    <th>عدد الخطوات</th>
                    <th>الطلبات النشطة</th>
                    <th>الحالة</th>
                    <th style="width:120px">إجراءات</th>
                </tr>
            </thead>
            <tbody>
                @forelse($workflows as $workflow)
                <tr>
                    <td>
                        <strong>{{ $workflow->name }}</strong>
                        @if($workflow->description)
                            <br><small style="color: var(--text-muted)">{{ Str::limit($workflow->description, 60) }}</small>
                        @endif
                    </td>
                    <td>{{ $workflow->type_label }}</td>
                    <td>{{ $workflow->steps_count }} خطوة</td>
                    <td>
                        @php $activeCount = $workflow->requests->whereIn('status', ['pending', 'in_progress'])->count(); @endphp
                        {{ $activeCount }}
                    </td>
                    <td>
                        <span class="status-badge {{ $workflow->is_active ? 'status-active' : 'status-draft' }}">
                            {{ $workflow->is_active ? 'مفعّل' : 'معطّل' }}
                        </span>
                    </td>
                    <td>
                        <div class="action-btns">
                            <a href="{{ route('approvals.workflows.edit', $workflow->id) }}" class="action-btn" title="تعديل"><i class="fas fa-edit"></i></a>
                            <form method="POST" action="{{ route('approvals.workflows.destroy', $workflow->id) }}" style="display:inline" onsubmit="return confirm('هل أنت متأكد من حذف هذا المسار؟')">
                                @csrf @method('DELETE')
                                <button type="submit" class="action-btn danger" title="حذف"><i class="fas fa-trash"></i></button>
                            </form>
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="6">
                        <div class="empty-state">
                            <i class="fas fa-route"></i>
                            <h3>لا توجد مسارات اعتماد</h3>
                            <p>ابدأ بإنشاء مسار اعتماد لتنظيم عملية الموافقات</p>
                            <a href="{{ route('approvals.workflows.create') }}" class="btn btn-primary"><i class="fas fa-plus"></i> إنشاء مسار جديد</a>
                        </div>
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($workflows->hasPages())
    <div class="pagination-wrap">{{ $workflows->withQueryString()->links() }}</div>
    @endif
</div>
@endsection