Scribd
Upload
3 views60 pages

E-Time Store Admin Panel Design

The document is an HTML template for an admin panel of an online store called E-Time Store. It includes various UI components such as charts, buttons, input fields, and a preloader, styled with CSS for a modern look. The template also integrates Firebase SDK for backend functionality and uses Chart.js for data visualization.

Uploaded by

neta
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
3 views60 pages

E-Time Store Admin Panel Design

The document is an HTML template for an admin panel of an online store called E-Time Store. It includes various UI components such as charts, buttons, input fields, and a preloader, styled with CSS for a modern look. The template also integrates Firebase SDK for backend functionality and uses Chart.js for data visualization.

Uploaded by

neta
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-
scale=1.0, user-scalable=no">
<title>E-Time Store - Admin Panel</title>

<!-- Firebase SDK -->


<script src="[Link]
[Link]"></script>
<script src="[Link]
[Link]"></script>
<script src="[Link]
[Link]"></script>
<script src="[Link]
[Link]"></script>
<script src="[Link]
[Link]"></script>

<!-- [Link] -->


<script src="[Link]

<!-- Font Awesome for Icons -->


<link rel="stylesheet" href="[Link]
awesome/6.4.0/css/[Link]">

<!-- Google Fonts -->


<link href="[Link]
family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">

<style>
:root {
--primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
--secondary-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c
100%);
--success-gradient: linear-gradient(135deg, #13f1fc 0%, #0470dc 100%);
--warning-gradient: linear-gradient(135deg, #f9d423 0%, #ff4e50 100%);
--dark-gradient: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
--glass-bg: rgba(255, 255, 255, 0.1);
--glass-border: rgba(255, 255, 255, 0.2);
--text-primary: #ffffff;
--text-secondary: rgba(255, 255, 255, 0.8);
--shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
--shadow-neon: 0 0 15px rgba(102, 126, 234, 0.8);
}

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

body {
font-family: 'Poppins', sans-serif;
background: linear-gradient(135deg, #1a1a2e 0%, #0f0f1e 100%);
color: var(--text-primary);
min-height: 100vh;
overflow-x: hidden;
position: relative;
}

/* Animated Background */
.bg-animation {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
opacity: 0.5;
}

.bg-animation span {
position: absolute;
display: block;
width: 20px;
height: 20px;
background: rgba(255, 255, 255, 0.2);
animation: move 25s linear infinite;
bottom: -150px;
}

.bg-animation span:nth-child(1) {
left: 25%;
width: 80px;
height: 80px;
animation-delay: 0s;
}

.bg-animation span:nth-child(2) {
left: 10%;
width: 20px;
height: 20px;
animation-delay: 2s;
animation-duration: 12s;
}

.bg-animation span:nth-child(3) {
left: 70%;
width: 20px;
height: 20px;
animation-delay: 4s;
}

.bg-animation span:nth-child(4) {
left: 40%;
width: 60px;
height: 60px;
animation-delay: 0s;
animation-duration: 18s;
}

.bg-animation span:nth-child(5) {
left: 65%;
width: 20px;
height: 20px;
animation-delay: 0s;
}

.bg-animation span:nth-child(6) {
left: 75%;
width: 110px;
height: 110px;
animation-delay: 3s;
}

.bg-animation span:nth-child(7) {
left: 35%;
width: 150px;
height: 150px;
animation-delay: 7s;
}

.bg-animation span:nth-child(8) {
left: 50%;
width: 25px;
height: 25px;
animation-delay: 15s;
animation-duration: 45s;
}

.bg-animation span:nth-child(9) {
left: 20%;
width: 15px;
height: 15px;
animation-delay: 2s;
animation-duration: 35s;
}

.bg-animation span:nth-child(10) {
left: 85%;
width: 150px;
height: 150px;
animation-delay: 0s;
animation-duration: 11s;
}

@keyframes move {
0% {
transform: translateY(0) rotate(0deg);
opacity: 1;
border-radius: 0;
}
100% {
transform: translateY(-1000px) rotate(720deg);
opacity: 0;
border-radius: 50%;
}
}

/* Glassmorphism Card */
.glass-card {
background: var(--glass-bg);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border-radius: 20px;
border: 1px solid var(--glass-border);
box-shadow: var(--shadow);
padding: 20px;
margin-bottom: 20px;
animation: fadeIn 0.5s ease-in-out;
}

@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/* Neon Button */
.neon-btn {
background: var(--primary-gradient);
border: none;
border-radius: 50px;
padding: 12px 30px;
color: white;
font-weight: 600;
cursor: pointer;
box-shadow: var(--shadow-neon);
transition: all 0.3s ease;
position: relative;
overflow: hidden;
display: inline-block;
}

.neon-btn:before {
content: "";
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255,
0.2), transparent);
transition: 0.5s;
}

.neon-btn:hover:before {
left: 100%;
}

.neon-btn:hover {
transform: translateY(-3px);
box-shadow: 0 0 20px rgba(102, 126, 234, 0.8);
}

.neon-btn:active {
transform: scale(0.98);
}
/* Input Fields */
.input-group {
margin-bottom: 20px;
position: relative;
}

.input-group input, .input-group select, .input-group textarea {


width: 100%;
padding: 15px;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
color: white;
font-size: 16px;
transition: all 0.3s ease;
}

.input-group input::placeholder, .input-group textarea::placeholder {


color: rgba(255, 255, 255, 0.5);
}

.input-group input:focus, .input-group select:focus, .input-group


textarea:focus {
outline: none;
border-color: #667eea;
box-shadow: 0 0 10px rgba(102, 126, 234, 0.5);
}

.input-group label {
display: block;
margin-bottom: 8px;
font-weight: 500;
color: var(--text-secondary);
}

/* Preloader */
.preloader {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(135deg, #1a1a2e 0%, #0f0f1e 100%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
z-index: 9999;
transition: opacity 0.5s ease;
}

.[Link] {
opacity: 0;
pointer-events: none;
}

.preloader-logo {
width: 120px;
height: 120px;
background: var(--primary-gradient);
border-radius: 30px;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 20px;
animation: pulse 2s infinite;
}

@keyframes pulse {
0% {
transform: scale(1);
box-shadow: 0 0 0 0 rgba(102, 126, 234, 0.7);
}
70% {
transform: scale(1.05);
box-shadow: 0 0 0 20px rgba(102, 126, 234, 0);
}
100% {
transform: scale(1);
box-shadow: 0 0 0 0 rgba(102, 126, 234, 0);
}
}

.preloader-text {
font-size: 24px;
font-weight: 700;
background: var(--primary-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.spinner {
width: 50px;
height: 50px;
border: 3px solid rgba(255, 255, 255, 0.1);
border-radius: 50%;
border-top-color: #667eea;
animation: spin 1s ease-in-out infinite;
margin-top: 20px;
}

@keyframes spin {
to { transform: rotate(360deg); }
}

/* Container */
.container {
max-width: 1200px;
margin: 0 auto;
padding: 20px;
}

/* Auth Screens */
.auth-container {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 20px;
}

.auth-card {
width: 100%;
max-width: 400px;
}

.auth-logo {
text-align: center;
margin-bottom: 30px;
}

.auth-logo h1 {
font-size: 32px;
font-weight: 700;
background: var(--primary-gradient);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 5px;
}

.auth-logo p {
color: var(--text-secondary);
}

/* Admin Header */
.admin-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
flex-wrap: wrap;
}

.admin-title {
font-size: 24px;
font-weight: 600;
}

.admin-actions {
display: flex;
gap: 10px;
}

.admin-btn {
padding: 10px 20px;
background: rgba(255, 255, 255, 0.1);
border: 1px solid rgba(255, 255, 255, 0.2);
border-radius: 10px;
color: white;
font-weight: 500;
cursor: pointer;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 8px;
}
.admin-btn:hover {
background: rgba(255, 255, 255, 0.2);
transform: translateY(-2px);
}

/* Stats Grid */
.stats-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 20px;
margin-bottom: 30px;
}

.stat-card {
background: rgba(255, 255, 255, 0.05);
border-radius: 15px;
padding: 20px;
display: flex;
align-items: center;
}

.stat-icon {
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
justify-content: center;
align-items: center;
margin-right: 15px;
font-size: 20px;
}

.[Link] {
background: var(--primary-gradient);
}

.[Link] {
background: var(--success-gradient);
}

.[Link] {
background: var(--warning-gradient);
}

.[Link] {
background: var(--secondary-gradient);
}

.stat-info h3 {
font-size: 24px;
font-weight: 600;
margin-bottom: 5px;
}

.stat-info p {
font-size: 14px;
color: var(--text-secondary);
}
/* Charts Container */
.charts-container {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 20px;
margin-bottom: 30px;
}

.chart-card {
background: rgba(255, 255, 255, 0.05);
border-radius: 15px;
padding: 20px;
}

.chart-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 15px;
}

