Thiết kế giao diện cho các Use Case

Một phần của tài liệu Hướng dẫn làm website học trực tuyến (Trang 48)

6.1. Thiết kế giao diện cho Use Case Đăng nhập

6.2. Thiết kế giao diện cho trang Chọn khóa học

H28:Giao diện trang chọn khóa học

6.3. Thiết kế giao diện cho Use Case Xem bài học

6.4. Thiết kế giao diện cho Use Case Làm bài test

6.5. Thiết kế giao diện cho Use Case Thay đổi thông tin cá nhân

Hình 31: Giao diện cho ca sử dụng thay đổi thông tin cá nhân

6.6. Thiết kế giao diện cho Use Case Logout

6.7. Thiết kế giao diện cho Use Case Thêm khóa học

6.8. Thiết kế giao diện cho Use Case Quản lý khóa học

Hình 34: Giao diện cho ca sử dụng quản lý khóa học

6.9. Thiết kế giao diện cho Use Case Sửa khóa học

PHẦN III: THIẾT KẾ TỔNG THỂ 1. Sơ đồ gói chức năng

-Hệ thống có thể chia thành 5 gói chức năng nhỏ: + Học và Test:

Gói “Học và Test” chủ yếu phục vụ cho học sinh.Học sinh có thể xem nội dung các khóa học,chọn các bài học,bài test mong muốn.Học sinh có thể xem các bài học và làm các bài test,xem kết quả học tập

+Quản lý khóa học

Gói “Quản lý khóa học” cung cấp cho giáo viên các chức năng để quản lý khóa học.Giáo viên có thể xem danh sách các khóa học do mình tạo ra,xem chi tiết nội dung khóa học,các bài học ,bài test.Giáo viên có thể tạo ra khóa học mới,thêm các bài học ,bài test vào các khóa học của mình,sửa,xóa các khóa học,bài học,bài test.

+Quản lý người dùng

Gói “Quản lý người dùng” cung cấp cho admin các chức năng để quản lý người dùng trong hệ thống.Admin có thể thêm mới người dùng,xác định role cho người dùng,cập nhật thông tin người dùng,xóa người dùng.

Hình 36: Biểu đồ gói chức năng

2. Mô hình phân tầng theo công nghệ sử dụng 2.1.Giới thiệu Yii Framework 2.1.Giới thiệu Yii Framework

Yii Framework là framework sử dụng ngôn ngữ PHP được thiết kế theo mô hình MVC. Yii ra đời lần đầu tiên năm 2008 do một tác giả là Quiang Xue viết ra. Quiang Xeng cũng chính là người đứng đầu nhóm xây dựng Prado một framework khác của PHP.

Trong quá trình phát triển Prado, nhận thấy nhiều nhược điểm của Prado đặc biệt là về hiệu năng, Quiang và nhóm phát triển Prado đã quyết định xây dựng lại một framework mới kế thừa những ưu điểm của Prado và mang rất nhiều cải tiến mới mẻ, độc đáo khiến cho Yii Framework trở thành một trong những framework có hiệu năng cao nhất và thích hợp cho việc xây dựng các ứng dụng web rất đa dạng ở nhiều loại hình, quy mô với sự tiết kiệm rất nhiều thời gian và công sức cho người phát triển.

Yii là có nhiều ưu điểm nổi bật so với các framework ra đời trước. Sau đây là một số ưu điểm nổi bật của Yii:

- Yii được thiết kế theo mô hình Framework, mô hình phổ biến được áp dụng cho phần lớn các framework PHP giúp thuận tiện cho người phát triển trong quá trình phát triển, sửa lỗi, bảo dưỡng.

- Yii sử dụng ActiveRecord Design Pattern để biểu diễn và thao tác với dữ liệu một cách trong sáng và chặt chẽ. Đồng thời,Yii cũng cung cấp 2 cách nữa để làm việc với CSDL là DAO (Data Access Object) và Query Builder. Mỗi cách lại có những ưu, nhược điểm riêng, người phát triển có thể chọn lựa cách thức phù hợp nhất trong từng trường hợp.

- Yii sử dụng Jquery là thư viện Javascript mặc định, hỗ trợ rất tốt cho Ajax. - Yii có các widget giúp cho người phát triển rất dễ dàng trong xây dựng giao diện người dùng.

- Yii cho phép dễ dàng tích hợp các thư viện thứ 3 giúp người phát triển có thể dễ dàng tích hợp các thư viện đa dạng cho ứng dụng của mình.

2.2.Biểu đồ mô hình phân tầng đối với công nghệ sử dụng

2.3.Các thành phân trong Project dùng Yii Framework

H38: Cấu trúc tĩnh của một ứng dụng Yii (adsbygoogle = window.adsbygoogle || []).push({});

