@extends('layouts.app')
@section('title', $device->name . ' - DOTS HR Pro')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">{{ $device->name }}</h1>
        <p class="page-subtitle">تفاصيل جهاز البصمة</p>
    </div>
    <div class="page-actions">
        <a href="{{ route('biometric.devices') }}" class="btn btn-ghost"><i class="fas fa-arrow-right"></i> رجوع</a>
    </div>
</div>

<div class="card" style="margin-bottom:20px">
    <div class="card-header">
        <h3 class="card-title">بيانات الجهاز</h3>
    </div>
    <div class="card-body">
        <form method="POST" action="{{ route('biometric.device.update', $device) }}">
            @csrf @method('PUT')
            <div class="detail-grid">
                <div class="detail-item">
                    <span class="detail-label">كود الجهاز</span>
                    <span class="detail-value"><input type="text" name="device_code" value="{{ $device->device_code }}" class="form-input"></span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">اسم الجهاز</span>
                    <span class="detail-value"><input type="text" name="name" value="{{ $device->name }}" class="form-input" required></span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">الماركة</span>
                    <span class="detail-value"><input type="text" name="brand" value="{{ $device->brand }}" class="form-input"></span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">الموديل</span>
                    <span class="detail-value"><input type="text" name="model" value="{{ $device->model }}" class="form-input"></span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">عنوان IP</span>
                    <span class="detail-value"><input type="text" name="ip_address" value="{{ $device->ip_address }}" class="form-input"></span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">الحالة</span>
                    <span class="detail-value">
                        <select name="status" class="form-select">
                            <option value="active" {{ $device->status === 'active' ? 'selected' : '' }}>نشط</option>
                            <option value="inactive" {{ $device->status === 'inactive' ? 'selected' : '' }}>غير نشط</option>
                            <option value="maintenance" {{ $device->status === 'maintenance' ? 'selected' : '' }}>صيانة</option>
                        </select>
                    </span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">آخر مزامنة</span>
                    <span class="detail-value">{{ $device->last_sync_at ? $device->last_sync_at->format('Y/m/d H:i') : 'لم تتم بعد' }}</span>
                </div>
                <div class="detail-item">
                    <span class="detail-label">إجمالي المزامنة</span>
                    <span class="detail-value">{{ number_format($device->total_synced) }} سجل</span>
                </div>
            </div>
            <div class="form-actions" style="margin-top:16px">
                <button type="submit" class="btn btn-primary"><i class="fas fa-save"></i> حفظ التعديلات</button>
            </div>
        </form>
    </div>
</div>

<div class="card">
    <div class="card-header">
        <h3 class="card-title">آخر السجلات</h3>
    </div>
    <div class="table-responsive">
        <table class="data-table">
            <thead>
                <tr><th>رقم الموظف</th><th>الموظف</th><th>التاريخ</th><th>الوقت</th><th>النوع</th><th>الحالة</th></tr>
            </thead>
            <tbody>
                @forelse($logs as $log)
                <tr>
                    <td><span class="code-badge">{{ $log->employee_code }}</span></td>
                    <td>{{ $log->employee?->full_name ?? '—' }}</td>
                    <td>{{ $log->log_date->format('Y/m/d') }}</td>
                    <td>{{ $log->log_time }}</td>
                    <td>{{ $log->log_type_label }}</td>
                    <td><span class="status-badge {{ $log->sync_status === 'synced' ? 'status-active' : 'status-pending' }}">{{ $log->sync_status_label }}</span></td>
                </tr>
                @empty
                <tr><td colspan="6"><div class="empty-state-sm">لا توجد سجلات</div></td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($logs->hasPages())
        <div class="pagination-wrap">{{ $logs->withQueryString()->links() }}</div>
    @endif
</div>
@endsection