# 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
1. Mở file `index.html` trên trình duyệt
2. 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
1. Nhấp "Accounts" trên thanh điều hướng bên trái
2. Nhấp nút "Add Account" 
3. Chọn dịch vụ từ dropdown
4. Nhập tên chủ sở hữu, tên đăng nhập, mật khẩu
5. Nhấp "Save Account"

#### Xem Danh Sách Ứng Dụng
1. Nhấp "Applications" trên thanh điều hướng
2. Xem danh sách tất cả các ứng dụng đã đăng ký
3. Sử dụng các nút hành động để chỉnh sửa hoặc xóa

#### Kiểm Tra Tổng Quan
1. Nhấp "Dashboard" trên thanh điều hướng
2. 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ùng
- `app.js` - Mã JavaScript xử lý logic và chức năng
- `acc.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:

1. **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

2. **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

3. **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 đề:
1. Kiểm tra console trình duyệt (F12) để xem lỗi
2. Xóa cache trình duyệt nếu dữ liệu không hiển thị
3. Đảm bảo trình duyệt hỗ trợ localStorage
4. Thử trên trình duyệt khác

---

**Phiên Bản**: 1.0.0