File size: 6,032 Bytes
93cd2cb
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Admin Panel - IT Development Agency</title>
    <link rel="stylesheet" href="style.css">
    <script src="https://cdn.tailwindcss.com"></script>
    <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
    <script src="https://unpkg.com/feather-icons"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.min.js"></script>
    <script src="components/navbar.js"></script>
    <script src="components/footer.js"></script>
</head>
<body class="bg-gray-50">
    <custom-navbar></custom-navbar>

    <main class="container mx-auto px-4 py-8">
        <div class="flex justify-between items-center mb-8">
            <h1 class="text-3xl font-bold text-gray-800">Admin Panel</h1>
            <button id="logout-btn" class="bg-red-600 hover:bg-red-700 text-white px-4 py-2 rounded-lg transition duration-300">
                Logout
            </button>
        </div>

        <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
            <!-- Projects Management -->
            <div class="bg-white rounded-xl shadow-md p-6">
                <h2 class="text-xl font-semibold text-gray-800 mb-4">Projects</h2>
                <div class="space-y-4">
                    <div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
                        <div>
                            <h3 class="font-medium">E-commerce Website</h3>
                            <p class="text-sm text-gray-600">Status: In Progress</p>
                        </div>
                        <button class="text-indigo-600 hover:text-indigo-700">
                            <i data-feather="edit"></i>
                        </button>
                    </div>
                    <div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
                        <div>
                            <h3 class="font-medium">AI Chatbot</h3>
                            <p class="text-sm text-gray-600">Status: Completed</p>
                        </div>
                        <button class="text-indigo-600 hover:text-indigo-700">
                            <i data-feather="edit"></i>
                        </button>
                    </div>
                </div>
                <button class="w-full mt-4 bg-indigo-600 hover:bg-indigo-700 text-white py-2 rounded-lg transition duration-300">
                Add New Project
            </button>
        </div>

        <!-- Clients Management -->
        <div class="bg-white rounded-xl shadow-md p-6">
            <h2 class="text-xl font-semibold text-gray-800 mb-4">Clients</h2>
            <div class="space-y-4">
                <div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
                <div>
                    <h3 class="font-medium">TechCorp Inc.</h3>
                    <p class="text-sm text-gray-600">2 active projects</p>
                </div>
                <button class="text-indigo-600 hover:text-indigo-700">
                    <i data-feather="edit"></i>
                </button>
            </div>
            <div class="flex justify-between items-center p-3 bg-gray-50 rounded-lg">
                <div>
                    <h3 class="font-medium">StartUpXYZ</h3>
                    <p class="text-sm text-gray-600">1 completed project</p>
                </div>
                <button class="text-indigo-600 hover:text-indigo-700">
                    <i data-feather="edit"></i>
                </button>
            </div>
        </div>
        <button class="w-full mt-4 bg-indigo-600 hover:bg-indigo-700 text-white py-2 rounded-lg transition duration-300">
                Add New Client
            </button>
        </div>

        <!-- Analytics -->
        <div class="bg-white rounded-xl shadow-md p-6">
            <h2 class="text-xl font-semibold text-gray-800 mb-4">Analytics</h2>
            <div class="space-y-4">
                <div class="text-center p-4 bg-indigo-50 rounded-lg">
                    <p class="text-2xl font-bold text-indigo-600">12</p>
                    <p class="text-sm text-gray-600">Active Projects</p>
                </div>
                <div class="text-center p-4 bg-green-50 rounded-lg">
                    <p class="text-2xl font-bold text-green-600">$45K</p>
                    <p class="text-sm text-gray-600">Monthly Revenue</p>
                </div>
                <div class="text-center p-4 bg-blue-50 rounded-lg">
                    <p class="text-2xl font-bold text-blue-600">8</p>
                    <p class="text-sm text-gray-600">New Clients</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Recent Activity -->
    <div class="bg-white rounded-xl shadow-md p-6 mt-8">
        <h2 class="text-xl font-semibold text-gray-800 mb-4">Recent Activity</h2>
        <div class="space-y-3">
            <div class="flex items-center text-sm text-gray-600">
                <i data-feather="check-circle" class="text-green-500 mr-2"></i>
                Project "Mobile App" completed
            </div>
            <div class="flex items-center text-sm text-gray-600">
                <i data-feather="user-plus" class="text-blue-500 mr-2"></i>
                New client registered: DigitalAgency
            </div>
            <div class="flex items-center text-sm text-gray-600">
                <i data-feather="message-circle" class="text-indigo-500 mr-2"></i>
                New message from TechSolutions
            </div>
        </div>
    </div>
</main>

    <custom-footer></custom-footer>

    <script>
        feather.replace();
        // Logout functionality
        document.getElementById('logout-btn').addEventListener('click', () => {
            window.location.href = 'index.html';
        });
    </script>
    <script src="script.js"></script>
</body>
</html>