stylehub/templates/adminActions.html

<script>
    function addActivationCodes() {
        const count = document.getElementById("activationCodeCount").value;

        const data = new URLSearchParams();
        data.append("action", "add_activation_codes");
        data.append("count", count);

        doAction(data, "Activation codes added Successfully!", "Activation codes addition failed.");
    }

    async function listUsers() {
        const data = new URLSearchParams();
        data.append("action", "list_users");

        const result = await doAction(data, "User list retrieved Successfully!", "User list retrieval failed.");

        if (result && result.Status === "Success") {
            displayUserList(result.Users);
        }
    }

    function displayUserList(users) {
        const tableContainer = document.getElementById("userListTable");
        tableContainer.innerHTML = ""; // Clear previous content

        const table = document.createElement("table");
        table.border = "1";

        // Create header row
        const headerRow = table.insertRow(0);
        for (const key in users[0]) {
            const th = document.createElement("th");
            th.appendChild(document.createTextNode(key));
            headerRow.appendChild(th);
        }

        // Create data rows
        for (const user of users) {
            const dataRow = table.insertRow();
            for (const key in user) {
                const td = document.createElement("td");
                td.appendChild(document.createTextNode(user[key]));
                dataRow.appendChild(td);
            }
        }

        tableContainer.appendChild(table);
    }

    function listActivationCodes() {
        const data = new URLSearchParams();
        data.append("action", "list_activation_codes");

        doAction(data, "Activation code list retrieved Successfully!", "Activation code list retrieval failed.");
    }

    function deleteUser() {
        const userId = document.getElementById("userId").value;

        const data = new URLSearchParams();
        data.append("action", "delete_user");
        data.append("user_id", userId);

        doAction(data, "User deleted Successfully!", "User deletion failed.");
    }

    function deleteActivationCode() {
        const activationCode = document.getElementById("activationCode").value;

        const data = new URLSearchParams();
        data.append("action", "delete_activation_code");
        data.append("activation_code", activationCode);

        doAction(data, "Activation code deleted Successfully!", "Activation code deletion failed.");
    }
</script>

<div class="form-container" id="addActivationCodesForm">
    <h1>Add Activation Codes</h1>
    <form>
        <label for="activationCodeCount">Activation Code Count:</label>
        <input type="text" id="activationCodeCount" name="activationCodeCount" required>

        <button type="button" onclick="addActivationCodes()">Add Activation Codes</button>
    </form>
</div>

<div class="form-container" id="listUsersForm">
    <h1>List Users</h1>
    <form>
        <button type="button" onclick="listUsers()">List Users</button>
    </form>
</div>

<div class="form-container" id="listActivationCodesForm">
    <h1>List Activation Codes</h1>
    <form>
        <button type="button" onclick="listActivationCodes()">List Activation Codes</button>
    </form>
</div>

<div class="form-container" id="deleteUserForm">
    <h1>Delete User</h1>
    <form>
        <label for="userId">User ID:</label>
        <input type="text" id="userId" name="userId" required>

        <button type="button" onclick="deleteUser()">Delete User</button>
    </form>
</div>

<div class="form-container" id="deleteActivationCodeForm">
    <h1>Delete Activation Code</h1>
    <form>
        <label for="activationCode">Activation Code:</label>
        <input type="text" id="activationCode" name="activationCode" required>

        <button type="button" onclick="deleteActivationCode()">Delete Activation Code</button>
    </form>
</div>

<!-- Centralized Status Message -->
<p id="StatusMessage"></p>