Editing: index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Admin Page</title>
    <style>
        table {
            /* width: 100%;
            border-collapse: collapse;
            margin-bottom: 20px; */
            max-height: 400px;
            overflow-y: scroll;
            border-collapse: collapse;
            margin: 25px 0;
            font-size: 0.9em;
            font-family: sans-serif;
            /* min-width: 400px; */
            box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
        }

thead tr {
            background-color: #009879;
            color: #ffffff;
            text-align: left;
        }

th,
        td {
            /* border: 1px solid black; */
            /* padding: 8px; */
            /* text-align: left; */
            padding: 12px 15px;
        }

tbody tr {
            border-bottom: 1px solid #dddddd;
        }

tbody tr:nth-of-type(even) {
            background-color: #f3f3f3;
        }

tbody tr:last-of-type {
            border-bottom: 2px solid #009879;
        }

/* th {
            background-color: #f2f2f2;
            position: sticky;
            top: 0;
            z-index: 1;
        } */

form {
            margin-bottom: 20px;
        }

input[type="text"],
        input[type="number"] {
            margin-right: 10px;
            padding: 5px;
        }

button {
            padding: 5px 10px;
        }

.tabs {
            margin-bottom: 20px;
        }

.tablink {
            padding: 10px 15px;
            cursor: pointer;
            background-color: #f1f1f1;
            border: none;
            margin-right: 5px;
        }

.tablink:hover {
            background-color: #ddd;
        }

#addGameForm {
            display: none;
        }

#loginForm {
            display: none;
        }

#adminPanel {
            display: none;
        }

.button-36 {
            background: #e0e0e0;
            /* Default color */
            border: none;
            color: black;
            padding: 10px 20px;
            text-align: center;
            text-decoration: none;
            display: inline-block;
            font-size: 16px;
            margin: 4px 2px;
            cursor: pointer;
            border-radius: 8px;
            transition: background 0.3s ease;
        }