/* Table */
.table-container {
overflow-x: auto;
}

table {
width: 100%;
border-collapse: collapse;
}

th, td {
padding: 12px 15px;
text-align: left;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

th {
background: rgba(255, 255, 255, 0.05);
font-weight: 600;
color: var(--text-secondary);
}

tr:hover {
background: rgba(255, 255, 255, 0.05);
}

.status-badge {
display: inline-block;
padding: 4px 10px;
border-radius: 20px;
font-size: 12px;
font-weight: 500;
}

.[Link] {
background: rgba(19, 241, 252, 0.2);
color: #13f1fc;
}
.[Link] {
background: rgba(255, 78, 80, 0.2);
color: #ff4e50;
}

.[Link] {
background: rgba(249, 212, 35, 0.2);
color: #f9d423;
}

.[Link] {
background: rgba(19, 241, 252, 0.2);
color: #13f1fc;
}

.[Link] {
background: rgba(255, 78, 80, 0.2);
color: #ff4e50;
}

/* Action Buttons */
.action-btns {
display: flex;
gap: 5px;
}

.action-btn {
width: 30px;
height: 30px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
transition: all 0.3s ease;
}

.action-btn:hover {
background: rgba(255, 255, 255, 0.2);
transform: scale(1.1);
}

.[Link] {
color: #667eea;
}

.[Link] {
color: #ff4e50;
}

.[Link] {
color: #13f1fc;
}

.[Link] {
color: #ff4e50;
}
/* Tabs */
.tabs {
display: flex;
margin-bottom: 20px;
background: rgba(255, 255, 255, 0.05);
border-radius: 15px;
padding: 5px;
overflow-x: auto;
}

.tab {
padding: 10px 20px;
border-radius: 10px;
cursor: pointer;
transition: all 0.3s ease;
font-weight: 500;
white-space: nowrap;
}

.[Link] {
background: var(--primary-gradient);
}

/* Tab Content */
.tab-content {
display: none;
}

.[Link] {
display: block;
}

/* Modal */
.modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
display: flex;
justify-content: center;
align-items: center;
z-index: 2000;
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
}

.[Link] {
opacity: 1;
visibility: visible;
}

.modal-content {
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
border-radius: 20px;
padding: 30px;
width: 90%;
max-width: 500px;
max-height: 80vh;
overflow-y: auto;
transform: scale(0.8);
transition: all 0.3s ease;
position: relative;
}

.[Link] .modal-content {
transform: scale(1);
}

.modal-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}

.modal-title {
font-size: 20px;
font-weight: 600;
}

.modal-close {
width: 30px;
height: 30px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.1);
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
transition: all 0.3s ease;
}

.modal-close:hover {
background: rgba(255, 255, 255, 0.2);
transform: rotate(90deg);
}

/* Form Groups */
.form-row {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 15px;
}

/* Switch */
.switch {
position: relative;
display: inline-block;
width: 50px;
height: 24px;
}

.switch input {
opacity: 0;
width: 0;
height: 0;
}

.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(255, 255, 255, 0.2);
transition: .4s;
border-radius: 24px;
}

.slider:before {
position: absolute;
content: "";
height: 18px;
width: 18px;
left: 3px;
bottom: 3px;
background-color: white;
transition: .4s;
border-radius: 50%;
}

input:checked + .slider {
background-color: #667eea;
}

input:checked + .slider:before {
transform: translateX(26px);
}

/* Toast Notification */
.toast {
position: fixed;
bottom: 30px;
left: 50%;
transform: translateX(-50%) translateY(100px);
background: rgba(26, 26, 46, 0.95);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border-radius: 50px;
padding: 15px 25px;
color: white;
font-weight: 500;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
opacity: 0;
visibility: hidden;
transition: all 0.3s ease;
z-index: 3000;
}

.[Link] {
opacity: 1;
visibility: visible;
transform: translateX(-50%) translateY(0);
}

.[Link] {
background: rgba(19, 241, 252, 0.9);
}

.[Link] {
background: rgba(255, 78, 80, 0.9);
}

.[Link] {
background: rgba(249, 212, 35, 0.9);
}

/* Responsive */
@media (max-width: 768px) {
.container {
padding: 15px;
}

.admin-header {
flex-direction: column;
align-items: flex-start;
gap: 15px;
}

.stats-grid {
grid-template-columns: 1fr;
}

.charts-container {
grid-template-columns: 1fr;
}

.tabs {
flex-wrap: nowrap;
overflow-x: auto;
}
}
</style>
</head>
<body>
<!-- Animated Background -->
<div class="bg-animation">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>

<!-- Preloader -->


<div class="preloader" id="preloader">
<div class="preloader-logo">
<i class="fas fa-clock" style="font-size: 50px; color: white;"></i>
</div>
<div class="preloader-text">E-Time Store Admin</div>
<div class="spinner"></div>
</div>

<!-- Auth Container -->


<div class="auth-container" id="authContainer">
<div class="auth-card glass-card">
<div class="auth-logo">
<h1>E-Time Store</h1>
<p>Admin Panel</p>
</div>

<div class="input-group">
<label>Email</label>
<input type="email" id="adminEmail" placeholder="Enter admin
email">
</div>
<div class="input-group">
<label>Password</label>
<input type="password" id="adminPassword" placeholder="Enter admin
password">
</div>
<button class="neon-btn" id="adminLoginBtn" style="width:
100%;">Login</button>
</div>
</div>

<!-- Main App Container -->


<div class="container" id="appContainer" style="display: none;">
<div class="admin-header">
<h2 class="admin-title">Admin Dashboard</h2>
<div class="admin-actions">
<button class="admin-btn" id="refreshBtn">
<i class="fas fa-sync-alt"></i> Refresh
</button>
<button class="admin-btn" id="logoutBtn">
<i class="fas fa-sign-out-alt"></i> Logout
</button>
</div>
</div>

<!-- Stats Grid -->


<div class="stats-grid">
<div class="stat-card">
<div class="stat-icon users">
<i class="fas fa-users"></i>
</div>
<div class="stat-info">
<h3 id="totalUsers">0</h3>
<p>Total Users</p>
</div>
</div>
<div class="stat-card">
<div class="stat-icon active">
<i class="fas fa-user-check"></i>
</div>
<div class="stat-info">
<h3 id="activeUsers">0</h3>
<p>Active Users</p>
</div>
</div>
<div class="stat-card">
<div class="stat-icon deposit">
<i class="fas fa-arrow-down"></i>
</div>
<div class="stat-info">
<h3 id="totalDeposit">BDT 0</h3>
<p>Total Deposit</p>
</div>
</div>
<div class="stat-card">
<div class="stat-icon withdraw">
<i class="fas fa-arrow-up"></i>
</div>
<div class="stat-info">
<h3 id="totalWithdraw">BDT 0</h3>
<p>Total Withdraw</p>
</div>
</div>
</div>

<!-- Charts -->


<div class="charts-container">
<div class="chart-card">
<h3 class="chart-title">User Registration</h3>
<canvas id="userChart"></canvas>
</div>
<div class="chart-card">
<h3 class="chart-title">Income Overview</h3>
<canvas id="incomeChart"></canvas>
</div>
</div>

<!-- Tabs -->


<div class="tabs">
<div class="tab active" data-tab="users">Users</div>
<div class="tab" data-tab="deposits">Deposits</div>
<div class="tab" data-tab="withdrawals">Withdrawals</div>
<div class="tab" data-tab="plans">Plans</div>
<div class="tab" data-tab="tasks">Tasks</div>
<div class="tab" data-tab="notices">Notices</div>
<div class="tab" data-tab="settings">Settings</div>
</div>

<!-- Tab Contents -->


<!-- Users Tab -->
<div class="tab-content active" id="usersTab">
<div class="glass-card">
<div class="admin-header">
<h3>User Management</h3>
<button class="admin-btn" id="addUserBtn">
<i class="fas fa-plus"></i> Add User
</button>
</div>
<div class="input-group">
<input type="text" id="userSearch" placeholder="Search users by
name, email, or ID">
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Status</th>
<th>Plan</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="usersTableBody">
<tr>
<td colspan="7" style="text-align: center;">Loading
users...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Deposits Tab -->


<div class="tab-content" id="depositsTab">
<div class="glass-card">
<div class="admin-header">
<h3>Deposit Management</h3>
<button class="admin-btn" id="updatePaymentNumbersBtn">
<i class="fas fa-edit"></i> Update Numbers
</button>
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>ID</th>
<th>User</th>
<th>Amount</th>
<th>Method</th>
<th>Transaction ID</th>
<th>Status</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="depositsTableBody">
<tr>
<td colspan="8" style="text-align: center;">Loading
deposits...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Withdrawals Tab -->


