CÁC MÀN HÌNH VÀ CHỨC NĂNG SVBWM

Một phần của tài liệu Modern framework phát triển ứng dụng web tiên tiến (Trang 71 - 77)

Chương 3 XÂY DỰNG SIMPLE VAADIN BASED WEB MODULES

3.6. CÁC MÀN HÌNH VÀ CHỨC NĂNG SVBWM

3.6.1. Màn hình đăng nhập hệ thống

Hình 3.5: Màn hình đăng nhập hệ thống

Hình 3.5 hiển thị màn hình đăng nhập vào hệ thống. Mọi người dùng muốn làm việc với hệ thống đều phải vượt qua được màn hình này. Mỗi người dùng hệ thống sẽ đƣợc cấp một tài khoản để đăng nhập. Tên đăng nhập và mật khẩu là bắt buộc nhập. Mật khẩu đƣợc quy định ít nhất là 8 ký tự và phải có ít nhất là 1 chữ số.

72

Sau khi nhập đầy đủ thông tin bắt buộc, người dùng nhấn nút Đăng nhập để bắt đầu một phiên làm việc trên hệ thống.

3.6.2. Màn hình trang chủ

Hình 3.6: Màn hình trang chủ ứng dụng

Hình 3.6 thể hiện màn hình trang chủ của hệ thống. Phụ thuộc vào từng ứng dụng đƣợc xây dựng trên framework mà lập trình viên tùy biến màn hình này cho phù hợp.

3.6.3. Màn hình quản lý menu

Trên thanh menu, chọn “Quản trị hệ thống”  “Quản lý menu” như hình dưới để mở màn hình Quản lý menu.

73

Hình 3.7: Menu mở màn hình Quản lý menu

Hình 3.8: Màn hình Quản lý menu

Hình 3.8 thể hiện màn hình Quản lý menu. Màn hình này cung cấp chức năng thêm, sửa, xóa cây menu hệ thống. Màn hình hiển thị cây menu hệ thống và phần cho phép xem chi tiết nội dung của 1 menu bất kỳ đƣợc nhấp chuột từ cây menu.

Đồng thời, tại đây người dùng cũng có thể nhập mới thông tin menu hoặc cập nhật thông tin menu đã tồn tại.

Thêm mới một menu: Nhấp chuột trái vào nút “Thêm mới’, sau đó nhập thông tin menu, rồi nhấp chuột trái vào nút “Lưu”.

Cập nhật một menu: Nhấp chuột trái vào menu cần cập nhật trên cây menu, sau đó nhập thông tin sửa đổi cho menu, rồi nhấp chuột trái vào nút “Lưu”.

Xóa menu: Nhấp chuột trái vào menu cần xóa trên cây menu, sau đó nhấp chuột trái vào nút “Xóa”.

74

3.6.4. Màn hình phân quyền người dùng trên menu

Trên thanh menu, chọn “Quản trị hệ thống”  “Phân quyền người dùng trên menu” như hình dưới để mở màn hình Phân quyền người dùng trên menu.

Hình 3.9: Menu mở màn hình Phân quyền người dùng trên menu

Hình 3.10: Màn hình Phân quyền người dùng trên menu

Hình 3.10 thể hiện màn hình Phân quyền người dùng trên menu. Trên màn hình là một danh sách xổ xuống các tài khoản người dùng hệ thống để phân quyền và một cây menu để gán quyền cho tài khoản người dùng.

75

Phân quyền: Chọn tài khoản cần phân quyền, rồi tích chọn các menu mà tài khoản đƣợc quyền làm việc hoặc bỏ chọn các menu mà tài khoản không đƣợc quyền làm việc, sau đó nhấp chuột trái vào nút “Lưu”.

3.6.5. Màn hình quản lý danh mục

Trên thanh menu, chọn “Quản trị hệ thống”  “Quản lý danh mục” nhƣ hình dưới để mở màn hình Quản lý danh mục.

Hình 3.11: Menu mở màn hình Quản lý danh mục

Hình 3.12: Màn hình Quản lý danh mục

Hình 3.12 thể hiện màn hình Quản lý danh mục. Màn hình này cung cấp chức năng thêm, sửa, xóa danh mục hệ thống. Màn hình hiển thị cây danh mục hệ thống

76

và phần cho phép xem chi tiết nội dung của 1 danh mục bất kỳ đƣợc nhấp chuột từ cây danh mục. Đồng thời, tại đây người dùng cũng có thể nhập mới thông tin danh mục hoặc cập nhật thông tin danh mục đã tồn tại.

Thêm mới một danh mục: Nhấp chuột trái vào nút “Thêm mới’, sau đó nhập thông tin danh mục, rồi nhấp chuột trái vào nút “Lưu”.

Cập nhật một danh mục: Nhấp chuột trái vào danh mục cần cập nhật trên cây danh mục, sau đó nhập thông tin sửa đổi cho danh mục, rồi nhấp chuột trái vào nút

“Lưu”.

Xóa danh mục: Nhấp chuột trái vào danh mục cần xóa trên cây danh mục, sau đó nhấp chuột trái vào nút “Xóa”.

3.6.6. Chức năng đăng xuất khỏi hệ thống

Hình 3.13: Chức năng đăng xuất khỏi hệ thống

Hình 3.13 thể hiện chức năng “Đăng xuất” khỏi hệ thống. Tại bất cứ màn hình nào ngoại trừ màn hình Đăng nhập, người dùng đều có thể thực hiện chức năng này.

77

Một phần của tài liệu Modern framework phát triển ứng dụng web tiên tiến (Trang 71 - 77)

Tải bản đầy đủ (PDF)

(83 trang)