@extends('webapp.layouts.app')

@section('content')
    <!-- Main Content -->
    <div class="page-wrapper">
        <div class="container-fluid">

            <!-- Title -->
            <div class="row heading-bg">
                <div class="col-lg-3 col-md-4 col-sm-4 col-xs-12">
                    <h5 class="txt-dark">Navigation level 1</h5>
                </div>

                <!-- Breadcrumb -->
                <div class="col-lg-9 col-sm-8 col-md-8 col-xs-12">
                    <ol class="breadcrumb">
                        <li><a href="{{asset('home')}}">Dashboard</a></li>
                        <li><a href="{{asset('/menu_header')}}"><span>Navigation level 1</span></a></li>
                        <li class="active"><span>Reader</span></li>
                    </ol>
                </div>
                <!-- /Breadcrumb -->

            </div>
            <!-- /Title -->
            <div class="row">
                <div class="col-sm-12">
                    @if (session('message'))
                        <div class="alert alert-success alert-dismissable">
                            <button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button> {{ session('message') }}
                        </div>
                    @endif
                    <div class="panel panel-default card-view">
                        <div class="panel-heading">
                            <div class="pull-left">
                                <h6 class="panel-title txt-dark">Reader</h6>
                            </div>
                            <div class="pull-right">
                                <a href="{{asset('/menu_header/create')}}" class="pull-left inline-block mr-15">
                                    <i class="ti-plus"></i>
                                </a>
                            </div>
                            <div class="clearfix"></div>
                        </div>
                        <div class="panel-wrapper collapse in">
                            <div class="panel-body">
                                <button class="btn btn-default" onclick="window.location.reload();">Refresh Sorting</button>
                                <div class="table-wrap">
                                    <div class="table-responsive">
                                        <table id="edit_datable_menu_header" class="table table-hover display  pb-30" >
                                            <thead>
                                            <tr>
                                                <th width="10%">#Priority</th>
                                                <th >name</th>
                                                <th >link to</th>
                                                <th >level 2</th>
                                                <th >dropdown style</th>
                                                <th >direction ( for style A )</th>
                                                <th>Language</th>
                                                <th>Action</th>
                                                <th>item</th>
                                            </tr>
                                            </thead>
                                            <tfoot>
                                            <tr>
                                                <th width="10%">#Priority</th>
                                                <th >name</th>
                                                <th >link to</th>
                                                <th >level 2</th>
                                                <th >dropdown style</th>
                                                <th >direction ( for style A )</th>
                                                <th>Language</th>
                                                <th>Action</th>
                                                <th>item</th>
                                            </tr>
                                            </tfoot>
                                            <tbody>
                                            @php($header = $datas['header'])
                                            @foreach ($header as $key=> $record)
                                                <tr>
                                                    <td data-value="{{$record->id}}" class="my-button">{{$record->sort}}</td>
                                                    <td class="edit-disabled">{{$record->name}}</td>
                                                    <td class="edit-disabled">
                                                        <a href="{{$record->url_path}}" target="_blank" data-toggle="tooltip" class="mr-15" data-original-title="Visit this url">
                                                            <i class="fa fa-edge text-info"></i>
                                                        </a>
                                                        <a href="{{$record->url_path}}" target="_blank">
                                                            {{$record->url_path}}
                                                        </a>
                                                    </td>
                                                    <td class="edit-disabled">
                                                        @if($record->has_dropdown == true)
                                                            <span class="label label-warning">ON</span>
                                                        @else
                                                            <span class="label label-danger">OFF</span>
                                                        @endif

                                                    </td>
                                                    <td class="edit-disabled">
                                                        @if($record->has_dropdown == true && $record->advanced_dropdown == true )
                                                            <span class="label label-warning">style B</span>
                                                        @elseif($record->has_dropdown == true && $record->advanced_dropdown == false )
                                                            <span class="label label-info">style A</span>
                                                        @else
                                                            <span class="label label-danger">N/A</span>

                                                        @endif

                                                    </td>
                                                    <td class="edit-disabled">
                                                        @if($record->has_dropdown == true && $record->advanced_dropdown == false && $record->simple_dropdown_css === 'dropdown left' )
                                                            <span class="label label-success">right</span>
                                                        @elseif($record->has_dropdown == true && $record->advanced_dropdown == false && $record->simple_dropdown_css === 'dropdown right'  )
                                                            <span class="label label-info">left</span>
                                                        @else
                                                            <span class="label label-danger">N/A</span>

                                                        @endif

                                                    </td>
                                                    <td class="edit-disabled">
                                                        @switch($record->lang)
                                                            @case('en')
                                                            English
                                                            @break

                                                            @case('zh')
                                                            Chinese

                                                            @break

                                                            @case('vi')
                                                            Vietnamese
                                                            @break

                                                            @default
                                                        @endswitch
                                                    </td>
                                                    <td class="text-nowrap edit-disabled">
                                                        <a href="{{asset('/menu_header/'.$record->id.'/edit')}}" class="mr-25" data-toggle="tooltip" data-original-title="Edit">
                                                            <i class="fa fa-pencil text-inverse m-r-10"></i>
                                                        </a>

                                                        <a href="javascript:void(0)" class="text-inverse sa-warning-nav" title="" data-value="{{'delete-item-'.$record->id}}" data-toggle="tooltip" data-original-title="Delete"><i class="zmdi zmdi-delete"></i></a>

                                                        <form id="{{'delete-item-'.$record->id}}" action="{{route('menu_header.destroy',$record->id)}}" method="post" style="display: none;">
                                                            @method('DELETE')
                                                            @csrf
                                                        </form>
                                                    </td>
                                                    <td class="edit-disabled">{{$record->id}}</td>
                                                </tr>
                                            @endforeach


                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
     @include('webapp.sections.footer')


    </div>
    <!-- /Main Content -->
@endsection