@page
@model WorkFlowCheck.Web.Pages.UserAndRole.UserEditPageModel
@using WorkFlowCheck.Common.Helper
@using WorkFlowCheck.Common.DTO
@using Microsoft.AspNetCore.Antiforgery
@inject IAntiforgery Antiforgery
@{
    ViewData["Title"] = "Felhasználó szerkesztése";
    var UserId = Model.UserDTO.Id;
    var url = Url.Page("./UserEditPage", "LoadRoles", new { id = UserId });
    var urlPost = Url.Page("./UserEditPage", "Save");
}
<h1>@ViewData["Title"]</h1>

<input type="hidden" id="UserEditUrl" value="@url" />
<input type="hidden" id="UserEditPostUrl" value="@urlPost" />

<div class="card shadow p-4">
    <form method="post" id="UserForm">
        <meta name="csrf-token" content="@Antiforgery.GetAndStoreTokens(HttpContext).RequestToken" />
        <input type="hidden" asp-for="UserDTO.Id" />
        <input type="hidden" asp-for="UserDTO.Password" value="" />


        <input type="hidden" asp-for="UserDTO.JwtToken" value="" />
        <input type="hidden" asp-for="UserDTO.RoleDTO" value="" />
        @if (Model.UserDTO.Id == 0)
        {
            <div class="mb-3">
                <label asp-for="UserDTO.UserName"></label>
                <input asp-for="UserDTO.UserName" class="form-control" autocomplete="off" />
                <span asp-validation-for="UserDTO.UserName" class="text-danger"></span>
            </div>
        }
        else
        {
            <div class="mb-3">
                <label asp-for="UserDTO.UserName"></label>
                <input asp-for="UserDTO.UserName" class="form-control" readonly />
                <span asp-validation-for="UserDTO.UserName" class="text-danger"></span>
            </div>
        }
        @if (Model.UserDTO.Id == 0)
        {
            <div class="row">
                <div class="mb-3">
                    <label asp-for="UserDTO.Password" class="form-label"></label>
                    <div class="input-group">
                        <input asp-for="UserDTO.Password" class="form-control" type="password" id="passwordInput" autocomplete="off" />
                        <button class="btn btn-outline-secondary" type="button" onclick="togglePasswordVisibility()" tabindex="-1">
                            <i class="bi bi-eye" id="toggleIcon"></i>
                        </button>
                    </div>
                    <span asp-validation-for="UserDTO.Password" class="text-danger"></span>
                </div>
            </div>
        }
        <div class="mb-3">
            <label asp-for="UserDTO.NFCCode"></label>
            <input asp-for="UserDTO.NFCCode" class="form-control" />
            <span asp-validation-for="UserDTO.NFCCode" class="text-danger"></span>
        </div>
        <div class="mb-3">
            <label asp-for="UserDTO.Email"></label>
            <input asp-for="UserDTO.Email" class="form-control" />
            <span asp-validation-for="UserDTO.Email" class="text-danger"></span>
        </div>
        <div class="mb-3">
            <label asp-for="UserDTO.FirstName"></label>
            <input asp-for="UserDTO.FirstName" class="form-control" />
            <span asp-validation-for="UserDTO.FirstName" class="text-danger"></span>
        </div>
        <div class="mb-3">
            <label asp-for="UserDTO.LastName"></label>
            <input asp-for="UserDTO.LastName" class="form-control" />
            <span asp-validation-for="UserDTO.LastName" class="text-danger"></span>
        </div>
        <div class="row">
            <div class="col-md-3">
                <label asp-for="UserDTO.Active"></label>
                <input type="checkbox" asp-for="UserDTO.Active" class="form-check-input" />
                <span asp-validation-for="UserDTO.Active" class="text-danger"></span>
            </div>
            <div class="col-md-3">
                <label asp-for="UserDTO.NFCActive"></label>
                <input type="checkbox" asp-for="UserDTO.NFCActive" class="form-check-input" />
                <span asp-validation-for="UserDTO.NFCActive" class="text-danger"></span>
            </div>
        </div>
        <hr class="mt-4 mb-3 border-secondary">
        <div class="mb-3 d-flex justify-content-between">
            <button type="button" id="saveUser" class="btn btn-primary">Mentés</button>
            <button type="button" class="btn btn-secondary" onclick="history.back()">Mégsem</button>
        </div>
    </form>