.button-selected {
            background-image: linear-gradient(92.88deg, #00b78a 9.16%, #009879 43.89%, #00795f 64.72%);

color: white;
        }

.button-selected-1 {
            background-image: linear-gradient(92.88deg, #00b78a 9.16%, #009879 43.89%, #00795f 64.72%);

color: white;
            border: 1px solid #fff;
        }

input {
            padding: 6px 12px !important;
            font-size: 16px;
            font-weight: 400;
            line-height: 1.5;
            color: #212529;
            background-color: #fff;
            background-clip: padding-box;
            border: 1px solid #ced4da;
            appearance: none;
            border-radius: 4px;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;

:focus {
                color: #212529;
                background-color: #fff;
                border-color: #86b7fe;
                outline: 0;
                box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
            }

}

.flex {
            display: flex;
        }

.justify-center {
            justify-content: center;
        }

.justify-between {
            justify-content: space-between;
        }

.items-center {
            align-items: center;
        }

.mb-2 {
            margin-bottom: 8px;
        }

.w-500 {
            width: 500px;
        }

.mr-0 {
            margin-right: 0 !important;
        }

.fs-20 {
            font-size: 20px;
        }

.theme-col {
            background-color: #33B296;
        }

.text-col {
            color: #fff;
        }

.p-10 {
            padding: 10px;
        }

.mr-4 {
            margin-right: 4px;
        }

.w-fit {
            width: fit-content;
        }

.r-10 {
            border-radius: 10px;
        }

.marketActive {
        background-color: #28a745; /* Change to your preferred active color */
        color: white;
        font-weight: bold;
    }
    </style>
</head>

<body>
    <div id="loginForm">
        <h2>Login</h2>
        <form onsubmit="login(event)">
            <div class="flex justify-between items-center w-500 mb-2">
                <label for="username">Username:</label>
                <input class="mr-0" type="text" id="username" name="username" required />
            </div>
            <div class="flex justify-between items-center w-500 mb-2">
                <label for="password">Password:</label>
                <input type="password" id="password" name="password" required />
            </div>
            <button type="submit" class="button-36">Login</button>
        </form>
    </div>
    <div id="adminPanel">
        <h1>S AajTak</h1>

<div class="tabs">
            <button class="tablink button-36 usertable" onclick="openTable('usersTable',this)">
                Users Table
            </button>
            <button class="tablink button-36" onclick="openTable('gamesTable',this)">
                Games Table
            </button>
            <button class="tablink button-36" onclick="openTable('balanceRequestsTable',this)">
                Add Balance Request
            </button>
            <button class="tablink button-36" onclick="openTable('withdrawRequestsTable',this)">
                Withdraw Requests
            </button>
            <button class="tablink button-36" onclick="openForm('addGameForm',this)">
                Add Games
            </button>
        </div>
        <div class="theme-col p-10 flex items-center w-fit r-10" id="dateRangeSection" style="display:none;">
            <div class="fs-20 text-col mr-4">Data of Last</div>
            <button class="tablink-1 button-36 mr-4" id="sevenday" onclick="handleDays('7days',this)">7 Days</button>
            <button class="tablink-1 button-36 mr-4" onclick="handleDays('15days',this)">15 Days</button>
            <button class="tablink-1 button-36 mr-4" onclick="handleDays('30days',this)">30 Days</button>
            <button class="tablink-1 button-36 mr-4" onclick="handleDays('all',this)">All Time</button>
        </div>
        
        <table id="usersTable" style="display: none">
            <thead>
                <tr>
                    
                    <th>Name</th>
                    <th>Phone</th>
                    
                    <th>Balance</th>
                    <th>Balance Actions</th>
                    <th>Delete User</th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
        </table>

<table id="gamesTable" style="display: none">
            <thead>
                <tr>
                    
                    
                    
                    <th>Phone</th>
                    <th>Game</th>
                    <th>Market</th>
                    <th>Amount</th>
                    <th>Reward</th>
                    <th>Selected</th>
                    <th>Date</th>
                    <th>Balance</th>
                    <th>Balance Actions</th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
        </table>

<table id="balanceRequestsTable" style="display: none">
            <thead>
                <tr>
                    
                    <th>Phone</th>
                    <th>Amount</th>
                    <th>Status</th>
                    <th>TransactionId</th>
                    <th>Date</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
        </table>

<table id="withdrawRequestsTable" style="display: none">
            <thead>
                <tr>
                    
                    <th>User Phone</th>
                    <th>Amount</th>
                    <th>Bank Name</th>
                    <th>Account number</th>
                    <th>Name</th>
                    <th>Mobile No.</th>
                    <th>I.F.S.C</th>
                    <th>Status</th>
                    <th>Date</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                
            </tbody>
        </table>

<form id="addGameForm">
            <h2>Add Daily Games</h2>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="disawer">King Bazaar Winner Number:</label>
                <input type="number" id="king" name="king" required />
            </div>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="goldMarket">Gold Bazzar Winner Number:</label>
                <input type="number" id="goldMarket" name="goldMarket" required />
            </div>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="faridabad">Faridabad Winner Number:</label>
                <input type="number" id="faridabad" name="faridabad" required />
            </div>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="gaziabad">Gaziabad Winner Number:</label>
                <input type="number" id="gaziabad" name="gaziabad" required />
            </div>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="gali">Gali Winner Number:</label>
                <input type="number" id="gali" name="gali" required />
            </div>
            <div class="mb-2 flex w-500 items-center justify-between">
                <label for="disawer">Disawer Winner Number:</label>
                <input type="number" id="disawer" name="disawer" required />
            </div>
            
            <button type="button" class="button-36" onclick="submitGame()">Submit</button><br /><br />
            <div>Results</div>
            <div id="winnnerNumber">

</div>
            <div id="result">
                <h3>Result</h3>
                <div id="resultList"></div>
            </div>
            <h2 for="Notification">Notification:</h2>
            <div>
                <textarea type="string" id="Notification" name="Notification" cols="40" rows="10"> </textarea><br />
                <button type="button " class="button-36" onclick="submitNotification()">
                    Create Notification
                </button>
            </div>

<div>Market Totals</div>
            <div id="market-buttons">
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'King Bazaar')">
                    King Bazaar
                </button>
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'Gold Bazzar')">
                    Gold Bazzar
                </button>
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'Faridabad')">
                    Faridabad
                </button>
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'Gaziabad')">
                    Gaziabad
                </button>
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'Gali')">
                    Gali
                </button> 
                <button type="button" class="button-36" onclick="fetchMarketTotal(event,'Disawer')">
                    Disawer
                </button>   
            </div>
            <div id="marketTotalResult">
                <h3>Market Total Result</h3>
                <div id="marketTotalList"></div>
            </div>
        </form>
    </div>

