4.4 KiB
4.4 KiB
VaultSentinel - Account Management System
Giới Thiệu
VaultSentinel là một ứng dụng web quản lý tài khoản dịch vụ/ứng dụng. Ứng dụng cho phép bạn:
- Quản lý Tài Khoản: Thêm, sửa, xóa tài khoản cho các dịch vụ
- Quản lý Ứng Dụng: Theo dõi các dịch vụ/ứng dụng đang sử dụng
- Dashboard: Xem tổng quan số lượng tài khoản và dịch vụ
- Lưu Trữ Dữ Liệu: Tất cả dữ liệu được lưu trên trình duyệt (localStorage)
Các Tính Năng
1. Dashboard
- Xem tổng quan các thống kê:
- Số lượng ứng dụng đang hoạt động
- Tổng số tài khoản được quản lý
- Ngày cập nhật cuối cùng
- Trạng thái hệ thống
- Xem các tài khoản gần đây được tạo
2. Quản Lý Tài Khoản (Accounts)
-
Thêm Tài Khoản Mới:
- Nhấp nút "Add Account"
- Điền thông tin: Service, Owner, Username, Password
- Nhấp "Save Account"
-
Chỉnh Sửa Tài Khoản:
- Nhấp nút "Edit" (biểu tượng bút chì) trên dòng tài khoản
- Cập nhật thông tin
- Nhấp "Save Account"
-
Xóa Tài Khoản:
- Nhấp nút "Delete" (biểu tượng thùng rác)
- Xác nhận xóa
-
Lọc Tài Khoản:
- Sử dụng dropdown "Service" để lọc theo dịch vụ
3. Quản Lý Ứng Dụng (Applications)
-
Xem Danh Sách:
- Danh sách tất cả các ứng dụng/dịch vụ
- Hiển thị trạng thái (Online/Offline)
- Hiển thị loại ứng dụng
-
Thêm Ứng Dụng:
- Nhấp "Add New"
- Điền tên, loại, trạng thái
- Nhấp "Save Application"
-
Chỉnh Sửa Ứng Dụng:
- Nhấp nút "Edit"
- Cập nhật thông tin
- Nhấp "Save Application"
-
Xóa Ứng Dụng:
- Nhấp nút "Delete"
- Xác nhận xóa
Cách Sử Dụng
Khởi Động Ứng Dụng
- Mở file
index.htmltrên trình duyệt - Giao diện chính sẽ tải lên
Công Việc Thường Xuyên
Thêm Tài Khoản Mới
- Nhấp "Accounts" trên thanh điều hướng bên trái
- Nhấp nút "Add Account"
- Chọn dịch vụ từ dropdown
- Nhập tên chủ sở hữu, tên đăng nhập, mật khẩu
- Nhấp "Save Account"
Xem Danh Sách Ứng Dụng
- Nhấp "Applications" trên thanh điều hướng
- Xem danh sách tất cả các ứng dụng đã đăng ký
- Sử dụng các nút hành động để chỉnh sửa hoặc xóa
Kiểm Tra Tổng Quan
- Nhấp "Dashboard" trên thanh điều hướng
- Xem các thống kê chính và hoạt động gần đây
Lưu Ý Quan Trọng
⚠️ Bảo Mật:
- Tất cả dữ liệu được lưu trữ cục bộ trên trình duyệt (localStorage)
- Không gửi dữ liệu đến máy chủ nào
- Dữ liệu sẽ bị xóa nếu bạn xóa cache trình duyệt
- Đây là một ứng dụng demo - không sử dụng cho dữ liệu nhạy cảm trong môi trường thực tế
Cấu Trúc File
index.html- File HTML chính với giao diện người dùngapp.js- Mã JavaScript xử lý logic và chức năngacc.html- Trang tài khoản cũ (tham khảo)app.html- Trang ứng dụng cũ (tham khảo)main.html- File HTML thay thế (tham khảo)
Các Công Nghệ Sử Dụng
- HTML5: Cấu trúc trang
- CSS (Tailwind CSS): Tạo cách bố trí và kiểu dáng
- JavaScript: Xử lý logic ứng dụng
- Material Symbols: Biểu tượng
- localStorage API: Lưu trữ dữ liệu
Mở Rộng Ứng Dụng
Để Thêm Chức Năng Mới:
-
Thêm trang Dashboard mới:
- Xác định nội dung trong
getApplicationsContent() - Thêm hàm xử lý sự kiện
- Cập nhật
renderPage()để thêm trang mới
- Xác định nội dung trong
-
Cải Thiện Bảo Mật:
- Thêm mã hóa cho mật khẩu
- Triển khai xác thực người dùng
- Sử dụng database backend
-
Tính Năng Khác:
- Xuất/Nhập dữ liệu
- Nhật ký hoạt động
- Tìm kiếm nâng cao
- Sao lưu/Khôi phục
Hỗ Trợ
Nếu bạn gặp vấn đề:
- Kiểm tra console trình duyệt (F12) để xem lỗi
- Xóa cache trình duyệt nếu dữ liệu không hiển thị
- Đảm bảo trình duyệt hỗ trợ localStorage
- Thử trên trình duyệt khác
Phiên Bản: 1.0.0