1. Trang chủ
  2. » Luận Văn - Báo Cáo

Cáo Cáo THỰC TẬP CHUYÊN NGÀNH (XÂY DỰNG HỆ THỐNG WEBSITE BÁN BÁNH NGỌT)

59 7 0

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Xây Dựng Hệ Thống Website Bán Bánh Ngọt
Tác giả Nhóm 7
Trường học Trường Đại Học Công Nghiệp Hà Nội
Chuyên ngành Công Nghệ Thông Tin
Thể loại báo cáo thực tập chuyên ngành
Năm xuất bản 2022
Thành phố Hà Nội
Định dạng
Số trang 59
Dung lượng 7,74 MB

Cấu trúc

  • PHẦN 1: MỞ ĐẦU (8)
    • 1.1. Ý tưởng nghiên cứu (8)
    • 1.2. Nội dung kiến thức, kỹ năng cần đạt được (8)
    • 1.3. Phạm vi, đối tượng của hệ thống (9)
    • 1.4. Ý nghĩa thực tiễn của việc xây dựng hệ thống (9)
  • PHẦN 2: KẾT QUẢ NGHIÊN CỨU (10)
    • 2.1. Khảo sát hệ thống (10)
      • 2.1.1. Khảo sát về nghiệp vụ của cửa hàng (10)
      • 2.1.2. Mô tả sơ bộ hệ thống (12)
      • 2.1.3. Quy trình xử lý (12)
    • 2.2. Đặc tả yêu cầu người dùng (13)
      • 2.2.1. Hoạt động hệ thống (13)
      • 2.2.2. Yêu cầu chức năng (14)
      • 2.2.3. Yêu cầu phi chức năng (15)
    • 2.3. Phân tích hệ thống (15)
      • 2.3.1. Biểu đồ thực thể liên kết (15)
      • 2.3.2. Xác định tác nhân (16)
      • 2.3.3. Biểu đồ use case (17)
      • 2.3.4. Chi tiết các use case (19)
      • 2.3.5. Thiết kế cơ sở dữ liệu (37)
  • PHẦN 3: THỰC NGHIỆM CHƯƠNG TRÌNH (40)
    • 3.1. Giao diện màn hình chính (40)
    • 3.2. Giao diện đăng nhập (41)
    • 3.3. Giao diện phân quyền đăng nhập (42)
    • 3.4. Giao diện thông báo lỗi đăng nhập (43)
    • 3.5. Giao diện đăng ký tài khoản (45)
    • 3.6. Giao diện bảo trì của admin (47)
    • 3.8. Giao diện khi chọn xóa một sản phẩm (50)
    • 3.9. Giao diện sửa một sản phẩm (51)
    • 3.10. Chức năng xem danh mục bánh (53)
    • 3.11. Chức năng xem thông tin cửa hàng (54)
    • 3.12. Giao diện xem thông tin chi tiết sản phẩm (55)
    • 3.13. Giao diện mua hàng (56)
    • 3.14. Giao diện chọn xóa sản phẩm trong giỏ (57)
    • 3.15. Giao diện đặt hàng (58)
  • Kết luận (59)

Nội dung

Tìm hiểu và nắm vững kỹ thuật lập trình website bằng các loại ngôn ngữ như HTML, CSS, Asp.Net... Hiểu được cách thức hoạt động của ClientServer. Hiểu được cách thức lưu trữ dữ liệu của hệ quản trị cơ sở dữ liệu MySQL Server.

KẾT QUẢ NGHIÊN CỨU

Khảo sát hệ thống

2.1.1 Khảo sát về nghiệp vụ của cửa hàng

Qua quá trình khảo sát hiện tại đã thu thập được những thông tin nghiệp vụ như sau:

Hình 1: Cửa hàng bánh Anh Hòa

- Tên cửa hàng: ANH HÒA bakery

- Địa điểm kinh doanh: là nơi thuận lợi cho việc kinh doanh của cửa hàng.

Cửa hàng của chúng tôi tọa lạc tại vị trí đắc địa, gần nhiều khu dân cư, trường học và công ty, mang đến một lượng khách hàng tiềm năng lớn Mặc dù nằm trong khu vực nhộn nhịp, không gian bên trong lại rất rộng rãi và yên tĩnh, lý tưởng cho những ai yêu thích sự tĩnh lặng cũng như những người muốn thưởng thức cảnh quan sôi động bên ngoài.

