@extends('admin.layouts.master')
@section('css')
    @include('admin.helper.formscss')
@endsection

@include('admin.helper.tittle', ['title' => $imagesOnly ?? false ? 'تعديل صور اللعبة' : 'تعديل لعبه او شركة '])



@section('content')
    <div id='pageid'>
        <div>
            <div class="row">
                <div class="col-md-12 col-xl-12 col-xs-12 col-sm-12">
                    <form id='edit-game' enctype="multipart/form-data">
                        @csrf
                        <input required class="form-control" name="id" value="{{ $game->id }}" type="hidden">
                        <div class="card">
                            <div class="card-body">
                                <div class="row row-sm">
                                @unless($imagesOnly ?? false)
                                    <div class="col-lg-4 mt-3">
                                        <label class="form-label">الإسم <span class="text-danger">*</span></label>
                                        <input required class="form-control" name="name" value="{{ $game->name }}"
                                            type="text" placeholder="أدخل اسم اللعبة">
                                    </div>
                                    <div class="col-lg-4 mt-3">
                                        <label class="form-label">الوحدة</label>
                                        <input class="form-control" name="unit" value="{{ $game->unit }}" type="text"
                                            placeholder="مثال: UC، جواهر، ماسات" maxlength="100">
                                        <small class="text-muted">سيتم إلحاق الوحدة بأسماء المنتجات تلقائياً</small>
                                    </div>
                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> الاستعلام</p>
                                        <select name="gamer_query" class="form-control" required>
                                            <option {{ $game->gamer_query == 1 ? 'selected' : '' }} value="1"> استعلام
                                            </option>
                                            <option {{ $game->gamer_query == 0 ? 'selected' : '' }} value="0"> بدون
                                                استعلام</option>
                                        </select>
                                    </div>

                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> يتطلب توثيق الهوية </p>
                                        <select name="requires_verified" class="form-control">
                                            <option value="0" {{ !$game->requires_verified ? 'selected' : '' }}>لا</option>
                                            <option value="1" {{ $game->requires_verified ? 'selected' : '' }}>نعم</option>
                                        </select>
                                    </div>

                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> العملة ؟ </p>
                                        <select name="currency_id" class="form-control" required>
                                            <option value=""> اختر عملة </option>
                                            @foreach (\App\Models\Currency::all() as $c)
                                                <option {{ $game->currency_id == $c->id ? 'selected' : '' }}
                                                    value="{{ $c->id }}"> {{ $c->name }} </option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> القسم </p>
                                        <select name="category_id" class="form-control" required>
                                            @foreach ($categories as $cat)
                                                <option value="{{ $cat->id }}"
                                                    {{ $cat->id == $game->category_id ? 'selected' : '' }}>
                                                    {{ $cat->name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> اللعبة الأساسية </p>
                                        <select name="parent_id" class="form-control">
                                            <option value="">لا يوجد (لعبة أساسية)</option>
                                            @foreach ($parentGames as $parentGame)
                                                <option value="{{ $parentGame->id }}"
                                                    {{ $parentGame->id == $game->parent_id ? 'selected' : '' }}>
                                                    {{ $parentGame->name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="col-lg-4 mt-2">
                                        <p class="mt-0"> السكريبت </p>
                                        <select name="script_id" class="form-control">
                                            <option value="">لا يوجد</option>
                                            @foreach ($scripts as $script)
                                                <option value="{{ $script->id }}"
                                                    {{ $script->id == $game->script_id ? 'selected' : '' }}>
                                                    {{ $script->name }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>

                                    <div class="col-lg-4 mt-2">
                                        <label class="form-label"> ترتيب اللعبة </label>
                                        <input required class="form-control" name="sort" min="1" type="number"
                                            value="{{ $game->sort }}">
                                    </div>
                                    @endunless
                                    @if(can_admin('games_images_edit'))
                                    <div class="col-lg-6 mt-3">
                                        <label class="form-label"> صورة اللعبه </label>
                                        <input class="form-control" name="image" type="file" accept="image/*">
                                        <small class="text-muted">الصيغ المدعومة: JPG, PNG, GIF, SVG (الحد الأقصى:
                                            2MB)</small>
                                        @if ($game->image)
                                            <div class="mt-2">
                                                <img src="{{ url('/images/games/' . $game->image) }}"
                                                    alt="صورة اللعبة الحالية" class="img-thumbnail"
                                                    style="max-width: 100px; max-height: 100px;">
                                                <small class="d-block text-muted">الصورة الحالية</small>
                                            </div>
                                        @endif
                                    </div>
                                    <div class="col-lg-6 mt-3">
                                        <label class="form-label"> صورة المنتج </label>
                                        <input class="form-control" name="product_image" type="file" accept="image/*">
                                        <small class="text-muted">الصيغ المدعومة: JPG, PNG, GIF, SVG (الحد الأقصى:
                                            2MB)</small>
                                        @if ($game->product_image)
                                            <div class="mt-2">
                                                <img src="{{ url('/images/product_images/' . $game->product_image) }}"
                                                    alt="صورة المنتج الحالية" class="img-thumbnail"
                                                    style="max-width: 100px; max-height: 100px;">
                                                <small class="d-block text-muted">الصورة الحالية</small>
                                            </div>
                                        @endif
                                    </div>
                                    @endif


                                    @unless($imagesOnly ?? false)
                                    <div class="col-lg-12 mt-3">
                                        <label class="form-label"> وصف للمستخدم </label>
                                        <textarea id="elm1" name="description">  {{ $game->description }} </textarea>
                                    </div>
                                    <div class="col-lg-12 mt-3 editor">
                                        <label class="form-label"> وصف للادمنز </label>
                                        <textarea id="elm2" name="admin_description">  {{ $game->admin_description }} </textarea>
                                    </div>
                                    @endunless


                                </div>
                                <div class="text-center">
                                    <button type="submit" class="col-5 btn btn-primary mt-3 mb-0">
                                        حفظ</button>
                                    <a href="{{ route('admin.games.index') }}"
                                        class="col-5 btn btn-secondary mt-3 mb-0">رجوع</a>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <!--<script src="{{ vasset('assets/helper/formeditor.js') }}"></script>-->
    @include('vue')
    @include('admin.helper.formscripts')

    @php $imagesOnly = $imagesOnly ?? false; @endphp

    <script>
        $(function() {

            $('#edit-game').on('submit', function(e) {
                e.preventDefault();

                @if(!($imagesOnly ?? false))
                // Basic client-side validation
                const name = $('input[name="name"]').val().trim();
                const categoryId = $('select[name="category_id"]').val();
                const currencyId = $('select[name="currency_id"]').val();

                if (!name) {
                    swal({ title: 'يرجى إدخال اسم اللعبة', type: 'warning', confirmButtonText: 'موافق' });
                    return;
                }
                if (!categoryId) {
                    swal({ title: 'يرجى اختيار القسم', type: 'warning', confirmButtonText: 'موافق' });
                    return;
                }
                if (!currencyId) {
                    swal({ title: 'يرجى اختيار العملة', type: 'warning', confirmButtonText: 'موافق' });
                    return;
                }
                @endif

                // Check file size if image is uploaded (2MB max)
                const imageFile = $('input[name="image"]')[0] ? $('input[name="image"]')[0].files[0] : null;
                if (imageFile && imageFile.size > 2 * 1024 * 1024) {
                    swal({ title: 'حجم الصورة يجب أن يكون أقل من 2 ميجابايت', type: 'warning', confirmButtonText: 'موافق' });
                    return;
                }

                const submitBtn = $(this).find('button[type="submit"]');
                const originalText = submitBtn.text();
                submitBtn.prop('disabled', true).text('جاري التحديث...');

                let formData = new FormData(document.getElementById('edit-game'));

                @if(!($imagesOnly ?? false))
                const content = tinymce.get('elm1').getContent();
                const contenttwo = tinymce.get('elm2').getContent();
                formData.append('description', content);
                formData.append('admin_description', contenttwo);
                @endif

                const updateUrl = @if($imagesOnly ?? false) '{{ route('admin.games.update-images') }}' @else '{{ route('admin.games.update') }}' @endif;

                axios.post(updateUrl, formData)
                    .then(response => {
                        if (response.data.err == false || response.data.success == true) {
                            swal({
                                title: response.data.msg || 'تم التحديث بنجاح',
                                type: 'success',
                                confirmButtonText: 'موافق',
                            }).then(() => {
                                window.location.href = '{{ route('admin.games.index') }}';
                            });
                        } else {
                            swal({ title: response.data.msg || 'حدث خطأ', type: 'error', confirmButtonText: 'موافق' });
                        }
                    })
                    .catch(error => {
                        console.error('Error:', error);
                        let errorMessage = 'حدث خطأ غير متوقع';
                        if (error.response && error.response.data && error.response.data.errors) {
                            errorMessage = Object.values(error.response.data.errors).flat().join('\n');
                        } else if (error.response && error.response.data && error.response.data.message) {
                            errorMessage = error.response.data.message;
                        }
                        swal({ title: errorMessage, type: 'error', confirmButtonText: 'موافق' });
                    })
                    .finally(() => {
                        submitBtn.prop('disabled', false).text(originalText);
                    });
            });

        });
        $(function() {
            $('.select2').select2()
        });
    </script>
@endsection