<div class="tab-content" id="withdrawalsTab">
<div class="glass-card">
<div class="admin-header">
<h3>Withdrawal Management</h3>
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>ID</th>
<th>User</th>
<th>Amount</th>
<th>Method</th>
<th>Account</th>
<th>Status</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="withdrawalsTableBody">
<tr>
<td colspan="8" style="text-align: center;">Loading
withdrawals...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Plans Tab -->


<div class="tab-content" id="plansTab">
<div class="glass-card">
<div class="admin-header">
<h3>Plan Management</h3>
<button class="admin-btn" id="addPlanBtn">
<i class="fas fa-plus"></i> Add Plan
</button>
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>Name</th>
<th>Price</th>
<th>Validity</th>
<th>Direct %</th>
<th>Level %</th>
<th>Benefits</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="plansTableBody">
<tr>
<td colspan="7" style="text-align: center;">Loading
plans...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Tasks Tab -->


<div class="tab-content" id="tasksTab">
<div class="glass-card">
<div class="admin-header">
<h3>Task Management</h3>
<button class="admin-btn" id="addTaskBtn">
<i class="fas fa-plus"></i> Add Task
</button>
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>Title</th>
<th>Category</th>
<th>Reward</th>
<th>Link</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="tasksTableBody">
<tr>
<td colspan="6" style="text-align: center;">Loading
tasks...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Notices Tab -->


<div class="tab-content" id="noticesTab">
<div class="glass-card">
<div class="admin-header">
<h3>Notice Management</h3>
<button class="admin-btn" id="addNoticeBtn">
<i class="fas fa-plus"></i> Add Notice
</button>
</div>

<div class="table-container">
<table>
<thead>
<tr>
<th>Title</th>
<th>Message</th>
<th>Date</th>
<th>Actions</th>
</tr>
</thead>
<tbody id="noticesTableBody">
<tr>
<td colspan="4" style="text-align: center;">Loading
notices...</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>

<!-- Settings Tab -->


<div class="tab-content" id="settingsTab">
<div class="glass-card">
<h3>Income Settings</h3>

<div class="form-row">
<div class="input-group">
<label>Direct Income %</label>
<input type="number" id="directIncomePercent" min="0"
max="100" step="0.1">
</div>
</div>

<h4 style="margin: 20px 0 15px;">Level Income %</h4>


<div class="form-row" id="levelIncomeInputs">
<!-- Level income inputs will be generated here -->
</div>

<h4 style="margin: 20px 0 15px;">Bonus Settings</h4>


<div class="form-row">
<div class="input-group">
<label>Signup Bonus</label>
<input type="number" id="signupBonus" min="0" step="0.1">
</div>
<div class="input-group">
<label>Daily Login Bonus</label>
<input type="number" id="dailyLoginBonus" min="0"
step="0.1">
</div>
</div>

<h4 style="margin: 20px 0 15px;">Payment Settings</h4>


<div class="form-row">
<div class="input-group">
<label>Payment Number</label>
<input type="text" id="paymentNumber" placeholder="Enter
payment number">
</div>
</div>

<button class="neon-btn" id="saveIncomeSettingsBtn">Save


Settings</button>
</div>
</div>
</div>

<!-- Modal Container -->


<div class="modal" id="modalContainer">
<div class="modal-content" id="modalContent">
<!-- Modal content will be loaded here -->
</div>
</div>

<!-- Toast Notification -->


<div class="toast" id="toast"></div>

<script>
// Firebase Configuration
const firebaseConfig = {
apiKey: "AIzaSyBebxObI4TiS0J-ha6PnPjUXsg_qQcdSoQ",
authDomain: "[Link]",
databaseURL: "[Link]
projectId: "e-time-store",
storageBucket: "[Link]",
messagingSenderId: "1093486642352",
appId: "1:1093486642352:web:7144c9bdff86d76748a775"
};

// Initialize Firebase
[Link](firebaseConfig);
const auth = [Link]();
const db = [Link]();
const storage = [Link]();
const rtdb = [Link]();

// Global Variables
let currentUser = null;
let userChart = null;
let incomeChart = null;

// DOM Elements
const preloader = [Link]('preloader');
const authContainer = [Link]('authContainer');
const appContainer = [Link]('appContainer');
const modalContainer = [Link]('modalContainer');
const modalContent = [Link]('modalContent');
const toast = [Link]('toast');

// Auth Elements
const adminEmail = [Link]('adminEmail');
const adminPassword = [Link]('adminPassword');
const adminLoginBtn = [Link]('adminLoginBtn');

// App Elements
const refreshBtn = [Link]('refreshBtn');
const logoutBtn = [Link]('logoutBtn');

// Initialize App
[Link]('DOMContentLoaded', () => {
// Check if user is logged in
[Link](user => {
if (user) {
currentUser = user;
showApp();
loadDashboardData();
setupRealtimeListeners();
} else {
showAuth();
}

// Hide preloader after initialization


setTimeout(() => {
[Link]('hidden');
}, 1500);
});

// Setup event listeners


setupAuthListeners();
setupNavigationListeners();
setupActionListeners();
});

// Show Auth Screen


function showAuth() {
[Link] = 'flex';
[Link] = 'none';
}

// Show App Screen


function showApp() {
[Link] = 'none';
[Link] = 'block';
}

// Setup Auth Listeners


function setupAuthListeners() {
[Link]('click', handleAdminLogin);

// Allow login with Enter key


[Link]('keypress', (e) => {
if ([Link] === 'Enter') {
handleAdminLogin();
}
});
}

// Handle Admin Login


function handleAdminLogin() {
const email = [Link];
const password = [Link];

if (!email || !password) {
showToast('Please fill all fields', 'error');
return;
}

showToast('Logging in...', 'info');

[Link](email, password)
.then(() => {
showToast('Login successful', 'success');
})
.catch(error => {
showToast([Link], 'error');
});
}

// Setup Navigation Listeners


function setupNavigationListeners() {
// Tab navigation
const tabs = [Link]('.tab');
[Link](tab => {
[Link]('click', () => {
const tabName = [Link]('data-tab');

// Update active tab


[Link](t => [Link]('active'));
[Link]('active');

// Show corresponding tab content


[Link]('.tab-content').forEach(content => {
[Link]('active');
});
[Link](`$
{tabName}Tab`).[Link]('active');

// Load data for this tab


loadTabData(tabName);
});
});

// Logout
[Link]('click', () => {
if (confirm('Are you sure you want to logout?')) {
[Link]()
.then(() => {
showToast('Logged out successfully', 'success');
})
.catch(error => {
showToast([Link], 'error');
});
}
});

// Refresh
[Link]('click', () => {
loadDashboardData();
const activeTab =
[Link]('.[Link]').getAttribute('data-tab');
loadTabData(activeTab);
showToast('Data refreshed', 'success');
});
}

// Setup Action Listeners


function setupActionListeners() {
// User Management
[Link]('addUserBtn').addEventListener('click',
showAddUserModal);
[Link]('userSearch').addEventListener('input',
filterUsers);

// Deposit Management

[Link]('updatePaymentNumbersBtn').addEventListener('click',
showPaymentNumbersModal);

// Plan Management
[Link]('addPlanBtn').addEventListener('click',
showAddPlanModal);

// Task Management
[Link]('addTaskBtn').addEventListener('click',
showAddTaskModal);

// Notice Management
[Link]('addNoticeBtn').addEventListener('click',
showAddNoticeModal);

// Settings

[Link]('saveIncomeSettingsBtn').addEventListener('click',
saveIncomeSettings);

// Setup level income inputs


setupLevelIncomeInputs();
}

// Setup Level Income Inputs


function setupLevelIncomeInputs() {
const container = [Link]('levelIncomeInputs');
[Link] = '';

for (let i = 1; i <= 15; i++) {


const inputGroup = [Link]('div');
[Link] = 'input-group';
[Link] = `
<label>Level ${i}</label>
<input type="number" id="level${i}IncomePercent" min="0"
max="100" step="0.1">
`;
[Link](inputGroup);
}
}

// Load Dashboard Data


function loadDashboardData() {
// Load stats
loadStats();

// Load charts
loadCharts();
}

// Load Stats
function loadStats() {
// Total users
[Link]('users').get()
.then(snapshot => {
[Link]('totalUsers').textContent =
[Link];
})
.catch(error => {
[Link]('Error loading total users:', error);
});

// Active users
[Link]('users').where('active', '==', true).get()
.then(snapshot => {
[Link]('activeUsers').textContent =
[Link];
})
.catch(error => {
[Link]('Error loading active users:', error);
});

// Total deposit
[Link]('deposits').where('status', '==', 'approved').get()
.then(snapshot => {
let totalDeposit = 0;
[Link](doc => {
totalDeposit += [Link]().amount;
});
[Link]('totalDeposit').textContent = `BDT $
{[Link](2)}`;
})
.catch(error => {
[Link]('Error loading total deposit:', error);
});

// Total withdraw
[Link]('withdrawals').where('status', '==', 'approved').get()
.then(snapshot => {
let totalWithdraw = 0;
[Link](doc => {
totalWithdraw += [Link]().amount;
});
[Link]('totalWithdraw').textContent = `BDT $
{[Link](2)}`;
})
.catch(error => {
[Link]('Error loading total withdraw:', error);
});
}

