﻿<x-app-layout>
    <x-slot name="header">
        <div class="flex justify-between items-center">
            <h2 class="font-semibold text-l text-gray-800 leading-tight">
                {{ __('تعديل الشركة') }}: {{ $company->name }}
            </h2>
            <a href="{{ route('companies.show', $company) }}" class="inline-flex items-center p-4 py-2 bg-gray-600 border border-transparent rounded-md font-semibold text-s text-white uppercase tracking-widest hover:bg-gray-700 focus:bg-gray-700 active:bg-gray-800 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 transition ease-in-out duration-150">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 ml-1" viewBox="0 0 20 20" fill="currentColor">
                    <path fill-rule="evenodd" d="M9.707 16.707a1 1 0 01-1.414 0l-6-6a1 1 0 010-1.414l6-6a1 1 0 011.414 1.414L5.414 9H17a1 1 0 110 2H5.414l4.293 4.293a1 1 0 010 1.414z" clip-rule="evenodd" />
                </svg>
                {{ __('العودة') }}
            </a>
        </div>
    </x-slot>

    <div class="py-12">
        <div class="max-w-7l m-auto sm:p-6 lg:p-8">
            <div class="bg-white overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 bg-white border-b border-gray-200">
                    <form action="{{ route('companies.update', $company) }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        @method('PUT')

                        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                            <!-- اسم الشركة -->
                            <div>
                                <x-input-label for="name" :value="__('اسم الشركة')" />
                                <x-text-input id="name" class="block mt-1 w-full" type="text" name="name" :value="old('name', $company->name)" required autofocus />
                                <x-input-error :messages="$errors->get('name')" class="mt-2" />
                            </div>

                            <!-- السجل التجاري -->
                            <div>
                                <x-input-label for="commercial_record" :value="__('السجل التجاري (اختياري)')" />
                                <x-text-input id="commercial_record" class="block mt-1 w-full" type="text" name="commercial_record" :value="old('commercial_record', $company->commercial_record)" />
                                <x-input-error :messages="$errors->get('commercial_record')" class="mt-2" />
                            </div>

                            <!-- الرقم الضريبي -->
                            <div>
                                <x-input-label for="tax_number" :value="__('الرقم الضريبي (اختياري)')" />
                                <x-text-input id="tax_number" class="block mt-1 w-full" type="text" name="tax_number" :value="old('tax_number', $company->tax_number)" />
                                <x-input-error :messages="$errors->get('tax_number')" class="mt-2" />
                            </div>

                            <!-- العنوان -->
                            <div>
                                <x-input-label for="address" :value="__('العنوان (اختياري)')" />
                                <x-text-input id="address" class="block mt-1 w-full" type="text" name="address" :value="old('address', $company->address)" />
                                <x-input-error :messages="$errors->get('address')" class="mt-2" />
                            </div>

                            <!-- رقم الهاتف -->
                            <div>
                                <x-input-label for="phone" :value="__('رقم الهاتف (اختياري)')" />
                                <x-text-input id="phone" class="block mt-1 w-full" type="text" name="phone" :value="old('phone', $company->phone)" />
                                <x-input-error :messages="$errors->get('phone')" class="mt-2" />
                            </div>

                            <!-- البريد الإلكتروني -->
                            <div>
                                <x-input-label for="email" :value="__('البريد الإلكتروني (اختياري)')" />
                                <x-text-input id="email" class="block mt-1 w-full" type="email" name="email" :value="old('email', $company->email)" />
                                <x-input-error :messages="$errors->get('email')" class="mt-2" />
                            </div>

                            <!-- الموقع الإلكتروني -->
                            <div>
                                <x-input-label for="website" :value="__('الموقع الإلكتروني')" />
                                <x-text-input id="website" class="block mt-1 w-full" type="url" name="website" :value="old('website', $company->website)" />
                                <x-input-error :messages="$errors->get('website')" class="mt-2" />
                            </div>

                            <!-- العملة الأساسية -->
                            <div>
                                <x-input-label for="currency" :value="__('العملة الأساسية')" />
                                <select id="currency" name="currency" class="block mt-1 w-full border-gray-300 focus:border-primary-500 focus:ring-primary-500 rounded-md shadow-sm" required>
                                    <option value="">{{ __('اختر العملة') }}</option>
                                    <option value="ريال سعودي" {{ old('currency', $company->currency) == 'ريال سعودي' ? 'selected' : '' }}>{{ __('ريال سعودي') }}</option>
                                    <option value="درهم اماراتي" {{ old('currency', $company->currency) == 'درهم اماراتي' ? 'selected' : '' }}>{{ __('درهم اماراتي') }}</option>
                                    <option value="جنيه مصري" {{ old('currency', $company->currency) == 'جنيه مصري' ? 'selected' : '' }}>{{ __('جنيه مصري') }}</option>
                                    <option value="دولار امريكي" {{ old('currency', $company->currency) == 'دولار امريكي' ? 'selected' : '' }}>{{ __('دولار امريكي') }}</option>
                                </select>
                                <x-input-error :messages="$errors->get('currency')" class="mt-2" />
                            </div>

                            <!-- العملة الجزئية -->
                            <div>
                                <x-input-label for="sub_currency" :value="__('العملة الجزئية (اختياري)')" />
                                <select id="sub_currency" name="sub_currency" class="block mt-1 w-full border-gray-300 focus:border-primary-500 focus:ring-primary-500 rounded-md shadow-sm">
                                    <option value="">{{ __('اختر العملة الجزئية') }}</option>
                                    <option value="هللة" {{ old('sub_currency', $company->sub_currency) == 'هللة' ? 'selected' : '' }}>{{ __('هللة') }}</option>
                                    <option value="قرش" {{ old('sub_currency', $company->sub_currency) == 'قرش' ? 'selected' : '' }}>{{ __('قرش') }}</option>
                                    <option value="سنت" {{ old('sub_currency', $company->sub_currency) == 'سنت' ? 'selected' : '' }}>{{ __('سنت') }}</option>
                                </select>
                                <x-input-error :messages="$errors->get('sub_currency')" class="mt-2" />
                            </div>

                            <!-- شعار الشركة -->
                            <div>
                                <x-input-label for="logo" :value="__('شعار الشركة')" />
                                <input id="logo" class="block mt-1 w-full border-gray-300 focus:border-primary-500 focus:ring-primary-500 rounded-md shadow-sm" type="file" name="logo" accept="image/*" />
                                <x-input-error :messages="$errors->get('logo')" class="mt-2" />

                                @if($company->logo)
                                <div class="mt-2">
                                    <p class="text-sm text-gray-600 mb-1">{{ __('الشعار الحالي:') }}</p>
                                    <img src="{{ Storage::url($company->logo) }}" alt="{{ $company->name }}" class="h-20 rounded">
                                </div>
                                @endif
                            </div>

                            <!-- حالة التفعيل -->
                            <div class="flex items-center mt-4">
                                <input id="is_active" type="checkbox" class="rounded border-gray-300 text-primary-600 shadow-sm focus:ring-primary-500" name="is_active" {{ $company->is_active ? 'checked' : '' }}>
                                <label for="is_active" class="mr-2 text-sm text-gray-600">{{ __('تفعيل الشركة') }}</label>
                            </div>
                        </div>

                        <!-- ZATCA Integration Fields -->
                        <div class="mt-10 border-t border-gray-200 pt-10">
                            <h3 class="text-lg font-medium text-gray-900 mb-6">
                                {{ __('بيانات الربط مع الزكاة والدخل (ZATCA)') }}
                            </h3>
                            
                            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                                <!-- الرقم التسلسلي للجهاز -->
                                <div>
                                    <x-input-label for="serial_number" :value="__('الرقم التسلسلي للجهاز (EGS Serial Number)')" />
                                    <x-text-input id="serial_number" class="block mt-1 w-full" type="text" name="serial_number" :value="old('serial_number', $company->serial_number)" placeholder="1-ABC|2-XYZ|3-123" />
                                    <x-input-error :messages="$errors->get('serial_number')" class="mt-2" />
                                </div>

                                <!-- الفئة التجارية -->
                                <div>
                                    <x-input-label for="category" :value="__('الفئة التجارية (Category)')" />
                                    <x-text-input id="category" class="block mt-1 w-full" type="text" name="category" :value="old('category', $company->category)" placeholder="Professional Services" />
                                    <x-input-error :messages="$errors->get('category')" class="mt-2" />
                                </div>

                                <!-- رقم السجل التجاري -->
                                <div>
                                    <x-input-label for="crn" :value="__('رقم السجل التجاري (CRN)')" />
                                    <x-text-input id="crn" class="block mt-1 w-full" type="text" name="crn" :value="old('crn', $company->crn)" />
                                    <x-input-error :messages="$errors->get('crn')" class="mt-2" />
                                </div>

                                <!-- اسم الشارع -->
                                <div>
                                    <x-input-label for="street_name" :value="__('اسم الشارع (Street Name)')" />
                                    <x-text-input id="street_name" class="block mt-1 w-full" type="text" name="street_name" :value="old('street_name', $company->street_name)" />
                                    <x-input-error :messages="$errors->get('street_name')" class="mt-2" />
                                </div>

                                <!-- رقم المبنى -->
                                <div>
                                    <x-input-label for="building_number" :value="__('رقم المبنى (Building Number)')" />
                                    <x-text-input id="building_number" class="block mt-1 w-full" type="text" name="building_number" :value="old('building_number', $company->building_number)" maxlength="4" />
                                    <p class="text-xs text-gray-500 mt-1">يجب أن يتكون من 4 أرقام</p>
                                    <x-input-error :messages="$errors->get('building_number')" class="mt-2" />
                                </div>

                                <!-- المدينة -->
                                <div>
                                    <x-input-label for="city" :value="__('المدينة (City)')" />
                                    <x-text-input id="city" class="block mt-1 w-full" type="text" name="city" :value="old('city', $company->city)" />
                                    <x-input-error :messages="$errors->get('city')" class="mt-2" />
                                </div>

                                <!-- الرمز البريدي -->
                                <div>
                                    <x-input-label for="postal_code" :value="__('الرمز البريدي (Postal Code)')" />
                                    <x-text-input id="postal_code" class="block mt-1 w-full" type="text" name="postal_code" :value="old('postal_code', $company->postal_code)" maxlength="5" />
                                    <p class="text-xs text-gray-500 mt-1">يجب أن يتكون من 5 أرقام</p>
                                    <x-input-error :messages="$errors->get('postal_code')" class="mt-2" />
                                </div>
                            </div>
                        </div>

                        <div class="flex items-center justify-end mt-6">
                            <a href="{{ route('companies.show', $company) }}" class="inline-flex items-center p-4 py-2 bg-gray-300 border border-transparent rounded-md font-semibold text-s text-gray-800 uppercase tracking-widest hover:bg-gray-400 focus:bg-gray-400 active:bg-gray-500 focus:outline-none focus:ring-2 focus:ring-gray-300 focus:ring-offset-2 transition ease-in-out duration-150 ml-3">
                                {{ __('إلغاء') }}
                            </a>
                            <x-primary-button>
                                {{ __('تحديث') }}
                            </x-primary-button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</x-app-layout>
