Giao diện Menu

Một phần của tài liệu Đồ án Lập trình Web: Xây dựng Website kinh doanh nhà hàng ẩm thực Nhật Bản Nihonfood (Trang 35)

Chương IV : THỰC HIỆN SẢN PHẨM

4.1 GIAO DIỆN NGƯỜI DÙNG

4.1.3 Giao diện Menu

Hình 4.3 Giao diện Menu

– Khi khách hàng bấm vào trang menu sẽ hiển thị những món ăn khác nhau dựa vào loại món ăn.

Hình 4.4 Loại món ăn

– Chức năng này sẽ giúp người dùng tìm kiếm món ăn theo loại món ăn.

– Khi khách hàng bấm vào loại món ăn sẽ hiển thị đúng loại món ăn đó ở trang menu.

Hình 4.6 Sắp xếp món ăn theo loại món ăn (Cháo)

– Giao diện đăng nhập, đăng ký.

– Khi bấm vào trang web sẽ chuyển qua trang đăng nhập, nếu chưa có tài khoản có thể đăng ký.

Hình 4.8 Giao diện đăng nhập

– Nếu thông tin đăng nhập trùng với dữ liệu trong database thì đăng nhập thành cơng và chuyển về trang chủ.

– Nếu đăng nhập thành công sẽ chuyển qua trang chủ. 35

Hình 4.9 Giao diện đăng ký 4.1.4 Giao diện chi tiết sản phẩm

– Khi click vào sản phẩm bất kì ở menu hoặc trang chủ sẽ đi tới chi tiết sản phẩm của chính sản phẩm đó. Phía dưới sẽ có các món ăn cùng loại.

Hình 4.10 Chi tiết món ăn 4.1.5 Giao diện giỏ hàng

Hình 4.11 Giao diện giỏ hàng

Giao diện giỏ hàng ở phần số lượng có ơ thay đổi dễ dàng cho khách hàng khi sử dụng hơn.

H ình 4.12 Giao diện giỏ hàng khi trống

4.1.6 Chức năng phân trang

Hình 4.13 Chứ năng phân trang

– Khi phân trang sẽ giúp khách hàng không phải kéo trang xuống nhiều hơn.

4.1.7 Bảng tin

Hình 4.14 Bảng tin 1

Hình 4.15 Bảng tin 2 - Có thể xem các tin tức về nhà hàng ở trong bảng này.

4.1.8 Chi tiết bảng tin

Hình 4.16 Chi tiết bảng tin

4.1.9 Về chúng tơi

Hình 4.18 About 2

Hình 4.19 About 3

Hình 4.20 About 4

Form này sẽ nói về những người lập ra nhà hàng. Video về món ăn có tại nhà hàng.

Hình 4.21 Giao diện thanh tốn

- Khi khách hàng thanh tốn sẽ in những thơng tin khách hàng như họ tên, địa chỉ, sdt,...

Hình 4.22 Lời cảm ơn khách hàng sau khi thanh tốn.

4.1.11 Plugin Facebook

4.1.12 API Google Maps

Hình 4.24 Liên hệ với chúng tôi tại Địa điểm

4.2 GIAO DIỆN NGƯỜI QUẢN LÝ (ADMIN)

4.2.1 Đăng nhập ADMIN

- Chỉ có admin mới được phép đăng nhập vào trang quản trị, mỗi admin sẽ dược cấp một tài khoản để vào hệ thống quản trị, chỉ cần nhập đúng tài khoản và mật khẩu sẽ đăng nhập vào trong.

Hình 4.25 Form login admin

- Muốn vào form quản lý bắt buộc admin phải đăng nhập vì an tồn bảo mật.

4.2.2 Chức năng quản lý món ăn

Hình 4.26 Quản lý món ăn

- Có thể chỉnh sửa, xem chi tiết, xóa các món ăn ở form này.

4.2.3 Chi tiết món ăn ADMIN

Hình 4.27 Chi tiết món ăn

– Các thơng tin như món ăn, loại món, giá món ăn, mơ tả,.. sẽ được hiển thị để admin có thể dễ dàng xem. Admin muốn sửa thơng tin thì bấm vào điều chỉnh.

4.2.4 Chức năng sửa món ăn

Hình 4.28 Khi sửa thơng tin món ăn

