NTS
Nguyen Thai Son

Admin Dashboard - Copy this React, Tailwind Component to your project

Create an interface for the admin dashboard account management website, scale the left menu and the display section to 1:5 with the following functions: On the left is the menu with the items below, when clicking on each item, it will load data from the API and display the main content on the right: + Account (clicking on each account will switch to the information editing page /api/account/edit/[id_account] ) ++ Class management (Display the class management list taken from the api /api/account/classmanager, with 10 columns respectively being the serial number, username, password, role, class_list, isCam, isMic, isShare, isChat, isBan) ++ Teachers (Display the teacher list taken from the api /api/account/teacher, with 10 columns respectively being the serial number, username, password, role, class_list, isCam, isMic, isShare, isChat, isBan) ++ Students (Display the list of students taken from the api /api/account/student, with 10 columns, respectively, serial number, username, password, role, class_list, isCam, isMic, isShare, isChat, isBan) + Class list (the drop down menu of the class list takes data from /api/class, each data is a line in the menu below) ++ Class 1 (example): Display the list of students in the class taken from /api/class/[id_class]/student including serial number, username, password, role, class_list, isCam, isMic, isShare, isChat, isBan, delete from class button. + Classroom: ++ Create a classroom: information entry form with information fields Name, Class (multiple choice checkbox), Maximum number of people ++ History: Displays a list of created classrooms taken from /api/meeting/list including serial number, name, class (can display multiple classes), Chat (chat file link taken from /api/meeting/[id]/chat), Video (class recording file link taken from /api/meeting/[id]/record)

Prompt
Component Preview

About

AdminDashboard - Manage accounts, classes, and history with ease. Built with React and Tailwind, featuring API integration for seamles. Download instantly!

Share

Last updated 1 month ago