Báo cáo Đồ Án android Ứng dụng Đặt Đồ Ăn nhanh

4 Giao diên activity wellcom, register và sign in 2.2.1 Giao diện và chức năng của admin Khi đăng nhập vào giao diện admin ta sẽ có các chức năng chính như thêm hoặc xóa tài khoản admi

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG CAO ĐẲNG KINH TẾ - KỸ THUẬT CẦN THƠ KHOA CÔNG NGHỆ THÔNG TIN - TRUYỀN THÔNG

BÁO CÁO ĐỒ ÁN ANDROID ỨNG DỤNG ĐẶT ĐỒ ĂN NHANH

Giáo viên hướng dẫn: Lương Minh Giang Môn: Rèn nghề lập trình android

Mã học phần: CTH506 Sinh viên thực hiện: Nguyễn Khả Duy

Mã số sinh viên: 21CTHA0363 Lớp: CCNTT21E

Em xin chân thành cảm ơn sự hướng dẫn của các thầy giáo, cô giáo trong Khoa Công nghệ thông tin - Trường Cao Đẳng Kinh Tế Kỹ Thuật Cần Thơ đã tạo mọi điều kiện và luôn giúp đỡ, hướng dẫn em tận tình để em hoàn thành đồ án này Em chân thành cảm

ơn các thầy cô luôn sẵn sàng giúp đỡ và tạo mọi điều kiện tốt nhất cho em Cảm ơn gia đình, bạn bè luôn quan tâm động viên giúp đỡ để em có được như ngày hôm nay Mặc dù có nhiều cố gắng bằng toàn bộ kiến thức để hoàn thành công việc, song thời gian và kinh nghiệm của bản thân chưa được trau dồi nhiều nên việc trình bày, phân tích, xây dựng chương trình còn nhiều thiếu sót cần được bổ sung Vì vậy em rất mong nhận được ý kiến đóng góp của thầy có đề sản phẩm này có thể hoàn thiện, được ứng dụng vào thực tiễn

MỤC LỤC

PHẦN 1: TỔNG QUAN ĐỒ ÁN 1

1.1 Giới thiệu 1

1.2 Mục tiêu 1

1.3 Quy trình thực hiện 2

PHẦN 2: THIẾT KẾ VÀ XÂY DỰNG 3

2.1 Các lược đồ chính 3

2.1.1 Lược đồ Use Case 3

2.1.2 Cơ sở dữ liệu 3

2.1.3 Các chức năng chính 4

2.2 Giao diện sản phẩm 4

2.2.1 Giao diện và chức năng của admin 5

2.2.1.1 Giao diện chức năng Add Admin 7

2.2.1.2 Giao diện thay đổi mật khẩu hoặc xóa tài khoản admin hiện tại 7

2.2.1.3 Giao diện danh sách admin và xóa các tài khoản admin khác 8

2.2.1.4 Giao diện chức năng thêm mới 9

2.2.1.5 Giao diện chức năng xem danh sách, xóa và chỉnh sửa thông tin 10

2.2.1.6 Giao diện chức năng danh sách đặt hàng 15

2.2.2 Giao diện và chức năng của User 16

2.2.2.1 Giao diện trang home 16

2.2.2.2 Giao diện trang profile 18

2.2.2.2.1 Giao diện chức năng chỉnh sửa thông tin cá nhân 18

2.2.2.2.2 Giao diện theo dỗi đơn đặt hàng 19

2.2.2.3 Giao diện trang Cart 20

DANH MỤC HÌNH

Hình 1 1 Icon app fast food 1

Hình 1 2 Lược đồ use case 3

Hình 1 3 Cơ sở dữ liệu 3

Hình 1 4 Giao diên activity wellcom, register và sign in 5

Hình 1 5 Giao diện chính của chức năng admin 6

Hình 1 6 Giao diện của chức năng thêm mới admin 7

Hình 1 7 Giao diện chức năng thay đổi mật khẩu admin và xóa tài khoản 8

Hình 1 8 Giao diện danh sách các admin 8

Hình 1 9 Giao diện chính của chức năng thêm mới 9