- Lĩnh vực kinh doanh: Cung cấp bánh.

- Hình thức kinh doanh: bán bánh, ăn tại cửa hàng và đem về.

Chủ cửa hàng kiêm kế toán thường quản lý hoạt động bán hàng bằng cách ghi chép sổ sách và hóa đơn, đồng thời lưu trữ mọi thông tin quan trọng bằng giấy tờ, bao gồm đơn hàng, sổ nợ, sổ thanh toán, số hàng nhập và hóa đơn thanh toán.

- Cửa hàng chưa có máy tính.

- Công việc nhập dữ liệu vào sổ sách đơn giản, nhưng khó tra cứu và mất thời gian, gặp nhiều rủi ro nếu nhập sai dữ liệu.

⮚ Các quy tắc quản lý cửa hàng:

- Quản lý hàng nhập về: Mã SP, Tên SP, Nhà cung cấp, Số lượng, Đơn giá, Ngày nhập.

- Quản lý hàng bán ra: Mã SP, Tên SP, Số lượng, Đơn giá, Tổng tiền, Ngày bán

- Quản lý tài chính: Quản lý tổng thu chi, Lãi suất hàng tháng.

⮚ Các quy định về hàng hóa:

- Mặt hàng bán chạy nhất là mặt hàng bán được số lượng nhiều nhất

- Hàng bán chậm nhất là hàng bán được nhỏ hơn 1/5 số lượng nhập về

- Có sự ưu tiên giảm giá với các khách hàng quen thuộc.

⮚ Hạn chế của hệ thống hiện tại:

Hầu hết các cửa hàng hiện nay vẫn áp dụng phương pháp thủ công trong việc quản lý, từ lưu trữ đến thống kê, nhập xuất và tìm kiếm Phương pháp này không chỉ tốn nhiều thời gian và công sức mà còn mang lại hiệu quả thấp, đôi khi gây ra những sai sót không đáng có.

Để nâng cao hiệu quả và giảm thiểu chi phí trong quản lý cửa hàng bánh, việc xây dựng một hệ thống quản lý hiện đại là điều cần thiết, nhằm loại bỏ những phương pháp lạc hậu và lỗi thời.

2.1.2 Mô tả sơ bộ hệ thống a Nhiệm vụ cơ bản:

- Cung cấp dịch vụ cho khách hàng: đặt bánh

- Lưu trữ, cập nhật thông tin dịch vụ, khách hàng

- In hóa đơn, báo cáo, thống kê. b Cơ cấu tổ chức

Bộ phận quản lý khách hàng:

- Cập nhật thông tin khách hàng.

- Đối chiếu thông tin khách hàng.

- Tiếp nhận yêu cầu gọi dịch vụ.

- Kiểm tra tình trạng dịch vụ.

- Kiểm tra thông tin khách hàng.

- Tính toán tiền đơn hàng.

- In hóa đơn thanh toán.

Hiện nay, nhu cầu tiêu thụ bánh ngọt tăng cao dẫn đến sự ra đời của nhiều cửa hàng bánh ngọt mới Để đáp ứng số lượng lớn khách hàng, việc quản lý các hoạt động như ghi chép, tính tiền, đặt hàng, quản lý khách hàng và nhân viên sẽ được thực hiện nhanh chóng và hiệu quả thông qua hệ thống quản lý phần mềm.

Khách hàng có thể đặt bánh trước bằng cách gọi điện hoặc truy cập website của cửa hàng để tìm hiểu thông tin về các loại bánh, giá cả và khuyến mãi Họ cũng có thể đăng ký thông tin cần thiết để thuận tiện hơn trong việc đặt hàng.

Khi đặt xong đơn hàng thì nhân viên sẽ kiểm tra và xác nhận lại đơn hàng để đưa ra thông báo cho việc đặt bánh của khách hàng.

Sau khi hoàn tất phiếu đặt hàng, nhân viên cần cập nhật thông tin khách hàng vào hệ thống Đối với khách hàng mới, nhân viên sẽ thực hiện việc thêm thông tin khách hàng vào cơ sở dữ liệu (CSDL).

Khi khách hàng đến nhận bánh, nhân viên sẽ kiểm tra thông tin khách hàng và đối chiếu với thông tin trên phiếu đặt hàng Sau khi xác nhận mọi thông tin đều chính xác, nhân viên sẽ giao đơn hàng cho khách.