async function login(event) {
            console.log('uu');
            event.preventDefault();
            const username = document.getElementById("username").value;
            const password = document.getElementById("password").value;

try {
                const response = await fetch(
                    "https://game-backend2-tau.vercel.app/api/users/login-admin",
                    {
                        method: "POST",
                        headers: {
                            "Content-Type": "application/json",
                        },
                        body: JSON.stringify({ username, password }),
                    }
                );

if (response.ok) {
                    const data = await response.json();
                    localStorage.setItem("token", data.token);
                    document.getElementById("loginForm").style.display =
                        "none";
                    document.getElementById("adminPanel").style.display =
                        "block";
                    openTable("usersTable")
                } else {
                    alert("Invalid credentials");
                }
            } catch (error) {
                console.error("Error logging in:", error);
            }
        }

document.addEventListener("DOMContentLoaded", () => {
            console.log('tt');
            const token = localStorage.getItem("token");
            if (!token) {
                document.getElementById("loginForm").style.display =
                    "block";
                document.getElementById("adminPanel").style.display =
                    "none";
            } else {
                document.getElementById("adminPanel").style.display =
                    "block";
                document.getElementById("loginForm").style.display = "none";
            }

token ? openTable("usersTable") : ''
        });

const handleDays = (days, btn) => {
            // console.log(days, 'days');
            dataDays = days
            console.log(dataDays, 'dataDays');
            setActiveDate(btn);

const selectedButton = document.querySelector('.button-selected');
            selectedButton.onclick();
        }

async function  fetchUsersData() {
            console.log('ss');
            const token = localStorage.getItem("token");
            try {
                const response = await fetch(BASE_USERS_URL + `?range=${dataDays}`, {
                    method: "GET",
                    headers: {
                        Authorization: token,
                    },
                });
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();
                populateUsersTable(data);
            } catch (error) {
                console.error("Error fetching users data:", error);
                document.getElementById("loginForm").style.display =
                    "block";
                document.getElementById("adminPanel").style.display =
                    "none";
            }
        }

async function fetchGamesData() {
            console.log('rr');
            const token = localStorage.getItem("token");
            try {
                const response = await fetch(BASE_GAMES_URL + `?range=${dataDays}`, {
                    method: "GET",
                    headers: {
                        Authorization: token,
                    },
                });
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();
                populateGamesTable(data);
            } catch (error) {
                console.error("Error fetching games data:", error);
                document.getElementById("loginForm").style.display =
                    "block";
                document.getElementById("adminPanel").style.display =
                    "none";
            }
        }

async function fetchMarketTotal(event,market) {
            console.log('qq');
            // Remove 'active' class from all buttons
        document.querySelectorAll("#market-buttons button").forEach(btn => btn.classList.remove("marketActive"));
        
        // Add 'active' class to the clicked button
        event.target.classList.add("marketActive");
            try {
                const response = await fetch(
                    `${MARKET_TOTAL_URL}/${market}`
                );
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();
                populateMarketTotal(data);
            } catch (error) {
                console.error("Error fetching market total:", error);
            }
        }

function populateMarketTotal(data) {
    console.log('pp');
    const marketTotalList = document.getElementById("marketTotalList");
    marketTotalList.innerHTML = ""; // Clear existing data

if (data && data.totals) {
        // Calculate final total
        const values = Object.values(data.totals);
        const finalTotal = values.reduce((acc, curr) => acc + curr, 0);

// Add individual market totals
        Object.entries(data.totals).forEach(([market, total]) => {
            const div = document.createElement("div");
            div.innerHTML = `
                <p>Number: ${market}</p>
                <p>Total: ${total}</p>
            `;
            marketTotalList.appendChild(div);
        });

// Add final total section
        const totalDiv = document.createElement("div");
        totalDiv.style.marginTop = "20px";
        totalDiv.style.fontWeight = "bold";
        totalDiv.innerHTML = `
            <p>Final Total: ${finalTotal}</p>
        `;
        marketTotalList.appendChild(totalDiv);
    } else {
        marketTotalList.innerHTML =
            "<p>No data available for the selected market.</p>";
    }
}