Hình 1 10 Giao diện chức năng thêm mới nhân viên,món ăn và loại món ăn 10

Hình 1 11 Giao diện chức năng thêm giá bán,phương thức thanh toán và size 10

Hình 1 12 Giao diện chính của chức năng danh sách 11

Hình 1 13 Giao diện danh sách nhân viên và chức năng tìm kiếm 12

Hình 1 14 Giao diện thông tin nhân viên 12

Hình 1 15 Giao diện danh sách món ăn, chức năng tìm kiếm và thông tin món ăn 13

Hình 1 16 Giao diện danh sách loại món ăn,chức năng tìm kiếm và thông tin loại món ăn 13

Hình 1 17 Giao diện danh sách giá bán,chức năng tìm kiếm và thông tin giá bán 14

Hình 1 18 Giao diện danh sách khách hàng và chức năng tìm kiếm 14

Hình 1 19 Giao diện danh sách PTTT,chức năng tìm kiếm và thông tin PTTT 15

Hình 1 20 Giao diện danh sách size,chức năng tìm kiếm và thông tin size 15

Hình 1 21 Giao diện danh sách đơn hàng và thông tin đơn hàng 16

Hình 1 22 Giao diện trang home của user 16

Hình 1 23 Giao diện trang home với chức năng lọc món ăn theo loại 17

Hình 1 24 Giao diện trang home với chức năng tìm kiếm món ăn 17

Hình 1 25 Giao diện thêm Bottom Sheet Dialog thêm vào giỏ hàng 18

Hình 1 26 Giao diện chính của trang profile 18

Hình 1 27 Giao diện chỉnh sửa thông tin cá nhân 19

Hình 1 28 Giao diện danh sách lịch sử đơn đặt hàng 19

Hình 1 29 Giao diện thông tin đơn hàng 20

Hình 1 30 Giao diện chính của trang cart 21

Hình 1 31 Giao diện bottom sheet dialog 21

PHẦN 1: TỔNG QUAN ĐỒ ÁN

1.1 Giới thiệu

Việc sử dụng và lựa chọn các món ăn nhanh để thưởng thức trong xã hội hiện đại đã trở thành một câu chuyện thường ngày trong cuộc sống của mỗi người Tuy nhiên trong thời điểm mà lựa chọn là cực kỳ nhiều và lối sống tấp nập như hiện nay, việc tiếp cận một nhà cửa hàng ưa thích hay đơn giản hơn là tận hưởng những món ăn hấp dẫn đã dần trở nên xa xỉ Lý do cho việc này là vì mọi người cần phải đến trực tiếp nơi món ăn đó được tạo ra để xác định rằng mình sẽ thưởng thức nó, nhưng với nhiều người, họ có thể không có đủ thời gian cho việc đó, hoặc nơi họ cần đến không còn đủ chỗ để tiếp đón

họ

Từ những ảnh hưởng trên, ứng dụng di động Fast Food đã được tạo ra để hướng tới những người dùng tiềm năng mang trong mình niềm đam mê ẩm thực mãnh liệt với châm ngôn “Khám phá - Đặt hàng - Giao tận nơi”

Hình 1 1 Icon app fast food

1.3 Quy trình thực hiện

1 Phân tích mô hình hoạt động và lên ý tưởng

2 Thiết kế lược đồ Use Case và cơ sở dữ liệu

3 Thiết kế giao diện và các chức năng

4 Tạo project

5 Tiến hành triển khai giao diện

6 Xây dựng cơ sở dữ liệu mẫu và các chức năng của ứng dụng

7 Kiểm tra hoạt động của ứng dụng

8 Tinh chỉnh ứng dụng và kết thức đồ án

PHẦN 2: THIẾT KẾ VÀ XÂY DỰNG

2.1 Các lược đồ chính

2.1.1 Lược đồ Use Case

Hình 1 2 Lược đồ use case

2.1.2 Cơ sở dữ liệu

Hình 1 3 Cơ sở dữ liệu

2.1.3 Các chức năng chính

Admin

1 Tạo tài khoản cho admin khác

2 Xóa tài khoản admin

3 Thay đổi mật khẩu

4 Thêm món ăn, size, phương thức thanh toán,…