</div>
@if (Model.UserDTO.Id != 0)
{
    <br></br>
    <div class="card shadow p-4">
        <table id="tbUserPage" class="table table-bordered table-hover table-sm" style="width:100%">
            <thead class="table-primary">
                <tr>
                    <th>ID</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.RoleName), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.ParentRoleName), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.IsAdmin), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanEnableBlocked), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanDownloadAPK), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanUseMobilApp), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanUseWebAdmin), typeof(RoleDTO))</th>
                </tr>
            </thead>
            <tfoot class="table-light">
                <tr>
                    <th>ID</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.RoleName), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.ParentRoleName), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.IsAdmin), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanEnableBlocked), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanDownloadAPK), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanUseMobilApp), typeof(RoleDTO))</th>
                    <th>@DisplayNameHelper.GetDisplayName(nameof(RoleDTO.CanUseWebAdmin), typeof(RoleDTO))</th>
                </tr>
            </tfoot>
        </table>
    </div>
}
@section Scripts {
    <script>

        console.log($('#UserEditUrl').val());

        const table = new DataTable('#tbUserPage', {
                ajax: {
                       url: $('#UserEditUrl').val(),
                       type: "GET",
                       dataSrc : "data"
                },
                columns: [
                    { data: "id" },
                    { data: "roleName" },
                    { data: "parentRoleName" },
                    {
                            data: "isAdmin",
                            searchable: false,
                            sortable: false,
                            className: "text-center",
                            render: function ( data, type, row ) {
                                return renderCheckBox(data);
                            }

                    },
                    {
                            data: "canEnableBlocked",
                            searchable: false,
                            sortable: false,
                            className: "text-center",
                            render: function ( data, type, row ) {
                                return renderCheckBox(data);
                            }

                    },
                    {
                            data: "canDownloadAPK",
                            searchable: false,
                            sortable: false,
                            className: "text-center",
                            render: function ( data, type, row ) {
                                return renderCheckBox(data);
                            }

                    },
                    {
                            data: "canUseMobilApp",
                            searchable: false,
                            sortable: false,
                            className: "text-center",
                            render: function ( data, type, row ) {
                                return renderCheckBox(data);
                            }

                    },
                    {
                            data: "canUseWebAdmin",
                            searchable: false,
                            sortable: false,
                            className: "text-center",
                            render: function ( data, type, row ) {
                                return renderCheckBox(data);
                            }
                    },
                ],
                columnDefs: [
                    {
                        "targets": 0,
                        "visible": false
                    }
                ],

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

        $("#saveUser").click(function () {
            const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
            var formData = getFormAsNestedObject('#UserForm');
            const $form = $('#UserForm');

            formData.UserDTO.RoleDTO=[];
            formData.UserDTO.JwtToken='';
            formData.UserDTO.Active = $('#UserForm input[name="UserDTO.Active"]').is(':checked');
            formData.UserDTO.NFCActive = $('#UserForm input[name="UserDTO.NFCActive"]').is(':checked');

            if ($form.valid())
            {
                saveEntity(csrfToken, formData.UserDTO, $('#UserEditPostUrl').val());
            } else
            {
                $form[0].reportValidity();
            }

        });

        $(document).ready(function () {
            const $form = $("#UserForm");

            $form.validate({
                errorClass: "text-danger small",
                errorPlacement: function (error, element) {
                    error.appendTo(element.parent());
                }
            });

            // $form.on("submit", function (e) {
            //     if (!$form.valid()) {
            //         e.preventDefault(); // Ne küldje be, ha van hiba
            //     }
            // });
        });
    </script>
}