// Load Charts
function loadCharts() {
// User registration chart
const userCtx = [Link]('userChart').getContext('2d');

// Get user registration data for last 7 days


const userChartData = {
labels: [],
data: []
};

for (let i = 6; i >= 0; i--) {


const date = new Date();
[Link]([Link]() - i);
const dateStr = [Link]('en-US', { month: 'short',
day: 'numeric' });
[Link](dateStr);

// Get user count for this day


const startOfDay = new Date(date);
[Link](0, 0, 0, 0);
const endOfDay = new Date(date);
[Link](23, 59, 59, 999);

[Link]('users')
.where('joinDate', '>=', startOfDay)
.where('joinDate', '<=', endOfDay)
.get()
.then(snapshot => {
[Link]([Link]);

// Update chart when all data is loaded


if ([Link] === 7) {
if (userChart) {
[Link]();
}

userChart = new Chart(userCtx, {


type: 'line',
data: {
labels: [Link],
datasets: [{
label: 'New Users',
data: [Link],
borderColor: '#667eea',
backgroundColor: 'rgba(102, 126, 234,
0.1)',
tension: 0.4
}]
},
options: {
responsive: true,
plugins: {
legend: {
display: false
}
},
scales: {
y: {
beginAtZero: true,
grid: {
color: 'rgba(255, 255, 255, 0.1)'
},
ticks: {
color: 'rgba(255, 255, 255, 0.7)'
}
},
x: {
grid: {
color: 'rgba(255, 255, 255, 0.1)'
},
ticks: {
color: 'rgba(255, 255, 255, 0.7)'
}
}
}
}
});
}
})
.catch(error => {
[Link]('Error loading user chart data:', error);
});
}

// Income overview chart


const incomeCtx =
[Link]('incomeChart').getContext('2d');

if (incomeChart) {
[Link]();
}

incomeChart = new Chart(incomeCtx, {


type: 'bar',
data: {
labels: ['Direct Income', 'Level Income', 'Bonus Income'],
datasets: [{
label: 'Income',
data: [0, 0, 0],
backgroundColor: [
'rgba(102, 126, 234, 0.7)',
'rgba(240, 147, 251, 0.7)',
'rgba(19, 241, 252, 0.7)'
],
borderColor: [
'rgba(102, 126, 234, 1)',
'rgba(240, 147, 251, 1)',
'rgba(19, 241, 252, 1)'
],
borderWidth: 1
}]
},
options: {
responsive: true,
plugins: {
legend: {
display: false
}
},
scales: {
y: {
beginAtZero: true,
grid: {
color: 'rgba(255, 255, 255, 0.1)'
},
ticks: {
color: 'rgba(255, 255, 255, 0.7)'
}
},
x: {
grid: {
color: 'rgba(255, 255, 255, 0.1)'
},
ticks: {
color: 'rgba(255, 255, 255, 0.7)'
}
}
}
}
});

// Get income data


[Link]('users').get()
.then(snapshot => {
let directIncome = 0;
let levelIncome = 0;
let bonusIncome = 0;

[Link](doc => {
const userData = [Link]();
directIncome += [Link] || 0;
levelIncome += [Link] || 0;
bonusIncome += [Link] || 0;
});

[Link][0].data = [directIncome, levelIncome,


bonusIncome];
[Link]();
})
.catch(error => {
[Link]('Error loading income data:', error);
});
}

// Setup Realtime Listeners


function setupRealtimeListeners() {
// Listen for new deposits
[Link]('deposits').onSnapshot(snapshot => {
loadStats();
if
([Link]('depositsTab').[Link]('active')) {
loadDeposits();
}
});

// Listen for new withdrawals


[Link]('withdrawals').onSnapshot(snapshot => {
loadStats();
if
([Link]('withdrawalsTab').[Link]('active')) {
loadWithdrawals();
}
});
}

// Load Tab Data


function loadTabData(tabName) {
switch (tabName) {
case 'users':
loadUsers();
break;
case 'deposits':
loadDeposits();
break;
case 'withdrawals':
loadWithdrawals();
break;
case 'plans':
loadPlans();
break;
case 'tasks':
loadTasks();
break;
case 'notices':
loadNotices();
break;
case 'settings':
loadSettings();
break;
}
}

// Load Users
function loadUsers() {
const usersTableBody = [Link]('usersTableBody');
[Link] = '<tr><td colspan="7" style="text-align:
center;">Loading users...</td></tr>';

[Link]('users').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="7"
style="text-align: center;">No users found</td></tr>';
return;
}

[Link](doc => {
const userData = [Link]();
const row = [Link]('tr');

const statusBadge = [Link]


? '<span class="status-badge active">Active</span>'
: '<span class="status-badge
inactive">Inactive</span>';

[Link] = `
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>${statusBadge}</td>
<td>${[Link] ?
[Link](0).toUpperCase() + [Link](1) : 'Free'}</td>
<td>
<div class="action-btns">
<div class="action-btn edit" data-user-id="$
{[Link]}">
<i class="fas fa-edit"></i>
</div>
<div class="action-btn delete" data-user-id="$
{[Link]}">
<i class="fas fa-trash"></i>
</div>
</div>
</td>
`;

[Link](row);
});

// Add event listeners to action buttons


[Link]('.[Link]').forEach(btn => {
[Link]('click', (e) => {
const userId = [Link]('data-user-
id');
showEditUserModal(userId);
});
});

[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const userId = [Link]('data-user-
id');
if (confirm('Are you sure you want to delete this
user?')) {
deleteUser(userId);
}
});
});
})
.catch(error => {
[Link]('Error loading users:', error);
[Link] = '<tr><td colspan="7" style="text-
align: center;">Error loading users</td></tr>';
});
}

// Filter Users
function filterUsers() {
const searchTerm =
[Link]('userSearch').[Link]();
const rows = [Link]('#usersTableBody tr');

[Link](row => {
const text = [Link]();
[Link] = [Link](searchTerm) ? '' : 'none';
});
}

// Load Deposits
function loadDeposits() {
const depositsTableBody = [Link]('depositsTableBody');
[Link] = '<tr><td colspan="8" style="text-align:
center;">Loading deposits...</td></tr>';

[Link]('deposits').orderBy('date', 'desc').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="8"
style="text-align: center;">No deposits found</td></tr>';
return;
}

[Link](doc => {
const depositData = [Link]();
const row = [Link]('tr');

let statusBadge = '';


switch ([Link]) {
case 'pending':
statusBadge = '<span class="status-badge
pending">Pending</span>';
break;
case 'approved':
statusBadge = '<span class="status-badge
approved">Approved</span>';
break;
case 'rejected':
statusBadge = '<span class="status-badge
rejected">Rejected</span>';
break;
default:
statusBadge = '<span class="status-badge
pending">Unknown</span>';
}

[Link] = `
<td>${[Link](0, 8)}</td>
<td>${[Link] || 'N/A'}</td>
<td>BDT ${[Link] || 0}</td>
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>${statusBadge}</td>
<td>${[Link] ? new
Date([Link]()).toLocaleDateString() : 'N/A'}</td>
<td>
<div class="action-btns">
${[Link] === 'pending' ? `
<div class="action-btn approve" data-
deposit-id="${[Link]}">
<i class="fas fa-check"></i>
</div>
<div class="action-btn reject" data-
deposit-id="${[Link]}">
<i class="fas fa-times"></i>
</div>
` : ''}
</div>
</td>
`;
[Link](row);
});

// Add event listeners to action buttons


[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const depositId = [Link]('data-
deposit-id');
approveDeposit(depositId);
});
});

[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const depositId = [Link]('data-
deposit-id');
if (confirm('Are you sure you want to reject this
deposit?')) {
rejectDeposit(depositId);
}
});
});
})
.catch(error => {
[Link]('Error loading deposits:', error);
[Link] = '<tr><td colspan="8" style="text-
align: center;">Error loading deposits</td></tr>';
});
}

// Load Withdrawals
function loadWithdrawals() {
const withdrawalsTableBody =
[Link]('withdrawalsTableBody');
[Link] = '<tr><td colspan="8" style="text-
align: center;">Loading withdrawals...</td></tr>';

[Link]('withdrawals').orderBy('date', 'desc').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="8"
style="text-align: center;">No withdrawals found</td></tr>';
return;
}

