Skip to content

E
El-Captain Sports Management
Commit 944501f1 authored by Mahmoud Aglan's avatar Mahmoud Aglan
Browse files
Options

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
Show whitespace changes
Inline Side-by-side
Showing with 2620 additions and 1576 deletions
resources/css/app.css
View file @ 944501f1
......@@ -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;
}
}
resources/views/components/layouts/sidebar.blade.php
View file @ 944501f1
......@@ -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)
......
resources/views/components/layouts/topbar.blade.php
View file @ 944501f1
<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 -->
<!-- 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 -->
<!-- Desktop-only: Language + Dark Mode -->
<div class="hidden lg:flex items-center gap-2">
@livewire('components.language-switcher')
<!-- Dark Mode -->
@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>
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 text-start px-4 py-2 text-sm text-red-600 hover:bg-red-50">{{ __('تسجيل الخروج') }}</button>
<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>
</div>
</header>
resources/views/layouts/app.blade.php
View file @ 944501f1
......@@ -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
......
resources/views/layouts/guest.blade.php
View file @ 944501f1
@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>
......
resources/views/livewire/activities/activity-form.blade.php
View file @ 944501f1
<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>
resources/views/livewire/activities/activity-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/admin/activity-log.blade.php
View file @ 944501f1
<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>
......@@ -384,6 +448,7 @@ class="px-3 py-1.5 rounded-md text-xs font-medium border transition-colors">
</tbody>
</table>
</div>
</div>
{{-- Pagination --}}
@if($logs->hasPages())
......
resources/views/livewire/admin/super-admin-panel.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/admin/system-settings.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/assignments/assignment-form.blade.php
View file @ 944501f1
<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('assignments.list') }}" wire:navigate
class="inline-flex items-center gap-2 px-4 py-2 text-gray-700 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="M10 19l-7-7m0 0l7-7m-7 7h18"/></svg>
......@@ -17,17 +17,17 @@ class="inline-flex items-center gap-2 px-4 py-2 text-gray-700 bg-gray-100 rounde
<form wire:submit="save" class="space-y-6">
{{-- Main Info Card --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('بيانات التكليف') }}</h2>
<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-800 mb-4">{{ __('بيانات التكليف') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- User Selection --}}
<div>
<label for="user_id" class="block text-sm font-medium text-gray-700 mb-1">
{{ __('المستخدم') }} <span class="text-red-500">*</span>
</label>
<select wire:model="user_id" id="user_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">
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">
<option value="">{{ __('اختر المستخدم...') }}</option>
@foreach($users as $user)
<option value="{{ $user->id }}">{{ $user->name_ar ?? $user->name }}</option>
......@@ -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.live="assignable_type" id="assignable_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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="group">{{ __('مجموعة تدريبية') }}</option>
<option value="session">{{ __('حصة تدريبية') }}</option>
</select>
......@@ -59,7 +59,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ $assignable_type === 'group' ? __('المجموعة') : __('الحصة') }} <span class="text-red-500">*</span>
</label>
<select wire:model="assignable_id" id="assignable_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">
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">
<option value="">{{ __('اختر...') }}</option>
@foreach($assignableOptions as $id => $label)
<option value="{{ $id }}">{{ $label }}</option>
......@@ -76,7 +76,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="scope" id="scope"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
@foreach($scopeOptions as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
@endforeach
......@@ -93,14 +93,14 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</label>
<input type="text" wire:model="role_label" id="role_label"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
@error('role_label')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
</div>
{{-- Is Primary --}}
<div class="flex items-center gap-3 pt-6">
<div class="min-h-[44px] flex items-center gap-3 pt-6">
<input type="checkbox" wire:model="is_primary" id="is_primary"
class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<label for="is_primary" class="text-sm font-medium text-gray-700">
......@@ -111,17 +111,17 @@ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
</div>
{{-- Schedule Card --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('الجدول الزمني') }}</h2>
<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-800 mb-4">{{ __('الجدول الزمني') }}</h2>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Start Date --}}
<div>
<label for="start_date" class="block text-sm font-medium text-gray-700 mb-1">
{{ __('تاريخ البداية') }} <span class="text-red-500">*</span>
</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">
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')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
......@@ -133,7 +133,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="end_date" id="end_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">
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('end_date')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
......@@ -145,7 +145,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('وقت البداية') }}
</label>
<input type="time" wire:model="start_time" id="start_time" 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 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_time')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
......@@ -157,7 +157,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __('وقت النهاية') }}
</label>
<input type="time" wire:model="end_time" id="end_time" 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 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('end_time')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
......@@ -165,13 +165,13 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Schedule Days --}}
<div class="mt-6">
<div class="mt-4 sm:mt-6">
<label class="block text-sm font-medium text-gray-700 mb-2">
{{ __('أيام التكليف') }}
</label>
<div class="flex flex-wrap gap-3">
<div class="flex flex-wrap gap-2 sm:gap-3">
@foreach($dayLabels as $dayNum => $dayName)
<label class="inline-flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50 has-[:checked]:bg-blue-50 has-[:checked]:border-blue-300">
<label class="min-h-[44px] inline-flex items-center gap-2 px-3 py-2 border border-gray-300 rounded-lg cursor-pointer hover:bg-gray-50 has-[:checked]:bg-blue-50 has-[:checked]:border-blue-300">
<input type="checkbox" wire:model="schedule_days" value="{{ $dayNum }}"
class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ $dayName }}</span>
......@@ -185,26 +185,26 @@ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
</div>
{{-- Notes Card --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('ملاحظات') }}</h2>
<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-800 mb-4">{{ __('ملاحظات') }}</h2>
<textarea wire:model="notes" rows="3"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"></textarea>
@error('notes')
<p class="mt-1 text-sm text-red-600">{{ $message }}</p>
@enderror
</div>
{{-- Submit --}}
<div class="flex items-center justify-end gap-3">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('assignments.list') }}" wire:navigate
class="px-6 py-2 text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200 text-sm font-medium">
class="text-center px-4 sm:px-6 py-2.5 text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200 text-sm 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>
......
resources/views/livewire/assignments/assignment-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/attendance/attendance-list.blade.php
View file @ 944501f1
<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() }}
......
resources/views/livewire/attendance/quick-attendance.blade.php
View file @ 944501f1
<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>
<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 --}}
@if (session('success'))
......@@ -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"
......
resources/views/livewire/attendance/take-attendance.blade.php
View file @ 944501f1
<div>
<!-- Header -->
<div class="mb-6">
<div class="flex items-center justify-between">
<div class="mb-4 sm:mb-6">
<div class="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">
{{ $session->group?->name_ar ?? '-' }} &mdash;
{{ $session->session_date->format('Y-m-d') }}
......@@ -11,7 +11,7 @@
</p>
</div>
<a href="{{ route('attendance.list') }}"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50">
class="w-full sm:w-auto inline-flex items-center justify-center gap-2 px-4 py-2.5 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-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="M10 19l-7-7m0 0l7-7m-7 7h18"/></svg>
{{ __('العودة') }}
</a>
......@@ -19,35 +19,35 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-gray-70
</div>
<!-- Summary Cards -->
<div class="grid grid-cols-2 gap-4 mb-6 sm:grid-cols-3 lg:grid-cols-6">
<div class="p-4 bg-white border border-gray-200 rounded-lg">
<div class="grid grid-cols-3 lg:grid-cols-6 gap-2 sm:gap-4 mb-4 sm:mb-6">
<div class="p-3 sm:p-4 bg-white border border-gray-200 rounded-lg">
<p class="text-sm text-gray-500">{{ __('الإجمالي') }}</p>
<p class="text-2xl font-bold text-gray-900" dir="ltr">{{ $summary['total'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-gray-900" dir="ltr">{{ $summary['total'] }}</p>
</div>
<div class="p-4 bg-green-50 border border-green-200 rounded-lg">
<div class="p-3 sm:p-4 bg-green-50 border border-green-200 rounded-lg">
<p class="text-sm text-green-700">{{ __('حاضر') }}</p>
<p class="text-2xl font-bold text-green-700" dir="ltr">{{ $summary['present'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-green-700" dir="ltr">{{ $summary['present'] }}</p>
</div>
<div class="p-4 bg-amber-50 border border-amber-200 rounded-lg">
<div class="p-3 sm:p-4 bg-amber-50 border border-amber-200 rounded-lg">
<p class="text-sm text-amber-700">{{ __('متأخر') }}</p>
<p class="text-2xl font-bold text-amber-700" dir="ltr">{{ $summary['late'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-amber-700" dir="ltr">{{ $summary['late'] }}</p>
</div>
<div class="p-4 bg-red-50 border border-red-200 rounded-lg">
<div class="p-3 sm:p-4 bg-red-50 border border-red-200 rounded-lg">
<p class="text-sm text-red-700">{{ __('غائب') }}</p>
<p class="text-2xl font-bold text-red-700" dir="ltr">{{ $summary['absent'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-red-700" dir="ltr">{{ $summary['absent'] }}</p>
</div>
<div class="p-4 bg-gray-50 border border-gray-200 rounded-lg">
<div class="p-3 sm:p-4 bg-gray-50 border border-gray-200 rounded-lg">
<p class="text-sm text-gray-500">{{ __('متبقي') }}</p>
<p class="text-2xl font-bold text-gray-700" dir="ltr">{{ $summary['expected'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-gray-700" dir="ltr">{{ $summary['expected'] }}</p>
</div>
<div class="p-4 bg-blue-50 border border-blue-200 rounded-lg">
<div class="p-3 sm:p-4 bg-blue-50 border border-blue-200 rounded-lg">
<p class="text-sm text-blue-700">{{ __('معذور') }}</p>
<p class="text-2xl font-bold text-blue-700" dir="ltr">{{ $summary['excused'] }}</p>
<p class="text-xl sm:text-2xl font-bold text-blue-700" dir="ltr">{{ $summary['excused'] }}</p>
</div>
</div>
<!-- Session Notes -->
<div class="mb-6 bg-white border border-gray-200 rounded-lg p-4">
<div class="mb-4 sm:mb-6 bg-white border border-gray-200 rounded-lg p-4 sm:p-6">
<label for="sessionNotes" class="block text-sm font-medium text-gray-700 mb-2">{{ __('ملاحظات الجلسة') }}</label>
<textarea
id="sessionNotes"
......@@ -61,7 +61,7 @@ class="block w-full rounded-lg border-gray-300 shadow-sm focus:border-indigo-500
wire:click="saveNotes"
wire:loading.attr="disabled"
wire:target="saveNotes"
class="inline-flex items-center gap-2 px-3 py-1.5 text-sm font-medium text-white bg-indigo-600 rounded-lg hover:bg-indigo-700 disabled:opacity-50 disabled:cursor-not-allowed">
class="inline-flex items-center gap-2 px-3 py-2.5 text-sm font-medium text-white bg-indigo-600 rounded-lg hover:bg-indigo-700 disabled:opacity-50 disabled:cursor-not-allowed">
<span wire:loading.remove wire:target="saveNotes">{{ __('حفظ الملاحظات') }}</span>
<span wire:loading wire:target="saveNotes">{{ __('جارٍ الحفظ...') }}</span>
</button>
......@@ -78,7 +78,7 @@ class="inline-flex items-center gap-2 px-3 py-1.5 text-sm font-medium text-white
wire:click="markAllPresent"
wire:loading.attr="disabled"
wire:target="markAllPresent"
class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white bg-green-600 rounded-lg hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed">
class="inline-flex items-center gap-2 px-4 py-2.5 text-sm font-medium text-white bg-green-600 rounded-lg hover:bg-green-700 disabled:opacity-50 disabled:cursor-not-allowed">
<span wire:loading.remove wire:target="markAllPresent">
<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 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
</span>
......@@ -99,7 +99,66 @@ class="inline-flex items-center gap-2 px-4 py-2 text-sm font-medium text-white b
<p class="mt-4 text-sm text-gray-500">{{ __('لا توجد سجلات حضور لهذه الجلسة') }}</p>
</div>
@else
<div class="overflow-x-auto">
{{-- Mobile cards --}}
<div class="md:hidden space-y-2 p-3">
@foreach($records as $record)
<div class="bg-white border border-gray-200 rounded-lg p-3">
<div class="flex items-center justify-between mb-2">
<span class="text-sm font-medium text-gray-900">
@if($record->subject_type === \App\Domain\Participant\Models\Participant::class)
{{ $record->subject?->person?->name_ar ?? '-' }}
@else
{{ $record->subject?->name_ar ?? $record->subject?->name ?? '-' }}
@endif
</span>
@php $color = $record->status->color(); @endphp
<span class="inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium
@switch($color)
@case('green') bg-green-100 text-green-800 @break
@case('amber') bg-amber-100 text-amber-800 @break
@case('red') bg-red-100 text-red-800 @break
@case('blue') bg-blue-100 text-blue-800 @break
@case('orange') bg-orange-100 text-orange-800 @break
@case('yellow') bg-yellow-100 text-yellow-800 @break
@case('purple') bg-purple-100 text-purple-800 @break
@default bg-gray-100 text-gray-800
@endswitch
">
{{ $record->status->label() }}
</span>
</div>
<div class="grid grid-cols-4 gap-1.5">
<button wire:click="markAs({{ $record->id }}, 'present')" wire:loading.attr="disabled" wire:target="markAs({{ $record->id }}, 'present')"
class="py-2.5 text-xs font-medium rounded border text-center
{{ $record->status === \App\Domain\Attendance\Enums\AttendanceStatus::Present ? 'bg-green-600 text-white border-green-600' : 'text-green-700 border-green-300 hover:bg-green-50' }} disabled:opacity-50">
<span wire:loading.remove wire:target="markAs({{ $record->id }}, 'present')">{{ __('حاضر') }}</span>
<span wire:loading wire:target="markAs({{ $record->id }}, 'present')">...</span>
</button>
<button wire:click="markAs({{ $record->id }}, 'late')" wire:loading.attr="disabled" wire:target="markAs({{ $record->id }}, 'late')"
class="py-2.5 text-xs font-medium rounded border text-center
{{ $record->status === \App\Domain\Attendance\Enums\AttendanceStatus::Late ? 'bg-amber-600 text-white border-amber-600' : 'text-amber-700 border-amber-300 hover:bg-amber-50' }} disabled:opacity-50">
<span wire:loading.remove wire:target="markAs({{ $record->id }}, 'late')">{{ __('متأخر') }}</span>
<span wire:loading wire:target="markAs({{ $record->id }}, 'late')">...</span>
</button>
<button wire:click="markAs({{ $record->id }}, 'absent')" wire:loading.attr="disabled" wire:target="markAs({{ $record->id }}, 'absent')"
class="py-2.5 text-xs font-medium rounded border text-center
{{ $record->status === \App\Domain\Attendance\Enums\AttendanceStatus::Absent ? 'bg-red-600 text-white border-red-600' : 'text-red-700 border-red-300 hover:bg-red-50' }} disabled:opacity-50">
<span wire:loading.remove wire:target="markAs({{ $record->id }}, 'absent')">{{ __('غائب') }}</span>
<span wire:loading wire:target="markAs({{ $record->id }}, 'absent')">...</span>
</button>
<button wire:click="markAs({{ $record->id }}, 'excused')" wire:loading.attr="disabled" wire:target="markAs({{ $record->id }}, 'excused')"
class="py-2.5 text-xs font-medium rounded border text-center
{{ $record->status === \App\Domain\Attendance\Enums\AttendanceStatus::Excused ? 'bg-blue-600 text-white border-blue-600' : 'text-blue-700 border-blue-300 hover:bg-blue-50' }} disabled:opacity-50">
<span wire:loading.remove wire:target="markAs({{ $record->id }}, 'excused')">{{ __('معذور') }}</span>
<span wire:loading wire:target="markAs({{ $record->id }}, 'excused')">...</span>
</button>
</div>
</div>
@endforeach
</div>
{{-- 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>
......
resources/views/livewire/audit/audit-log-list.blade.php
View file @ 944501f1
<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 --}}
......
resources/views/livewire/auth/login.blade.php
View file @ 944501f1
<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>
resources/views/livewire/branches/branch-form.blade.php
View file @ 944501f1
<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('branches.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">
← العودة للقائمة
</a>
......@@ -8,27 +8,27 @@
<form wire:submit="save" class="space-y-6">
<!-- Basic Info -->
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالعربية *</label>
<input type="text" wire:model="name_ar" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name_ar') border-red-500 @enderror">
<input type="text" wire:model="name_ar" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-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>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالإنجليزية *</label>
<input type="text" 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 @error('name') border-red-500 @enderror">
<input type="text" wire:model="name" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name') border-red-500 @enderror">
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">كود الفرع *</label>
<input type="text" 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 @error('code') border-red-500 @enderror" placeholder="e.g. BR001">
<input type="text" wire:model="code" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('code') border-red-500 @enderror" placeholder="e.g. BR001">
@error('code') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">المدير</label>
<select wire:model="manager_id" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<select wire:model="manager_id" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<option value="">— بدون مدير —</option>
@foreach($managers as $manager)
<option value="{{ $manager->id }}">{{ $manager->name_ar ?? $manager->name }}</option>
......@@ -37,12 +37,12 @@
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mt-4">
<label class="flex items-center gap-2 cursor-pointer">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4 mt-4">
<label class="min-h-[44px] flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="is_main" class="w-4 h-4 rounded border-gray-300 text-blue-600">
<span class="text-sm text-gray-700">فرع رئيسي</span>
</label>
<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">
<span class="text-sm text-gray-700">نشط</span>
</label>
......@@ -50,49 +50,49 @@
</div>
<!-- Contact Info -->
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الهاتف</label>
<input type="text" wire:model="phone" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<input type="text" wire:model="phone" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">البريد الإلكتروني</label>
<input type="email" wire:model="email" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<input type="email" wire:model="email" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
@error('email') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">العنوان</label>
<input type="text" wire:model="address" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<input type="text" wire:model="address" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">المدينة</label>
<input type="text" wire:model="city" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<input type="text" wire:model="city" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
</div>
</div>
</div>
<!-- Location -->
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">خط العرض</label>
<input type="text" wire:model="latitude" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" placeholder="30.0444">
<input type="text" wire:model="latitude" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" placeholder="30.0444">
@error('latitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">خط الطول</label>
<input type="text" wire:model="longitude" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" placeholder="31.2357">
<input type="text" wire:model="longitude" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500" placeholder="31.2357">
@error('longitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
</div>
</div>
<!-- Operating Hours -->
<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="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="space-y-3">
@php
$dayNames = [
......@@ -106,8 +106,8 @@
];
@endphp
@foreach($dayNames as $key => $dayLabel)
<div class="flex items-center gap-4 py-2 border-b border-gray-100 last:border-0">
<label class="flex items-center gap-2 w-32">
<div class="flex flex-col sm:flex-row sm:items-center gap-2 sm:gap-4 py-2 border-b border-gray-100 last:border-0">
<label class="min-h-[44px] flex items-center gap-2 w-32">
<input type="checkbox"
wire:model="operating_hours.{{ $key }}.closed"
class="w-4 h-4 rounded border-gray-300 text-red-600"
......@@ -116,10 +116,10 @@ class="w-4 h-4 rounded border-gray-300 text-red-600"
</label>
<div class="flex items-center gap-2" x-show="!$wire.operating_hours?.{{ $key }}?.closed">
<input type="time" wire:model="operating_hours.{{ $key }}.open" dir="ltr"
class="px-3 py-1.5 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500">
class="px-3 py-2.5 sm:py-1.5 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500">
<span class="text-gray-400 text-sm">—</span>
<input type="time" wire:model="operating_hours.{{ $key }}.close" dir="ltr"
class="px-3 py-1.5 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500">
class="px-3 py-2.5 sm:py-1.5 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500">
</div>
<span class="text-sm text-red-500" x-show="$wire.operating_hours?.{{ $key }}?.closed">مغلق</span>
</div>
......@@ -128,15 +128,15 @@ class="px-3 py-1.5 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:
</div>
<!-- Submit -->
<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('branches.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 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">
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 text-sm">
<span wire:loading.remove wire:target="save">{{ $editing ? 'حفظ التعديلات' : 'إنشاء الفرع' }}</span>
<span wire:loading wire:target="save">جارٍ الحفظ...</span>
</button>
<a href="{{ route('branches.list') }}" wire:navigate class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50">
إلغاء
</a>
</div>
</form>
</div>
resources/views/livewire/branches/branch-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/cash-sessions/cash-session-list.blade.php
View file @ 944501f1
<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>
resources/views/livewire/cash-sessions/cash-session-manage.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/dashboard.blade.php
View file @ 944501f1
<div>
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('لوحة التحكم') }}</h1>
<p class="text-gray-500 mt-1">{{ __('مرحباً') }} {{ auth()->user()->name_ar ?? auth()->user()->name }}</p>
<div class="mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('لوحة التحكم') }}</h1>
<p class="text-gray-500 text-sm mt-1">{{ __('مرحباً') }} {{ auth()->user()->name_ar ?? auth()->user()->name }}</p>
</div>
<!-- Row 1: Key Stats -->
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
<!-- Row 1: Key Stats — 2-col on mobile, 4-col on desktop -->
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
<!-- Active Participants -->
<div class="bg-white rounded-xl shadow-sm border border-green-200 p-6">
<div class="flex items-center gap-3">
<div class="flex-shrink-0 w-12 h-12 bg-green-50 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">
<div class="bg-white rounded-xl shadow-sm border border-green-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="shrink-0 w-9 h-9 sm:w-12 sm:h-12 bg-green-50 rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 sm:w-6 sm: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="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
</svg>
</div>
<div>
<p class="text-3xl font-bold text-green-600" dir="ltr">{{ number_format($stats['active_participants']) }}</p>
<p class="text-sm text-gray-500 mt-1">{{ __('المشتركون النشطون') }}</p>
<div class="min-w-0">
<p class="text-xl sm:text-3xl font-bold text-green-600" dir="ltr">{{ number_format($stats['active_participants']) }}</p>
<p class="text-xs sm:text-sm text-gray-500 truncate">{{ __('المشتركون النشطون') }}</p>
</div>
</div>
</div>
<!-- Active Enrollments -->
<div class="bg-white rounded-xl shadow-sm border border-blue-200 p-6">
<div class="flex items-center gap-3">
<div class="flex-shrink-0 w-12 h-12 bg-blue-50 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">
<div class="bg-white rounded-xl shadow-sm border border-blue-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="shrink-0 w-9 h-9 sm:w-12 sm:h-12 bg-blue-50 rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 sm:w-6 sm: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="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>
</div>
<div>
<p class="text-3xl font-bold text-blue-600" dir="ltr">{{ number_format($stats['active_enrollments']) }}</p>
<p class="text-sm text-gray-500 mt-1">{{ __('التسجيلات النشطة') }}</p>
<div class="min-w-0">
<p class="text-xl sm:text-3xl font-bold text-blue-600" dir="ltr">{{ number_format($stats['active_enrollments']) }}</p>
<p class="text-xs sm:text-sm text-gray-500 truncate">{{ __('التسجيلات النشطة') }}</p>
</div>
</div>
</div>
<!-- Active Groups -->
<div class="bg-white rounded-xl shadow-sm border border-purple-200 p-6">
<div class="flex items-center gap-3">
<div class="flex-shrink-0 w-12 h-12 bg-purple-50 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">
<div class="bg-white rounded-xl shadow-sm border border-purple-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="shrink-0 w-9 h-9 sm:w-12 sm:h-12 bg-purple-50 rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 sm:w-6 sm: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="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/>
</svg>
</div>
<div>
<p class="text-3xl font-bold text-purple-600" dir="ltr">{{ number_format($stats['active_groups']) }}</p>
<p class="text-sm text-gray-500 mt-1">{{ __('المجموعات النشطة') }}</p>
<div class="min-w-0">
<p class="text-xl sm:text-3xl font-bold text-purple-600" dir="ltr">{{ number_format($stats['active_groups']) }}</p>
<p class="text-xs sm:text-sm text-gray-500 truncate">{{ __('المجموعات النشطة') }}</p>
</div>
</div>
</div>
<!-- Today Sessions -->
<div class="bg-white rounded-xl shadow-sm border border-amber-200 p-6">
<div class="flex items-center gap-3">
<div class="flex-shrink-0 w-12 h-12 bg-amber-50 rounded-lg flex items-center justify-center">
<svg class="w-6 h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border border-amber-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="shrink-0 w-9 h-9 sm:w-12 sm:h-12 bg-amber-50 rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 sm:w-6 sm:h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
</svg>
</div>
<div>
<p class="text-3xl font-bold text-amber-600" dir="ltr">{{ number_format($stats['today_sessions']) }}</p>
<p class="text-sm text-gray-500 mt-1">{{ __('جلسات اليوم') }}</p>
<div class="min-w-0">
<p class="text-xl sm:text-3xl font-bold text-amber-600" dir="ltr">{{ number_format($stats['today_sessions']) }}</p>
<p class="text-xs sm:text-sm text-gray-500 truncate">{{ __('جلسات اليوم') }}</p>
</div>
</div>
</div>
</div>
<!-- Row 2: Financial Summary -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4 mb-4 sm:mb-6">
<!-- Revenue This Month -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<div class="flex items-center gap-3 mb-3">
<div class="flex-shrink-0 w-10 h-10 bg-emerald-50 rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 text-emerald-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="flex items-center gap-3 mb-2 sm:mb-3">
<div class="shrink-0 w-9 h-9 sm:w-10 sm:h-10 bg-emerald-50 rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 sm:w-5 sm:h-5 text-emerald-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<h3 class="text-sm font-medium text-gray-500">{{ __('إيرادات الشهر') }}</h3>
<h3 class="text-xs sm:text-sm font-medium text-gray-500">{{ __('إيرادات الشهر') }}</h3>
</div>
<p class="text-2xl font-bold text-gray-800" dir="ltr">{{ number_format($financial['revenue_this_month'] / 100, 2) }} {{ __('ج.م') }}</p>
<p class="text-sm text-gray-500 mt-2">
<p class="text-lg sm:text-2xl font-bold text-gray-800" dir="ltr">{{ number_format($financial['revenue_this_month'] / 100, 2) }} {{ __('ج.م') }}</p>
<p class="text-xs sm:text-sm text-gray-500 mt-1 sm:mt-2">
{{ __('مبيعات اليوم:') }}
<span dir="ltr" class="font-medium">{{ number_format($financial['pos_today_count']) }}</span>
{{ __('عملية بقيمة') }}
......@@ -89,45 +89,45 @@
</div>
<!-- Outstanding Invoices -->
<div class="bg-white rounded-xl shadow-sm border {{ $financial['outstanding_invoices'] > 0 ? 'border-red-200' : 'border-gray-200' }} p-6">
<div class="flex items-center gap-3 mb-3">
<div class="flex-shrink-0 w-10 h-10 {{ $financial['outstanding_invoices'] > 0 ? 'bg-red-50' : 'bg-gray-50' }} rounded-lg flex items-center justify-center">
<svg class="w-5 h-5 {{ $financial['outstanding_invoices'] > 0 ? 'text-red-600' : 'text-gray-600' }}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border {{ $financial['outstanding_invoices'] > 0 ? 'border-red-200' : 'border-gray-200' }} p-4 sm:p-6">
<div class="flex items-center gap-3 mb-2 sm:mb-3">
<div class="shrink-0 w-9 h-9 sm:w-10 sm:h-10 {{ $financial['outstanding_invoices'] > 0 ? 'bg-red-50' : 'bg-gray-50' }} rounded-lg flex items-center justify-center">
<svg class="w-4 h-4 sm:w-5 sm:h-5 {{ $financial['outstanding_invoices'] > 0 ? 'text-red-600' : 'text-gray-600' }}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
</svg>
</div>
<h3 class="text-sm font-medium text-gray-500">{{ __('الفواتير المعلقة') }}</h3>
<h3 class="text-xs sm:text-sm font-medium text-gray-500">{{ __('الفواتير المعلقة') }}</h3>
</div>
<p class="text-2xl font-bold {{ $financial['outstanding_invoices'] > 0 ? 'text-red-600' : 'text-gray-800' }}" dir="ltr">{{ number_format($financial['outstanding_invoices'] / 100, 2) }} {{ __('ج.م') }}</p>
<p class="text-lg sm:text-2xl font-bold {{ $financial['outstanding_invoices'] > 0 ? 'text-red-600' : 'text-gray-800' }}" dir="ltr">{{ number_format($financial['outstanding_invoices'] / 100, 2) }} {{ __('ج.م') }}</p>
</div>
</div>
<!-- Row 3: Attendance Summary -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<div class="flex items-center justify-between mb-4">
<h3 class="text-lg font-semibold text-gray-800">{{ __('حضور اليوم') }}</h3>
<span class="text-2xl font-bold {{ $attendance['rate'] >= 90 ? 'text-green-600' : ($attendance['rate'] >= 75 ? 'text-amber-600' : 'text-red-600') }}" dir="ltr">{{ $attendance['rate'] }}%</span>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="flex items-center justify-between mb-3 sm:mb-4">
<h3 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('حضور اليوم') }}</h3>
<span class="text-xl sm:text-2xl font-bold {{ $attendance['rate'] >= 90 ? 'text-green-600' : ($attendance['rate'] >= 75 ? 'text-amber-600' : 'text-red-600') }}" dir="ltr">{{ $attendance['rate'] }}%</span>
</div>
<!-- Progress bar -->
<div class="w-full bg-gray-200 rounded-full h-4 mb-4">
<div class="h-4 rounded-full transition-all duration-300 {{ $attendance['rate'] >= 90 ? 'bg-green-500' : ($attendance['rate'] >= 75 ? 'bg-amber-500' : 'bg-red-500') }}"
<div class="w-full bg-gray-200 rounded-full h-3 sm:h-4 mb-3 sm:mb-4">
<div class="h-3 sm:h-4 rounded-full transition-all duration-300 {{ $attendance['rate'] >= 90 ? 'bg-green-500' : ($attendance['rate'] >= 75 ? 'bg-amber-500' : 'bg-red-500') }}"
style="width: {{ $attendance['rate'] }}%"></div>
</div>
<div class="flex items-center gap-6 text-sm text-gray-600">
<div class="flex flex-wrap items-center gap-3 sm:gap-6 text-xs sm:text-sm text-gray-600">
<span>{{ __('الحاضرون:') }} <span dir="ltr" class="font-medium">{{ number_format($attendance['present']) }}</span> {{ __('من') }} <span dir="ltr" class="font-medium">{{ number_format($attendance['expected']) }}</span></span>
<span class="text-gray-300">|</span>
<span class="text-gray-300 hidden sm:inline">|</span>
<span>{{ __('الغائبون:') }} <span dir="ltr" class="font-medium text-red-600">{{ number_format($attendance['absent']) }}</span></span>
</div>
</div>
<!-- Row 4: Alert Badges -->
@if($lowStockCount > 0 || $nearFullGroups > 0 || $recentEnrollments > 0)
<div class="flex flex-wrap gap-4 mb-6">
<div class="flex flex-wrap gap-2 sm:gap-4 mb-4 sm:mb-6">
@if($lowStockCount > 0)
<div class="inline-flex items-center gap-2 bg-red-50 border border-red-200 text-red-700 px-4 py-2 rounded-lg text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="inline-flex items-center gap-2 bg-red-50 border border-red-200 text-red-700 px-3 py-2 rounded-lg text-xs sm:text-sm font-medium">
<svg class="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z"/>
</svg>
<span dir="ltr" class="font-bold">{{ $lowStockCount }}</span> {{ __('منتج تحت الحد الأدنى') }}
......@@ -135,8 +135,8 @@
@endif
@if($nearFullGroups > 0)
<div class="inline-flex items-center gap-2 bg-amber-50 border border-amber-200 text-amber-700 px-4 py-2 rounded-lg text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="inline-flex items-center gap-2 bg-amber-50 border border-amber-200 text-amber-700 px-3 py-2 rounded-lg text-xs sm:text-sm font-medium">
<svg class="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
<span dir="ltr" class="font-bold">{{ $nearFullGroups }}</span> {{ __('مجموعة شبه ممتلئة') }}
......@@ -144,8 +144,8 @@
@endif
@if($recentEnrollments > 0)
<div class="inline-flex items-center gap-2 bg-green-50 border border-green-200 text-green-700 px-4 py-2 rounded-lg text-sm font-medium">
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="inline-flex items-center gap-2 bg-green-50 border border-green-200 text-green-700 px-3 py-2 rounded-lg text-xs sm:text-sm font-medium">
<svg class="w-4 h-4 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
</svg>
<span dir="ltr" class="font-bold">{{ $recentEnrollments }}</span> {{ __('تسجيل جديد (٧ أيام)') }}
......@@ -155,24 +155,24 @@
@endif
<!-- Row 5: Today's Schedule + Overdue Invoices -->
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mb-6">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-3 sm:gap-4 mb-4 sm:mb-6">
<!-- Today's Schedule -->
<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-3 sm:mb-4">{{ __('جدول اليوم') }}</h3>
@if($todaySchedule->isEmpty())
<p class="text-gray-400 text-sm">{{ __('لا توجد جلسات مجدولة اليوم') }}</p>
@else
<div class="space-y-3 max-h-64 overflow-y-auto">
<div class="space-y-2 sm:space-y-3 max-h-64 overflow-y-auto">
@foreach($todaySchedule as $session)
<div class="flex items-center gap-3 p-3 bg-gray-50 rounded-lg">
<div class="text-center min-w-[50px]">
<span class="text-sm font-bold text-blue-600" dir="ltr">{{ $session->start_time?->format('H:i') }}</span>
<div class="flex items-center gap-3 p-2.5 sm:p-3 bg-gray-50 rounded-lg">
<div class="text-center min-w-[44px]">
<span class="text-xs sm:text-sm font-bold text-blue-600" dir="ltr">{{ $session->start_time?->format('H:i') }}</span>
</div>
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-gray-800 truncate">{{ $session->group?->name_ar ?? '' }}</p>
<p class="text-xs text-gray-500">{{ $session->group?->program?->name_ar ?? '' }}</p>
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $session->group?->name_ar ?? '' }}</p>
<p class="text-xs text-gray-500 truncate">{{ $session->group?->program?->name_ar ?? '' }}</p>
</div>
<span class="text-xs px-2 py-1 rounded-full
<span class="text-xs px-2 py-1 rounded-full whitespace-nowrap
{{ $session->status === 'completed' ? 'bg-green-100 text-green-700' :
($session->status === 'in_progress' ? 'bg-blue-100 text-blue-700' : 'bg-gray-100 text-gray-600') }}">
{{ $session->status === 'completed' ? __('مكتملة') :
......@@ -185,19 +185,19 @@
</div>
<!-- Overdue Invoices -->
<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-3 sm:mb-4">{{ __('فواتير متأخرة') }}</h3>
@if($overdueInvoices->isEmpty())
<p class="text-gray-400 text-sm">{{ __('لا توجد فواتير متأخرة') }}</p>
@else
<div class="space-y-3 max-h-64 overflow-y-auto">
<div class="space-y-2 sm:space-y-3 max-h-64 overflow-y-auto">
@foreach($overdueInvoices as $inv)
<a href="{{ route('invoices.show', $inv) }}" class="flex items-center justify-between p-3 bg-red-50 rounded-lg hover:bg-red-100 transition">
<div>
<p class="text-sm font-medium text-gray-800">{{ $inv->participant?->person?->name_ar ?? $inv->invoice_number }}</p>
<a href="{{ route('invoices.show', $inv) }}" class="flex items-center justify-between p-2.5 sm:p-3 bg-red-50 rounded-lg hover:bg-red-100 transition-colors">
<div class="min-w-0 flex-1 me-2">
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $inv->participant?->person?->name_ar ?? $inv->invoice_number }}</p>
<p class="text-xs text-red-600">{{ __('استحقاق:') }} {{ $inv->due_date?->format('Y-m-d') }}</p>
</div>
<span class="text-sm font-bold text-red-700" dir="ltr">{{ number_format(($inv->total_amount - $inv->paid_amount) / 100, 2) }} {{ __('ج.م') }}</span>
<span class="text-xs sm:text-sm font-bold text-red-700 whitespace-nowrap" dir="ltr">{{ number_format(($inv->total_amount - $inv->paid_amount) / 100, 2) }} {{ __('ج.م') }}</span>
</a>
@endforeach
</div>
......@@ -206,21 +206,21 @@
</div>
<!-- Row 6: Recent Payments + Upcoming Birthdays -->
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-3 sm:gap-4">
<!-- Recent Payments -->
<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-3 sm:mb-4">{{ __('آخر المدفوعات') }}</h3>
@if($recentPayments->isEmpty())
<p class="text-gray-400 text-sm">{{ __('لا توجد مدفوعات حديثة') }}</p>
@else
<div class="space-y-3 max-h-64 overflow-y-auto">
<div class="space-y-2 sm:space-y-3 max-h-64 overflow-y-auto">
@foreach($recentPayments as $payment)
<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
<div>
<p class="text-sm font-medium text-gray-800">{{ $payment->reference ?? '-' }}</p>
<p class="text-xs text-gray-500">{{ $payment->created_at?->diffForHumans() }} — {{ $payment->createdBy?->name ?? '' }}</p>
<div class="flex items-center justify-between p-2.5 sm:p-3 bg-gray-50 rounded-lg">
<div class="min-w-0 flex-1 me-2">
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $payment->reference ?? '-' }}</p>
<p class="text-xs text-gray-500 truncate">{{ $payment->created_at?->diffForHumans() }} — {{ $payment->creator?->name ?? '' }}</p>
</div>
<span class="text-sm font-bold text-emerald-600" dir="ltr">{{ number_format($payment->amount / 100, 2) }} {{ __('ج.م') }}</span>
<span class="text-xs sm:text-sm font-bold text-emerald-600 whitespace-nowrap" dir="ltr">{{ number_format($payment->amount / 100, 2) }} {{ __('ج.م') }}</span>
</div>
@endforeach
</div>
......@@ -228,21 +228,21 @@
</div>
<!-- Upcoming Birthdays -->
<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-3 sm:mb-4">{{ __('أعياد ميلاد قادمة') }}</h3>
@if($upcomingBirthdays->isEmpty())
<p class="text-gray-400 text-sm">{{ __('لا توجد أعياد ميلاد قريبة') }}</p>
@else
<div class="space-y-3 max-h-64 overflow-y-auto">
<div class="space-y-2 sm:space-y-3 max-h-64 overflow-y-auto">
@foreach($upcomingBirthdays as $person)
<div class="flex items-center gap-3 p-3 bg-pink-50 rounded-lg">
<div class="flex-shrink-0 w-8 h-8 bg-pink-200 rounded-full flex items-center justify-center">
<div class="flex items-center gap-3 p-2.5 sm:p-3 bg-pink-50 rounded-lg">
<div class="shrink-0 w-8 h-8 bg-pink-200 rounded-full flex items-center justify-center">
<svg class="w-4 h-4 text-pink-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 15.546c-.523 0-1.046.151-1.5.454a2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0 2.704 2.704 0 00-3 0 2.704 2.704 0 01-3 0A1.75 1.75 0 003 15.546V12a9 9 0 0118 0v3.546z"/>
</svg>
</div>
<div class="flex-1">
<p class="text-sm font-medium text-gray-800">{{ $person->name_ar ?? $person->name }}</p>
<div class="flex-1 min-w-0">
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $person->name_ar ?? $person->name }}</p>
<p class="text-xs text-gray-500">{{ $person->date_of_birth?->format('d/m') }}</p>
</div>
</div>
......
resources/views/livewire/enrollments/enrollment-form.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/enrollments/enrollment-list.blade.php
View file @ 944501f1
<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('enrollments.create')
<a href="{{ route('enrollments.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>
{{ __('تسجيل جديد') }}
<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
@if(session('error'))
<div class="mb-4 p-4 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">
<div class="mb-4 p-3 sm:p-4 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">
{{ session('error') }}
</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-5 gap-4">
<div class="sm:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3">
<div class="col-span-2 md:col-span-1 lg:col-span-2">
<input type="text" wire:model.live.debounce.300ms="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-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<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">
<select wire:model.live="status" class="text-sm px-3 py-2 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>
@endforeach
</select>
<select wire:model.live="groupFilter" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="groupFilter" class="text-sm px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('كل المجموعات') }}</option>
@foreach($groups as $group)
<option value="{{ $group->id }}">{{ $group->name_ar }}</option>
@endforeach
</select>
<select wire:model.live="paymentFilter" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="paymentFilter" class="text-sm px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('كل حالات الدفع') }}</option>
@foreach($paymentOptions as $value => $label)
<option value="{{ $value }}">{{ __($label) }}</option>
......@@ -52,9 +52,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</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>
......@@ -127,7 +127,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@can('enrollments.cancel')
@if(in_array($statusValue, ['pending', 'active']))
<button @click="showCancel = true"
class="text-red-600 hover:text-red-800 text-sm">
class="text-red-600 hover:text-red-800 text-sm py-2">
{{ __('إلغاء') }}
</button>
......@@ -175,7 +175,7 @@ class="px-4 py-2 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 disab
<p class="text-gray-500 text-sm">{{ __('لا يوجد تسجيلات') }}</p>
@can('enrollments.create')
<a href="{{ route('enrollments.create') }}" wire:navigate
class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium py-2">
{{ __('إضافة أول تسجيل') }}
</a>
@endcan
......@@ -193,4 +193,124 @@ class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
</div>
@endif
</div>
{{-- Mobile Cards --}}
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($enrollments as $enrollment)
@php
$statusValue = $enrollment->status->value ?? $enrollment->status;
$statusColors = [
'pending' => 'amber',
'active' => 'green',
'completed' => 'blue',
'cancelled' => 'red',
'expired' => 'gray',
'waitlisted' => 'purple',
];
$color = $statusColors[$statusValue] ?? 'gray';
$paymentValue = $enrollment->payment_status->value ?? $enrollment->payment_status;
$paymentColors = [
'paid' => 'green',
'pending' => 'amber',
'partial' => 'blue',
'overdue' => 'red',
'waived' => 'gray',
];
$pColor = $paymentColors[$paymentValue] ?? 'gray';
@endphp
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-start justify-between gap-3 mb-3">
<div class="min-w-0 flex-1">
<h3 class="font-medium text-gray-800 truncate">
{{ $enrollment->participant?->person?->name_ar ?? '—' }}
</h3>
@if($enrollment->participant?->participant_number)
<p class="text-xs text-gray-500 mt-0.5" dir="ltr">
{{ $enrollment->participant->participant_number }}
</p>
@endif
</div>
<div class="flex items-center gap-2 flex-shrink-0">
<span class="px-2 py-0.5 text-xs bg-{{ $color }}-100 text-{{ $color }}-700 rounded-full">
{{ __($statusOptions[$statusValue] ?? $statusValue) }}
</span>
<span class="px-2 py-0.5 text-xs bg-{{ $pColor }}-100 text-{{ $pColor }}-700 rounded-full">
{{ __($paymentOptions[$paymentValue] ?? $paymentValue) }}
</span>
</div>
</div>
<div class="flex items-center gap-4 text-sm text-gray-600 mb-3">
@if($enrollment->group?->name_ar)
<span class="truncate">{{ $enrollment->group->name_ar }}</span>
@endif
@if($enrollment->enrollment_date)
<span class="flex-shrink-0" dir="ltr">{{ $enrollment->enrollment_date->format('Y-m-d') }}</span>
@endif
</div>
{{-- Mobile Cancel Action --}}
<div x-data="{ showCancel: false, reason: '' }">
@can('enrollments.cancel')
@if(in_array($statusValue, ['pending', 'active']))
<button @click="showCancel = true"
class="text-red-600 hover:text-red-800 text-sm font-medium py-2">
{{ __('إلغاء التسجيل') }}
</button>
{{-- Cancel Confirmation Modal --}}
<div x-show="showCancel" x-cloak
class="fixed inset-0 z-50 flex items-center justify-center bg-black/50"
@keydown.escape.window="showCancel = false">
<div class="bg-white rounded-xl shadow-xl p-6 w-full max-w-md mx-4"
@click.outside="showCancel = false">
<h3 class="text-lg font-bold text-gray-800 mb-4">{{ __('تأكيد إلغاء التسجيل') }}</h3>
<p class="text-sm text-gray-600 mb-4">
{{ __('هل أنت متأكد من إلغاء تسجيل') }}
<strong>{{ $enrollment->participant?->person?->name_ar }}</strong>؟
</p>
<textarea x-model="reason"
class="w-full px-3 py-2 border border-gray-300 rounded-lg mb-4 focus:ring-2 focus:ring-red-500 focus:border-red-500"
rows="3"
placeholder="{{ __('سبب الإلغاء (مطلوب)...') }}"></textarea>
<div class="flex items-center justify-end gap-3">
<button @click="showCancel = false"
class="px-4 py-2 text-sm text-gray-700 hover:bg-gray-100 rounded-lg">
{{ __('تراجع') }}
</button>
<button @click="if(reason.trim()) { $wire.cancelEnrollment({{ $enrollment->id }}, reason); showCancel = false; }"
class="px-4 py-2 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50"
:disabled="!reason.trim()">
<span wire:loading.remove wire:target="cancelEnrollment">{{ __('تأكيد الإلغاء') }}</span>
<span wire:loading wire:target="cancelEnrollment">{{ __('جارٍ الإلغاء...') }}</span>
</button>
</div>
</div>
</div>
@endif
@endcan
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-8 text-center">
<svg class="w-12 h-12 text-gray-300 mb-3 mx-auto" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" 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-3 7h3m-3 4h3m-6-4h.01M9 16h.01"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا يوجد تسجيلات') }}</p>
@can('enrollments.create')
<a href="{{ route('enrollments.create') }}" wire:navigate
class="mt-2 inline-block text-blue-600 hover:text-blue-800 text-sm font-medium py-2">
{{ __('إضافة أول تسجيل') }}
</a>
@endcan
</div>
@endforelse
@if($enrollments->hasPages())
<div class="mt-4">
{{ $enrollments->links() }}
</div>
@endif
</div>
</div>
resources/views/livewire/enrollments/transfer-group.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/enrollments/waitlist-manager.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/evaluations/evaluation-criteria-list.blade.php
View file @ 944501f1
......@@ -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
......
resources/views/livewire/evaluations/evaluation-form.blade.php
View file @ 944501f1
<div>
<!-- Header -->
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-900">{{ $evaluation ? __('تعديل التقييم') : __('تقييم جديد') }}</h1>
<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'))
<div class="mb-4 p-3 bg-red-50 border border-red-200 text-red-700 rounded-lg text-sm">
......@@ -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>
resources/views/livewire/evaluations/evaluation-list.blade.php
View file @ 944501f1
......@@ -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')
......
resources/views/livewire/evaluations/evaluation-show.blade.php
View file @ 944501f1
......@@ -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
......
resources/views/livewire/facilities/facility-form.blade.php
View file @ 944501f1
<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('facilities.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">{{ __('← العودة') }}</a>
</div>
......@@ -13,14 +13,14 @@
<form wire:submit="save" class="space-y-6">
{{-- Basic Info --}}
<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 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>
......@@ -28,7 +28,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>
......@@ -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="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 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('code') border-red-500 @enderror"
placeholder="{{ __('اختياري') }}">
@error('code') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -45,7 +45,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 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('branch_id') border-red-500 @enderror">
<option value="">{{ __('اختر الفرع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -58,7 +58,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 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('type') border-red-500 @enderror">
@foreach($typeOptions as $key => $label)
<option value="{{ $key }}">{{ $label }}</option>
@endforeach
......@@ -70,7 +70,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="status" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحالة') }} *</label>
<select id="status" wire:model="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('status') 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('status') border-red-500 @enderror">
@foreach($statusOptions as $key => $label)
<option value="{{ $key }}">{{ $label }}</option>
@endforeach
......@@ -79,30 +79,30 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</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>
</div>
{{-- Specifications --}}
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
{{-- Capacity --}}
<div>
<label for="capacity" class="block text-sm font-medium text-gray-700 mb-1">{{ __('السعة') }}</label>
<input type="number" id="capacity" wire:model="capacity" 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('capacity') 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('capacity') border-red-500 @enderror">
@error('capacity') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -110,7 +110,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="surface_type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع السطح') }}</label>
<input type="text" id="surface_type" wire:model="surface_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 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="{{ __('مثال: نجيل صناعي') }}">
</div>
......@@ -118,7 +118,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="area_sqm" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المساحة (م²)') }}</label>
<input type="number" id="area_sqm" wire:model="area_sqm" min="0" step="0.01" 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('area_sqm') 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('area_sqm') border-red-500 @enderror">
@error('area_sqm') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -126,7 +126,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="length_m" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الطول (م)') }}</label>
<input type="number" id="length_m" wire:model="length_m" min="0" step="0.01" 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('length_m') 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('length_m') border-red-500 @enderror">
@error('length_m') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -134,7 +134,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="width_m" class="block text-sm font-medium text-gray-700 mb-1">{{ __('العرض (م)') }}</label>
<input type="number" id="width_m" wire:model="width_m" min="0" step="0.01" 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('width_m') 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('width_m') border-red-500 @enderror">
@error('width_m') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -142,7 +142,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="rental_cost_display" class="block text-sm font-medium text-gray-700 mb-1">{{ __('تكلفة الإيجار/ساعة (ج.م)') }}</label>
<input type="number" id="rental_cost_display" wire:model="rental_cost_display" min="0" step="0.01" 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('rental_cost_display') 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('rental_cost_display') border-red-500 @enderror">
@error('rental_cost_display') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -150,7 +150,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="monthly_rental_cost_display" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الإيجار الشهري (ج.م)') }}</label>
<input type="number" id="monthly_rental_cost_display" wire:model="monthly_rental_cost_display" min="0" step="0.01" 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('monthly_rental_cost_display') 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('monthly_rental_cost_display') border-red-500 @enderror"
placeholder="{{ __('المبلغ الذي تدفعه شهرياً لاستئجار هذه المنشأة') }}">
@error('monthly_rental_cost_display') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -177,14 +177,14 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
</div>
{{-- Operating Hours & Location --}}
<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 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Operating Start --}}
<div>
<label for="operating_start" class="block text-sm font-medium text-gray-700 mb-1">{{ __('وقت بداية التشغيل') }}</label>
<input type="time" id="operating_start" wire:model="operating_start" 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('operating_start') 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('operating_start') border-red-500 @enderror">
@error('operating_start') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -192,15 +192,15 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="operating_end" class="block text-sm font-medium text-gray-700 mb-1">{{ __('وقت نهاية التشغيل') }}</label>
<input type="time" id="operating_end" wire:model="operating_end" 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('operating_end') 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('operating_end') border-red-500 @enderror">
@error('operating_end') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</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>
<input type="text" id="address" wire:model="address"
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">
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('address') border-red-500 @enderror">
@error('address') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -208,7 +208,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="latitude" class="block text-sm font-medium text-gray-700 mb-1">{{ __('خط العرض') }}</label>
<input type="number" id="latitude" wire:model="latitude" step="0.0000001" 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('latitude') 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('latitude') border-red-500 @enderror"
placeholder="30.0444196">
@error('latitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -217,7 +217,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="longitude" class="block text-sm font-medium text-gray-700 mb-1">{{ __('خط الطول') }}</label>
<input type="number" id="longitude" wire:model="longitude" step="0.0000001" 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('longitude') 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('longitude') border-red-500 @enderror"
placeholder="31.2357116">
@error('longitude') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -233,14 +233,14 @@ 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 items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('facilities.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('facilities.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>
resources/views/livewire/facilities/facility-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/facilities/space-assignment-wizard.blade.php
View file @ 944501f1
<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 -->
......
resources/views/livewire/facilities/space-layout-manager.blade.php
View file @ 944501f1
<div>
<!-- Header -->
<div class="mb-6 flex items-center justify-between">
<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-900">{{ __('تخطيط المنشأة') }}: {{ $facility->name_ar }}</h1>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('تخطيط المنشأة') }}: {{ $facility->name_ar }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('إدارة تقسيمات الملعب (شبكة، حارات، مناطق)') }}</p>
</div>
<button wire:click="openCreateForm" type="button"
class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-700 transition-colors flex items-center gap-2">
class="w-full sm:w-auto px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-700 transition-colors flex items-center justify-center gap-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg>
{{ __('تخطيط جديد') }}
</button>
......@@ -21,19 +21,19 @@ class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-7
<!-- Create/Edit Form -->
@if($showForm)
<div class="mb-6 bg-white rounded-2xl border border-gray-200 p-6 shadow-sm">
<h3 class="text-lg font-bold text-gray-900 mb-4">{{ $editingLayoutId ? __('تعديل التخطيط') : __('تخطيط جديد') }}</h3>
<div class="mb-6 bg-white rounded-2xl border border-gray-200 p-4 sm:p-6 shadow-sm">
<h3 class="text-base sm:text-lg font-bold text-gray-900 mb-4">{{ $editingLayoutId ? __('تعديل التخطيط') : __('تخطيط جديد') }}</h3>
<form wire:submit="save" class="space-y-5">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="grid grid-cols-1 md:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }} *</label>
<input type="text" wire:model="name_ar" class="w-full border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500" placeholder="{{ __('مثال: تقسيم صباحي') }}">
<input type="text" wire:model="name_ar" class="w-full border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500 py-2.5" placeholder="{{ __('مثال: تقسيم صباحي') }}">
@error('name_ar') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالإنجليزية') }} *</label>
<input type="text" wire:model="name" dir="ltr" class="w-full border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500" placeholder="Morning layout">
<input type="text" wire:model="name" dir="ltr" class="w-full border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500 py-2.5" placeholder="Morning layout">
@error('name') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
</div>
......@@ -61,34 +61,34 @@ class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-7
<!-- Config based on type -->
@if($layout_type === 'grid')
<div class="grid grid-cols-2 gap-4 p-4 bg-gray-50 rounded-xl">
<div class="grid grid-cols-2 gap-3 sm:gap-4 p-4 bg-gray-50 rounded-xl">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('عدد الصفوف') }}</label>
<input type="number" wire:model="grid_rows" min="1" max="10" dir="ltr" class="w-full border-gray-300 rounded-lg">
<input type="number" wire:model="grid_rows" min="1" max="10" dir="ltr" class="w-full border-gray-300 rounded-lg py-2.5">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('عدد الأعمدة') }}</label>
<input type="number" wire:model="grid_columns" min="1" max="10" dir="ltr" class="w-full border-gray-300 rounded-lg">
<input type="number" wire:model="grid_columns" min="1" max="10" dir="ltr" class="w-full border-gray-300 rounded-lg py-2.5">
</div>
<p class="col-span-2 text-xs text-gray-500">{{ __('سيتم إنشاء') }} {{ $grid_rows * $grid_columns }} {{ __('قطعة') }}</p>
</div>
@elseif($layout_type === 'lanes')
<div class="p-4 bg-gray-50 rounded-xl">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('عدد الحارات') }}</label>
<input type="number" wire:model="lane_count" min="1" max="20" dir="ltr" class="w-32 border-gray-300 rounded-lg">
<input type="number" wire:model="lane_count" min="1" max="20" dir="ltr" class="w-32 border-gray-300 rounded-lg py-2.5">
</div>
@elseif($layout_type === 'zones' || $layout_type === 'custom')
<div class="p-4 bg-gray-50 rounded-xl space-y-3">
<div class="flex items-center justify-between">
<label class="text-sm font-medium text-gray-700">{{ __('المناطق') }}</label>
<button wire:click="addZone" type="button" class="text-xs px-3 py-1 bg-blue-100 text-blue-700 rounded-lg hover:bg-blue-200">+ {{ __('إضافة منطقة') }}</button>
<button wire:click="addZone" type="button" class="text-xs px-3 py-1.5 bg-blue-100 text-blue-700 rounded-lg hover:bg-blue-200">+ {{ __('إضافة منطقة') }}</button>
</div>
@foreach($zone_definitions as $index => $zone)
<div class="flex items-center gap-2 p-2 bg-white rounded-lg border">
<input type="text" wire:model="zone_definitions.{{ $index }}.code" dir="ltr" placeholder="Z1" class="w-16 text-xs border-gray-300 rounded">
<input type="text" wire:model="zone_definitions.{{ $index }}.name_ar" placeholder="{{ __('اسم المنطقة') }}" class="flex-1 text-sm border-gray-300 rounded">
<input type="number" wire:model="zone_definitions.{{ $index }}.capacity" placeholder="{{ __('السعة') }}" dir="ltr" class="w-20 text-xs border-gray-300 rounded">
<button wire:click="removeZone({{ $index }})" type="button" class="text-red-500 hover:text-red-700 p-1">
<div class="flex flex-wrap sm:flex-nowrap items-center gap-2 p-2 bg-white rounded-lg border">
<input type="text" wire:model="zone_definitions.{{ $index }}.code" dir="ltr" placeholder="Z1" class="w-16 text-xs border-gray-300 rounded py-2.5">
<input type="text" wire:model="zone_definitions.{{ $index }}.name_ar" placeholder="{{ __('اسم المنطقة') }}" class="flex-1 min-w-0 text-sm border-gray-300 rounded py-2.5">
<input type="number" wire:model="zone_definitions.{{ $index }}.capacity" placeholder="{{ __('السعة') }}" dir="ltr" class="w-20 text-xs border-gray-300 rounded py-2.5">
<button wire:click="removeZone({{ $index }})" type="button" class="text-red-500 hover:text-red-700 p-2">
<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>
</button>
</div>
......@@ -97,18 +97,18 @@ class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-7
@endif
<!-- Time & Scheduling -->
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('من الساعة') }}</label>
<input type="time" wire:model="start_time" dir="ltr" class="w-full border-gray-300 rounded-lg">
<input type="time" wire:model="start_time" dir="ltr" class="w-full border-gray-300 rounded-lg py-2.5">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('إلى الساعة') }}</label>
<input type="time" wire:model="end_time" dir="ltr" class="w-full border-gray-300 rounded-lg">
<input type="time" wire:model="end_time" dir="ltr" class="w-full border-gray-300 rounded-lg py-2.5">
</div>
<div>
<div class="sm:col-span-2 md:col-span-1">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع الجدولة') }}</label>
<select wire:model.live="is_recurring" class="w-full border-gray-300 rounded-lg">
<select wire:model.live="is_recurring" class="w-full border-gray-300 rounded-lg py-2.5">
<option value="1">{{ __('متكرر (يوم محدد)') }}</option>
<option value="0">{{ __('تاريخ محدد') }}</option>
</select>
......@@ -118,7 +118,7 @@ class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-7
@if($is_recurring)
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('يوم الأسبوع') }}</label>
<select wire:model="effective_day_of_week" class="w-full max-w-xs border-gray-300 rounded-lg">
<select wire:model="effective_day_of_week" class="w-full sm:max-w-xs border-gray-300 rounded-lg py-2.5">
@foreach(['الأحد', 'الاثنين', 'الثلاثاء', 'الأربعاء', 'الخميس', 'الجمعة', 'السبت'] as $i => $day)
<option value="{{ $i }}">{{ $day }}</option>
@endforeach
......@@ -127,20 +127,20 @@ class="px-4 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-7
@else
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('التاريخ') }}</label>
<input type="date" wire:model="effective_date" dir="ltr" class="w-full max-w-xs border-gray-300 rounded-lg">
<input type="date" wire:model="effective_date" dir="ltr" class="w-full sm:max-w-xs border-gray-300 rounded-lg py-2.5">
</div>
@endif
<div class="flex gap-3 pt-2">
<div class="flex flex-col-reverse sm:flex-row gap-3 pt-2">
<button wire:click="$set('showForm', false)" type="button"
class="w-full sm:w-auto px-6 py-2.5 bg-gray-100 text-gray-700 font-medium rounded-xl hover:bg-gray-200 transition-colors">
{{ __('إلغاء') }}
</button>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-xl 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-xl hover:bg-blue-700 disabled:bg-blue-400 transition-colors">
<span wire:loading.remove wire:target="save">{{ $editingLayoutId ? __('تحديث') : __('إنشاء') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<button wire:click="$set('showForm', false)" type="button"
class="px-6 py-2.5 bg-gray-100 text-gray-700 font-medium rounded-xl hover:bg-gray-200 transition-colors">
{{ __('إلغاء') }}
</button>
</div>
</form>
</div>
......@@ -148,11 +148,11 @@ class="px-6 py-2.5 bg-gray-100 text-gray-700 font-medium rounded-xl hover:bg-gra
<!-- Existing Layouts -->
@if(empty($layouts) && !$showForm)
<div class="bg-white rounded-2xl border border-gray-200 p-12 text-center">
<svg class="mx-auto h-16 w-16 text-gray-300 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"/></svg>
<div class="bg-white rounded-2xl border border-gray-200 p-8 sm:p-12 text-center">
<svg class="mx-auto h-12 w-12 sm:h-16 sm:w-16 text-gray-300 mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"/></svg>
<p class="font-medium text-gray-700 mb-2">{{ __('لا توجد تخطيطات بعد') }}</p>
<p class="text-sm text-gray-500 mb-4">{{ __('أنشئ أول تخطيط لهذه المنشأة لبدء تعيين المجموعات') }}</p>
<button wire:click="openCreateForm" type="button" class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-700 transition-colors">
<button wire:click="openCreateForm" type="button" class="w-full sm:w-auto px-6 py-2.5 bg-blue-600 text-white font-medium rounded-xl hover:bg-blue-700 transition-colors">
{{ __('إنشاء تخطيط') }}
</button>
</div>
......@@ -161,18 +161,18 @@ class="px-6 py-2.5 bg-gray-100 text-gray-700 font-medium rounded-xl hover:bg-gra
@foreach($layouts as $layout)
<div class="bg-white rounded-xl border border-gray-200 overflow-hidden">
<!-- Layout header -->
<div class="p-4 flex items-center justify-between border-b border-gray-100">
<div class="flex items-center gap-3">
<div class="w-10 h-10 rounded-lg bg-indigo-100 flex items-center justify-center">
<div class="p-3 sm:p-4 flex flex-col sm:flex-row sm:items-center justify-between gap-3 border-b border-gray-100">
<div class="flex items-center gap-3 min-w-0">
<div class="w-10 h-10 rounded-lg bg-indigo-100 flex items-center justify-center shrink-0">
@if($layout['layout_type'] === 'grid')
<svg class="w-5 h-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z"/></svg>
@else
<svg class="w-5 h-5 text-indigo-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h16M4 18h16"/></svg>
@endif
</div>
<div>
<h4 class="font-semibold text-gray-900">{{ $layout['name_ar'] }}</h4>
<div class="flex items-center gap-2 text-xs text-gray-500">
<div class="min-w-0">
<h4 class="font-semibold text-gray-900 truncate">{{ $layout['name_ar'] }}</h4>
<div class="flex items-center gap-2 text-xs text-gray-500 flex-wrap">
<span class="px-1.5 py-0.5 bg-gray-100 rounded">{{ $layout['layout_type'] }}</span>
<span>{{ $layout['start_time'] }} - {{ $layout['end_time'] }}</span>
@if($layout['is_recurring'])
......@@ -184,7 +184,7 @@ class="px-6 py-2.5 bg-gray-100 text-gray-700 font-medium rounded-xl hover:bg-gra
</div>
</div>
</div>
<div class="flex items-center gap-2">
<div class="flex items-center gap-2 self-end sm:self-auto">
<button wire:click="editLayout({{ $layout['id'] }})" class="p-2 text-gray-400 hover:text-blue-600 rounded-lg hover:bg-blue-50 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="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"/></svg>
</button>
......@@ -197,17 +197,17 @@ class="p-2 text-gray-400 hover:text-red-600 rounded-lg hover:bg-red-50 transitio
<!-- Visual segments preview -->
@if(!empty($layout['segments']))
<div class="p-4">
<div class="p-3 sm:p-4 overflow-x-auto">
@if($layout['layout_type'] === 'grid')
@php
$config = $layout['layout_config'] ?? [];
$cols = $config['columns'] ?? 3;
@endphp
<div class="grid gap-2" style="grid-template-columns: repeat({{ $cols }}, 1fr);">
<div class="grid gap-2 min-w-[280px]" style="grid-template-columns: repeat({{ $cols }}, 1fr);">
@foreach($layout['segments'] as $seg)
<button wire:click="toggleSegmentAvailability({{ $seg['id'] }})" type="button"
@class([
'p-2 rounded-lg text-center text-xs font-medium border transition-colors',
'p-2 rounded-lg text-center text-xs font-medium border transition-colors min-h-[44px]',
'bg-white border-gray-200 text-gray-700 hover:border-blue-300' => $seg['is_available'],
'bg-gray-100 border-gray-300 text-gray-400 line-through' => !$seg['is_available'],
])
......@@ -221,7 +221,7 @@ class="p-2 text-gray-400 hover:text-red-600 rounded-lg hover:bg-red-50 transitio
@foreach($layout['segments'] as $seg)
<button wire:click="toggleSegmentAvailability({{ $seg['id'] }})" type="button"
@class([
'px-3 py-1.5 rounded-lg text-xs font-medium border transition-colors',
'px-3 py-2.5 rounded-lg text-xs font-medium border transition-colors',
'bg-white border-gray-200 text-gray-700 hover:border-blue-300' => $seg['is_available'],
'bg-gray-100 border-gray-300 text-gray-400 line-through' => !$seg['is_available'],
])>
......
resources/views/livewire/financial/financial-overview.blade.php
View file @ 944501f1
<div>
{{-- Header --}}
<div class="flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4 mb-6">
<div class="flex flex-col sm:flex-row items-start 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">{{ __('ملخص الإيرادات والمصروفات والأرباح') }} — {{ $periodLabel }}</p>
</div>
<div class="flex items-center gap-3">
<select wire:model.live="branch_id" class="px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-2 sm:gap-3 w-full sm:w-auto">
<select wire:model.live="branch_id" class="w-full sm:w-auto px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('كل الفروع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
@endforeach
</select>
<select wire:model.live="period" class="px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="period" class="w-full sm:w-auto px-3 py-2 border border-gray-300 rounded-lg text-sm focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="today">{{ __('اليوم') }}</option>
<option value="this_week">{{ __('هذا الأسبوع') }}</option>
<option value="this_month">{{ __('هذا الشهر') }}</option>
......@@ -27,9 +27,9 @@
<div wire:loading.class="opacity-50 pointer-events-none" class="transition-opacity">
{{-- Row 1: Summary Cards --}}
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-6">
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
{{-- Total Revenue --}}
<div class="bg-white rounded-xl shadow-sm border border-emerald-200 p-5">
<div class="bg-white rounded-xl shadow-sm border border-emerald-200 p-3 sm:p-5">
<div class="flex items-center gap-3">
<div class="w-11 h-11 bg-emerald-50 rounded-lg flex items-center justify-center shrink-0">
<svg class="w-5 h-5 text-emerald-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -38,14 +38,14 @@
</div>
<div class="min-w-0">
<p class="text-xs text-gray-500">{{ __('الإيرادات') }}</p>
<p class="text-xl font-bold text-emerald-700 truncate" dir="ltr">{{ number_format($revenue['total'] / 100, 2) }} <span class="text-sm font-normal">{{ __('ج.م') }}</span></p>
<p class="text-lg sm:text-xl font-bold text-emerald-700 truncate" dir="ltr">{{ number_format($revenue['total'] / 100, 2) }} <span class="text-sm font-normal">{{ __('ج.م') }}</span></p>
</div>
</div>
<p class="text-xs text-gray-400 mt-2" dir="ltr">{{ number_format($revenue['transaction_count']) }} {{ __('عملية') }}</p>
</div>
{{-- Total Expenses --}}
<div class="bg-white rounded-xl shadow-sm border border-red-200 p-5">
<div class="bg-white rounded-xl shadow-sm border border-red-200 p-3 sm:p-5">
<div class="flex items-center gap-3">
<div class="w-11 h-11 bg-red-50 rounded-lg flex items-center justify-center shrink-0">
<svg class="w-5 h-5 text-red-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -54,7 +54,7 @@
</div>
<div class="min-w-0">
<p class="text-xs text-gray-500">{{ __('المصروفات') }}</p>
<p class="text-xl font-bold text-red-700 truncate" dir="ltr">{{ number_format($expenses['total'] / 100, 2) }} <span class="text-sm font-normal">{{ __('ج.م') }}</span></p>
<p class="text-lg sm:text-xl font-bold text-red-700 truncate" dir="ltr">{{ number_format($expenses['total'] / 100, 2) }} <span class="text-sm font-normal">{{ __('ج.م') }}</span></p>
</div>
</div>
<p class="text-xs text-gray-400 mt-2">{{ __('إيجارات + مشتريات + مدفوعات') }}</p>
......@@ -62,7 +62,7 @@
{{-- Net Profit/Loss --}}
@php $netProfit = $revenue['total'] - $expenses['total']; @endphp
<div class="bg-white rounded-xl shadow-sm border {{ $netProfit >= 0 ? 'border-blue-200' : 'border-orange-200' }} p-5">
<div class="bg-white rounded-xl shadow-sm border {{ $netProfit >= 0 ? 'border-blue-200' : 'border-orange-200' }} p-3 sm:p-5">
<div class="flex items-center gap-3">
<div class="w-11 h-11 {{ $netProfit >= 0 ? 'bg-blue-50' : 'bg-orange-50' }} rounded-lg flex items-center justify-center shrink-0">
<svg class="w-5 h-5 {{ $netProfit >= 0 ? 'text-blue-600' : 'text-orange-600' }}" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -71,7 +71,7 @@
</div>
<div class="min-w-0">
<p class="text-xs text-gray-500">{{ __('صافي الربح/الخسارة') }}</p>
<p class="text-xl font-bold {{ $netProfit >= 0 ? 'text-blue-700' : 'text-orange-700' }} truncate" dir="ltr">
<p class="text-lg sm:text-xl font-bold {{ $netProfit >= 0 ? 'text-blue-700' : 'text-orange-700' }} truncate" dir="ltr">
{{ $netProfit >= 0 ? '+' : '' }}{{ number_format($netProfit / 100, 2) }} <span class="text-sm font-normal">{{ __('ج.م') }}</span>
</p>
</div>
......@@ -79,7 +79,7 @@
</div>
{{-- Collection Rate --}}
<div class="bg-white rounded-xl shadow-sm border border-purple-200 p-5">
<div class="bg-white rounded-xl shadow-sm border border-purple-200 p-3 sm:p-5">
<div class="flex items-center gap-3">
<div class="w-11 h-11 bg-purple-50 rounded-lg flex items-center justify-center shrink-0">
<svg class="w-5 h-5 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -88,7 +88,7 @@
</div>
<div class="min-w-0">
<p class="text-xs text-gray-500">{{ __('نسبة التحصيل') }}</p>
<p class="text-xl font-bold text-purple-700" dir="ltr">{{ $collectionRate['rate'] }}%</p>
<p class="text-lg sm:text-xl font-bold text-purple-700" dir="ltr">{{ $collectionRate['rate'] }}%</p>
</div>
</div>
@if($collectionRate['overdue_count'] > 0)
......@@ -100,10 +100,10 @@
</div>
{{-- Row 2: Break-Even + Expense Breakdown --}}
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mb-6">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-3 sm:gap-4 mb-4 sm:mb-6">
{{-- Break-Even Gauge --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-base 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-sm sm:text-base font-semibold text-gray-800 mb-4">{{ __('نقطة التعادل') }}</h3>
@if($breakEven['has_data'])
<div class="relative">
{{-- Progress ring visual --}}
......@@ -159,8 +159,8 @@
</div>
{{-- Expense Breakdown --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-base 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-sm sm:text-base font-semibold text-gray-800 mb-4">{{ __('تفاصيل المصروفات') }}</h3>
@if($expenses['total'] > 0)
<div class="space-y-4">
{{-- Facility Costs --}}
......@@ -219,8 +219,8 @@
</div>
{{-- Row 3: Monthly P&L Chart --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<h3 class="text-base 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 mb-4 sm:mb-6">
<h3 class="text-sm sm:text-base font-semibold text-gray-800 mb-4">{{ __('الأرباح والخسائر — آخر ٦ أشهر') }}</h3>
<div class="overflow-x-auto">
<div class="min-w-[600px]">
{{-- Chart header --}}
......@@ -256,11 +256,11 @@
</div>
{{-- Row 4: Facility Costs Table + Revenue Sources --}}
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 mb-6">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-3 sm:gap-4 mb-4 sm:mb-6">
{{-- Facility Costs Detail --}}
<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 class="flex items-center justify-between mb-4">
<h3 class="text-base font-semibold text-gray-800">{{ __('تكاليف المنشآت') }}</h3>
<h3 class="text-sm sm:text-base font-semibold text-gray-800">{{ __('تكاليف المنشآت') }}</h3>
<span class="text-sm font-medium text-gray-500" dir="ltr">{{ number_format($facilityCosts['total_monthly'] / 100, 0) }} {{ __('ج.م/شهر') }}</span>
</div>
@if(count($facilityCosts['facilities']) > 0)
......@@ -303,8 +303,8 @@
</div>
{{-- Revenue by Source --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-base 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-sm sm:text-base font-semibold text-gray-800 mb-4">{{ __('مصادر الإيرادات') }}</h3>
@if(count($revenueBySource) > 0)
<div class="space-y-3">
@php $maxSource = max(1, collect($revenueBySource)->max('total')); @endphp
......@@ -351,20 +351,20 @@
</div>
{{-- Row 5: Collection Rate Progress --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('معدل تحصيل الفواتير') }}</h3>
<div class="grid grid-cols-1 md:grid-cols-3 gap-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<h3 class="text-sm sm:text-base font-semibold text-gray-800 mb-4">{{ __('معدل تحصيل الفواتير') }}</h3>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4 sm:gap-6">
<div class="text-center">
<p class="text-sm text-gray-500 mb-1">{{ __('إجمالي الفوترة') }}</p>
<p class="text-2xl font-bold text-gray-800" dir="ltr">{{ number_format($collectionRate['invoiced'] / 100, 0) }} <span class="text-sm font-normal text-gray-500">{{ __('ج.م') }}</span></p>
<p class="text-xl sm:text-2xl font-bold text-gray-800" dir="ltr">{{ number_format($collectionRate['invoiced'] / 100, 0) }} <span class="text-sm font-normal text-gray-500">{{ __('ج.م') }}</span></p>
</div>
<div class="text-center">
<p class="text-sm text-gray-500 mb-1">{{ __('تم تحصيله') }}</p>
<p class="text-2xl font-bold text-emerald-600" dir="ltr">{{ number_format($collectionRate['collected'] / 100, 0) }} <span class="text-sm font-normal text-gray-500">{{ __('ج.م') }}</span></p>
<p class="text-xl sm:text-2xl font-bold text-emerald-600" dir="ltr">{{ number_format($collectionRate['collected'] / 100, 0) }} <span class="text-sm font-normal text-gray-500">{{ __('ج.م') }}</span></p>
</div>
<div class="text-center">
<p class="text-sm text-gray-500 mb-1">{{ __('نسبة التحصيل') }}</p>
<p class="text-2xl font-bold {{ $collectionRate['rate'] >= 80 ? 'text-emerald-600' : ($collectionRate['rate'] >= 50 ? 'text-amber-600' : 'text-red-600') }}" dir="ltr">{{ $collectionRate['rate'] }}%</p>
<p class="text-xl sm:text-2xl font-bold {{ $collectionRate['rate'] >= 80 ? 'text-emerald-600' : ($collectionRate['rate'] >= 50 ? 'text-amber-600' : 'text-red-600') }}" dir="ltr">{{ $collectionRate['rate'] }}%</p>
</div>
</div>
{{-- Progress bar --}}
......
resources/views/livewire/financial/payment-plan-create.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/groups/group-form.blade.php
View file @ 944501f1
<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('groups.list') }}" wire:navigate
class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للقائمة') }}</a>
</div>
......@@ -10,12 +10,12 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
@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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('البرنامج') }} <span class="text-red-500">*</span></label>
<select wire:model.live="program_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">
<select wire:model.live="program_id" 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">
<option value="">{{ __('اختر البرنامج') }}</option>
@foreach($programs as $program)
<option value="{{ $program->id }}">{{ $program->name_ar }}</option>
......@@ -25,7 +25,7 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الفرع') }}</label>
<select 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">
<select wire:model="branch_id" 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">
<option value="">{{ __('اختر الفرع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -35,22 +35,22 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم المجموعة بالعربية') }} <span class="text-red-500">*</span></label>
<input type="text" 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">
<input type="text" wire:model="name_ar" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم المجموعة بالإنجليزية') }} <span class="text-red-500">*</span></label>
<input type="text" 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">
<input type="text" wire:model="name" dir="ltr" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الكود') }}</label>
<input type="text" wire:model="code" dir="ltr" placeholder="GRP-001" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<input type="text" wire:model="code" dir="ltr" placeholder="GRP-001" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('المدرب الرئيسي') }}</label>
<select wire:model="head_trainer_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">
<select wire:model="head_trainer_id" 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">
<option value="">{{ __('اختر المدرب') }}</option>
@foreach($trainers as $trainer)
<option value="{{ $trainer->id }}">{{ $trainer->name_ar ?: $trainer->name }}</option>
......@@ -60,41 +60,41 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأقصى للسعة') }} <span class="text-red-500">*</span></label>
<input type="number" wire:model="max_capacity" min="1" max="500" 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">
<input type="number" wire:model="max_capacity" min="1" max="500" dir="ltr" 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('max_capacity') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الموسم') }}</label>
<input type="text" wire:model="season" placeholder="{{ __('صيف 2025') }}" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<input type="text" wire:model="season" placeholder="{{ __('صيف 2025') }}" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ البداية') }}</label>
<input type="date" wire:model="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">
<input type="date" wire:model="start_date" dir="ltr" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ الانتهاء') }}</label>
<input type="date" wire:model="end_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">
<input type="date" wire:model="end_date" dir="ltr" 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('end_date') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('ملاحظات') }}</label>
<textarea wire:model="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"></textarea>
<textarea wire:model="notes" rows="3" 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"></textarea>
@error('notes') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
</div>
</div>
<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('groups.list') }}" wire:navigate
class="text-center px-4 sm:px-6 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 font-medium text-sm">
{{ __('إلغاء') }}
</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 font-medium text-sm 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 font-medium text-sm disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ $editing ? __('تحديث المجموعة') : __('إنشاء المجموعة') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('groups.list') }}" wire:navigate
class="px-6 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 font-medium text-sm">
{{ __('إلغاء') }}
</a>
</div>
</form>
</div>
resources/views/livewire/groups/group-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/guardian/guardian-dashboard.blade.php
View file @ 944501f1
......@@ -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">
......
resources/views/livewire/inventory/movement-list.blade.php
View file @ 944501f1
<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 --}}
......
resources/views/livewire/inventory/product-form.blade.php
View file @ 944501f1
<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>
resources/views/livewire/inventory/product-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/inventory/stock-adjustment.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/inventory/warehouse-form.blade.php
View file @ 944501f1
<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>
resources/views/livewire/inventory/warehouse-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/invoices/invoice-create.blade.php
View file @ 944501f1
<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('invoices.list') }}" wire:navigate
class="text-gray-600 hover:text-gray-800 text-sm font-medium">
{{ __('العودة للفواتير') }}
......@@ -15,17 +15,17 @@ class="text-gray-600 hover:text-gray-800 text-sm font-medium">
@endif
<form wire:submit="save">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
<div class="grid grid-cols-1 lg:grid-cols-3 gap-3 sm:gap-4">
{{-- Main Form --}}
<div class="lg:col-span-2 space-y-6">
<div class="lg:col-span-2 space-y-4 sm:space-y-6">
{{-- Client Info --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('بيانات العميل') }}</h2>
<div class="grid grid-cols-1 sm: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-800 mb-4">{{ __('بيانات العميل') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('المشترك') }}</label>
<select wire:model.live="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">
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($participants as $participant)
<option value="{{ $participant->id }}">
......@@ -40,23 +40,23 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم العميل') }} <span class="text-red-500">*</span></label>
<input type="text" wire:model="contact_name"
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"
placeholder="{{ __('اسم العميل') }}">
@error('contact_name') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('رقم الهاتف') }}</label>
<input type="text" wire:model="contact_phone" 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 px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
placeholder="01xxxxxxxxx">
</div>
</div>
</div>
{{-- Items --}}
<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 class="flex items-center justify-between mb-4">
<h2 class="text-lg font-semibold text-gray-800">{{ __('عناصر الفاتورة') }}</h2>
<h2 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('عناصر الفاتورة') }}</h2>
<button type="button" wire:click="addItem"
class="inline-flex items-center gap-1 px-3 py-1.5 bg-blue-50 text-blue-600 rounded-lg hover:bg-blue-100 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>
......@@ -66,25 +66,25 @@ class="inline-flex items-center gap-1 px-3 py-1.5 bg-blue-50 text-blue-600 round
<div class="space-y-3">
@foreach($items as $index => $item)
<div class="flex items-start gap-3 p-3 bg-gray-50 rounded-lg" wire:key="item-{{ $index }}">
<div class="flex-1 grid grid-cols-1 sm:grid-cols-6 gap-3">
<div class="flex flex-col sm:flex-row items-start gap-3 p-3 bg-gray-50 rounded-lg" wire:key="item-{{ $index }}">
<div class="flex-1 w-full grid grid-cols-1 sm:grid-cols-6 gap-3">
<div class="sm:col-span-3">
<label class="block text-xs font-medium text-gray-500 mb-1">{{ __('الوصف') }}</label>
<input type="text" wire:model="items.{{ $index }}.description"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
class="w-full px-3 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
placeholder="{{ __('وصف العنصر') }}">
@error("items.{$index}.description") <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">{{ __('الكمية') }}</label>
<input type="number" wire:model="items.{{ $index }}.quantity" min="1" dir="ltr"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
class="w-full px-3 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
@error("items.{$index}.quantity") <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div class="sm:col-span-2">
<label class="block text-xs font-medium text-gray-500 mb-1">{{ __('سعر الوحدة (ج.م)') }}</label>
<input type="number" wire:model="items.{{ $index }}.unit_price" min="0" step="0.01" dir="ltr"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
class="w-full px-3 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
placeholder="0.00">
@error("items.{$index}.unit_price") <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -102,25 +102,25 @@ class="mt-6 p-1.5 text-red-400 hover:text-red-600 hover:bg-red-50 rounded">
</div>
{{-- Dates & Notes --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('التواريخ والملاحظات') }}</h2>
<div class="grid grid-cols-1 sm: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-800 mb-4">{{ __('التواريخ والملاحظات') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ الإصدار') }} <span class="text-red-500">*</span></label>
<input type="date" wire:model="issue_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">
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('issue_date') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ الاستحقاق') }} <span class="text-red-500">*</span></label>
<input type="date" wire:model="due_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">
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('due_date') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('ملاحظات') }}</label>
<textarea wire:model="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"
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"
placeholder="{{ __('ملاحظات إضافية...') }}"></textarea>
</div>
</div>
......@@ -129,8 +129,8 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{-- Sidebar Summary --}}
<div class="lg:col-span-1">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 sticky top-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('ملخص الفاتورة') }}</h2>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 sticky top-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-800 mb-4">{{ __('ملخص الفاتورة') }}</h2>
<div class="space-y-3">
<div class="flex justify-between text-sm">
......@@ -141,14 +141,14 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">{{ __('الخصم (ج.م)') }}</label>
<input type="number" wire:model.live="discount_amount" min="0" step="0.01" dir="ltr"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
class="w-full px-3 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
placeholder="0.00">
</div>
<div>
<label class="block text-xs font-medium text-gray-500 mb-1">{{ __('الضريبة (ج.م)') }}</label>
<input type="number" wire:model.live="tax_amount" min="0" step="0.01" dir="ltr"
class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
class="w-full px-3 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
placeholder="0.00">
</div>
......
resources/views/livewire/invoices/invoice-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/invoices/invoice-show.blade.php
View file @ 944501f1
<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"
......
resources/views/livewire/messaging/bulk-message.blade.php
View file @ 944501f1
<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 --}}
......@@ -20,31 +20,31 @@
</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">
{{-- Selection Panel --}}
<div class="lg:col-span-2">
<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="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>
{{-- Selection Mode Tabs --}}
<div class="flex flex-wrap gap-2 mb-6" x-data="{ mode: @entangle('selectionMode') }">
<div class="grid grid-cols-2 sm:flex sm:flex-wrap gap-2 mb-6" x-data="{ mode: @entangle('selectionMode') }">
<button type="button" wire:click="$set('selectionMode', 'group')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors"
class="px-3 sm:px-4 py-2.5 rounded-lg text-sm font-medium transition-colors"
:class="mode === 'group' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
{{ __('حسب المجموعة') }}
</button>
<button type="button" wire:click="$set('selectionMode', 'status')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors"
class="px-3 sm:px-4 py-2.5 rounded-lg text-sm font-medium transition-colors"
:class="mode === 'status' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
{{ __('حسب الحالة') }}
</button>
<button type="button" wire:click="$set('selectionMode', 'membership')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors"
class="px-3 sm:px-4 py-2.5 rounded-lg text-sm font-medium transition-colors"
:class="mode === 'membership' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
{{ __('حسب العضوية') }}
</button>
<button type="button" wire:click="$set('selectionMode', 'custom')"
class="px-4 py-2 rounded-lg text-sm font-medium transition-colors"
class="px-3 sm:px-4 py-2.5 rounded-lg text-sm font-medium transition-colors"
:class="mode === 'custom' ? 'bg-blue-600 text-white' : 'bg-gray-100 text-gray-700 hover:bg-gray-200'">
{{ __('اختيار يدوي') }}
</button>
......@@ -55,7 +55,7 @@ class="px-4 py-2 rounded-lg text-sm font-medium transition-colors"
<div>
<label for="selectedGroup" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المجموعة التدريبية') }} <span class="text-red-500">*</span></label>
<select wire:model.live="selectedGroup" id="selectedGroup"
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($groups as $group)
<option value="{{ $group->id }}">{{ $group->name_ar ?: $group->name }} ({{ $group->current_count }} {{ __('مشترك') }})</option>
......@@ -70,7 +70,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="selectedStatus" class="block text-sm font-medium text-gray-700 mb-1">{{ __('حالة المشترك') }} <span class="text-red-500">*</span></label>
<select wire:model.live="selectedStatus" id="selectedStatus"
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($statuses as $status)
<option value="{{ $status->value }}">{{ __($status->value) }}</option>
......@@ -85,7 +85,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="selectedMembership" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع العضوية') }} <span class="text-red-500">*</span></label>
<select wire:model.live="selectedMembership" id="selectedMembership"
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($membershipTypes as $type)
<option value="{{ $type->value }}">{{ $type->label() }}</option>
......@@ -120,7 +120,7 @@ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
{{-- Preview Button --}}
<div class="mt-6">
<button type="button" wire:click="preview" wire:loading.attr="disabled" wire:target="preview"
class="inline-flex items-center gap-2 px-4 py-2 bg-gray-600 text-white rounded-lg hover:bg-gray-700 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed">
class="w-full sm:w-auto inline-flex items-center justify-center gap-2 px-4 py-2.5 bg-gray-600 text-white rounded-lg hover:bg-gray-700 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed">
<span wire:loading.remove wire:target="preview">{{ __('معاينة عدد المستلمين') }}</span>
<span wire:loading wire:target="preview">{{ __('جارٍ الحساب...') }}</span>
</button>
......@@ -130,7 +130,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-600 text-white rounded-l
@if($showPreview)
<div class="mt-4 p-4 bg-blue-50 border border-blue-200 rounded-lg">
<div class="flex items-center gap-2">
<svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg class="w-5 h-5 text-blue-600 shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
</svg>
<span class="text-sm font-medium text-blue-800">
......@@ -147,8 +147,8 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-600 text-white rounded-l
{{-- Message Compose Panel --}}
<div class="lg:col-span-1">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 sticky top-6">
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('كتابة الرسالة') }}</h2>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 lg:sticky lg:top-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-4">{{ __('كتابة الرسالة') }}</h2>
{{-- Message Body --}}
<div class="mb-4">
......@@ -156,7 +156,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-600 text-white rounded-l
<textarea wire:model="messageBody" id="messageBody" rows="6"
placeholder="{{ __('اكتب رسالتك هنا...') }}"
maxlength="640"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 resize-none"></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 resize-none text-sm"></textarea>
<div class="flex justify-between mt-1">
@error('messageBody') <p class="text-xs text-red-600">{{ $message }}</p> @enderror
<span class="text-xs text-gray-400 ms-auto" dir="ltr">{{ mb_strlen($messageBody) }}/640</span>
......@@ -184,7 +184,7 @@ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
{{-- Send Button --}}
<button type="button" wire:click="send" wire:loading.attr="disabled" wire:target="send"
@if(!$showPreview || $recipientCount === 0 || mb_strlen($messageBody) === 0) disabled @endif
class="w-full inline-flex items-center justify-center gap-2 px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium disabled:opacity-50 disabled:cursor-not-allowed">
class="w-full inline-flex items-center justify-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">
<span wire:loading.remove wire:target="send">
<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 19l9 2-9-18-9 18 9-2zm0 0v-8"/>
......@@ -211,7 +211,7 @@ class="w-full inline-flex items-center justify-center gap-2 px-6 py-3 bg-blue-60
</div>
<button type="button" wire:click="resetForm"
class="w-full mt-3 px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
class="w-full mt-3 px-4 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
{{ __('رسالة جديدة') }}
</button>
@endif
......
resources/views/livewire/notifications/notification-center.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/notifications/notification-log-list.blade.php
View file @ 944501f1
<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 --}}
......
resources/views/livewire/notifications/notification-template-form.blade.php
View file @ 944501f1
<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>
resources/views/livewire/notifications/notification-template-list.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/participants/bulk-status-change.blade.php
View file @ 944501f1
<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('participants.list') }}" wire:navigate class="text-sm text-blue-600 hover:text-blue-800">{{ __('العودة') }}</a>
</div>
......@@ -11,11 +11,11 @@
<div class="mb-4 p-3 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">{{ session('error') }}</div>
@endif
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-4">
<div class="flex flex-wrap items-end gap-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-2 md:grid-cols-3 lg:grid-cols-5 gap-3 sm:gap-4 items-end">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('الحالة الحالية') }}</label>
<select wire:model.live="currentFilter" class="rounded-lg border-gray-300 text-sm">
<select wire:model.live="currentFilter" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
<option value="active">{{ __('active') }}</option>
<option value="frozen">{{ __('frozen') }}</option>
<option value="suspended">{{ __('suspended') }}</option>
......@@ -24,29 +24,33 @@
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('التغيير إلى') }}</label>
<select wire:model="targetStatus" class="rounded-lg border-gray-300 text-sm">
<select wire:model="targetStatus" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
<option value="">{{ __('اختر') }}</option>
@foreach($availableTargets as $target)
<option value="{{ $target }}">{{ __($target) }}</option>
@endforeach
</select>
</div>
<div class="flex gap-2">
<button wire:click="selectAll" class="px-3 py-2 text-xs bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
<div class="flex gap-2 col-span-2 md:col-span-1">
<button wire:click="selectAll" class="flex-1 md:flex-none px-3 py-2.5 text-xs bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
{{ __('تحديد الكل') }}
</button>
<button wire:click="deselectAll" class="px-3 py-2 text-xs bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
<button wire:click="deselectAll" class="flex-1 md:flex-none px-3 py-2.5 text-xs bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200">
{{ __('إلغاء التحديد') }}
</button>
</div>
<div class="col-span-2 md:col-span-3 lg:col-span-2">
<button wire:click="openConfirm" @disabled(empty($selectedIds) || empty($targetStatus))
class="px-4 py-2 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50">
class="w-full sm:w-auto px-4 py-2.5 text-sm bg-red-600 text-white rounded-lg hover:bg-red-700 disabled:opacity-50">
{{ __('تنفيذ') }} ({{ count($selectedIds) }})
</button>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
{{-- Desktop Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden hidden md:block">
<div class="overflow-x-auto">
<table class="w-full">
<thead class="bg-gray-50">
<tr>
......@@ -75,11 +79,35 @@ class="w-4 h-4 text-blue-600 rounded border-gray-300">
</tbody>
</table>
</div>
</div>
{{-- Mobile Cards --}}
<div class="md:hidden space-y-3">
@forelse($participants as $p)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-center gap-3">
<input type="checkbox" wire:model="selectedIds" value="{{ $p->id }}"
class="w-4 h-4 text-blue-600 rounded border-gray-300 shrink-0">
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-gray-800 truncate">{{ $p->full_name_ar }}</p>
<div class="flex items-center gap-2 mt-1">
<span class="px-2 py-0.5 text-xs rounded-full bg-gray-100 text-gray-600">{{ __($p->status) }}</span>
<span class="text-xs text-gray-500" dir="ltr">{{ $p->created_at?->format('Y-m-d') }}</span>
</div>
</div>
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-8 text-center text-sm text-gray-500">
{{ __('لا يوجد مشتركين') }}
</div>
@endforelse
</div>
@if($confirmModal)
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50">
<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-2">{{ __('تأكيد التغيير') }}</h3>
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-4">
<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-2">{{ __('تأكيد التغيير') }}</h3>
<p class="text-sm text-gray-600 mb-4">
{{ __('سيتم تغيير حالة :count مشترك من :from إلى :to', [
'count' => count($selectedIds),
......@@ -89,12 +117,12 @@ class="w-4 h-4 text-blue-600 rounded border-gray-300">
</p>
<div class="mb-4">
<label class="block text-sm text-gray-600 mb-1">{{ __('السبب') }} *</label>
<textarea wire:model="reason" rows="2" class="w-full rounded-lg border-gray-300 text-sm"></textarea>
<textarea wire:model="reason" rows="2" class="w-full rounded-lg border-gray-300 text-sm py-2.5"></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('confirmModal', false)" class="px-4 py-2 text-sm text-gray-600">{{ __('إلغاء') }}</button>
<button wire:click="execute" class="px-4 py-2 text-sm text-white bg-red-600 rounded-lg hover:bg-red-700">{{ __('تأكيد') }}</button>
<div class="flex flex-col-reverse sm:flex-row gap-3 sm:justify-end">
<button wire:click="$set('confirmModal', 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="execute" class="w-full sm:w-auto px-4 py-2.5 text-sm text-white bg-red-600 rounded-lg hover:bg-red-700">{{ __('تأكيد') }}</button>
</div>
</div>
</div>
......
resources/views/livewire/participants/enrollment-history.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/participants/freeze-participant.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/participants/participant-form.blade.php
View file @ 944501f1
<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">
{{ $editing ? __('تعديل بيانات المشترك') : __('تسجيل مشترك جديد') }}
</h1>
<a href="{{ route('participants.list') }}" wire:navigate
......@@ -20,14 +20,14 @@ class="text-gray-600 hover:text-gray-800 text-sm">
{{-- Section 1: Person Info (only for new participants without existing person) --}}
@if(!$editing && !$person_id)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الشخصية') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الشخصية') }}</h2>
{{-- Link existing person option --}}
@if($existingPeople->isNotEmpty())
<div class="mb-6 p-4 bg-blue-50 rounded-lg border border-blue-100">
<label class="block text-sm font-medium text-gray-700 mb-2">{{ __('أو اختر شخص موجود بالفعل') }}</label>
<select wire:model.live="person_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">
<select wire:model.live="person_id" 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">
<option value="">{{ __('— تسجيل شخص جديد —') }}</option>
@foreach($existingPeople as $person)
<option value="{{ $person->id }}">
......@@ -39,34 +39,34 @@ class="text-gray-600 hover:text-gray-800 text-sm">
</div>
@endif
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }} <span class="text-red-500">*</span></label>
<input type="text" 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="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالإنجليزية') }} <span class="text-red-500">*</span></label>
<input type="text" 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="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الرقم القومي') }}</label>
<input type="text" wire:model="national_id" 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 px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ الميلاد') }}</label>
<input type="date" wire:model="date_of_birth" 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 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('date_of_birth') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الجنس') }} <span class="text-red-500">*</span></label>
<select wire:model="gender"
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('gender') 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('gender') border-red-500 @enderror">
<option value="male">{{ __('ذكر') }}</option>
<option value="female">{{ __('أنثى') }}</option>
</select>
......@@ -75,21 +75,21 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الهاتف') }}</label>
<input type="text" wire:model="phone" 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 px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('البريد الإلكتروني') }}</label>
<input type="email" wire:model="email" 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 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('email') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
</div>
</div>
@elseif(!$editing && $person_id)
{{-- Show selected person info --}}
<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 class="flex items-center justify-between mb-2">
<h2 class="text-lg font-semibold text-gray-800">{{ __('الشخص المحدد') }}</h2>
<h2 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('الشخص المحدد') }}</h2>
<button type="button" wire:click="$set('person_id', null)" class="text-sm text-red-600 hover:text-red-800">
{{ __('تغيير') }}
</button>
......@@ -99,14 +99,14 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endif
{{-- Section 2: Participant Info --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('بيانات الاشتراك') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('بيانات الاشتراك') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مصدر التسجيل') }} <span class="text-red-500">*</span></label>
<select wire:model="registration_source"
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('registration_source') 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('registration_source') border-red-500 @enderror"
@if($editing) disabled @endif>
<option value="walk_in">{{ __('حضور مباشر') }}</option>
<option value="online">{{ __('عبر الإنترنت') }}</option>
......@@ -121,7 +121,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('النشاط الأساسي') }}</label>
<select wire:model="primary_activity_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">
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">
<option value="">{{ __('— اختر نشاط —') }}</option>
@foreach($activities as $act)
<option value="{{ $act->id }}">{{ $act->name_ar }}</option>
......@@ -131,7 +131,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('المستوى') }}</label>
<select wire:model="skill_level"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('— غير محدد —') }}</option>
<option value="beginner">{{ __('مبتدئ') }}</option>
<option value="intermediate">{{ __('متوسط') }}</option>
......@@ -142,7 +142,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع العضوية') }} <span class="text-red-500">*</span></label>
<select wire:model.live="membership_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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('— غير محدد —') }}</option>
<option value="member">{{ __('عضو') }}</option>
<option value="non_member">{{ __('غير عضو') }}</option>
......@@ -153,7 +153,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('رقم عضوية النادي') }} <span class="text-red-500">*</span></label>
<input type="text" wire:model="membership_id" dir="ltr"
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 @error('membership_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('membership_id') border-red-500 @enderror">
@error('membership_id') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
@endif
......@@ -161,42 +161,42 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Section 3: Physical Attributes --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الجسدية') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الجسدية') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4">
<div class="grid grid-cols-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الطول (سم)') }}</label>
<input type="number" wire:model="height_cm" dir="ltr" step="0.1" min="50" max="250"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
@error('height_cm') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الوزن (كجم)') }}</label>
<input type="number" wire:model="weight_kg" dir="ltr" step="0.1" min="10" max="200"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
@error('weight_kg') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('رقم القميص') }}</label>
<input type="number" wire:model="jersey_number" dir="ltr" min="0" max="999"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
@error('jersey_number') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مقاس القميص') }}</label>
<input type="text" wire:model="jersey_size" dir="ltr" placeholder="XL"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مقاس الحذاء') }}</label>
<input type="text" wire:model="shoe_size" dir="ltr" placeholder="42"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اليد المسيطرة') }}</label>
<select wire:model="dominant_hand"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('— غير محدد —') }}</option>
<option value="right">{{ __('يمنى') }}</option>
<option value="left">{{ __('يسرى') }}</option>
......@@ -206,7 +206,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('القدم المسيطرة') }}</label>
<select wire:model="dominant_foot"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('— غير محدد —') }}</option>
<option value="right">{{ __('يمنى') }}</option>
<option value="left">{{ __('يسرى') }}</option>
......@@ -217,11 +217,11 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Section 4: Medical --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الطبية') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('البيانات الطبية') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div class="flex items-center gap-3">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div class="min-h-[44px] flex items-center gap-3">
<input type="checkbox" wire:model="medical_clearance" id="medical_clearance"
class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<label for="medical_clearance" class="text-sm font-medium text-gray-700">{{ __('موافقة طبية') }}</label>
......@@ -229,20 +229,20 @@ class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ انتهاء الموافقة الطبية') }}</label>
<input type="date" wire:model="medical_clearance_expires" 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 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('medical_clearance_expires') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
</div>
</div>
{{-- Section 5: Guardian Assignment --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('ولي الأمر') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('ولي الأمر') }}</h2>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('ولي الأمر الأساسي') }}</label>
<select wire:model="primary_guardian_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">
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">
<option value="">{{ __('— بدون ولي أمر —') }}</option>
@foreach($guardians as $guardian)
<option value="{{ $guardian->id }}">
......@@ -255,24 +255,24 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
{{-- Section 6: Notes --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('ملاحظات') }}</h2>
<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-800 mb-4 border-b border-gray-100 pb-2">{{ __('ملاحظات') }}</h2>
<textarea wire:model="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"
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"
placeholder="{{ __('ملاحظات إضافية...') }}"></textarea>
</div>
{{-- Submit --}}
<div class="flex items-center justify-end gap-3">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('participants.list') }}" wire:navigate
class="px-6 py-2 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 text-sm font-medium">
class="text-center px-4 sm:px-6 py-2.5 border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-50 text-sm 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 disabled:opacity-50 text-sm font-medium">
class="text-center px-4 sm:px-6 py-2.5 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">
{{ $editing ? __('حفظ التعديلات') : __('تسجيل المشترك') }}
</span>
......
resources/views/livewire/participants/participant-import.blade.php
View file @ 944501f1
<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>
......
resources/views/livewire/participants/participant-list.blade.php
View file @ 944501f1
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('المشتركين') }}</h1>
<!-- Header -->
<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 class="flex items-center gap-2">
<a href="{{ route('export.participants', ['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">
class="inline-flex items-center gap-2 px-3 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 text-xs sm:text-sm font-medium 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="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/></svg>
{{ __('تصدير CSV') }}
<span class="hidden sm:inline">{{ __('تصدير CSV') }}</span>
</a>
@can('participants.create')
<a href="{{ route('participants.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">
class="inline-flex items-center gap-2 px-3 sm:px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-xs sm:text-sm font-medium 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="M12 4v16m8-8H4"/></svg>
{{ __('تسجيل مشترك') }}
</a>
......@@ -19,32 +20,32 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
{{-- 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 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-5 gap-4">
<div class="sm:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3">
<div class="col-span-2 md:col-span-1 lg:col-span-2">
<input type="text" wire:model.live.debounce.300ms="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-3 sm:px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
</div>
<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">
<select wire:model.live="status" class="px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="">{{ __('كل الحالات') }}</option>
@foreach($statusOptions as $value => $label)
<option value="{{ $value }}">{{ __($label) }}</option>
@endforeach
</select>
<select wire:model.live="activity" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="activity" class="px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="">{{ __('كل الأنشطة') }}</option>
@foreach($activities as $act)
<option value="{{ $act->id }}">{{ $act->name_ar }}</option>
@endforeach
</select>
<select wire:model.live="skillLevel" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="skillLevel" class="px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<option value="">{{ __('كل المستويات') }}</option>
@foreach($skillLevelOptions as $value => $label)
<option value="{{ $value }}">{{ __($label) }}</option>
......@@ -53,9 +54,10 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
</div>
{{-- Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
{{-- Desktop Table --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden hidden md:block">
<div wire:loading.class="opacity-50 pointer-events-none">
<div class="overflow-x-auto">
<table class="w-full text-sm">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
......@@ -74,31 +76,19 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ $participant->participant_number }}
</td>
<td class="px-4 py-3">
<span class="font-medium text-gray-800">
{{ $participant->person?->name_ar }}
</span>
<span class="font-medium text-gray-800">{{ $participant->person?->name_ar }}</span>
@if($participant->person?->name)
<p class="text-xs text-gray-500" dir="ltr">
{{ $participant->person->name }}
</p>
<p class="text-xs text-gray-500" dir="ltr">{{ $participant->person->name }}</p>
@endif
</td>
<td class="px-4 py-3 text-gray-600">
{{ $participant->primaryActivity?->name_ar ?? '—' }}
</td>
<td class="px-4 py-3 text-gray-600">{{ $participant->primaryActivity?->name_ar ?? '—' }}</td>
<td class="px-4 py-3 text-center">
@php
$statusValue = $participant->status->value ?? $participant->status;
$statusColors = [
'registered' => 'blue',
'active' => 'green',
'frozen' => 'cyan',
'suspended' => 'red',
'inactive' => 'gray',
'graduated' => 'purple',
'transferred' => 'amber',
'withdrawn' => 'orange',
'blacklisted' => 'rose',
'registered' => 'blue', 'active' => 'green', 'frozen' => 'cyan',
'suspended' => 'red', 'inactive' => 'gray', 'graduated' => 'purple',
'transferred' => 'amber', 'withdrawn' => 'orange', 'blacklisted' => 'rose',
];
$color = $statusColors[$statusValue] ?? 'gray';
@endphp
......@@ -106,18 +96,16 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{ __($statusOptions[$statusValue] ?? $statusValue) }}
</span>
</td>
<td class="px-4 py-3 text-center text-gray-600" dir="ltr">
{{ $participant->registration_date?->format('Y-m-d') ?? '—' }}
</td>
<td class="px-4 py-3 text-center space-x-2 space-x-reverse">
<td class="px-4 py-3 text-center text-gray-600" dir="ltr">{{ $participant->registration_date?->format('Y-m-d') ?? '—' }}</td>
<td class="px-4 py-3 text-center">
<div class="flex items-center justify-center gap-3">
@can('participants.view')
<a href="{{ route('participants.show', $participant) }}" wire:navigate
class="text-blue-600 hover:text-blue-800 text-sm">{{ __('عرض') }}</a>
<a href="{{ route('participants.show', $participant) }}" wire:navigate class="text-blue-600 hover:text-blue-800 text-sm font-medium">{{ __('عرض') }}</a>
@endcan
@can('participants.update')
<a href="{{ route('participants.edit', $participant) }}" wire:navigate
class="text-green-600 hover:text-green-800 text-sm">{{ __('تعديل') }}</a>
<a href="{{ route('participants.edit', $participant) }}" wire:navigate class="text-green-600 hover:text-green-800 text-sm font-medium">{{ __('تعديل') }}</a>
@endcan
</div>
</td>
</tr>
@empty
......@@ -129,10 +117,7 @@ class="text-green-600 hover:text-green-800 text-sm">{{ __('تعديل') }}</a>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا يوجد مشتركين') }}</p>
@can('participants.create')
<a href="{{ route('participants.create') }}" wire:navigate
class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
{{ __('تسجيل أول مشترك') }}
</a>
<a href="{{ route('participants.create') }}" wire:navigate class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">{{ __('تسجيل أول مشترك') }}</a>
@endcan
</div>
</td>
......@@ -141,6 +126,7 @@ class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
</tbody>
</table>
</div>
</div>
@if($participants->hasPages())
<div class="px-4 py-3 border-t border-gray-200">
......@@ -148,4 +134,70 @@ class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
</div>
@endif
</div>
{{-- Mobile Card List --}}
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($participants as $participant)
@php
$statusValue = $participant->status->value ?? $participant->status;
$statusColors = [
'registered' => 'blue', 'active' => 'green', 'frozen' => 'cyan',
'suspended' => 'red', 'inactive' => 'gray', 'graduated' => 'purple',
'transferred' => 'amber', 'withdrawn' => 'orange', 'blacklisted' => 'rose',
];
$color = $statusColors[$statusValue] ?? 'gray';
@endphp
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-start justify-between gap-3">
<div class="flex-1 min-w-0">
<p class="font-semibold text-gray-800 truncate">{{ $participant->person?->name_ar }}</p>
<p class="text-xs text-gray-500 font-mono mt-0.5" dir="ltr">{{ $participant->participant_number }}</p>
</div>
<span class="px-2 py-0.5 text-xs bg-{{ $color }}-100 text-{{ $color }}-700 rounded-full whitespace-nowrap">
{{ __($statusOptions[$statusValue] ?? $statusValue) }}
</span>
</div>
<div class="mt-3 flex items-center gap-4 text-xs text-gray-500">
@if($participant->primaryActivity?->name_ar)
<span class="truncate">{{ $participant->primaryActivity->name_ar }}</span>
@endif
@if($participant->registration_date)
<span dir="ltr" class="whitespace-nowrap">{{ $participant->registration_date->format('Y-m-d') }}</span>
@endif
</div>
<div class="mt-3 pt-3 border-t border-gray-100 flex items-center gap-4">
@can('participants.view')
<a href="{{ route('participants.show', $participant) }}" wire:navigate
class="flex-1 text-center py-2 text-sm font-medium text-blue-600 hover:text-blue-800 bg-blue-50 rounded-lg transition-colors">
{{ __('عرض') }}
</a>
@endcan
@can('participants.update')
<a href="{{ route('participants.edit', $participant) }}" wire:navigate
class="flex-1 text-center py-2 text-sm font-medium text-green-600 hover:text-green-800 bg-green-50 rounded-lg transition-colors">
{{ __('تعديل') }}
</a>
@endcan
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-8 text-center">
<svg class="w-12 h-12 text-gray-300 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0zm6 3a2 2 0 11-4 0 2 2 0 014 0zM7 10a2 2 0 11-4 0 2 2 0 014 0z"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا يوجد مشتركين') }}</p>
@can('participants.create')
<a href="{{ route('participants.create') }}" wire:navigate class="mt-2 inline-block text-blue-600 hover:text-blue-800 text-sm font-medium">{{ __('تسجيل أول مشترك') }}</a>
@endcan
</div>
@endforelse
@if($participants->hasPages())
<div class="mt-4">
{{ $participants->links() }}
</div>
@endif
</div>
</div>
resources/views/livewire/participants/participant-show.blade.php
View file @ 944501f1
......@@ -12,8 +12,8 @@
@endif
{{-- Header --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<div class="flex items-start justify-between">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="flex flex-col sm:flex-row sm:items-start justify-between gap-4">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-full bg-blue-100 flex items-center justify-center">
<span class="text-xl font-bold text-blue-700">
......@@ -52,7 +52,7 @@
</div>
</div>
</div>
<div class="flex items-center gap-2">
<div class="flex items-center gap-2 self-start sm:self-auto">
@can('participants.update')
<a href="{{ route('participants.edit', $participant) }}" wire:navigate
class="px-4 py-2 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 text-sm font-medium">
......@@ -68,7 +68,7 @@ class="px-4 py-2 text-gray-600 hover:text-gray-800 text-sm">
</div>
{{-- Quick Stats Bar --}}
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 mb-6">
<div class="grid grid-cols-2 md:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
{{-- Attendance Rate --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-center gap-3">
......@@ -137,7 +137,7 @@ class="px-4 py-2 text-gray-600 hover:text-gray-800 text-sm">
</div>
{{-- Quick Action Buttons --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4 sm:mb-6">
<div class="flex flex-wrap items-center gap-3">
<span class="text-sm font-medium text-gray-600 me-2">{{ __('إجراءات سريعة') }}:</span>
......@@ -190,7 +190,7 @@ class="inline-flex items-center gap-1.5 px-3 py-1.5 text-xs font-medium bg-blue-
{{-- Tabs --}}
<div x-data="{ activeTab: @entangle('activeTab') }">
<div class="border-b border-gray-200 mb-6">
<nav class="flex gap-6 -mb-px overflow-x-auto">
<nav class="flex gap-2 sm:gap-6 -mb-px overflow-x-auto pb-1">
<button @click="activeTab = 'info'"
:class="activeTab === 'info' ? 'border-blue-600 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700'"
class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
......@@ -228,7 +228,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
<div x-show="activeTab === 'info'" x-cloak>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
{{-- Personal Info Card --}}
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('البيانات الشخصية') }}</h3>
<dl class="space-y-3">
<div class="flex justify-between">
......@@ -259,7 +259,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
</div>
{{-- Participant Info Card --}}
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('بيانات الاشتراك') }}</h3>
<dl class="space-y-3">
<div class="flex justify-between">
......@@ -317,7 +317,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
</div>
{{-- Physical Attributes Card --}}
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('البيانات الجسدية') }}</h3>
<dl class="space-y-3">
<div class="flex justify-between">
......@@ -359,7 +359,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
{{-- Notes Card --}}
@if($participant->notes)
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('ملاحظات') }}</h3>
<p class="text-sm text-gray-600 whitespace-pre-line">{{ $participant->notes }}</p>
</div>
......@@ -369,7 +369,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
{{-- Guardians Tab --}}
<div x-show="activeTab === 'guardians'" x-cloak>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden overflow-x-auto">
@if($participant->guardians->isNotEmpty())
<table class="w-full text-sm">
<thead class="bg-gray-50 border-b border-gray-200">
......@@ -434,7 +434,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
{{-- Attendance Tab --}}
<div x-show="activeTab === 'attendance'" x-cloak>
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('ملخص الحضور') }}</h3>
@if($totalSessions > 0)
......@@ -562,7 +562,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
{{-- Payments Tab --}}
<div x-show="activeTab === 'payments'" x-cloak>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="p-4 border-b border-gray-100 flex items-center justify-between">
<div class="p-4 border-b border-gray-100 flex flex-col sm:flex-row sm:items-center justify-between gap-2">
<h3 class="text-base font-semibold text-gray-800">{{ __('سجل المدفوعات') }}</h3>
@if($wallet)
<div class="flex items-center gap-2 px-3 py-1.5 bg-amber-50 rounded-lg">
......@@ -641,7 +641,7 @@ class="pb-3 border-b-2 text-sm font-medium transition whitespace-nowrap">
{{-- Status Tab --}}
<div x-show="activeTab === 'status'" x-cloak>
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('تغيير الحالة') }}</h3>
<div class="mb-4">
......
resources/views/livewire/participants/status-timeline.blade.php
View file @ 944501f1
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<h3 class="text-sm font-semibold text-gray-700 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-700 mb-4">{{ __('سجل الحالات') }}</h3>
@if($history->isEmpty())
<p class="text-sm text-gray-400 text-center py-4">{{ __('لا يوجد تغييرات') }}</p>
......@@ -7,9 +7,9 @@
<div class="relative">
<div class="absolute top-0 bottom-0 start-3 w-0.5 bg-gray-200"></div>
<div class="space-y-4">
<div class="space-y-3 sm:space-y-4">
@foreach($history as $item)
<div class="flex items-start gap-3 relative">
<div class="flex items-start gap-2 sm:gap-3 relative">
<div class="w-6 h-6 rounded-full border-2 border-white shadow-sm z-10 shrink-0
@switch($item['to'])
@case('active') bg-green-500 @break
......@@ -22,14 +22,14 @@
@endswitch
"></div>
<div class="flex-1 min-w-0">
<div class="flex items-center gap-2 flex-wrap">
<div class="flex items-center gap-1.5 sm:gap-2 flex-wrap">
@if($item['from'])
<span class="text-xs text-gray-500">{{ __($item['from']) }}</span>
<svg class="w-3 h-3 text-gray-400 rtl:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/></svg>
@endif
<span class="text-xs font-medium text-gray-800">{{ __($item['to']) }}</span>
</div>
<p class="text-[11px] text-gray-400 mt-0.5">
<p class="text-[11px] text-gray-400 mt-0.5 truncate">
{{ $item['user'] }} &bull; {{ \Carbon\Carbon::parse($item['date'])->diffForHumans() }}
</p>
</div>
......
resources/views/livewire/people/person-form.blade.php
View file @ 944501f1
<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('people.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">{{ __('← العودة للقائمة') }}</a>
</div>
......@@ -12,9 +12,9 @@
<form wire:submit="save" class="space-y-6">
<!-- Names -->
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }} *</label>
<input type="text" wire:model="name_ar"
......@@ -31,9 +31,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
<!-- Identity -->
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الرقم القومي') }}</label>
<input type="text" wire:model.live.debounce.500ms="national_id" dir="ltr" maxlength="14"
......@@ -60,9 +60,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
<!-- Contact -->
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الهاتف') }}</label>
<input type="text" wire:model="phone" dir="ltr"
......@@ -99,9 +99,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
<!-- Emergency Contact -->
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم') }}</label>
<input type="text" wire:model="emergency_contact_name"
......@@ -123,9 +123,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
<!-- Additional -->
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الجنسية') }}</label>
<input type="text" wire:model="nationality"
......@@ -177,14 +177,14 @@ 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 gap-4">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('people.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 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">
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 text-sm">
<span wire:loading.remove wire:target="save">{{ $editing ? __('حفظ التعديلات') : __('إضافة الشخص') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('people.list') }}" wire:navigate
class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50">{{ __('إلغاء') }}</a>
</div>
</form>
</div>
resources/views/livewire/people/person-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/people/person-show.blade.php
View file @ 944501f1
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ $person->name_ar }}</h1>
<div class="flex items-center gap-3">
<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">{{ $person->name_ar }}</h1>
<div class="flex items-center gap-2 sm:gap-3">
@can('participants.update')
<a href="{{ route('people.edit', $person) }}" 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">
......@@ -12,12 +12,12 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
</div>
</div>
<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 Info -->
<div class="lg:col-span-2 space-y-6">
<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-700 mb-4">{{ __('المعلومات الأساسية') }}</h2>
<dl class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<dl class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<dt class="text-sm text-gray-500">{{ __('الاسم بالعربية') }}</dt>
<dd class="font-medium text-gray-800">{{ $person->name_ar }}</dd>
......@@ -70,9 +70,9 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
</div>
<!-- Contact -->
<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-700 mb-4">{{ __('الاتصال') }}</h2>
<dl class="grid grid-cols-1 sm:grid-cols-2 gap-4">
<dl class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<dt class="text-sm text-gray-500">{{ __('الهاتف') }}</dt>
<dd class="font-medium text-gray-800" dir="ltr">{{ $person->phone ?? '—' }}</dd>
......@@ -102,9 +102,9 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
<!-- Emergency Contact -->
@if($person->emergency_contact_name || $person->emergency_contact_phone)
<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-700 mb-4">{{ __('جهة اتصال الطوارئ') }}</h2>
<dl class="grid grid-cols-1 sm:grid-cols-3 gap-4">
<dl class="grid grid-cols-1 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<dt class="text-sm text-gray-500">{{ __('الاسم') }}</dt>
<dd class="font-medium text-gray-800">{{ $person->emergency_contact_name ?? '—' }}</dd>
......@@ -126,7 +126,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
<div class="space-y-6">
<!-- Guardian Info -->
@if($person->guardian)
<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-700 mb-4">{{ __('بيانات ولي الأمر') }}</h2>
<div class="space-y-2">
<p class="text-sm">
......@@ -167,7 +167,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
<!-- Medical -->
@if($person->blood_type || $person->medical_notes)
<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-700 mb-4">{{ __('معلومات طبية') }}</h2>
@if($person->blood_type)
<p class="text-sm"><span class="text-gray-500">{{ __('فصيلة الدم') }}:</span> <span class="font-medium">{{ $person->blood_type }}</span></p>
......@@ -180,7 +180,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
<!-- Notes -->
@if($person->notes)
<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-700 mb-4">{{ __('ملاحظات') }}</h2>
<p class="text-sm text-gray-700">{{ $person->notes }}</p>
</div>
......
resources/views/livewire/pos/pos-history.blade.php
View file @ 944501f1
<div>
{{-- Header --}}
<div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 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('pos.sell')
<a href="{{ route('pos.terminal') }}"
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 transition-colors">
class="inline-flex items-center gap-2 px-4 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium transition-colors 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="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>
......@@ -14,10 +14,10 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-blue-600 text-white rounded-l
</div>
{{-- Filters --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-6">
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-6">
<div class="grid grid-cols-2 md:grid-cols-4 gap-3 sm:gap-4">
{{-- Search --}}
<div>
<div class="col-span-2 md:col-span-1">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('بحث') }}</label>
<input type="text"
wire:model.live.debounce.300ms="search"
......@@ -61,7 +61,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
{{-- Transactions Table --}}
<div class="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">
<table class="w-full text-sm hidden md:table">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
<th class="px-4 py-3 text-start text-xs font-semibold text-gray-500 uppercase">{{ __('رقم الإيصال') }}</th>
......@@ -134,6 +134,55 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</table>
</div>
{{-- Mobile Cards --}}
<div class="md:hidden" wire:loading.class="opacity-50 pointer-events-none">
@forelse($transactions as $transaction)
<div class="p-3 border-b border-gray-100 last:border-0">
{{-- Top row: receipt number + payment badge --}}
<div class="flex justify-between items-center mb-1">
<span class="font-mono text-xs font-medium text-gray-800" dir="ltr">{{ $transaction->receipt_number }}</span>
@php
$methodValue = $transaction->payment_method instanceof \BackedEnum ? $transaction->payment_method->value : $transaction->payment_method;
@endphp
@switch($methodValue)
@case('cash')
<span class="px-2 py-0.5 text-xs bg-green-100 text-green-700 rounded-full">{{ __('نقدي') }}</span>
@break
@case('card')
<span class="px-2 py-0.5 text-xs bg-blue-100 text-blue-700 rounded-full">{{ __('بطاقة') }}</span>
@break
@case('wallet')
<span class="px-2 py-0.5 text-xs bg-purple-100 text-purple-700 rounded-full">{{ __('محفظة') }}</span>
@break
@case('split')
<span class="px-2 py-0.5 text-xs bg-amber-100 text-amber-700 rounded-full">{{ __('تقسيم') }}</span>
@break
@endswitch
</div>
{{-- Middle: participant name --}}
<div class="mb-1">
@if($transaction->participant && $transaction->participant->person)
<span class="text-gray-800 font-medium text-sm">{{ $transaction->participant->person->name_ar }}</span>
@else
<span class="text-gray-400 italic text-sm">{{ __('عميل عابر') }}</span>
@endif
</div>
{{-- Bottom row: total + date --}}
<div class="flex justify-between items-center">
<span class="font-bold text-gray-800 text-sm" dir="ltr">{{ number_format($transaction->total_amount / 100, 2) }} {{ __('ج.م') }}</span>
<span class="text-xs text-gray-500" dir="ltr">{{ $transaction->processed_at?->format('Y-m-d H:i') }}</span>
</div>
</div>
@empty
<div class="px-4 py-12 text-center">
<svg class="w-12 h-12 text-gray-200 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"/>
</svg>
<p class="text-gray-400 text-sm">{{ __('لا توجد عمليات بيع في هذه الفترة') }}</p>
</div>
@endforelse
</div>
{{-- Pagination --}}
@if($transactions->hasPages())
<div class="border-t border-gray-200 px-4 py-3">
......
resources/views/livewire/pos/pos-terminal.blade.php
View file @ 944501f1
<div x-data="{
activeTab: 'programs',
showParticipantResults: false,
mobileCartOpen: false,
}" class="min-h-[calc(100vh-4rem)]">
{{-- No Open Cash Session Guard --}}
@if(!$hasOpenSession)
<div class="flex flex-col items-center justify-center min-h-[60vh] p-8">
<div class="bg-amber-50 border border-amber-200 rounded-xl p-8 text-center max-w-md">
<svg class="w-16 h-16 text-amber-500 mx-auto mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="flex flex-col items-center justify-center min-h-[60vh] p-4 sm:p-8">
<div class="bg-amber-50 border border-amber-200 rounded-xl p-6 sm:p-8 text-center max-w-md w-full">
<svg class="w-12 h-12 sm:w-16 sm:h-16 text-amber-500 mx-auto mb-3 sm:mb-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z"/>
</svg>
<h3 class="text-lg font-bold text-amber-800 mb-2">{{ __('يجب فتح وردية أولاً') }}</h3>
<p class="text-amber-700 text-sm mb-4">{{ __('لا يمكن إجراء عمليات بيع بدون وردية مفتوحة') }}</p>
<h3 class="text-base sm:text-lg font-bold text-amber-800 mb-2">{{ __('يجب فتح وردية أولاً') }}</h3>
<p class="text-amber-700 text-xs sm:text-sm mb-4">{{ __('لا يمكن إجراء عمليات بيع بدون وردية مفتوحة') }}</p>
<a href="{{ route('cash-sessions.manage') }}"
class="inline-flex items-center gap-2 px-4 py-2 bg-amber-600 text-white rounded-lg hover:bg-amber-700 text-sm font-medium transition-colors">
class="inline-flex items-center gap-2 px-4 py-2.5 min-h-[44px] bg-amber-600 text-white rounded-lg hover:bg-amber-700 text-xs sm:text-sm font-medium 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="M12 4v16m8-8H4"/>
</svg>
......@@ -24,24 +25,24 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-amber-600 text-white rounded-
@else
{{-- Main POS Layout --}}
<div class="flex flex-col lg:flex-row gap-4 p-4 h-full">
<div class="flex flex-col lg:flex-row gap-3 sm:gap-4 p-3 sm:p-4 h-full pb-20 lg:pb-4">
{{-- LEFT PANEL: Catalog & Items (60%) --}}
<div class="lg:w-3/5 space-y-4">
<div class="w-full lg:w-3/5 space-y-3 sm:space-y-4">
{{-- Participant Search --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-center gap-3">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4">
<div class="flex items-center gap-2 sm:gap-3">
<svg class="w-5 h-5 text-gray-400 shrink-0" 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>
@if($participantId)
<div class="flex items-center gap-2 flex-1">
<span class="px-3 py-1 bg-blue-50 text-blue-700 rounded-lg text-sm font-medium">
<div class="flex items-center gap-2 flex-1 min-w-0">
<span class="px-3 py-1.5 min-h-[44px] flex items-center bg-blue-50 text-blue-700 rounded-lg text-xs sm:text-sm font-medium truncate">
{{ $participantName }}
</span>
<button wire:click="clearParticipant" class="text-gray-400 hover:text-red-500 transition-colors">
<button wire:click="clearParticipant" class="min-w-[44px] min-h-[44px] flex items-center justify-center text-gray-400 hover:text-red-500 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>
......@@ -54,7 +55,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-amber-600 text-white rounded-
@focus="showParticipantResults = true"
@click.away="showParticipantResults = false"
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 text-sm">
class="w-full px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm">
{{-- Search Results Dropdown --}}
@if(count($searchResults) > 0)
......@@ -64,8 +65,8 @@ class="absolute z-50 top-full mt-1 w-full bg-white border border-gray-200 rounde
@foreach($searchResults as $result)
<button wire:click="selectParticipant({{ $result['id'] }})"
@click="showParticipantResults = false"
class="w-full text-start px-4 py-2 hover:bg-gray-50 flex items-center justify-between border-b border-gray-100 last:border-b-0">
<span class="text-sm font-medium text-gray-700">{{ $result['name'] }}</span>
class="w-full text-start px-3 sm:px-4 py-2.5 min-h-[44px] hover:bg-gray-50 flex items-center justify-between border-b border-gray-100 last:border-b-0">
<span class="text-xs sm:text-sm font-medium text-gray-700">{{ $result['name'] }}</span>
@if($result['phone'])
<span class="text-xs text-gray-400" dir="ltr">{{ $result['phone'] }}</span>
@endif
......@@ -83,39 +84,39 @@ class="w-full text-start px-4 py-2 hover:bg-gray-50 flex items-center justify-be
<div class="flex border-b border-gray-200">
<button @click="activeTab = 'programs'"
:class="activeTab === 'programs' ? 'border-b-2 border-blue-600 text-blue-700 bg-blue-50/50' : 'text-gray-500 hover:text-gray-700'"
class="flex-1 px-4 py-3 text-sm font-medium transition-colors">
class="flex-1 px-3 sm:px-4 py-3 min-h-[44px] text-xs sm:text-sm font-medium transition-colors">
{{ __('البرامج') }}
</button>
<button @click="activeTab = 'manual'"
:class="activeTab === 'manual' ? 'border-b-2 border-blue-600 text-blue-700 bg-blue-50/50' : 'text-gray-500 hover:text-gray-700'"
class="flex-1 px-4 py-3 text-sm font-medium transition-colors">
class="flex-1 px-3 sm:px-4 py-3 min-h-[44px] text-xs sm:text-sm font-medium transition-colors">
{{ __('عنصر يدوي') }}
</button>
</div>
{{-- Programs Tab --}}
<div x-show="activeTab === 'programs'" class="p-4">
<div x-show="activeTab === 'programs'" class="p-3 sm:p-4">
@if($programs->isEmpty())
<div class="text-center py-8">
<svg class="w-12 h-12 text-gray-300 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="text-center py-6 sm:py-8">
<svg class="w-10 h-10 sm:w-12 sm:h-12 text-gray-300 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا توجد برامج متاحة') }}</p>
<p class="text-gray-500 text-xs sm:text-sm">{{ __('لا توجد برامج متاحة') }}</p>
</div>
@else
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3" wire:loading.class="opacity-50 pointer-events-none" wire:target="addProgram">
<div class="grid grid-cols-2 sm:grid-cols-2 lg:grid-cols-2 gap-2 sm:gap-3" wire:loading.class="opacity-50 pointer-events-none" wire:target="addProgram">
@foreach($programs as $program)
<button wire:click="addProgram({{ $program->id }})"
class="flex items-center gap-3 p-3 border border-gray-200 rounded-lg hover:border-blue-300 hover:bg-blue-50/50 transition-all text-start group">
<div class="w-10 h-10 rounded-lg bg-blue-100 text-blue-600 flex items-center justify-center shrink-0 group-hover:bg-blue-200 transition-colors">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="flex items-center gap-2 sm:gap-3 p-2.5 sm:p-3 min-h-[44px] border border-gray-200 rounded-lg hover:border-blue-300 hover:bg-blue-50/50 transition-all text-start group">
<div class="w-8 h-8 sm:w-10 sm:h-10 rounded-lg bg-blue-100 text-blue-600 flex items-center justify-center shrink-0 group-hover:bg-blue-200 transition-colors">
<svg class="w-4 h-4 sm:w-5 sm:h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/>
</svg>
</div>
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-gray-800 truncate">{{ $program->name_ar }}</p>
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $program->name_ar }}</p>
</div>
<svg class="w-4 h-4 text-gray-400 group-hover:text-blue-500 transition-colors shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<svg class="w-4 h-4 text-gray-400 group-hover:text-blue-500 transition-colors shrink-0 hidden sm:block" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/>
</svg>
</button>
......@@ -125,38 +126,38 @@ class="flex items-center gap-3 p-3 border border-gray-200 rounded-lg hover:borde
</div>
{{-- Manual Item Tab --}}
<div x-show="activeTab === 'manual'" class="p-4">
<div x-show="activeTab === 'manual'" class="p-3 sm:p-4">
<div class="space-y-3">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم العنصر') }}</label>
<label class="block text-xs sm:text-sm font-medium text-gray-700 mb-1">{{ __('اسم العنصر') }}</label>
<input type="text"
wire:model="manualItemName"
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 text-sm">
class="w-full px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm">
</div>
<div class="grid grid-cols-2 gap-3">
<div class="grid grid-cols-2 gap-2 sm:gap-3">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('السعر (ج.م)') }}</label>
<label class="block text-xs sm:text-sm font-medium text-gray-700 mb-1">{{ __('السعر (ج.م)') }}</label>
<input type="number"
wire:model="manualItemPrice"
min="0"
step="0.01"
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 text-sm">
class="w-full px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الكمية') }}</label>
<label class="block text-xs sm:text-sm font-medium text-gray-700 mb-1">{{ __('الكمية') }}</label>
<input type="number"
wire:model="manualItemQty"
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 text-sm">
class="w-full px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm">
</div>
</div>
<button wire:click="addManualItem"
wire:loading.attr="disabled"
wire:target="addManualItem"
class="w-full px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-sm font-medium transition-colors disabled:opacity-50">
class="w-full px-4 py-2.5 min-h-[44px] bg-blue-600 text-white rounded-lg hover:bg-blue-700 text-xs sm:text-sm font-medium transition-colors disabled:opacity-50">
<span wire:loading.remove wire:target="addManualItem">{{ __('إضافة للسلة') }}</span>
<span wire:loading wire:target="addManualItem">{{ __('جارٍ الإضافة...') }}</span>
</button>
......@@ -165,17 +166,17 @@ class="w-full px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 text
</div>
{{-- Coupon --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<label class="block text-sm font-medium text-gray-700 mb-2">{{ __('كود الخصم') }}</label>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4">
<label class="block text-xs sm:text-sm font-medium text-gray-700 mb-2">{{ __('كود الخصم') }}</label>
<div class="flex gap-2">
<input type="text"
wire:model="couponCode"
placeholder="{{ __('أدخل كود الخصم') }}"
class="flex-1 px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm"
class="flex-1 px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm"
dir="ltr">
@if($couponCode)
<button wire:click="$set('couponCode', '')"
class="px-3 py-2 text-gray-400 hover:text-red-500 transition-colors">
class="min-w-[44px] min-h-[44px] flex items-center justify-center text-gray-400 hover:text-red-500 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>
......@@ -186,12 +187,13 @@ class="px-3 py-2 text-gray-400 hover:text-red-500 transition-colors">
</div>
{{-- RIGHT PANEL: Cart (40%) --}}
<div class="lg:w-2/5">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 flex flex-col lg:sticky lg:top-4 lg:max-h-[calc(100vh-6rem)]">
<div id="cart-section" class="w-full lg:w-2/5">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 flex flex-col lg:sticky lg:top-4 lg:max-h-[calc(100vh-6rem)]"
:class="{ 'hidden lg:flex': !mobileCartOpen, 'flex': mobileCartOpen }">
{{-- Cart Header --}}
<div class="flex items-center justify-between p-4 border-b border-gray-200">
<h2 class="text-lg font-bold text-gray-800 flex items-center gap-2">
<div class="flex items-center justify-between p-3 sm:p-4 border-b border-gray-200">
<h2 class="text-base sm:text-lg font-bold text-gray-800 flex items-center gap-2">
<svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/>
</svg>
......@@ -200,21 +202,30 @@ class="px-3 py-2 text-gray-400 hover:text-red-500 transition-colors">
<span class="px-2 py-0.5 text-xs bg-blue-100 text-blue-700 rounded-full">{{ count($cart) }}</span>
@endif
</h2>
<div class="flex items-center gap-2">
@if(count($cart) > 0)
<button wire:click="newTransaction"
wire:loading.attr="disabled"
class="text-xs text-red-500 hover:text-red-700 transition-colors">
class="text-xs text-red-500 hover:text-red-700 transition-colors min-h-[44px] flex items-center px-2">
{{ __('مسح الكل') }}
</button>
@endif
{{-- Mobile close button --}}
<button @click="mobileCartOpen = false"
class="lg:hidden min-w-[44px] min-h-[44px] flex items-center justify-center text-gray-400 hover:text-gray-600 transition-colors">
<svg class="w-5 h-5" 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>
</button>
</div>
</div>
{{-- Cart Items --}}
<div class="flex-1 overflow-y-auto p-4 space-y-3" wire:loading.class="opacity-50 pointer-events-none" wire:target="removeItem,updateQuantity">
<div class="flex-1 overflow-y-auto p-3 sm:p-4 space-y-2 sm:space-y-3" wire:loading.class="opacity-50 pointer-events-none" wire:target="removeItem,updateQuantity">
@forelse($cart as $index => $item)
<div class="flex items-start gap-3 p-3 bg-gray-50 rounded-lg">
<div class="flex items-start gap-2 sm:gap-3 p-2.5 sm:p-3 bg-gray-50 rounded-lg">
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-gray-800 truncate">{{ $item['item_name_ar'] }}</p>
<p class="text-xs sm:text-sm font-medium text-gray-800 truncate">{{ $item['item_name_ar'] }}</p>
<div class="flex items-center gap-2 mt-1">
<span class="text-xs text-gray-500" dir="ltr">{{ number_format($item['unit_price'] / 100, 2) }} {{ __('ج.م') }}</span>
@if($item['discount_amount'] > 0)
......@@ -226,35 +237,35 @@ class="text-xs text-red-500 hover:text-red-700 transition-colors">
{{-- Quantity Controls --}}
<div class="flex items-center gap-1">
<button wire:click="updateQuantity({{ $index }}, {{ $item['quantity'] - 1 }})"
class="w-6 h-6 flex items-center justify-center rounded bg-gray-200 text-gray-600 hover:bg-gray-300 text-xs transition-colors">
class="w-7 h-7 sm:w-6 sm:h-6 flex items-center justify-center rounded bg-gray-200 text-gray-600 hover:bg-gray-300 text-xs transition-colors">
-
</button>
<span class="w-8 text-center text-sm font-medium" dir="ltr">{{ $item['quantity'] }}</span>
<span class="w-8 text-center text-xs sm:text-sm font-medium" dir="ltr">{{ $item['quantity'] }}</span>
<button wire:click="updateQuantity({{ $index }}, {{ $item['quantity'] + 1 }})"
class="w-6 h-6 flex items-center justify-center rounded bg-gray-200 text-gray-600 hover:bg-gray-300 text-xs transition-colors">
class="w-7 h-7 sm:w-6 sm:h-6 flex items-center justify-center rounded bg-gray-200 text-gray-600 hover:bg-gray-300 text-xs transition-colors">
+
</button>
</div>
{{-- Line Total --}}
<div class="text-end shrink-0">
<p class="text-sm font-bold text-gray-800" dir="ltr">{{ number_format($item['line_total'] / 100, 2) }}</p>
<p class="text-xs sm:text-sm font-bold text-gray-800" dir="ltr">{{ number_format($item['line_total'] / 100, 2) }}</p>
</div>
{{-- Remove --}}
<button wire:click="removeItem({{ $index }})"
class="text-gray-400 hover:text-red-500 transition-colors shrink-0">
class="min-w-[44px] min-h-[44px] flex items-center justify-center text-gray-400 hover:text-red-500 transition-colors shrink-0 -me-2 -my-2">
<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>
</button>
</div>
@empty
<div class="text-center py-12">
<svg class="w-16 h-16 text-gray-200 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="text-center py-8 sm:py-12">
<svg class="w-12 h-12 sm:w-16 sm:h-16 text-gray-200 mx-auto mb-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/>
</svg>
<p class="text-gray-400 text-sm">{{ __('السلة فارغة') }}</p>
<p class="text-gray-400 text-xs sm:text-sm">{{ __('السلة فارغة') }}</p>
<p class="text-gray-300 text-xs mt-1">{{ __('أضف عناصر من القائمة') }}</p>
</div>
@endforelse
......@@ -262,26 +273,26 @@ class="text-gray-400 hover:text-red-500 transition-colors shrink-0">
{{-- Cart Footer: Totals & Checkout --}}
@if(count($cart) > 0)
<div class="border-t border-gray-200 p-4 space-y-3">
<div class="border-t border-gray-200 p-3 sm:p-4 space-y-3">
{{-- Totals --}}
<div class="space-y-1">
@if($cartDiscount > 0)
<div class="flex justify-between text-sm">
<div class="flex justify-between text-xs sm:text-sm">
<span class="text-gray-500">{{ __('المجموع الفرعي') }}</span>
<span class="text-gray-700" dir="ltr">{{ number_format($cartSubtotal / 100, 2) }} {{ __('ج.م') }}</span>
</div>
<div class="flex justify-between text-sm">
<div class="flex justify-between text-xs sm:text-sm">
<span class="text-green-600">{{ __('الخصم') }}</span>
<span class="text-green-600" dir="ltr">-{{ number_format($cartDiscount / 100, 2) }} {{ __('ج.م') }}</span>
</div>
@endif
@if($serviceFee > 0)
<div class="flex justify-between text-sm">
<div class="flex justify-between text-xs sm:text-sm">
<span class="text-amber-600">{{ __('مصاريف خدمة') }}</span>
<span class="text-amber-600" dir="ltr">{{ number_format($serviceFee / 100, 2) }} {{ __('ج.م') }}</span>
</div>
@endif
<div class="flex justify-between text-base font-bold pt-1 border-t border-gray-100">
<div class="flex justify-between text-sm sm:text-base font-bold pt-1 border-t border-gray-100">
<span class="text-gray-800">{{ __('الإجمالي') }}</span>
<span class="text-blue-700" dir="ltr">{{ number_format($cartGrandTotal / 100, 2) }} {{ __('ج.م') }}</span>
</div>
......@@ -289,20 +300,24 @@ class="text-gray-400 hover:text-red-500 transition-colors shrink-0">
{{-- Payment Method --}}
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('طريقة الدفع') }}</label>
<select wire:model.live="paymentMethod"
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-sm">
<label class="block text-xs sm:text-sm font-medium text-gray-700 mb-1">{{ __('طريقة الدفع') }}</label>
<div class="grid grid-cols-1 sm:grid-cols-3 gap-2">
@foreach($paymentMethods as $method)
<option value="{{ $method->value }}">
<label class="relative flex items-center justify-center gap-2 p-2.5 min-h-[44px] border rounded-lg cursor-pointer transition-all text-xs sm:text-sm font-medium
{{ $paymentMethod === $method->value ? 'border-blue-500 bg-blue-50 text-blue-700 ring-2 ring-blue-200' : 'border-gray-200 text-gray-600 hover:border-gray-300' }}">
<input type="radio"
wire:model.live="paymentMethod"
value="{{ $method->value }}"
class="sr-only">
@switch($method->value)
@case('cash') {{ __('نقدي') }} @break
@case('card') {{ __('بطاقة') }} @break
@case('wallet') {{ __('محفظة') }} @break
@case('split') {{ __('تقسيم') }} @break
@endswitch
</option>
</label>
@endforeach
</select>
</div>
</div>
{{-- Split Payment Builder --}}
......@@ -311,7 +326,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<p class="text-xs font-medium text-gray-600">{{ __('تقسيم الدفع') }}</p>
@foreach($splitPayments as $index => $sp)
<div class="flex items-center gap-2 bg-white rounded px-2 py-1">
<div class="flex items-center gap-2 bg-white rounded px-2 py-1.5 min-h-[40px]">
<span class="text-xs text-gray-600 flex-1">
@switch($sp['method'])
@case('cash') {{ __('نقدي') }} @break
......@@ -320,8 +335,8 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endswitch
</span>
<span class="text-xs font-bold" dir="ltr">{{ number_format($sp['amount'] / 100, 2) }}</span>
<button wire:click="removeSplitPayment({{ $index }})" class="text-red-400 hover:text-red-600">
<svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<button wire:click="removeSplitPayment({{ $index }})" class="min-w-[44px] min-h-[44px] flex items-center justify-center text-red-400 hover:text-red-600 -me-2 -my-1">
<svg class="w-3.5 h-3.5" 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>
</button>
......@@ -329,7 +344,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endforeach
<div class="flex gap-2">
<select wire:model="splitMethod" class="flex-1 px-2 py-1 border border-gray-300 rounded text-xs">
<select wire:model="splitMethod" class="flex-1 px-2 py-2 min-h-[44px] border border-gray-300 rounded text-xs">
<option value="cash">{{ __('نقدي') }}</option>
<option value="card">{{ __('بطاقة') }}</option>
<option value="wallet">{{ __('محفظة') }}</option>
......@@ -340,9 +355,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
step="0.01"
placeholder="{{ __('المبلغ') }}"
dir="ltr"
class="w-24 px-2 py-1 border border-gray-300 rounded text-xs">
class="w-24 px-2 py-2 min-h-[44px] border border-gray-300 rounded text-xs">
<button wire:click="addSplitPayment"
class="px-2 py-1 bg-blue-600 text-white rounded text-xs hover:bg-blue-700 transition-colors">
class="min-w-[44px] min-h-[44px] px-3 bg-blue-600 text-white rounded text-xs hover:bg-blue-700 transition-colors font-bold">
+
</button>
</div>
......@@ -364,7 +379,7 @@ class="px-2 py-1 bg-blue-600 text-white rounded text-xs hover:bg-blue-700 transi
<input type="text"
wire:model="notes"
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 text-sm">
class="w-full px-3 sm:px-4 py-2.5 min-h-[44px] border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 text-xs sm:text-sm">
</div>
{{-- Checkout Button --}}
......@@ -372,7 +387,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
wire:loading.attr="disabled"
wire:target="checkout"
@if($paymentMethod === 'split' && collect($splitPayments)->sum(fn ($sp) => $sp['amount']) !== $cartTotal) disabled @endif
class="w-full px-4 py-3 bg-green-600 text-white rounded-lg hover:bg-green-700 text-sm font-bold transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2">
class="w-full px-4 py-3 min-h-[48px] bg-green-600 text-white rounded-lg hover:bg-green-700 text-xs sm:text-sm font-bold transition-colors disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center gap-2">
<span wire:loading.remove wire:target="checkout">
<svg class="w-5 h-5 inline-block" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" 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"/>
......@@ -387,34 +402,72 @@ class="w-full px-4 py-3 bg-green-600 text-white rounded-lg hover:bg-green-700 te
</div>
</div>
{{-- Mobile Sticky Bottom Bar (visible only on mobile when cart has items) --}}
@if(count($cart) > 0)
<div class="fixed bottom-0 inset-x-0 z-40 lg:hidden bg-white border-t border-gray-200 shadow-[0_-4px_6px_-1px_rgba(0,0,0,0.1)]"
x-show="!mobileCartOpen"
x-transition:enter="transition ease-out duration-200"
x-transition:enter-start="translate-y-full"
x-transition:enter-end="translate-y-0"
x-transition:leave="transition ease-in duration-150"
x-transition:leave-start="translate-y-0"
x-transition:leave-end="translate-y-full">
<div class="flex items-center gap-3 p-3 max-w-screen-sm mx-auto">
{{-- Cart summary --}}
<button @click="mobileCartOpen = true; $nextTick(() => { document.getElementById('cart-section').scrollIntoView({ behavior: 'smooth' }) })"
class="flex-1 flex items-center gap-3 min-h-[48px]">
<div class="relative">
<svg class="w-6 h-6 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/>
</svg>
<span class="absolute -top-1.5 -end-1.5 w-5 h-5 flex items-center justify-center bg-blue-600 text-white text-[10px] font-bold rounded-full">{{ count($cart) }}</span>
</div>
<div class="text-start">
<p class="text-xs text-gray-500">{{ __('الإجمالي') }}</p>
<p class="text-sm font-bold text-gray-800" dir="ltr">{{ number_format($cartGrandTotal / 100, 2) }} {{ __('ج.م') }}</p>
</div>
</button>
{{-- Pay button --}}
<button @click="mobileCartOpen = true; $nextTick(() => { document.getElementById('cart-section').scrollIntoView({ behavior: 'smooth' }) })"
class="px-5 py-3 min-h-[48px] bg-green-600 text-white rounded-lg text-sm font-bold hover:bg-green-700 transition-colors flex items-center gap-2 shrink-0">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" 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>
{{ __('ادفع') }}
</button>
</div>
</div>
@endif
{{-- Receipt Modal --}}
@if($showReceipt)
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50" x-data x-transition>
<div class="bg-white rounded-xl shadow-2xl w-full max-w-sm mx-4 overflow-hidden">
<div class="p-6 text-center">
<div class="w-16 h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-4">
<svg class="w-8 h-8 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="fixed inset-0 z-50 flex items-center justify-center bg-black/50 p-0 sm:p-4" x-data x-transition>
<div class="bg-white sm:rounded-xl shadow-2xl w-full h-full sm:h-auto sm:max-w-sm overflow-hidden flex flex-col sm:block">
<div class="p-4 sm:p-6 text-center flex-1 flex flex-col items-center justify-center">
<div class="w-14 h-14 sm:w-16 sm:h-16 bg-green-100 rounded-full flex items-center justify-center mx-auto mb-3 sm:mb-4">
<svg class="w-7 h-7 sm:w-8 sm:h-8 text-green-600" 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>
</div>
<h3 class="text-lg font-bold text-gray-800 mb-2">{{ __('تمت العملية بنجاح') }}</h3>
<div class="bg-gray-50 rounded-lg p-4 my-4 space-y-2">
<div class="flex justify-between text-sm">
<h3 class="text-base sm:text-lg font-bold text-gray-800 mb-2">{{ __('تمت العملية بنجاح') }}</h3>
<div class="bg-gray-50 rounded-lg p-3 sm:p-4 my-3 sm:my-4 space-y-2 w-full">
<div class="flex justify-between text-xs sm:text-sm">
<span class="text-gray-500">{{ __('رقم الإيصال') }}</span>
<span class="font-mono font-bold text-gray-800" dir="ltr">{{ $lastReceiptNumber }}</span>
</div>
<div class="flex justify-between text-sm">
<div class="flex justify-between text-xs sm:text-sm">
<span class="text-gray-500">{{ __('المبلغ') }}</span>
<span class="font-bold text-green-700" dir="ltr">{{ number_format($lastTransactionTotal / 100, 2) }} {{ __('ج.م') }}</span>
</div>
</div>
</div>
<div class="border-t border-gray-200 p-4 flex gap-3">
<div class="border-t border-gray-200 p-3 sm:p-4 flex gap-3">
@if($lastTransactionUuid)
<x-ui.print-receipt-button :route="route('receipts.pos.print', $lastTransactionUuid)" class="flex-1" />
@endif
<button wire:click="closeReceipt"
class="flex-1 px-4 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors">
class="flex-1 px-4 py-2.5 min-h-[44px] bg-blue-600 text-white rounded-lg text-xs sm:text-sm font-medium hover:bg-blue-700 transition-colors">
{{ __('عملية جديدة') }}
</button>
</div>
......
resources/views/livewire/pricing/base-price-form.blade.php
View file @ 944501f1
<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">
{{ $editing ? __('تعديل السعر الأساسي') : __('إضافة سعر أساسي') }}
</h1>
<a href="{{ route('pricing.base-prices') }}" wire:navigate
......@@ -14,14 +14,14 @@ class="text-gray-600 hover:text-gray-800 text-sm">{{ __('رجوع للقائمة
</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">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Name Arabic --}}
<div>
<label for="name_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }} <span class="text-red-500">*</span></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-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -29,14 +29,14 @@ 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">
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"
</div>
{{-- Priceable Type --}}
<div>
<label for="priceable_type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع العنصر') }} <span class="text-red-500">*</span></label>
<select id="priceable_type" wire:model.live="priceable_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('priceable_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('priceable_type') border-red-500 @enderror">
<option value="">{{ __('اختر نوع العنصر') }}</option>
<option value="training_program">{{ __('برنامج تدريبي') }}</option>
<option value="activity">{{ __('نشاط') }}</option>
......@@ -48,7 +48,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="priceable_id" class="block text-sm font-medium text-gray-700 mb-1">{{ __('العنصر') }} <span class="text-red-500">*</span></label>
<select id="priceable_id" wire:model="priceable_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('priceable_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('priceable_id') border-red-500 @enderror"
{{ empty($priceable_type) ? 'disabled' : '' }}>
<option value="">{{ __('اختر العنصر') }}</option>
@foreach($priceableOptions as $id => $label)
......@@ -62,7 +62,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">
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"
<option value="">{{ __('كل الفروع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -75,7 +75,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="amount" class="block text-sm font-medium text-gray-700 mb-1">{{ __('المبلغ (ج.م)') }} <span class="text-red-500">*</span></label>
<input type="number" id="amount" wire:model="amount" step="0.01" min="0.01" 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('amount') 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('amount') border-red-500 @enderror">
@error('amount') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -83,7 +83,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="effective_from" class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ البداية') }} <span class="text-red-500">*</span></label>
<input type="date" id="effective_from" wire:model="effective_from" 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('effective_from') 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('effective_from') border-red-500 @enderror">
@error('effective_from') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -91,7 +91,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="effective_to" class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ النهاية') }}</label>
<input type="date" id="effective_to" wire:model="effective_to" 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('effective_to') 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('effective_to') border-red-500 @enderror">
<p class="mt-1 text-xs text-gray-500">{{ __('اتركه فارغاً للسعر المفتوح') }}</p>
@error('effective_to') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -100,39 +100,39 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="priority" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الأولوية') }}</label>
<input type="number" id="priority" wire:model="priority" 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">
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"
<p class="mt-1 text-xs text-gray-500">{{ __('الأولوية الأعلى تُطبّق أولاً') }}</p>
</div>
{{-- Is Active --}}
<div class="flex items-center gap-3 pt-6">
<div class="min-h-[44px] flex items-center gap-3 pt-6">
<input type="checkbox" id="is_active" wire:model="is_active"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<label for="is_active" class="text-sm font-medium text-gray-700">{{ __('نشط') }}</label>
</div>
{{-- Notes --}}
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label for="notes" class="block text-sm font-medium text-gray-700 mb-1">{{ __('ملاحظات') }}</label>
<textarea id="notes" wire:model="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"></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"</textarea>
@error('notes') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
</div>
{{-- Submit --}}
<div class="mt-6 flex items-center gap-3">
<div class="mt-6 flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('pricing.base-prices') }}" 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 font-medium text-sm">
{{ __('إلغاء') }}
</a>
<button type="submit"
wire:loading.attr="disabled"
wire:target="save"
class="inline-flex items-center gap-2 px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 font-medium text-sm 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 font-medium text-sm disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ $editing ? __('تحديث') : __('حفظ') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('pricing.base-prices') }}" wire:navigate
class="px-6 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 font-medium text-sm">
{{ __('إلغاء') }}
</a>
</div>
</form>
</div>
......
resources/views/livewire/pricing/base-price-list.blade.php
View file @ 944501f1
<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('pricing.create')
<a href="{{ route('pricing.base-prices.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>
{{ __('إضافة سعر') }}
<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
@if(session('error'))
<div class="mb-4 p-4 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">
<div class="mb-4 p-3 sm:p-4 bg-red-50 border border-red-200 rounded-lg text-red-700 text-sm">
{{ session('error') }}
</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">
<div class="sm:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-3 gap-3">
<div class="col-span-2 md:col-span-2">
<input type="text" wire:model.live.debounce.300ms="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-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<select wire:model.live="activeFilter" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="activeFilter" class="px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('الكل') }}</option>
<option value="1">{{ __('نشط') }}</option>
<option value="0">{{ __('غير نشط') }}</option>
......@@ -38,9 +38,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</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>
......@@ -125,4 +125,86 @@ class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
</div>
@endif
</div>
{{-- Mobile Cards --}}
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($prices as $price)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-start justify-between gap-2 mb-3">
<div>
<span class="font-medium text-gray-800">{{ $price->name_ar }}</span>
@if($price->priority > 0)
<span class="ms-1 text-xs text-gray-400">({{ $price->priority }})</span>
@endif
</div>
<button wire:click="toggleActive('{{ $price->uuid }}')"
wire:loading.attr="disabled"
class="px-2 py-0.5 text-xs rounded-full shrink-0 {{ $price->is_active ? 'bg-green-100 text-green-700' : 'bg-gray-100 text-gray-600' }}">
{{ $price->is_active ? __('نشط') : __('غير نشط') }}
</button>
</div>
<div class="space-y-1.5 text-sm text-gray-600">
@if($price->priceable)
<div class="flex items-center gap-2">
<span class="text-gray-400">{{ __('العنصر') }}:</span>
<span>{{ $price->priceable->name_ar ?? '-' }}</span>
</div>
@endif
<div class="flex items-center gap-2">
<span class="text-gray-400">{{ __('الفرع') }}:</span>
<span>{{ $price->branch?->name_ar ?? __('الكل') }}</span>
</div>
<div class="flex items-center gap-2">
<span class="text-gray-400">{{ __('المبلغ') }}:</span>
<span class="font-bold text-gray-800" dir="ltr">{{ number_format($price->amount / 100, 2) }} {{ __('ج.م') }}</span>
</div>
<div class="flex items-center gap-2">
<span class="text-gray-400">{{ __('الفترة') }}:</span>
<span dir="ltr">
{{ $price->effective_from?->format('Y-m-d') }}
@if($price->effective_to)
- {{ $price->effective_to->format('Y-m-d') }}
@else
<span class="text-green-600">({{ __('مفتوح') }})</span>
@endif
</span>
</div>
</div>
@can('pricing.update')
<div class="mt-3 pt-3 border-t border-gray-100">
<a href="{{ route('pricing.base-prices.edit', $price) }}" wire:navigate
class="inline-flex items-center gap-1 py-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
{{ __('تعديل') }}
</a>
</div>
@endcan
</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="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا توجد أسعار أساسية') }}</p>
@can('pricing.create')
<a href="{{ route('pricing.base-prices.create') }}" wire:navigate
class="mt-2 text-blue-600 hover:text-blue-800 text-sm font-medium">
{{ __('إضافة أول سعر') }}
</a>
@endcan
</div>
</div>
@endforelse
@if($prices->hasPages())
<div class="mt-4">
{{ $prices->links() }}
</div>
@endif
</div>
</div>
resources/views/livewire/pricing/pricing-rule-form.blade.php
View file @ 944501f1
<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">
{{ $editing ? __('تعديل قاعدة التسعير') : __('إضافة قاعدة تسعير') }}
</h1>
<a href="{{ route('pricing.rules') }}" wire:navigate
......@@ -14,14 +14,14 @@ class="text-gray-600 hover:text-gray-800 text-sm">{{ __('رجوع للقائمة
</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">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
{{-- Name Arabic --}}
<div>
<label for="name_ar" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }} <span class="text-red-500">*</span></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-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -29,14 +29,14 @@ 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">
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"
</div>
{{-- Rule Type --}}
<div>
<label for="rule_type" class="block text-sm font-medium text-gray-700 mb-1">{{ __('نوع القاعدة') }} <span class="text-red-500">*</span></label>
<select id="rule_type" wire:model.live="rule_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('rule_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('rule_type') border-red-500 @enderror">
<option value="">{{ __('اختر نوع القاعدة') }}</option>
@foreach($ruleTypes as $value => $label)
<option value="{{ $value }}">{{ $label }}</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">{{ __('نوع التعديل') }} <span class="text-red-500">*</span></label>
<select id="adjustment_type" wire:model.live="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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 @error('adjustment_type') border-red-500 @enderror">
<option value="">{{ __('اختر نوع التعديل') }}</option>
@foreach($adjustmentTypes as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
......@@ -69,7 +69,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endif
</label>
<input type="number" id="adjustment_value" wire:model="adjustment_value" step="0.01" min="0.01" 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('adjustment_value') 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('adjustment_value') border-red-500 @enderror">
@error('adjustment_value') <p class="mt-1 text-xs 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>
<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">
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"
<option value="">{{ __('كل الفروع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -89,7 +89,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="priority" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الأولوية') }}</label>
<input type="number" id="priority" wire:model="priority" 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">
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"
<p class="mt-1 text-xs text-gray-500">{{ __('الرقم الأقل يُطبّق أولاً') }}</p>
</div>
......@@ -97,7 +97,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="max_discount_percent" class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأقصى للخصم %') }}</label>
<input type="number" id="max_discount_percent" wire:model="max_discount_percent" min="1" max="100" 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('max_discount_percent') 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('max_discount_percent') border-red-500 @enderror">
<p class="mt-1 text-xs text-gray-500">{{ __('اتركه فارغاً لعدم وجود حد') }}</p>
@error('max_discount_percent') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -106,7 +106,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="usage_limit" class="block text-sm font-medium text-gray-700 mb-1">{{ __('حد الاستخدام') }}</label>
<input type="number" id="usage_limit" wire:model="usage_limit" 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">
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"
<p class="mt-1 text-xs text-gray-500">{{ __('اتركه فارغاً لاستخدام غير محدود') }}</p>
</div>
......@@ -114,7 +114,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="effective_from" class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ البداية') }} <span class="text-red-500">*</span></label>
<input type="date" id="effective_from" wire:model="effective_from" 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('effective_from') 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('effective_from') border-red-500 @enderror">
@error('effective_from') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
......@@ -122,19 +122,19 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<div>
<label for="effective_to" class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ النهاية') }}</label>
<input type="date" id="effective_to" wire:model="effective_to" 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('effective_to') 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('effective_to') border-red-500 @enderror">
@error('effective_to') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
{{-- Is Stackable --}}
<div class="flex items-center gap-3 pt-6">
<div class="min-h-[44px] flex items-center gap-3 pt-6">
<input type="checkbox" id="is_stackable" wire:model="is_stackable"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<label for="is_stackable" class="text-sm font-medium text-gray-700">{{ __('قابل للتكديس مع قواعد أخرى') }}</label>
</div>
{{-- Is Active --}}
<div class="flex items-center gap-3 pt-6">
<div class="min-h-[44px] flex items-center gap-3 pt-6">
<input type="checkbox" id="is_active" wire:model="is_active"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<label for="is_active" class="text-sm font-medium text-gray-700">{{ __('نشط') }}</label>
......@@ -144,7 +144,7 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
{{-- Conditions Section --}}
@if($rule_type)
<div class="mt-6 border-t border-gray-200 pt-6">
<h3 class="text-lg font-medium text-gray-800 mb-4">{{ __('الشروط') }}</h3>
<h3 class="text-base sm:text-lg font-medium text-gray-800 mb-4">{{ __('الشروط') }}</h3>
<div class="bg-gray-50 rounded-lg p-4" x-data="{ conditions: @entangle('conditions') }">
@switch($rule_type)
@case('age')
......@@ -153,13 +153,13 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('العمر الأدنى') }}</label>
<input type="number" min="0" dir="ltr"
x-model.number="conditions.min_age"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('العمر الأقصى') }}</label>
<input type="number" min="0" dir="ltr"
x-model.number="conditions.max_age"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
@break
......@@ -170,13 +170,13 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأدنى (أشهر)') }}</label>
<input type="number" min="0" dir="ltr"
x-model.number="conditions.min_months"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأقصى (أشهر)') }}</label>
<input type="number" min="0" dir="ltr"
x-model.number="conditions.max_months"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
@break
......@@ -187,13 +187,13 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأدنى لحجم الأسرة') }}</label>
<input type="number" min="1" dir="ltr"
x-model.number="conditions.min_family_size"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأقصى لحجم الأسرة') }}</label>
<input type="number" min="1" dir="ltr"
x-model.number="conditions.max_family_size"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
@break
......@@ -247,13 +247,13 @@ class="w-4 h-4 border-gray-300 text-blue-600 focus:ring-blue-500">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('التسجيل قبل تاريخ') }}</label>
<input type="date" dir="ltr"
x-model="conditions.before_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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('خلال أول (أيام)') }}</label>
<input type="number" min="1" dir="ltr"
x-model.number="conditions.within_days"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
@break
......@@ -273,13 +273,13 @@ class="w-full max-w-xs px-4 py-2 border border-gray-300 rounded-lg focus:ring-2
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('من تاريخ') }}</label>
<input type="date" dir="ltr"
x-model="conditions.season_start"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('إلى تاريخ') }}</label>
<input type="date" dir="ltr"
x-model="conditions.season_end"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
@break
......@@ -304,13 +304,13 @@ class="w-3 h-3 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('من الساعة') }}</label>
<input type="time" dir="ltr"
x-model="conditions.start_time"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('إلى الساعة') }}</label>
<input type="time" dir="ltr"
x-model="conditions.end_time"
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 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
</div>
</div>
</div>
......@@ -355,18 +355,18 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endif
{{-- Submit --}}
<div class="mt-6 flex items-center gap-3">
<div class="mt-6 flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('pricing.rules') }}" 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 font-medium text-sm">
{{ __('إلغاء') }}
</a>
<button type="submit"
wire:loading.attr="disabled"
wire:target="save"
class="inline-flex items-center gap-2 px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 font-medium text-sm 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 font-medium text-sm disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ $editing ? __('تحديث') : __('حفظ') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('pricing.rules') }}" wire:navigate
class="px-6 py-2 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50 font-medium text-sm">
{{ __('إلغاء') }}
</a>
</div>
</form>
</div>
......
resources/views/livewire/pricing/pricing-rule-list.blade.php
View file @ 944501f1
<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">
......
resources/views/livewire/pricing/promotion-form.blade.php
View file @ 944501f1
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">
{{ $editing ? __('تعديل العرض') : __('إضافة عرض / كوبون') }}
</h1>
<a href="{{ route('pricing.promotions') }}" wire:navigate
......@@ -14,7 +14,7 @@ class="text-gray-600 hover:text-gray-800 text-sm">{{ __('رجوع للقائمة
</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">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
{{-- Name Arabic --}}
......
resources/views/livewire/pricing/promotion-list.blade.php
View file @ 944501f1
<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.promotions.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">
......
resources/views/livewire/profile/notification-preferences.blade.php
View file @ 944501f1
<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('profile') }}" wire:navigate class="text-sm text-blue-600 hover:text-blue-800">{{ __('العودة للملف الشخصي') }}</a>
</div>
......@@ -9,7 +9,8 @@
@endif
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="p-4 bg-gray-50 border-b">
{{-- Desktop grid header --}}
<div class="hidden md:block p-4 bg-gray-50 border-b">
<div class="grid grid-cols-4 gap-4 text-sm font-medium text-gray-600">
<div class="col-span-1">{{ __('نوع الإشعار') }}</div>
<div class="text-center">{{ __('بريد') }}</div>
......@@ -18,7 +19,8 @@
</div>
</div>
<div class="divide-y">
{{-- Desktop grid rows --}}
<div class="hidden md:block divide-y">
@foreach($eventTypes as $type => $label)
<div class="grid grid-cols-4 gap-4 p-4 items-center hover:bg-gray-50">
<div class="col-span-1 text-sm text-gray-800">{{ $label }}</div>
......@@ -38,10 +40,36 @@ class="w-4 h-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500" disabl
@endforeach
</div>
{{-- Mobile card layout --}}
<div class="md:hidden divide-y">
@foreach($eventTypes as $type => $label)
<div class="p-4 space-y-3">
<div class="text-sm font-medium text-gray-800">{{ $label }}</div>
<div class="flex items-center gap-5">
<label class="flex items-center gap-1.5 text-xs text-gray-600">
<input type="checkbox" wire:model="preferences.{{ $type }}.email"
class="w-4 h-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500">
{{ __('بريد') }}
</label>
<label class="flex items-center gap-1.5 text-xs text-gray-600">
<input type="checkbox" wire:model="preferences.{{ $type }}.sms"
class="w-4 h-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500">
{{ __('SMS') }}
</label>
<label class="flex items-center gap-1.5 text-xs text-gray-600">
<input type="checkbox" wire:model="preferences.{{ $type }}.in_app"
class="w-4 h-4 text-blue-600 rounded border-gray-300 focus:ring-blue-500" disabled>
{{ __('داخلي') }}
</label>
</div>
</div>
@endforeach
</div>
<div class="p-4 bg-gray-50 border-t">
<p class="text-xs text-gray-500 mb-3">{{ __('الإشعارات الداخلية لا يمكن تعطيلها') }}</p>
<button wire:click="save" wire:loading.attr="disabled"
class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 text-sm font-medium">
class="px-6 py-2.5 w-full sm:w-auto 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>
......
resources/views/livewire/profile/user-profile.blade.php
View file @ 944501f1
<div>
<h1 class="text-2xl font-bold text-gray-800 mb-6">{{ __('الملف الشخصي') }}</h1>
<div class="max-w-3xl">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800 mb-4 sm:mb-6">{{ __('الملف الشخصي') }}</h1>
{{-- Profile Info --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('المعلومات الشخصية') }}</h2>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<h2 class="text-base sm:text-lg font-semibold text-gray-800 mb-3 sm:mb-4">{{ __('المعلومات الشخصية') }}</h2>
@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
<form wire:submit="updateProfile" class="space-y-4">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالعربية') }}</label>
<input type="text" 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">
<input type="text" wire:model="name_ar" 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('name_ar') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الاسم بالإنجليزية') }}</label>
<input type="text" wire:model="name" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<input type="text" wire:model="name" 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">
</div>
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('البريد الإلكتروني') }}</label>
<input type="email" wire:model="email" 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">
<input type="email" wire:model="email" dir="ltr" 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') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
</div>
<button type="submit" wire:loading.attr="disabled" wire:target="updateProfile"
class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 text-sm font-medium">
class="w-full sm:w-auto px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:opacity-50 text-sm font-medium">
<span wire:loading.remove wire:target="updateProfile">{{ __('حفظ التغييرات') }}</span>
<span wire:loading wire:target="updateProfile">{{ __('جارٍ الحفظ...') }}</span>
</button>
......@@ -36,8 +36,8 @@ class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 disabled:op
</div>
{{-- Change Password --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4">{{ __('تغيير كلمة المرور') }}</h2>
<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-800 mb-3 sm:mb-4">{{ __('تغيير كلمة المرور') }}</h2>
@if(session('password_success'))
<div class="mb-4 p-3 bg-green-50 border border-green-200 rounded-lg text-green-700 text-sm">{{ session('password_success') }}</div>
......
resources/views/livewire/programs/program-form.blade.php
View file @ 944501f1
<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('programs.list') }}" wire:navigate
class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للقائمة') }}</a>
</div>
......@@ -13,22 +13,22 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
<form wire:submit="save" class="space-y-6">
{{-- Basic Info --}}
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم البرنامج بالعربية') }} <span class="text-red-500">*</span></label>
<input type="text" 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">
<input type="text" wire:model="name_ar" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('اسم البرنامج بالإنجليزية') }} <span class="text-red-500">*</span></label>
<input type="text" 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">
<input type="text" wire:model="name" dir="ltr" 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') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('النشاط') }} <span class="text-red-500">*</span></label>
<select wire:model="activity_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">
<select wire:model="activity_id" 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">
<option value="">{{ __('اختر النشاط') }}</option>
@foreach($activities as $activity)
<option value="{{ $activity->id }}">{{ $activity->name_ar }}</option>
......@@ -38,7 +38,7 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الفرع') }}</label>
<select 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">
<select wire:model="branch_id" 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">
<option value="">{{ __('كل الفروع') }}</option>
@foreach($branches as $branch)
<option value="{{ $branch->id }}">{{ $branch->name_ar }}</option>
......@@ -46,20 +46,20 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</select>
@error('branch_id') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الوصف بالعربية') }}</label>
<textarea wire:model="description_ar" 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"></textarea>
<textarea wire:model="description_ar" rows="3" 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"></textarea>
</div>
</div>
</div>
{{-- Configuration --}}
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مستوى المهارة') }}</label>
<select wire:model="skill_level" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model="skill_level" 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">
<option value="all">{{ __('الكل') }}</option>
<option value="beginner">{{ __('مبتدئ') }}</option>
<option value="intermediate">{{ __('متوسط') }}</option>
......@@ -69,7 +69,7 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الجنس') }}</label>
<select wire:model="gender" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model="gender" 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">
<option value="all">{{ __('الكل') }}</option>
<option value="male">{{ __('ذكور') }}</option>
<option value="female">{{ __('إناث') }}</option>
......@@ -77,7 +77,7 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('سياسة التجديد') }}</label>
<select wire:model="renewal_policy" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model="renewal_policy" 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">
<option value="manual_renew">{{ __('تجديد يدوي') }}</option>
<option value="auto_renew">{{ __('تجديد تلقائي') }}</option>
<option value="one_time">{{ __('مرة واحدة') }}</option>
......@@ -85,48 +85,48 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('العمر الأدنى') }}</label>
<input type="number" wire:model="age_min" min="1" max="99" 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">
<input type="number" wire:model="age_min" min="1" max="99" dir="ltr" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('العمر الأقصى') }}</label>
<input type="number" wire:model="age_max" min="1" max="99" 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">
<input type="number" wire:model="age_max" min="1" max="99" dir="ltr" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('حصص/أسبوع') }} <span class="text-red-500">*</span></label>
<input type="number" wire:model="sessions_per_week" min="1" max="7" 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">
<input type="number" wire:model="sessions_per_week" min="1" max="7" dir="ltr" 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('sessions_per_week') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مدة الحصة (دقيقة)') }} <span class="text-red-500">*</span></label>
<input type="number" wire:model="session_duration_minutes" min="15" max="240" 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">
<input type="number" wire:model="session_duration_minutes" min="15" max="240" dir="ltr" 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('session_duration_minutes') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('إجمالي الحصص') }}</label>
<input type="number" wire:model="total_sessions" 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">
<input type="number" wire:model="total_sessions" min="1" dir="ltr" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('مدة البرنامج (أسابيع)') }}</label>
<input type="number" wire:model="program_duration_weeks" 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">
<input type="number" wire:model="program_duration_weeks" min="1" dir="ltr" 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">
</div>
</div>
</div>
{{-- Capacity --}}
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأدنى') }} <span class="text-red-500">*</span></label>
<input type="number" wire:model="min_participants" 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">
<input type="number" wire:model="min_participants" min="1" dir="ltr" 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('min_participants') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('الحد الأقصى') }} <span class="text-red-500">*</span></label>
<input type="number" wire:model="max_participants" 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">
<input type="number" wire:model="max_participants" min="1" dir="ltr" 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('max_participants') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
</div>
<div class="flex items-end">
<div class="min-h-[44px] flex items-center">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="allow_waitlist" class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ __('تفعيل قائمة الانتظار') }}</span>
......@@ -134,9 +134,9 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('نسبة الحضور المطلوبة %') }}</label>
<input type="number" wire:model="attendance_requirement_percent" min="0" max="100" 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">
<input type="number" wire:model="attendance_requirement_percent" min="0" max="100" dir="ltr" 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">
</div>
<div class="flex items-end">
<div class="min-h-[44px] flex items-center">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="assessment_required" class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ __('يتطلب تقييم') }}</span>
......@@ -146,28 +146,28 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
{{-- Dates --}}
<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-2 sm:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ بداية البرنامج') }}</label>
<input type="date" wire:model="program_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">
<input type="date" wire:model="program_start_date" dir="ltr" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('تاريخ نهاية البرنامج') }}</label>
<input type="date" wire:model="program_end_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">
<input type="date" wire:model="program_end_date" dir="ltr" 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">
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('آخر موعد للتسجيل') }}</label>
<input type="date" wire:model="registration_deadline" 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">
<input type="date" wire:model="registration_deadline" dir="ltr" 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">
</div>
<div class="flex items-end">
<div class="min-h-[44px] flex items-center">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="registration_open" class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ __('التسجيل مفتوح') }}</span>
</label>
</div>
<div class="flex items-end">
<div class="min-h-[44px] flex items-center">
<label class="flex items-center gap-2 cursor-pointer">
<input type="checkbox" wire:model="featured" class="w-4 h-4 text-blue-600 border-gray-300 rounded focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ __('برنامج مميز') }}</span>
......@@ -177,14 +177,14 @@ class="text-sm text-gray-600 hover:text-gray-800">{{ __('← العودة للق
</div>
{{-- Pricing --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-800 mb-4 border-b border-gray-100 pb-2">{{ __('الأسعار') }}</h2>
<div class="grid grid-cols-1 sm: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-800 mb-4 border-b border-gray-100 pb-2">{{ __('الأسعار') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('سعر العضو (ج.م)') }}</label>
<input type="number" wire:model="member_price" dir="ltr" step="0.01" min="0"
placeholder="0.00"
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('member_price') 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('member_price') border-red-500 @enderror">
@error('member_price') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
<p class="text-xs text-gray-500 mt-1">{{ __('السعر لأعضاء النادي') }}</p>
</div>
......@@ -192,7 +192,7 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('سعر غير العضو (ج.م)') }}</label>
<input type="number" wire:model="non_member_price" dir="ltr" step="0.01" min="0"
placeholder="0.00"
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('non_member_price') 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('non_member_price') border-red-500 @enderror">
@error('non_member_price') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
<p class="text-xs text-gray-500 mt-1">{{ __('السعر لغير الأعضاء') }}</p>
</div>
......@@ -200,16 +200,16 @@ 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 gap-3">
<div class="flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end gap-3">
<a href="{{ route('programs.list') }}" wire:navigate
class="text-center px-4 sm:px-6 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 font-medium text-sm">
{{ __('إلغاء') }}
</a>
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 font-medium text-sm 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 font-medium text-sm disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ $editing ? __('تحديث البرنامج') : __('إنشاء البرنامج') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
<a href="{{ route('programs.list') }}" wire:navigate
class="px-6 py-2.5 bg-gray-100 text-gray-700 rounded-lg hover:bg-gray-200 font-medium text-sm">
{{ __('إلغاء') }}
</a>
</div>
</form>
</div>
resources/views/livewire/programs/program-list.blade.php
View file @ 944501f1
<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>
@permission('programs.create')
<a href="{{ route('programs.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>
{{ __('إضافة برنامج') }}
<span class="hidden sm:inline">{{ __('إضافة برنامج') }}</span>
</a>
@endpermission
</div>
{{-- Flash Messages --}}
@if(session('success'))
<div class="mb-4 p-4 bg-green-50 border border-green-200 text-green-700 rounded-lg text-sm">
<div class="mb-4 p-3 sm:p-4 bg-green-50 border border-green-200 text-green-700 rounded-lg text-sm">
{{ session('success') }}
</div>
@endif
@if(session('error'))
<div class="mb-4 p-4 bg-red-50 border border-red-200 text-red-700 rounded-lg text-sm">
<div class="mb-4 p-3 sm:p-4 bg-red-50 border border-red-200 text-red-700 rounded-lg text-sm">
{{ session('error') }}
</div>
@endif
<!-- Filters -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-4">
<div class="flex flex-col sm:flex-row gap-4">
<div class="flex-1">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-3 gap-3">
<div class="col-span-2 md:col-span-1">
<input type="text" wire:model.live.debounce.300ms="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-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<select wire:model.live="activityFilter" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="activityFilter" class="px-3 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($activities as $activity)
<option value="{{ $activity->id }}">{{ $activity->name_ar }}</option>
@endforeach
</select>
<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">
<select wire:model.live="status" class="px-3 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 $key => $label)
<option value="{{ $key }}">{{ $label }}</option>
......@@ -45,8 +45,8 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
</div>
<!-- Table -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<!-- 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">
......@@ -145,4 +145,73 @@ class="text-red-600 hover:text-red-800 text-sm font-medium">
</div>
@endif
</div>
<!-- Mobile Cards -->
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($programs as $program)
@php
$statusValue = $program->status->value ?? $program->status;
$statusColors = [
'draft' => 'bg-gray-100 text-gray-700',
'active' => 'bg-green-100 text-green-700',
'full' => 'bg-yellow-100 text-yellow-700',
'closed' => 'bg-red-100 text-red-700',
'archived' => 'bg-purple-100 text-purple-700',
];
@endphp
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-start justify-between gap-3 mb-3">
<div class="min-w-0 flex-1">
<p class="font-medium text-gray-800 truncate">{{ $program->name_ar }}</p>
@if($program->name)
<p class="text-xs text-gray-400 truncate" dir="ltr">{{ $program->name }}</p>
@endif
</div>
<span class="inline-flex px-2.5 py-0.5 rounded-full text-xs font-medium shrink-0 {{ $statusColors[$statusValue] ?? 'bg-gray-100 text-gray-700' }}">
{{ $statusOptions[$statusValue] ?? $statusValue }}
</span>
</div>
<div class="flex items-center gap-4 text-sm text-gray-600 mb-3">
<span>{{ $program->activity?->name_ar ?? '-' }}</span>
<span class="text-gray-300">|</span>
<span class="inline-flex items-center gap-1">
<span class="inline-flex items-center justify-center w-5 h-5 rounded-full bg-blue-50 text-blue-700 text-xs font-semibold">{{ $program->groups_count }}</span>
{{ __('مجموعات') }}
</span>
</div>
<div class="flex items-center justify-end gap-4 border-t border-gray-100 pt-3">
@permission('programs.update')
<a href="{{ route('programs.edit', $program) }}" wire:navigate
class="inline-flex items-center gap-1 py-2 text-blue-600 hover:text-blue-800 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 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
{{ __('تعديل') }}
</a>
@endpermission
@permission('programs.delete')
<button wire:click="delete('{{ $program->uuid }}')"
wire:confirm="{{ __('هل أنت متأكد من حذف هذا البرنامج؟') }}"
wire:loading.attr="disabled"
class="inline-flex items-center gap-1 py-2 text-red-600 hover:text-red-800 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="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
{{ __('حذف') }}
</button>
@endpermission
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 px-4 py-12 text-center">
<svg class="w-12 h-12 mx-auto mb-3 text-gray-300" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 11H5m14 0a2 2 0 012 2v6a2 2 0 01-2 2H5a2 2 0 01-2-2v-6a2 2 0 012-2m14 0V9a2 2 0 00-2-2M5 11V9a2 2 0 012-2m0 0V5a2 2 0 012-2h6a2 2 0 012 2v2M7 7h10"/></svg>
<p class="text-lg font-medium text-gray-500">{{ __('لا توجد برامج تدريبية') }}</p>
<p class="text-sm text-gray-400 mt-1">{{ __('ابدأ بإضافة برنامج جديد') }}</p>
</div>
@endforelse
@if($programs->hasPages())
<div class="mt-4">
{{ $programs->links() }}
</div>
@endif
</div>
</div>
resources/views/livewire/receptionist/collect-payment-wizard.blade.php
View file @ 944501f1
......@@ -2,7 +2,7 @@
{{-- Header --}}
<div class="flex items-center justify-between 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>
<a href="{{ route('receptionist.dashboard') }}" wire:navigate
......@@ -67,7 +67,7 @@ class="flex items-center gap-2 {{ $num < $currentStep ? 'cursor-pointer' : 'curs
@endif
{{-- Step Content --}}
<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">
{{-- Step 1: Search Participant --}}
@if($currentStep === 1)
<div>
......
resources/views/livewire/receptionist/dashboard.blade.php
View file @ 944501f1
<div>
{{-- Header --}}
<div class="flex items-center justify-between mb-8">
<div class="flex items-center justify-between mb-4 sm:mb-8">
<div>
<h1 class="text-2xl font-bold text-gray-800">{{ __('مكتب الاستقبال') }}</h1>
<p class="text-sm text-gray-500 mt-1">{{ __('اليوم') }}: {{ now()->translatedFormat('l j F Y') }}</p>
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('مكتب الاستقبال') }}</h1>
<p class="text-xs sm:text-sm text-gray-500 mt-1">{{ __('اليوم') }}: {{ now()->translatedFormat('l j F Y') }}</p>
</div>
</div>
{{-- Flash Messages --}}
@if(session('success'))
<div class="mb-6 p-4 bg-green-50 border border-green-200 rounded-xl text-green-700 text-sm">
<div class="mb-4 sm:mb-6 p-3 sm:p-4 bg-green-50 border border-green-200 rounded-xl text-green-700 text-sm">
{{ session('success') }}
</div>
@endif
{{-- Today's Stats --}}
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mb-8">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
<div class="flex items-center gap-3">
<div class="w-12 h-12 rounded-xl bg-blue-100 flex items-center justify-center">
<svg class="w-6 h-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
{{-- Today's Stats — 2x2 on mobile --}}
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 mb-6 sm:mb-8">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="w-10 h-10 sm:w-12 sm:h-12 rounded-xl bg-blue-100 flex items-center justify-center shrink-0">
<svg class="w-5 h-5 sm:w-6 sm: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="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
</svg>
</div>
<div>
<p class="text-xs text-gray-500">{{ __('تسجيلات اليوم') }}</p>
<p class="text-xl font-bold text-gray-800" dir="ltr">{{ $stats['registrations_today'] }}</p>
<div class="min-w-0">
<p class="text-xs text-gray-500 truncate">{{ __('تسجيلات اليوم') }}</p>
<p class="text-lg sm:text-xl font-bold text-gray-800" dir="ltr">{{ $stats['registrations_today'] }}</p>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
<div class="flex items-center gap-3">
<div class="w-12 h-12 rounded-xl bg-green-100 flex items-center justify-center">
<svg class="w-6 h-6 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="w-10 h-10 sm:w-12 sm:h-12 rounded-xl bg-green-100 flex items-center justify-center shrink-0">
<svg class="w-5 h-5 sm:w-6 sm: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 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<div>
<p class="text-xs text-gray-500">{{ __('مدفوعات اليوم') }}</p>
<p class="text-xl font-bold text-gray-800" dir="ltr">{{ number_format($stats['payments_today'] / 100, 2) }} {{ __('ج.م') }}</p>
<div class="min-w-0">
<p class="text-xs text-gray-500 truncate">{{ __('مدفوعات اليوم') }}</p>
<p class="text-lg sm:text-xl font-bold text-gray-800" dir="ltr">{{ number_format($stats['payments_today'] / 100, 2) }}</p>
<p class="text-xs text-gray-400" dir="ltr">{{ $stats['payments_count'] }} {{ __('عملية') }}</p>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
<div class="flex items-center gap-3">
<div class="w-12 h-12 rounded-xl bg-amber-100 flex items-center justify-center">
<svg class="w-6 h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="w-10 h-10 sm:w-12 sm:h-12 rounded-xl bg-amber-100 flex items-center justify-center shrink-0">
<svg class="w-5 h-5 sm:w-6 sm:h-6 text-amber-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<div>
<p class="text-xs text-gray-500">{{ __('حصص اليوم') }}</p>
<p class="text-xl font-bold text-gray-800" dir="ltr">{{ $stats['sessions_in_progress'] }} / {{ $stats['sessions_today'] }}</p>
<p class="text-xs text-gray-400">{{ __('جارية / إجمالي') }}</p>
<div class="min-w-0">
<p class="text-xs text-gray-500 truncate">{{ __('حصص اليوم') }}</p>
<p class="text-lg sm:text-xl font-bold text-gray-800" dir="ltr">{{ $stats['sessions_in_progress'] }} / {{ $stats['sessions_today'] }}</p>
<p class="text-xs text-gray-400 hidden sm:block">{{ __('جارية / إجمالي') }}</p>
</div>
</div>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
<div class="flex items-center gap-3">
<div class="w-12 h-12 rounded-xl bg-purple-100 flex items-center justify-center">
<svg class="w-6 h-6 text-purple-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-5">
<div class="flex items-center gap-2 sm:gap-3">
<div class="w-10 h-10 sm:w-12 sm:h-12 rounded-xl bg-purple-100 flex items-center justify-center shrink-0">
<svg class="w-5 h-5 sm:w-6 sm: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 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<div>
<p class="text-xs text-gray-500">{{ __('الحضور') }}</p>
<p class="text-xl font-bold text-gray-800" dir="ltr">{{ $stats['checked_in'] }}</p>
<p class="text-xs text-gray-400">{{ __('حاضر') }} / {{ $stats['expected_today'] }} {{ __('متوقع') }}</p>
<div class="min-w-0">
<p class="text-xs text-gray-500 truncate">{{ __('الحضور') }}</p>
<p class="text-lg sm:text-xl font-bold text-gray-800" dir="ltr">{{ $stats['checked_in'] }}</p>
<p class="text-xs text-gray-400" dir="ltr">/ {{ $stats['expected_today'] }} {{ __('متوقع') }}</p>
</div>
</div>
</div>
</div>
{{-- Quick Actions --}}
<h2 class="text-lg font-semibold text-gray-700 mb-4">{{ __('إجراءات سريعة') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-5">
{{-- Quick Actions — 2-col grid on mobile for large touch targets --}}
<h2 class="text-base sm:text-lg font-semibold text-gray-700 mb-3 sm:mb-4">{{ __('إجراءات سريعة') }}</h2>
<div class="grid grid-cols-2 lg:grid-cols-3 gap-3 sm:gap-5">
{{-- New Registration --}}
@can('participants.create')
<a href="{{ route('receptionist.new-registration') }}" wire:navigate
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shadow-md hover:border-blue-300 transition-all min-h-16">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-xl bg-blue-600 flex items-center justify-center group-hover:scale-110 transition-transform">
<svg class="w-7 h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 hover:shadow-md hover:border-blue-300 transition-all active:scale-[0.97]">
<div class="flex flex-col sm:flex-row items-center sm:items-center gap-3 sm:gap-4 text-center sm:text-start">
<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-xl bg-blue-600 flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
<svg class="w-6 h-6 sm:w-7 sm:h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 9v3m0 0v3m0-3h3m-3 0h-3m-2-5a4 4 0 11-8 0 4 4 0 018 0zM3 20a6 6 0 0112 0v1H3v-1z"/>
</svg>
</div>
<div>
<h3 class="font-bold text-gray-800 text-lg">{{ __('تسجيل جديد') }}</h3>
<p class="text-sm text-gray-500">{{ __('تسجيل مشترك جديد + ولي أمر + برنامج') }}</p>
<div class="min-w-0">
<h3 class="font-bold text-gray-800 text-sm sm:text-lg">{{ __('تسجيل جديد') }}</h3>
<p class="text-xs sm:text-sm text-gray-500 hidden sm:block">{{ __('تسجيل مشترك جديد + ولي أمر + برنامج') }}</p>
</div>
</div>
</a>
......@@ -100,16 +100,16 @@ class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shad
{{-- Enroll Existing --}}
@can('enrollments.create')
<a href="{{ route('receptionist.enroll-existing') }}" wire:navigate
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shadow-md hover:border-emerald-300 transition-all min-h-16">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-xl bg-emerald-600 flex items-center justify-center group-hover:scale-110 transition-transform">
<svg class="w-7 h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 hover:shadow-md hover:border-emerald-300 transition-all active:scale-[0.97]">
<div class="flex flex-col sm:flex-row items-center sm:items-center gap-3 sm:gap-4 text-center sm:text-start">
<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-xl bg-emerald-600 flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
<svg class="w-6 h-6 sm:w-7 sm:h-7 text-white" 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>
</div>
<div>
<h3 class="font-bold text-gray-800 text-lg">{{ __('تسجيل في برنامج') }}</h3>
<p class="text-sm text-gray-500">{{ __('تسجيل مشترك حالي في برنامج جديد') }}</p>
<div class="min-w-0">
<h3 class="font-bold text-gray-800 text-sm sm:text-lg">{{ __('تسجيل في برنامج') }}</h3>
<p class="text-xs sm:text-sm text-gray-500 hidden sm:block">{{ __('تسجيل مشترك حالي في برنامج جديد') }}</p>
</div>
</div>
</a>
......@@ -118,16 +118,16 @@ class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shad
{{-- Collect Payment --}}
@can('invoices.create')
<a href="{{ route('receptionist.collect-payment') }}" wire:navigate
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shadow-md hover:border-amber-300 transition-all min-h-16">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-xl bg-amber-600 flex items-center justify-center group-hover:scale-110 transition-transform">
<svg class="w-7 h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 hover:shadow-md hover:border-amber-300 transition-all active:scale-[0.97]">
<div class="flex flex-col sm:flex-row items-center sm:items-center gap-3 sm:gap-4 text-center sm:text-start">
<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-xl bg-amber-600 flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
<svg class="w-6 h-6 sm:w-7 sm:h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" 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>
</div>
<div>
<h3 class="font-bold text-gray-800 text-lg">{{ __('تحصيل مدفوعات') }}</h3>
<p class="text-sm text-gray-500">{{ __('تحصيل مدفوعات من فواتير مستحقة') }}</p>
<div class="min-w-0">
<h3 class="font-bold text-gray-800 text-sm sm:text-lg">{{ __('تحصيل مدفوعات') }}</h3>
<p class="text-xs sm:text-sm text-gray-500 hidden sm:block">{{ __('تحصيل مدفوعات من فواتير مستحقة') }}</p>
</div>
</div>
</a>
......@@ -136,16 +136,16 @@ class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shad
{{-- Product Sale (POS) --}}
@can('pos.sell')
<a href="{{ route('pos.terminal') }}" wire:navigate
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shadow-md hover:border-rose-300 transition-all min-h-16">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-xl bg-rose-600 flex items-center justify-center group-hover:scale-110 transition-transform">
<svg class="w-7 h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 hover:shadow-md hover:border-rose-300 transition-all active:scale-[0.97]">
<div class="flex flex-col sm:flex-row items-center sm:items-center gap-3 sm:gap-4 text-center sm:text-start">
<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-xl bg-rose-600 flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
<svg class="w-6 h-6 sm:w-7 sm:h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 3h2l.4 2M7 13h10l4-8H5.4M7 13L5.4 5M7 13l-2.293 2.293c-.63.63-.184 1.707.707 1.707H17m0 0a2 2 0 100 4 2 2 0 000-4zm-8 2a2 2 0 100 4 2 2 0 000-4z"/>
</svg>
</div>
<div>
<h3 class="font-bold text-gray-800 text-lg">{{ __('بيع منتج') }}</h3>
<p class="text-sm text-gray-500">{{ __('نقطة البيع — بيع سريع') }}</p>
<div class="min-w-0">
<h3 class="font-bold text-gray-800 text-sm sm:text-lg">{{ __('بيع منتج') }}</h3>
<p class="text-xs sm:text-sm text-gray-500 hidden sm:block">{{ __('نقطة البيع — بيع سريع') }}</p>
</div>
</div>
</a>
......@@ -154,16 +154,16 @@ class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shad
{{-- Check-in --}}
@can('attendance.mark')
<a href="{{ route('attendance.list') }}" wire:navigate
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-6 hover:shadow-md hover:border-purple-300 transition-all min-h-16">
<div class="flex items-center gap-4">
<div class="w-14 h-14 rounded-xl bg-purple-600 flex items-center justify-center group-hover:scale-110 transition-transform">
<svg class="w-7 h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
class="group bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 hover:shadow-md hover:border-purple-300 transition-all active:scale-[0.97]">
<div class="flex flex-col sm:flex-row items-center sm:items-center gap-3 sm:gap-4 text-center sm:text-start">
<div class="w-12 h-12 sm:w-14 sm:h-14 rounded-xl bg-purple-600 flex items-center justify-center group-hover:scale-110 transition-transform shrink-0">
<svg class="w-6 h-6 sm:w-7 sm:h-7 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"/>
</svg>
</div>
<div>
<h3 class="font-bold text-gray-800 text-lg">{{ __('تسجيل حضور') }}</h3>
<p class="text-sm text-gray-500">{{ __('بحث عن مشترك وتسجيل حضوره') }}</p>
<div class="min-w-0">
<h3 class="font-bold text-gray-800 text-sm sm:text-lg">{{ __('تسجيل حضور') }}</h3>
<p class="text-xs sm:text-sm text-gray-500 hidden sm:block">{{ __('بحث عن مشترك وتسجيل حضوره') }}</p>
</div>
</div>
</a>
......
resources/views/livewire/receptionist/enroll-existing-wizard.blade.php
View file @ 944501f1
......@@ -2,7 +2,7 @@
{{-- Header --}}
<div class="flex items-center justify-between 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>
<a href="{{ route('receptionist.dashboard') }}" wire:navigate
......@@ -66,7 +66,7 @@ class="flex items-center gap-2 {{ $num < $currentStep ? 'cursor-pointer' : 'curs
@endif
{{-- Step Content --}}
<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">
{{-- Step 1: Search Participant --}}
@if($currentStep === 1)
<div>
......
resources/views/livewire/receptionist/new-registration-wizard.blade.php
View file @ 944501f1
......@@ -11,7 +11,7 @@
{{-- Header --}}
<div class="flex items-center justify-between mb-6 print:hidden">
<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>
<a href="{{ route('receptionist.dashboard') }}" wire:navigate
......@@ -106,7 +106,7 @@ class="flex items-center gap-2 {{ $num < $currentStep ? 'cursor-pointer' : 'curs
@endif
{{-- Step Content --}}
<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">
{{-- Step 1: Guardian Info --}}
@if($currentStep === 1)
<div>
......
resources/views/livewire/reports/attendance-report.blade.php
View file @ 944501f1
<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('reports.view') }}" wire:navigate class="text-sm text-blue-600 hover:text-blue-800">{{ __('العودة للتقارير') }}</a>
</div>
<!-- Filters -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-6">
<div class="flex flex-wrap items-end gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-3 sm:gap-4">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('البرنامج') }}</label>
<select wire:model.live="programFilter" class="rounded-lg border-gray-300 text-sm min-w-[180px]">
<select wire:model.live="programFilter" class="w-full rounded-lg border-gray-300 text-sm">
<option value="">{{ __('كل البرامج') }}</option>
@foreach($programs as $program)
<option value="{{ $program->id }}">{{ $program->name_ar }}</option>
......@@ -18,7 +18,7 @@
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('المجموعة') }}</label>
<select wire:model.live="groupFilter" class="rounded-lg border-gray-300 text-sm min-w-[180px]">
<select wire:model.live="groupFilter" class="w-full rounded-lg border-gray-300 text-sm">
<option value="">{{ __('كل المجموعات') }}</option>
@foreach($groups as $group)
<option value="{{ $group->id }}">{{ $group->name_ar }}</option>
......@@ -27,18 +27,19 @@
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('من') }}</label>
<input type="date" wire:model.live="dateFrom" dir="ltr" class="rounded-lg border-gray-300 text-sm">
<input type="date" wire:model.live="dateFrom" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm">
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('إلى') }}</label>
<input type="date" wire:model.live="dateTo" dir="ltr" class="rounded-lg border-gray-300 text-sm">
<input type="date" wire:model.live="dateTo" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm">
</div>
<div>
<div class="col-span-2 md:col-span-1">
<label class="block text-sm text-gray-600 mb-1 invisible">{{ __('تصدير') }}</label>
<button
wire:click="export"
wire:loading.attr="disabled"
wire:target="export"
class="inline-flex items-center gap-2 px-4 py-2 bg-green-600 text-white text-sm font-medium rounded-lg hover:bg-green-700 transition disabled:opacity-50"
class="w-full sm:w-auto inline-flex items-center justify-center gap-2 px-4 py-2.5 bg-green-600 text-white text-sm font-medium rounded-lg hover:bg-green-700 transition disabled:opacity-50"
>
<span wire:loading.remove wire:target="export">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
......@@ -53,22 +54,22 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-green-600 text-white text-sm
</div>
<!-- Summary Cards -->
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('نسبة الحضور الإجمالية') }}</p>
<p class="text-2xl font-bold mt-1 {{ $summary->overall_rate >= 85 ? 'text-green-600' : ($summary->overall_rate >= 75 ? 'text-amber-600' : 'text-red-600') }}">
<p class="text-xl sm:text-2xl font-bold mt-1 {{ $summary->overall_rate >= 85 ? 'text-green-600' : ($summary->overall_rate >= 75 ? 'text-amber-600' : 'text-red-600') }}">
{{ $summary->overall_rate }}%
</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('إجمالي الحصص') }}</p>
<p class="text-2xl font-bold text-blue-600 mt-1">{{ $summary->total_sessions }}</p>
<p class="text-xl sm:text-2xl font-bold text-blue-600 mt-1">{{ $summary->total_sessions }}</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('متوسط الحاضرين لكل حصة') }}</p>
<p class="text-2xl font-bold text-indigo-600 mt-1">{{ $summary->avg_present_per_session }}</p>
<p class="text-xl sm:text-2xl font-bold text-indigo-600 mt-1">{{ $summary->avg_present_per_session }}</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<div class="flex justify-between items-start">
<div>
<p class="text-sm text-gray-500">{{ __('أفضل يوم') }}</p>
......@@ -95,7 +96,7 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-green-600 text-white text-sm
<!-- Participant Attendance Table -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden" wire:loading.class="opacity-50 pointer-events-none">
@if($participantStats->isNotEmpty())
<div class="overflow-x-auto">
<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>
......@@ -186,6 +187,47 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-green-600 text-white text-sm
</tbody>
</table>
</div>
{{-- Mobile Cards --}}
<div class="md:hidden divide-y divide-gray-100">
@foreach($participantStats as $stat)
<div class="p-4">
<div class="flex items-center justify-between mb-2">
<div>
<div class="font-medium text-sm text-gray-800">{{ $stat->name }}</div>
@if($stat->participant_number)
<div class="text-xs text-gray-400" dir="ltr">#{{ $stat->participant_number }}</div>
@endif
</div>
@php
$rateColor = $stat->rate >= 85 ? 'text-green-600' : ($stat->rate >= 75 ? 'text-amber-600' : 'text-red-600');
$rateBg = $stat->rate >= 85 ? 'bg-green-50' : ($stat->rate >= 75 ? 'bg-amber-50' : 'bg-red-50');
@endphp
<span class="inline-flex items-center px-2 py-1 rounded-lg text-sm font-bold {{ $rateColor }} {{ $rateBg }}">
{{ $stat->rate }}%
</span>
</div>
<div class="grid grid-cols-4 gap-2 text-center text-xs">
<div>
<span class="inline-flex items-center justify-center min-w-[24px] px-1.5 py-0.5 rounded-full font-medium bg-green-100 text-green-700">{{ $stat->present_count }}</span>
<p class="mt-1 text-gray-400">{{ __('حاضر') }}</p>
</div>
<div>
<span class="inline-flex items-center justify-center min-w-[24px] px-1.5 py-0.5 rounded-full font-medium bg-amber-100 text-amber-700">{{ $stat->late_count }}</span>
<p class="mt-1 text-gray-400">{{ __('متأخر') }}</p>
</div>
<div>
<span class="inline-flex items-center justify-center min-w-[24px] px-1.5 py-0.5 rounded-full font-medium bg-red-100 text-red-700">{{ $stat->absent_count }}</span>
<p class="mt-1 text-gray-400">{{ __('غائب') }}</p>
</div>
<div>
<span class="inline-flex items-center justify-center min-w-[24px] px-1.5 py-0.5 rounded-full font-medium bg-blue-100 text-blue-700">{{ $stat->excused_count }}</span>
<p class="mt-1 text-gray-400">{{ __('معذور') }}</p>
</div>
</div>
</div>
@endforeach
</div>
@else
<!-- Empty State -->
<div class="flex flex-col items-center justify-center py-16 px-4">
......
resources/views/livewire/reports/financial-report.blade.php
View file @ 944501f1
<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('reports.view') }}" wire:navigate class="text-sm text-blue-600 hover:text-blue-800">{{ __('العودة للتقارير') }}</a>
</div>
<!-- Filters -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 mb-6">
<div class="flex flex-wrap items-end gap-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="grid grid-cols-2 md:grid-cols-3 gap-3 sm:gap-4">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('الفترة') }}</label>
<select wire:model.live="period" class="rounded-lg border-gray-300 text-sm">
......@@ -30,29 +30,29 @@
</div>
<!-- Summary Cards -->
<div class="grid grid-cols-1 md:grid-cols-4 gap-4 mb-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="grid grid-cols-2 lg:grid-cols-4 gap-3 sm:gap-4 mb-4 sm:mb-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('إجمالي الإيرادات') }}</p>
<p class="text-2xl font-bold text-green-600 mt-1" dir="ltr">{{ format_money($totalRevenue) }}</p>
<p class="text-xl sm:text-2xl font-bold text-green-600 mt-1" dir="ltr">{{ format_money($totalRevenue) }}</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('إجمالي الفواتير') }}</p>
<p class="text-2xl font-bold text-blue-600 mt-1" dir="ltr">{{ format_money($totalInvoiced) }}</p>
<p class="text-xl sm:text-2xl font-bold text-blue-600 mt-1" dir="ltr">{{ format_money($totalInvoiced) }}</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('المستحقات المعلقة') }}</p>
<p class="text-2xl font-bold text-orange-600 mt-1" dir="ltr">{{ format_money($totalOutstanding) }}</p>
<p class="text-xl sm:text-2xl font-bold text-orange-600 mt-1" dir="ltr">{{ format_money($totalOutstanding) }}</p>
</div>
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6">
<p class="text-sm text-gray-500">{{ __('فواتير متأخرة') }}</p>
<p class="text-2xl font-bold text-red-600 mt-1">{{ $overdueCount }}</p>
<p class="text-xl sm:text-2xl font-bold text-red-600 mt-1">{{ $overdueCount }}</p>
</div>
</div>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 mb-6">
<div class="grid grid-cols-1 lg:grid-cols-2 gap-4 sm:gap-6 mb-4 sm:mb-6">
<!-- Payment Methods Breakdown -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<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>
@forelse($paymentsByMethod as $method => $amount)
<div class="flex items-center justify-between py-2 border-b border-gray-100 last:border-0">
<span class="text-sm text-gray-700">{{ __($method) }}</span>
......@@ -69,8 +69,8 @@
</div>
<!-- Daily Revenue Chart (simple bars) -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<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($dailyRevenue) > 0)
@php $maxDaily = max($dailyRevenue) ?: 1; @endphp
<div class="space-y-2 max-h-64 overflow-y-auto">
......@@ -98,9 +98,12 @@
<!-- Top Programs by Revenue -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="p-4 border-b border-gray-200">
<h3 class="text-lg font-semibold text-gray-800">{{ __('أعلى البرامج إيراداً') }}</h3>
<div class="px-4 sm:px-6 py-3 sm:py-4 border-b border-gray-200">
<h3 class="text-base sm:text-lg font-semibold text-gray-800">{{ __('أعلى البرامج إيراداً') }}</h3>
</div>
{{-- Desktop Table --}}
<div class="hidden md:block overflow-x-auto">
<table class="w-full">
<thead class="bg-gray-50">
<tr>
......@@ -126,4 +129,23 @@
</tbody>
</table>
</div>
{{-- Mobile Cards --}}
<div class="md:hidden divide-y divide-gray-100">
@forelse($topPrograms as $i => $program)
<div class="p-4 flex items-center justify-between">
<div class="flex items-center gap-3">
<span class="text-sm text-gray-400 font-medium">{{ $i + 1 }}</span>
<div>
<p class="text-sm font-medium text-gray-800">{{ $program->description }}</p>
<p class="text-xs text-gray-500">{{ $program->count }} {{ __('مبيعات') }}</p>
</div>
</div>
<span class="text-sm font-medium text-green-600" dir="ltr">{{ format_money($program->revenue) }}</span>
</div>
@empty
<div class="p-8 text-center text-sm text-gray-500">{{ __('لا توجد بيانات') }}</div>
@endforelse
</div>
</div>
</div>
resources/views/livewire/reports/reports-page.blade.php
View file @ 944501f1
<div>
<div class="mb-6">
<h1 class="text-2xl font-bold text-gray-800">{{ __('التقارير') }}</h1>
<div class="mb-4 sm:mb-6">
<h1 class="text-xl sm:text-2xl font-bold text-gray-800">{{ __('التقارير') }}</h1>
</div>
<!-- Report Type Tabs -->
......@@ -163,7 +163,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-indigo-500 focus
<!-- By Membership Type -->
@if(!empty($reportData['by_membership_type']))
<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">
<h3 class="text-base font-semibold text-gray-800 mb-4">{{ __('حسب نوع العضوية') }}</h3>
<div class="grid grid-cols-2 sm:grid-cols-3 gap-3">
@foreach($reportData['by_membership_type'] as $type => $count)
......
resources/views/livewire/roles/role-form.blade.php
View file @ 944501f1
<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('roles.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">&larr; العودة</a>
</div>
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالعربية *</label>
<input type="text" wire:model="name_ar" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name_ar') border-red-500 @enderror">
<input type="text" wire:model="name_ar" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-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>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالإنجليزية *</label>
<input type="text" 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 @error('name') border-red-500 @enderror">
<input type="text" wire:model="name" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name') border-red-500 @enderror">
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">المعرف (slug) *</label>
<input type="text" 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 @error('slug') border-red-500 @enderror" placeholder="custom_role">
<input type="text" wire:model="slug" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('slug') border-red-500 @enderror" placeholder="custom_role">
@error('slug') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">المستوى (0-99) *</label>
<input type="number" wire:model="level" min="0" max="99" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('level') border-red-500 @enderror">
<input type="number" wire:model="level" min="0" max="99" dir="ltr" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('level') border-red-500 @enderror">
@error('level') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div class="md:col-span-2">
<div class="sm:col-span-2">
<label class="block text-sm font-medium text-gray-700 mb-1">الوصف</label>
<textarea wire:model="description" rows="2" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"></textarea>
<textarea wire:model="description" rows="2" class="w-full text-sm px-4 py-2.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500"></textarea>
</div>
</div>
</div>
<!-- Permissions -->
<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="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="space-y-6">
@foreach($permissionGroups as $module => $permissions)
<div>
<h3 class="text-sm font-semibold text-gray-600 mb-2 capitalize">{{ $module }}</h3>
<div class="flex flex-wrap gap-3">
@foreach($permissions as $perm)
<label class="flex items-center gap-1.5 cursor-pointer">
<label class="min-h-[44px] flex items-center gap-1.5 cursor-pointer">
<input type="checkbox" wire:model="selectedPermissions" value="{{ $perm->id }}"
class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
<span class="text-sm text-gray-700">{{ $perm->action }}</span>
......@@ -56,13 +56,13 @@ class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500">
</div>
</div>
<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('roles.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 text-sm font-medium">إلغاء</a>
<button type="submit" wire:loading.attr="disabled"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400">
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 text-sm">
<span wire:loading.remove wire:target="save">{{ $editing ? 'حفظ التعديلات' : 'إنشاء الدور' }}</span>
<span wire:loading wire:target="save">جارٍ الحفظ...</span>
</button>
<a href="{{ route('roles.list') }}" wire:navigate class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50">إلغاء</a>
</div>
</form>
</div>
resources/views/livewire/roles/role-list.blade.php
View file @ 944501f1
<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('roles.create')
<a href="{{ route('roles.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>
إضافة دور
<span class="hidden sm:inline">إضافة دور</span>
</a>
@endcan
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-3 sm:gap-4">
@foreach($roles as $role)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-5">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-5">
<div class="flex items-start justify-between mb-3">
<div>
<h3 class="font-semibold text-gray-800">{{ $role->name_ar }}</h3>
<h3 class="font-semibold text-gray-800 text-sm sm:text-base">{{ $role->name_ar }}</h3>
<p class="text-xs text-gray-500 font-mono">{{ $role->slug }}</p>
</div>
<span class="px-2 py-0.5 text-xs rounded-full {{ $role->is_system ? 'bg-amber-100 text-amber-700' : 'bg-blue-100 text-blue-700' }}">
<span class="px-2 py-0.5 text-xs rounded-full ms-2 {{ $role->is_system ? 'bg-amber-100 text-amber-700' : 'bg-blue-100 text-blue-700' }}">
{{ $role->is_system ? 'نظام' : 'مخصص' }}
</span>
</div>
<div class="flex items-center justify-between text-sm text-gray-600">
<div class="flex items-center justify-between text-xs sm:text-sm text-gray-600">
<span>المستوى: {{ $role->level }}</span>
<span>{{ $role->users_count }} مستخدم</span>
</div>
@if(!$role->is_system)
@can('roles.update')
<div class="mt-3 pt-3 border-t border-gray-100">
<a href="{{ route('roles.edit', $role) }}" wire:navigate class="text-blue-600 hover:text-blue-800 text-sm">تعديل الصلاحيات</a>
<a href="{{ route('roles.edit', $role) }}" wire:navigate class="text-blue-600 hover:text-blue-800 text-sm py-2 inline-block">تعديل الصلاحيات</a>
</div>
@endcan
@endif
......
resources/views/livewire/schedule/weekly-schedule.blade.php
View file @ 944501f1
<div>
<!-- Header -->
<div class="mb-6 flex flex-wrap items-center justify-between gap-4">
<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-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>
......@@ -10,7 +10,7 @@
<div class="flex items-center gap-2">
<button
wire:click="previousWeek"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2.5 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
>
<svg class="h-4 w-4 rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"/>
......@@ -20,14 +20,14 @@ class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3
<button
wire:click="goToToday"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2.5 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
>
{{ __('اليوم') }}
</button>
<button
wire:click="nextWeek"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3 py-2.5 text-sm font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-blue-500"
>
<span class="me-1">{{ __('التالي') }}</span>
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
......@@ -38,8 +38,8 @@ class="inline-flex items-center rounded-lg border border-gray-300 bg-white px-3
</div>
<!-- Filters -->
<div class="mb-6 rounded-lg border border-gray-200 bg-white p-4">
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
<div class="mb-6 rounded-lg border border-gray-200 bg-white p-4 sm:p-6">
<div class="grid grid-cols-2 gap-3 sm:gap-4">
<!-- Program Filter -->
<div>
<label for="programFilter" class="mb-1 block text-sm font-medium text-gray-700">{{ __('البرنامج') }}</label>
......@@ -74,7 +74,7 @@ class="w-full rounded-lg border-gray-300 text-sm shadow-sm focus:border-blue-500
<!-- Week Label -->
<div class="mb-4 text-center">
<span class="text-lg font-semibold text-gray-800">
<span class="text-base sm:text-lg font-semibold text-gray-800">
{{ \Carbon\Carbon::parse($weekStart)->format('Y/m/d') }}
—
{{ \Carbon\Carbon::parse($weekStart)->addDays(5)->format('Y/m/d') }}
......@@ -161,7 +161,7 @@ class="mb-1 overflow-hidden rounded-md border-s-4 p-1.5 text-xs {{ $colorClass }
<!-- Empty State -->
@if($sessionsByDate->isEmpty())
<div class="mt-4 rounded-lg border border-gray-200 bg-white p-12 text-center">
<div class="mt-4 rounded-lg border border-gray-200 bg-white p-8 sm:p-12 text-center">
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z"/>
</svg>
......@@ -171,7 +171,7 @@ class="mb-1 overflow-hidden rounded-md border-s-4 p-1.5 text-xs {{ $colorClass }
<!-- Legend -->
@if($sessionsByDate->isNotEmpty())
<div class="mt-4 rounded-lg border border-gray-200 bg-white p-4">
<div class="mt-4 rounded-lg border border-gray-200 bg-white p-4 sm:p-6">
<h3 class="mb-2 text-sm font-medium text-gray-700">{{ __('دليل الألوان') }}</h3>
<div class="flex flex-wrap gap-3">
@foreach($programColors as $programId => $colorClass)
......
resources/views/livewire/settings/academy-settings.blade.php
View file @ 944501f1
<div>
<div class="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'))
......@@ -10,8 +10,8 @@
@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 md:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">اسم الأكاديمية بالعربية *</label>
<input type="text" wire:model="name_ar" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name_ar') border-red-500 @enderror">
......@@ -54,10 +54,12 @@
</div>
</div>
<div class="flex flex-col-reverse sm:flex-row gap-3 mt-4 sm:mt-6">
<button type="submit" wire:loading.attr="disabled"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400">
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">
<span wire:loading.remove wire:target="save">حفظ الإعدادات</span>
<span wire:loading wire:target="save">جارٍ الحفظ...</span>
</button>
</div>
</form>
</div>
resources/views/livewire/settings/branding-settings.blade.php
View file @ 944501f1
......@@ -10,8 +10,8 @@
}
}">
<!-- Header -->
<div class="mb-8">
<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>
......@@ -24,7 +24,7 @@
<!-- Tabs -->
<div class="mb-6 border-b border-gray-200">
<nav class="flex gap-1 -mb-px">
<nav class="flex gap-1 -mb-px overflow-x-auto">
@foreach([
'logo' => 'الشعارات والصور',
'colors' => 'الألوان',
......@@ -36,7 +36,7 @@
:class="activeTab === '{{ $key }}'
? 'border-blue-600 text-blue-700 bg-blue-50/50'
: 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'"
class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all rounded-t-lg">
class="px-3 sm:px-5 py-2.5 sm:py-3 text-xs sm:text-sm font-medium whitespace-nowrap border-b-2 transition-all rounded-t-lg">
{{ __($label) }}
</button>
@endforeach
......@@ -46,9 +46,9 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
<form wire:submit="save">
<!-- Logo & Images Tab -->
<div x-show="activeTab === 'logo'" x-transition>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-4 sm:gap-6">
<!-- Main Logo -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('الشعار الرئيسي') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('يظهر في الشريط الجانبي وصفحة تسجيل الدخول. PNG أو SVG، أقصى 2 ميجا') }}</p>
......@@ -75,7 +75,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Dark Logo -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('الشعار (الوضع الداكن)') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('نسخة فاتحة للخلفيات الداكنة. اختياري') }}</p>
......@@ -98,7 +98,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Favicon -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('الأيقونة المصغرة (Favicon)') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('تظهر في تبويب المتصفح. 32x32 أو 64x64 بكسل. أقصى 512 كيلو') }}</p>
......@@ -121,7 +121,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Signature -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('التوقيع الرسمي') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('يظهر في الفواتير والشهادات. صورة شفافة PNG مفضلة') }}</p>
......@@ -144,7 +144,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Login Background -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('خلفية صفحة الدخول') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('صورة خلفية لشاشة تسجيل الدخول. أقصى 5 ميجا') }}</p>
......@@ -167,7 +167,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Invoice Header -->
<div class="bg-white rounded-xl border border-gray-200 p-6 space-y-4">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 space-y-4">
<div>
<h3 class="font-semibold text-gray-900">{{ __('رأس الفاتورة') }}</h3>
<p class="text-xs text-gray-500 mt-1">{{ __('صورة تظهر أعلى الفاتورة. يفضل بعرض 800 بكسل') }}</p>
......@@ -193,11 +193,11 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
<!-- Colors Tab -->
<div x-show="activeTab === 'colors'" x-transition>
<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">
<!-- Color Pickers -->
<div class="lg:col-span-2 space-y-6">
<!-- Main Colors -->
<div class="bg-white rounded-xl border border-gray-200 p-6">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6">
<h3 class="font-semibold text-gray-900 mb-4">{{ __('الألوان الرئيسية') }}</h3>
<div class="grid grid-cols-2 sm:grid-cols-3 gap-4">
@foreach([
......@@ -217,7 +217,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Sidebar Colors -->
<div class="bg-white rounded-xl border border-gray-200 p-6">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6">
<h3 class="font-semibold text-gray-900 mb-4">{{ __('ألوان الشريط الجانبي') }}</h3>
<div class="grid grid-cols-2 sm:grid-cols-3 gap-4">
@foreach([
......@@ -237,7 +237,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Status Colors -->
<div class="bg-white rounded-xl border border-gray-200 p-6">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6">
<h3 class="font-semibold text-gray-900 mb-4">{{ __('ألوان الحالات') }}</h3>
<div class="grid grid-cols-2 sm:grid-cols-3 gap-4">
@foreach([
......@@ -378,7 +378,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
<!-- Typography Tab -->
<div x-show="activeTab === 'typography'" x-transition>
<div class="bg-white rounded-xl border border-gray-200 p-6 max-w-2xl">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 max-w-2xl">
<h3 class="font-semibold text-gray-900 mb-6">{{ __('إعدادات الخطوط') }}</h3>
<div class="space-y-6">
<div>
......@@ -427,7 +427,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
<!-- Invoice/Print Tab -->
<div x-show="activeTab === 'invoice'" x-transition>
<div class="bg-white rounded-xl border border-gray-200 p-6 max-w-3xl space-y-6">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 max-w-3xl space-y-6">
<h3 class="font-semibold text-gray-900">{{ __('نصوص الفواتير والإيصالات') }}</h3>
<div>
......@@ -455,7 +455,7 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
<!-- Display Options Tab -->
<div x-show="activeTab === 'display'" x-transition>
<div class="bg-white rounded-xl border border-gray-200 p-6 max-w-2xl">
<div class="bg-white rounded-xl border border-gray-200 p-4 sm:p-6 max-w-2xl">
<h3 class="font-semibold text-gray-900 mb-6">{{ __('خيارات العرض') }}</h3>
<div class="space-y-5">
@foreach([
......@@ -480,9 +480,9 @@ class="px-5 py-3 text-sm font-medium whitespace-nowrap border-b-2 transition-all
</div>
<!-- Save Button (always visible) -->
<div class="mt-8 flex items-center gap-4 border-t border-gray-200 pt-6">
<div class="mt-6 sm:mt-8 flex flex-col-reverse sm:flex-row sm:items-center gap-3 sm:gap-4 border-t border-gray-200 pt-4 sm:pt-6">
<button type="submit" wire:loading.attr="disabled" wire:target="save"
class="px-8 py-3 bg-blue-600 text-white font-semibold rounded-xl hover:bg-blue-700 disabled:bg-blue-400 transition-all shadow-sm hover:shadow-md">
class="w-full sm:w-auto px-6 sm:px-8 py-2.5 sm:py-3 bg-blue-600 text-white font-semibold rounded-xl hover:bg-blue-700 disabled:bg-blue-400 transition-all shadow-sm hover:shadow-md">
<span wire:loading.remove wire:target="save">{{ __('حفظ التغييرات') }}</span>
<span wire:loading wire:target="save" class="flex items-center gap-2">
<svg class="animate-spin h-4 w-4" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"/><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"/></svg>
......
resources/views/livewire/settings/receipt-settings.blade.php
View file @ 944501f1
<div class="space-y-6">
{{-- Page Header --}}
<div class="flex items-center justify-between">
<h1 class="text-2xl font-bold text-gray-900">{{ __('إعدادات الإيصال') }}</h1>
<div class="flex items-center gap-3">
<button wire:click="resetToDefaults" class="px-4 py-2 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50">
<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>
<div class="w-full sm:w-auto flex flex-col-reverse sm:flex-row items-stretch sm:items-center gap-2 sm:gap-3">
<button wire:click="resetToDefaults" class="w-full sm:w-auto py-2.5 text-center px-4 text-sm font-medium text-gray-700 bg-white border border-gray-300 rounded-lg hover:bg-gray-50">
{{ __('استعادة الافتراضي') }}
</button>
<button wire:click="save" wire:loading.attr="disabled" wire:target="save"
class="px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 disabled:opacity-50">
class="w-full sm:w-auto py-2.5 text-center px-4 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-blue-700 disabled:opacity-50">
<span wire:loading.remove wire:target="save">{{ __('حفظ الإعدادات') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
......@@ -25,7 +25,7 @@ class="px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-
@enderror
{{-- Branch Selector --}}
<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">
<label class="block text-sm font-medium text-gray-700 mb-2">{{ __('الفرع') }}</label>
<select wire:model.live="selectedBranchId" class="w-full max-w-sm rounded-lg border-gray-300 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('-- اختر الفرع --') }}</option>
......@@ -36,10 +36,10 @@ class="px-4 py-2 text-sm font-medium text-white bg-blue-600 rounded-lg hover:bg-
</div>
@if($selectedBranchId)
<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">
{{-- Sections Order --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('ترتيب الأقسام') }}</h2>
<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-900 mb-4">{{ __('ترتيب الأقسام') }}</h2>
<div class="space-y-2">
@foreach($sections as $index => $section)
<div class="flex items-center gap-3 p-3 rounded-lg border {{ $section['enabled'] ? 'border-blue-200 bg-blue-50' : 'border-gray-200 bg-gray-50' }}">
......@@ -66,8 +66,8 @@ class="rounded border-gray-300 text-blue-600 focus:ring-blue-500 ms-2">
</div>
{{-- Field Toggles --}}
<div class="lg:col-span-2 bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('الحقول المعروضة') }}</h2>
<div class="lg:col-span-2 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-900 mb-4">{{ __('الحقول المعروضة') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
@foreach($fieldLabels as $key => $label)
<label class="flex items-center gap-3 p-3 rounded-lg border cursor-pointer transition-colors
......@@ -82,9 +82,9 @@ class="rounded border-gray-300 text-green-600 focus:ring-green-500">
</div>
{{-- Receipt Settings --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6">
<h2 class="text-lg font-semibold text-gray-900 mb-4">{{ __('إعدادات المظهر') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-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-900 mb-4">{{ __('إعدادات المظهر') }}</h2>
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3 sm:gap-4 lg:gap-6">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ __('عرض الورق') }}</label>
<select wire:model="settings.paper_width" class="w-full rounded-lg border-gray-300 focus:ring-blue-500">
......
resources/views/livewire/settings/system-settings-form.blade.php
View file @ 944501f1
<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">
<div>
<h1 class="text-xl sm:text-2xl font-bold text-gray-900">{{ __('إعدادات النظام') }}</h1>
<p class="mt-1 text-sm text-gray-500">{{ __('إدارة إعدادات النظام المختلفة حسب المجموعة') }}</p>
</div>
</div>
@if(session('success'))
<div class="mb-4 p-3 bg-green-50 border border-green-200 text-green-700 rounded-lg text-sm">
......@@ -45,7 +47,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" wire:loading.class="opacity-50 pointer-events-none" wire:target="updatedActiveGroup">
<div class="bg-white border border-gray-200 rounded-lg p-4 sm:p-6" wire:loading.class="opacity-50 pointer-events-none" wire:target="updatedActiveGroup">
@if(empty($settings))
<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"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.066 2.573c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.573 1.066c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.066-2.573c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37.996.608 2.296.07 2.572-1.065z"/><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"/></svg>
......@@ -65,7 +67,7 @@ class="px-4 py-2.5 text-sm font-medium whitespace-nowrap border-b-2 transition-c
</label>
@if($type === 'boolean')
<label class="relative inline-flex items-center cursor-pointer">
<label class="relative inline-flex items-center cursor-pointer min-h-[44px]">
<input
type="checkbox"
id="setting-{{ $key }}"
......@@ -82,7 +84,7 @@ class="sr-only peer">
wire:model="settings.{{ $key }}"
dir="ltr"
step="{{ $type === 'float' ? '0.01' : '1' }}"
class="w-full max-w-xs rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm">
class="w-full max-w-xs rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5">
@elseif($type === 'json')
<textarea
id="setting-{{ $key }}"
......@@ -95,7 +97,7 @@ class="w-full rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:r
type="text"
id="setting-{{ $key }}"
wire:model="settings.{{ $key }}"
class="w-full max-w-md rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm">
class="w-full max-w-md rounded-lg border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500 text-sm py-2.5">
@endif
@if($description)
......@@ -108,9 +110,9 @@ class="w-full max-w-md rounded-lg border-gray-300 shadow-sm focus:border-blue-50
</div>
@if(!empty($settings))
<div class="mt-4">
<div class="mt-4 flex flex-col-reverse sm:flex-row items-stretch sm:items-center justify-end 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="px-6 py-2.5 sm:py-2 w-full sm:w-auto 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">{{ __('حفظ الإعدادات') }}</span>
<span wire:loading wire:target="save">{{ __('جارٍ الحفظ...') }}</span>
</button>
......
resources/views/livewire/trainer/trainer-dashboard.blade.php
View file @ 944501f1
......@@ -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">{{ __('اليوم') }}: {{ now()->translatedFormat('l j F Y') }}</p>
</div>
</div>
......
resources/views/livewire/training/reschedule-session.blade.php
View file @ 944501f1
<div>
@if($session->status === 'scheduled')
<button wire:click="open" class="px-3 py-1.5 text-xs bg-yellow-100 text-yellow-700 rounded-lg hover:bg-yellow-200">
<button wire:click="open" class="px-3 py-2.5 text-xs bg-yellow-100 text-yellow-700 rounded-lg hover:bg-yellow-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">{{ __('إعادة جدولة الحصة') }}</h3>
<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">{{ __('إعادة جدولة الحصة') }}</h3>
<div class="space-y-4">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('التاريخ الجديد') }}</label>
<input type="date" wire:model="newDate" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm">
<input type="date" wire:model="newDate" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
@error('newDate') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
</div>
<div class="grid grid-cols-2 gap-3">
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('من') }}</label>
<input type="time" wire:model="newStartTime" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm">
<input type="time" wire:model="newStartTime" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
@error('newStartTime') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('إلى') }}</label>
<input type="time" wire:model="newEndTime" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm">
<input type="time" wire:model="newEndTime" dir="ltr" class="w-full rounded-lg border-gray-300 text-sm py-2.5">
@error('newEndTime') <p class="text-xs text-red-500 mt-1">{{ $message }}</p> @enderror
</div>
</div>
<div>
<label class="block text-sm text-gray-600 mb-1">{{ __('السبب') }} *</label>
<textarea wire:model="reason" rows="2" class="w-full rounded-lg border-gray-300 text-sm"
<textarea wire:model="reason" rows="2" 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>
<div class="flex gap-2 justify-end mt-6">
<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-2 sm:gap-2 sm:justify-end mt-6">
<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 rounded-lg hover:bg-gray-100">
{{ __('إلغاء') }}
</button>
<button wire:click="reschedule" wire:loading.attr="disabled"
class="px-4 py-2 text-sm text-white bg-yellow-600 rounded-lg hover:bg-yellow-700 disabled:opacity-50">
class="w-full sm:w-auto px-4 py-2.5 text-sm text-white bg-yellow-600 rounded-lg hover:bg-yellow-700 disabled:opacity-50">
<span wire:loading.remove wire:target="reschedule">{{ __('تأكيد') }}</span>
<span wire:loading wire:target="reschedule">{{ __('جارٍ...') }}</span>
</button>
......
resources/views/livewire/users/user-form.blade.php
View file @ 944501f1
<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('users.list') }}" wire:navigate class="text-sm text-gray-500 hover:text-gray-700">&larr; العودة</a>
</div>
<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 sm:grid-cols-2 gap-3 sm:gap-4">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالعربية *</label>
<input type="text" wire:model="name_ar" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name_ar') border-red-500 @enderror">
<input type="text" wire:model="name_ar" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-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>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الاسم بالإنجليزية *</label>
<input type="text" 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 @error('name') border-red-500 @enderror">
<input type="text" wire:model="name" dir="ltr" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('name') border-red-500 @enderror">
@error('name') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">البريد الإلكتروني *</label>
<input type="email" wire:model="email" dir="ltr" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('email') border-red-500 @enderror">
<input type="email" wire:model="email" dir="ltr" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('email') border-red-500 @enderror">
@error('email') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">الدور</label>
<select wire:model="role_id" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<select wire:model="role_id" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<option value="">— بدون دور —</option>
@foreach($roles as $r)
<option value="{{ $r->id }}">{{ $r->name_ar }} ({{ $r->slug }})</option>
......@@ -34,17 +34,17 @@
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">{{ $editing ? 'كلمة مرور جديدة (اتركها فارغة للإبقاء)' : 'كلمة المرور *' }}</label>
<input type="password" wire:model="password" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('password') border-red-500 @enderror">
<input type="password" wire:model="password" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 @error('password') border-red-500 @enderror">
@error('password') <p class="mt-1 text-sm text-red-600">{{ $message }}</p> @enderror
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">تأكيد كلمة المرور</label>
<input type="password" wire:model="password_confirmation" class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<input type="password" wire:model="password_confirmation" class="w-full px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
</div>
</div>
<div class="mt-4">
<label class="block text-sm font-medium text-gray-700 mb-1">الحالة</label>
<select wire:model="status" class="w-full max-w-xs px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<select wire:model="status" class="w-full max-w-xs px-4 py-2.5 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<option value="active">نشط</option>
<option value="inactive">غير نشط</option>
<option value="suspended">موقوف</option>
......@@ -53,13 +53,13 @@
</div>
</div>
<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('users.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 text-sm font-medium">إلغاء</a>
<button type="submit" wire:loading.attr="disabled"
class="px-6 py-2.5 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 disabled:bg-blue-400">
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 text-sm">
<span wire:loading.remove wire:target="save">{{ $editing ? 'حفظ التعديلات' : 'إنشاء المستخدم' }}</span>
<span wire:loading wire:target="save">جارٍ الحفظ...</span>
</button>
<a href="{{ route('users.list') }}" wire:navigate class="px-6 py-2.5 border border-gray-300 text-gray-700 rounded-lg hover:bg-gray-50">إلغاء</a>
</div>
</form>
</div>
resources/views/livewire/users/user-list.blade.php
View file @ 944501f1
<div>
<div class="flex items-center justify-between mb-6">
<h1 class="text-2xl font-bold text-gray-800">المستخدمين</h1>
<!-- Header -->
<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('users.create')
<a href="{{ route('users.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">
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 min-h-[44px]">
<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>
<!-- 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-4 gap-4">
<div class="sm:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-4 gap-3">
<div class="col-span-2">
<input type="text" wire:model.live.debounce.300ms="search"
placeholder="بحث بالاسم أو البريد..."
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
</div>
<select wire:model.live="role" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<select wire:model.live="role" class="px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500">
<option value="">كل الأدوار</option>
@foreach($roles as $r)
<option value="{{ $r->id }}">{{ $r->name_ar }}</option>
......@@ -31,8 +32,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</div>
</div>
<!-- Table -->
<div class="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<!-- Desktop Table -->
<div class="hidden md:block bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
<div class="overflow-x-auto">
<table class="w-full text-sm" wire:loading.class="opacity-50 pointer-events-none">
<thead class="bg-gray-50 border-b border-gray-200">
<tr>
......@@ -72,7 +74,8 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</td>
<td class="px-4 py-3 text-center">
@can('users.update')
<a href="{{ route('users.edit', $u) }}" wire:navigate class="text-blue-600 hover:text-blue-800 text-sm">تعديل</a>
<a href="{{ route('users.edit', $u) }}" wire:navigate
class="inline-flex items-center justify-center text-blue-600 hover:text-blue-800 text-sm py-2 min-h-[44px]">تعديل</a>
@endcan
</td>
</tr>
......@@ -83,9 +86,53 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
@endforelse
</tbody>
</table>
</div>
@if($users->hasPages())
<div class="px-4 py-3 border-t border-gray-200">{{ $users->links() }}</div>
@endif
</div>
<!-- Mobile Cards -->
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($users as $u)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3">
<div class="flex items-center justify-between">
<div class="flex items-center gap-3">
<div class="w-10 h-10 rounded-full bg-blue-100 flex items-center justify-center">
<span class="text-sm font-medium text-blue-700">{{ mb_substr($u->name_ar ?? $u->name, 0, 1) }}</span>
</div>
<div>
<p class="font-medium text-gray-800 text-sm">{{ $u->name_ar ?? $u->name }}</p>
<p class="text-xs text-gray-500">{{ $u->primaryRole?->name_ar ?? '—' }}</p>
@if($u->is_super_admin)
<span class="text-xs text-red-600 font-medium">Super Admin</span>
@endif
</div>
</div>
<div class="flex items-center gap-3">
@if($u->status === 'active')
<span class="px-2 py-0.5 text-xs bg-green-100 text-green-700 rounded-full">نشط</span>
@elseif($u->status === 'suspended')
<span class="px-2 py-0.5 text-xs bg-amber-100 text-amber-700 rounded-full">موقوف</span>
@else
<span class="px-2 py-0.5 text-xs bg-red-100 text-red-700 rounded-full">غير نشط</span>
@endif
@can('users.update')
<a href="{{ route('users.edit', $u) }}" wire:navigate
class="inline-flex items-center justify-center text-blue-600 hover:text-blue-800 text-sm py-2 min-h-[44px]">تعديل</a>
@endcan
</div>
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 text-center text-gray-500">
لا يوجد مستخدمين
</div>
@endforelse
@if($users->hasPages())
<div class="mt-4">{{ $users->links() }}</div>
@endif
</div>
</div>
resources/views/livewire/wallets/wallet-list.blade.php
View file @ 944501f1
<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 --}}
@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">
<div class="sm:col-span-2">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-3 sm:p-4 mb-4">
<div class="grid grid-cols-2 md:grid-cols-3 gap-3">
<div class="col-span-2 md:col-span-2">
<input type="text" wire:model.live.debounce.300ms="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-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
</div>
<select wire:model.live="activeFilter" class="px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<select wire:model.live="activeFilter" class="px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
<option value="">{{ __('الكل') }}</option>
<option value="1">{{ __('نشطة') }}</option>
<option value="0">{{ __('غير نشطة') }}</option>
......@@ -26,9 +26,9 @@ class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:rin
</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>
......@@ -101,4 +101,66 @@ class="text-blue-600 hover:text-blue-800 text-sm">{{ __('عرض') }}</a>
</div>
@endif
</div>
{{-- Mobile Cards --}}
<div class="md:hidden space-y-3" wire:loading.class="opacity-50 pointer-events-none">
@forelse($wallets as $wallet)
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4">
<div class="flex items-start justify-between gap-3 mb-3">
<div class="min-w-0 flex-1">
<p class="font-medium text-gray-800 text-sm truncate">
@if($wallet->owner && method_exists($wallet->owner, 'person') && $wallet->owner->person)
{{ $wallet->owner->person->name_ar }}
@elseif($wallet->owner)
{{ $wallet->owner->name_ar ?? $wallet->owner->name ?? '—' }}
@else
—
@endif
</p>
<p class="text-xs text-gray-500 mt-0.5">
@php
$typeLabels = [
'App\\Domain\\Participant\\Models\\Participant' => 'مشترك',
];
$ownerType = $wallet->owner_type;
@endphp
{{ $typeLabels[$ownerType] ?? class_basename($ownerType) }}
</p>
</div>
@if($wallet->is_active)
<span class="px-2 py-0.5 text-xs bg-green-100 text-green-700 rounded-full shrink-0">{{ __('نشطة') }}</span>
@else
<span class="px-2 py-0.5 text-xs bg-gray-100 text-gray-700 rounded-full shrink-0">{{ __('غير نشطة') }}</span>
@endif
</div>
<div class="flex items-center justify-between">
<span class="font-mono text-sm {{ $wallet->balance > 0 ? 'text-green-700' : 'text-gray-600' }}" dir="ltr">
{{ number_format($wallet->balance / 100, 2) }} {{ __('ج.م') }}
</span>
@can('wallets.view')
<a href="{{ route('wallets.show', $wallet) }}" wire:navigate
class="inline-flex items-center justify-center py-2 px-3 text-sm text-blue-600 hover:text-blue-800 hover:bg-blue-50 rounded-lg transition-colors">
{{ __('عرض') }}
</a>
@endcan
</div>
</div>
@empty
<div class="bg-white rounded-xl shadow-sm border border-gray-200 px-4 py-12">
<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="M3 10h18M7 15h1m4 0h1m-7 4h12a3 3 0 003-3V8a3 3 0 00-3-3H6a3 3 0 00-3 3v8a3 3 0 003 3z"/>
</svg>
<p class="text-gray-500 text-sm">{{ __('لا توجد محافظ') }}</p>
</div>
</div>
@endforelse
@if($wallets->hasPages())
<div class="mt-4">
{{ $wallets->links() }}
</div>
@endif
</div>
</div>
resources/views/livewire/wallets/wallet-show.blade.php
View file @ 944501f1
<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('wallets.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">
<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>
......@@ -21,8 +21,8 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
@endif
{{-- Wallet Info Card --}}
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-6 mb-6">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-6">
<div class="bg-white rounded-xl shadow-sm border border-gray-200 p-4 sm:p-6 mb-4 sm:mb-6">
<div class="grid grid-cols-1 sm:grid-cols-3 gap-4 sm:gap-6">
<div>
<p class="text-sm text-gray-500 mb-1">{{ __('صاحب المحفظة') }}</p>
<p class="text-lg font-semibold text-gray-800">
......@@ -54,9 +54,9 @@ class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 text-gray-700 rounde
{{-- Deposit & Withdraw Forms --}}
@if($wallet->is_active)
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 sm:gap-6 mb-4 sm:mb-6">
{{-- Deposit Form --}}
<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">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('إيداع') }}</h3>
<form wire:submit="deposit" class="space-y-4">
<div>
......@@ -81,7 +81,7 @@ class="w-full px-4 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700 di
</div>
{{-- Withdraw Form --}}
<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">
<h3 class="text-lg font-semibold text-gray-800 mb-4">{{ __('سحب') }}</h3>
<form wire:submit="withdraw" class="space-y-4">
<div>
......@@ -108,8 +108,8 @@ class="w-full px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 disabl
@endif
{{-- Transaction 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">
<h3 class="text-lg font-semibold text-gray-800">{{ __('سجل المعاملات') }}</h3>
</div>
<div wire:loading.class="opacity-50 pointer-events-none">
......
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