@extends('layouts.app')
@section('title', __('Testimonial'))
@section('page-title', $item->exists ? __('Edit testimonial') : __('New testimonial'))

@section('content')
@include('super-admin._nav')

<div x-data="{ tab: '{{ $locales[0] }}' }">
    <a href="{{ route('super-admin.testimonials.index') }}" class="text-sm text-brand-600 hover:underline inline-flex items-center gap-1 mb-4">
        <x-icon name="arrow-right" class="w-4 h-4 rotate-180 rtl:rotate-0"/> {{ __('Back') }}
    </a>

    <form method="POST" action="{{ $item->exists ? route('super-admin.testimonials.update', $item) : route('super-admin.testimonials.store') }}"
          enctype="multipart/form-data" class="space-y-6">
        @csrf
        @if($item->exists) @method('PATCH') @endif

        <div class="card card-pad grid sm:grid-cols-3 gap-4">
            <div>
                <label class="form-label">{{ __('Customer name') }}</label>
                <input type="text" name="name" required class="form-input" value="{{ old('name', $item->name) }}">
            </div>
            <div>
                <label class="form-label">{{ __('Company') }}</label>
                <input type="text" name="company" class="form-input" value="{{ old('company', $item->company) }}">
            </div>
            <div>
                <label class="form-label">{{ __('Rating') }}</label>
                <select name="rating" class="form-select">
                    @for($i=5;$i>=1;$i--)
                        <option value="{{ $i }}" @selected(old('rating', $item->rating ?? 5) == $i)>{{ str_repeat('★', $i) }}{{ str_repeat('☆', 5-$i) }}</option>
                    @endfor
                </select>
            </div>
            <div>
                <label class="form-label">{{ __('Avatar') }}</label>
                @if($item->avatar)
                    <div class="flex items-center gap-3 mb-2">
                        <img src="{{ asset('storage/'.$item->avatar) }}" alt="" class="w-12 h-12 rounded-full object-cover">
                        <span class="text-xs text-slate-500">{{ __('Current') }}</span>
                    </div>
                @endif
                <input type="file" name="avatar" accept="image/*" class="form-input">
            </div>
            <div>
                <label class="form-label">{{ __('Sort order') }}</label>
                <input type="number" name="sort" class="form-input" value="{{ old('sort', $item->sort) }}">
            </div>
            <label class="flex items-center gap-2 mt-7">
                <input type="hidden" name="is_active" value="0">
                <input type="checkbox" name="is_active" value="1" class="w-4 h-4 accent-brand-600" @checked(old('is_active', $item->is_active ?? true))>
                <span class="text-sm">{{ __('Active') }}</span>
            </label>
        </div>

        <div class="card overflow-hidden">
            <div class="flex border-b border-slate-200/70 dark:border-slate-800 overflow-x-auto">
                @foreach($locales as $loc)
                    <button type="button" @click="tab='{{ $loc }}'"
                            :class="tab==='{{ $loc }}' ? 'text-brand-700 border-brand-500' : 'text-slate-500 border-transparent'"
                            class="px-5 py-3 text-sm font-semibold uppercase tracking-wider border-b-2 transition whitespace-nowrap">
                        {{ $loc }}
                    </button>
                @endforeach
            </div>
            @foreach($locales as $loc)
                <div x-show="tab==='{{ $loc }}'" x-cloak class="p-6 space-y-4" dir="{{ $loc==='ar' ? 'rtl' : 'ltr' }}">
                    <div>
                        <label class="form-label">{{ __('Role / job title') }} ({{ strtoupper($loc) }})</label>
                        <input type="text" name="role_{{ $loc }}" class="form-input"
                               value="{{ old("role_$loc", ($item->role ?? [])[$loc] ?? '') }}">
                    </div>
                    <div>
                        <label class="form-label">{{ __('Quote') }} ({{ strtoupper($loc) }})</label>
                        <textarea name="content_{{ $loc }}" rows="5" class="form-input">{{ old("content_$loc", ($item->content ?? [])[$loc] ?? '') }}</textarea>
                    </div>
                </div>
            @endforeach
        </div>

        <div class="flex justify-end">
            <button class="btn-primary"><x-icon name="check" class="w-4 h-4"/> {{ __('Save') }}</button>
        </div>
    </form>
</div>
@endsection