Khi khách hàng thanh toán đơn hàng, nhân viên sẽ kiểm tra phiếu đặt hàng trên hệ thống, đối chiếu thông tin khách hàng và tính toán số tiền cần thanh toán để xuất hóa đơn Đối với khách hàng yêu cầu hóa đơn đỏ, nhân viên sẽ thu thập và kiểm tra thông tin như tên khai thuế, mã số khai thuế và địa chỉ khai thuế để đảm bảo tính hợp lệ Để mang lại quyền lợi cho khách hàng, người quản lý sẽ phân loại khách hàng thành hai nhóm: khách hàng thân thiết và khách hàng mới, trong đó khách hàng thân thiết sẽ được ưu tiên thông qua các chương trình khuyến mại và giảm giá.

Đặc tả yêu cầu người dùng

Khi truy cập vào trang chủ của website, khách hàng sẽ thấy danh sách đa dạng các sản phẩm như bánh sinh nhật, bánh mì, bánh mặn, teabreak, cookies và mini cake, giúp họ dễ dàng lựa chọn Trang web còn tích hợp thanh tìm kiếm, giỏ hàng, thông tin liên hệ và chương trình khuyến mãi, cùng với hệ thống cửa hàng, mang lại cho khách hàng cái nhìn rõ ràng về chi tiết từng sản phẩm.

Khi khách hàng tìm kiếm tên sản phẩm trên thanh tìm kiếm, thông tin chi tiết về sản phẩm sẽ được hiển thị ngay lập tức, giúp họ dễ dàng lựa chọn và đặt hàng.

Khi bạn nhấn vào một danh mục sản phẩm cụ thể, danh sách các sản phẩm sẽ được hiển thị, bao gồm ảnh sản phẩm, mã sản phẩm, tên sản phẩm và giá bán.

Khi bạn nhấn vào một sản phẩm, hệ thống sẽ chuyển bạn đến một trang mới với thông tin chi tiết về sản phẩm, bao gồm mã sản phẩm, tên sản phẩm, hình ảnh, giá bán, mô tả chung và đánh giá Điều này giúp khách hàng hiểu rõ hơn về thông tin của sản phẩm mà họ đang muốn mua.

Khách hàng có thể đăng nhập vào hệ thống bằng cách nhấn vào tài khoản trên giao diện, sau đó nhập tên đăng nhập và mật khẩu Nếu chưa có tài khoản, khách hàng cần nhấn vào nút đăng ký để điền thông tin tên đăng ký, địa chỉ email, số điện thoại và mật khẩu Để thực hiện đặt hàng, khách hàng phải đăng nhập và thêm các sản phẩm mong muốn vào giỏ hàng Ngoài ra, khách hàng có thể xem lại giỏ hàng của mình bằng cách nhấn vào biểu tượng giỏ hàng trên giao diện, nơi hệ thống sẽ hiển thị danh sách các sản phẩm đã chọn.

- Có chức năng đăng ký, đăng nhập để người dùng có thể đăng nhập vào sử dụng hệ thống.

- Có chức năng tìm kiếm sản phẩm giúp người dùng dễ dàng tìm kiếm sản phẩm theo ý muốn.

- Có chức năng xem chương trình khuyến mãi để hỗ trợ cho việc quảng bá sản phẩm cũng như thu hút sự quan tâm từ khách hàng.

- Hỗ trợ trực tuyến: giải đáp thắc mắc cũng như giới thiệu sản phẩm phù hợp với khách hàng, tư vấn thông tin kịp thời.

- Có chức năng đặt hàng nếu khách hàng muốn mua hàng cùng với đó là chức năng thanh toán dễ dàng cho khách hàng.

2.2.3 Yêu cầu phi chức năng

- Website có màu sắc bắt mắt dễ thu hút khách hàng xem sản phẩm

- Hệ thống chạy ổn định, xử lý nhanh chóng và chính xác

- An toàn và bảo mật thông tin cao

- Tương thích với đa phần các trình duyệt web hiện tại

Phân tích hệ thống

2.3.1 Biểu đồ thực thể liên kết

Website AnhHoaBakery cung cấp dịch vụ bán hàng trực tuyến, cho phép khách hàng dễ dàng mua sắm các sản phẩm như bánh sinh nhật, bánh mì, bánh mặn, teabreak, cookies và mini cake Khách hàng cũng có thể theo dõi các chương trình khuyến mãi ngay tại nhà, mang lại trải nghiệm mua sắm tiện lợi và thú vị.

