@model PagedList.IPagedList<PantheonApi.Data.DbModels.Pantheon.tPA_SyncSegmentTable>
@using PagedList.Mvc;
@using PantheonApi.Contracts.DataContracts.Pantheon;
@{
    ViewBag.Title = "Sync status";
    Layout = null;
    var defaultTables = ViewData["defaultTables"] as List<TableSyncConfiguration>;
}

<div id="SyncSegmentList">
    <div class="row">
        <div class="col-md-6">
            <div class="panel-heading">
                <div class="panel-title">
                    @if (Model.Count() > 0)
                    {
                        <h4 class="text-primary">Segment tables for schedule: @ViewBag.ScheduleId</h4>
                    }
                    else
                    {
                        <h4 class="text-primary">No tables for schedule @ViewBag.ScheduleId</h4>
                    }
                </div>
            </div>

            @if (TempData["SegmentTable-Deleted"] != null)
            {
                <div class="alert alert-danger no-border">
                    <button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button>
                    <span class="text-semibold">@TempData["SegmentTable-Deleted"]</span>
                </div>
            }

            <div class="panel-body">
                <div class="table-responsive">
                    <table class="table table-hover table-bordered table-striped">
                        <thead class="bg-primary">
                            <tr>
                                <th>
                                    Table ID
                                </th>
                                <th>
                                    Table name
                                </th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var item in Model)
                            {
                                <tr>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.anTableId)
                                    </td>
                                    <td>
                                        @Html.DisplayFor(modelItem => item.acTableName)
                                    </td>
                                    <td class="text-center">
                                        <a data-ajax-begin="startLoading('SyncSegmentList')"
                                           data-ajax="true"
                                           data-ajax-mode="replace"
                                           data-ajax-update="#SyncSegmentList"
                                           href="/SyncSchedules/DeleteSegmentTable?id=@item.anQId"
                                           class="text-danger"
                                           title="Remove"><i class="glyphicon glyphicon-remove"></i></a>
                                    </td>
                                </tr>
                            }
                        </tbody>
                    </table>
                    <br />
                    Page @(Model.PageCount < Model.PageNumber ? 0 : Model.PageNumber) of @Model.PageCount

                    <div class="text-center">
                        @Html.PagedListPager(Model, page => Url.Action("SegmentTablesChild", "SyncSchedules", new { page, scheduleId = ViewBag.ScheduleId }),
                        PagedListRenderOptions.EnableUnobtrusiveAjaxReplacing(new AjaxOptions()
                        {
                            HttpMethod = "GET",
                            UpdateTargetId = "SyncSegmentList"
                        }))
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-6">
            <div class="panel-heading">
                <div class="panel-title">
                    <h4 class="text-success">Available tables to add in schedule @ViewBag.ScheduleId</h4>
                </div>
            </div>

            @if (TempData["SegmentTable-Inserted"] != null)
            {
                <div class="alert alert-danger no-border">
                    <button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button>
                    <span class="text-semibold">@TempData["SegmentTable-Inserted"]</span>
                </div>
            }

            @if (TempData["SegmentTable-InsertedSuccess"] != null)
            {
                <div class="alert alert-success no-border">
                    <button type="button" class="close" data-dismiss="alert"><span>×</span><span class="sr-only">Close</span></button>
                    <span class="text-semibold">@TempData["SegmentTable-InsertedSuccess"]</span>
                </div>
            }

            <div class="panel-body">
                <div class="table-responsive">
                    <table class="table table-hover table-bordered table-striped" id="SegmentTable">
                       <thead class="bg-success">
                           <tr>
                               <th><input type="checkbox" id="checkAll" /></th>
                               <th>
                                   Table ID
                               </th>
                               <th>
                                   Table name
                               </th>
                           </tr>
                       </thead>
                        <tbody>
                            @if (defaultTables.Count() > 0)
                            {
                                foreach (var table in defaultTables.OrderBy(s => s.TableId))
                                {
                                    <tr>
                                        <td><input type="checkbox" class="table-checked" value="@table.TableId"/></td>
                                        <td>
                                            @Html.DisplayFor(modelItem => table.TableId)
                                        </td>
                                        <td>
                                            @Html.DisplayFor(modelItem => table.TableName)
                                        </td>
                                    </tr>
                                }
                            }
                            else
                            {
                                <tr><td></td><td>No available tables</td><td></td></tr>
                            }
                        </tbody>
                    </table>
                </div>
                <div>
                    <button class="btn btn-success add-tables" data-schedule-id="@ViewBag.ScheduleId" data-url="@Url.Action("AddAvailableTables", "SyncSchedules")">Add</button>
                </div>
            </div>
        </div>
    </div>
</div>