@page
@model WorkFlowCheck.Web.Pages.CheckListTemplate.CheckListTemplateHeader.CheckListTemplateHeaderPageModel
@using WorkFlowCheck.Common.Helper
@using WorkFlowCheck.Common.DTO

@{
    ViewData["Title"] = "Ellenőrzési sablonok";
}
<h1>@ViewData["Title"]</h1>

<div class="card shadow p-4">
    <div class="d-flex justify-content-end">
        <button id="newCheckListTemplateHeaderBtn" class="btn btn-primary float-right new-btn" data-bs-toggle="tooltip" data-bs-placement="top" title="Új elem hozzáadása">
            <i class="bi bi-plus-square"></i>
        </button>
    </div>
    <table id="tbCheckListTemplateHeadersPage" class="table table-bordered table-hover table-sm" style="width:100%">
        <thead class="table-primary">
            <tr>
                <th>ID</th>
                <th>@DisplayNameHelper.GetDisplayName(nameof(CheckListTemplateHeaderDTO.ShortName), typeof(CheckListTemplateHeaderDTO))</th>
                <th>@DisplayNameHelper.GetDisplayName(nameof(CheckListTemplateHeaderDTO.Description), typeof(CheckListTemplateHeaderDTO))</th>
                <th class="text-center">Action</th>
            </tr>
        </thead>
        <tfoot class="table-light">
            <tr>
                <th>ID</th>
                <th>@DisplayNameHelper.GetDisplayName(nameof(CheckListTemplateHeaderDTO.ShortName), typeof(CheckListTemplateHeaderDTO))</th>
                <th>@DisplayNameHelper.GetDisplayName(nameof(CheckListTemplateHeaderDTO.Description), typeof(CheckListTemplateHeaderDTO))</th>
                <th class="text-center">Action</th>
            </tr>
        </tfoot>
    </table>
</div>

@section Scripts {
    <script>
        const table = new DataTable('#tbCheckListTemplateHeadersPage', {
                ajax: {
                        url: "@Url.Page("./CheckListTemplateHeaderPage", "LoadCheckListTemplateHeaders")",
                        type: "GET",
                        dataSrc : "data"
                },
                columns: [
                    { data: "id" },
                    { data: "shortName" },
                    { data: "description" },
                    { data: null, render: function (data, type, row) {
                         return renderActionButtonsforCheckListTemplateHeader(row.id);
                    }}
                ],
                columnDefs: [
                    {
                        "targets": 0,
                        "visible": false
                    },
                    {
                        "targets": 3,
                        "className": "text-center",
                        "width": "10%"
                    }
                ],

                processing:true,
                language: { url: '//cdn.datatables.net/plug-ins/2.2.2/i18n/hu.json',}
        });

        $('#newCheckListTemplateHeaderBtn').on('click', function ()
        {
            window.location.href = `@Url.Page("./CheckListTemplateHeaderEditPage")?id=0`;
        });
        

        $('#tbCheckListTemplateHeadersPage').on('click', '.edit-btn', function ()
        {
            const row = table.row($(this).closest('tr')).data();
            window.location.href = `@Url.Page("./CheckListTemplateHeaderEditPage")?id=${row.id}`;
        });
        
        $('#tbCheckListTemplateHeadersPage').on('click', '.clone-btn', function ()
        {
            const row = table.row($(this).closest('tr')).data();
            const url = './CheckListTemplateHeaderPage?handler=CloneCheckListTemplateHeader';
                showConfirmModal({
                    title: 'Klónozás megerősítése',
                    message: 'Biztosan klónozni szeretnéd ezt az elemet?',
                    okText: 'Klónozás',
                    cancelText: 'Mégsem'
                }).then(function (result) {
                    if (result === 'ok') {
                        $.ajax({
                            url: url,
                            type: 'GET',
                            data: { id: row.id },
                            success: function (data) {
                                if (data) {
                                    showMessageModal({
                                        title: 'Információ',
                                        message: 'A klónozás sikerült!',
                                        okText: 'Értettem'
                                    });
                                    table.ajax.reload();
                                } else {
                                    showMessageModal({
                                        title: 'Hiba!',
                                        message: 'A klónozás NEM sikerült!',
                                        okText: 'Értettem'
                                    });
                                }
                            },
                            error: function (xhr, status, error) {
                                showMessageModal({
                                    title: 'Hiba!',
                                    message: 'A klónozás NEM sikerült!',
                                    okText: 'Értettem'
                                });
                            }
                        });
                    }
                });
        });

        $('#tbCheckListTemplateHeadersPage').on('click', '.delete-btn', function ()
        {
            const row = table.row($(this).closest('tr')).data();
            deleteEntity(table, './CheckListTemplateHeaderPage?handler=DeleteCheckListTemplateHeader', row.id);
        });
    </script>
}