5 Xem danh sách món ăn

6 Tìm kiếm món ăn, giá bán,…

7 Cập nhật thông tin, giá ban cho món ăn,…

8 Xóa món ăn

9 Đăng xuất / đăng nhập

User

1 Tìm kiếm món ăn

2 Thêm món ăn vào giỏ hàng

3 Xóa món ăn ra khỏi giỏ hàng

4 Đặt hàng, thanh toán (có thể đặt một lần nhiều món)

5 Theo dõi lịch sử đặt hàng

6 Hủy đơn hàng

7 Chỉnh sửa thông tin cá nhân

8 Thay đổi mật khẩu

9 Đăng xuất / đăng nhập / đăng kí

2.2 Giao diện sản phẩm

Đầu tiên khi vào app sẽ xuất hiện giao diện Wellcom

Trường hợp nếu là người dùng (user) trong trường hợp đã có tài khoản đăng nhập thì chúng ta sẽ click vào Sign In nếu như không có tài khoản khi đăng nhập vào sẽ thông báo qua Toast rằng tài khoản không tồn tại còn trường hợp nếu không nhập bất kì thông tin gì mà click Sign In thì Edittext sẽ báo lỗi bằng cách báo đỏ những Edittext chưa nhập thông tin bằng Edittext.error và yêu cầu ta phải nhập đầy đủ thông tin cần đăng nhập.Trường hợp mà không có tài khoản thì ta sẽ chọn Register để đăng kí tài khoản, sau khi đăng kí thành công sẽ hiện lên thông báo đăng kí thành công bằng Toast và trường hợp đăng kí không thành công cũng vậy

Trường hợp là một Admin sau khi cài đặt ứng dụng trên máy xong nếu muốn đăng

nhập vào thì đã có 1 tài khoản mặc định chỉ cần nhập:

Tài khoản(Phone): Admin

Mật khẩu(Password): admin@123

Do người tạo ứng dụng thiết lập sẵn sau khi vào có thể tạo 1 tài khoản admin mới bằng số điện thoại và xóa đi tài khoản mặc định để bảo mật an toàn.Và đây là những hình ảnh giao diện của Activity Wellcom, Register và Sign In:

Hình 1 4 Giao diên activity wellcom, register và sign in

2.2.1 Giao diện và chức năng của admin

Khi đăng nhập vào giao diện admin ta sẽ có các chức năng chính như thêm hoặc xóa tài khoản admin,thay đổi mật khẩu của tài khoản admin hiện tại, danh dách các admin, chức năng thêm mới các món ăn,giá bán,…, chức năng danh sách món ăn và ta

có thể sửa hoặc xóa món ăn trong chức năng danh sách, xem đơn đặt hàng của khách hàng và cuối cùng là đăng xuất khỏi tài khoản admin và sau đây là phần giao diện chính của admin:

Hình 1 5 Giao diện chính của chức năng admin

2.2.1.1 Giao diện chức năng Add Admin

Khi vào chức năng thêm một admin mới sẽ xuất hiện giao diện như sao, khi thêm một admin mới ta cần số điện thoại và mật khẩu, số điện thoại sẽ không được trùng nhau:

Hình 1 6 Giao diện của chức năng thêm mới admin

2.2.1.2 Giao diện thay đổi mật khẩu hoặc xóa tài khoản admin hiện tại

Đối với chức năng này ta không thê chỉnh sửa số điện thoại được ta chỉ có thể thay đổi được mật khẩu, về chức năng xóa, sau khi ta bấm xóa sẽ xuất hiện một Builder Dialog xác nhận lại một lần nữa xem có thật sự muốn xóa hay không

để tránh trường hợp bấm nhầm xóa tài khoản, sau khi xác nhận xóa thì sẽ tự động đăng xuất

Hình 1 7 Giao diện chức năng thay đổi mật khẩu admin và xóa tài khoản

2.2.1.3 Giao diện danh sách admin và xóa các tài khoản admin khác

