{{-- Basic table view --}}

@extends('layouts.app')
@section('title', "Table \"$table->title\"")

@php
/** @var \App\Models\Table $table */
@endphp


@section('content')

<div class="row justify-content-start px-3">
  <div class="d-flex w-100 align-items-center" id="table-title-container">
    @include('table._header-handle')

    <h1 class="mx-3" id="table-title">{{ $table->title }}</h1>
    @include('table._view-action-buttons')
  </div>
</div>

<div class="row col-md-12 infobox" id="table-infobox">

  {{-- Tab panels wrapper --}}
  <div class="col-md-10 tab-content order-1" id="infobox-tabContent">

    <div class="tab-pane show active container" id="infobox-home" role="tabpanel" aria-labelledby="infobox-home-tab">
      @include('table._panel-metadata')
    </div>

    <div class="tab-pane container" id="infobox-columns" role="tabpanel" aria-labelledby="infobox-columns-tab">
      Column toggles, sort, filtering … coming soon
    </div>

    <div class="tab-pane container" id="infobox-export" role="tabpanel" aria-labelledby="infobox-export-tab">
      @include('table._panel-export')
    </div>

  </div>{{-- End of tab panels wrapper --}}

  {{-- Right column with menu --}}
  <div class="col-md-2 border-left order-md-2 order-0 mb-md-0 mb-2" id="infobox-tab-container">
    <div class="nav flex-md-column flex-row nav-pills pt-1 pb-1" role="tablist"
         aria-label="Tabs for the table info box" id="infobox-tab">

      <a class="nav-link active" data-toggle="pill" role="tab" aria-selected="true"
         id="infobox-home-tab" href="#infobox-home" aria-controls="infobox-home">
        Table Info
      </a>

      <a class="nav-link" data-toggle="pill" role="tab" aria-selected="false"
         id="infobox-columns-tab" href="#infobox-columns" aria-controls="infobox-columns">
        Columns
      </a>

      <a class="nav-link" data-toggle="pill" role="tab" aria-selected="false"
         id="infobox-export-tab" href="#infobox-export" aria-controls="infobox-export">
        Export
      </a>

    </div>
  </div>{{-- end of menu column --}}

</div>{{-- End of row --}}

@if($table->revisions_count != $revisionNum)
  <div class="alert alert-warning alert-important" role="alert" >
    <button type="button"
            class="close"
            data-dismiss="alert"
            aria-hidden="true"
    >&times;</button>

    You're viewing an old table revision ({{$revisionNum}} out of {{ $table->revisions_count }}).
    <a href="{{ $table->viewRoute }}">Go to current</a>
  </div>
@endif

<div class="row justify-content-center mb-2">
  <div class="col-md-12 d-flex">
    <nav class="text-center" aria-label="Pages of the table">
      {{ $rows->links(null, ['ulClass' => 'mb-0']) }}
    </nav>
  </div>
</div>{{-- End of row --}}

<div class="row justify-content-center">
  <div class="col-12">
    @include('table._rows')
  </div>
</div>{{-- End of row --}}

<div class="row justify-content-center mb-2">
  <div class="col-md-12 d-flex">
    <nav class="text-center" aria-label="Pages of the table">
      {{ $rows->links(null, ['ulClass' => 'mb-0']) }}
    </nav>
  </div>
</div>{{-- End of row --}}

@endsection