let jsonObj = {};

function renderAccessDetailbtn(data, row) {
    var jsonData = JSON.stringify(row).replace(/"/g, """);
    var buttonsHtml = '';

    buttonsHtml += '<button onclick="viewUserAccess(' + jsonData + ')" class="btn btn-default">' +
        '<i class="fa-brands fa-elementor fa-xl" style="color: #008080;" aria-hidden="true"></i>' +
        '</button > ';

    return buttonsHtml;
}
function showUpdateUserProfile(jsonData) {
    jsonObj = jsonData;

    var lockoutEnabled = jsonData.lockoutEnabled;

    var lockoutEnabledCheckbox = document.getElementById("LockoutEnabled");

    lockoutEnabledCheckbox.checked = lockoutEnabled;

    $("#Id").val(jsonData.Id);
    $("#UserName").val(jsonData.userName);
    $("#Company").val(jsonData.company);
    $("#UserRole").val(jsonData.role);
    $("#PUserRole").val(jsonData.role);

    $("#FullName").val(jsonData.fullName);
    $("#PFullName").val(jsonData.fullName);

    $("#Email").val(jsonData.email);
    $("#PhoneNumber").val(jsonData.phoneNumber);
    $("#TwoFactorEnabled").val(jsonData.twoFactorEnabled);
    $("#LockoutEnd").val(jsonData.lockoutEnd);
    $("#Address").val(jsonData.address);

    $("#CreatedBy").val(jsonData.createdBy);
    $("#UpdatedBy").val(jsonData.updatedBy);
    $("#UpdatedDate").val(jsonData.updatedDate);
    $("#CreatedDate").val(jsonData.createdDate);

    var urlContent = jsonData.url;

    var imgElement = document.getElementById("profilePictureImage");

    if (urlContent && urlContent.trim() !== "") {
        imgElement.src =  urlContent;
    } else {
        imgElement.src = "/Content/Images/404userImage.jpg";
    }

    var inputFieldUserRole = document.getElementById("PUserRole");
    var labelUserRole = document.getElementById("PUserRoleLabel");

    labelUserRole.textContent = inputFieldUserRole.value;

    inputFieldUserRole.addEventListener("input", function () {
        labelUserRole.textContent = inputFieldUserRole.value;

    });

    var inputField = document.getElementById("PFullName");
    var label = document.getElementById("PFullNameLabel");

    label.textContent = inputField.value;

    inputField.addEventListener("input", function () {
        label.textContent = inputField.value;

    });

    $('#updateUserProfile').modal('show');
}

