Commit 944501f1 authored by Mahmoud Aglan's avatar Mahmoud Aglan

Comprehensive mobile-first responsive overhaul of entire UI

- All 96 blade views optimized for mobile (touch targets, responsive
  grids, stacked layouts)
- Guest/login layout: respects branding CSS vars, touch-friendly inputs
- Sidebar: RTL-correct mobile slide-in with backdrop blur
- Topbar: compact mobile layout, overflow actions in user dropdown
- All list views: dual layout (desktop table + mobile cards)
- All forms: responsive padding, stacked submit buttons, 44px inputs
- Attendance: 4-col action grid on mobile for quick marking
- POS terminal: sticky bottom cart bar, radio card payment methods
- Dashboard/receptionist: 2x2 stat grids, large action cards
- app.css: safe-area utilities, print styles, touch min-heights
- Zero RTL violations (logical properties only: ms/me/ps/pe/start/end)
- Branding CSS vars respected throughout (--brand-primary etc.)
Co-Authored-By: 's avatarClaude Opus 4.6 <noreply@anthropic.com>
parent f00b5c97
......@@ -4,4 +4,44 @@
html {
direction: rtl;
}
/* Touch-friendly minimum heights */
input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]),
select,
textarea {
min-height: 44px;
}
/* Smooth scrolling */
html {
scroll-behavior: smooth;
-webkit-tap-highlight-color: transparent;
}
}
@layer utilities {
.safe-bottom {
padding-bottom: env(safe-area-inset-bottom, 0px);
}
.safe-top {
padding-top: env(safe-area-inset-top, 0px);
}
}
/* Print: hide all app chrome */
@media print {
aside, nav, header, .no-print, [data-topbar], .print\:hidden {
display: none !important;
}
main {
margin: 0 !important;
padding: 0 !important;
width: 100% !important;
}
body {
background: white !important;
}
.lg\:ms-64 {
margin-inline-start: 0 !important;
}
}
......@@ -127,7 +127,10 @@
};
@endphp
<aside dir="rtl" class="fixed top-0 start-0 h-screen w-64 flex flex-col z-40 overflow-hidden" style="background-color: var(--brand-sidebar-bg, #0f172a); color: var(--brand-sidebar-text, #e2e8f0);">
<aside dir="rtl"
:class="sidebarOpen ? 'translate-x-0' : 'translate-x-full lg:translate-x-0'"
class="fixed top-0 start-0 h-screen w-64 flex flex-col z-40 overflow-hidden transition-transform duration-300 ease-in-out lg:translate-x-0"
style="background-color: var(--brand-sidebar-bg, #0f172a); color: var(--brand-sidebar-text, #e2e8f0);">
{{-- Logo --}}
<div class="flex items-center justify-center h-16 border-b border-white/10 px-4 shrink-0">
@if(isset($brandLogoDark) && $brandLogoDark && isset($showLogoSidebar) && $showLogoSidebar)
......
<header class="sticky top-0 z-30 bg-white border-b border-gray-200">
<div class="flex items-center justify-between h-16 px-4 sm:px-6 lg:px-8">
<header class="sticky top-0 z-30 bg-white border-b border-gray-200 safe-top" data-topbar>
<div class="flex items-center justify-between h-14 sm:h-16 px-3 sm:px-6 lg:px-8">
<!-- Mobile menu button -->
<button @click="sidebarOpen = !sidebarOpen" class="lg:hidden text-gray-500 hover:text-gray-700">
<button @click="sidebarOpen = !sidebarOpen" class="lg:hidden p-2 -ms-2 text-gray-500 hover:text-gray-700 rounded-lg hover:bg-gray-100 transition-colors">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/></svg>
</button>
<!-- Academy name -->
<div class="flex items-center gap-2">
<h2 class="text-lg font-semibold text-gray-800">
<div class="flex items-center gap-2 min-w-0">
<h2 class="text-sm sm:text-lg font-semibold text-gray-800 truncate">
{{ app()->bound('current_academy') ? app('current_academy')->name_ar : 'الكابتن' }}
</h2>
</div>
<!-- Center: Global Search -->
<!-- Center: Global Search (hidden on mobile) -->
<div class="hidden md:block flex-1 max-w-md mx-4">
@livewire('global-search')
</div>
<!-- Right side -->
<div class="flex items-center gap-4">
<!-- Branch Switcher -->
@livewire('branch-switcher')
<!-- Right side: Desktop actions -->
<div class="flex items-center gap-2 sm:gap-4">
<!-- Branch Switcher (always visible — compact on mobile) -->
<div class="hidden sm:block">
@livewire('branch-switcher')
</div>
<!-- Notifications -->
<a href="{{ route('notifications.center') }}" class="relative text-gray-500 hover:text-gray-700">
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/></svg>
<!-- Notifications (icon only on mobile) -->
<a href="{{ route('notifications.center') }}" class="relative p-2 text-gray-500 hover:text-gray-700 rounded-lg hover:bg-gray-100 transition-colors">
<svg class="w-5 h-5 sm:w-6 sm:h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/></svg>
</a>
<!-- Language Switcher -->
@livewire('components.language-switcher')
<!-- Dark Mode -->
@livewire('components.dark-mode-toggle')
<!-- Desktop-only: Language + Dark Mode -->
<div class="hidden lg:flex items-center gap-2">
@livewire('components.language-switcher')
@livewire('components.dark-mode-toggle')
</div>
<!-- User Menu -->
<div x-data="{ open: false }" class="relative">
<button @click="open = !open" class="flex items-center gap-2 text-sm text-gray-700 hover:text-gray-900">
<span class="hidden sm:inline">{{ auth()->user()->name_ar ?? auth()->user()->name }}</span>
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
<button @click="open = !open" class="flex items-center gap-2 p-1.5 rounded-lg hover:bg-gray-100 transition-colors">
<div class="w-8 h-8 rounded-full flex items-center justify-center shrink-0" style="background-color: var(--brand-primary, #2563eb);">
<span class="text-xs font-medium text-white">{{ mb_substr(auth()->user()->name_ar ?? auth()->user()->name, 0, 1) }}</span>
</div>
<span class="hidden sm:inline text-sm text-gray-700 max-w-[100px] truncate">{{ auth()->user()->name_ar ?? auth()->user()->name }}</span>
<svg class="w-4 h-4 text-gray-400 hidden sm:block" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/></svg>
</button>
<div x-show="open" @click.outside="open = false" x-transition
class="absolute end-0 mt-2 w-48 bg-white rounded-lg shadow-lg border border-gray-200 z-50 py-1">
<a href="{{ route('profile') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-50">{{ __('الملف الشخصي') }}</a>
<a href="{{ route('profile.notifications') }}" class="block px-4 py-2 text-sm text-gray-700 hover:bg-gray-50">{{ __('تفضيلات الإشعارات') }}</a>
<form method="POST" action="{{ route('logout') }}">
@csrf
<button type="submit" class="w-full text-start px-4 py-2 text-sm text-red-600 hover:bg-red-50">{{ __('تسجيل الخروج') }}</button>
</form>
class="absolute end-0 mt-2 w-56 bg-white rounded-xl shadow-lg border border-gray-200 z-50 py-2">
<!-- Mobile-only items inside menu -->
<div class="sm:hidden px-4 py-2 border-b border-gray-100 mb-1">
@livewire('branch-switcher')
</div>
<div class="lg:hidden px-4 py-2 border-b border-gray-100 mb-1 flex items-center gap-3">
@livewire('components.language-switcher')
@livewire('components.dark-mode-toggle')
</div>
<a href="{{ route('profile') }}" class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50">
<svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"/></svg>
{{ __('الملف الشخصي') }}
</a>
<a href="{{ route('profile.notifications') }}" class="flex items-center gap-3 px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-50">
<svg class="w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/></svg>
{{ __('تفضيلات الإشعارات') }}
</a>
<div class="border-t border-gray-100 mt-1 pt-1">
<form method="POST" action="{{ route('logout') }}">
@csrf
<button type="submit" class="w-full flex items-center gap-3 px-4 py-2.5 text-sm text-red-600 hover:bg-red-50">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"/></svg>
{{ __('تسجيل الخروج') }}
</button>
</form>
</div>
</div>
</div>
</div>
......
......@@ -50,33 +50,34 @@
</style>
</head>
<body class="h-full bg-gray-50">
<div x-data="{ sidebarOpen: false }" class="min-h-full">
<div x-data="{ sidebarOpen: false }" class="min-h-full" @keydown.escape.window="sidebarOpen = false">
<!-- Mobile sidebar overlay -->
<div x-show="sidebarOpen" x-transition:enter="transition-opacity ease-linear duration-300"
<div x-show="sidebarOpen" x-cloak
x-transition:enter="transition-opacity ease-linear duration-300"
x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100"
x-transition:leave="transition-opacity ease-linear duration-300"
x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0"
class="fixed inset-0 z-30 bg-gray-600/75 lg:hidden" @click="sidebarOpen = false">
class="fixed inset-0 z-30 bg-gray-900/60 backdrop-blur-sm lg:hidden" @click="sidebarOpen = false">
</div>
<!-- Sidebar (sidebar.blade.php owns its own positioning) -->
<!-- Sidebar -->
@include('components.layouts.sidebar')
<!-- Main content area -->
<div class="lg:ms-64">
<div class="lg:ms-64 min-h-screen flex flex-col">
<!-- Topbar -->
@include('components.layouts.topbar')
<!-- Page content -->
<main class="p-4 sm:p-6 lg:p-8">
<main class="flex-1 p-3 sm:p-5 lg:p-8 pb-20 sm:pb-8">
<!-- Flash messages -->
@if(session('success'))
<div class="mb-4 rounded-md bg-green-50 p-4 border border-green-200">
<div class="mb-4 rounded-lg bg-green-50 p-3 sm:p-4 border border-green-200">
<p class="text-sm text-green-700">{{ session('success') }}</p>
</div>
@endif
@if(session('error'))
<div class="mb-4 rounded-md bg-red-50 p-4 border border-red-200">
<div class="mb-4 rounded-lg bg-red-50 p-3 sm:p-4 border border-red-200">
<p class="text-sm text-red-700">{{ session('error') }}</p>
</div>
@endif
......
@php
$branding = app(\App\Domain\Shared\Services\SettingsService::class);
$brandPrimary = $branding->get('branding.primary_color', '#2563eb');
$brandSecondary = $branding->get('branding.secondary_color', '#7c3aed');
$brandFontAr = $branding->get('branding.font_family_ar', 'Cairo');
$brandFontEn = $branding->get('branding.font_family_en', 'Inter');
$brandLogo = $branding->get('branding.logo');
@endphp
<!DOCTYPE html>
<html dir="rtl" lang="ar" class="h-full">
<head>
......@@ -5,16 +13,25 @@
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>{{ $title ?? 'تسجيل الدخول' }} - الكابتن</title>
@if($favicon = $branding->get('branding.favicon'))
<link rel="icon" href="{{ Storage::disk('public')->url($favicon) }}" type="image/png">
@endif
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family={{ urlencode($brandFontAr) }}:wght@300;400;500;600;700;800&family={{ urlencode($brandFontEn) }}:wght@300;400;500;600;700&display=swap" rel="stylesheet">
@vite(['resources/css/app.css', 'resources/js/app.js'])
@livewireStyles
<style>
body { font-family: 'Cairo', sans-serif; }
:root {
--brand-primary: {{ $brandPrimary }};
--brand-secondary: {{ $brandSecondary }};
}
body {
font-family: '{{ $brandFontAr }}', '{{ $brandFontEn }}', sans-serif;
}
</style>
</head>
<body class="h-full bg-gray-100">
<div class="min-h-full flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8">
<div class="min-h-full flex items-center justify-center py-6 sm:py-12 px-4 sm:px-6 lg:px-8 safe-top safe-bottom">
<div class="w-full max-w-md">
{{ $slot }}
</div>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل النشاط') : __('إضافة نشاط جديد') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل النشاط') : __('إضافة نشاط جديد') }}</h1>
<a href="{{ route('activities.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">{{ __('← العودة') }}</a>
</div>
......@@ -12,13 +12,13 @@
@endif
<form wire:submit="save" class="space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Name AR --}}
<div>
<label for="name_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم النشاط بالعربية') }} *</label>
<input type="text" id="name_ar" wire:model="name_ar"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name_ar') border-red-500 @enderror">
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name_ar') border-red-500 @enderror">
@error('name_ar') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -26,7 +26,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="name" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم النشاط بالإنجليزية') }} *</label>
<input type="text" id="name" wire:model="name" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name') border-red-500 @enderror">
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name') border-red-500 @enderror">
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -34,7 +34,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="slug" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المعرف (slug)') }}</label>
<input type="text" id="slug" wire:model="slug" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
placeholder="auto-generated">
<p class="mt-1 text-xs text-gray-400">{{ __('يُولّد تلقائيًا إن تُرك فارغًا') }}</p>
</div>
......@@ -43,7 +43,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="category" class="block text-sm font-medium text-gray-700 mb-1">{{ __('التصنيف') }} *</label>
<select id="category" wire:model="category"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('category') border-red-500 @enderror">
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('category') border-red-500 @enderror">
<option value="sport">{{ __('رياضة') }}</option>
<option value="art">{{ __('فنون') }}</option>
<option value="academic">{{ __('أكاديمي') }}</option>
......@@ -60,7 +60,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<input type="color" wire:model.live="color"
class="w-10 h-10 rounded border border-gray-300 cursor-pointer p-0.5">
<input type="text" wire:model.live="color" dir="ltr"
class="flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
class="flex-1 text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
placeholder="#3B82F6">
</div>
</div>
......@@ -69,28 +69,28 @@ class="flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="sort_order" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الترتيب') }}</label>
<input type="number" id="sort_order" wire:model="sort_order" min="0" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('sort_order') border-red-500 @enderror">
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('sort_order') border-red-500 @enderror">
@error('sort_order') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
{{-- Description AR --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="description_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الوصف بالعربية') }}</label>
<textarea id="description_ar" wire:model="description_ar" rows="2"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
</div>
{{-- Description EN --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="description" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الوصف بالإنجليزية') }}</label>
<textarea id="description" wire:model="description" rows="2" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
</div>
</div>
{{-- Is Active --}}
<div class="mt-4">
<label class="flex items-center gap-2 cursor-pointer">
<label class="min-h-[44px] flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="is_active"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ __('نشط') }}</span>
......@@ -99,14 +99,14 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
</div>
{{-- Actions --}}
<div class="flex items-center gap-4">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('activities.list') }}" wire:navigate
class="text-center px-4 sm:px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors text-sm font-medium">{{ __('إلغاء') }}</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
class="text-center px-4 sm:px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors text-sm">
<span wire:loading.remove wire:target="save">{{ $editing ? __('حفظ التعديلات') : __('إنشاء النشاط') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('activities.list') }}" wire:navigate
class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors">{{ __('إلغاء') }}</a>
</div>
</form>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('الأنشطة') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('الأنشطة') }}</h1>
@permission('participants.create')
<a href="{{ route('activities.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
{{-- Page Header --}}
<div class="flex items-center justify-between mb-6">
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<div>
<h1 class="text-2xl font-bold text-gray-800">{{ __('سجل النشاطات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('سجل النشاطات') }}</h1>
<p class="text-sm text-gray-500 mt-1">{{ __('متابعة جميع التغييرات والإجراءات في النظام') }}</p>
</div>
@if($search || $actionFilter || $dateFrom || $dateTo || $userFilter)
<button wire:click="resetFilters" class="inline-flex items-center gap-1.5 px-3 py-2 text-sm text-gray-600 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors">
<button wire:click="resetFilters" class="inline-flex items-center justify-center gap-1.5 px-3 py-2.5 w-full sm:w-auto text-sm text-gray-600 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/>
</svg>
......@@ -16,7 +16,7 @@
</div>
{{-- Filters --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-4">
{{-- Search --}}
<div class="sm:col-span-2 lg:col-span-2">
......@@ -76,6 +76,70 @@ class="w-full px-2 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{-- Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div wire:loading.class="opacity-50 pointer-events-none">
{{-- Mobile cards --}}
<div class="md:hidden divide-y divide-gray-100">
@forelse($logs as $log)
<div class="p-4 space-y-2">
<div class="flex items-center justify-between">
<div class="flex items-center gap-2">
<div class="w-7 h-7 rounded-full bg-gray-200 flex items-center justify-center shrink-0">
@if($log->user?->avatar_path)
<img src="{{ Storage::disk('public')->url($log->user->avatar_path) }}" alt="{{ $log->user->name_ar }}" class="w-7 h-7 rounded-full object-cover">
@else
<span class="text-[10px] font-bold text-gray-500">{{ mb_substr($log->user?->name_ar ?? $log->user?->name ?? '?', 0, 1) }}</span>
@endif
</div>
<span class="text-sm text-gray-800 truncate max-w-[120px]">{{ $log->user?->name_ar ?? $log->user?->name ?? __('نظام') }}</span>
</div>
@php
$actionConfig = [
'created' => ['color' => 'bg-green-100 text-green-700', 'label' => 'إنشاء'],
'updated' => ['color' => 'bg-yellow-100 text-yellow-700', 'label' => 'تعديل'],
'deleted' => ['color' => 'bg-red-100 text-red-700', 'label' => 'حذف'],
'restored' => ['color' => 'bg-purple-100 text-purple-700', 'label' => 'استعادة'],
];
$config = $actionConfig[$log->action] ?? ['color' => 'bg-gray-100 text-gray-700', 'label' => $log->action];
@endphp
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium {{ $config['color'] }}">{{ __($config['label']) }}</span>
</div>
<div class="flex items-center justify-between text-xs text-gray-500">
<span>{{ \App\Livewire\Admin\ActivityLog::translateEntityType($log->auditable_type) }} <span dir="ltr">#{{ $log->auditable_id }}</span></span>
<span>{{ $log->created_at->diffForHumans() }}</span>
</div>
<button wire:click="toggleExpand({{ $log->id }})"
class="w-full text-center py-2 text-xs font-medium rounded-md transition-colors
{{ $expandedRow === $log->id ? 'bg-blue-100 text-blue-700' : 'text-gray-500 hover:bg-gray-100 hover:text-gray-700' }}">
{{ $expandedRow === $log->id ? __('إخفاء التفاصيل') : __('عرض التفاصيل') }}
</button>
@if($expandedRow === $log->id)
<div class="mt-2 bg-slate-50 rounded-lg p-3 text-xs">
@if($log->action === 'updated' && $log->old_values && $log->new_values)
@foreach(array_slice(array_keys($log->new_values), 0, 5) as $key)
<div class="flex justify-between py-1 border-b border-gray-100 last:border-0">
<span class="text-gray-600">{{ $key }}</span>
<span class="text-green-600 truncate max-w-[120px]">{{ is_array($log->new_values[$key]) ? json_encode($log->new_values[$key], JSON_UNESCAPED_UNICODE) : Str::limit((string)$log->new_values[$key], 20) }}</span>
</div>
@endforeach
@elseif($log->action === 'created' && $log->new_values)
<span class="text-green-600">{{ implode(', ', array_slice(array_keys($log->new_values), 0, 5)) }}</span>
@elseif($log->action === 'deleted')
<span class="text-red-500">{{ __('تم حذف') }} {{ count($log->old_values ?? []) }} {{ __('حقل') }}</span>
@endif
@if($log->ip_address)
<div class="mt-2 pt-2 border-t border-gray-200 text-gray-400" dir="ltr">IP: {{ $log->ip_address }}</div>
@endif
</div>
@endif
</div>
@empty
<div class="p-8 text-center">
<p class="text-gray-500 text-sm">{{ __('لا توجد سجلات نشاط') }}</p>
</div>
@endforelse
</div>
{{-- Desktop table --}}
<div class="hidden md:block overflow-x-auto">
<table class="w-full text-sm">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
......@@ -383,6 +447,7 @@ class="px-3 py-1.5 rounded-md text-xs font-medium border transition-colors">
@endforelse
</tbody>
</table>
</div>
</div>
{{-- Pagination --}}
......
<div>
<!-- Header -->
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900">{{ __('لوحة المدير العام') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('لوحة المدير العام') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('نظرة عامة على جميع الأكاديميات') }}</p>
</div>
<!-- Stats Cards -->
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 mb-8">
<div class="grid grid-cols-2 lg:grid-cols-3 gap-3 sm:gap-4 mb-6 sm:mb-8">
<!-- Total Academies -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<div class="flex items-center gap-4">
<div class="flex-shrink-0 w-12 h-12 bg-blue-100 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 21V5a2 2 0 00-2-2H7a2 2 0 00-2 2v16m14 0h2m-2 0h-5m-9 0H3m2 0h5M9 7h1m-1 4h1m4-4h1m-1 4h1m-5 10v-5a1 1 0 011-1h2a1 1 0 011 1v5m-4 0h4"/></svg>
</div>
<div>
<p class="text-xs font-medium text-gray-500 uppercase">{{ __('إجمالي الأكاديميات') }}</p>
<p class="text-2xl font-bold text-gray-900" dir="ltr">{{ $totalAcademies }}</p>
<p class="text-xl sm:text-2xl font-bold text-gray-900" dir="ltr">{{ $totalAcademies }}</p>
</div>
</div>
</div>
<!-- Total Users -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<div class="flex items-center gap-4">
<div class="flex-shrink-0 w-12 h-12 bg-green-100 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4.354a4 4 0 110 5.292M15 21H3v-1a6 6 0 0112 0v1zm0 0h6v-1a6 6 0 00-9-5.197M13 7a4 4 0 11-8 0 4 4 0 018 0z"/></svg>
</div>
<div>
<p class="text-xs font-medium text-gray-500 uppercase">{{ __('إجمالي المستخدمين') }}</p>
<p class="text-2xl font-bold text-gray-900" dir="ltr">{{ $totalUsers }}</p>
<p class="text-xl sm:text-2xl font-bold text-gray-900" dir="ltr">{{ $totalUsers }}</p>
</div>
</div>
</div>
<!-- Average Users Per Academy -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<div class="flex items-center gap-4">
<div class="flex-shrink-0 w-12 h-12 bg-purple-100 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"/></svg>
</div>
<div>
<p class="text-xs font-medium text-gray-500 uppercase">{{ __('متوسط المستخدمين') }}</p>
<p class="text-2xl font-bold text-gray-900" dir="ltr">{{ $totalAcademies > 0 ? number_format($totalUsers / $totalAcademies, 1) : 0 }}</p>
<p class="text-xl sm:text-2xl font-bold text-gray-900" dir="ltr">{{ $totalAcademies > 0 ? number_format($totalUsers / $totalAcademies, 1) : 0 }}</p>
</div>
</div>
</div>
......@@ -49,8 +49,8 @@
<!-- Academies Table -->
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden">
<div class="px-6 py-4 border-b border-gray-200">
<h2 class="text-lg font-semibold text-gray-900">{{ __('الأكاديميات') }}</h2>
<div class="px-4 sm:px-6 py-3 sm:py-4 border-b border-gray-200">
<h2 class="text-base sm:text-lg font-semibold text-gray-900">{{ __('الأكاديميات') }}</h2>
</div>
@if($academies->isEmpty())
......@@ -59,7 +59,37 @@
<p class="mt-4 text-sm text-gray-500">{{ __('لا توجد أكاديميات مسجلة') }}</p>
</div>
@else
<div class="overflow-x-auto">
{{-- Mobile cards --}}
<div class="md:hidden divide-y divide-gray-100">
@foreach($academies as $academy)
<div class="p-4 space-y-2">
<div class="flex items-center justify-between">
<span class="text-sm font-medium text-gray-900">{{ $academy->name_ar ?? $academy->name }}</span>
@php
$statusBadge = match($academy->status) {
'active' => 'bg-green-100 text-green-800',
'inactive' => 'bg-gray-100 text-gray-800',
'suspended' => 'bg-red-100 text-red-800',
default => 'bg-gray-100 text-gray-800',
};
$statusLabel = match($academy->status) {
'active' => __('نشط'),
'inactive' => __('غير نشط'),
'suspended' => __('موقوف'),
default => $academy->status ?? __('غير محدد'),
};
@endphp
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium {{ $statusBadge }}">{{ $statusLabel }}</span>
</div>
<div class="flex items-center justify-between text-xs text-gray-500">
<span>{{ __('المستخدمين') }}: <span class="font-medium text-gray-700">{{ $academy->users_count ?? 0 }}</span></span>
<span dir="ltr">{{ $academy->created_at?->format('Y-m-d') }}</span>
</div>
</div>
@endforeach
</div>
<div class="hidden md:block overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
......
<div>
{{-- Header --}}
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900">{{ __('إعدادات النظام') }}</h1>
<div class="mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('إعدادات النظام') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('إدارة الإعدادات العامة والمالية والحضور والإشعارات والتسجيل') }}</p>
</div>
......@@ -15,12 +15,12 @@
{{-- Tabs --}}
<div class="mb-6">
<div class="border-b border-gray-200">
<nav class="flex gap-1 -mb-px overflow-x-auto" aria-label="{{ __('أقسام الإعدادات') }}">
<nav class="flex gap-1 -mb-px overflow-x-auto scrollbar-hide" aria-label="{{ __('أقسام الإعدادات') }}">
@foreach($tabs as $key => $label)
<button
type="button"
wire:click="$set('activeTab', '{{ $key }}')"
class="px-4 py-2.5 text-sm font-medium whitespace-nowrap border-b-2 transition-colors
class="shrink-0 px-3 sm:px-4 py-2.5 text-sm font-medium whitespace-nowrap border-b-2 transition-colors
{{ $activeTab === $key
? 'border-blue-600 text-blue-700'
: 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300' }}"
......@@ -34,7 +34,7 @@ class="px-4 py-2.5 text-sm font-medium whitespace-nowrap border-b-2 transition-c
{{-- Settings Form --}}
<form wire:submit="save">
<div class="bg-white border border-gray-200 rounded-lg p-6 shadow-sm">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6 shadow-sm">
@if(empty($schema))
<div class="p-8 text-center">
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -46,7 +46,7 @@ class="px-4 py-2.5 text-sm font-medium whitespace-nowrap border-b-2 transition-c
@else
<div class="space-y-6">
@foreach($schema as $key => $config)
<div class="max-w-lg">
<div class="max-w-lg w-full">
<label for="setting-{{ $key }}" class="block text-sm font-medium text-gray-700 mb-1.5">
{{ __($config['label']) }}
</label>
......@@ -120,12 +120,12 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
{{-- Save button --}}
@if(!empty($schema))
<div class="mt-6">
<div class="mt-6 flex flex-col-reverse sm:flex-row gap-3">
<button
type="submit"
wire:loading.attr="disabled"
wire:target="save"
class="inline-flex items-center px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:bg-blue-400 disabled:cursor-not-allowed transition-colors"
class="w-full sm:w-auto inline-flex items-center justify-center px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:bg-blue-400 disabled:cursor-not-allowed transition-colors"
>
<span wire:loading.remove wire:target="save">{{ __('حفظ الإعدادات') }}</span>
<span wire:loading wire:target="save" class="inline-flex items-center">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('التكليفات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('التكليفات') }}</h1>
@can('assignments.create')
<a href="{{ route('assignments.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
<!-- Header -->
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900">{{ __('سجل الحضور') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('سجل الحضور') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('عرض جلسات التدريب ونسب الحضور') }}</p>
</div>
<!-- Filters -->
<div class="mb-6 p-4 bg-white border border-gray-200 rounded-lg">
<div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
<div class="mb-6 p-3 sm:p-4 bg-white border border-gray-200 rounded-lg">
<div class="grid grid-cols-2 md:grid-cols-3 gap-3">
<!-- Search -->
<div>
<div class="col-span-2 md:col-span-1">
<label for="search" class="block text-sm font-medium text-gray-700 mb-1">{{ __('بحث بالمجموعة') }}</label>
<input
type="text"
......@@ -43,7 +43,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
</div>
</div>
<!-- Sessions Table -->
<!-- Sessions -->
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden" wire:loading.class="opacity-50 pointer-events-none">
@if($sessions->isEmpty())
<div class="p-12 text-center">
......@@ -51,7 +51,8 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
<p class="mt-4 text-sm text-gray-500">{{ __('لا توجد جلسات في هذه الفترة') }}</p>
</div>
@else
<div class="overflow-x-auto">
<!-- Desktop Table -->
<div class="hidden md:block overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
......@@ -140,6 +141,73 @@ class="inline-flex items-center gap-1 px-3 py-1.5 text-xs font-medium text-blue-
</table>
</div>
<!-- Mobile Cards -->
<div class="md:hidden space-y-3 p-3">
@foreach($sessions as $session)
@php
$total = $session->attendance_records_count;
$presentCount = $session->present_count;
$absentCount = $session->absent_count;
$rate = $total > 0 ? round(($presentCount / $total) * 100, 0) : 0;
@endphp
<div class="border border-gray-200 rounded-lg p-3">
<!-- Card Header: Group Name + Date -->
<div class="flex items-center justify-between mb-2">
<h3 class="text-sm font-medium text-gray-900">
{{ $session->group?->name_ar ?? '-' }}
</h3>
<span class="text-xs text-gray-500" dir="ltr">
{{ $session->session_date->format('Y-m-d') }}
</span>
</div>
<!-- Time -->
<p class="text-xs text-gray-500 mb-3" dir="ltr">
{{ $session->start_time }} - {{ $session->end_time }}
</p>
<!-- Stats Row -->
<div class="flex items-center gap-2 flex-wrap mb-3">
<!-- Total -->
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-700" dir="ltr">
{{ __('الإجمالي') }}: {{ $total }}
</span>
<!-- Present/Late -->
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800" dir="ltr">
{{ __('حاضر') }}: {{ $presentCount }}
</span>
<!-- Absent -->
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800" dir="ltr">
{{ __('غائب') }}: {{ $absentCount }}
</span>
<!-- Attendance Rate -->
@if($total > 0)
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium
@if($rate >= 90) bg-green-100 text-green-800
@elseif($rate >= 75) bg-amber-100 text-amber-800
@else bg-red-100 text-red-800
@endif
" dir="ltr">
{{ $rate }}%
</span>
@endif
</div>
<!-- Action -->
@can('attendance.mark')
<a href="{{ route('attendance.take', $session) }}"
class="inline-flex items-center justify-center gap-1 w-full px-3 py-2 text-sm font-medium text-blue-700 bg-blue-50 border border-blue-200 rounded-lg hover:bg-blue-100">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4"/></svg>
{{ __('تسجيل') }}
</a>
@endcan
</div>
@endforeach
</div>
<!-- Pagination -->
<div class="px-4 py-3 border-t border-gray-200">
{{ $sessions->links() }}
......
<div class="max-w-4xl mx-auto px-4 py-6">
<div class="max-w-4xl mx-auto px-3 sm:px-4 py-4 sm:py-6">
{{-- Page Header --}}
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900 dark:text-white">{{ __('حضور سريع') }}</h1>
<p class="mt-1 text-sm text-gray-500 dark:text-gray-400">{{ __('اختر الحصة وسجّل الحضور بسرعة') }}</p>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<div>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900 dark:text-white">{{ __('حضور سريع') }}</h1>
<p class="mt-1 text-sm text-gray-500 dark:text-gray-400">{{ __('اختر الحصة وسجّل الحضور بسرعة') }}</p>
</div>
</div>
{{-- Flash Message --}}
......@@ -14,7 +16,7 @@
{{-- Session Selection --}}
<div class="mb-6">
<h2 class="text-lg font-semibold text-gray-800 dark:text-gray-200 mb-3">{{ __('حصص اليوم') }}</h2>
<h2 class="text-base sm:text-lg font-semibold text-gray-800 dark:text-gray-200 mb-3">{{ __('حصص اليوم') }}</h2>
@if ($todaySessions->isEmpty())
<div class="rounded-lg bg-gray-50 dark:bg-gray-800 border border-gray-200 dark:border-gray-700 p-8 text-center">
......@@ -24,7 +26,7 @@
<p class="mt-2 text-gray-600 dark:text-gray-400">{{ __('لا توجد حصص مجدولة لك اليوم') }}</p>
</div>
@else
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
<div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-3 sm:gap-4">
@foreach ($todaySessions as $session)
<button
wire:click="selectSession({{ $session->id }})"
......@@ -63,7 +65,7 @@ class="text-start rounded-lg border-2 p-4 transition-all
@if ($selectedSessionId)
<div class="rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-800 shadow-sm">
{{-- Summary Bar --}}
<div class="flex items-center justify-between border-b border-gray-200 dark:border-gray-700 px-4 py-3">
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 border-b border-gray-200 dark:border-gray-700 p-4 sm:p-6">
<div class="flex items-center gap-4">
<span class="text-sm font-medium text-gray-700 dark:text-gray-300">
{{ __('الحضور:') }}
......@@ -105,7 +107,7 @@ class="inline-flex items-center gap-1.5 rounded-md bg-green-50 dark:bg-green-900
@endphp
<li
wire:click="toggleAbsent({{ $record->id }})"
class="flex items-center justify-between px-4 py-3 cursor-pointer select-none transition-colors
class="flex items-center justify-between px-4 py-3.5 min-h-[48px] cursor-pointer select-none transition-colors
{{ $isPresent
? 'hover:bg-gray-50 dark:hover:bg-gray-700/50'
: 'bg-red-50 dark:bg-red-900/10 hover:bg-red-100 dark:hover:bg-red-900/20' }}"
......@@ -145,7 +147,7 @@ class="flex items-center justify-between px-4 py-3 cursor-pointer select-none tr
{{-- Save Button --}}
@if ($records->isNotEmpty())
<div class="border-t border-gray-200 dark:border-gray-700 px-4 py-4">
<div class="border-t border-gray-200 dark:border-gray-700 p-4 sm:p-6">
<button
wire:click="save"
wire:loading.attr="disabled"
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('سجل التدقيق') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('سجل التدقيق') }}</h1>
</div>
{{-- Filters --}}
......
<div>
<div class="bg-white rounded-xl shadow-lg p-8">
<div class="bg-white rounded-xl shadow-lg p-6 sm:p-8">
<!-- Logo/Title -->
<div class="text-center mb-8">
<h1 class="text-3xl font-bold text-blue-700 mb-2">الكابتن</h1>
<p class="text-gray-500">إدارة الأكاديميات الرياضية</p>
<div class="text-center mb-6 sm:mb-8">
@php
$branding = app(\App\Domain\Shared\Services\SettingsService::class);
$logo = $branding->get('branding.logo');
@endphp
@if($logo)
<img src="{{ Storage::disk('public')->url($logo) }}" alt="{{ __('الكابتن') }}" class="h-14 sm:h-16 mx-auto mb-3">
@else
<h1 class="text-2xl sm:text-3xl font-bold mb-2" style="color: var(--brand-primary, #2563eb);">{{ __('الكابتن') }}</h1>
@endif
<p class="text-sm sm:text-base text-gray-500">{{ __('إدارة الأكاديميات الرياضية') }}</p>
</div>
<!-- Error message -->
@if($errorMessage)
<div class="mb-4 rounded-md bg-red-50 p-4 border border-red-200">
<div class="mb-4 rounded-lg bg-red-50 p-3 sm:p-4 border border-red-200">
<p class="text-sm text-red-700">{{ $errorMessage }}</p>
</div>
@endif
......@@ -16,46 +24,49 @@
<form wire:submit="login">
<!-- Email -->
<div class="mb-4">
<label for="email" class="block text-sm font-medium text-gray-700 mb-1">البريد الإلكتروني</label>
<label for="email" class="block text-sm font-medium text-gray-700 mb-1">{{ __('البريد الإلكتروني') }}</label>
<input type="email" id="email" wire:model="email"
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('email') border-red-500 @enderror"
placeholder="admin@example.com" dir="ltr" required autofocus>
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:border-transparent text-sm sm:text-base @error('email') border-red-500 @enderror"
style="--tw-ring-color: var(--brand-primary, #2563eb);"
placeholder="admin@example.com" dir="ltr" required autofocus inputmode="email" autocomplete="email">
@error('email')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
</div>
<!-- Password -->
<div class="mb-6">
<label for="password" class="block text-sm font-medium text-gray-700 mb-1">كلمة المرور</label>
<div class="mb-5 sm:mb-6">
<label for="password" class="block text-sm font-medium text-gray-700 mb-1">{{ __('كلمة المرور') }}</label>
<input type="password" id="password" wire:model="password"
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('password') border-red-500 @enderror"
placeholder="••••••••" required>
class="w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:border-transparent text-sm sm:text-base @error('password') border-red-500 @enderror"
style="--tw-ring-color: var(--brand-primary, #2563eb);"
placeholder="••••••••" required autocomplete="current-password">
@error('password')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
</div>
<!-- Remember me -->
<div class="flex items-center justify-between mb-6">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="remember" class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<span class="text-sm text-gray-600">تذكرني</span>
<div class="flex items-center justify-between mb-5 sm:mb-6">
<label class="flex items-center gap-2 cursor-pointer min-h-[44px]">
<input type="checkbox" wire:model="remember" class="w-5 h-5 rounded border-gray-300 focus:ring-2" style="color: var(--brand-primary, #2563eb); --tw-ring-color: var(--brand-primary, #2563eb);">
<span class="text-sm text-gray-600">{{ __('تذكرني') }}</span>
</label>
</div>
<!-- Submit -->
<button type="submit"
wire:loading.attr="disabled"
class="w-full py-2.5 px-4 bg-blue-600 hover:bg-blue-700 disabled:bg-blue-400 text-white font-medium rounded-lg transition-colors">
<span wire:loading.remove>تسجيل الدخول</span>
<span wire:loading>جارٍ الدخول...</span>
class="w-full py-3 px-4 text-white font-medium rounded-lg transition-colors disabled:opacity-60 text-sm sm:text-base"
style="background-color: var(--brand-primary, #2563eb);">
<span wire:loading.remove wire:target="login">{{ __('تسجيل الدخول') }}</span>
<span wire:loading wire:target="login">{{ __('جارٍ الدخول...') }}</span>
</button>
</form>
</div>
<!-- Footer -->
<p class="text-center text-sm text-gray-400 mt-6">
<p class="text-center text-xs sm:text-sm text-gray-400 mt-4 sm:mt-6">
El Captain Sports Management &copy; {{ date('Y') }}
</p>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">الفروع</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">الفروع</h1>
@can('branches.create')
<a href="{{ route('branches.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('الورديات النقدية') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('الورديات النقدية') }}</h1>
@can('cash_sessions.manage')
<a href="{{ route('cash-sessions.manage') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
class="inline-flex items-center justify-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
{{ __('إدارة الوردية') }}
<span class="hidden sm:inline">{{ __('إدارة الوردية') }}</span>
</a>
@endcan
</div>
{{-- Flash Messages --}}
@if(session('success'))
<div class="mb-4 p-4 bg-green-50 border border-green-200 rounded-lg text-green-700 text-sm">
<div class="mb-4 p-3 sm:p-4 bg-green-50 border border-green-200 rounded-lg text-green-700 text-sm">
{{ session('success') }}
</div>
@endif
{{-- Filters --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-4">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
<select wire:model.live="status" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-3">
<select wire:model.live="status" class="px-4 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('كل الحالات') }}</option>
@foreach($statusOptions as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
......@@ -29,9 +29,9 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
</div>
</div>
{{-- Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div wire:loading.class="opacity-50 pointer-events-none">
{{-- Desktop Table --}}
<div class="hidden md:block bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="overflow-x-auto" wire:loading.class="opacity-50 pointer-events-none">
<table class="w-full text-sm">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
......@@ -109,4 +109,68 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
</div>
@endif
</div>
{{-- Mobile Cards --}}
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($sessions as $session)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-center justify-between mb-3">
<span class="font-medium text-gray-800 text-sm">
{{ $session->user?->name_ar ?? $session->user?->name ?? '—' }}
</span>
@php
$statusColors = [
'open' => 'green',
'closed' => 'gray',
'suspended' => 'amber',
];
$color = $statusColors[$session->status] ?? 'gray';
@endphp
<span class="px-2 py-0.5 text-xs bg-{{ $color }}-100 text-{{ $color }}-700 rounded-full">
{{ $statusOptions[$session->status] ?? $session->status }}
</span>
</div>
<div class="text-xs text-gray-500 mb-3">
{{ $session->branch?->name_ar ?? '—' }}
</div>
<div class="grid grid-cols-2 gap-3 text-sm">
<div>
<span class="text-gray-500 text-xs block mb-0.5">{{ __('رصيد الافتتاح') }}</span>
<span class="font-mono text-gray-700" dir="ltr">{{ number_format($session->opening_balance / 100, 2) }}</span>
</div>
<div>
<span class="text-gray-500 text-xs block mb-0.5">{{ __('الفرق') }}</span>
<span class="font-mono {{ ($session->variance ?? 0) < 0 ? 'text-red-700' : (($session->variance ?? 0) > 0 ? 'text-amber-700' : 'text-gray-700') }}" dir="ltr">
@if($session->variance !== null)
{{ $session->variance >= 0 ? '+' : '' }}{{ number_format($session->variance / 100, 2) }}
@else
@endif
</span>
</div>
</div>
<div class="mt-3 pt-3 border-t border-gray-100 text-xs text-gray-500" dir="ltr">
{{ $session->opened_at?->format('Y-m-d H:i') ?? '—' }}
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-8">
<div class="flex flex-col items-center">
<svg class="w-12 h-12 text-gray-300 mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17 9V7a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2m2 4h10a2 2 0 002-2v-6a2 2 0 00-2-2H9a2 2 0 00-2 2v6a2 2 0 002 2zm7-5a2 2 0 11-4 0 2 2 0 014 0z"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا توجد ورديات') }}</p>
</div>
</div>
@endforelse
@if($sessions->hasPages())
<div class="mt-3">
{{ $sessions->links() }}
</div>
@endif
</div>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('إدارة الوردية') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('إدارة الوردية') }}</h1>
<a href="{{ route('cash-sessions.list') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium w-full sm:w-auto justify-center">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/></svg>
{{ __('عودة للقائمة') }}
</a>
......@@ -22,28 +22,28 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
@if($currentSession)
{{-- Current Open Session Info --}}
<div class="bg-white rounded-xl shadow-sm border border-green-200 p-6 mb-6">
<div class="bg-white rounded-xl shadow-sm border border-green-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="flex items-center gap-2 mb-4">
<div class="w-3 h-3 bg-green-500 rounded-full animate-pulse"></div>
<h3 class="text-lg font-semibold text-gray-800">{{ __('وردية مفتوحة حالياً') }}</h3>
<h3 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('وردية مفتوحة حالياً') }}</h3>
</div>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6">
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 lg:gap-6">
<div>
<p class="text-sm text-gray-500 mb-1">{{ __('رصيد الافتتاح') }}</p>
<p class="text-xl font-bold text-gray-800" dir="ltr">
<p class="text-lg sm:text-xl font-bold text-gray-800" dir="ltr">
{{ number_format($currentSession->opening_balance / 100, 2) }} {{ __('ج.م') }}
</p>
</div>
<div>
<p class="text-sm text-gray-500 mb-1">{{ __('إجمالي الوارد') }}</p>
<p class="text-xl font-bold text-green-700" dir="ltr">
<p class="text-lg sm:text-xl font-bold text-green-700" dir="ltr">
+{{ number_format(($currentSession->total_cash_in ?? 0) / 100, 2) }} {{ __('ج.م') }}
</p>
</div>
<div>
<p class="text-sm text-gray-500 mb-1">{{ __('إجمالي الصادر') }}</p>
<p class="text-xl font-bold text-red-700" dir="ltr">
<p class="text-lg sm:text-xl font-bold text-red-700" dir="ltr">
-{{ number_format(($currentSession->total_cash_out ?? 0) / 100, 2) }} {{ __('ج.م') }}
</p>
</div>
......@@ -52,13 +52,13 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
@php
$expected = $currentSession->opening_balance + ($currentSession->total_cash_in ?? 0) - ($currentSession->total_cash_out ?? 0);
@endphp
<p class="text-xl font-bold text-blue-700" dir="ltr">
<p class="text-lg sm:text-xl font-bold text-blue-700" dir="ltr">
{{ number_format($expected / 100, 2) }} {{ __('ج.م') }}
</p>
</div>
</div>
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 mt-4 pt-4 border-t border-gray-100">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-3 sm:gap-4 mt-4 pt-4 border-t border-gray-100">
<div>
<p class="text-sm text-gray-500">{{ __('الفرع') }}</p>
<p class="text-sm font-medium text-gray-800">{{ $currentSession->branch?->name_ar ?? '—' }}</p>
......@@ -75,8 +75,8 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
</div>
{{-- Close Session Form --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('إغلاق الوردية') }}</h3>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h3 class="text-base sm:text-lg font-semibold text-gray-800 mb-4">{{ __('إغلاق الوردية') }}</h3>
<form wire:submit="closeSession" class="space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('رصيد الإغلاق الفعلي (ج.م)') }}</label>
......@@ -119,7 +119,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endif
<button type="submit" wire:loading.attr="disabled" wire:target="closeSession"
class="w-full px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50 font-medium text-sm">
class="w-full px-4 py-2.5 bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50 font-medium text-sm">
<span wire:loading.remove wire:target="closeSession">{{ __('إغلاق الوردية') }}</span>
<span wire:loading wire:target="closeSession">{{ __('جارٍ الإغلاق...') }}</span>
</button>
......@@ -127,8 +127,8 @@ class="w-full px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 disabl
</div>
@else
{{-- Open New Session Form --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('فتح وردية جديدة') }}</h3>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h3 class="text-base sm:text-lg font-semibold text-gray-800 mb-4">{{ __('فتح وردية جديدة') }}</h3>
<form wire:submit="openSession" class="space-y-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الفرع') }}</label>
......@@ -154,7 +154,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
</div>
<button type="submit" wire:loading.attr="disabled" wire:target="openSession"
class="w-full px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 font-medium text-sm">
class="w-full px-4 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 font-medium text-sm">
<span wire:loading.remove wire:target="openSession">{{ __('فتح الوردية') }}</span>
<span wire:loading wire:target="openSession">{{ __('جارٍ الفتح...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('تسجيل في مجموعة') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('تسجيل في مجموعة') }}</h1>
<a href="{{ route('enrollments.list') }}" wire:navigate
class="text-sm text-gray-600 hover:text-gray-800">
{{ __('العودة للقائمة') }}
......@@ -14,7 +14,7 @@ class="text-sm text-gray-600 hover:text-gray-800">
</div>
@endif
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<form wire:submit="save" class="space-y-6">
{{-- Participant Selection --}}
<div>
......@@ -22,7 +22,7 @@ class="text-sm text-gray-600 hover:text-gray-800">
{{ __('المشترك') }} <span class="text-red-500">*</span>
</label>
<select wire:model="participant_id" id="participant_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('participant_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('participant_id') border-red-500 @enderror">
<option value="">{{ __('اختر المشترك...') }}</option>
@foreach($participants as $participant)
<option value="{{ $participant->id }}">
......@@ -44,7 +44,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('المجموعة') }} <span class="text-red-500">*</span>
</label>
<select wire:model="training_group_id" id="training_group_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('training_group_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('training_group_id') border-red-500 @enderror">
<option value="">{{ __('اختر المجموعة...') }}</option>
@foreach($groups as $group)
<option value="{{ $group->id }}">
......@@ -67,7 +67,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('تاريخ البدء') }}
</label>
<input type="date" wire:model="start_date" id="start_date" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('start_date') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('start_date') border-red-500 @enderror">
<p class="mt-1 text-xs text-gray-500">{{ __('اتركه فارغاً لاستخدام تاريخ بدء المجموعة') }}</p>
@error('start_date')
<p class="mt-1 text-xs text-red-600">{{ $message }}</p>
......@@ -80,7 +80,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('حالة الدفع') }} <span class="text-red-500">*</span>
</label>
<select wire:model="payment_status" id="payment_status"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('payment_status') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('payment_status') border-red-500 @enderror">
@foreach($paymentOptions as $value => $label)
<option value="{{ $value }}">{{ __($label) }}</option>
@endforeach
......@@ -96,7 +96,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('ملاحظات') }}
</label>
<textarea wire:model="notes" id="notes" rows="3"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('notes') border-red-500 @enderror"
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('notes') border-red-500 @enderror"
placeholder="{{ __('ملاحظات إضافية...') }}"></textarea>
@error('notes')
<p class="mt-1 text-xs text-red-600">{{ $message }}</p>
......@@ -104,15 +104,15 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Submit --}}
<div class="flex items-center justify-end gap-3 pt-4 border-t border-gray-200">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3 pt-4 border-t border-gray-200">
<a href="{{ route('enrollments.list') }}" wire:navigate
class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg">
class="text-center px-4 sm:px-6 py-2.5 text-sm text-gray-700 hover:bg-gray-100 rounded-lg border border-gray-300 font-medium">
{{ __('إلغاء') }}
</a>
<button type="submit"
wire:loading.attr="disabled"
wire:target="save"
class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50">
class="text-center px-4 sm:px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ __('تسجيل') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ التسجيل...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('نقل إلى مجموعة') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('نقل إلى مجموعة') }}</h1>
<a href="{{ route('enrollments.list') }}" wire:navigate
class="text-sm text-gray-600 hover:text-gray-800">
{{ __('العودة للقائمة') }}
......@@ -20,7 +20,7 @@ class="text-sm text-gray-600 hover:text-gray-800">
</div>
@endif
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 space-y-6">
{{-- Step 1: Search Participant --}}
<div>
......@@ -31,7 +31,7 @@ class="text-sm text-gray-600 hover:text-gray-800">
wire:model.live.debounce.300ms="search"
id="search"
placeholder="{{ __('ابحث بالاسم أو رقم المشترك...') }}"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
{{-- Search Results --}}
@if(strlen($search) >= 2 && $participants->isNotEmpty() && !$participant_id)
......@@ -64,7 +64,7 @@ class="w-full px-4 py-3 text-start hover:bg-blue-50 flex items-center justify-be
?? \App\Domain\Participant\Models\Participant::with('person')->find($participant_id);
@endphp
@if($selectedParticipant)
<div class="p-4 bg-blue-50 border border-blue-200 rounded-lg flex items-center justify-between">
<div class="p-3 sm:p-4 bg-blue-50 border border-blue-200 rounded-lg flex flex-col sm:flex-row sm:items-center justify-between gap-2">
<div>
<span class="text-sm font-medium text-blue-800">{{ __('المشترك المختار:') }}</span>
<span class="text-sm text-blue-700 ms-1">{{ $selectedParticipant->person?->name_ar }}</span>
......@@ -72,7 +72,7 @@ class="w-full px-4 py-3 text-start hover:bg-blue-50 flex items-center justify-be
<span class="text-xs text-blue-600 ms-2">#{{ $selectedParticipant->participant_number }}</span>
@endif
</div>
<button type="button" wire:click="$set('participant_id', null)" class="text-blue-600 hover:text-blue-800 text-xs">
<button type="button" wire:click="$set('participant_id', null)" class="text-blue-600 hover:text-blue-800 text-xs self-start sm:self-auto">
{{ __('تغيير') }}
</button>
</div>
......@@ -89,23 +89,23 @@ class="w-full px-4 py-3 text-start hover:bg-blue-50 flex items-center justify-be
@else
<div class="space-y-2">
@foreach($activeEnrollments as $enrollment)
<label class="flex items-center gap-3 p-3 border rounded-lg cursor-pointer transition
<label class="flex items-start sm:items-center gap-3 p-3 border rounded-lg cursor-pointer transition
{{ $enrollment_id === $enrollment->id ? 'border-blue-500 bg-blue-50' : 'border-gray-200 hover:border-gray-300' }}">
<input type="radio"
wire:click="selectEnrollment({{ $enrollment->id }})"
name="enrollment_selection"
value="{{ $enrollment->id }}"
@checked($enrollment_id === $enrollment->id)
class="text-blue-600 focus:ring-blue-500">
<div class="flex-1">
class="text-blue-600 focus:ring-blue-500 mt-1 sm:mt-0">
<div class="flex-1 min-w-0">
<span class="text-sm font-medium text-gray-800">{{ $enrollment->group?->name_ar }}</span>
@if($enrollment->program)
<span class="text-xs text-gray-500 ms-2">— {{ $enrollment->program->name_ar }}</span>
@endif
<div class="text-xs text-gray-500 mt-0.5">
{{ __('تاريخ التسجيل:') }} {{ $enrollment->enrollment_date?->format('Y-m-d') }}
<div class="text-xs text-gray-500 mt-0.5 flex flex-wrap gap-x-3 gap-y-0.5">
<span>{{ __('تاريخ التسجيل:') }} {{ $enrollment->enrollment_date?->format('Y-m-d') }}</span>
@if($enrollment->group)
<span class="ms-3">{{ __('السعة:') }} {{ $enrollment->group->current_count }}/{{ $enrollment->group->max_capacity }}</span>
<span>{{ __('السعة:') }} {{ $enrollment->group->current_count }}/{{ $enrollment->group->max_capacity }}</span>
@endif
</div>
</div>
......@@ -129,7 +129,7 @@ class="text-blue-600 focus:ring-blue-500">
<p class="text-sm text-gray-500 p-3 bg-gray-50 rounded-lg">{{ __('لا توجد مجموعات متاحة بها أماكن شاغرة') }}</p>
@else
<select wire:model="destination_group_id" id="destination_group_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('destination_group_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('destination_group_id') border-red-500 @enderror">
<option value="">{{ __('اختر المجموعة الجديدة...') }}</option>
@foreach($destinationGroups as $group)
<option value="{{ $group->id }}">
......@@ -150,9 +150,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{-- Submit --}}
@if($enrollment_id && $destinationGroups->isNotEmpty())
<div class="flex items-center justify-end gap-3 pt-4 border-t border-gray-200">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3 pt-4 border-t border-gray-200">
<a href="{{ route('enrollments.list') }}" wire:navigate
class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg">
class="w-full sm:w-auto px-4 py-2.5 text-sm text-gray-700 hover:bg-gray-100 rounded-lg text-center">
{{ __('إلغاء') }}
</a>
<button type="button"
......@@ -160,7 +160,7 @@ class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg">
wire:loading.attr="disabled"
wire:target="transfer"
wire:confirm="{{ __('هل أنت متأكد من نقل المشترك إلى المجموعة الجديدة؟') }}"
class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50">
class="w-full sm:w-auto px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50">
<span wire:loading.remove wire:target="transfer">{{ __('نقل') }}</span>
<span wire:loading wire:target="transfer">{{ __('جارٍ النقل...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('قائمة الانتظار') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('قائمة الانتظار') }}</h1>
<a href="{{ route('enrollments.list') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 text-gray-600 bg-gray-100 rounded-lg hover:bg-gray-200 text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 17l-5-5m0 0l5-5m-5 5h12"/></svg>
......
......@@ -2,7 +2,7 @@
<!-- Header -->
<div class="mb-6 flex items-center justify-between">
<div>
<h1 class="text-2xl font-bold text-gray-900">{{ __('معايير التقييم') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('معايير التقييم') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('إدارة معايير تقييم المشتركين') }}</p>
</div>
<button
......
<div>
<!-- Header -->
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900">{{ $evaluation ? __('تعديل التقييم') : __('تقييم جديد') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('تقييم أداء المشترك في المجموعة التدريبية') }}</p>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<div>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ $evaluation ? __('تعديل التقييم') : __('تقييم جديد') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('تقييم أداء المشترك في المجموعة التدريبية') }}</p>
</div>
</div>
@if(session('error'))
......@@ -13,16 +15,16 @@
<div class="space-y-6">
<!-- Basic Info -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('المعلومات الأساسية') }}</h2>
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-900 mb-4">{{ __('المعلومات الأساسية') }}</h2>
<div class="grid grid-cols-1 gap-3 sm:gap-4 sm:grid-cols-2 lg:grid-cols-3">
<!-- Participant -->
<div>
<label for="participant_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المشترك') }} *</label>
<select
id="participant_id"
wire:model="participant_id"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm @error('participant_id') border-red-500 @enderror">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5 @error('participant_id') border-red-500 @enderror">
<option value="">{{ __('اختر المشترك') }}</option>
@foreach($participants as $participant)
<option value="{{ $participant->id }}">{{ $participant->person?->name_ar ?? $participant->person?->name }}</option>
......@@ -37,7 +39,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
<select
id="training_group_id"
wire:model="training_group_id"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm @error('training_group_id') border-red-500 @enderror">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5 @error('training_group_id') border-red-500 @enderror">
<option value="">{{ __('اختر المجموعة') }}</option>
@foreach($groups as $group)
<option value="{{ $group->id }}">{{ $group->name_ar }}</option>
......@@ -54,7 +56,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
id="evaluation_date"
wire:model="evaluation_date"
dir="ltr"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm @error('evaluation_date') border-red-500 @enderror">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5 @error('evaluation_date') border-red-500 @enderror">
@error('evaluation_date') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -66,7 +68,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
id="period_from"
wire:model="period_from"
dir="ltr"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5">
</div>
<!-- Period To -->
......@@ -77,15 +79,15 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
id="period_to"
wire:model="period_to"
dir="ltr"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm @error('period_to') border-red-500 @enderror">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5 @error('period_to') border-red-500 @enderror">
@error('period_to') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
</div>
</div>
<!-- Criteria Scores -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('الدرجات') }}</h2>
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-900 mb-4">{{ __('الدرجات') }}</h2>
@if($criteria->isEmpty())
<div class="p-6 text-center text-sm text-gray-500">
......@@ -122,7 +124,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
step="0.5"
dir="ltr"
placeholder="0"
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm text-center">
class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5 text-center">
</div>
<span class="text-xs text-gray-500 whitespace-nowrap" dir="ltr">/ {{ $criterion->max_score }}</span>
</div>
......@@ -141,8 +143,8 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
</div>
<!-- Overall Notes -->
<div class="bg-white border border-gray-200 rounded-lg p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('ملاحظات عامة') }}</h2>
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-900 mb-4">{{ __('ملاحظات عامة') }}</h2>
<textarea
wire:model="overall_notes"
rows="4"
......@@ -152,13 +154,18 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
</div>
<!-- Actions -->
<div class="flex items-center gap-3">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('evaluations.list') }}"
class="px-5 py-2.5 sm:py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition-colors text-center w-full sm:w-auto">
{{ __('إلغاء') }}
</a>
<button
type="button"
wire:click="saveDraft"
wire:loading.attr="disabled"
wire:target="saveDraft"
class="px-5 py-2.5 bg-gray-600 text-white text-sm font-medium rounded-lg hover:bg-gray-700 disabled:bg-gray-400 transition-colors">
class="px-5 py-2.5 sm:py-2 bg-gray-600 text-white text-sm font-medium rounded-lg hover:bg-gray-700 disabled:bg-gray-400 transition-colors w-full sm:w-auto">
<span wire:loading.remove wire:target="saveDraft">{{ __('حفظ كمسودة') }}</span>
<span wire:loading wire:target="saveDraft">{{ __('جارٍ الحفظ...') }}</span>
</button>
......@@ -168,15 +175,10 @@ class="px-5 py-2.5 bg-gray-600 text-white text-sm font-medium rounded-lg hover:b
wire:click="submit"
wire:loading.attr="disabled"
wire:target="submit"
class="px-5 py-2.5 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
class="px-5 py-2.5 sm:py-2 bg-blue-600 text-white text-sm font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors w-full sm:w-auto">
<span wire:loading.remove wire:target="submit">{{ __('تقديم') }}</span>
<span wire:loading wire:target="submit">{{ __('جارٍ التقديم...') }}</span>
</button>
<a href="{{ route('evaluations.list') }}"
class="px-5 py-2.5 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50 transition-colors">
{{ __('إلغاء') }}
</a>
</div>
</div>
</div>
......@@ -2,7 +2,7 @@
<!-- Header -->
<div class="mb-6 flex items-center justify-between">
<div>
<h1 class="text-2xl font-bold text-gray-900">{{ __('التقييمات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('التقييمات') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('إدارة تقييمات المشتركين') }}</p>
</div>
@can('evaluations.create')
......
......@@ -8,9 +8,9 @@
@endif
<!-- Header -->
<div class="mb-6 flex items-center justify-between">
<div class="mb-4 sm:mb-6 flex flex-col sm:flex-row sm:items-center justify-between gap-3">
<div>
<h1 class="text-2xl font-bold text-gray-900">{{ __('عرض التقييم') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('عرض التقييم') }}</h1>
<p class="mt-1 text-sm text-gray-500">
{{ $evaluation->participant?->person?->name_ar ?? '-' }}
&mdash; {{ $evaluation->evaluation_date?->format('Y-m-d') }}
......@@ -24,29 +24,29 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
</div>
<!-- Info Cards -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-6">
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3 sm:gap-4 mb-4 sm:mb-6">
<!-- Participant -->
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('المشترك') }}</p>
<p class="font-medium text-gray-900">{{ $evaluation->participant?->person?->name_ar ?? '-' }}</p>
</div>
<!-- Group -->
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('المجموعة') }}</p>
<p class="font-medium text-gray-900">{{ $evaluation->group?->name_ar ?? __('بدون مجموعة') }}</p>
</div>
<!-- Evaluator -->
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('المقيّم') }}</p>
<p class="font-medium text-gray-900">{{ $evaluation->evaluator?->name_ar ?? $evaluation->evaluator?->name ?? '-' }}</p>
</div>
</div>
<!-- Status & Dates Row -->
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('الحالة') }}</p>
@php $statusColor = $evaluation->status->color(); @endphp
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium mt-1
......@@ -59,13 +59,13 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
">{{ $evaluation->status->label() }}</span>
</div>
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('تاريخ التقييم') }}</p>
<p class="font-medium text-gray-900" dir="ltr">{{ $evaluation->evaluation_date?->format('Y-m-d') }}</p>
</div>
@if($evaluation->period_from || $evaluation->period_to)
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('فترة التقييم') }}</p>
<p class="font-medium text-gray-900" dir="ltr">
{{ $evaluation->period_from?->format('Y-m-d') ?? '-' }} {{ __('إلى') }} {{ $evaluation->period_to?->format('Y-m-d') ?? '-' }}
......@@ -73,14 +73,14 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
</div>
@endif
<div class="bg-white rounded-lg border border-gray-200 p-4">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4">
<p class="text-sm text-gray-500">{{ __('الدرجة الكلية') }}</p>
<p class="text-2xl font-bold text-blue-600" dir="ltr">{{ $evaluation->overall_score ? number_format($evaluation->overall_score, 1) : '-' }}</p>
</div>
</div>
<!-- Scores Table -->
<div class="bg-white rounded-lg border border-gray-200 overflow-hidden mb-6">
<div class="bg-white rounded-lg border border-gray-200 overflow-hidden overflow-x-auto mb-4 sm:mb-6">
<div class="px-4 py-3 border-b border-gray-200 bg-gray-50">
<h3 class="text-sm font-semibold text-gray-700">{{ __('درجات المعايير') }}</h3>
</div>
......@@ -120,14 +120,14 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
<!-- Overall Notes -->
@if($evaluation->overall_notes)
<div class="bg-white rounded-lg border border-gray-200 p-4 mb-6">
<div class="bg-white rounded-lg border border-gray-200 p-3 sm:p-4 mb-4 sm:mb-6">
<h3 class="text-sm font-semibold text-gray-700 mb-2">{{ __('ملاحظات عامة') }}</h3>
<p class="text-gray-600">{{ $evaluation->overall_notes }}</p>
</div>
@endif
<!-- Actions -->
<div class="flex items-center gap-3">
<div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-2 sm:gap-3">
@can('evaluations.approve')
@if($evaluation->status->value === 'submitted')
<button
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('المنشآت') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('المنشآت') }}</h1>
@permission('facilities.create')
<a href="{{ route('facilities.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div x-data="{ confirmSave: false }">
<!-- Header with stepper -->
<div class="mb-8">
<h1 class="text-2xl font-bold text-gray-900">{{ __('تعيين المجموعات على الملاعب') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('تعيين المجموعات على الملاعب') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('اختر المجموعة، حدد الجدول، ثم انقر على القطع المطلوبة من الملعب') }}</p>
<!-- Progress Steps -->
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('إنشاء خطة دفع') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('إنشاء خطة دفع') }}</h1>
</div>
@if(session('success'))
<div class="mb-4 p-3 bg-green-50 border border-green-200 rounded-lg text-green-700 text-sm">{{ session('success') }}</div>
@endif
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-3 sm:gap-4">
<!-- Configuration -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('إعدادات الخطة') }}</h3>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h3 class="text-base sm:text-lg font-semibold text-gray-800 mb-4">{{ __('إعدادات الخطة') }}</h3>
<div class="space-y-4">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('الفاتورة') }}</label>
<select wire:model.live="invoiceId" class="w-full rounded-lg border-gray-300 text-sm">
<select wire:model.live="invoiceId" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
<option value="">{{ __('اختر فاتورة') }}</option>
@foreach($invoices as $inv)
<option value="{{ $inv->id }}">
......@@ -35,18 +35,18 @@
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('دفعة مقدمة (ج.م)') }}</label>
<input type="number" wire:model.live.debounce.500ms="downPayment" dir="ltr" min="0"
class="w-full rounded-lg border-gray-300 text-sm">
class="w-full rounded-lg border-gray-300 text-sm py-2.5">
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('عدد الأقساط') }}</label>
<input type="number" wire:model.live="installmentCount" dir="ltr" min="2" max="24"
class="w-full rounded-lg border-gray-300 text-sm">
class="w-full rounded-lg border-gray-300 text-sm py-2.5">
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('التكرار') }}</label>
<select wire:model.live="frequency" class="w-full rounded-lg border-gray-300 text-sm">
<select wire:model.live="frequency" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
<option value="weekly">{{ __('أسبوعي') }}</option>
<option value="biweekly">{{ __('كل أسبوعين') }}</option>
<option value="monthly">{{ __('شهري') }}</option>
......@@ -56,14 +56,14 @@ class="w-full rounded-lg border-gray-300 text-sm">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('تاريخ أول قسط') }}</label>
<input type="date" wire:model.live="startDate" dir="ltr"
class="w-full rounded-lg border-gray-300 text-sm">
class="w-full rounded-lg border-gray-300 text-sm py-2.5">
</div>
</div>
</div>
<!-- Preview -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('معاينة الأقساط') }}</h3>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h3 class="text-base sm:text-lg font-semibold text-gray-800 mb-4">{{ __('معاينة الأقساط') }}</h3>
@if(count($installments) > 0)
<div class="space-y-2">
......@@ -93,7 +93,7 @@ class="w-full rounded-lg border-gray-300 text-sm">
</div>
<button wire:click="save" wire:loading.attr="disabled"
class="w-full mt-6 px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 text-sm font-medium">
class="w-full mt-6 px-6 py-2.5 sm:py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 text-sm font-medium">
<span wire:loading.remove wire:target="save">{{ __('إنشاء خطة الدفع') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الإنشاء...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('المجموعات التدريبية') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('المجموعات التدريبية') }}</h1>
@can('groups.create')
<a href="{{ route('groups.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
......@@ -2,7 +2,7 @@
{{-- Header --}}
<div class="flex items-center justify-between mb-8">
<div>
<h1 class="text-2xl font-bold text-gray-800">{{ __('بوابة ولي الأمر') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('بوابة ولي الأمر') }}</h1>
<p class="text-sm text-gray-500 mt-1">{{ __('متابعة أبنائك ومعلوماتهم') }}</p>
</div>
</div>
......@@ -84,7 +84,7 @@
@else
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
@foreach($children as $child)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
{{-- Child Header --}}
<div class="flex items-start justify-between mb-4">
<div class="flex items-center gap-3">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('حركة المخزون') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('حركة المخزون') }}</h1>
</div>
{{-- Filters --}}
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل المنتج') : __('إضافة منتج جديد') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل المنتج') : __('إضافة منتج جديد') }}</h1>
<a href="{{ route('inventory.products') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">{{ __('← العودة') }}</a>
</div>
......@@ -12,9 +12,9 @@
@endif
<form wire:submit="save" class="space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('البيانات الأساسية') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-4">{{ __('البيانات الأساسية') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-3 sm:gap-4">
{{-- Name AR --}}
<div>
<label for="name_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم المنتج بالعربية') }} *</label>
......@@ -75,9 +75,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Pricing Section --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('التسعير') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-4">{{ __('التسعير') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-3 sm:gap-4">
{{-- Selling Price --}}
<div>
<label for="selling_price" class="block text-sm font-medium text-gray-700 mb-1">{{ __('سعر البيع (ج.م)') }} *</label>
......@@ -105,9 +105,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Inventory Section --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('إعدادات المخزون') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-4">{{ __('إعدادات المخزون') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-3 gap-3 sm:gap-4">
{{-- Track Inventory --}}
<div class="flex items-center md:col-span-3">
<label class="flex items-center gap-2 cursor-pointer">
......@@ -138,7 +138,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Description --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div>
<label for="description_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الوصف') }}</label>
<textarea id="description_ar" wire:model="description_ar" rows="3"
......@@ -157,14 +157,14 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
</div>
{{-- Actions --}}
<div class="flex items-center gap-4">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('inventory.products') }}" wire:navigate
class="text-center px-4 sm:px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors">{{ __('إلغاء') }}</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
class="text-center px-4 sm:px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
<span wire:loading.remove wire:target="save">{{ $editing ? __('حفظ التعديلات') : __('إنشاء المنتج') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('inventory.products') }}" wire:navigate
class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors">{{ __('إلغاء') }}</a>
</div>
</form>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('المنتجات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('المنتجات') }}</h1>
@can('inventory.create')
<a href="{{ route('inventory.products.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('تسوية المخزون') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('تسوية المخزون') }}</h1>
</div>
{{-- Flash Messages --}}
......@@ -15,15 +15,15 @@
</div>
@endif
<form wire:submit="save" class="space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('بيانات التسوية') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<form wire:submit="save" class="space-y-4 sm:space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-4">{{ __('بيانات التسوية') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-3 sm:gap-4">
{{-- Product --}}
<div>
<label for="product_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المنتج') }} *</label>
<select id="product_id" wire:model="product_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('product_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('product_id') border-red-500 @enderror">
<option value="">{{ __('-- اختر المنتج --') }}</option>
@foreach($products as $product)
<option value="{{ $product->id }}">{{ $product->name_ar }} ({{ $product->sku }})</option>
......@@ -36,7 +36,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="warehouse_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المستودع') }} *</label>
<select id="warehouse_id" wire:model="warehouse_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('warehouse_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('warehouse_id') border-red-500 @enderror">
<option value="">{{ __('-- اختر المستودع --') }}</option>
@foreach($warehouses as $warehouse)
<option value="{{ $warehouse->id }}">{{ $warehouse->name_ar }} ({{ $warehouse->code }})</option>
......@@ -49,7 +49,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="adjustment_type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع التسوية') }} *</label>
<select id="adjustment_type" wire:model="adjustment_type"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('adjustment_type') border-red-500 @enderror">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('adjustment_type') border-red-500 @enderror">
<option value="adjustment_up">{{ __('تسوية بالزيادة (إضافة)') }}</option>
<option value="adjustment_down">{{ __('تسوية بالنقص (خصم)') }}</option>
</select>
......@@ -60,7 +60,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="quantity" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الكمية') }} *</label>
<input type="number" id="quantity" wire:model="quantity" min="1" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('quantity') border-red-500 @enderror">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('quantity') border-red-500 @enderror">
@error('quantity') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -68,7 +68,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="reference_number" class="block text-sm font-medium text-gray-700 mb-1">{{ __('رقم مرجعي') }}</label>
<input type="text" id="reference_number" wire:model="reference_number" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('reference_number') border-red-500 @enderror"
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('reference_number') border-red-500 @enderror"
placeholder="{{ __('اختياري') }}">
@error('reference_number') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -77,7 +77,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div class="md:col-span-2">
<label for="reason" class="block text-sm font-medium text-gray-700 mb-1">{{ __('سبب التسوية') }} *</label>
<textarea id="reason" wire:model="reason" rows="3"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('reason') border-red-500 @enderror"
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm @error('reason') border-red-500 @enderror"
placeholder="{{ __('أدخل سبب التسوية...') }}"></textarea>
@error('reason') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -85,9 +85,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Actions --}}
<div class="flex items-center gap-4">
<div class="flex flex-col-reverse sm:flex-row gap-3">
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
class="w-full sm:w-auto px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors text-sm">
<span wire:loading.remove wire:target="save">{{ __('تنفيذ التسوية') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ التنفيذ...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل المستودع') : __('إضافة مستودع جديد') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ $editing ? __('تعديل المستودع') : __('إضافة مستودع جديد') }}</h1>
<a href="{{ route('inventory.warehouses') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">{{ __('← العودة') }}</a>
</div>
......@@ -12,13 +12,13 @@
@endif
<form wire:submit="save" class="space-y-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Name AR --}}
<div>
<label for="name_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم المستودع بالعربية') }} *</label>
<input type="text" id="name_ar" wire:model="name_ar"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name_ar') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name_ar') border-red-500 @enderror">
@error('name_ar') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -26,7 +26,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="name" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم المستودع بالإنجليزية') }}</label>
<input type="text" id="name" wire:model="name" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('name') border-red-500 @enderror">
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -34,7 +34,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="code" class="block text-sm font-medium text-gray-700 mb-1">{{ __('كود المستودع') }} *</label>
<input type="text" id="code" wire:model="code" dir="ltr"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('code') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('code') border-red-500 @enderror">
@error('code') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -42,7 +42,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع المستودع') }} *</label>
<select id="type" wire:model="type"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('type') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('type') border-red-500 @enderror">
@foreach($typeOptions as $value => $label)
<option value="{{ $value }}">{{ __($label) }}</option>
@endforeach
......@@ -54,7 +54,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="branch_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الفرع') }}</label>
<select id="branch_id" wire:model="branch_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('branch_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('branch_id') border-red-500 @enderror">
<option value="">{{ __('-- اختر الفرع --') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -67,7 +67,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="manager_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المدير المسؤول') }}</label>
<select id="manager_id" wire:model="manager_id"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('manager_id') border-red-500 @enderror">
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('manager_id') border-red-500 @enderror">
<option value="">{{ __('-- اختر المدير --') }}</option>
@foreach($managers as $manager)
<option value="{{ $manager->id }}">{{ $manager->name_ar ?? $manager->name }}</option>
......@@ -77,16 +77,16 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Address --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="address" class="block text-sm font-medium text-gray-700 mb-1">{{ __('العنوان') }}</label>
<textarea id="address" wire:model="address" rows="2"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('address') border-red-500 @enderror"></textarea>
class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('address') border-red-500 @enderror"></textarea>
@error('address') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
</div>
{{-- Is Active --}}
<div class="mt-4">
<div class="mt-4 min-h-[44px] flex items-center">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="is_active"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
......@@ -96,14 +96,14 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
</div>
{{-- Actions --}}
<div class="flex items-center gap-4">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('inventory.warehouses') }}" wire:navigate
class="text-center px-4 sm:px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors">{{ __('إلغاء') }}</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
class="text-center px-4 sm:px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
<span wire:loading.remove wire:target="save">{{ $editing ? __('حفظ التعديلات') : __('إنشاء المستودع') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('inventory.warehouses') }}" wire:navigate
class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 transition-colors">{{ __('إلغاء') }}</a>
</div>
</form>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('المستودعات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('المستودعات') }}</h1>
@can('inventory.create')
<a href="{{ route('inventory.warehouses.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('الفواتير') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('الفواتير') }}</h1>
<div class="flex items-center gap-2">
<a href="{{ route('export.invoices', ['status' => $status ?? '']) }}"
class="inline-flex items-center gap-2 px-3 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 text-sm font-medium">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('فاتورة') }} #{{ $invoice->number }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('فاتورة') }} #{{ $invoice->number }}</h1>
<a href="{{ route('invoices.list') }}" wire:navigate
class="text-gray-600 hover:text-gray-800 text-sm font-medium">
{{ __('العودة للفواتير') }}
......@@ -19,12 +19,12 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
</div>
@endif
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-4 sm:gap-6">
{{-- Main Content --}}
<div class="lg:col-span-2 space-y-6">
{{-- Invoice Header --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="flex items-start justify-between mb-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="flex flex-col sm:flex-row sm:items-start justify-between gap-3 mb-4">
<div>
<p class="text-sm text-gray-500">{{ __('رقم الفاتورة') }}</p>
<p class="text-lg font-bold text-gray-800" dir="ltr">{{ $invoice->number }}</p>
......@@ -84,8 +84,8 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
</div>
{{-- Items Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="px-6 py-4 border-b border-gray-200">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden overflow-x-auto">
<div class="px-4 sm:px-6 py-3 sm:py-4 border-b border-gray-200">
<h2 class="text-lg font-semibold text-gray-800">{{ __('عناصر الفاتورة') }}</h2>
</div>
<table class="w-full text-sm">
......@@ -141,8 +141,8 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
</div>
{{-- Payments History --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="px-6 py-4 border-b border-gray-200">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden overflow-x-auto">
<div class="px-4 sm:px-6 py-3 sm:py-4 border-b border-gray-200">
<h2 class="text-lg font-semibold text-gray-800">{{ __('سجل المدفوعات') }}</h2>
</div>
@if($invoice->payments->count() > 0)
......@@ -222,7 +222,7 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
{{-- Sidebar --}}
<div class="lg:col-span-1 space-y-6">
{{-- Financial Summary --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('الملخص المالي') }}</h2>
<div class="space-y-3">
<div class="flex justify-between text-sm">
......@@ -246,7 +246,7 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
{{-- Record Payment Form --}}
@if($this->canRecordPayment)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6" x-data="{ showPayment: false }">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6" x-data="{ showPayment: false }">
<div class="flex items-center justify-between mb-4">
<h2 class="text-lg font-semibold text-gray-800">{{ __('تسجيل دفعة') }}</h2>
<button type="button" @click="showPayment = !showPayment"
......@@ -308,7 +308,7 @@ class="w-full flex items-center justify-center gap-2 px-4 py-2.5 bg-green-600 te
{{-- Actions --}}
@if($this->canCancel)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('إجراءات') }}</h2>
<button type="button" wire:click="cancelInvoice"
wire:loading.attr="disabled"
......
<div>
{{-- Header --}}
<div class="flex items-center justify-between mb-6">
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<div class="flex items-center gap-3">
<h1 class="text-2xl font-bold text-gray-800">{{ __('الإشعارات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('الإشعارات') }}</h1>
@if($unreadCount > 0)
<span class="inline-flex items-center justify-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-700">
{{ $unreadCount }}
......@@ -11,7 +11,7 @@
</div>
@if($unreadCount > 0)
<button wire:click="markAllAsRead" wire:loading.attr="disabled" wire:target="markAllAsRead"
class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium transition-colors">
class="inline-flex items-center gap-2 px-4 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium transition-colors w-full sm:w-auto justify-center">
<span wire:loading.remove wire:target="markAllAsRead">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>
</span>
......@@ -26,11 +26,11 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
{{-- Filter Tabs --}}
<div class="flex gap-2 mb-4">
<button wire:click="$set('filter', 'all')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {{ $filter === 'all' ? 'bg-blue-600 text-white' : 'bg-white text-gray-700 border border-gray-200 hover:bg-gray-50' }}">
class="px-4 py-2.5 rounded-lg text-sm font-medium transition-colors {{ $filter === 'all' ? 'bg-blue-600 text-white' : 'bg-white text-gray-700 border border-gray-200 hover:bg-gray-50' }}">
{{ __('الكل') }}
</button>
<button wire:click="$set('filter', 'unread')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {{ $filter === 'unread' ? 'bg-blue-600 text-white' : 'bg-white text-gray-700 border border-gray-200 hover:bg-gray-50' }}">
class="px-4 py-2.5 rounded-lg text-sm font-medium transition-colors {{ $filter === 'unread' ? 'bg-blue-600 text-white' : 'bg-white text-gray-700 border border-gray-200 hover:bg-gray-50' }}">
{{ __('غير مقروء') }}
@if($unreadCount > 0)
<span class="inline-flex items-center justify-center ms-1 px-1.5 py-0.5 rounded-full text-xs {{ $filter === 'unread' ? 'bg-blue-500 text-white' : 'bg-red-100 text-red-700' }}">
......@@ -44,8 +44,8 @@ class="px-4 py-2 rounded-lg text-sm font-medium transition-colors {{ $filter ===
<div class="space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($notifications as $notification)
<div wire:click="markAsRead({{ $notification->id }})"
class="bg-white rounded-xl border {{ $notification->status->value === 'sent' ? 'border-blue-200 bg-blue-50/30' : 'border-gray-200' }} p-4 cursor-pointer hover:shadow-sm transition-all">
<div class="flex items-start gap-3">
class="bg-white rounded-xl border {{ $notification->status->value === 'sent' ? 'border-blue-200 bg-blue-50/30' : 'border-gray-200' }} p-3 sm:p-4 cursor-pointer hover:shadow-sm transition-all">
<div class="flex items-start gap-2 sm:gap-3">
{{-- Unread Indicator --}}
<div class="flex-shrink-0 pt-1">
@if($notification->status->value === 'sent')
......@@ -57,7 +57,7 @@ class="bg-white rounded-xl border {{ $notification->status->value === 'sent' ? '
{{-- Content --}}
<div class="flex-1 min-w-0">
<div class="flex items-center gap-2 mb-1">
<div class="flex flex-wrap items-center gap-1.5 sm:gap-2 mb-1">
<span class="inline-flex items-center px-2 py-0.5 rounded text-xs font-medium bg-gray-100 text-gray-600">
{{ $notification->event_type }}
</span>
......@@ -81,8 +81,8 @@ class="bg-white rounded-xl border {{ $notification->status->value === 'sent' ? '
</div>
</div>
@empty
<div class="bg-white rounded-xl border border-gray-200 p-12 text-center">
<svg class="w-16 h-16 text-gray-300 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl border border-gray-200 p-8 sm:p-12 text-center">
<svg class="w-12 h-12 sm:w-16 sm:h-16 text-gray-300 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9"/>
</svg>
<p class="text-gray-500 text-sm">{{ $filter === 'unread' ? __('لا توجد إشعارات غير مقروءة') : __('لا توجد إشعارات') }}</p>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('سجل الإشعارات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('سجل الإشعارات') }}</h1>
</div>
{{-- Filters --}}
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">
{{ $template ? __('تعديل قالب الإشعار') : __('إنشاء قالب إشعار') }}
</h1>
<a href="{{ route('notifications.templates') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
class="inline-flex items-center gap-2 px-4 py-2.5 sm:py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium w-full sm:w-auto justify-center">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"/></svg>
{{ __('رجوع') }}
</a>
</div>
<form wire:submit="save" class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<form wire:submit="save" class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Event Type --}}
<div>
<label for="event_type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع الحدث') }} <span class="text-red-500">*</span></label>
<select wire:model.live="event_type" id="event_type"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="">{{ __('اختر نوع الحدث') }}</option>
@foreach($this->eventTypes as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
......@@ -29,7 +29,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="channel" class="block text-sm font-medium text-gray-700 mb-1">{{ __('القناة') }} <span class="text-red-500">*</span></label>
<select wire:model="channel" id="channel"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="">{{ __('اختر القناة') }}</option>
@foreach($channels as $ch)
<option value="{{ $ch->value }}">{{ $ch->label() }}</option>
......@@ -39,26 +39,26 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Subject (for email) --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="subject" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الموضوع') }} <span class="text-xs text-gray-400">({{ __('للبريد الإلكتروني') }})</span></label>
<input type="text" wire:model="subject" id="subject"
placeholder="{{ __('موضوع الإشعار (يدعم {{متغيرات}})') }}"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
@error('subject') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
{{-- Body --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="body" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نص الإشعار') }} <span class="text-red-500">*</span></label>
<textarea wire:model="body" id="body" rows="5"
placeholder="{{ __('نص الإشعار — استخدم {{اسم_المتغير}} للقيم الديناميكية') }}"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"></textarea>
@error('body') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
{{-- Available Variables Hint --}}
@if(!empty($this->availableVariables))
<div class="md:col-span-2">
<div class="sm:col-span-2">
<div class="p-3 bg-blue-50 border border-blue-200 rounded-lg">
<p class="text-xs font-medium text-blue-700 mb-1">{{ __('المتغيرات المتاحة لهذا الحدث:') }}</p>
<div class="flex flex-wrap gap-2">
......@@ -71,11 +71,11 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endif
{{-- Variables (comma-separated) --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="variables_text" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المتغيرات المطلوبة') }} <span class="text-xs text-gray-400">({{ __('مفصولة بفاصلة') }})</span></label>
<input type="text" wire:model="variables_text" id="variables_text" dir="ltr"
placeholder="participant_name, amount, due_date"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
@error('variables_text') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
<p class="mt-1 text-xs text-gray-500">{{ __('أسماء المتغيرات التي يجب توفيرها عند إرسال هذا الإشعار') }}</p>
</div>
......@@ -84,7 +84,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="locale" class="block text-sm font-medium text-gray-700 mb-1">{{ __('اللغة') }}</label>
<select wire:model="locale" id="locale"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
class="w-full px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="ar">{{ __('العربية') }}</option>
<option value="en">{{ __('English') }}</option>
</select>
......@@ -92,7 +92,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Active --}}
<div class="flex items-center gap-3 pt-6">
<div class="min-h-[44px] flex items-center gap-3 pt-6">
<label class="relative inline-flex items-center cursor-pointer">
<input type="checkbox" wire:model="is_active" class="sr-only peer">
<div class="w-11 h-6 bg-gray-200 peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-blue-100 rounded-full peer peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-blue-600"></div>
......@@ -102,16 +102,16 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Submit --}}
<div class="mt-6 flex items-center gap-3 pt-4 border-t border-gray-200">
<div class="mt-6 flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3 pt-4 border-t border-gray-200">
<a href="{{ route('notifications.templates') }}" wire:navigate
class="px-6 py-2.5 sm:py-2 text-gray-700 rounded-lg hover:bg-gray-100 text-sm font-medium text-center w-full sm:w-auto">
{{ __('إلغاء') }}
</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="inline-flex items-center gap-2 px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed">
class="inline-flex items-center justify-center gap-2 px-6 py-2.5 sm:py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed w-full sm:w-auto">
<span wire:loading.remove wire:target="save">{{ __('حفظ') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('notifications.templates') }}" wire:navigate
class="px-6 py-2.5 text-gray-700 rounded-lg hover:bg-gray-100 text-sm font-medium">
{{ __('إلغاء') }}
</a>
</div>
</form>
</div>
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('قوالب الإشعارات') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('قوالب الإشعارات') }}</h1>
<a href="{{ route('notifications.templates.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
......
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="p-4 border-b border-gray-200 flex items-center justify-between">
<h3 class="text-lg font-semibold text-gray-800">{{ __('سجل التسجيل') }} ({{ $totalCount }})</h3>
<div class="p-4 sm:p-6 border-b border-gray-200 flex flex-col sm:flex-row sm:items-center justify-between gap-2">
<h3 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('سجل التسجيل') }} ({{ $totalCount }})</h3>
</div>
@if($enrollments->isEmpty())
......@@ -8,18 +8,18 @@
@else
<div class="divide-y divide-gray-100">
@foreach($enrollments as $enrollment)
<div class="p-4 hover:bg-gray-50">
<div class="flex items-center justify-between">
<div>
<p class="text-sm font-medium text-gray-800">
<div class="p-3 sm:p-4 hover:bg-gray-50">
<div class="flex items-start sm:items-center justify-between gap-2">
<div class="min-w-0 flex-1">
<p class="text-sm font-medium text-gray-800 truncate">
{{ $enrollment->trainingGroup?->program?->name_ar ?? '-' }}
</p>
<p class="text-xs text-gray-500 mt-1">
{{ $enrollment->trainingGroup?->name_ar ?? '-' }}
&bull; {{ $enrollment->created_at->format('Y-m-d') }}
&bull; <span dir="ltr">{{ $enrollment->created_at->format('Y-m-d') }}</span>
</p>
</div>
<span class="px-2 py-1 text-xs rounded-full font-medium
<span class="px-2 py-1 text-xs rounded-full font-medium shrink-0
@switch($enrollment->status)
@case('active') bg-green-100 text-green-700 @break
@case('completed') bg-blue-100 text-blue-700 @break
......@@ -37,7 +37,7 @@
@if($totalCount > 5)
<div class="p-3 border-t border-gray-200 text-center">
<button wire:click="toggleShowAll" class="text-sm text-blue-600 hover:text-blue-800">
<button wire:click="toggleShowAll" class="text-sm text-blue-600 hover:text-blue-800 py-2">
{{ $showAll ? __('عرض أقل') : __('عرض الكل') . " ({$totalCount})" }}
</button>
</div>
......
<div>
@if($participant->status === 'active')
<button wire:click="openFreeze" class="px-3 py-1.5 text-xs bg-blue-100 text-blue-700 rounded-lg hover:bg-blue-200">
<button wire:click="openFreeze" class="px-3 py-2.5 text-xs bg-blue-100 text-blue-700 rounded-lg hover:bg-blue-200">
{{ __('تجميد') }}
</button>
@elseif($participant->status === 'frozen')
<button wire:click="openUnfreeze" class="px-3 py-1.5 text-xs bg-green-100 text-green-700 rounded-lg hover:bg-green-200">
<button wire:click="openUnfreeze" class="px-3 py-2.5 text-xs bg-green-100 text-green-700 rounded-lg hover:bg-green-200">
{{ __('إلغاء التجميد') }}
</button>
@endif
@if($showModal)
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50" wire:click.self="$set('showModal', false)">
<div class="bg-white rounded-xl shadow-xl w-full max-w-md p-6">
<h3 class="text-lg font-bold text-gray-800 mb-4">
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4" wire:click.self="$set('showModal', false)">
<div class="bg-white rounded-xl shadow-xl w-full max-w-md p-4 sm:p-6">
<h3 class="text-base sm:text-lg font-bold text-gray-800 mb-4">
{{ $action === 'freeze' ? __('تجميد المشترك') : __('إلغاء تجميد المشترك') }}
</h3>
<p class="text-sm text-gray-600 mb-4">
......@@ -23,16 +23,16 @@
</p>
<div class="mb-4">
<label class="block text-sm text-gray-600 mb-1">{{ __('السبب') }} *</label>
<textarea wire:model="reason" rows="3" class="w-full rounded-lg border-gray-300 text-sm"
<textarea wire:model="reason" rows="3" class="w-full rounded-lg border-gray-300 text-sm py-2.5"
placeholder="{{ __('أدخل سبب الإجراء') }}"></textarea>
@error('reason') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
</div>
<div class="flex gap-2 justify-end">
<button wire:click="$set('showModal', false)" class="px-4 py-2 text-sm text-gray-600 hover:text-gray-800">
<div class="flex flex-col-reverse sm:flex-row gap-3 sm:justify-end">
<button wire:click="$set('showModal', false)" class="w-full sm:w-auto px-4 py-2.5 text-sm text-gray-600 hover:text-gray-800">
{{ __('إلغاء') }}
</button>
<button wire:click="confirm" wire:loading.attr="disabled"
class="px-4 py-2 text-sm text-white rounded-lg {{ $action === 'freeze' ? 'bg-blue-600 hover:bg-blue-700' : 'bg-green-600 hover:bg-green-700' }} disabled:opacity-50">
class="w-full sm:w-auto px-4 py-2.5 text-sm text-white rounded-lg {{ $action === 'freeze' ? 'bg-blue-600 hover:bg-blue-700' : 'bg-green-600 hover:bg-green-700' }} disabled:opacity-50">
<span wire:loading.remove wire:target="confirm">{{ __('تأكيد') }}</span>
<span wire:loading wire:target="confirm">{{ __('جارٍ...') }}</span>
</button>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('استيراد مشتركين من CSV') }}</h1>
<div class="flex flex-col sm:flex-row sm:items-center justify-between gap-3 mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('استيراد مشتركين من CSV') }}</h1>
<a href="{{ route('participants.list') }}" wire:navigate
class="text-sm text-blue-600 hover:text-blue-800">{{ __('العودة للقائمة') }}</a>
</div>
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('السجل العام') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('السجل العام') }}</h1>
@can('participants.create')
<a href="{{ route('people.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('قواعد التسعير') }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('قواعد التسعير') }}</h1>
@can('pricing.create')
<a href="{{ route('pricing.rules.create') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment