@extends("admin.layouts.app")
@section("styles")
    <link href="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/jquery-nestable/jquery.nestable.css"
          rel="stylesheet" type="text/css"/>

@endsection
@section("content")
    <div class="row">
        <div class="col-md-12">
            <div class="row">
                <div class="portlet light bordered">
                    <div class="portlet-title">
                <div class="tab-content">
                    {{logger([url()->previous(),str_contains(url()->previous(), 'accessory-discount-edit')])}}
                    <ul class="nav nav-tabs">

                        <li class="{{request()->get('type')!=='accessory'&&!str_contains(url()->previous(), 'accessory-discount-edit')|request()->get('type')=='general'?'active':''}}" data-tab="general"><a data-toggle="tab" href="#general">Item Price Type </a></li>
                        <li class="{{request()->get('type')=='accessory'|str_contains(url()->previous(), 'accessory-discount-edit')?'active':''}}" data-tab="accessory"><a data-toggle="tab" href="#accessory">Accessory Discount </a></li>
                    </ul>
                    <div id="general" class="tab-pane fade in {{request()->get('type')!=='accessory'&&!str_contains(url()->previous(), 'accessory-discount-edit')|request()->get('type')=='general'?'active':''}}">
                        <div class="col-md-8">
                            <div class="portlet light bordered">
                                <div class="portlet-title">
                                    <div class="caption">
                                        <i class="icon-list font-green"></i>
                                        <span class="caption-subject font-green bold uppercase">@lang("constants.price_types")</span>
                                    </div>
                                    <div class="actions">
                                        <a href="{{route("admin.price-types.create")}}#general"  class="btn btn-primary">
                                            <i class="fa fa-plus"></i> Create </a>
                                    </div>
                                </div>

                                <div class="portlet-body">
                                    <div class="table-scrollable">
                                        <table class="table table-hover">
                                            <thead>
                                            <tr>
                                                <th> @lang("constants.title") </th>
                                                <th class="text-center"> @lang("constants.is_active") </th>
                                                <th> @lang("constants.options") </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @forelse($price_types as $price_type)
                                                <tr>
                                                    <td>
                                                        {{$price_type->name}}
                                                    </td>

                                                    <td class="text-center">
                                                        <a href="#" data-type="is_active" data-class="SpecCategory"
                                                           data-id="{{$price_type->id}}" id="{{$price_type->id}}"
                                                           class="attribute is-active">@if ($price_type->is_active)
                                                                <i class="fa fa-check text-success fs15 pr5"></i>
                                                            @else
                                                                <i class="fa fa-times text-danger fs15 pr5"></i>
                                                            @endif</a>
                                                    </td>

                                                    <td>
                                                        {{Form::open(['route'=>["admin.price-types.destroy",$price_type->id],'method'=>"delete"])}}
                                                        <a href="{{route("admin.price-types.edit",$price_type->id)}}"
                                                           class="btn btn-outline btn-sm purple" title="Edit"><i
                                                                class="fa fa-edit"></i> @lang("constants.edit")</a>
                                                        <button onclick="return confirm('are you sure?')" type="submit"
                                                                class="btn btn-outline btn-sm red" title="Delete"><i
                                                                class="fa fa-trash"></i> @lang("constants.delete")</button>
                                                        {!! Form::close() !!}
                                                    </td>
                                                </tr>
                                            @empty
                                            @endforelse
                                            </tbody>
                                            <tfoot>
                                            <tr>
                                                <td colspan="8">
                                                    {!! $price_types->links()!!}
                                                </td>
                                            </tr>
                                            </tfoot>
                                        </table>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <div class="col-md-4">
                            <div class="portlet light bordered">
                                <div class="portlet-title">
                                    <div class="caption">
                                        <i class="icon-list font-green"></i>
                                        <span
                                            class="caption-subject font-green bold uppercase">@lang("constants.price_types_order")</span>
                                    </div>
                                </div>
                                <div class="portlet-body">
                                    {{ Form::open(['route' => "admin.price-types.order",'class'=>"form-horizontal"]) }}
                                    {{ Form::hidden('reorder',"",array('id'=>'reorder')) }}
                                    <div class="dd" id="list">
                                        <ol class="dd-list">
                                            @foreach ($items as $item)
                                                <li data-id="{{$item['id']}}" class="dd-item dd3-item">
                                                    <div class="dd-handle dd3-handle"></div>
                                                    <div class="dd3-content">{{$item['title']}}</div>
                                                    @if(count($item['childs']) > 0)
                                                        <ol class="dd-list" style="">
                                                            @foreach ($item['childs'] as $item2)
                                                                <li data-id="{{$item2['id']}}" class="dd-item dd3-item">
                                                                    <div class="dd-handle dd3-handle"></div>
                                                                    <div class="dd3-content">{{$item2['title']}}</div>
                                                                    @if(count($item2['childs']) > 0)
                                                                        <ol class="dd-list" style="">
                                                                            @foreach($item2['childs'] as $item3)
                                                                                <li data-id="{{$item3['id']}}" class="dd-item dd3-item">
                                                                                    <div class="dd-handle dd3-handle"></div>
                                                                                    <div class="dd3-content">{{ $item3['title'] }}</div>
                                                                                    @if(count($item3['childs']) > 0)
                                                                                        <ol class="dd-list" style="">
                                                                                            @foreach($item3['childs'] as $item4)
                                                                                                <li data-id="{{$item4['id']}}"
                                                                                                    class="dd-item dd3-item">
                                                                                                    <div
                                                                                                        class="dd-handle dd3-handle"></div>
                                                                                                    <div
                                                                                                        class="dd3-content">{{ $item4['title'] }}</div>
                                                                                                </li>
                                                                                            @endforeach
                                                                                        </ol>
                                                                                    @endif
                                                                                </li>
                                                                            @endforeach
                                                                        </ol>
                                                                    @endif
                                                                </li>
                                                            @endforeach
                                                        </ol>
                                                    @endif
                                                </li>
                                            @endforeach
                                        </ol>
                                    </div>
                                </div>
                                <div class="panel-footer">
                                    {{ Form::submit('Update',array("class"=>"btn btn-primary btn-sm")) }}
                                </div>
                                {!! Form::close()!!}

                            </div>
                        </div>
                    </div>
                    <div id="accessory" class="tab-pane fade {{request()->get('type')=='accessory'|str_contains(url()->previous(), 'accessory-discount-edit')?' in active':''}}">
                        <div class="col-md-12">
                            <div class="portlet light bordered">
                                <div class="portlet-title">
                                    <div class="caption">
                                        <i class="icon-list font-green"></i>
                                        <span class="caption-subject font-green bold uppercase">@lang("constants.price_types")</span>
                                    </div>
                                    <div class="actions">
                                        <a href="{{route("admin.price-types.create").'#accessory'}}" class="btn btn-primary">
                                            <i class="fa fa-plus"></i> Create </a>
                                    </div>
                                </div>

                                <div class="portlet-body">
                                    <div class="table-scrollable">
                                        <table class="table table-hover">
                                            <thead>
                                            <tr>
                                                <th> @lang("constants.title") </th>
                                                <th> @lang("Percentage") </th>
                                                <th> @lang("التصنيف") </th>
                                                <th> @lang("متوافق مع")</th>
                                                <th> @lang("باستثناء براند") </th>
                                                <th> @lang("من تاريخ") </th>
                                                <th> @lang("حتى تاريخ") </th>
                                                <th class="text-center"> @lang("constants.is_active") </th>
                                                <th> @lang("constants.options") </th>
                                            </tr>
                                            </thead>
                                            <tbody>
                                            @forelse($accessory_discount as $price_type)
                                                <tr>
                                                    <td>
                                                        {{$price_type->name}}
                                                    </td>
                                                    <td>
                                                        {{$price_type->percentage .'  % '}}
                                                    </td>
                                                    <td>
                                                        {{optional(\App\Models\AccessoryCategory::query()->where('id',$price_type->accessory_category_id)->first())->title??'-'}}

                                                    </td>

                                                    <td>
                                                        {{optional(\App\Models\Category::query()->where('id',$price_type->category_id)->first())->title??'-'}}

                                                    </td>
                                                    <td>
                                                        {{optional(\App\Models\Brand::query()->where('id',$price_type->brand_id)->first())->name??'-'}}
                                                    </td>
                                                    <td>
                                                        {{$price_type->from ? \Illuminate\Support\Carbon::parse($price_type->from)->format('Y-m-d') : '-'}}
                                                    </td>
                                                    <td>
                                                        {{$price_type->to ? \Illuminate\Support\Carbon::parse($price_type->to)->format('Y-m-d') : '-'}}
                                                    </td>

                                                    <td class="text-center">
                                                        <a href="#" data-type="is_active" data-class="AccessoryPriceType"
                                                           data-id="{{$price_type->id}}" id="{{$price_type->id}}"
                                                           class="attribute is-active">@if ($price_type->is_active)
                                                                <i class="fa fa-check text-success fs15 pr5"></i>
                                                            @else
                                                                <i class="fa fa-times text-danger fs15 pr5"></i>
                                                            @endif</a>
                                                    </td>

                                                    <td>
                                                        {{Form::open(['route'=>["admin.price-types.accessory-discount-delete",'id'=>$price_type->id],'method'=>"post"])}}
                                                        <a href="{{ route('admin.price-types.accessory-discount-edit', $price_type->id) }}"
                                                           class="btn btn-outline btn-sm purple" title="Edit"><i
                                                                class="fa fa-edit"></i> @lang("constants.edit")</a>
                                                        <button onclick="return confirm('are you sure?')" type="submit"
                                                                class="btn btn-outline btn-sm red" title="Delete"><i
                                                                class="fa fa-trash"></i> @lang("constants.delete")</button>
                                                        {!! Form::close() !!}
                                                    </td>
                                                </tr>
                                            @empty
                                            @endforelse
                                            </tbody>
                                            <tfoot>
                                            <tr>
                                                <td colspan="8">
                                                    {!! $price_types->links()!!}
                                                </td>
                                            </tr>
                                            </tfoot>
                                        </table>
                                    </div>
                                </div>
                            </div>

                        </div>


                    </div>
                </div>
            </div>


        </div>
@endsection
@section("scripts")
    <script src="https://cdn.ihouse.ps/admin_assets/assets/global/plugins/jquery-nestable/jquery.nestable.js"
            type="text/javascript"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#list').nestable({maxDepth: 2});
            update_out('#list', "#reorder");

            $('#list').on('change', function () {
                var out = $('#list').nestable('serialize');
                $('#reorder').val(JSON.stringify(out));
            });


        });

        function update_out(selector, sel2) {
            var out = $(selector).nestable('serialize');
            $(sel2).val(JSON.stringify(out));
        }

        function initTabHash() {
            //init tabs hash
            let hash = window.location.hash;

            if (hash.length) {
                let hasURLParameters = hash.indexOf('?');//-1 if not exist
                let indexOfHash = hash.indexOf('#');

                if (hasURLParameters && hasURLParameters > indexOfHash) {
                    hash = _.split(hash, '?')[0];
                }

                let $element = $('ul.nav a[href="' + hash + '"]');

                if ($element.length > 0) {
                    $element.tab('show');
                    let scroll = $element.offset().top - 150;
                    $("html, body").animate({scrollTop: scroll});

                }
            }

            $('.nav-tabs a').on("click", function (e) {
                $(this).tab('show');
                changeHashWithoutScrolling(this.hash);
                appendHashToLinks();
            });
        }

        function changeHashWithoutScrolling(hash) {
            var id;
            var elem;

            id = hash.replace(/^.*#/, '');

            if (id) {
                elem = document.getElementById(id);

                if (elem) {
                    elem.id = id + '-tmp';
                    window.location.hash = hash;
                    elem.id = id;
                }
            }
        }

        function appendHashToLinks() {
            $('.pagination').each(function (element) {
                var hash = window.location.hash;
                var links = $(this).find('a');

                links.each(function (link) {
                    var href = $(this).attr('href');
                    href = href.replace('#general', '');
                    href = href.replace('#accessory', '');
                    $(this).attr('href', href + hash);
                });
            });
        }

        $(function () {
            // initTabHash();
            appendHashToLinks();
        })
        $(document).ready(function() {
            function updateUrl(tabName) {
                console.log(tabName)
                var baseUrl = window.location.href.split('?')[0];
                var newUrl = baseUrl + '?type=' + tabName;
                window.history.pushState({path:newUrl},'',newUrl);
            }

            // Event listener for tab clicks
            $('.nav-tabs li').click(function() {
                var tabName = $(this).data('tab');
                console.log(tabName)
                updateUrl(tabName);
            });
        });
    </script>
    @include("admin.layouts.update_attribute")
@endsection