//update profile
function updateUserProfile() {
    var loader = $('#overlay, #loader');
    var userId = jsonObj.id;

    var profilePictureInput = document.getElementById("profilePictureInput");

    if (profilePictureInput && profilePictureInput.files.length > 0) {
        var ProfilePicture = profilePictureInput.files[0];
        var reader = new FileReader();
        reader.onload = function (event) {
            var base64Image = event.target.result;

            var data = {
                // Other properties...
                ProfilePictureStr: base64Image
            };
            sendUpdateRequest(data, loader, userId);
        };
        reader.readAsDataURL(ProfilePicture);
    } else {
        var data = {
            ProfilePictureStr: ''
        };
        sendUpdateRequest(data, loader, userId);
    }
}
function sendUpdateRequest(data, loader, userId) {

    var ProfilePictureStr = data.ProfilePictureStr;
    var UserName = document.getElementById("UserName").value;
    var FullName = document.getElementById("FullName").value;
    var Company = document.getElementById("Company").value;
    var Role = document.getElementById("UserRole").value;
    var Email = document.getElementById("Email").value;
    var Address = document.getElementById("Address").value;
    var PhoneNumber = document.getElementById("PhoneNumber").value;
    var NewPassword = document.getElementById("Password").value;

    // Get the checkbox element by its ID
    var lockoutEnabledCheckbox = document.getElementById("LockoutEnabled");

    // Get the current value of the checkbox
    var LockoutEnabled = lockoutEnabledCheckbox.checked;

    const confirmition = confirm('Are you sure you want to proceed?');
    if (confirmition) {
        $.ajax({
            url: '/Account/UpdateUserProfile',
            type: 'POST',
            data: { ProfilePictureStr, userId, UserName, FullName, Company, Role, Email, PhoneNumber, NewPassword, LockoutEnabled, Address }, 
            success: function (response) {
                if (response.success) {
                    $('#updateUserProfile').modal('hide');

                    refreshTable();

                    $('#UpdateMessage').modal('show');
                    setTimeout(function () {
                        $('#UpdateMessage').modal('hide');
                    }, 5000); 
                    refreshTable();
                    clearTextModal();
                } else {
                    alert('User update failed: ' + response.response);
                }
            },
            beforeSend: function () {
                loader.show();
            },
            complete: function () {
                loader.hide();
            }
        });
    }
}
function populateDepartment() {
    $.ajax({
        url: "/Account/GetDepartment",
        success: function (response) {
            if (response && response.success && Array.isArray(response.data)) {
                var $department = $('#department');
                $department.empty();
                response.data.forEach(function (item) {
                    var option = $('<option></option>')
                        .attr('value', item.departmentId)
                        .text(item.department);
                    $department.append(option);
                });
                if (response.data.length > 0) {
                    var firstItem = response.data[0];
                    $department.val(firstItem.departmentId);
                    $('#departmentId').val(firstItem.departmentId);
                }
                $department.on('change', function () {
                    var selectedDepartmentId = $(this).val();
                    $('#departmentId').val(selectedDepartmentId);
                });
            } else {
                console.error('Invalid data format received:', response);
            }
        },
        error: function (error) {
            console.error('Error fetching payment terms:', error);
        }
    });
}
function ShowModal() {
    populateDepartment(); 
    $('#createNewUser').modal('show');
    clearTextModal();
}
function refreshTable() {
    userListTable.ajax.reload();
}
//clear textModal
function clearTextModal() {
    document.getElementById("fullName").value = "";
    document.getElementById("userName").value = "";
    document.getElementById("email").value = "";
    document.getElementById("password").value = "";
    document.getElementById("company").selectedIndex = 0;
    document.getElementById("role").selectedIndex = 0;
}

function addNewUser() {
    var loader = $('#overlay, #loader');
    var formData = {
        FullName: $('#fullName').val(),
        UserName: $('#userName').val(),
        Company: $('#company').val(),
        DepartmentId: parseInt($('#department').val(), 10),
        Role: $('#role').val(),
        Email: $('#email').val(),
        Password: $('#password').val()
    };
    showConfirmation({
        title: 'User Registration',
        message: 'Are you sure you want to create? This action cannot be undone.',
        type: 'warning',
        confirmText: 'Yes',
        cancelText: 'No'
    }).then((confirmed) => {
        if (confirmed) {
            $.ajax({
                url: '/Account/CreateAccount',
                type: 'POST',
                data: formData,
                success: function (response) {
                    if (response.success) {
                        $('#createNewUser').modal('hide');
                        $('#Message').modal('show');
                        // Close the modal after 5 seconds
                        setTimeout(function () {
                            $('#Message').modal('hide');
                        }, 2000);
                        closeModal('modalCreate');
                        refreshTable();
                        clearTextModal();
                    } else {
                        console.log('User creation failed:', response.response);
                        $('#createNewUser').modal('hide');
                        alert('User creation failed: ' + response.response);
                    }
                },

                beforeSend: function () {
                    loader.show();
                },
                complete: function () {
                    loader.hide();
                }
            });
        }
    });
}
//Population
function populateDepartment() {

    $.ajax({
        url: "/Account/GetDepartment",
        success: function (response) {

            if (response && response.data && Array.isArray(response.data)) {
                var $department = $('#department');
                $department.empty();
                response.data.forEach(function (item) {
                    $department.append(
                        $('<option>')
                            .val(item.departmentId)
                            .text(item.department)
                    );
                });
            }
            else {
                console.error("Invalid response:", response);
            }
        },

        error: function (xhr, status, error) {
            console.error("AJAX ERROR");
            console.log(xhr.status);
            console.log(xhr.responseText);
            console.log(error);
        }
    });
}
function populateRoles() {
    $.ajax({
        url: "/Account/GetRoles",
        success: function (data) {

            var roles = data.data;
            if (Array.isArray(roles)) {
                $('#role').empty();
                roles.forEach(function (role) {
                    $('#role').append($('<option>', {
                        value: role,
                        text: role
                    }));
                });
            }
        },
        error: function (error) {
            console.error('Error fetching roles:', error);
        }
    });
}