async function fetchRequestBalancesData() {
            console.log('oo');
            const token = localStorage.getItem("token");
            try {
                const response = await fetch(BASE_REQUEST_BALANCES_URL + `?range=${dataDays}`, {
                    method: "GET",
                    headers: {
                        Authorization: token,
                    },
                });
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();
                populateRequestBalancesTable(data);
            } catch (error) {
                console.error(
                    "Error fetching request balances data:",
                    error
                );
                document.getElementById("loginForm").style.display =
                    "block";
                document.getElementById("adminPanel").style.display =
                    "none";
            }
        }

async function fetchWithdrawRequestsData() {
            console.log('nn');
            const token = localStorage.getItem("token");
            try {
                const response = await fetch(BASE_WITHDRAW_REQUESTS_URL + `?range=${dataDays}`, {
                    method: "GET",
                    headers: {
                        Authorization: token,
                    },
                });
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();
                populateWithdrawRequestsTable(data);
            } catch (error) {
                console.error(
                    "Error fetching withdraw requests data:",
                    error
                );
                document.getElementById("loginForm").style.display =
                    "block";
                document.getElementById("adminPanel").style.display =
                    "none";
            }
        }

function populateUsersTable(data) {
            console.log('mm');
            const tableBody = document
                .getElementById("usersTable")
                .getElementsByTagName("tbody")[0];
            tableBody.innerHTML = "";
            data.forEach((user) => {
                const row = tableBody.insertRow();
                // const cellId = row.insertCell(0);
                const cellName = row.insertCell(0);
                const cellNumber = row.insertCell(1);
                // const cellState = row.insertCell(3);
                const cellBalance = row.insertCell(2);
                const cellActions = row.insertCell(3);
                const CellDelete = row.insertCell(4)

// cellId.textContent = user?._id;
                cellName.textContent = user?.name;
                cellNumber.textContent = user?.phone;
                // cellState.textContent = user?.state;
                cellBalance.textContent = user?.balance;

const inputAmount = document.createElement("input");
                inputAmount.type = "number";
                inputAmount.placeholder = "Amount";

const addButton = document.createElement("button");
                addButton.textContent = "Add Balance";
                addButton.classList.add("button-36")
                addButton.onclick = () =>
                    updateBalance(
                        user?._id,
                        inputAmount.value,
                        "add",
                        "",
                        addButton
                    );

const deleteButton = document.createElement("button");
                deleteButton.textContent = "Delete User"
                deleteButton.classList.add('button-36')
                deleteButton.onclick = () => deleteUser(user?._id)

cellActions.appendChild(inputAmount);
                cellActions.appendChild(addButton);
                cellActions.appendChild(removeButton);

CellDelete.appendChild(deleteButton)
            });
        }

function populateGamesTable(data) {
            console.log('ll');
            const tableBody = document
                .getElementById("gamesTable")
                .getElementsByTagName("tbody")[0];
            tableBody.innerHTML = "";
            data.forEach((game) => {
                const row = tableBody.insertRow();
                // const cellId = row.insertCell(0);
                // const cellUserId = row.insertCell(1);
                // const cellUserName = row.insertCell(2);
                const cellUserPhone = row.insertCell(0);
                const cellMarket = row.insertCell(1);
                const cellGame = row.insertCell(2);
                const cellAmount = row.insertCell(3);
                const cellReward = row.insertCell(4);
                const cellSelected = row.insertCell(5);
                const cellDate = row.insertCell(6);
                const cellBalance = row.insertCell(7);
                const cellActions = row.insertCell(8);

// cellId.textContent = game?._id;
                // cellUserId.textContent = game?.userId?._id;
                // cellUserName.textContent = game?.userId?.name;
                cellUserPhone.textContent = game?.userId?.phone;
                cellGame.textContent = game?.game;
                cellMarket.textContent = game?.market;
                cellAmount.textContent = game?.amount;
                cellReward.textContent = game?.reward;
                cellSelected.textContent = game?.selected;
                cellDate.textContent = new Date(
                    game?.date
                ).toLocaleString();
                cellBalance.textContent = game?.userId?.balance;

const inputAmount = document.createElement("input");
                inputAmount.type = "number";
                inputAmount.placeholder = "Amount";

const addButton = document.createElement("button");
                addButton.textContent = "Add Balance";
                addButton.classList.add("button-36")
                addButton.onclick = () =>
                    updateBalance(
                        game?.userId._id,
                        inputAmount.value,
                        "add",
                        game?._id,
                        addButton
                    );

const removeButton = document.createElement("button");
                removeButton.textContent = "Remove Balance";
                removeButton.classList.add("button-36")
                removeButton.onclick = () =>
                    updateBalance(
                        game?.userId._id,
                        inputAmount.value,
                        "remove",
                        game?._id,
                        removeButton
                    );
                // Disable the button if the status is 'completed'
                if (game?.reward > 0) {
                    addButton.disabled = true;
                    removeButton.disabled = true;
                }
                cellActions.appendChild(inputAmount);
                cellActions.appendChild(addButton);
                cellActions.appendChild(removeButton);
            });
        }