Một website sử dụng Framework Yii sẽ có cấu trúc tĩnh cơ bản như sau:

- Application: Đối tượng các đối tượng gom nhóm các ngữ cảnh thực thi mà

trong đó có thể sử dụng yêu cầu người dùng, quản lý các controller và các component của hệ thống.

- Các component của ứng dụng: Yii có kiến trúc component. Có thể thêm các

component cho Yii để thực hiện các chức năng cụ thể một cách dễ dàng. Để sử dụng các component của Yii, ta cần thêm các thông tin cấu hình trong file config.

- Controller: Là một thể hiện của lớp Ccontroller. Nó được tạo bởi đối tượng

application khi có yêu cầu từ người dùng được gửi đến. Khi một yêu cầu được thực hiện, controller sẽ thực thi action được yêu cầu.action của Yii đơn giản chỉ là phương thức mở đầu bằng từ khóa “action”. Controller đọc dữ liệu từ model, xử lý và trả về kết quả cho view tương ứng.

- Model: Là một thể hiện của lớp CModel được được dùng để biểu diễn dữ liệu,

các quy tắc biểu diễn dữ liệu và mối quan hệ giữa chúng. Mỗi model biểu diễn một đối tượng dữ liệu đơn. Nó có thể là một hàng của một bảng hoặc một

trường của HTML form. Mỗi trường của dữ liệu tương ứng với một thuộc tính của model.

Trong Yii có 2 loại Model: CformCactiveRecord. Cả hai đều là lớp con của Cmodel.

o Cform: được sử dụng để biểu diễn dữ liệu thu thập từ người dùng thông qua

form.

o Cactive Record: sử dụng Active Record design pattern (Đối tượng truy cập

dữ liệu trừu tượng) để biểu diễn dữ liệu trong các bảng của CSDL .

- View: Là các file PHP chủ yếu chứa các thành phần giao diện người dùng như

Form, HTML,…View được render bởi các action và hiển thị kết quả đến người dùng với dữ liệu được truyền từ Controller. Trong View có thể chứa các vòng lặp,cấu trúc rẽ nhanh nhưng thường đơn giản. Trong View cũng có thể trực tiếp đọc dữ liệu từ Model nhưng điều này được khuyến cáo nên hạn chế theo tinh thần phân chia logic của mô hình MVC.

- Layout: Là một view đặc biệt trong Yii. Nó quy định giao diện, bố cục chung

cho cả trang. Trong Layout , view của action được thực hiện sẽ được truyền vào qua biến $content.

- Widget: là thể hiện của lớp Cwidget và các lớp con của Cwidget. Widget chủ

yếu dùng để tạo giao diện. Widget thường được dùng để tạo ra các đối tượng giao diện tương đối phức tạp như ClistView, CdetailedView, CgridView, Calendar, … Widget tạo ra sự tiện dụng cho người phát triển, giúp việc sử dụng lại code được thực hiện dễ dàng và hiệu quả hơn rất nhiều.

2.3.Luồng hoạt trộng trong Yii Project

H39: Luồng hoạt động trong một ứng dụng Yii

- Khi có request từ người dùng, đầu tiên file bootrap index.php sẽ được thực thi và tạo ra đối tượng Cwebapplication. Đối tượng này làm nhiệm vụ quản lý các controller và component .

- Đối tượng Webapp sẽ xác định thông tin chi tiết về yêu cầu của người dùng thông qua component request.

- Đối tượng Webapp xác định controller và action được gọi đến thông qua component URL Manager.

- Sau khi xác định được controller và action , Webapp gọi đến controller và action đó. Một thể hiện của Controller được tạo ra. Trước khi action được thực

thi, controller sẽ tạo ra và thực thi bộ lọc tương ứng với action đó. Nếu thỏa mãn các điều kiện của bộ lọc thì action sẽ được thực thi. Ngược lại, nếu không thỏa mãn các yêu cầu thì sẽ có thông báo lỗi.

- Khi thực hiện action, action đọc dữ liệu từ model rồi render đến 1 view nào đó và truyền dữ liệu đến view đó. View đọc dữ liệu từ model.

- View thực thi widget (adsbygoogle = window.adsbygoogle || []).push({});

TÀI LIỆU THAM KHẢO

1. Bài giảng môn Phân tích thiết kế hướng đối tượng của thầy Nguyễn Hữu Đức

2. Sách “Phát triển hệ thống hướng đối tượng với UML 2.0 và C++” của thầy Nguyễn Văn Ba

3. Sách “Phân tích thiết kế Hướng đối tượng sử dụng UML “ của thầy Đoàn Văn Ban

Một phần của tài liệu Hướng dẫn làm website học trực tuyến (Trang 48)