Khách hàng bao gồm thông tin như mã khách hàng, tên, số điện thoại, email, địa chỉ, tên đăng nhập và mật khẩu Mỗi khách hàng có thể lựa chọn mua từ 0 đến nhiều sản phẩm, trong khi mỗi sản phẩm có thể được chọn bởi nhiều khách hàng khác nhau.

- Sản phẩm: Mã sản phẩm, Tên sản phẩm, Màu sắc, Giá bán, Số lượng. Một sản phẩm có thể mua bởi 0, 1 hoặc nhiều chương trình khuyến mãi.

- Kích thước: Mã kích thước, SizeS, SizeM, Size XL Mỗi sản phẩm sẽ có

1 hoặc nhiều kích thước khác nhau.

Hóa đơn bao gồm các thông tin quan trọng như mã hóa đơn, mã giảm giá, ngày lập và tổng tiền Mỗi tài khoản khách hàng có thể có từ 0 đến nhiều hóa đơn, và mỗi hóa đơn có thể chứa từ 1 đến nhiều sản phẩm Ngược lại, mỗi sản phẩm cũng có thể liên kết với từ 0 đến nhiều hóa đơn khác nhau.

- Đơn hàng: Mã đơn hàng, Ngày lập Một khách hàng có thể có 0, 1 hoặc nhiều đơn hàng khác nhau Một đơn hàng chỉ thuộc về 1 khách hàng.

Hình 2: Biểu đồ thực thể liên kết

Dựa vào mô tả bài toán và phân tích thì ta xác định được các tác nhân và ca sử dụng như sau:

Các ca sử dụng chính của hệ thống

- Sửa thông tin cá nhân

- Xem danh mục sản phẩm

- Xem thông tin sản phẩm

Mô tả vắn tắt các use case có trong hệ thống

- UC đăng nhập: Use case này cho phép khách hàng đăng nhập để xác nhận quyền truy cập vào hệ thống.

- UC đăng ký: Use case này cho phép khách hàng đăng kí tài khoản mới trong hệ thống.

- UC sửa thông tin cá nhân: Cho phép khách hàng sửa thông tin cá nhân trong tài khoản thành viên.

- UC tìm kiếm sản phẩm: Cho phép khách hàng tìm kiếm theo tên sản phẩm.

- UC xem thông tin sản phẩm: Cho phép khách hàng xem thông tin chi tiết về sản phẩm

- UC xem danh mục sản phẩm: Cho phép khách hàng xem thông tin của từng danh mục sản phẩm trên hệ thống.

- UC xem danh mục khuyến mãi: cho phép khách hàng xem các chương trình khuyến mãi của cửa hàng.

- UC đặt hàng: cho phép khách hàng đặt mua các mặt hàng trong giỏ hàng

- UC Đăng nhập: Use case cho phép admin đăng nhập để xác nhận quyền truy cập vào hệ thống.

- UC bảo trì danh mục sản phẩm: Cho phép người quản trị xem, thêm, sửa, xóa các danh mục sản phẩm.

- UC bảo trì sản phẩm: Cho phép người quản trị xem, thêm, sửa, xóa các sản phẩm có trong cửa hàng.

- UC bảo trì danh mục khuyến mãi: cho phép người quản trị xem, thêm, sửa, xóa các chương trình khuyến mãi của cửa hàng.

- UC quản lý tài khoản: Cho phép người quản trị xem, thay đổi trạng thái tài khoản khách hàng.

- UC quản lý đơn hàng: Cho phép người quản trị duyệt, thống kê đơn hàng.

Hình 3: Biểu đồ UC tổng quát của hệ thống

2.3.4 Chi tiết các use case

⮚ Mô tả vắn tắt: Use case này cho phép khách hàng đăng nhập để xác nhận quyền truy cập vào hệ thống.

⮚ Luồng sự kiện: o Luồng cơ bản:

- Use case này bắt đầu khi khách hàng kích vào nút đăng nhập trên tài khoản Hệ thống hiển thị form đăng nhập.

Khách hàng cần nhập tên đăng nhập hoặc email cùng với mật khẩu để hệ thống xác thực thông tin từ bảng KHACH_HANG, từ đó cho phép người dùng đăng nhập vào hệ thống.