function populateRequestBalancesTable(data) {
            console.log('kk', data);
            const tableBody = document
                .getElementById("balanceRequestsTable")
                .getElementsByTagName("tbody")[0];
            tableBody.innerHTML = "";
            data.forEach((request) => {
                const row = tableBody.insertRow();
                // const cellId = row.insertCell(0);
                const cellUserPhone = row.insertCell(0);
                const cellAmount = row.insertCell(1);
                const cellStatus = row.insertCell(2);
                const cellTransactionId = row.insertCell(3);
                const cellDate = row.insertCell(4);
                const cellActions = row.insertCell(5);

// cellId.textContent = request?._id;
                cellUserPhone.textContent = request?.userId?.phone;
                cellAmount.textContent = request?.amount;
                cellStatus.textContent = request?.status;
                cellTransactionId.textContent = request?.transactionId;
                cellDate.textContent = new Date(
                    request?.date
                ).toLocaleString();

const approveButton = document.createElement("button");
                approveButton.textContent = "Approve Request";
                approveButton.classList.add("button-36")
                approveButton.onclick = () => {
                    approveButton.disabled = true;
                    approveRequest(
                        request?._id,
                        request?.amount,
                        request?.userId
                    );
                }

// Disable the button if the status is 'completed'
                if (request.status === "completed") {
                    approveButton.disabled = true;
                    approveButton.textContent = "Completed";
                }

const deleteRequest = document.createElement("button");
                deleteRequest.textContent = "Delete Request";
                deleteRequest.classList.add("button-36")
                deleteRequest.onclick = () =>
                    deleteAddBalance(request?._id)

cellActions.appendChild(approveButton);
                cellActions.appendChild(deleteRequest);
            });
        }

function populateWithdrawRequestsTable(data) {
            console.log('jj');
            const tableBody = document
                .getElementById("withdrawRequestsTable")
                .getElementsByTagName("tbody")[0];
            tableBody.innerHTML = "";
            data.forEach((request) => {
                const row = tableBody.insertRow();
                // const cellId = row.insertCell(0);
                const cellUserPhone = row.insertCell(0);
                const cellAmount = row.insertCell(1);
                const cellBankName = row.insertCell(2);
                const cellAccountNumber = row.insertCell(3);
                const cellName = row.insertCell(4);
                const cellMobileNo = row.insertCell(5);
                const cellIfsc = row.insertCell(6);
                const cellStatus = row.insertCell(7);
                const cellDate = row.insertCell(8);
                const cellActions = row.insertCell(9);

// cellId.textContent = request?._id;
                cellUserPhone.textContent = request?.userId?.phone;
                cellAmount.textContent = request?.amount;
                cellBankName.textContent = request?.bankName;
                cellAccountNumber.textContent = request?.accountNumber;
                cellName.textContent = request?.name;
                cellMobileNo.textContent = request?.mobile;
                cellIfsc.textContent = request?.ifsc;
                cellStatus.textContent = request?.status;
                cellDate.textContent = new Date(
                    request?.date
                ).toLocaleString();

const approveButton = document.createElement("button");
                approveButton.textContent = "Approve Request";
                approveButton.classList.add('button-36')
                approveButton.onclick = () =>
                    approveWithdrawRequest(
                        request?._id,
                        request?.amount,
                        request?.userId
                    );

const rejectButton = document.createElement("button");
                rejectButton.textContent = "Reject Request";
                rejectButton.classList.add('button-36')
                rejectButton.onclick = () =>
                    rejectWithdrawRequest(
                        request?._id,
                        request?.amount,
                        request?.userId
                    );

cellActions.appendChild(approveButton);
                cellActions.appendChild(rejectButton);

if (request.status === "completed") {
                    approveButton.disabled = true;
                    rejectButton.disabled = true;
                    approveButton.textContent = "Completed";
                    rejectButton.style.display = 'none';
                } else if (request.status === "rejected") {
                    approveButton.disabled = true;
                    rejectButton.disabled = true;
                    rejectButton.textContent = "Rejected";
                    approveButton.style.display = 'none';
                }

});
        }