[Link](doc => {
const withdrawalData = [Link]();
const row = [Link]('tr');

let statusBadge = '';


switch ([Link]) {
case 'pending':
statusBadge = '<span class="status-badge
pending">Pending</span>';
break;
case 'approved':
statusBadge = '<span class="status-badge
approved">Approved</span>';
break;
case 'rejected':
statusBadge = '<span class="status-badge
rejected">Rejected</span>';
break;
default:
statusBadge = '<span class="status-badge
pending">Unknown</span>';
}

[Link] = `
<td>${[Link](0, 8)}</td>
<td>${[Link] || 'N/A'}</td>
<td>BDT ${[Link] || 0}</td>
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>${statusBadge}</td>
<td>${[Link] ? new
Date([Link]()).toLocaleDateString() : 'N/A'}</td>
<td>
<div class="action-btns">
${[Link] === 'pending' ? `
<div class="action-btn approve" data-
withdrawal-id="${[Link]}">
<i class="fas fa-check"></i>
</div>
<div class="action-btn reject" data-
withdrawal-id="${[Link]}">
<i class="fas fa-times"></i>
</div>
` : ''}
</div>
</td>
`;

[Link](row);
});

// Add event listeners to action buttons


[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const withdrawalId =
[Link]('data-withdrawal-id');
approveWithdrawal(withdrawalId);
});
});

[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const withdrawalId =
[Link]('data-withdrawal-id');
if (confirm('Are you sure you want to reject this
withdrawal?')) {
rejectWithdrawal(withdrawalId);
}
});
});
})
.catch(error => {
[Link]('Error loading withdrawals:', error);
[Link] = '<tr><td colspan="8"
style="text-align: center;">Error loading withdrawals</td></tr>';
});
}

// Load Plans
function loadPlans() {
const plansTableBody = [Link]('plansTableBody');
[Link] = '<tr><td colspan="7" style="text-align:
center;">Loading plans...</td></tr>';

[Link]('plans').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="7"
style="text-align: center;">No plans found</td></tr>';
return;
}

[Link](doc => {
const planData = [Link]();
const row = [Link]('tr');

[Link] = `
<td>${[Link] || 'N/A'}</td>
<td>BDT ${[Link] || 0}</td>
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 0}%</td>
<td>${[Link] ?
[Link](', ') : 'N/A'}</td>
<td>${[Link] ? [Link](',
') : 'N/A'}</td>
<td>
<div class="action-btns">
<div class="action-btn edit" data-plan-id="$
{[Link]}">
<i class="fas fa-edit"></i>
</div>
<div class="action-btn delete" data-plan-id="$
{[Link]}">
<i class="fas fa-trash"></i>
</div>
</div>
</td>
`;

[Link](row);
});

// Add event listeners to action buttons


[Link]('#plansTableBody .action-
[Link]').forEach(btn => {
[Link]('click', (e) => {
const planId = [Link]('data-plan-
id');
showEditPlanModal(planId);
});
});

[Link]('#plansTableBody .action-
[Link]').forEach(btn => {
[Link]('click', (e) => {
const planId = [Link]('data-plan-
id');
if (confirm('Are you sure you want to delete this
plan?')) {
deletePlan(planId);
}
});
});
})
.catch(error => {
[Link]('Error loading plans:', error);
[Link] = '<tr><td colspan="7" style="text-
align: center;">Error loading plans</td></tr>';
});
}

// Load Tasks
function loadTasks() {
const tasksTableBody = [Link]('tasksTableBody');
[Link] = '<tr><td colspan="6" style="text-align:
center;">Loading tasks...</td></tr>';

[Link]('tasks').orderBy('date', 'desc').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="6"
style="text-align: center;">No tasks found</td></tr>';
return;
}

[Link](doc => {
const taskData = [Link]();
const row = [Link]('tr');

[Link] = `
<td>${[Link] || 'N/A'}</td>
<td>${[Link] || 'N/A'}</td>
<td>BDT ${[Link] || 0}</td>
<td>${[Link] ? `<a href="${[Link]}"
target="_blank" style="color: #667eea;">View Link</a>` : 'N/A'}</td>
<td>${[Link] ? new
Date([Link]()).toLocaleDateString() : 'N/A'}</td>
<td>
<div class="action-btns">
<div class="action-btn edit" data-task-id="$
{[Link]}">
<i class="fas fa-edit"></i>
</div>
<div class="action-btn delete" data-task-id="$
{[Link]}">
<i class="fas fa-trash"></i>
</div>
</div>
</td>
`;

[Link](row);
});

// Add event listeners to action buttons


[Link]('#tasksTableBody .action-
[Link]').forEach(btn => {
[Link]('click', (e) => {
const taskId = [Link]('data-task-
id');
showEditTaskModal(taskId);
});
});

[Link]('#tasksTableBody .action-
[Link]').forEach(btn => {
[Link]('click', (e) => {
const taskId = [Link]('data-task-
id');
if (confirm('Are you sure you want to delete this
task?')) {
deleteTask(taskId);
}
});
});
})
.catch(error => {
[Link]('Error loading tasks:', error);
[Link] = '<tr><td colspan="6" style="text-
align: center;">Error loading tasks</td></tr>';
});
}

