@extends('panel.layout.base')

@section('title',$title)

@section('script')
    <script>
        $(document).ready(function () {
            @foreach($side as $item)
            @if(isset($noImage[$item['name']]))
            $('[data-no-image="{{ $item['name'] }}"]').attr('data-default-file','/storage/settings/{{ $noImage[$item['name']] }}');
            @endif

            $('[data-no-image="{{ $item['name'] }}"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'noImage[{{ $item['name'] }}]','alert': function(){

                }}
            });

            @endforeach




            @foreach($socialMedia as $item)
            @if(isset($socialMediaImages[$item['name']]))
            $('[data-social-media-image="sm[{{ $item['name'] }}]"]').attr('data-default-file','/storage/settings/{{ $socialMediaImages[$item['name']] }}');
            @endif
            $('[data-social-media-image="sm[{{ $item['name'] }}]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'noImage[{{ $item['name'] }}]','alert': function(){

                }}
            });

            @endforeach

            @for($i=0;$i < 12; $i++)
            $('[name="notification[{{ $i }}][image]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'notification[{{ $i }}][image]','alert': function(){

                    }}
            });
            @endfor

            @for($i=0;$i < 3; $i++)
            $('[name="chat[{{ $i }}][image]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'chat[{{ $i }}][image]','alert': function(){

                    }}
            });
            @endfor


            var settings_general = {!! json_encode($settings_general) !!};
            $.each(settings_general, function(index, item){
                if(item.name == 'default_platform')
                {
                    $('[name="general[platform]"]').val(item.payload);
                }else if(item.name == 'live_chat')
                {
                    $('[name="general_images[live_chat]"]').attr('data-default-file','/storage/settings/' + item.payload);
                }else if(item.name == 'chat_avatar')
                {
                    $('[name="general_images[chat_avatar]"]').attr('data-default-file','/storage/settings/' + item.payload);
                }else{
                    $('[name="general[' + item.name + ']"]').val(item.payload);
                }
            })

            $('[name="general_images[payment]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'chat[{{ $i }}][image]','alert': function(){

                    }}
            });


            $('[name="general_images[live_chat]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'general_images[live_chat]','alert': function(){

                    }}
            });


            $('[name="general_images[chat_avatar]"]').dropify({
                messages: {
                    'default': '{{ __('general.upload.drag-drop') }}',
                    'remove': '{{ __('general.button.remove') }}',
                },
                error: {
                    'fileSize': '{{ __('general.max-size') }}'
                },
                metha: {'input':'general_images[live_chat]','alert': function(){

                    }}
            });
        });
    </script>
@endsection