Về chức năng này ta có thể phát triển thêm là chỉ cho một tài khoản admin của chủ cửa hàng dùng được chức năng này để quản lí các admin khác, mỗi item trong ListView sẽ có một Button xóa nằm ở phía trước nếu muốn xóa admin nào thì chỉ cần click Button xóa và Builder Dialog sẽ hiện lên để xác nhận có muốn xóa tài khoản admin

đó hay không, sau khi xóa xong ListView sẽ tự động reset lại danh sách Dưới đây là giao diện danh sách admin:

Hình 1 8 Giao diện danh sách các admin

2.2.1.4 Giao diện chức năng thêm mới

Khi vào chức năng thêm mới giao diện thêm mới sẽ xuất hiện và dưới đây là giao diện chính của chức năng thêm mới, bên trong chức năng này sẽ có các chức năng nhỏ như thêm mới món ăn, giá bán,… Và đối với chức năng thêm mới nhân viên khi nhập ngày sinh chỉ cần click vào Edittext sẽ hiện lên Datepicker Dialog để chọn ngày sinh

Hình 1 9 Giao diện chính của chức năng thêm mới

Khi click vào một trong những chức năng bên trên sẽ xuất hiện một giao diện

để nhập thông tin của nhân viên,món ăn,… Riêng đối với nhân viên,món ăn và loại món

ăn sẽ có thêm phần cập nhật ảnh cho từng món ăn, loại món ăn hoặc ảnh đại diện cho nhân viên để dễ dàng nhận biết,nếu không chọn ảnh mà click button để thêm vào thì vẫn thêm được nhưng khi ta chưa nhập bất kì thông tin nào hoặc nhập thiếu thông tin thì sẽ thông báo lỗi ở những Edittext mà chưa nhập thông tin bằng cách thông báo bằng Edittext.error, và dưới đây là giao diện của cá chức năng thêm mới:

Hình 1 10 Giao diện chức năng thêm mới nhân viên,món ăn và loại món ăn

Hình 1 11 Giao diện chức năng thêm giá bán,phương thức thanh toán và size

2.2.1.5 Giao diện chức năng xem danh sách, xóa và chỉnh sửa thông tin

Khi vào chức năng danh sách giao diện danh sách sẽ xuất hiện và dưới đây là giao diện chính của chức năng danh sách, bên trong chức năng này sẽ có các chức năng nhỏ như danh sách món ăn, giá bán,…

Hình 1 12 Giao diện chính của chức năng danh sách

Khi click vào một trong những chức năng của danh sách sẽ xem được danh sách của chức năng đó, chẳng hạn như chức năng danh sách nhân viên sẽ xem được danh sách nhân viên, nếu muốn xem, xóa bỏ, hoặc cập nhật thông tin bất kì của một record nào thì chỉ cần click vào record đó sẽ thực hiện được các chức năng nêu trên Ngoài ra mỗi một danh sách, phía trên cùng của gaio diện sẽ có một Edittext dùng để tìm kiếm một record bất kì hoặc nhưng record có tên liên quan đến kí tự nhập vào Edittext, khi xóa bỏ hết các kí tự trong Edittext thì danh sách trở lại trạng thái ban đầu Còn nếu muốn xóa một record khi nhấn button delete thì sẽ xuất hiện Builder Dialog xác nhận rằng có muốn xóa record đó không nếu có thì danh sách sẽ được lòa lại còn không thì Builder Dialog sẽ tắt đi.Còn khi cập nhật thông tin nếu cập nhật thành công sẽ hiện thông báo cập nhật thành công thông ra Toast còn nến không nhập đầy đủ thông tin mà cập nhật thì sẽ báo lỗi ở những Edittext chưa nhập thông tin bằng Edittext.error.Và riêng đối với khách hàng không thể xem thông tin khách hàng hay sửa hoặc xóa khách hàng,và dưới đây là những giao diện của các chức năng trên:

Hình 1 13 Giao diện danh sách nhân viên và chức năng tìm kiếm

Hình 1 14 Giao diện thông tin nhân viên

Hình 1 15 Giao diện danh sách món ăn, chức năng tìm kiếm và thông tin món ăn

Hình 1 16 Giao diện danh sách loại món ăn,chức năng tìm kiếm và thông tin loại món

ăn

Hình 1 17 Giao diện danh sách giá bán,chức năng tìm kiếm và thông tin giá bán