Khi khách hàng nhập sai email hoặc mật khẩu ở bước 2 trong luồng cơ bản, hệ thống sẽ hiển thị thông báo lỗi và đưa người dùng quay lại bước 2 để nhập lại thông tin chính xác.

Trong quá trình thực hiện Use case, nếu hệ thống không thể kết nối với cơ sở dữ liệu, một thông báo lỗi sẽ được hiển thị và Use case sẽ kết thúc.

⮚ Các yêu cầu đặc biệt: Không có

⮚ Tiền điều kiện: Không có

⮚ Hậu điều kiện: Nếu use case thành công thì người dùng đăng nhập vào hệ thống, còn nếu không thì trạng thái hệ thống không thay đổi.

⮚ Điểm mở rộng: Đăng ký, quên mật khẩu

HT CSDL (from Use Case View) ICSDL

Hình 4: Biểu đồ VOPC uc đăng nhập

Hình 5: Biểu đồ trình tự uc đăng nhập

⮚ Mô tả vắn tắt: Use case này cho phép khách hàng đăng kí tài khoản mới trong hệ thống.

⮚ Luồng sự kiện: o Luồng cơ bản:

- Use case này bắt đầu khi khách hàng kích vào nút đăng ký trên tài khoản Hệ thống hiển thị form đăng ký.

- Khách hàng nhập, tên tài khoản, mật khẩu, họ tên, email, mật khẩu Hệ thống lưu thông tin vào CSDL trong bảng

KHACH_HANG và hiện thông báo “Bạn đã đăng kí thành công” Use case kết thúc. o Luồng rẽ nhánh:

Trong bước 2 của quy trình cơ bản, nếu khách hàng nhập sai địa chỉ email hoặc tên tài khoản đã tồn tại, hệ thống sẽ hiển thị thông báo “Tên tài khoản đã tồn tại” hoặc “Địa chỉ email chưa đúng” và đưa khách hàng quay lại bước 2 để chỉnh sửa thông tin.

Trong quá trình thực hiện Use case, nếu hệ thống không thể kết nối với cơ sở dữ liệu, một thông báo lỗi sẽ được hiển thị và Use case sẽ kết thúc.

⮚ Các yêu cầu đặc biệt: Không có

⮚ Tiền điều kiện: Không có

⮚ Hậu điều kiện: Nếu use case thành công, hệ thống trở lại giao diện đăng nhập, còn nếu không thì trạng thái hệ thống không thay đổi.

⮚ Điểm mở rộng: Không có

HT CSDL (from Use Case View) ICSDL

(from Use Case View) DangKyUI

Hình 6: Biểu đồ VOPC uc đăng ký

: Khach Hang : DangKyUI : DangKyUI : DangKyController : DangKyController : KhachHang : KhachHang : ICSDL : ICSDL : HT CSDL : HT CSDL

8: set bang TaiKhoanKhachHang( ) 9: return kq

10: hien thi tb "dang ky thanh cong"( )

5: kiem tra TT dang ky()

Hình 7: Biểu đồ trình tự uc đăng ký

2.3.4.3 Use Case Sửa thông tin cá nhân

⮚ Mô tả vắn tắt: Use case này cho phép khách hàng sửa thông tin cá nhân trong tài khoản thành viên

⮚ Luồng sự kiện: o Luồng cơ bản:

Khi khách hàng nhấn vào “tài khoản” trên màn hình đăng nhập, hệ thống sẽ hiển thị thông tin từ bảng khách hàng, bao gồm mã khách hàng, tên, số điện thoại, địa chỉ và email.

Khách hàng nhấn vào nút “sửa thông tin” để hệ thống kiểm tra và hiển thị thông tin cá nhân, bao gồm tên, số điện thoại, địa chỉ và email Sau khi xem xét, khách hàng có thể tiếp tục chỉnh sửa thông tin của mình.

“Lưu” hệ thống kiểm tra thông tin khách hàng, cập nhật lại thông tin khách hàng từ bảng KHACH_HANG và hiển thị lên màn hình o Luồng rẽ nhánh:

Nếu trong bất kỳ bước nào của luồng cơ bản mà hệ thống không thể kết nối với cơ sở dữ liệu, một thông báo lỗi sẽ được hiển thị và use case sẽ kết thúc.

⮚ Các yêu cầu đặc biệt: Không có

⮚ Tiền điều kiện: Không có

⮚ Hậu điều kiện: Use case thành công, trạng thái thông tin cá nhân của khách hàng thay đổi

