zpc-bulletin-board/ZpcBulletinBoard/Pages/Pages/Index.cshtml

@page
@model ZpcBulletinBoard.Pages.Pages.IndexModel

@{
    ViewData["Title"] = "Strani - Pregled";
    Layout = "~/Pages/Shared/_Layout.cshtml";
}

@section Styles {
    
    <style type="text/css">
        .table > tbody > tr > td:nth-child(2),
        .table > thead > tr > th:nth-child(2){
            width: 200px
        }
        .table > tbody > tr > td:nth-child(3),
        .table > thead > tr > th:nth-child(3),
        .table > tbody > tr > td:nth-child(4),
        .table > thead > tr > th:nth-child(4) {
            width: 100px
        }
    </style>
}

<h4 class="d-flex justify-content-between align-items-center w-100 font-weight-bold py-1 mb-4">
    <span>
        <span class="text-muted font-weight-light">
            <i>Oglasna deska strani</i>
            /</span> Pregled
    </span>
</h4>
<div class="row">
    <div class="col-12 mb-2 text-right">
        <form method="get">
            <div class="btn-group">
                <input class="form-control" type="text" value="" placeholder="Iskanje..." autocomplete="off">
                <input id="inpOpenEditorForPage" type="hidden" name="openEditorForPage" asp-for="OpenEditorForPage" />
                <div class="btn-group" title="Columns">
                    <button class="btn btn-secondary dropdown-toggle" type="button" data-toggle="dropdown" aria-label="Nastavitve" title="Nastavitve">
                        <i class="opacity-75 ion ion-md-apps"></i>
                        <span class="caret"></span>
                    </button>
                    <div class="dropdown-menu dropdown-menu-right">
@*                         <label class="dropdown-item">
                            <input type="checkbox" name="openProjects" @ViewData["OpenProjects"]> <span>Odprti</span>
                        </label>
                        <label class="dropdown-item">
                            <input type="checkbox" name="inProductionProjects" @ViewData["InProductionProjects"]> <span>V izdelavi</span>
                        </label>
                        <label class="dropdown-item">
                            <input type="checkbox" name="finishedProjects" @ViewData["FinishedProjects"]> <span>Zaključeni projekti</span>
                        </label>
                        <label class="dropdown-item">
                            <input type="checkbox" name="offerProjects" @ViewData["OffersProjects"]> <span>Ponudbe</span>
                        </label> *@
                    </div>
                </div>
                <button id="btnRefresh" type="submit" class="btn btn-secondary" aria-label="Osveži" title="Osveži">
                    <i class="opacity-75 ion ion-md-refresh"></i>
                </button>
            </div>
        </form>
    </div>
</div>
<div class="card">
    <h6 class="card-header">
        Seznam strani
    </h6>
    <table class="table card-table table-hover">
        <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.Pages[0].Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Pages[0].Type)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.Pages[0].Ratio)
            </th>
            <th></th>
        </tr>
        </thead>
        <tbody>
        @foreach (var item in Model.Pages)
        {
            <tr data-id="@item.IdBulletinBoardPage">
                <td>
                    @Html.DisplayFor(modelItem => item.Name)
                </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Type)
                    </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Ratio)
                </td>
                <td style="text-align:right;">
                    <a class="btn btn-xs icon-btn btn-outline-primary borderless" href="javascript:;" onclick="rowOpenEditor(this);" data-toggle="tooltip" data-placement="top" title="Urejevalnik" data-state="secondary"><i class="far fa-edit"></i></a>
                    <a class="btn btn-xs icon-btn btn-outline-secondary borderless" href="javascript:;" onclick="openModalEditPage(this);" data-toggle="tooltip" data-placement="top" title="Urejanje" data-state="secondary"><i class="fas fa-pencil-alt"></i></a>
                </td>
            </tr>
        }
        </tbody>
    </table>
    <div class="card-footer py-3 text-right">
        <a href="javascript:;" onclick="openModalAddPage();" class="btn btn-primary">Dodaj novo</a>
    </div>
</div>

<div id="divModalAddEditPage" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Urejanje strani</h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <input id="inpModalAddEditPageIdPage" type="hidden" />
                <div class="form-group">
                    <label class="control-label">Ime</label>
                    <input id="inpModalAddEditPageName" class="form-control"/>
                </div>
                <div class="form-group">
                    <label class="control-label">Razmerje</label>
                    <select id="selModalAddEditPageRatio" class="form-control" asp-items="Html.GetEnumSelectList<Models.Editor.BulletinBoard.RatioEnum>()">
                    </select>
                </div>
                <div class="form-group">
                    <label class="control-label">Tip</label>
                    <select id="selModalAddEditPageType" class="form-control" asp-items="Html.GetEnumSelectList<Models.Editor.BulletinBoardPage.TypeEnum>()">
                    </select>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="saveModalAddEditPage();">Shrani</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Prekliči</button>
            </div>
        </div>
    </div>
</div>

<div id="divModalPageEditorPicture" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Urejanje slike</h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <input id="inpModalPageEditorPictureIdPage" type="hidden" />
                <div class="form-group">
                    <label class="control-label">Izberi sliko</label>
                    <input type="file" id="inpModalPageEditorPicturePicture" class="form-control" />
                </div>
                <hr/>
                <img id="imgModalPageEditorPicture" src="" class="img-fluid" alt="Responsive image">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="saveModalPageEditorPicture();">Shrani</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Prekliči</button>
            </div>
        </div>
    </div>
</div>

<div id="divModalPageEditorLink" class="modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Urejanje zunanje povezave</h5>
                <button type="button" class="close" data-bs-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
            </div>
            <div class="modal-body">
                <input id="inpModalPageEditorLinkIdPage" type="hidden" />
                <div class="form-group">
                    <label class="control-label">Povezava</label>
                    <input id="inpModalPageEditorLinkLink" class="form-control" />
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" onclick="saveModalPageEditorLink();">Shrani</button>
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Prekliči</button>
            </div>
        </div>
    </div>
</div>

@Html.AntiForgeryToken()
@section Scripts {
    <script src="~/js/pages/index.js" asp-append-version="true"></script>
}