Hình 1 18 Giao diện danh sách khách hàng và chức năng tìm kiếm

Hình 1 19 Giao diện danh sách PTTT,chức năng tìm kiếm và thông tin PTTT

Hình 1 20 Giao diện danh sách size,chức năng tìm kiếm và thông tin size

2.2.1.6 Giao diện chức năng danh sách đặt hàng

Khi click vào chức năng danh sách đặt hàng của khách hàng sẽ xuất hiện giao diện danh sách và nếu muốn xem chi tiết đơn đặt hàng thì click vào đơn đặt hàng đó,nếu muốn quay trở lại thì click vào button mũi tên trên góc bên trái trên để quay trở lại, và dưới đây là giao diện danh sách đặt hàng và thông tin đơn hàng:

Hình 1 21 Giao diện danh sách đơn hàng và thông tin đơn hàng

2.2.2 Giao diện và chức năng của User

2.2.2.1 Giao diện trang home

Sau khi người dùng đăng nhập vào thành công, đầu tiên sẽ vào phần home, ngoài

ra còn có các chức năng khác như profile, cart hay chức năng tìm kiếm sản phẩm và ban đầu vào, sản phẩm được phân theo loại nếu muốn thêm vào giỏ hàng loại nào thì click vào loại đó hoặc có thể seach ở ô tìm kiếm, sau khi ô tìm kiếm trống thì danh sách các món ăn trở về ban đầu và đúng loại đang chọn

Hình 1 22 Giao diện trang home của user

Hình 1 23 Giao diện trang home với chức năng lọc món ăn theo loại

Hình 1 24 Giao diện trang home với chức năng tìm kiếm món ăn

Ở gia diện home nếu muốn thêm món ăn vào giỏ hàng chì cần click vào món ăn sau đó Bottom Sheet Dialog sẽ hiện lên và có những lựa chọn như Spinner(Combobox)

để lựa chọn size, và muốn mua với số lượng bao nhiêu chỉ cần click chọn vào dấu cộng hoặc trừ để chọn số lượng, và sau khi chọn xong sẽ click Button Add To Cart để thêm vào giỏ hàng và Dialog sẽ tắt đi, và dưới đây là giao diện của Bottom Sheet Dialog:

Hình 1 25 Giao diện thêm Bottom Sheet Dialog thêm vào giỏ hàng

2.2.2.2 Giao diện trang profile

Nếu người dùng muốn xem thông tin cá nhân của bản thân mình chỉ cần click vào Profile để xem được thông tin cá nhân, đăng xuất, chỉnh sửa thông tin cá nhân vầ theo dõi lịch sử đơn hàng của mình, dưới đây là giao diện chính của trang Profile:

Hình 1 26 Giao diện chính của trang profile

2.2.2.2.1 Giao diện chức năng chỉnh sửa thông tin cá nhân

Khi ở chức năng này người dùng có thể thay đổi được mật khẩu, hoặc các thông tin cá nhân của người dùng ngoài ra cũng có thể cập nhật ảnh đại diện của người bằng cách click vào ảnh đại diện và chọn hình ảnh, sau khi thông tin được nhập xong thì click button update để thông tin được cập nhật lại, ngoài ra muốn xóa tài khoản người

dùng chỉ cần click button delete thì tài khoản người dùng sẽ được xóa bỏ và tự động chuyển về trang đăng nhập, và dưới đây là giao diện cập nhật thông tin người dùng:

Hình 1 27 Giao diện chỉnh sửa thông tin cá nhân

2.2.2.2.2 Giao diện theo dỗi đơn đặt hàng

Ngoài chức năng chỉnh sửa thông tin người dùng, trang profile còn có chức năng theo dõi lịch sử đơn đặt hàng, và nếu muốn xem chi tiết đơn đặt hàng chỉ cần click vào đơn hàng muốn xem thông tin hoặc hủy, và nếu muốn trở về chỉ cần click và button mũi tên bến góc trái trên của màn hình để trở về, và dưới đây là giao diện của danh sách lịch sử đơn đặt hàng và giao diện của activity thông tin đơn đặt hàng: