help@rskworld.in +91 93305 39277
RSK World
  • Home
  • Development
    • Web Development
    • Mobile Apps
    • Software
    • Games
    • Project
  • Technologies
    • Data Science
    • AI Development
    • Cloud Development
    • Blockchain
    • Cyber Security
    • Dev Tools
    • Testing Tools
  • About
  • Contact

Theme Settings

Color Scheme
Display Options
Font Size
100%
Back to Project
RSK World
whatsapp-chatbot
/
templates
RSK World
whatsapp-chatbot
WhatsApp Chatbot - Python Flask + Twilio + Admin Dashboard + Multilingual Support + Sentiment Analysis + Booking Management
templates
  • admin.html6.3 KB
  • index.html2.7 KB
admin.html
templates/admin.html
Raw Download
Find: Go to:
<!-- 
    Project: WhatsApp Chatbot Admin
    Author: RSK World
    Year: 2026
-->
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Admin Dashboard - RSK World Bot</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    <link rel="stylesheet" href="{{ url_for('static', filename='css/admin.css') }}">
</head>

<body>

    <div class="d-flex">
        <!-- Sidebar -->
        <div class="sidebar d-flex flex-column p-3" style="width: 280px;">
            <span class="fs-4">🤖 Bot Admin</span>
            <hr>
            <ul class="nav nav-pills flex-column mb-auto">
                <li class="nav-item"><a href="#" class="nav-link active">Overview</a></li>
                <li><a href="#" class="nav-link text-white">Bookings</a></li>
                <li><a href="#" class="nav-link text-white">Analytics</a></li>
                <li><a href="#" class="nav-link text-white" onclick="showBroadcastModal()">Broadcast</a></li>
            </ul>
            <hr>
            <div>
                User: RSK Admin<br>
                <small class="text-secondary">@rskworld.in</small>
            </div>
        </div>

        <!-- Main Content -->
        <div class="container-fluid p-4">
            <h2 class="mb-4">Dashboard Overview</h2>

            <!-- Stats Row -->
            <div class="row mb-4">
                <div class="col-md-4">
                    <div class="stat-card text-center">
                        <h5>Total Interactions</h5>
                        <h1 id="total-interactions" class="display-4 fw-bold text-primary">0</h1>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="stat-card">
                        <h5>Sentiment Analysis</h5>
                        <canvas id="sentimentChart"></canvas>
                    </div>
                </div>
                <div class="col-md-4">
                    <div class="stat-card">
                        <h5>Recent Activity</h5>
                        <ul id="activity-list" class="list-group list-group-flush small">
                            <li class="list-group-item">Loading...</li>
                        </ul>
                    </div>
                </div>
            </div>

            <!-- Bookings Table -->
            <h3 class="mb-3">Recent Consultation Bookings</h3>
            <div class="table-responsive">
                <table class="table table-hover">
                    <thead class="table-dark">
                        <tr>
                            <th>Date & Time</th>
                            <th>Name</th>
                            <th>Phone</th>
                            <th>Preferred Date</th>
                            <th>Topic</th>
                            <th>Action</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for booking in bookings %}
                        <tr>
                            <td>{{ booking.timestamp }}</td>
                            <td>{{ booking.name }}</td>
                            <td>{{ booking.phone }}</td>
                            <td><span class="badge bg-info text-dark">{{ booking.date }}</span></td>
                            <td>{{ booking.topic }}</td>
                            <td>
                                <button class="btn btn-sm btn-success">Approve</button>
                                <button class="btn btn-sm btn-outline-danger">Reject</button>
                            </td>
                        </tr>
                        {% else %}
                        <tr>
                            <td colspan="6" class="text-center">No bookings yet.</td>
                        </tr>
                        {% endfor %}
                    </tbody>
                </table>
                <a href="/api/export_bookings" class="btn btn-outline-primary mt-3"><i class="fas fa-download"></i>
                    Export CSV</a>
            </div>
        </div>
    </div>

    <!-- Broadcast Modal -->
    <div class="modal fade" id="broadcastModal" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">📢 Send Broadcast Message</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <p>Send a message to all active users (simulated).</p>
                    <textarea id="broadcastMsg" class="form-control" rows="4"
                        placeholder="Type your message here..."></textarea>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary" onclick="sendBroadcast()">Send Broadcast</button>
                </div>
            </div>
        </div>
    </div>

    <script src="{{ url_for('static', filename='js/admin.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        function showBroadcastModal() {
            new bootstrap.Modal(document.getElementById('broadcastModal')).show();
        }

        function sendBroadcast() {
            const msg = document.getElementById('broadcastMsg').value;
            if (!msg) return alert("Please enter a message!");

            fetch('/api/broadcast', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ message: msg })
            })
                .then(res => res.json())
                .then(data => {
                    alert(`Success! Broadcast sent to ${data.count} users.`);
                    location.reload();
                });
        }
    </script>

</body>

</html>
153 lines•6.3 KB
markup

About RSK World

Founded by Molla Samser, with Designer & Tester Rima Khatun, RSK World is your one-stop destination for free programming resources, source code, and development tools.

Founder: Molla Samser
Designer & Tester: Rima Khatun

Development

  • Game Development
  • Web Development
  • Mobile Development
  • AI Development
  • Development Tools

Legal

  • Terms & Conditions
  • Privacy Policy
  • Disclaimer

Contact Info

Nutanhat, Mongolkote
Purba Burdwan, West Bengal
India, 713147

+91 93305 39277

hello@rskworld.in
support@rskworld.in

© 2026 RSK World. All rights reserved.

Content used for educational purposes only. View Disclaimer