2Functional requirements– Đăng ký: Người dùng đăng ký tài khoản.– Đăng nhập: Người dùng đăng nhập vào hệ thống để sử dụng dịch vụ.– Chọn món: Khách hàng chọn món ăn mong muốn để đưa vào
Functionals
– Đăng ký: Người dùng đăng ký tài khoản.
– Đăng nhập: Người dùng đăng nhập vào hệ thống để sử dụng dịch vụ.
– Chọn món: Khách hàng chọn món ăn mong muốn để đưa vào giỏ hàngchờ thanh toán.
– Thêm ghi chú: Khách hàng thêm ghi chú cần thiết về món ăn.
– Đặt món: Khách hàng nhấn đặt món để đặt tất cả các món ăn trong giỏ.
– Thanh toán: Khách hàng thanh toán cho bữa ăn đã đặt.
– Theo dõi đơn đặt món: Khách hàng có thể theo dõi quá trình chuẩn bị món ăn mình đã xác nhận đặt.
– Để lại nhận xét: Người dùng có thể để lại nhận xét về toàn bộ trải nghiệm của bữa ăn.
– Xác nhận thanh toán: Nhân viên xác nhận thanh toán cho khách hàng bằng tiền – mặt.Xem thông tin tất cả các order: Theo dõi lại thông tin tất cả các đơn hàng khách hàng đã đặt.
– Cập nhật trạng thái của món ăn: Cập nhật trạng thái món ăn trong quá trình phục vụ.
– Thiết lập Menu: Thay đổi Menu các món ăn phục vụ của nhà hàng.
– Xem báo cáo: Xem báo cáo tổng quát của hệ thống.
– Xem phản hồi từ khách hàng: Xem lại phản hồi của khách hàng trong một khoảng thời gian nào đó.
Use case diagram
Use case description
Use case "Sign up"
Use Case Name: Đăng ký
Created By: Nguyễn Trần Hồng Ngọc
Actors: Nhân viên, đầu bếp, quản lý.
Description: Người dùng đăng ký tài khoản.
Trigger: Người dùng muốn đăng ký tài khoản đăng nhập của hệ thống. Preconditions: Trang đăng ký hiển thị bình thường khi được người dùng chọn.
Người dùng chưa có tài khoản và phải là nhân viên làm việc của nhà hàng.
Thiết bị của người dùng đã được kết nối internet.
Postconditions: Hệ thống ghi nhận thông tin đáng ký thành công và hiển thị thông báo.
Người dùng có thể đăng nhập vào tài khoản của mình. Normal Flow: 1 Người dùng truy cập vào đường link của hệ thống.
2 Hệ thống hiển thị giao diện trang chủ.
3 Người dùng chọn ô đăng ký.
4 Hệ thống hiển thị khung đăng ký với các thông tin cần điền.
5 Người dùng nhập thông tin bắt buộc và chọn "Đăng ký".
6 Hệ thống hiện khung xác đăng ký tài khoản.
7 Người dùng xác nhận đăng ký
8 Hệ thống kiểm tra thông tin hợp lệ và hiển thị thông báo đăng ký thành công.
Alternative Flows: Alternative 1: Ở bước 6: Người dùng không xác nhận và hủy bỏ việc đăng ký.Alternative 2: Ở bước 7:
+ Nếu tên tài khoản đã tốn tại hệ thống hiển thị thông báo và use case tiếp tục ở bước 5 + Nếu phần xác nhận lại mật khẩu không trùng khớp với mật khẩu hệ thồng hiển thị thông báo và use case tiếp tục ở bước 5
- Ở bước 5: Hệ thống kiểm tra có một thông tin không hợp lệ sẽ hiển thị thông báo và yêu cầu người dùng nhập lại.
+ Nếu người dùng chọn hủy đăng ký thì use case dừng lại.+ Nếu người dùng nhập lại thông tin hợp lệ thì use case tiếp tục thực hiện lại bước 5.
Sau khi được nhận vào làm ở nhà hàng, với quy định mỗi nhân viên đều phải có tài khoản đăng nhập vào hệ thống của nhà hàng, để nhà hàng có thể kiểm soát nhân viên cũng như phục vụ tốt nhất cho khách hàng Nhân viên phải đăng ký cho mình một tại khoản để làm việc đúng như quy định.
Hình 2: "Sign up" mockupDescription:
No Field Name Description Control
1 Sign up Ô đăng ký Button N/A Không N/A
2 Log in Ô đăng nhập Button N/A Không N/A
3 Sign up Khung đăng ký Pop up Text Có N/A
4 Name Nhập tên của người muốn đăng ký Text input Text Có "Name"
5 Staff ID Nhập mã số nhân viên Text input Text Có "Staff ID"
6 Date of Birth Nhập ngày tháng năm sinh Text input Text Có "Date of
7 Address Nhập địa chỉ Text input Text Có "Address"
8 Email Nhập địa chỉ Email Text input Text Không "Email"
9 Phone Nhập số điện thoại Text input Text Có "Ph
10 Account Nhập tên tài khoản Text input Text Có "Account"
11 Password Nhập mật khẩu Password input Password Có "password"
Password Xác nhận lại mật khẩu Password input Password Có "password"
13 I agree to terms and conditions Đồng ý các điều khoản và điều kiện của nhà hàng Checkbox Text Có N/A
14 sign up Ô chọn đăng ký button Text Có N/A
Khung xác nhận đăng ký Pop up Text Có N/A
17 Yes/No Xác nhận hoặc không Button Text Có N/A
18 You have signed up successfully
Thông báo xác nhận đăng ký Pop up Text Có N/A
Hình 3: "Sign up" sequence diagram
Hình 4: "Sign up" activity diagram
Use case "Log in"
Use Case Name: Đăng nhập
Created By: Nguyễn Trần Hồng Ngọc
Actors: Nhân viên, đầu bếp, quản lý.
Description: Người dùng đăng nhập vào hệ thống để sử dụng dịch vụ Trigger: Người dùng muốn đăng nhập vào hệ thống
Pre-conditions: Trang đăng nhập hiển thị bình thường khi được người dùng chọn.
Người dùng đã có tài khoản đăng nhập của hệ thống.
Thiết bị của người dùng đã được kết nối internet.
Tài khoản của người dùng đã được phân quyền.
Post-conditions: Người dùng đăng nhập thành công.
Hệ thống ghi nhận người dùng đã đăng nhập thành công. Người dùng có thể sử dụng các chức năng được cho phép. Normal Flow: 1 Người dùng truy cập vào đường link của hệ thống.
2 Hệ thống hiển thị giao diện trang chủ.
3 Người dùng chọn vào ô đăng nhập.
4 Hệ thống hiển thị khung đăng nhập cho người dùng.
5 Người dùng chọn phương thức đăng nhập phù hợp với tài khoản thành viên của mình.
6 Người dùng nhập thông tin tài khoản và chọn đăng nhập.
7 Hệ thống xác thực thông tin người dùng thành công và cho phép người dùng truy cập vào hệ thống.
8 Hệ thống xác nhận hoạt động đăng nhập của người dùng. Alternative Flows:
- Ở bước 5: Hệ thống xác thực thông tin người dùng không thành công và hiển thị thông báo.
Nếu người dùng chọn hủy đăng nhập, thì use case dừng lại. Nếu người dùng chọn lấy lại mật khẩu, thì use case tiếp tục ở UC-1.5 Bảng 3: Use case "Log in"
Sau khi đăng ký thành công tài khoản đăng nhập, nhân viên sẽ có thể đi làm ngay theo đúng lịch trực của mỗi người Mỗi ngày đi làm mỗi người đều phải đăng nhập tài khoản của mình vào hệ thống lúc bắt đầu ca làm việc và sau khi ca làm kết thúc , việc đó cũng sẽ thay thế cho việc chấm công mỗi ngày, đồng thời sẽ luôn ở trạng thái phục vụ khách hàng tốt nhất mà không cần phải tiếp xúc trực tiếp với khách hàng, đặc biệt là trong mùa dịch bệnh như hiện nay.
Hình 5: "Log in" mockup Description:
No Field Name Description Control
1 Sign up Ô đăng ký Button N/A Không N/A
2 Log in Ô đăng nhập Button N/A Không N/A
3 Log in Khung đăng nhập Pop up Text Có N/A
4 Account Nhập tên tài khoản Text input Text Có "Account"
5 Password Nhập mật khẩu Password input Password Có "password"
15 log in Ô chọn đăng nhập button Text Có N/A
Hình 6: "Log in" sequence diagram
Hình 7: "Log in" activity diagram
Use case "Choose food"
Use Case Name: Chọn món
Created By: Nguyễn Trần Hồng Ngọc
Description: Khách hàng chọn món ăn mong muốn để đưa vào giỏ hàng chờ thanh toán.
Trigger: Khách hàng muốn chọn món ăn
Preconditions: Khách hàng truy cập thành công sau khi quét mã QR.
Thiết bị di động đã được kết nối internet.
Postconditions: Các món ăn khách hàng chọn đều được nằm trong giỏ hàng. Normal Flow: 1 Sau khi khách hàng quét mã QR thành công, trang web của nhà hàng hiện ra Hệ thống hiển thị giao diện trang chủ.
2 Khách hàng chọn vào menu 3 Hệ thống hiển thị thực đơn gồm thông tin món ăn và giá.
4 Khách hàng xem và tìm món ăn mình muốn.
5 Sau khi tìm được món ăn, khách hàng nhấn vào ô "Chọn"
6 Hệ thống sẽ hiện khung xác nhận thêm vào giỏ 7 Khách hàng sẽ được tùy chỉnh số lượng cho món ăn, sau đó chọn
8 Món ăn được thêm vào giỏ hàng thành công khi hệ thống hiển thị thông báo.
Bảng 5: Use case "Choose food"
Khi vào nhà hàng, khách hàng sẽ được nhân viên dẫn đến bàn trống để ngồi và sẽ được hướng dẫn cách để đặt món ăn trên hệ thống Sau khi khách hàng quét mã QR thành công, menu sẽ được hiện ra cho khách hàng lựa chọn, khách hàng sẽ được nhân viên gợi ý món ăn hoặc giải đáp thắc mắc nếu khách hàng có yêu cầu; cũng giống việc mua hàng online, sau khi tìm được món ăn ưng ý khách hàng sẽ thêm vào giỏ hàng. Khách hàng có thể tùy chỉnh số lượng món ăn trước khi thêm vào giỏ, khi món ăn được thêm thành công hệ thống sẽ hiển thị thông báo.
1 Menu Hiển thị thực đơn các món ăn Button Text Có N/A
2 Tên món ăn Tên của các món ăn có trong thực đơn Display Text Có N/A
3 Giá tiền Giá tiền ăn 1 phần của các món ăn Display Text Có N/A
Tùy chỉnh thể loại món ăn mà khách hàng muốn tìm
Dùng để biết được khách hàng ăn vào ngày nào khi xuất hóa đơn
6 Choose Nút chọn món ăn cho vào giỏ Button Text Có N/A
7 Choose food Khung tùy chỉnh và xác nhận chọn món Pop up Text Có N/A
8 Thanh điều chỉnh số Điều chỉnh số lượng phần ăn mong muốn Expand list Text Có "Number"
9 Confirm Nút xác nhận chọn món ăn Button N/A Có N/A
10 Cancel Nút hủy chọn món ăn đó Button N/A Có N/A
11 Biểu tượnggiỏ hàng Dùng để xem giỏ hàng Button Image Có N/A
Thông báo chọn món thành công Pop up Text Có N/A
Hình 9: "Choose food" sequence diagram
Hình 10: "Choose food" activity diagram
Use case "Add note"
Use Case Name: Thêm ghi chú
Created By: Nguyễn Đức Thuận
Description: Khách hàng thêm ghi chú cần thiết về món ăn.
Trigger: Khách hàng muốn thêm ghi chú cho món ăn
Preconditions: Khách hàng đã đặt món trên hệ thống
Postconditions: Khách hàng thêm ghi chú thành công
Normal Flow: 1 Sau khi đã chọn món ăn thành công khách hàng click vào nút thêm ghi chú cho món ăn
2 Hệ thống hiển thị thông báo nhập ghi chú cho monas ăn
3 Khách hàng thêm những ghi chú cần thiết cho món ăn
4 Hệ thống trả về list món ăn với dòng ghi chú
Bảng 7: Use case "Add note"
Sau khi chọn món ăn, khách hàng có thể thêm chú ý cho món ăn để lưu ý cho đầu bếp Khách hàng có thể bỏ qua bước này nếu thấy không cần thiết.
Hình 11: "Add note" mockupDescription:
1 Tên món ăn Tên của món ăn đã chọn Display Text Có N/A
2 Giá tiền Giá của món ăn đã đặt Display Text Có N/A
3 Nút thêm ghi chú Người dùng bấm vào để thêm ghi chú Button No type Có N/A
Thông báo khách hàng thêm ghi chú cho món ăn
Bảng thông báo này sẽ hiện ra khi khách hàng nhấn "Add note"
5 Nút thay đổi ghi chú
Sau khi đã thêm ghi chú cho món ăn nút
"Add notenote" sẽ biến thành nút
"Change note" để khách hàng thay đổi ghi chú cho món ăn
Bảng 8: "Add note" descriptionSequence diagram:
Hình 12: "Add note" sequence diagram
Use case "Make order"
Use Case Name: Đặt món
Created By: Nguyễn Trần Hồng Ngọc
Description: Khách hàng nhấn đặt món để đặt tất cả các món ăn trong giỏ.
Trigger: Khách hàng muốn đặt các món đã chọn
Preconditions: Trong giỏ hàng phải có ít nhất 1 món ăn.
Khách hàng đã kiểm tra lại giỏ hàng của mình.
Postconditions: Hệ thống sẽ xác nhận đơn đặt hàng thành công và hiển thị thông báo.
Hệ thống ghi nhận đơn đặt hàng.
Normal Flow: 1 Sau khi khách hàng đã hoàn tất việc chọn món vào giỏ hàng, khách hàng nhấn chọn "Xem lại giỏ hàng".
2 Hệ thống sẽ lấy thông tin các món ăn đã chọn của khách hàng và hiển thị trong giỏ hàng
3 Khung giỏ hàng sẽ hiện lên để khách hàng kiểm tra và tùy chỉnh món ăn.
4 Sau khi kiểm tra, khách hàng sẽ chọn "Đặt món".
4 Hệ thống sẽ hiển thị khung cho khách hàng xác nhận đặt hàng "Confirm/Cancel".
5 Khách hàng xác nhận "Confirm" 6 Hệ thống sẽ xác nhận đơn hàng được đặt thành công và thông báo hoàn tất.
7 Hệ thống ghi nhận đơn đặt hàng.
Exceptions: Exeption 1: Ở bước 5: Nếu khách hàng xác nhận "Cancel" thì use case sẽ tiếp tục ở bước 2.
Exeption 2: Ở bước 6: Hệ thống xác nhận đã hết 1 trong những món ăn đã được chọn sẽ hiển thị thông tin món ăn đã hết và thông báo đặt món ăn thất bại và quay về khung giỏ hàng
+ Nếu khách hàng muốn hủy món ăn đó và tiếp tục đặt món thì use case quay lại thực hiện bước 2.
+ Nếu khách hàng muốn chọn thêm món ăn khác thì khách hàng nhấn chọn "Cancel" ở bước 5 và use case thực hiện UC- 3.2.
Bảng 9: Use case "Make order"
Sau khi đã hoàn tất việc chọn món, khách hàng có thể chọn "Xem lại giỏ hàng" để kiểm tra và tùy chỉnh lại những món ăn đã cho vào giỏ hàng Khách hàng sẽ tiến hành đặt những món đã chọn, chọn vào ô "Đặt món", hệ thống sẽ hiển thị khung xác nhận, khách hàng chỉ việc xác nhận, hệ thống sẽ ghi nhận và thông báo đến cho tài khoản của nhân viên nhà hàng để tiến hành chuẩn bị món ăn và xác định vị trí bàn ăn để mang ra khi chuẩn bị xong.
1 Menu Hiển thị thực đơn các món ăn Display Text Có N/A
2 Biểu tượng giỏ hàng Dùng để xem giỏ hàng Button Image Có N/A
3 Tên món ăn Tên của các món ăn đã chọn Display Text Có N/A
4 Giá tiền Giá tiền ăn 1 phần của các món ăn đã chọn Display Text Có N/A
5 Add note Nút hiển thị nơi ghi chú món ăn Button N/A Có N/A
6 Thanh điều chỉnh số Điều chỉnh số lượng phần ăn mong muốn Expand list Text Có "Number"
7 Add note Nút chọn thêm ghi chú Button Text Có N/A
8 Confirm Nút xác nhận chọn món ăn Button N/A Có N/A
9 Cancel Nút hủy chọn món ăn đó Button N/A Có N/A
Thông báo đặt món thành công Pop up Text Có N/A
Bảng 10: "Make order" descriptionSequence diagram:
Hình 15: "Make order" sequence diagramActivity diagram:
Hình 16: "Make order" activity diagram
Use case "Pay by online service"
Use Case Name: Pay by online service
Created By: Nguyễn Đức Thuận
Description: Khách hàng thanh toán cho bữa ăn đã đặt.
Trigger: Khách hàng nhấn vào nút thanh toán.
Preconditions: Khánh hàng hoàn tất đặt món
Postconditions: Khách hàng thanh toán thành công
Normal Flow: 1 Khách hàng click vào nút chọn thanh toán trên trang web.
2 Hệ thống hiển thị 2 phương thức thanh toán bằng online hoặc tiền mặt.
3 Khách hàng họn thanh toán bằng online.
4 List các danh sách ví điện tử và ngân hàng liên kết sẽ được hiện ra.
5 Khách hàng chọn một trong số các ví điện tử và ngân hàng, nhập thông tin xác thực tương ứng
6 Hệ thống xác thực tài khoản khách hàng thành công.
7 Khách hàng xác nhận thanh toán.
8 Hệ thống kiểm tra số dư tài khoản đủ thanh toán.
9 Khách hàng xác nhận thanh toán 10 Hệ thống sẽ hiển thị thanh toán thành công và hoá đơn sẽ được in ra màn hình.
Alternative Flows: Nếu khách hàng xác thực được tài khoản ví điện tử hay ngân hàng không thành công hệ thống sẽ báo thanh toán thất bại. Khách hàng có thể chọn thanh toán bằng tiền mặt.
Nếu khách hàng xác thực tài khoản thành công nhưng tài khoản không đủ để thanh toán hệ thống sẽ báo thanh toán thất bại.
Bảng 11: Function "Pay by online service"
Sau khi khách hàng đã hoàn tất đặt món, khách hàng sẽ qua bước thanh toán Khách hàng có thể thanh toán bằng tiền mặt hoặc thanh toán online.Nếu khách chon thanh toán online phải qua bước xác nhận tài khoản bên bên thứ 3, Khách hàng sẽ nhận được hóa đơn nếu như quá trình thanh toán thành công.
Hình 17: "Pay by online" mockupDescription:
No Field Name Description Control
1 Tên món ăn Tên của món ăn đã chọn Display Text Có N/A
2 Giá tiền Giá của món ăn đã đặt Display Text Có N/A
3 Ghi chú Ghi chú cho món ăn Display Text Không N/A
4 Tổng tiền Thể hiện tổng giá tiền các món ăn Display Text Có N/A
5 Nút thanh toán Khách hàng bấm vào để thanh toán Button No type Có N/A
Hỏi khách hàng thanh toán bằng tiền mặt hay online Display Text Có N/A
7 2 phương thức thanh toán online
Khách hàng có thể thanh toán bằng thẻ ngân hàng hoặc ví momo
8 Nút xác nhận đã chọn phương thức thanh toán
Xác nhận phương thức thanh toán Button No type Có N/A
9 Khung tìm kiếm ngân hàng Tìm kiếm ngân hàng Display No type Có N/A
10 Danh sách ngân hàng Danh sách ngân hàng có liên kết với nhà hàng Display Graph Có N/A
11 Nút xác nhận đã chọnngân hàng Xác nhận đã chọn ngân hàng Button No type Có N/A
12 Khung nhập số thẻ ngân hàng Nhập số thẻ ngân hàng Text box No type Có N/A
13 Khung nhập tên chủ thẻ ngân hàng Nhập tên thẻ ngân hàng Text box No type Có N/A
14 Khung nhập mật khẩu Nhập mật khẩu Text box No type Có N/A
15 Nút xác nhận đã nhập thông tin thẻ Xác nhận đã nhập thông tin thẻ Button No type Có N/A
16 Thông báo xác nhận lại khách hàng muốn thanh toán
Xác nhận khách hàng muốn thanh toán Display Text Có N/A
17 Hóa đơn được in ra màn hình
Hóa đơn chứa thông tin các món ăn đã đặt và xác nhận thanh toán thành Display Text Có N/A
Hình 19: "Pay by online service" activity diagram
Use case "Pay by cash"
Use Case Name: Pay by cash
Created By: Nguyễn Đức Thuận
Description: Khách hàng thanh toán cho bữa ăn đã đặt.
Trigger: Khách hàng nhấn vào nút thanh toán.
Preconditions: Khánh hàng hoàn tất đặt món
Postconditions: Khách hàng thanh toán thành công
Normal Flow: 1 Khách hàng chọn thanh toán.
2 Hệ thống hiển thị 2 phương thức thanh toán.
3 Khách hàng chọn thanh toán bằng tiền mặt.
4 Hệ thống yêu cầu nhân viên xác nhận thanh toán cho khách hàng.
5 Nhân viên xác nhận khách hàng đã thanh toán trên hệ thống.
6 Hệ thống thông báo khách hàng thanh toán thành công.
Bảng 13: Function "Pay by cash"
Sau khi khách hàng đã hoàn tất đặt món, khách hàng sẽ qua bước thanh toán Khách hàng có thể thanh toán bằng tiền mặt.Nhân viên sẽ nhận tiền và xác nhận thanh toán cho khách hàng trên hệ thống Khách hàng sẽ nhận được hóa đơn nếu như quá trình thanh toán thành công.
Hình 20: "Pay by cash" mockup Description:
No Field Name Description Control
1 Tên món ăn Tên của món ăn đã chọn Display Text Có N/A
2 Giá tiền Giá của món ăn đã đặt Display Text Có N/A
3 Ghi chú Ghi chú cho món ăn Display Text Không N/A
4 Tổng tiền Thể hiện tổng giá tiền các món ăn Display Text Có N/A
5 Nút thanh toán Khách hàng bấm vào để thanh toán Button No type Có N/A
Hỏi khách hàng thanh toán bằng tiền mặt hay online Display Text Có N/A
7 Hóa đơn được in ra màn hình
Hóa đơn chứa thông tin các món ăn đã đặt và xác nhận thanh toán thành công
Bảng 14: "Pay by cash" descriptionSequence diagram:
Hình 22: "Pay by cash" activity diagram
Use case "Confirm payment"
Use Case Name: Xác nhận thanh toán.
Created By: Nguyễn Đức Thuận
Description: Khi khách hàng lựa chọn thanh toán bằng tiền mặt Hệ thống sẽ gửi một thông báo đến danh sách toàn bộ order của ứng dụng Khi đó nhân viên sẽ đi đến để nhận tiền từ khách hàng. Sau khi nhận tiền, nhân viên nhấn xác nhận khách hàng đã hoàn thành thanh toán.
Trigger: Khách hàng chọn thanh toán bằng tiền mặt.
Preconditions: Khách hàng lựa chọn thanh toán bằng tiền mặt trong trang thanh toán.
Postconditions: Khách hàng thanh toán tiền mặt cho nhân viên Sau khi kiểm đếm, nhân viên nhấn xác nhận thanh toán.
Normal Flow: 1 Ứng dụng thông báo cho nhân viên xác nhận thanh toán cho khách hàng.
2 Nhân viên nhấn xác nhận hoàn thành thanh toán cho khách hàng.
3 Hệ thống thông báo thanh toán thành công.
Vì lý do nào đó đôi khi khách hàng không thể thanh toán online mà vẫn phải dùng tiền mặt Do đó hệ thống cần chức năng thanh toán bằng tiền mặt Khách hàng chọn thanh toán bằng tiền mặt, hệ thống sẽ thông báo đến nhân viên phụ trách order đó.Khách hàng đưa tiền mặt trực tiếp cho nhân viên Sau đó nhân viên sẽ giúp khách hàng xác nhận hoàn thành thanh toán.
1 Thông tin order Thông tin chung của đơn hàng Display Text Có N/A
2 Nút xác nhận Nhân viên chọn xác nhận thanh toán Button N/A Có N/A
3 Nút ẩn bớt Thu gọn thông tin, trở về trang theo dõi tất cả order Button N/A Có N/A
Bảng 16: "Confirm payment" description Sequence diagram:
Hình 24: "Confirm payment" sequence diagram
Hình 25: "Confirm payment" activity diagram
Use case "Track order"
Use Case Name: Theo dõi đơn đặt món
Created By: Đặng Vũ Sĩ Đan
Description: Sau khi xác nhận đặt món, ứng dụng sẽ chuyển đến trang theo dõi đơn đặt món để khách hàng có thể theo dõi quá trình chuẩn bị món ăn mình đã xác nhận đặt.
Trigger: Người dùng nhấn xác nhận đặt món.
Preconditions: Người dùng nhấn xác nhận đặt món thành công.
Postconditions: Hệ thống ghi nhận yêu cầu đặt món và hiển thị biểu đồ theo dõi quá trình chuẩn bị món ăn.
Normal Flow: 1 Người dùng nhấn xác nhận đặt món.
2 Hệ thống xác nhận đặt món thành công.
3 Hệ thống hiển thị giao diện theo dõi đơn đặt món.
4 Người dùng theo dõi quá trình chuẩn bị món ăn.
Exceptions: Tại bước 1: hệ thống ghi nhận đơn hàng được xác nhận không hợp lệ.
Bảng 17: Use case "Track order"
Sau khi xác nhận đặt món thành công, khách hàng có thể theo dõi món ăn họ đặt đã được chuẩn bị đến bước nào Trong thời gian đó, khách hàng có thể trò chuyện hoặc thư giãn Nếu món ăn được chuẩn bị quá lâu, khách hàng có thể phàn nàn với nhân viên phục vụ Hệ thống sẽ hiển thị thông tin về quá trình chuẩn bị món ăn của khách hàng,bắt đầu từ khi xác nhận đặt món đến khi các món ăn được hoàn thành.
1 Số ID của order Hiển thị ID (theo thứ tự) của order Display Text Có N/A
2 Đồng hồ Hiển thị thời gian còn lại (ước tính) Display Text Có 00:15:00
3 Biểu đồ Hiển thị quá trình xử lý order Display Graph Có "Received"
4 Thông tin chi tiết Chi tiết thông tin của phần biều đồ Display Text Có N/A
Hình 29: "Track order" sequence diagram
Hình 30: "Track order" activity diagram
Use case "Leave feedback"
Use Case Name: Để lại nhận xét
Created By: Đặng Vũ Sĩ Đan
Description: Sau khi hoàn thành thanh toán, hệ thống sẽ tự động chuyển đến trang đánh giá Tại đây người dùng có thể để lại nhận xét về toàn bộ trải nghiệm của bữa ăn.
Trigger: Người dùng bấm thanh toán.
Preconditions: Người dùng thanh toán thành công.
Postconditions: Chuyển đến giao diện đánh giá Người dùng có thể đánh giá dịch vụ và để lại đánh giá về dịch vụ Hoặc bỏ qua nếu không muốn đánh giá.
Normal Flow: 1 Người dùng thanh toán thành công đơn đặt món.
2 Hệ thống hiển thị giao diện đánh giá chất lượng phục vụ.
3 Người dùng để lại đánh giá, và nhấn "publish feedback" để gửi đánh giá.
4 Hệ thống hiển thị giao diện cảm ơn khách hàng vì đã để lại đánh giá.
5 Hệ thống hiển thị giao diện "cảm ơn đã sử dụng dịch vụ và hẹn gặp lại".
3a Người dùng nhấn bỏ qua, ứng dụng chuyển đến bước 5. Exceptions: Tại bước 1: hệ thống ghi nhận thanh toán đơn hàng không thành công.
Sau khi hoàn tất thanh toán Hệ thống mời khách hàng để lại nhận xét, đánh giá cũng như phàn nàn (nếu có) Hằng ngày, quản lý sẽ xem lại toàn bộ những phản hồi từ khách hàng để cải thiện và nâng cao chất lượng dịch vụ.
Khách hàng bấm vào thang đánh giá để cho điểm đánh giá Button N/A Có N/A
2 Text box Khách hàng có thể nhập đánh giá vào text box
3 Nút gửi Khách hàng chọn gửi đánh giá Button N/A Có N/A
Hình 34: "Leave feedback" sequence diagram
Hình 35: "Leave feedback" activity diagram
Use case "See all orders"
Use Case Name: Xem thông tin tất cả các order
Created By: Đặng Vũ Sĩ Đan
Actors: Đầu bếp, nhân viên, quản lý.
Description: Sau khi đăng nhập, trang chính của các tài khoản có phân quyền nhân viên, đầu bếp và quản lý hiển thị thông tin của tất cả các order chưa hoàn thành và được sắp xếp theo thứ tự thời gian xác nhận (từ cũ đến mới) Tại đây họ có thể xem chi tiết thông tin của tất cả các order và thực hiện các thao tác "chọn" để xác nhận mình đang làm việc trên một (hoặc nhiều) order để chuẩn bị món ăn và phục vụ khách hàng một cách tốt nhất (đối với nhân viên và đầu bếp) Đối với quản lý, chức năng này giúp họ theo dõi tốc độ xử lý đơn hàng để quản lý công việc hiệu quả, tránh để khách hàng chờ đợi quá lâu.
Trigger: Đầu bếp, nhân viên, quản lý nhấn đăng nhập.
Preconditions: Đầu bếp, nhân viên, quản lý đăng nhập thành công.
Postconditions: Đầu bếp, nhân viên "chọn" làm việc trên một (hoặc nhiều) order và xem thông tin chi tiết của tất cả các order chưa hoàn thành Quản lý theo dõi tốc độ xử lý đơn hàng trên toàn bộ danh sách đơn hàng.
Normal Flow: 1 Người sử dụng đăng nhập thành công vào hệ thống.
2 Hệ thống hiển thị giao diện xem toàn bộ order chưa hoàn thành.
3 Người sử dụng chọn xem thông tin chi tiết của tất cả các order.
4 Hệ thống hiển thị thông tin chi tiết của order.
5 Người sử dụng "chọn" các order để làm việc (nhân viên và đầu bếp).
6 Hệ thống hiển thị dấu đã chọn đối với người dùng hiện tại, các người dùng khác không thể "chọn" được nữa.
Exceptions: Tại bước 3: Người dùng không thể "chọn" các order đã có người chọn trước.
Bảng 21: Function "See all orders"
User story: Để làm việc hiệu quả, đầu bếp cần phải biết anh ta cần nấu những món gì Chức năng xem tất cả các order giúp đầu bếp nắm được thông tin các món ăn cần chuẩn bị, từ đó sắp xếp công việc một cách hiệu quả Tương tự, nhân viên cũng cần theo dõi thông tin của tất cả các order đang tồn tại để sắp xếp phục vụ hiệu quả, tránh để khách hàng chờ quá lâu khi có yêu cầu phục vụ Đối với quản lý, họ luôn luôn cần để mắt đến danh sách order, đảm bảo không có khách hàng nào bị bỏ quên hoặc chờ đợi quá lâu.
Hình 36: "See all orders" mockup 1 (staff view)
Hình 37: "See all orders" mockup 2 (manager view)
Hình 38: "See all orders" mockup 3
1 Thanh tìm kiếm Người dùng nhập thông tin tìm kiếm Text box N/A Có N/A
Người dùng "sort" danh sách theo một số tiêu chí (chưa có phục vụ/đầu bếp )
Người dùng xem danh sách toàn bộ order Display N/A Có N/A
Người dùng xem thông tin chi tiết của order và thực hiện các thao tác chọn
Người dùng chọn hiện/ẩn thông tin chi tiết của order Button N/A Có N/A
6 Check box Người dùng "chọn" đánh dấu làm việc trên order Button N/A Có N/A
Bảng 22: "See all orders" descriptionSequence diagram:
Hình 40: "See all orders" activity diagram
Use case "update orders’ status"
Use Case Name: Cập nhật trạng thái của món ăn
Created By: Nguyễn Văn Bảo Khánh
Description: Món ăn có 5 trạng thái: Khi khách hàng đã gửi order nhưng đầu bếp chưa xác nhận thì trạng thái "Chờ xác nhận" sẽ xuất hiện "Đang chuẩn bị" là lúc đầu đầu bếp tiếp nhận món ăn nhưng chưa thưc hiện chế biến xong Trạng thái: "Món ăn đã hủy" xảy ra khi món ăn đã hết trong hôm đó và không thể tiếp tục phục vụ Trạng thái: "Sẵn sàng" là lúc đầu bếp thực hiện chế biến xong món ăn nhưng chưa phục vụ cho khách hàng Sau khi món ăn được phục vụ trạng thái sẽ được chuyển thành "Đã phục vụ"
Trigger: Đầu bếp cập nhật trạng thái của các món ăn khách hàng đã đặt.
Preconditions: - Thiết bị của đầu bếp phải có kết nối mạng.
- Đầu bếp đã đăng nhập vào hệ thống với role của mình.
- Đầu bếp đang ở giao diện "Danh sách món ăn phục vụ"
- Khách hàng đã đặt món thành công Postconditions: - Trạng thái của các món ăn được thay đổi.
Normal Flow: 1 Hệ thống sẽ hiện lên chi tiết món ăn khách hàng đã đặt.
2 Đầu bếp ấn vào nút "Xác nhận".
3 Hệ thống cập nhật trạng thái món ăn trên máy khách hàng sẽ là "Đang chuẩn bị".
4 Đầu bếp sau khi chế biến xong món ăn thì sẽ ấn vào nút
5 Hệ thống cập nhật trạng thái của món ăn đó thành "Sẵn sàng" trên thông tin máy khách hàng.
6 Sau khi nhân viên đã lấy món ăn lên phục vụ cho khách hàng thì đầu bếp ấn vào nút "Hoàn thành".
7 Hệ thống cập nhật trạng thái của món ăn trên máy khách hàng sẽ được chuyển thành "Đã phục vụ".
- Ở bước 2: Đầu bếp ấn vào nút "Món ăn đã hết" lúc này trên máy khách sẽ hiện "Món đã hết"
Bảng 23: Use case "Update order status"
User story: Để làm việc hiệu quả, tránh được sự nhầm lẫn và thiếu sót trong quá trình phục vụ món ăn cho khách hàng thì người đầu bếp sẽ phải xác nhận những trạng thái hiện tại của món ăn Cũng như khi cập nhật trạng thái sẽ giúp khách hàng theo dõi được quá trình món ăn của mĩnh đã được phục vụ như thế nào.
Hình 41: "Update order status" mockup
1 Tên bữa ăn Hiển thị tên của bữa ăn đang order Display N/A Có N/A
Món ăn Hiển thị tên món được order Display Text Có N/A
3 Trạng thái Hiển thị trạng thái của món ăn Display Text Có Chờ xác nhận
4 Xác nhận Cập nhật trạng thái
"Đang chuẩn bị" cho món ăn Button N/A Có N/A
"Món đã hết" cho món ăn Button N/A Có N/A
6 Sẵn sàng Cập nhật trạng thái
"Sẵn sàng" cho món ăn Button N/A Có N/A
"Đã phục vụ" cho món ăn Button N/A Có N/A
Hiển thị thông tin đầu bếp đang phục vụ Display Text Có N/A
Hiển thị thông tin nhân viên đang phục vụ Display Text Có N/A
Bảng 24: "Update order status" descriptionSequence diagram:
Hình 42: "Update orders status" sequence diagram
Hình 43: "Update orders status" activity diagram
Use case "Set menu"
Hình 44: "Set menu" use case detail
Use Case Name: Thêm món ăn vào menu
Created By: Nguyễn Văn Bảo Khánh
Description: Quản lý sử dụng thao tác "Thêm món" để cập nhật những thay đổi cho Menu của nhà hàng.
Trigger: Thay đổi thực đơn của nhà hàng bằng cách thêm món ăn mới vào Menu Preconditions: - Thiết bị của quản lý phải có kết nối mạng.
- Quản lý đã đăng nhập vào hệ thống với role của mình.
- Quản lý đang ở trang giao diện "Danh sách món ăn"
Postconditions: - Món ăn được thêm vào Menu.
- Hành động thay đổi Menu được lưu lại.
Normal Flow: 1 Hệ thống sẽ hiện lên danh sách những món ăn hiện tại của nhà hàng đang phục vụ.
2 Quản lý ấn vào nút "Thêm".
3 Hệ thống sẽ hiện lên Pop-up với các tác vụ "Upload hình", các text box "Tên món", "Giá món", "Mô tả".
4 Quản lý sau khi điền thông tin ấn "Xác nhận".
- Ở bước 2: quản lý ấn vào nút "Hủy bỏ" thì các thay đổi sẽ bị hủy và quay về bước 1.
- Ở bước 4: quản lý nhập thiếu thông tin, hệ thống sẽ thông báo "Dữ liệu nhập vào còn thiếu" Quay về bước 2.
Bảng 25: Use case "Set menu"
User story: Để thuận tiện trong việc quản lý thực đơn của nhà hàng cũng như giúp khách hàng không tốn quá nhiều thời gian khi lựa chọn những món ăn không còn phục vụ trong Menu Quản lý sẽ thường xuyên phải kiểm tra và cập nhật lại Menu của nhà hàng đúng với hiện trạng phục vụ của nhà hàng thời điểm hiện tại.
1 Thêm Thêm món ăn vào
Menu Hiển thị toàn bộ món ăn có trong Menu Display Text Có N/A
3 Sửa Sửa món ăn có trong
4 Xóa Xóa món ăn khỏi
Thêm Thêm thông tin món ăn Pop-up N/A Có N/A
Sửa Chính sửa thông tin món ăn Pop-up N/A Có N/A
Xóa Xác nhận xóa món ăn khỏi Menu Pop-up N/A Có N/A
Bảng 26: "Set Menu" descriptionSequence diagram:
Hình 46: "Set menu" sequence diagramActivity diagram:
Hình 47: "Set menu" activity diagram
Use case "View report"
Use Case Name: Xem báo cáo
Created By: Nguyễn Văn Bảo Khánh
Description: Quản lý xem báo cáo tổng quát của hệ thống.
Trigger: Quản lý xem báo cáo
Preconditions: - Thiết bị của quản lý phải có kết nối mạng.
- Quản lý đã đăng nhập vào hệ thống với role của mình.
- Quản lý đang ở trang giao diện "Xem báo cáo"
Postconditions: - Quản lý xem được báo cáo cùa nhà hàng
Normal Flow: 1 Người dùng đến trang giao diện "Xem báo cáo".
2 Hệ thống hiển thị trang báo cáo lên màn hình.
3 Người dùng có thể bấm vào chi tiết thông tin cần xem.
4 Hệ thống hiển thị chi tiết thông tin khách hàng lựa chọn. Alternative Flows:
Bảng 27: Use case "View report"
Người dũng cần xem lại thông tin về tình hình kinh doanh của nhà hàng để làm báo cáo hoặc có chiến lược phát triển phù hợp.
1 Tổng order trong ngày Thống kê toàn bộ số order trong ngày Display Text Có 0
Thống kê toàn bộ số order trong tháng Display Text Có 0
3 Tổng order trong năm Thống kê toàn bộ số order trong năm Display Text Có 0
Thống kê toàn bộ số nhân viên của cửa hàng Display Text Có 0
5 Tổng số món của nhà hàng
Thống kê toàn bộ số món ăn của nhà hàng đang có Display Text Có 0
Tổng quan về order trong tháng
Hiển thị tổng order trong tháng Display Chart Có N/A
Bảng 28: "View report" descriptionSequence diagram:
Hình 49: "View report" sequence diagramActivity diagram:
Hình 50: "View report" activity diagram
Use case "See client’s feedback"
Use Case Name: Xem phản hồi từ khách hàng
Created By: Nguyễn Văn Bảo Khánh
Description: Quản lý lựa chọn xem phản hồi của khách hàng trong một khoảng thời gian nào đó.
Trigger: Khi quản lý xem phản hồi của khách hàng
Preconditions: - Thiết bị của quản lý phải có kết nối mạng.
- Quản lý đã đăng nhập vào hệ thống với role của mình.
- Quản lý đang ở trang giao diện "Xem phản hồi"
Postconditions: - Quản lý sẽ xem được danh sách các phản hồi của khách hàng trong khoảng thời gian lựa chọn.
Normal Flow: 1 Người dùng đến giao diện "Xem phản hồi".
2 Người dùng lựa chọn ngày bắt đầu và ngày kết thúc.
3 Người dùng ấn "Xác nhận".
4 Hệ thống sẽ hiện thị chi tiết phản hồi của khách hàng trong khoảng thời gian người dùng lựa chọn.
- Ở bước 2: người dùng chọn ngày bắt đầu lớn hơn ngày kết thúc Hệ thống sẽ refresh trang và báo lỗi.
Bảng 29: Use case "See client’s feedback"
User story: Để nâng cao chất lượng phục vụ cho nhà hàng quản lý phải thường xuyên xem những phản hồi của khách hàng về chất lượng dịch vụ Từ đó có thể cải thiện hay chỉnh sửa cho phù hợp.
Hình 51: "View feedback" mockup Description:
1 Ngày bắt đầu Ngày bắt đầu xem phản hồi Input Date Có dd/mm/yyyy
2 Ngày kết thúc Ngày kết thúc xem phản hồi Input Date Có dd/mm/yyyy
3 Xác nhận Xác nhận ngày tháng xem phản hồi Button N/A Có N/A
Phản hồi của khách hàng trong thời gian được chọn Display Text Có N/A
Bảng 30: "View feedback" descriptionSequence diagram:
Hình 52: "See client’s feedback" sequence diagramActivity diagram:
Hình 53: "See client’s feedback" activity diagram
Tính dễ sử dụng
Người dùng có thể sử dụng ứng dụng mà không cần hoặc cần tối đa 5 phút để có thể sử dụng thành thạo ứng dụng.
Giao diện thân thiện với người dùng
Giao diện thể hiện đầy đủ tính năng nhưng không thừa thãi, khiến người dùng khó làm quen với ứng dụng.
Font chữ và các icon phải được tối giản để dễ dàng nhận diện Nội dung các hướng dẫn phải ngắn gọn và dễ hiểu.
Yêu cầu hiệu suất
Hệ thống xử lí ổn định 20 đơn hàng tại cùng 1 thời điểm.
Thời gian phản hồi của các tính năng phải dưới 1 giây (trong tình trạng kết nối internet ổn định).
Yêu cầu không gian
Ứng dụng phải được thiết kế để sử dụng hiệu quả tài nguyên phần cứng Đảm bảo hoạt động tốt trên các thiết bị di động có cấu hình phần cứng thấp.
Yêu cầu tính ổn định
Hệ thống hoạt động ổn định và đảm bảo không xảy ra sự cố trong thời gian làm việc(10:00AM - 12:00PM).
Yêu cầu bảo mật
Hệ thống và ứng dụng cần đảm bảo các tiêu chuẩn bảo mật và an toàn của các ngân hàng/ ví điện tử/ bên thứ 3 hợp tác với hệ thống.
Yêu cầu môi trường hoạt động
Hệ thống chạy được trên nhiều nền tảng trình duyệt web khác nhau (Chrome, Firefox,Edge, Safari).
Yêu cầu sử dụng hệ thống
Mỗi đầu bếp, quản lý, được xác định bằng một tài khoản được đăng ký và xác nhận từ trước.
Khách hàng không cần đăng kí tài khoản.
Yêu cầu về đạo đức
Khi khách hàng thực hiện thanh toán online, hệ thống không được phép lưu trữ thông tin thẻ credit/ debit của khách hàng.
Lựa chọn công nghệ
NodeJS
Node.js là một nền tảng (Platform) phát triển độc lập được xây dựng ở trên Javascript Runtimecủa Chrome mà chúng ta có thể xây dựng được các ứng dụng mạng một cách nhanh chóng vàdễ dàng mở rộng.
Node.js có những ưu điểm sau:
– Tốc độ xử lý nhanh Nhờ cơ chế xử lý bất đồng độ (non-blocking), NodeJS có thể xử lýhàng ngàn kết nối cùng lúc mà không gặp bất cứ khó khăn nào.
– Dễ dàng mở rộng Nếu bạn có nhu cầu phát triển website thì tính năng dễ dàng mở rộng của NodeJS là một lợi thế cực kỳ quan trọng.
ReactJS
React là thư viện JavaScript một mã nguồn mở để xây dựng giao diện người dùng và các thành phần giao diện người dùng Nó được duy trì bởi Facebook và một cộng đồng các nhà phát triển và công ty cá nhân React có thể được sử dụng làm cơ sở để phát triển các ứng dụng một trang hoặc ứng dụng di động Tuy nhiên, React chỉ quan tâm đến việc quản lý trạng thái và hiển thị trạng thái đó cho DOM, do đó, việc tạo ứng dụng React thường yêu cầu sử dụng các thư viện bổ sung để định tuyến, cũng như một số chức năng phía máy khách nhất định.
– React code được tạo ra từ các thực thể được gọi là các components Components có thể được hiển thị cho một phần tử cụ thể trong DOM bằng cách sử dụng thư viện React DOM.Khi hiển thị một thành phần, người ta có thể chuyển vào các giá trị được gọi là "props"
– Components chức năng được khai báo với một hàm sau đó trả về một số JSX. – Components dựa trên lớp được khai báo bằng cách sử dụng các lớp ES6.
– Mô hình đối tượng tài liệu ảo , hoặc DOM ảo React tạo ra một bộ nhớ cache cấu trúc dữ liệu trong bộ nhớ, tính toán sự khác biệt kết quả và sau đó cập nhật DOM được hiển thị của trình duyệt một cách hiệu quả Quá trình này được gọi là hòa giải Điều này cho phép lập trình viên viết mã như thể toàn bộ trang được hiển thị trên mỗi thay đổi, trong khi các thư viện React chỉ hiển thị các thành phần con thực sự thay đổi Kết xuất chọn lọc này cung cấp một hiệu suất lớn hơn Nó giúp tiết kiệm công sức tính toán lại kiểu CSS, bố cục cho trang và hiển thị cho toàn bộ trang.
Spring Boot
Spring Boot là một dự án phát triển bởi JAV (ngôn ngữ java) trong hệ sinh tháiSpring framework Nó giúp cho các lập trình viên chúng ta đơn giản hóa quá trình lập trình một ứng dụng với Spring, chỉ tập trung vào việc phát triển business cho ứng dụng.Khi sử dụng Spring Boot chúng ta không mất qua nhiều công đoạn và thời gian để tạo một web project đẻ chạy Mọi thứ đã được Spring Boot tự động làm hết như sử dụng các framework PHP như Symfony, Laravel, cái mà chúng ta quan tâm chỉ là develop Controller.
Một số ưu điểm của Spring Boot:
– Tạo các ứng dụng Spring độc lập.
– Nhúng trực tiếp Tomcat, Jetty hoặc Undertow (không cần phải deploy ra file WAR).
– Các starter dependency giúp việc cấu hình Maven đơn giản hơn.
– Tự động cấu hình Spring khi cần thiết.
– Không sinh code cấu hình và không yêu cầu phải cấu hình bằng XML.
MySQL Server
MySQL Server hệ cơ sở dữ liệu sử dụng lưu trữ ở phía server giúp client có thể dễ dàng truy cập và sử dụng dữ liệu.
Một số ưu điểm khi sử dụng MySQL:
– Dễ sử dụng: MySQL là cơ sở dữ liệu tốc độ cao, ổn định, dễ sử dụng và hoạt động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh. – Độ bảo mật cao: MySQL rất thích hợp cho các ứng dụng có truy cập CSDL trên Internet khi sở hữu nhiều nhiều tính năng bảo mật thậm chí là ở cấp cao.
– Đa tính năng: MySQL hỗ trợ rất nhiều chức năng SQL được mong chờ từ một hệ quản trị cơ sở dữ liệu quan hệ cả trực tiếp lẫn gián tiếp.
– Khả năng mở rộng và mạnh mẽ: MySQL có thể xử lý rất nhiều dữ liệu và hơn thế nữa nó có thể được mở rộng nếu cần thiết.
– Nhanh chóng: Việc đưa ra một số tiêu chuẩn cho phép MySQL để làm việc rất hiệu quả và tiết kiệm chi phí, do đó nó làm tăng tốc độ thực thi.
Dịch vụ bên thứ ba
Hệ thống sẽ sử dụng các dịch vụ bên thứ ba để phục vụ cho chức năng thanh toán(MOMO vàInternet Banking)