(from Use Case View) SuaThongTinCaNhanUI ICSDL

Hình 8: Biểu đồ VOPC uc sửa thông tin cá nhân

Hình 9: Biểu đồ trình tự uc sửa thông tin cá nhân

2.3.4.4 Use Case Tìm kiếm sản phẩm

⮚ Mô tả vắn tắt: Use case này cho phép khách hàng tìm kiếm sản phẩm theo tên

⮚ Luồng sự kiện: o Luồng cơ bản:

Khi khách hàng nhập tên sản phẩm và nhấn nút tìm kiếm trên trang chủ, hệ thống sẽ hiển thị danh sách các sản phẩm từ bảng SANPHAM, bao gồm hình ảnh, tên sản phẩm và mã sản phẩm.

Khi khách hàng nhấp vào hình ảnh sản phẩm, hệ thống sẽ hiển thị thông tin chi tiết từ bảng SANPHAM và KICHTHUOC, bao gồm hình ảnh, tên sản phẩm, mã sản phẩm, giá bán, kích thước, số lượng và mô tả Use case sẽ kết thúc tại đây.

- Tại bước 1 trong luồng cơ bản khi khách hàng nhập sai tên sản phẩm Hệ thống hiện thông báo lỗi Use case kết thúc.

Trong bước 2 của luồng cơ bản, nếu không có thông tin sản phẩm nào, hệ thống sẽ hiển thị thông báo lỗi Người dùng sẽ cần quay lại bước 1 để tiếp tục quy trình.

Trong suốt quá trình thực hiện Use case, nếu hệ thống không thể kết nối với cơ sở dữ liệu, một thông báo lỗi sẽ được hiển thị và Use case sẽ kết thúc ngay lập tức.

⮚ Các yêu cầu đặc biệt: Không có

⮚ Tiền điều kiện: Không có

⮚ Hậu điều kiện: Không có

⮚ Điểm mở rộng: UC đặt hàng

Hình 10: Biểu đồ VOPC uc tìm kiếm sản phẩm

: SanPham : SanPham : KichThuoc : KichThuoc : ICSDL : ICSDL : HT CSDL : HT CSDL

7: hien thi danh sach sp( )

14: hien thi tt chi tiet sp( )

Hình 11: Biểu đồ trình tự uc tìm kiếm sản phẩm

2.3.4.5 Use Case Xem danh mục sản phẩm

⮚ Mô tả vắn tắt: Use case này cho phép khách hàng xem thông tin của từng danh mục sản phẩm.

⮚ Luồng sự kiện: o Luồng cơ bản:

- Use case này bắt đầu khi khách hàng vào tên một danh mục Hệ thống sẽ hiển thị tên các danh mục con.

THỰC NGHIỆM CHƯƠNG TRÌNH

Giao diện màn hình chính

Hình 23: Giao diện màn hình chính

Khi truy cập vào trang web, người dùng sẽ thấy giao diện chính với hình ảnh của cửa hàng, cùng với thông tin hiển thị ở phía trên màn hình.

 Mục ‘All category’ chứa danh mục sản phẩm

 Ô tìm kiếm: tìm kiếm sản phẩm

 Mục login (đăng nhập), register (đăng ký) để người dùng thấy rõ ngay khi truy cập website.

Trong phần thân của trang web, người dùng có thể dễ dàng truy cập thông tin cơ bản về các sản phẩm hiện có trong hệ thống cửa hàng, cũng như các thông tin hữu ích khác được cung cấp trên trang.

- Phần cuối trang web: là các thông tin hỗ trợ, thanh toán và liên hệ trong website.

Giao diện đăng nhập

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

- Khi khách hàng muốn đặt mua hàng trên hệ thống thì mỗi khách hàng phải có một tài khoản để mua hàng.

- Khi người truy cập (mọi người) truy cập trang web và nhấn biểu tượng

‘Login’ Hệ thống sẽ hiển thị màn hình đăng nhập.

Giao diện phân quyền đăng nhập

Hình 25: Giao diện phân quyền đăng nhập

- Tại giao diện này hệ thống sẽ hỏi xem bạn đang đăng nhập vào hệ thống với phân quyền gì? Admin hoặc user.

- Khi người truy cập kích vào Admin/ user Hệ thống hiển thị giao diện đăng nhập của admin/user.

Hình 26: Giao diện đăng nhập theo quyền