@section('content')
    <form method="post" enctype="multipart/form-data">
        @csrf
        <div class="card custom-card">
            <div class="card-header">
                <p>{{ $description }}</p>
            </div>
            <div class="card-body">
                @if (\Session::has('success'))
                    <div class="alert alert-success mg-b-0 alert-dismissible fade show" role="alert">
                        <strong>Başarılı</strong><br>{!! \Session::get('success') !!}
                    </div>
                    <br>
                @endif
                <div class="panel panel-primary tabs-style-2">
                    <div class=" tab-menu-heading">
                        <div class="tabs-menu1">
                            <ul class="nav panel-tabs main-nav-line">
                                <li><a href="#tab4" class="nav-link active" data-bs-toggle="tab">Genel Ayarlar</a></li>
                                <li><a href="#tab5" class="nav-link" data-bs-toggle="tab">Görsel Ayarları</a></li>
                                <li><a href="#tab6" class="nav-link" data-bs-toggle="tab">No-Image Ayarları</a></li>
                                <li><a href="#general_images" class="nav-link" data-bs-toggle="tab">Genel Görseller</a></li>
                                <li><a href="#tab7" class="nav-link" data-bs-toggle="tab">Bildirim Görselleri</a></li>
                                <li><a href="#tab8" class="nav-link" data-bs-toggle="tab">Sohbet Görselleri</a></li>
                                <li><a href="#tab9" class="nav-link" data-bs-toggle="tab">Sosyal Medya Görselleri</a></li>
                                <li><a href="#tab10" class="nav-link" data-bs-toggle="tab">Problemli Siparişler</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="panel-body tabs-menu-body main-content-body-right border">
                        <div class="tab-content">
                            <div class="tab-pane active" id="tab4">
                                <h3 class="text-center">Genel Ayarlar</h3>
                                <hr>
                                <div class="row">
                                    <div class="col-12">
                                        <label>Zorunlu Platform</label>
                                        <select name="general[platform]" class="form-control select2">
                                            <option value="empty">Lütfen seçim yapınız.</option>
                                            @foreach(\App\Models\Platform::all()->toArray() as $item)
                                                <option value="{{ $item['id'] }}" {{ $item['id'] == \App\Metha\StaticHelper::defaultPlatform() ? 'selected' : null }}>{{ $item['title'] }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="col-12">
                                        <label>Canlık Destek Durumu</label>
                                        <select name="general[live_chat_status]" class="form-control select2">
                                            <option value="open">Açık</option>
                                            <option value="closed">Kapalı</option>
                                        </select>
                                    </div>
                                    <div class="col-12">
                                        <label>Kullanıcıların Son Aktiflik Süresi</label>
                                        <input type="number" class="form-control" name="general[last_activity]">
                                    </div>
                                    <div class="col-12">
                                        <label>Tedarikçinin Alabileceği Maksimum Sipariş Adeti</label>
                                        <input type="number" class="form-control" name="general[dealer_order_count]">
                                    </div>
                                    <div class="col-12">
                                        <label>Boost Görsel Adeti</label>
                                        <input type="number" class="form-control" name="general[boost_image_count]">
                                    </div>
                                    <div class="col-12">
                                        <label>Express</label>
                                        <input type="color" class="form-control" name="general[boost_express]">
                                    </div>
                                    <div class="col-12">
                                        <label>Süper Express</label>
                                        <input type="color" class="form-control" name="general[boost_super_express]">
                                    </div>
                                    <div class="col-12">
                                        <label>En Üst Referans Kullanıcı Komisyonu</label>
                                        <input type="number" class="form-control" name="general[top_reference_user_commission]">
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane" id="tab5">
                                <h3 class="text-center">Görsel Ayarları</h3>
                                <hr>
                                @for($i=0;$i<5;$i++)
                                    <div class="card-body bg-warning">
                                        <div class="row">
                                            <div class="col-12">
                                                <div class="form-group">
                                                    <label for="facebook">Başlık</label>
                                                    <input type="text" class="form-control" name="size[{{ $i }}][title]" id="title" value="{{ isset($size[$i]['title']) ? $size[$i]['title'] : null }}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="form-group">
                                                    <label for="facebook">Genişlik</label>
                                                    <input type="text" class="form-control" name="size[{{ $i }}][width]" id="title" value="{{ isset($size[$i]['size']['width']) ? $size[$i]['size']['width'] : null }}">
                                                </div>
                                            </div>
                                            <div class="col-6">
                                                <div class="form-group">
                                                    <label for="facebook">Yükseklik</label>
                                                    <input type="text" class="form-control" name="size[{{ $i }}][height]" id="title" value="{{ isset($size[$i]['size']['height']) ? $size[$i]['size']['height'] : null }}">
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br>
                                @endfor
                            </div>
                            <div class="tab-pane" id="general_images">
                                <h3 class="text-center">Genel Görseller</h3>
                                <hr>
                                <div class="row">
                                    <div class="col-4" style="margin-bottom: 25px">
                                        <div class="card-body bg-warning">
                                            <div class="form-group">
                                                <label><b>Ödeme Yöntemi</b> için görsel seç.</label>
                                                <input type="file" data-notification-image="general_images[payment]" name="general_images[payment]">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4" style="margin-bottom: 25px">
                                        <div class="card-body bg-warning">
                                            <div class="form-group">
                                                <label><b>Canlı Destek</b> karşılama mesajı için "logo" seç.</label>
                                                <input type="file" data-notification-image="general_images[live_chat]" name="general_images[live_chat]">
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-4" style="margin-bottom: 25px">
                                        <div class="card-body bg-warning">
                                            <div class="form-group">
                                                <label><b>Canlı Destek</b> için "avatar" seç.</label>
                                                <input type="file" data-notification-image="general_images[chat_avatar]" name="general_images[chat_avatar]">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane" id="tab6">
                                <div class="row">
                                    @foreach($side  as $item)
                                        <div class="col-4" style="margin-bottom: 25px">
                                            <div class="card-body bg-warning">
                                                <div class="form-group">
                                                    <label><b>{{ $item['title'] }}</b> için görsel seç.</label>
                                                    <input type="file" data-no-image="{{ $item['name'] }}"></input>
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="tab-pane" id="tab7">
                                <div class="row">
                                    @for($i=0;$i < 12; $i++)
                                        <div class="col-4" style="margin-bottom: 25px">
                                            <div class="card-body bg-warning">
                                                <div class="form-group">
                                                    <label>Başlık</label>
                                                    <input type="text" class="form-control" name="notification[{{ $i }}][title]">
                                                </div>
                                                <div class="form-group">
                                                    <label>Görsel seç.</label>
                                                    <input type="file" data-notification-image="notification[{{ $i }}][image]" name="notification[{{ $i }}][image]">
                                                </div>
                                            </div>
                                        </div>
                                    @endfor
                                </div>
                            </div>
                            <div class="tab-pane" id="tab8">
                                <div class="row">
                                    @for($i=0;$i < 3; $i++)
                                        <div class="col-4" style="margin-bottom: 25px">
                                            <div class="card-body bg-warning">
                                                <div class="form-group">
                                                    <label>Başlık</label>
                                                    <input type="text" class="form-control" name="chat[{{ $i }}][title]">
                                                </div>
                                                <div class="form-group">
                                                    <label>Görsel seç.</label>
                                                    <input type="file" data-notification-image="chat[{{ $i }}][image]" name="chat[{{ $i }}][image]">
                                                </div>
                                            </div>
                                        </div>
                                    @endfor
                                </div>
                            </div>
                            <div class="tab-pane" id="tab9">
                                <div class="alert alert-danger mg-b-0 alert-dismissible fade show" role="alert">
                                    <strong>Uyarı</strong><br>YÜklenecek görsellerin boyutu <b>64x64</b> olmak zorundadır.
                                </div>
                                <br>
                                <div class="row">
                                    @foreach($socialMedia as $item)
                                        <div class="col-4" style="margin-bottom: 25px">
                                            <div class="card-body bg-warning">
                                                <div class="form-group">
                                                    <label><b>{{ $item['title'] }}</b> için görsel seç.</label>
                                                    <input type="file" data-social-media-image="sm[{{ $item['name'] }}]" name="sm[{{ $item['name'] }}][image]">
                                                </div>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                            <div class="tab-pane active" id="tab10">
                                <h3 class="text-center">Problemli Siparişler</h3>
                                <hr>
                                <div class="row">
                                    @foreach(\App\Models\Game::all()->toArray() as $item)
                                        <div class="col-2">
                                            <label>{{ $item['title'] }} Problem Süresi</label>
                                            <input type="text" class="form-control" name="problem_order[{{ $item['slug'] }}]">
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card-footer p-3">
                <button type="submit" class="btn btn-primary btn-sm"><i class="fa fa-save"></i> Kaydet</button>
            </div>
        </div>
    </form>
@endsection