– Khi Admin muốn chỉnh sửa thơng tin món ăn sẽ hiển thị như trên.

– Có thể chỉnh loại món, tên món, giá món ăn,..mơ tả. – Ảnh món ăn sau khi cập nhật sẽ xuống cơ sở dữ liệu.

– Bấm lưu thông tin để tất cả thông tin sẽ cập nhật xuống cơ sở dữ liệu.

4.2.5 Chức năng xóa món ăn

Hình 4.29 Khi xóa món ăn

4.2.6 Quản lý thơng tin khách hàng

Hình 4.30 Quản lý thông tin khách hàng Admin chỉ xem được các thông tin như tên, sdt.

Không thể chỉnh sửa thơng tin khách hàng.

Được xóa khách hàng.

4.2.7 Quản lý loại món ăn

Hình 4.31 Quản lý loại món ăn

– Admin có thể thêm và xóa loại món ăn.

– Khơng thể xóa nếu loại món ăn đó cịn được sử dụng trong bảng món ăn.

4.2.8 Sửa chi tiết đơn đặt hàng

Hình 4.32 Sửa đơn hàng

4.2.9 Quản lý chi tiết giao hàng

Hình 4.33 Chi tiết giao hàng

4.2.10 Quản lý trang chủ

Hình 4.33 Quản lý trang chủ

– Admin có thể quản lý thơng tin đơn hàng qua những thao tác như chỉnh sửa xem chi tiết và xóa.

Chương V: KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN

5.1 KẾT LUẬN

5.1.1 Kết quả đạt được

CHỨC NĂNG HOÀN THIỆN

YÊU CẦU NỘI DUNG

TRANG

NGƯỜI DÙNG

 Menu phân cấp tự động theo loại món ăn giúp tiếp cận người dùng dễ dàng

 Danh sách món ăn theo loại món ăn

 Danh sách bài viết cho hay cho khách hàng, phân theo loài bài viết

 Thêm sản phẩm vào giỏ hàng dễ dàng

 Tìm kiếm sản phẩm theo tên nhập từ bàn phím (Theo tên sản phẩm, tên thương hiệu, danh mục sản phẩm…)

 Tích hợp API Google Map

 Trang tin tức giúp khách hàng nắm bắt thông tin nhà hàng dễ dàng

 Phân trang cho danh sách sản phẩm, thương hiệu

 URL thân thiện tối ưu hóa SEO TRANG

ADMIN

 Quản lý món ăn(Thêm, xóa, sửa Sản phẩm)

 Quản lý thơng tin khách hàng(Xem, xóa)

 Quản lý loại món ăn(Thêm, xóa, sửa Sản phẩm)

 Quản lý thơng tin đặt hàng(Xem, Sửa, Xóa) Website

 Tạo ra được giao diện thân thiện người dùng.

 Bố cục trang web, thiết kế rõ ràng, hợp lý, dễ theo dõi.

 Dễ dàng đặt hàng, liên hệ, thanh toán

5.1.2 Hướng phát triển

Trong tương lai chúng em muốn Website được hoàn chỉnh hơn về mặt chức năng.

Nhóm muốn thêm chức năng đặt bàn, giao hàng.

5.2 KIẾN NGHỊ

TÀI LIỆU THAM KHẢO [1] https://www.w3schools.com/php/default.asp [2] https://www.w3schools.com/angular/default.asp [3] https://stackoverflow.com/search?q=learning+php [4] https://Myclass.vn [5] http://www.tutorialsteacher.com/mvc/asp.net-mvc-tutorials [6] https://www.w3schools.com/bootstrap4/default.asp [7] http://thayphet.net/product-cat/176-lap-trinh-website-asp.net- mvc-5.html

[8] Các bộ thư viện của JS

[9] Slide bài giảng và bài tập thực hành lập trình web của thầy Dương Thành Phết.

[10] Tài liệu giáo trình + bài tập thực hành Cơ sở dữ liệu của thầy Cao Tùng Anh.

[11] Tài liệu tham khảo tập hợp từ nhiều đồ án và nhiều trang website.

[12] Lập trình dự án Website bán hàng ASP.NET MVC 4 (tedu.com.vn)

Một phần của tài liệu Đồ án Lập trình Web: Xây dựng Website kinh doanh nhà hàng ẩm thực Nhật Bản Nihonfood (Trang 35)

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

(58 trang)