Sau khi khách hàng hoàn tất việc đăng ký tài khoản, họ cần đăng nhập vào tài khoản đó để truy cập vào trang web.

Để truy cập vào trang web, khách hàng cần nhập tên đăng nhập và mật khẩu đã đăng ký Sau khi nhấn nút đăng nhập, hệ thống sẽ tự động kiểm tra thông tin trong cơ sở dữ liệu Nếu thông tin chính xác, khách hàng sẽ được phép truy cập vào trang web; ngược lại, nếu thông tin không đúng, hệ thống sẽ hiển thị thông báo “Thông tin đăng nhập không chính xác”.

Để bảo trì hệ thống hiệu quả, người quản trị cần có tài khoản đăng nhập để thực hiện các thao tác bảo trì website.

Giao diện thông báo lỗi đăng nhập

Hình 27: Giao diện lỗi đăng nhập

- Khi user không nhập thông tin gì và kích nút đăng nhập, hệ thống sẽ hiển thị thông báo lỗi lên màn hình để user biết.

Hình 28: Khi nhập sai thông tin

Hình 29: Màn hình đăng nhập thành công

Sau khi đăng nhập thành công, hệ thống sẽ hiển thị danh sách toàn bộ sản phẩm trên màn hình, giúp khách hàng dễ dàng lựa chọn những sản phẩm mong muốn để mua.

Để thực hiện việc mua sản phẩm, khách hàng chỉ cần nhấn vào nút “Mua hàng” Hệ thống sẽ tự động truy cập và thêm sản phẩm vào danh sách hóa đơn của khách hàng, bao gồm các thông tin như mã sản phẩm, tên sản phẩm, ảnh minh họa, giá tiền, số lượng, thành tiền và tổng tiền.

Giao diện đăng ký tài khoản

Nếu chưa có tài khoản nhấn register hoặc đăng ký ‘Tại đây’

Hình 30: Khi user chưa nhập thông tin và kích đăng ký

Hình 31: Giao diện đăng ký tài khoản thành công

Để truy cập vào trang web bán bánh, khách hàng cần đăng ký và tạo tài khoản cá nhân, giúp họ thực hiện tìm kiếm và mua sản phẩm trực tuyến một cách dễ dàng.

Để đăng ký tài khoản, khách hàng cần điền đầy đủ thông tin cá nhân như họ và tên, email, số điện thoại, địa chỉ, tên đăng nhập và mật khẩu.

Sau khi khách hàng điền đầy đủ thông tin, họ sẽ nhấn nút đăng ký Hệ thống tự động truy cập vào cơ sở dữ liệu để kiểm tra thông tin Nếu thông tin đăng ký chính xác, hệ thống sẽ hiển thị thông báo “Bạn đã đăng ký thành công” Ngược lại, nếu thông tin không chính xác hoặc bị thiếu, thông báo “Đăng ký không thành công” sẽ được hiển thị.

Giao diện bảo trì của admin

Hình 32: Giao diện bảo trì sản phẩm của Admin

- Trên giao diện bảo trì sản phẩm của admin bao gồm có thông tin chi tiết sản phẩm.

- Admin có quyền thêm sửa, xóa sản phẩm trong hệ thống cửa hàng.

Để thêm mới sản phẩm, người quản trị chỉ cần nhấn vào nút “Thêm mới sản phẩm”, hệ thống sẽ tự động truy cập và hiển thị biểu mẫu để thực hiện việc thêm sản phẩm mới.

Người quản trị cần nhập đầy đủ thông tin sản phẩm, bao gồm mã sản phẩm, tên sản phẩm, màu sắc, giá gốc và ảnh minh họa, trước khi nhấn nút để hoàn tất quá trình.

“Insert” hệ thống sẽ tự động cập nhật và thêm sản phẩm đó vào danh sách sản phẩm hiển thị lên màn hình.

3.7 Giao diện thêm sản phẩm

Hình 33: Giao diện thêm sản phẩm mới

- Khi admin kích vào nút thêm sản phẩm ở giao diện bảo trì

- Hệ thống hiển thị giao diện thêm sản phẩm

Khi quản trị viên nhập thông tin vào biểu mẫu và nhấn nút ‘Insert’, sản phẩm mới sẽ được thêm vào giao diện và cập nhật trong cơ sở dữ liệu.

Hình 34: Giao diện thêm sản phẩm thành công

Cập nhật trong cơ sở dữ liệu

Hình 35: Giao diện cập nhật trong cơ sở dữ liệu

Giao diện khi chọn xóa một sản phẩm

Hình 36: Giao diện kích chọn xóa sản phẩm

Để xóa sản phẩm khỏi danh sách, quản trị viên chỉ cần nhấn nút “Delete” Hệ thống sẽ hiển thị thông báo xác nhận “Bạn có chắc chắn muốn xóa?” Nếu quản trị viên chọn “Ok”, sản phẩm sẽ được cập nhật và xóa khỏi danh sách.

Hình 37: Giao diện sau khi xóa một sản phẩm

Cập nhật sản phẩm sau khi xóa trong cơ sở dữ liệu:

Hình 38: Giao diện cập nhật trong cơ sở dữ liệu

Giao diện sửa một sản phẩm

Hình 39: Giao diện kích chọn sửa sản phẩm

- Khi admin kích chọn ‘Edit’ trên dòng sản phẩm muốn thay đổi thông tin.

Hệ thống hiển thị giao diện ban đầu chứa thông tin gốc để admin có thể sửa đổi.

Hình 40: Giao diện sửa thông tin sản phẩm

Thay đổi hình ảnh ban đầu thành ‘doremon.png’ và chọn update

Hình 41: Giao diện sau khi sửa thành công

Cập nhật dữ liệu khi sửa đổi

Hình 42: Giao diện cập nhật trong cơ sở dữ liệu

Chức năng xem danh mục bánh

Hình 43: Giao diện chọn xem danh mục bánh

Khi khách hàng lựa chọn một danh mục bánh từ menu, hệ thống sẽ hiển thị các sản phẩm có trong danh mục đó cùng với thông tin chi tiết trên màn hình.

Chức năng xem thông tin cửa hàng

Hình 44: Giao diện giới thiệu cửa hàng

Khi khách hàng truy cập vào mục ‘Giới thiệu’ trên menu cửa hàng, hệ thống sẽ hiển thị thông tin chi tiết về cửa hàng, bao gồm phần giới thiệu, danh sách các loại sản phẩm đang bán và địa chỉ của các cơ sở.

Giao diện xem thông tin chi tiết sản phẩm

Hình 45: Thông tin chi tiết sản phẩm

Khi khách hàng muốn xem thông tin chi tiết về sản phẩm trên giao diện chính, họ chỉ cần nhấn vào 'hình ảnh sản phẩm' Hệ thống sẽ ngay lập tức hiển thị các thông tin quan trọng như tên sản phẩm, số lượng, màu sắc, hình ảnh và giá bán.

- Đồng thời trên giao diện còn hiển thị nút ‘Mua hàng’ để khách hàng có thể dễ dàng mua sản phẩm nhanh chóng

- Muốn quay về giao diện màn hình chính chọn ‘Quay về’ hoặc kích chọnBackHome trên đầu trang.

Giao diện mua hàng

Hình 46: Giao diện chọn mua sản phẩm

- Khi khách hàng kích vào nút ‘Mua ngay’ trên hệ thống Hệ thống sẽ dẫn đến giao diện giỏ hàng.

Trong giao diện giỏ hàng, khách hàng có khả năng điều chỉnh số lượng sản phẩm mong muốn Sau khi thay đổi, chỉ cần nhấn nút “Update”, hệ thống sẽ tự động cập nhật thông tin sản phẩm, bao gồm số lượng, thành tiền và tổng tiền.

Hình 47: Giao diện giỏ hàng sau khi chọn mua

Giao diện chọn xóa sản phẩm trong giỏ

Hình 48: Giao diện xóa sản phẩm trong giỏ

- Để xóa sản phẩm ở giỏ hàng mà khách hàng không muốn mua thì click nút

“Xóa” hệ thống sẽ tự cập nhật và xóa sản phẩm đó ra khỏi danh sách giỏ hàng.

Nếu khách hàng muốn xóa tất cả sản phẩm trong giỏ hàng, chỉ cần nhấn vào nút “Xóa tất cả”, hệ thống sẽ tự động xóa tất cả sản phẩm khỏi giỏ hàng.

Hình 49: Giao diện xóa tất cả sản phẩm trong giỏ

Giao diện đặt hàng

Hình 50: Giao diện đặt hàng thành công

Ngày đăng: 20/12/2023, 10:09

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w