// Load Notices
function loadNotices() {
const noticesTableBody = [Link]('noticesTableBody');
[Link] = '<tr><td colspan="4" style="text-align:
center;">Loading notices...</td></tr>';

[Link]('notices').orderBy('date', 'desc').get()
.then(snapshot => {
[Link] = '';

if ([Link]) {
[Link] = '<tr><td colspan="4"
style="text-align: center;">No notices found</td></tr>';
return;
}
[Link](doc => {
const noticeData = [Link]();
const row = [Link]('tr');

[Link] = `
<td>${[Link] || 'N/A'}</td>
<td>${[Link] ?
[Link](0, 50) + '...' : 'N/A'}</td>
<td>${[Link] ? new
Date([Link]()).toLocaleDateString() : 'N/A'}</td>
<td>
<div class="action-btns">
<div class="action-btn edit" data-notice-id="$
{[Link]}">
<i class="fas fa-edit"></i>
</div>
<div class="action-btn delete" data-notice-
id="${[Link]}">
<i class="fas fa-trash"></i>
</div>
</div>
</td>
`;

[Link](row);
});

// Add event listeners to action buttons


[Link]('.[Link]').forEach(btn => {
[Link]('click', (e) => {
const noticeId = [Link]('data-
notice-id');
showEditNoticeModal(noticeId);
});
});

[Link]('.[Link]').forEach(btn =>
{
[Link]('click', (e) => {
const noticeId = [Link]('data-
notice-id');
if (confirm('Are you sure you want to delete this
notice?')) {
deleteNotice(noticeId);
}
});
});
})
.catch(error => {
[Link]('Error loading notices:', error);
[Link] = '<tr><td colspan="4" style="text-
align: center;">Error loading notices</td></tr>';
});
}

// Load Settings
function loadSettings() {
// Load income settings
[Link]('settings/income').once('value')
.then(snapshot => {
if ([Link]()) {
const incomeSettings = [Link]();

[Link]('directIncomePercent').value =
[Link] || 10;

// Load level income percentages


if ([Link]) {
[Link]((percent, index) => {
const input = [Link](`level${index
+ 1}IncomePercent`);
if (input) {
[Link] = percent;
}
});
}

// Load bonus settings


[Link]('signupBonus').value =
[Link] || 0;
[Link]('dailyLoginBonus').value =
[Link] || 0;
}
})
.catch(error => {
[Link]('Error loading income settings:', error);
});

// Load payment settings


[Link]('settings/paymentNumber').once('value')
.then(snapshot => {
if ([Link]()) {
[Link]('paymentNumber').value =
[Link]();
}
})
.catch(error => {
[Link]('Error loading payment settings:', error);
});
}

// Save Income Settings


function saveIncomeSettings() {
const directIncome =
parseFloat([Link]('directIncomePercent').value) || 10;
const signupBonus =
parseFloat([Link]('signupBonus').value) || 0;
const dailyLoginBonus =
parseFloat([Link]('dailyLoginBonus').value) || 0;
const paymentNumber = [Link]('paymentNumber').value;

// Get level income percentages


const levelIncome = [];
for (let i = 1; i <= 15; i++) {
const input = [Link](`level${i}IncomePercent`);
if (input) {
[Link](parseFloat([Link]) || 0);
}
}

// Save income settings


[Link]('settings/income').set({
direct: directIncome,
levels: levelIncome,
signupBonus: signupBonus,
dailyLoginBonus: dailyLoginBonus
})
.then(() => {
// Save payment settings
return [Link]('settings/paymentNumber').set(paymentNumber);
})
.then(() => {
showToast('Settings saved successfully', 'success');
})
.catch(error => {
[Link]('Error saving settings:', error);
showToast('Error saving settings', 'error');
});
}

// Show Add User Modal


function showAddUserModal() {
[Link] = `
<div class="modal-header">
<h3 class="modal-title">Add User</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Name</label>
<input type="text" id="newUserName" placeholder="Enter user
name">
</div>

<div class="input-group">
<label>Email</label>
<input type="email" id="newUserEmail" placeholder="Enter user
email">
</div>

<div class="input-group">
<label>Phone</label>
<input type="tel" id="newUserPhone" placeholder="Enter user
phone">
</div>

<div class="input-group">
<label>Password</label>
<input type="password" id="newUserPassword" placeholder="Enter
password">
</div>

<div class="input-group">
<label>Plan</label>
<select id="newUserPlan">
<option value="free">Free</option>
<option value="basic">Basic</option>
<option value="premium">Premium</option>
<option value="vip">VIP</option>
</select>
</div>

<div class="input-group">
<div style="display: flex; justify-content: space-between;
align-items: center;">
<label>Active</label>
<label class="switch">
<input type="checkbox" id="newUserActive" checked>
<span class="slider"></span>
</label>
</div>
</div>

<button class="neon-btn" id="addUserSubmitBtn" style="width:


100%;">Add User</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-close').addEventListener('click', () =>
{
[Link]('active');
});

[Link]('addUserSubmitBtn').addEventListener('click',
addUser);
}

// Add User
function addUser() {
const name = [Link]('newUserName').value;
const email = [Link]('newUserEmail').value;
const phone = [Link]('newUserPhone').value;
const password = [Link]('newUserPassword').value;
const plan = [Link]('newUserPlan').value;
const active = [Link]('newUserActive').checked;

if (!name || !email || !phone || !password) {


showToast('Please fill all required fields', 'error');
return;
}

// Create user in Firebase Auth


[Link](email, password)
.then(userCredential => {
const user = [Link];

// Generate unique ID
const userId = 'ET' + [Link]().toString().slice(-6);

// Create user profile in Firestore


return [Link]('users').doc([Link]).set({
id: userId,
name: name,
email: email,
phone: phone,
plan: plan,
active: active,
joinDate: new Date(),
incomeWallet: 0,
mainWallet: 0,
bonusWallet: 0,
directIncome: 0,
levelIncome: 0,
bonusIncome: 0,
totalIncome: 0,
directTeam: 0,
totalTeam: 0,
activeTeam: 0,
lastLogin: new Date(),
dailyLogin: false,
tasksCompleted: 0
});
})
.then(() => {
showToast('User added successfully', 'success');
[Link]('active');

// Reload users
if
([Link]('usersTab').[Link]('active')) {
loadUsers();
}
})
.catch(error => {
[Link]('Error adding user:', error);
showToast([Link], 'error');
});
}

// Show Edit User Modal


function showEditUserModal(userId) {
// Get user data
[Link]('users').doc(userId).get()
.then(doc => {
if ([Link]) {
const userData = [Link]();

[Link] = `
<div class="modal-header">
<h3 class="modal-title">Edit User</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Name</label>
<input type="text" id="editUserName" value="$
{[Link] || ''}">
</div>
<div class="input-group">
<label>Email</label>
<input type="email" id="editUserEmail" value="$
{[Link] || ''}" readonly>
</div>

<div class="input-group">
<label>Phone</label>
<input type="tel" id="editUserPhone" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Plan</label>
<select id="editUserPlan">
<option value="free" ${[Link] === 'free'
? 'selected' : ''}>Free</option>
<option value="basic" ${[Link] ===
'basic' ? 'selected' : ''}>Basic</option>
<option value="premium" ${[Link] ===
'premium' ? 'selected' : ''}>Premium</option>
<option value="vip" ${[Link] === 'vip' ?
'selected' : ''}>VIP</option>
</select>
</div>

<div class="input-group">
<label>Income Wallet</label>
<input type="number" id="editUserIncomeWallet"
value="${[Link] || 0}">
</div>

<div class="input-group">
<label>Main Wallet</label>
<input type="number" id="editUserMainWallet"
value="${[Link] || 0}">
</div>

<div class="input-group">
<label>Bonus Wallet</label>
<input type="number" id="editUserBonusWallet"
value="${[Link] || 0}">
</div>

<div class="input-group">
<div style="display: flex; justify-content: space-
between; align-items: center;">
<label>Active</label>
<label class="switch">
<input type="checkbox" id="editUserActive"
${[Link] ? 'checked' : ''}>
<span class="slider"></span>
</label>
</div>
</div>

<button class="neon-btn" id="editUserSubmitBtn" data-


user-id="${userId}" style="width: 100%;">Update User</button>
`;
[Link]('active');

// Setup event listeners


[Link]('.modal-
close').addEventListener('click', () => {
[Link]('active');
});

[Link]('editUserSubmitBtn').addEventListener('click', editUser);
}
})
.catch(error => {
[Link]('Error getting user data:', error);
showToast('Error getting user data', 'error');
});
}

// Edit User
function editUser(e) {
const userId = [Link]('data-user-id');
const name = [Link]('editUserName').value;
const phone = [Link]('editUserPhone').value;
const plan = [Link]('editUserPlan').value;
const incomeWallet =
parseFloat([Link]('editUserIncomeWallet').value) || 0;
const mainWallet =
parseFloat([Link]('editUserMainWallet').value) || 0;
const bonusWallet =
parseFloat([Link]('editUserBonusWallet').value) || 0;
const active = [Link]('editUserActive').checked;

if (!name || !phone) {
showToast('Please fill all required fields', 'error');
return;
}

[Link]('users').doc(userId).update({
name: name,
phone: phone,
plan: plan,
incomeWallet: incomeWallet,
mainWallet: mainWallet,
bonusWallet: bonusWallet,
active: active
})
.then(() => {
showToast('User updated successfully', 'success');
[Link]('active');

// Reload users
if
([Link]('usersTab').[Link]('active')) {
loadUsers();
}
})
.catch(error => {
[Link]('Error updating user:', error);
showToast('Error updating user', 'error');
});
}

// Delete User
function deleteUser(userId) {
[Link]('users').doc(userId).delete()
.then(() => {
showToast('User deleted successfully', 'success');

// Reload users
if
([Link]('usersTab').[Link]('active')) {
loadUsers();
}
})
.catch(error => {
[Link]('Error deleting user:', error);
showToast('Error deleting user', 'error');
});
}

// Approve Deposit
function approveDeposit(depositId) {
// Get deposit data
[Link]('deposits').doc(depositId).get()
.then(doc => {
if ([Link]) {
const depositData = [Link]();

// Update deposit status


return [Link]('deposits').doc(depositId).update({
status: 'approved'
});
}
})
.then(() => {
showToast('Deposit approved successfully', 'success');

// Reload deposits
if
([Link]('depositsTab').[Link]('active')) {
loadDeposits();
}
})
.catch(error => {
[Link]('Error approving deposit:', error);
showToast('Error approving deposit', 'error');
});
}

// Reject Deposit
function rejectDeposit(depositId) {
[Link]('deposits').doc(depositId).update({
status: 'rejected'
})
.then(() => {
showToast('Deposit rejected successfully', 'success');
// Reload deposits
if
([Link]('depositsTab').[Link]('active')) {
loadDeposits();
}
})
.catch(error => {
[Link]('Error rejecting deposit:', error);
showToast('Error rejecting deposit', 'error');
});
}

// Approve Withdrawal
function approveWithdrawal(withdrawalId) {
// Get withdrawal data
[Link]('withdrawals').doc(withdrawalId).get()
.then(doc => {
if ([Link]) {
const withdrawalData = [Link]();

// Update withdrawal status


return
[Link]('withdrawals').doc(withdrawalId).update({
status: 'approved'
});
}
})
.then(() => {
showToast('Withdrawal approved successfully', 'success');

// Reload withdrawals
if
([Link]('withdrawalsTab').[Link]('active')) {
loadWithdrawals();
}
})
.catch(error => {
[Link]('Error approving withdrawal:', error);
showToast('Error approving withdrawal', 'error');
});
}

// Reject Withdrawal
function rejectWithdrawal(withdrawalId) {
[Link]('withdrawals').doc(withdrawalId).update({
status: 'rejected'
})
.then(() => {
showToast('Withdrawal rejected successfully', 'success');

// Reload withdrawals
if
([Link]('withdrawalsTab').[Link]('active')) {
loadWithdrawals();
}
})
.catch(error => {
[Link]('Error rejecting withdrawal:', error);
showToast('Error rejecting withdrawal', 'error');
});
}

// Show Add Plan Modal


function showAddPlanModal() {
[Link] = `
<div class="modal-header">
<h3 class="modal-title">Add Plan</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Plan Name</label>
<input type="text" id="newPlanName" placeholder="Enter plan
name">
</div>

<div class="input-group">
<label>Price (BDT)</label>
<input type="number" id="newPlanPrice" placeholder="Enter plan
price" min="0">
</div>

<div class="input-group">
<label>Validity</label>
<input type="text" id="newPlanValidity" placeholder="e.g., 30
days, 1 year">
</div>

<div class="input-group">
<label>Direct Income %</label>
<input type="number" id="newPlanDirectPercent"
placeholder="Enter direct income percentage" min="0" max="100" step="0.1">
</div>

<div class="input-group">
<label>Level Income %</label>
<div id="newPlanLevelInputs">
<!-- Level inputs will be generated here -->
</div>
</div>

<div class="input-group">
<label>Benefits (one per line)</label>
<textarea id="newPlanBenefits" rows="5" placeholder="Enter
benefits (one per line)"></textarea>
</div>

<div class="input-group">
<div style="display: flex; justify-content: space-between;
align-items: center;">
<label>Featured</label>
<label class="switch">
<input type="checkbox" id="newPlanFeatured">
<span class="slider"></span>
</label>
</div>
</div>

<button class="neon-btn" id="addPlanSubmitBtn" style="width:


100%;">Add Plan</button>
`;

[Link]('active');

// Generate level inputs


const levelInputsContainer =
[Link]('newPlanLevelInputs');
for (let i = 1; i <= 5; i++) {
const inputGroup = [Link]('div');
[Link] = 'input-group';
[Link] = `
<label>Level ${i}</label>
<input type="number" id="newPlanLevel${i}" placeholder="Level $
{i} percentage" min="0" max="100" step="0.1">
`;
[Link](inputGroup);
}

// Setup event listeners


[Link]('.modal-close').addEventListener('click', () =>
{
[Link]('active');
});

[Link]('addPlanSubmitBtn').addEventListener('click',
addPlan);
}

// Add Plan
function addPlan() {
const name = [Link]('newPlanName').value;
const price = parseFloat([Link]('newPlanPrice').value)
|| 0;
const validity = [Link]('newPlanValidity').value;
const directPercent =
parseFloat([Link]('newPlanDirectPercent').value) || 0;
const featured = [Link]('newPlanFeatured').checked;
const benefitsText = [Link]('newPlanBenefits').value;

if (!name || !price || !validity) {


showToast('Please fill all required fields', 'error');
return;
}

// Get level percentages


const levelPercent = [];
for (let i = 1; i <= 5; i++) {
const input = [Link](`newPlanLevel${i}`);
if (input && [Link]) {
[Link](parseFloat([Link]) || 0);
}
}

// Parse benefits
const benefits = [Link]('\n').filter(benefit =>
[Link]() !== '');

// Create plan
[Link]('plans').add({
name: name,
price: price,
validity: validity,
directPercent: directPercent,
levelPercent: levelPercent,
benefits: benefits,
featured: featured,
date: new Date()
})
.then(() => {
showToast('Plan added successfully', 'success');
[Link]('active');

// Reload plans
if
([Link]('plansTab').[Link]('active')) {
loadPlans();
}
})
.catch(error => {
[Link]('Error adding plan:', error);
showToast('Error adding plan', 'error');
});
}

// Show Edit Plan Modal


function showEditPlanModal(planId) {
// Get plan data
[Link]('plans').doc(planId).get()
.then(doc => {
if ([Link]) {
const planData = [Link]();

[Link] = `
<div class="modal-header">
<h3 class="modal-title">Edit Plan</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Plan Name</label>
<input type="text" id="editPlanName" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Price (BDT)</label>
<input type="number" id="editPlanPrice" value="$
{[Link] || 0}" min="0">
</div>

<div class="input-group">
<label>Validity</label>
<input type="text" id="editPlanValidity" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Direct Income %</label>
<input type="number" id="editPlanDirectPercent"
value="${[Link] || 0}" min="0" max="100" step="0.1">
</div>

<div class="input-group">
<label>Level Income %</label>
<div id="editPlanLevelInputs">
<!-- Level inputs will be generated here -->
</div>
</div>

<div class="input-group">
<label>Benefits (one per line)</label>
<textarea id="editPlanBenefits" rows="5">$
{([Link] || []).join('\n')}</textarea>
</div>

<div class="input-group">
<div style="display: flex; justify-content: space-
between; align-items: center;">
<label>Featured</label>
<label class="switch">
<input type="checkbox"
id="editPlanFeatured" ${[Link] ? 'checked' : ''}>
<span class="slider"></span>
</label>
</div>
</div>

<button class="neon-btn" id="editPlanSubmitBtn" data-


plan-id="${planId}" style="width: 100%;">Update Plan</button>
`;

[Link]('active');

// Generate level inputs


const levelInputsContainer =
[Link]('editPlanLevelInputs');
for (let i = 1; i <= 5; i++) {
const inputGroup = [Link]('div');
[Link] = 'input-group';
const value = [Link] &&
[Link][i-1] ? [Link][i-1] : 0;
[Link] = `
<label>Level ${i}</label>
<input type="number" id="editPlanLevel${i}"
value="${value}" min="0" max="100" step="0.1">
`;
[Link](inputGroup);
}

// Setup event listeners


[Link]('.modal-
close').addEventListener('click', () => {
[Link]('active');
});

[Link]('editPlanSubmitBtn').addEventListener('click', editPlan);
}
})
.catch(error => {
[Link]('Error getting plan data:', error);
showToast('Error getting plan data', 'error');
});
}

// Edit Plan
function editPlan(e) {
const planId = [Link]('data-plan-id');
const name = [Link]('editPlanName').value;
const price =
parseFloat([Link]('editPlanPrice').value) || 0;
const validity = [Link]('editPlanValidity').value;
const directPercent =
parseFloat([Link]('editPlanDirectPercent').value) || 0;
const featured = [Link]('editPlanFeatured').checked;
const benefitsText = [Link]('editPlanBenefits').value;

if (!name || !price || !validity) {


showToast('Please fill all required fields', 'error');
return;
}

// Get level percentages


const levelPercent = [];
for (let i = 1; i <= 5; i++) {
const input = [Link](`editPlanLevel${i}`);
if (input) {
[Link](parseFloat([Link]) || 0);
}
}

// Parse benefits
const benefits = [Link]('\n').filter(benefit =>
[Link]() !== '');

// Update plan
[Link]('plans').doc(planId).update({
name: name,
price: price,
validity: validity,
directPercent: directPercent,
levelPercent: levelPercent,
benefits: benefits,
featured: featured
})
.then(() => {
showToast('Plan updated successfully', 'success');
[Link]('active');

// Reload plans
if
([Link]('plansTab').[Link]('active')) {
loadPlans();
}
})
.catch(error => {
[Link]('Error updating plan:', error);
showToast('Error updating plan', 'error');
});
}

// Delete Plan
function deletePlan(planId) {
[Link]('plans').doc(planId).delete()
.then(() => {
showToast('Plan deleted successfully', 'success');

// Reload plans
if
([Link]('plansTab').[Link]('active')) {
loadPlans();
}
})
.catch(error => {
[Link]('Error deleting plan:', error);
showToast('Error deleting plan', 'error');
});
}

// Show Add Task Modal


function showAddTaskModal() {
[Link] = `
<div class="modal-header">
<h3 class="modal-title">Add Task</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Task Title</label>
<input type="text" id="newTaskTitle" placeholder="Enter task
title">
</div>

<div class="input-group">
<label>Category</label>
<select id="newTaskCategory">
<option value="daily">Daily</option>
<option value="ads">Ads</option>
<option value="links">Links</option>
</select>
</div>

<div class="input-group">
<label>Reward (BDT)</label>
<input type="number" id="newTaskReward" placeholder="Enter task
reward" min="0">
</div>
<div class="input-group">
<label>Icon</label>
<select id="newTaskIcon">
<option value="star">Star</option>
<option value="clock">Clock</option>
<option value="video">Video</option>
<option value="link">Link</option>
<option value="thumbs-up">Thumbs Up</option>
<option value="heart">Heart</option>
</select>
</div>

<div class="input-group">
<label>Task Link</label>
<input type="text" id="newTaskLink" placeholder="Enter task
link (optional)">
</div>

<div class="input-group">
<label>Description</label>
<textarea id="newTaskDescription" rows="5" placeholder="Enter
task description"></textarea>
</div>

<button class="neon-btn" id="addTaskSubmitBtn" style="width:


100%;">Add Task</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-close').addEventListener('click', () =>
{
[Link]('active');
});

[Link]('addTaskSubmitBtn').addEventListener('click',
addTask);
}

// Add Task
function addTask() {
const title = [Link]('newTaskTitle').value;
const category = [Link]('newTaskCategory').value;
const reward =
parseFloat([Link]('newTaskReward').value) || 0;
const icon = [Link]('newTaskIcon').value;
const link = [Link]('newTaskLink').value;
const description =
[Link]('newTaskDescription').value;

if (!title || !reward) {
showToast('Please fill all required fields', 'error');
return;
}

// Create task
[Link]('tasks').add({
title: title,
category: category,
reward: reward,
icon: icon,
link: link,
description: description,
date: new Date()
})
.then(() => {
showToast('Task added successfully', 'success');
[Link]('active');

// Reload tasks
if
([Link]('tasksTab').[Link]('active')) {
loadTasks();
}
})
.catch(error => {
[Link]('Error adding task:', error);
showToast('Error adding task', 'error');
});
}

// Show Edit Task Modal


function showEditTaskModal(taskId) {
// Get task data
[Link]('tasks').doc(taskId).get()
.then(doc => {
if ([Link]) {
const taskData = [Link]();

[Link] = `
<div class="modal-header">
<h3 class="modal-title">Edit Task</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Task Title</label>
<input type="text" id="editTaskTitle" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Category</label>
<select id="editTaskCategory">
<option value="daily" ${[Link] ===
'daily' ? 'selected' : ''}>Daily</option>
<option value="ads" ${[Link] ===
'ads' ? 'selected' : ''}>Ads</option>
<option value="links" ${[Link] ===
'links' ? 'selected' : ''}>Links</option>
</select>
</div>

<div class="input-group">
<label>Reward (BDT)</label>
<input type="number" id="editTaskReward" value="$
{[Link] || 0}" min="0">
</div>

<div class="input-group">
<label>Icon</label>
<select id="editTaskIcon">
<option value="star" ${[Link] === 'star'
? 'selected' : ''}>Star</option>
<option value="clock" ${[Link] ===
'clock' ? 'selected' : ''}>Clock</option>
<option value="video" ${[Link] ===
'video' ? 'selected' : ''}>Video</option>
<option value="link" ${[Link] === 'link'
? 'selected' : ''}>Link</option>
<option value="thumbs-up" ${[Link] ===
'thumbs-up' ? 'selected' : ''}>Thumbs Up</option>
<option value="heart" ${[Link] ===
'heart' ? 'selected' : ''}>Heart</option>
</select>
</div>

<div class="input-group">
<label>Task Link</label>
<input type="text" id="editTaskLink" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Description</label>
<textarea id="editTaskDescription" rows="5">$
{[Link] || ''}</textarea>
</div>

<button class="neon-btn" id="editTaskSubmitBtn" data-


task-id="${taskId}" style="width: 100%;">Update Task</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-
close').addEventListener('click', () => {
[Link]('active');
});

[Link]('editTaskSubmitBtn').addEventListener('click', editTask);
}
})
.catch(error => {
[Link]('Error getting task data:', error);
showToast('Error getting task data', 'error');
});
}

// Edit Task
function editTask(e) {
const taskId = [Link]('data-task-id');
const title = [Link]('editTaskTitle').value;
const category = [Link]('editTaskCategory').value;
const reward =
parseFloat([Link]('editTaskReward').value) || 0;
const icon = [Link]('editTaskIcon').value;
const link = [Link]('editTaskLink').value;
const description =
[Link]('editTaskDescription').value;

if (!title || !reward) {
showToast('Please fill all required fields', 'error');
return;
}

// Update task
[Link]('tasks').doc(taskId).update({
title: title,
category: category,
reward: reward,
icon: icon,
link: link,
description: description
})
.then(() => {
showToast('Task updated successfully', 'success');
[Link]('active');

// Reload tasks
if
([Link]('tasksTab').[Link]('active')) {
loadTasks();
}
})
.catch(error => {
[Link]('Error updating task:', error);
showToast('Error updating task', 'error');
});
}

// Delete Task
function deleteTask(taskId) {
[Link]('tasks').doc(taskId).delete()
.then(() => {
showToast('Task deleted successfully', 'success');

// Reload tasks
if
([Link]('tasksTab').[Link]('active')) {
loadTasks();
}
})
.catch(error => {
[Link]('Error deleting task:', error);
showToast('Error deleting task', 'error');
});
}

// Show Add Notice Modal


function showAddNoticeModal() {
[Link] = `
<div class="modal-header">
<h3 class="modal-title">Add Notice</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Notice Title</label>
<input type="text" id="newNoticeTitle" placeholder="Enter
notice title">
</div>

<div class="input-group">
<label>Notice Message</label>
<textarea id="newNoticeMessage" rows="5" placeholder="Enter
notice message"></textarea>
</div>

<button class="neon-btn" id="addNoticeSubmitBtn" style="width:


100%;">Add Notice</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-close').addEventListener('click', () =>
{
[Link]('active');
});

[Link]('addNoticeSubmitBtn').addEventListener('click',
addNotice);
}

// Add Notice
function addNotice() {
const title = [Link]('newNoticeTitle').value;
const message = [Link]('newNoticeMessage').value;

if (!title || !message) {
showToast('Please fill all fields', 'error');
return;
}

// Create notice
[Link]('notices').add({
title: title,
message: message,
date: new Date()
})
.then(() => {
showToast('Notice added successfully', 'success');
[Link]('active');

// Reload notices
if
([Link]('noticesTab').[Link]('active')) {
loadNotices();
}
})
.catch(error => {
[Link]('Error adding notice:', error);
showToast('Error adding notice', 'error');
});
}

// Show Edit Notice Modal


function showEditNoticeModal(noticeId) {
// Get notice data
[Link]('notices').doc(noticeId).get()
.then(doc => {
if ([Link]) {
const noticeData = [Link]();

[Link] = `
<div class="modal-header">
<h3 class="modal-title">Edit Notice</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Notice Title</label>
<input type="text" id="editNoticeTitle" value="$
{[Link] || ''}">
</div>

<div class="input-group">
<label>Notice Message</label>
<textarea id="editNoticeMessage" rows="5">$
{[Link] || ''}</textarea>
</div>

<button class="neon-btn" id="editNoticeSubmitBtn" data-


notice-id="${noticeId}" style="width: 100%;">Update Notice</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-
close').addEventListener('click', () => {
[Link]('active');
});

[Link]('editNoticeSubmitBtn').addEventListener('click',
editNotice);
}
})
.catch(error => {
[Link]('Error getting notice data:', error);
showToast('Error getting notice data', 'error');
});
}

// Edit Notice
function editNotice(e) {
const noticeId = [Link]('data-notice-id');
const title = [Link]('editNoticeTitle').value;
const message = [Link]('editNoticeMessage').value;

if (!title || !message) {
showToast('Please fill all fields', 'error');
return;
}

// Update notice
[Link]('notices').doc(noticeId).update({
title: title,
message: message
})
.then(() => {
showToast('Notice updated successfully', 'success');
[Link]('active');

// Reload notices
if
([Link]('noticesTab').[Link]('active')) {
loadNotices();
}
})
.catch(error => {
[Link]('Error updating notice:', error);
showToast('Error updating notice', 'error');
});
}

// Delete Notice
function deleteNotice(noticeId) {
[Link]('notices').doc(noticeId).delete()
.then(() => {
showToast('Notice deleted successfully', 'success');

// Reload notices
if
([Link]('noticesTab').[Link]('active')) {
loadNotices();
}
})
.catch(error => {
[Link]('Error deleting notice:', error);
showToast('Error deleting notice', 'error');
});
}

// Show Payment Numbers Modal


function showPaymentNumbersModal() {
// Get current payment numbers
[Link]('settings/paymentNumber').once('value')
.then(snapshot => {
const currentNumber = [Link]() ? [Link]() : '';
[Link] = `
<div class="modal-header">
<h3 class="modal-title">Update Payment Numbers</h3>
<div class="modal-close">
<i class="fas fa-times"></i>
</div>
</div>

<div class="input-group">
<label>Payment Number</label>
<input type="text" id="paymentNumberInput" value="$
{currentNumber}" placeholder="Enter payment number">
</div>

<button class="neon-btn" id="updatePaymentNumberBtn"


style="width: 100%;">Update Number</button>
`;

[Link]('active');

// Setup event listeners


[Link]('.modal-
close').addEventListener('click', () => {
[Link]('active');
});

[Link]('updatePaymentNumberBtn').addEventListener('click',
updatePaymentNumber);
})
.catch(error => {
[Link]('Error getting payment numbers:', error);
showToast('Error getting payment numbers', 'error');
});
}

// Update Payment Number


function updatePaymentNumber() {
const paymentNumber =
[Link]('paymentNumberInput').value;

if (!paymentNumber) {
showToast('Please enter payment number', 'error');
return;
}

// Update payment number


[Link]('settings/paymentNumber').set(paymentNumber)
.then(() => {
showToast('Payment number updated successfully', 'success');
[Link]('active');
})
.catch(error => {
[Link]('Error updating payment number:', error);
showToast('Error updating payment number', 'error');
});
}

// Show Toast Notification


function showToast(message, type = 'info') {
[Link] = message;
[Link] = 'toast show';

if (type === 'success') {


[Link]('success');
} else if (type === 'error') {
[Link]('error');
} else if (type === 'warning') {
[Link]('warning');
}

setTimeout(() => {
[Link]('show');
}, 3000);
}
</script>
</body>
</html>

You might also like