function updateBalance(userId, amount, action, jodiId, button) {
            console.log('hh');
            if (button) {
                button.disabled = true;
            }

const url =
                action === "add" ? ADD_BALANCE_URL : REMOVE_BALANCE_URL;

fetch(url, {
                method: "POST",
                headers: {
                    "Content-Type": "application/json",
                },
                body: JSON.stringify({
                    userId,
                    amount: Number(amount),
                    jodiId,
                }),
            })
                .then((response) => {
                    if (!response.ok) {
                        throw new Error(
                            "Network response was not ok " +
                            response.statusText
                        );
                    }
                    return response.json();
                })
                .then((result) => {
                    alert(result.message);
                    if (
                        document.getElementById("usersTable").style
                            .display !== "none"
                    ) {
                        fetchUsersData();
                    } else if (
                        document.getElementById("gamesTable").style
                            .display !== "none"
                    ) {
                        fetchGamesData();
                    } else {
                        fetchRequestBalancesData();
                    }
                    if (button) {
                        button.disabled = true;
                    }
                })
                .catch((error) => {
                    console.error("Error updating balance:", error);
                    if (button) {
                        button.disabled = true;
                    }
                });
        }

async function submitNotification() {
            console.log('ff');
            const notificationInput =
                document.getElementById("Notification");
            const notification = notificationInput.value;

try {
                const response = await fetch(Notification_Url, {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/json",
                    },
                    body: JSON.stringify({ notification }),
                });

if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();

// Clear the notification input field
                notificationInput.value = "";

const resultList = document.getElementById("Notification");
                resultList.innerHTML = "";
            } catch (error) {
                console.error("Error creating Notification", error);
            }
        }

async function deleteUser(userId) {
            const token = localStorage.getItem("token");
            try {
                const del = await fetch(DeleteUser, {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/json",
                        Authorization: token,
                    },
                    body: JSON.stringify(
                        {
                            userId
                        }
                    )
                })

} catch (e) {
                console.log(e, 'error');
                
            }finally{
                fetchUsersData()            }
        }
        async function submitGame() {
            console.log('ee');
            const goldMarket = document.getElementById("goldMarket").value;
            const faridabad = document.getElementById("faridabad").value;
            const gaziabad = document.getElementById("gaziabad").value;
            const gali = document.getElementById("gali").value;
            const disawer = document.getElementById("disawer").value;
            const king = document.getElementById("king").value;
            const token = localStorage.getItem("token");
            try {
                const response = await fetch(ADD_GAME_URL, {
                    method: "PUT",
                    headers: {
                        "Content-Type": "application/json",
                        Authorization: token,
                    },
                    body: JSON.stringify({
                        goldMarket,
                        faridabad,
                        gaziabad,
                        gali,
                        disawer,
                        king
                    }),
                });
                if (!response.ok) {
                    throw new Error(
                        "Network response was not ok " + response.statusText
                    );
                }
                const data = await response.json();

alert("Daily games created successfully!");
                document.getElementById("addGameForm").reset();
                // Display the result
                const resultList = document.getElementById("resultList");
                resultList.innerHTML = ""; // Clear any previous results

// data.totals.forEach((total) => {
                //     const resultItem = document.createElement("p");
                //     resultItem.textContent = `Market: ${total.market}, Total: ${total.total}`;
                //     resultList.appendChild(resultItem);
                // });
            } catch (error) {
                console.error("Error creating daily games:", error);
            } finally {
                getWinnerNumber()
            }
        }

function openTable(tableId, button = null) {
            console.log('dd');
            if (tableId === 'addGameForm') {
                document.getElementById('dateRangeSection').style.display = 'none';
            } else {
                document.getElementById('dateRangeSection').style.display = 'flex';
            }

const tables = document.querySelectorAll("table");
            tables.forEach((table) => {
                table.style.display = "none";
            });

document.getElementById(tableId).style.display = "table";
            if (tableId === "usersTable") {
                fetchUsersData();
                if (!button) {
                    setTimeout(() => {
                        const buttons = document.querySelectorAll(".usertable");
                        console.log(buttons, 'buttons');
                        buttons[0].classList.add("button-selected");
                    }, 40);
                }

} else if (tableId === "gamesTable") {
                fetchGamesData();
            } else if (tableId === "balanceRequestsTable") {
                fetchRequestBalancesData();
            } else if (tableId === "withdrawRequestsTable") {
                fetchWithdrawRequestsData();
            }
            document.getElementById("addGameForm").style.display = "none";

// Update button active state
            if (button) {
                console.log(event.target, 'qqqqqqqqqqq', button);

setActiveButton(button);
            }
        }

function setActiveButton(button) {
            console.log('cc');
            // Remove active class from all buttons
            const buttons = document.querySelectorAll(".tablink");
            buttons.forEach((btn) => btn.classList.remove("button-selected"));
            // Add active class to the clicked button
            button.classList.add("button-selected");
        }

function setActiveDate(button) {
            console.log('cc');
            // Remove active class from all buttons
            const buttons = document.querySelectorAll(".tablink-1");
            buttons.forEach((btn) => btn.classList.remove("button-selected-1"));
            // Add active class to the clicked button
            button.classList.add("button-selected-1");
        }

function openForm(formId) {
            if (formId === 'addGameForm') {
                document.getElementById('dateRangeSection').style.display = 'none';
            } else {
                document.getElementById('dateRangeSection').style.display = 'flex';
            }
            console.log('bb');

const tables = document.querySelectorAll("table");
            tables.forEach((table) => {
                table.style.display = "none";
            });
            document.getElementById(formId).style.display = "block";
            getWinnerNumber()

// Update button active state
            setActiveButton(event.target);
        }

// document.addEventListener("DOMContentLoaded", () => {
        //     console.log('aa');

//     openTable("usersTable"); // Default to users table on page load
        // });

async function getWinnerNumber() {
            console.log('Fetching winner numbers...');
            const token = localStorage.getItem("token");

if (!token) {
                console.error('Token not found in localStorage');
                return;
            }

try {
                const response = await fetch(GETMARKETRESULT_URL, {
                    method: "GET",
                    headers: {
                        Authorization: `Bearer ${token}`,
                        "Content-Type": "application/json"
                    },
                });

// Check if the response is successful
                if (!response.ok) {
                    throw new Error(`Failed to fetch results: ${response.status} ${response.statusText}`);
                }

// Parse JSON response
                const data = await response.json();

// Check if results exist
                if (data && data.results) {
                    console.log('Results fetched:', data);
                    populateResults(data);
                } else {
                    console.warn('No results found in the response');
                }
            } catch (e) {
                console.error('Error fetching winner numbers:', e);
            }
        }

function populateResults(data) {
            console.log('Populating results:', data);

const goldResult = document.getElementById("winnnerNumber");

// Clear previous results
            goldResult.innerHTML = "";

if (data && data.results && Array.isArray(data.results)) {
                data.results.forEach(({ market, winnerNumber }) => {
                    const div = document.createElement("div");
                    div.innerHTML = `
                <p><strong>Market:</strong> ${market}</p>
                <p><strong>Winner:</strong> ${winnerNumber}</p>
            `;
                    goldResult.appendChild(div);
                });
            } else {
                goldResult.innerHTML = "<p>No results available</p>";
            }
        }

</script>
</body>

</html>

BATAL