(TIỂU LUẬN) LUẬN văn tốt NGHIỆP (CHUYÊN NGÀNH CÔNG NGHỆ THÔNG TIN) đề tài THIẾT kế WEBSITE bán HÀNG NB STORE

Xuất phát từ những nhu cầu thực tế trên nên chúng em quyết định chọn đề tài “xây dựng website thương mại điện tử” với ngôn ngữ ReactJS và Laravel, nhằm xâydựng một website bán hàng tr

THỰC TRẠNG

Thực trạng của thương mại điện tử tại Việt Nam

Theo báo cáo của Hiệp hội Thương mại điện tử Việt Nam, năm 2019, mức tăng trưởng của TMĐT ở Việt Nam trong 4 năm qua thực sự rất nổi bật Đây chính là mảnh đất tiềm năng cho các doanh nghiệp muốn khai thác thị trường này, cụ thể:

Về tốc độ tăng trưởng: Song song với sự phát triển vững chắc của nền kinh tế với tốc độ tăng trưởng GDP trên 7%, năm 2018 tiếp tục chứng kiến sự tăng trưởng mạnh

SVTH: Phùng Duy Long 11 GVHD: Hoàng Lan Phương mẽ của TMĐT Dựa trên thông tin khảo sát, Hiệp hội Thương mại điện tử Việt Nam ước tính tốc độ tăng trưởng của TMĐT năm 2018 so với năm 2017 đạt trên 30%.

Về quy mô: Năm 2018, TMĐT Việt Nam tiếp tục phát triển toàn diện với tốc độ tăng trưởng trên 30% Tuy chỉ có xuất phát điểm là xấp xỉ 4 tỷ USD vào năm 2015 nhưng nhờ tốc độ tăng trưởng trung bình trong 3 năm liên tiếp cao nên quy mô thị trường TMĐT năm 2018 đã lên tới khoảng 7,8 tỷ USD Nếu tốc độ tăng trưởng của năm 2019 và 2020 tiếp tục ở mức 30% thì tới năm 2020 quy mô thị trường sẽ lên tới 13 tỷ USD Quy mô này sẽ cao hơn mục tiêu nêu trong Kế hoạch tổng thể phát triển TMĐT giai đoạn 2016 - 2020, theo mục tiêu này, quy mô TMĐT bán lẻ (B2C) sẽ đạt

Theo Báo cáo E-Conomy SEA 2018 của Google và Temasek, quy mô thị trường TMĐT Việt Nam năm 2018 là 9 tỷ USD Báo cáo cũng dự báo tốc độ tăng trưởng trung bình năm của giai đoạn 2015 - 2018 là 25% và thị trường đạt 33 tỷ USD vào năm

2025 Nếu kịch bản này xảy ra, quy mô thị trường TMĐT Việt Nam năm 2025 sẽ đứng thứ ba ở Đông Nam Á, sau Indonesia (100 tỷ USD) và Thái Lan (43 tỷ USD).

Theo báo cáo của Hiệp hội Thương mại điện tử Việt Nam, năm 2019, tỷ lệ doanh nghiệp trong mô hình B2C xây dựng website những năm gần đây tuy không thay đổi nhiều, (năm 2018 có 44% cao hơn 1% so với năm 2017 và thấp hơn 1% so với năm

2016), nhưng đa số những doanh nghiệp này đã chú trọng nhiều hơn tới việc chăm sóc, cập nhật thông tin trên hệ thống website của mình Cụ thể, 47% DN cho biết thường xuyên cập nhật thông tin hàng ngày, 23% DN có cập nhật thông tin hàng tuần Điều này chứng tỏ, các DN đã chú trọng hơn nhiều đến việc chăm sóc hình ảnh, thương hiệu của mình, sẵn sàng cho việc tăng cường nhiều hơn các hình thức kinh doanh trực tuyến Năm 2018, trong số các DN được khảo sát, có đến 36% DN cho biết có bán

SVTH: Phùng Duy Long 12 GVHD: Hoàng Lan Phương hàng trên mạng xã hội, tăng 4% so với năm 2017; 12% DN có kinh doanh qua sàn TMĐT - tăng 1% so với năm 2017; 17% DN có kinh doanh trên nền tảng di động. Trong giao dịch TMĐT B2C, khảo sát về vấn đề nhận đơn đặt hàng và đặt hàng qua các công cụ trực tuyến có: 84% DN cho biết có nhận đơn đặt hàng và đặt hàng thông qua email; 49% nhận đơn đặt hàng qua mạng xã hội; 45% đối với việc đặt hàng qua website – bao gồm 36% đối với việc nhận đơn đặt hàng, 44% đối với việc đặt hàng; qua sàn TMĐT là 13% đối với việc nhận đơn đặt hàng, 19% đối với việc đặt hàng Như vậy, các DN của Việt Nam đã quan tâm hơn đến chiến lược kinh doanh online Tuy nhiên, việc thực hiện vẫn ở mức thấp chưa xứng tầm với quy mô và tiềm năng của TMĐT, nhiều DN vừa và nhỏ vẫn chưa sẵn sàng cho sự thay đổi này.

Thói quen mua hàng của người tiêu dùng Việt Nam cũng có những thay đổi tích cực Từ việc chỉ quen với giao dịch kinh doanh truyền thống, mặt đối mặt, được cầm, ngắm và có thể được thử sản phẩm, thì nay họ đã dần tiếp cận và yêu thích hình thức mua sắm trực tuyến.

Theo “Sách trắng Thương mại điện tử Việt Nam 2019”, có đến 70% người dùng Internet tham gia mua sắm trực tuyến ít nhất một lần trong năm, 61% người dùng sử dụng Internet cho mục đích tìm kiếm thông tin mua hàng, với tỉ lệ người dùng có thời lượng truy cập Internet từ 3-5 tiếng một ngày lên đến 30% Các mặt hàng được người tiêu dùng trực tuyến ưa chuộng là quần áo, giày dép, mỹ phẩm (61%), sau đó đến sách, văn phòng phẩm, quà tặng, thiết bị đồ gia dụng (46%), đồ công nghệ và điện tử (43%),

… Giá trị mua sắm trực tuyến của người tiêu dùng trên 5 triệu đồng chiếm tỉ lệ cao nhất - 35%, từ 3 triệu đồng đến 5 triệu đồng chiếm 22%, từ 1 triệu đồng đến 3 triệu đồng chiếm tỷ lệ 26% Các kết quả này cho thấy, ngày càng có nhiều người tiêu dùng sẵn sàng tham gia và yêu thích mua sắm trực tuyến Đây cũng là dấu hiệu đáng mừng cho sự phát triển TMĐT của Việt Nam.

SVTH: Phùng Duy Long 13 GVHD: Hoàng Lan Phương

Bên cạnh những thành tựu đáng kể đã đạt được của TMĐT Việt Nam, báo cáo của Hiệp hội Thương mại điện tử Việt Nam năm 2019 cũng chỉ ra vẫn còn nhiều cản trở cho sự bứt phá trong giai đoạn tới Đơn cử như dịch vụ logistics - giao hàng chặng cuối - hoàn tất đơn hàng còn nhiều hạn chế Dù có đến trên 70% người mua hàng trực tuyến sử dụng hình thức thanh toán dịch vụ thu hộ người bán (COD) nhưng tỷ lệ người mua hoàn trả sản phẩm đã đặt hàng trực tuyến còn cao Ước tính, tỷ lệ trung bình tổng giá trị của các sản phẩm hoàn trả so với tổng giá trị đơn hàng lên tới 13%, có DN phải chịu tỷ lệ này ở mức 26%. Điều này gây khó khăn rất lớn cho các phần lớn các DN hiện nay.

Thêm vào đó, lòng tin của người tiêu dùng vào giao dịch mua bán trực tuyến còn thấp Kết quả báo cáo cho thấy, tỷ lệ người mua hàng trực tuyến lựa chọn hình thức thanh toán tiền mặt khi nhận hàng COD còn rất cao - đến 88% [1] Đây cũng là một vấn đề rất lớn đang tồn tại với TMĐT Việt Nam Báo cáo cũng thống kê được, chỉ có 48% người được hỏi hài lòng với phương thức mua hàng trực tuyến, tức là vẫn còn một tỷ lệ lớn đối tượng khách hàng tiềm năng mà các nhà cung cấp dịch vụ TMĐT phải chinh phục Nguyên nhân lớn nhất ảnh hưởng đến tâm lý người dùng vẫn là chất lượng hàng hóa Điều này cũng được thể hiện rất rõ trong báo cáo điều tra lý do người tiêu dùng chưa chọn mua sắm trực tuyến, trong đó: 46% vì lý do khó kiểm định chất lượng hàng hóa, 33% vì lý do không tin tưởng đơn vị bán hàng Cùng với đó, báo cáo của Cục Thương mại điện tử và Kinh tế số - Bộ Công Thương cho biết, có đến 83% người được khảo sát quan ngại sản phẩm kém chất lượng so với quảng cáo Và còn nhiều lý do khác, như: giá cả không rẻ hơn khi mua ngoài cửa hàng trong khi đã được khuyến mãi; thông tin cá nhân bị rò rỉ; mua hàng ở cửa hàng dễ và nhanh gọn hơn; người tiêu

SVTH: Phùng Duy Long 14 GVHD: Hoàng Lan Phương dùng chưa có thẻ ngân hàng để thanh toán; cách thức mua hàng qua mạng vẫn phức tạp với nhiều người

Đánh giá thực trạng

Thói quen mua hàng của người tiêu dùng Việt Nam cũng có những thay đổi tích cực Từ việc chỉ quen với giao dịch kinh doanh truyền thống, mặt đối mặt, được cầm, ngắm và có thể được thử sản phẩm, thì nay họ đã dần tiếp cận và yêu thích hình thức mua sắm trực tuyến.

Thương mại điện tử của Việt Nam đang có có những bước tiến vượt bậc nhưng vẫn tồn tại không ít những thách thức, rào cản, dẫn đến TMĐT Việt Nam chưa được khai thác hết tiềm năng.

Ưu và nhược điểm của đề tài

- Không có giới hạn về địa lý, điều này là do mạng lưới toàn cầu nên bạn có thể mở rộng hoạt động kinh doanh của mình ở bất cứ đâu.

- Bạn có thể hiển thị và cung cấp nhiều loại sản phẩm hơn.

- Chi phí khởi động và bảo trì thấp hơn nhiều so với kinh doanh thương mại truyền thống.

- Tiết kiệm thời gian khi mua hàng cho khách hàng.

- Dễ dàng hơn trong việc phát triển các chiến lược tiếp thị theo lô, phiếu giảm giá và chiết khấu.

- Bạn có thể cung cấp thêm thông tin cho khách hàng.

- Có nhiều khả năng đưa ra sự so sánh tốt hơn giữa các sản phẩm với giá cả và đặc điểm của chúng.

- Bạn có thể là ông chủ của riêng bạn.

- Không có giới hạn thời gian, trừ khi bạn là một người nghiện công việc, điều đó cho phép bạn điều hòa gia đình tốt hơn và thích nghi công việc với lịch trình và nhịp sống của bạn.

- Bạn có thể số hóa một phần doanh nghiệp, nhưng bạn luôn có thể có 100% trực tuyến và điện tử, giúp giảm chi phí xuống mức thực sự phù hợp với mọi ngân sách.

- Sự cạnh tranh cao hơn nhiều vì bất kỳ ai cũng có thể khởi chạy loại hình này của doanh nghiệp.

- Có người tiêu dùng thích xem sản phẩm trước khi mua và nghi ngờ thanh toán trực tuyến.

- Không phải tất cả các sản phẩm đều có thể được bán trực tuyến dễ dàng như nhau.

- Chi phí vận chuyển có thể rất đắt khi khối lượng nhỏ.

- Trung thành với một khách hàng là khá khó khăn do sự cạnh tranh rộng rãi.

- Bảo mật trang web có thể cung cấp cho khách hàng tiềm năng rất nhiều câu hỏi.

- Người tiêu dùng muốn giá tốt nhất và dịch vụ tốt nhất và rất khó để có được cả hai luôn luôn.

- Nếu bạn có xu hướng trì hoãn, bạn sẽ rất dễ bị phân tâm vào những việc hoặc nhiệm vụ khác, đặc biệt là nếu bạn đang ở nhà Kỷ luật tốt là điều cần thiết.

- Có nguy cơ xảy ra các cuộc tấn công lừa đảo (đánh cắp khóa và mật khẩu) và các hành vi độc hại Nếu trang (hoặc máy chủ) của bạn bị lỗi, bạn sẽ không thể cung cấp những gì bạn đang bán, mất doanh số bán hàng đó.

- Sự thiếu kiên nhẫn của người tiêu dùng Trong một cửa hàng thực, bất kỳ nghi ngờ hoặc câu hỏi nào có thể được trả lời ngay lập tức, trái ngược với những gì

SVTH: Phùng Duy Long 16 GVHD: Hoàng Lan Phương thường xảy ra trực tuyến.Tương tự như vậy, thời gian để có được một sản phẩm không phải là ngay lập tức và khi một

- người đang vội vàng, thậm chí có thể quyết định không mua sản phẩm do thời gian sự chậm trễ

PHÁP

Đặc tả chức năng

3.1.1 Đối với người truy cập website

Người dùng truy cập vào website có thể xem thông tin hình ảnh của các sản phẩm, chi tiết sản phẩm, tìm kiếm sản phẩm, xem thông tin đơn hàng, thông tin người dùng, đánh giá sản phẩm Ngoài ra còn các thông tin liên quan như bài viết, tin tức, bình luận bài viết, gửi thông tin góp ý liên hệ.

Người dùng có thể đăng ký thành viên website để có thể bình luận sản phẩm, đặt mua hàng, gửi thông tin liên hệ đến quản trị website.

Nếu quên mật khẩu người dùng có thể sử dụng chức năng quên mật khẩu, hệ thống sẽ gửi mật khẩu mới qua email mà khách hàng đăng ký.

3.1.1.3 Đăng xuất khỏi hệ thống

- Là chức năng người dùng thoát khỏi phiên đăng nhập hiện tại

Người dùng nhập sản phẩm cần tìm trên thanh tìm kiếm hệ thống sẽ lọc những sản phẩm liên quan

Khi người dùng nhập sản phẩm cần tìm trên thanh tìm kiếm và ấn nút tìm kiếm.

Hệ thống sẽ chuyển hướng đến trang kết quả tìm kiếm Ở đây hệ thống sẽ lọc ra những sản phẩm liên quan và hơn thế nữa là bộ lọc giá từ cao thấp đến và ngược lại thuận tiện cho người dùng

3.1.1.5 Thêm sản phẩm vào giỏ hàng

Người dùng ấn nút mua hàng sản phẩm vừa chọn sẽ vào giỏ hàng cá nhân của người dùng Ở đây người dùng có thể tùy chỉnh số lượng, thêm, bớt hoặc xóa sản phẩm ra khỏi giỏ hàng.

SVTH: Phùng Duy Long 11 GVHD: Hoàng Phương Thảo

Khi người dùng tùy chỉnh số lượng sản phẩm hoàn tất Sau đó người dùng chọn hình thức thanh toán và hình thức giao hàng của website Hoàn tất hết tất cả thủ tục người dùng ấn mua hàng và thanh toán (nếu là thanh toán qua kênh online) Sau đó hệ thống sẽ gửi mail cho người dùng danh sách sản phẩm mà khách hàng đã mua.

Giỏ hàng bao gồm các sản phẩm mà khách hàng đã chọn mua Khách hàng có thể xóa sản phẩm đó khỏi giỏ hàng nếu không muốn chọn, bằng chức năng xóa hoặc có thể tăng giảm số lượng sản phẩm muốn mua trong giỏ hàng.

3.1.1.8 Quản lý thông tin cá nhân người dùng

Khách hàng có thể cập nhật lại thông tin tài khoản của mình, họ tên, địa chỉ, số điện thoại và mật khẩu khi cần thiết.

3.1.1.9 Xem danh sách đơn hàng

Cho phép người quản trị xem danh sách đơn hàng, chi tiết mà khách hàng đặt. Cho phép người quản trị xóa hoặc cập nhật tình trạng của đơn hàng của khách hàng.

3.1.1.10 Xem thông tin đơn hàng

Người dùng có thể xem thông tin đơn hàng của minh đã đặt gồm những thông tin: số lượng sản phẩm, giá tiền, ngày đặt, trạng thái đơn hàng.

3.1.1.11 Xem danh sách sản phẩm theo loại

Người dùng chọn loại sản phẩm ở menu danh danh mục sản phẩm hệ thống sẽ chuyển hướng đến trang danh sách sản phẩm theo loại và theo yêu cầu của người dùng.

Người dùng điền đầy đủ thông tin mà hệ thống yêu cầu Khi thỏa mản các điều kiện người dùng sẽ được chuyển hướng đến trang đăng nhập.

Người dùng đăng nhập bằng tài khoản được tạo trước đó hoặc có thể chọn đăng nhập bằng tài khoản Google Trường hợp đăng nhập bằng tài khoản của Google mà trùng với email đã tạo trước đó thì hệ thống sẽ tự động đăng nhập cho người dùng.

Không may người dùng quên mật khẩu của mình Không sao vì đã có chức năng quên mật khẩu để lấy lại mật khẩu cho người dùng Người dùng chỉ cần ấn quên mật khẩu hệ thống sẽ chuyển đến trang reset mật khẩu người dùng nhập email đã đăng ký trước đó Hệ thống gửi 1 mail reset mật khẩu người dùng chỉ cần đổi mật khẩu mới.

Sau khi đăng ký hệ thống sẽ gửi mail kích hoạt tài khoản và người dùng chỉ cần ấn vào link kích hoạt tài khoản có trong mail.

Người dùng bình luận 1 sản phẩm nào đó từ khi đã đăng nhập và người dùng chỉ được bình luận 1 lần cho 1 sản phẩm

Người dùng chọn từng linh kiện phù hợp sau đó có thể tài hình ảnh cấu hình vừa xây dựng

3.1.2 Đối với người quản trị

Người quản trị có thể thêm sản phẩm mới gồm những thông tin như: thông tin sản phẩm, ảnh sản phẩm, cấu hình Bên cạnh đó người quản trị có thể sửa và xóa sản phẩm.

3.1.1.2 Quản lý loại sản phẩm

Người quản trị thêm loại sản phẩm có thể thêm 1 danh mục loại sản phẩm Bên cạnh đó có thể thêm cấu hình cho loại đó.

Người quản trị có thể xem thông tin người dùng và có thể xem được tất cả đơn hàng mà khách hàng đó đã đặt.

Người quản trị có thể xem thông tin tất cả đơn hàng và xác nhận đơn hàng mà người dùng đã nhận hàng thành công

Người quản trị thêm, xóa, sửa slide xuất hiện trên web

Thống kê 1 tháng có bao nhiêu đơn hàng và tổng danh thu của 1 tháng đó Bến cạnh đó người quản trị có thể xem tổng danh thu của 1 năm sau đó có thể xuất excel.

Người quản trị có thể sửa các thông tin của tài khoản bao gồm: username, password, name, email, giới tính, ảnh.

3.1.2.8 Đăng nhập vào trang quản trị

Người quản trị nhập username và password của mình đã tạo trước đó.

3.1.2.9 Đăng xuất khỏi trang quản trị

Người quản trị đăng xuất khỏi trang quản trị Ngoài ra sau 60 phút người quản trị không thao tác hệ thống sẽ tự đăng xuất và yêu đăng nhập lại.

Use Case

3.2.1 Xác định tác nhân trong hệ thống

Hình 2.2.1 Tác nhân trrong hệ thống

Khách hàng vãng lai: Là khách hàng ghé thăm trang web xem các thông tin cơ bản như các bài viết, sản phẩm, đăng ký thành viên.

Khách hàng thành viên : Là người có tài khoản đăng nhập vào trang web có thể, tìm kiếm, xem sửa thông tin cá nhân, chọn mua sản phẩm, bình luận sản phẩm, xem giỏ hàng, xem các hóa đơn đã lập…

Admin : Là thành viên quản trị của hệ thống, có các quyền và chức năng, quản lý sản phẩm, quản lý đơn hàng, quản lý thành viên, quản lý thông tin ngân hàng thanh toán trực tuyến và các chức năng khác của hệ thống

3.2.2 Xác định Use Case khách hàng tổng quát

Hình 2.2.2 Use Case khách hàng tổng quát

3.2.3 Xác định Use Case Admin tổng quát

Hình 2.2.3 Use Case Admin tổng quát

Cơ sở dữ liệu

3.3.1.1 Bảng san_phams (bảng sản phẩm)

Trường Kiểu dữ liệu Ràng buộc Rỗng Ghi chú id int Khóa chính không Id của sản phẩm

TenSanPham string không Tên của sản phẩm

MoTa string có Mô tả sản phẩm

GiaCu decimal không Giá niêm yết

GiaKM decimal không Giá khuyến mại

AnhDaiDien string có Ảnh đại diện

CauHinh Text có Cấu hình sản phẩm

Loai_san_phams_id int Khóa ngoại không Sản phẩm thuộc loại

TrangThai tinyint không Trạng thái

3.3.1.2 Bảng loai_san_phams (Bảng loại sản phẩm)

Bảng 2.3.1.2 Bảng loại sản phẩm

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id của loai sản phẩm

TenLoai string không Tên của loại sản phẩm icon string có Icon của loại sản phẩm parent_id int Khóa ngoại có Sản phẩm thuộc loại

TrangThai tinyint không Trạng thái loại sản phẩm

3.3.1.3 Bảng anh_san_phams (Bảng ảnh sản phẩm)

Bảng 2.3.1 3 Bảng ảnh sản phẩm

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id của ảnh sản phẩm

AnhSanPham string không ảnh của sản phẩm san_phams_i d int Khóa ngoại không ảnh thuộc sản phẩm

TrangThai tinyint không Trạng thái ảnh sản phẩm

3.3.1.4 Bảng cau_hinhs (Bảng cấu hình)

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id của cấu hình

TenCauHinh string không Tên của cấu hình

KeyName string không Từ khóa của cấu hình

TrangThai tinyint không Trạng thái cấu hình

3.3.1.5 Bảng chi_tiet_cau_hinhs (Bảng chi tiết cấu hình)

Bảng 2.3.1.5 Bảng chi tiết cấu hình

Ràng buộc Rỗng Ghi chú loai_san_phams_id int Khóa chính không Id của loại sản phẩm cau_hinhs_id int Khóa chính không Id của cấu hình

3.3.1.6 Bảng don_hangs (Bảng đơn hàng)

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id của cấu hình hinh_thuc_giao_hang_id int Khóa ngoại không Hình thức giao hàng hinh_thuc_thanh_toans_id int Khóa ngoại không Hình thức thanh toán nguoi_dungs_id int Khóa ngoại không Người dùng mua hàng

ThoiGianMua date không Thời gian mua hàng

TongTien decimal không Tổng tiền đơn hàng trang_thai_giao_hangs_id int Khóa ngoại không Trạng thái đơn hàng

3.3.1.7 Bảng chi_tiet_don_hangs (Bảng chi tiết đơn hàng)

Bảng 2.3.1.7 Bảng chi tiết đơn hàng

Trường Kiểu dữ liệu Ràng buộc Rỗng Ghi chú don_hangs_id int Khóa chính không Id đơn hàng san_phams_id int Khóa ngoại không Id sản phẩm

SoLuong int không Số lượng sản phẩm

DonGia decimal không Đơn giá của sản phẩm

ThanhTien decimal không Tổng tiền của hóa đơn

3.3.1.8 Bảng comments (Bảng bình luận)

Trường Kiểu dữ liệu Ràng buộc

Rỗng Ghi chú id int Khóa chính không Id đơn hàng content string không Nội dung bình luận nguoi_dungs_id int Khóa ngoại không Người dùng bình luận san_phams_id int Khóa ngoại không Sản phẩm được bình luận parent_id int Khóa ngoại không Bình luận cha

3.3.1.9 Bảng hinh_thuc_giao_hangs (Bảng hình thức giao hàng)

Bảng 2.3.1.9 Bảng hình thức giao hàng

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id hình thức giao hàng

TenHinhThuc string không Tên hình thức giao hàng

3.3.1.10 Bảng hinh_thuc_thanh_toans (Bảng hình thức thanh toán)

Bảng 2.3.1.10 Bảng hình thức thanh toán

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id hình thức giao hàng

TenThanhToan string không Tên hình thức thanh toán

3.3.1.11 Bảng loai_nguoi_dungs (Bảng loại người dùng)

Bảng 2.3.1.11 Bảng loại người dùng

Ràng buộc Rỗng Ghi chú id int Khóa chính không Id loại người dùng

TenLoai string không Tên loại người dùng

3.3.1.12 Bảng nguoi_dungs (Bảng người dùng)

Trường Kiểu dữ Ràng buộc Rỗng Ghi chú

SVTH: Phùng Duy Long 21 GVHD: Hoàng Phương Thảo liệu id int Khóa chính không Id loại người dùng

Email string không Tên loại người dùng

TenNguoidung tinyint có Trạng thái

SDT string có Số điện thoại người dùng

DiaChi string có Địa chỉ giao hàng

Anh string có Ảnh đại diện

Gioitinh int không Giới tính username string có Tên đăng nhập password string có Mật khẩu loai_nguoi_dungs_id int Khóa ngoại không Id của loại người dùng

3.3.1.13 Bảng password_reset (Bảng khôi phục mật khẩu)

Bảng 2.3.1.13 Bảng khôi phục mật khẩu

Ràng buộc Rỗng Ghi chú

Email string Khóa chính không Id loại người dùng token string không Token khôi phục mật khẩu

3.3.1.14 Bảng table_image_slides (Bảng slide)

Ràng buộc Rỗng Ghi chú id string Khóa chính không Id slide image_name string không Tên ảnh

3.3.1.15 Bảng trang_thai_don_hangs (Bảng trạng thái đơn hàng)

Bảng 2.3.1.15 Bảng trạng thái đơn hàng

Ràng buộc Rỗng Ghi chú id string Khóa chính không Id trạng thái đơn hàng

TenTrangThai string không Tên trạng thái đơn hàng

3.3.1.16 Bảng user_activation (Bảng kích hoạt tài khoản)

Bảng 2.3.1 16 Bảng kích hoạt tài khoản

Ràng buộc Rỗng Ghi chú user_id int Khóa chính không Id trạng thái người dùng activation_code string không Mã kích hoạt

3.3.2 Mô hình cơ sở dữ liệu

Hình 2.3.1 Mô hình cơ sở dữ liệu

3.4 Cấu trúc thư mục đồ án

3.4.1 Cấu trúc thư mục ở Back-end và Front-end

Hình 3.1.1 Cấu trúc thư mục Backend Hình 3.1.2 Cấu trúc thư mục Front-end

3.5 Giao diện website khách hàng

3.5.1 Giao diện trang chủ website khách hàng

Hình 3.2.1 Giao diện trang chủ website khách hàng Ở giao diện trang chủ người dùng có thể xem những khuyến mại giảm giá, tìm kiếm sản phẩm, đăng ký thành viên, đăng nhập và 1 số tác vụ có trên website.

Người dùng chọn vào mục tạo tài khoản để tiến hành mua hàng

Một số ràng buộc khi đăng ký thành viên :

 Tên tài khoản: Không được trùng, từ 4 ký tự trở lên

 Mật khẩu: Độ dài mật khẩu lớn hơn 4 ký tự.

 Email: Phải đúng định dạng của email và không được trùng với tài khoản khác

 Tên người dùng: Tên người dùng không có ký tự số và ký tự đặt biệt

 Số điện thoại: Không có ký tự đặt biệt

 Địa chỉ: Khách hàng nhập đúng địa chỉ giao hàng và không có ký tự đặt biệt

 Giới tính: Chọn nam hoặc nữ

 Chọn ảnh: Chọn ảnh từ máy người dùng và chỉ chọn những file có định dạng ảnh

Hình 3.2.2 Giao diện đăng ký

[1]: Vùng nhập thông tin người dùng

[4]: Quay về trang đăng nhập

Người dùng đăng nhập tài khoản vừa tạo hoặc có thể đăng nhập bằng tài khoản google

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

[1]: Vùng nhập tài khoản và mật khẩu

[2]: Nút đăng nhập bằng tài khoản Google

[4]: Nút quay lại trang đăng ký hoặc quên mật khẩu

3.5.4 Giao diện quên mật khẩu

Khi khách hàng quên mật khẩu thì chức năng quên mật khẩu sẽ giúp khách hàng lấy lại mật khẩu bằng cách gửi mail xác nhận, nếu email tồn tại trong hệ thống thì hệ thống sẽ thông báo và gửi một đường dẫn qua email để xác nhận việc quên mật khẩu mật khẩu sẽ được cập nhật lại và gửi email đến khách hàng

Hình 3.2.4 Giao diện quên mật khẩu

[1]: Nhập email để khôi phục mật khẩu

[2]: Nút gửi mã khôi phục

3.5.5 Giao diện mail khôi phục mật khẩu

Sau khi khách hàng ấn vào nút “Tới trang reset password” sẽ được chuyển tới page reset password kèm 1 mã token.

Hình 3.2.5 Giao diện mail khôi phục mật khẩu

3.5.6 Giao diện khôi phục mật khẩu

Sau khi ấn vào link khôi phục mật khẩu hệ thống sẽ chuyển hướng đến trang khôi phục mật khẩu Ở đây người dùng nhập mật khẩu mới.

Hình 3.2.6 Giao diện khôi phục mật khẩu

[1]: Vùng nhập mật khẩu và nhập lại mật khẩu mới

[2]: Nút xác nhận khôi phục mật khẩu

3.5.7 Giao diện tìm kiếm sản phẩm tự động

Người dùng nhập từ khóa cần tìm ở ô tìm kiếm sản phẩm hệ thống sẽ tự động hiện các sản phẩm liên quan ngay lập tức bên dưới.

Hình 3.2.7 Giao diện tìm kiếm sản phẩm tự động

[2]: Các sản phẩm tương ứng với từ khóa

3.5.8 Giao diện trang kết quả tìm kiếm

Sau khi người dùng nhập từ khóa và ấn nút tìm kiếm Sau đó hệ thống sẽ chuyển hướng đến trang kết quả tìm kiếm Bên cạnh đó hệ thống sẽ liệt kê tất cả sản phẩm phù hợp với từ khóa.

Hình 3.2.8 Giao diện kết quả tìm kiếm sản phẩm

[2]: Sản phẩm tương ứng với kết quả tìm kiếm

3.5.9 Giao diện chi tiết sản phẩm

Hình 3.2.9 Giao diện chi tiết sản phẩm

Giao diện chi tiết sản phẩm mà người dùng chọn trước đó

[1]: Hình ảnh của sản phẩm

[2]: Thông tin và quà tặng sản phẩm khi mua kèm

Sau khi chọn mua sản phẩm, hệ thống sẽ chuyển sản phẩm của người dùng vào giỏ hàng và lưu trữ ở localstorage sau mỗi lần mở web lên không bị mất Người dùng có thể tùy ý thêm, xóa, sửa và tăng giảm số lượng theo ý thích và sau đó ấn mua hàng để hoàn tất.

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

[2]: Thông tin người dùng mua hàng

3.5.11 Giao diện thanh toán Momo

Sau khi chọn mua hàng bằng phương thức thanh toán momo hệ thống sẽ chuyển sang trang thanh toán trực tuyến của momo để thanh toán.

Hình 3.2.11 Giao diện thanh toán momo

[2]: Mã QR quét để thanh toán đơn hàng

[3]: Nút hủy thanh toán và quay lại trang thông tin đơn hàng của website

3.5.12 Giao diện thanh toán Paypal

Sau khi người dùng chọn phương thức thanh toán Paypal hệ thống sẽ chuyển hướng đến trang thanh toán của Paypal.

Hình 3.2.12 Giao diện thanh toán Paypal

3.5.13 Giao diện thanh toán Vnpay

Sau khi người dùng chọn phương thức thanh toán Vnpay hệ thống sẽ chuyển hướng đến trang thanh toán của Vnpay

Hình 3.2.13 Giao diện thanh toán Vnpay

[1]: Mã QR thanh toán đơn hàng

[2]: Thông tin chủ tài khoản

[3]: Hủy thanh toán và trở về trang thông tin đơn hàng website

3.5.14 Giao diện chi tiết đơn hàng

Sau khi thanh toán đơn hàng người dùng sẽ được chuyển hướng đến trang chi tiết đơn hàng Ở đây người dùng có thể xem lại thông tin đơn hàng của mình đã đặt.

Hình 3.2.14 Giao diện chi tiết đơn hàng hủy

Hình 3.2.14 1 Giao diện chi tiết đơn hàng thành công Chú thích:

[1]: Đơn hàng đã bị hủy do người dùng

[2]: Tổng tiền và thời gian mua hàng

[4]: Đơn hàng thanh toán thành công

[5]: Chuyển đến trang xem chi tiết đơn hàng

3.5.15 Giao diện xây dựng cấu hình

Người dùng chọn từng linh kiện phù hợp với nhu cầu Sau đó người dùng có thể tải file cấu hình để được nhân viên tư vấn hoặc sang cửa hàng nào đó để mua với giá cả hợp lý nhất.

Hình 3.2.15 Giao diện xây dựng cấu hình

Hình 3.2.15.1 Giao diện chọn linh kiện

Hình 3.2.15.2 Giao diện chọn xong linh kiện cho cấu hình

[1]: Xây dựng lại cấu hình

[2]: Chi phí của cấu hình

[3]: Các linh kiện của cấu hình

[4]: Tải file pdf cấu hình

[5]: Tải file ảnh cấu hình

[8]: Tên sản phẩm được chọn

[10]: Nút xóa sản phẩm ra khỏi cấu hình

3.5.16 Giao diện tất cả đơn hàng chưa thanh toán

Khi người dùng chọn xem tất cả đơn hàng chưa thành toán, hệ thống sẽ liệt kê tất cả đơn hàng chưa thanh toán theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.16 Giao diện tất cả đơn hàng chưa thanh toán

3.5.17 Giao diện tất cả đơn hành đã thanh toán

Khi người dùng chọn xem tất cả đơn hàng đã thành toán, hệ thống sẽ liệt kê tất cả đơn hàng đã thanh toán theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.17 Giao diện tất cả đơn hàng đã thanh toán

3.5.18 Giao diện tất cả đơn hàng đã hoàn thành

Khi người dùng chọn xem tất cả đơn hàng đã hoàn thành, hệ thống sẽ liệt kê tất cả đơn hàng đã hoàn thành theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.18 Giao diện tất cả đơn hàng đã hoàn thành

3.5.19 Giao diện tất cả đơn hàng đã hủy

Khi người dùng chọn xem tất cả đơn hàng đã hủy, hệ thống sẽ liệt kê tất cả đơn hàng đã hủy theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.19 Giao diện tất cả đơn hàng đã hủy

3.5.20 Giao diện thông tin tài khoản

Hình 3.2.20 Giao diện thông tin tài khoản Ở giao diện thông tin tài khoản người dùng có thể xem thông tin tài khoản của mình và chỉnh sửa thông tin ( Email không thể thay đổi).

[1]: Thông tin tài khoản người dùng

[2]: Nút thay đổi thông tin

3.5.21 Giao diện thay đổi mật khẩu

Người dùng có thể thay đổi mật khẩu của mình (đã đăng nhập vào hệ thống)

Hình 3.2.21 Giao diện thay đổi mật khẩu

[1]: Khung nhập mật khẩu cũ, mật khẩu mới và nhập lại mật khẩu mới

[2]: Nút thay đổi mật khẩu

3.5.22 Giao diện hướng dẫn thanh toán

Trang hướng dẫn thanh toán giúp người dùng dễ dàng thanh toán hơn, hướng dẫn một cách dễ hiểu nhất

Hình 3.2.22 Giao diện hướng dẫn thanh toán

3.6 Giao diện trang quản trị

3.6.1 Giao diện trang chủ Ở giao diện trang chủ admin, người quản trị có thể xem được top sản phẩm được bán nhiều nhất, danh thu trong tháng, danh thu trong 1 năm, xuất thống kê và các đơn hàng được mua gần nhất.

Hình 3.3.1 Giao diện trang chủ (Top 5 sản phẩm được bán nhiều nhất)

Giao diện hiển thị trang chủ quản trị thống kê danh thu theo tháng

Hình 3.3.1.1 Giao diện trang chủ quản trị (thống kê theo tháng)

Hình 3.3.1.2 Giao diện quản trị (thống kê theo năm) Chú thích:

[1]: Top những sản phẩm được mua nhiều nhất

[3]: Biểu đồ danh thu theo tháng

[4]: Biểu đồ danh thu theo năm và những đơn hàng mới nhất.

Sau khi xuất excel thống kê theo tháng, hệ thống sẽ liệt kê tổng danh thu và tổng đơn hàng trong tháng đó.

Hình 3.3.1 3 Giao diện excel thống kê theo tháng

Sau khi xuất excel thống kê theo năm, hệ thống sẽ liệt kê tổng danh thu và tổng đơn hàng trong năm đó.

Giao diện trang quản lý sản phẩm Ở giao diện quản lý sản phẩm, hệ thống

Hình 3.3.1.4 Giao diện excel thống kê theo năm liệt kê tất cả sản phẩm theo từng trang ( mỗi trang gồm có 10 sản phẩm) Các chức năng cơ bản như: Thêm sản phẩm mới, tìm kiếm sản phẩm, sửa sản phẩm và cuối cùng là xóa sản phẩm.

[1]: Chuyển đến trang thêm sản phẩm mới

[3]: Tác vụ lọc sản phẩm

[4]: Chức năng xóa và chỉnh sửa sản phẩm

Giao diện website khách hàng

3.5.1 Giao diện trang chủ website khách hàng

Hình 3.2.1 Giao diện trang chủ website khách hàng Ở giao diện trang chủ người dùng có thể xem những khuyến mại giảm giá, tìm kiếm sản phẩm, đăng ký thành viên, đăng nhập và 1 số tác vụ có trên website.

Người dùng chọn vào mục tạo tài khoản để tiến hành mua hàng

Một số ràng buộc khi đăng ký thành viên :

 Tên tài khoản: Không được trùng, từ 4 ký tự trở lên

 Mật khẩu: Độ dài mật khẩu lớn hơn 4 ký tự.

 Email: Phải đúng định dạng của email và không được trùng với tài khoản khác

 Tên người dùng: Tên người dùng không có ký tự số và ký tự đặt biệt

 Số điện thoại: Không có ký tự đặt biệt

 Địa chỉ: Khách hàng nhập đúng địa chỉ giao hàng và không có ký tự đặt biệt

 Giới tính: Chọn nam hoặc nữ

 Chọn ảnh: Chọn ảnh từ máy người dùng và chỉ chọn những file có định dạng ảnh

Hình 3.2.2 Giao diện đăng ký

[4]: Quay về trang đăng nhập

Người dùng đăng nhập tài khoản vừa tạo hoặc có thể đăng nhập bằng tài khoản google

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

[1]: Vùng nhập tài khoản và mật khẩu

[2]: Nút đăng nhập bằng tài khoản Google

[4]: Nút quay lại trang đăng ký hoặc quên mật khẩu

3.5.4 Giao diện quên mật khẩu

Khi khách hàng quên mật khẩu thì chức năng quên mật khẩu sẽ giúp khách hàng lấy lại mật khẩu bằng cách gửi mail xác nhận, nếu email tồn tại trong hệ thống thì hệ thống sẽ thông báo và gửi một đường dẫn qua email để xác nhận việc quên mật khẩu mật khẩu sẽ được cập nhật lại và gửi email đến khách hàng

Hình 3.2.4 Giao diện quên mật khẩu

[1]: Nhập email để khôi phục mật khẩu

[2]: Nút gửi mã khôi phục

3.5.5 Giao diện mail khôi phục mật khẩu

Sau khi khách hàng ấn vào nút “Tới trang reset password” sẽ được chuyển tới page reset password kèm 1 mã token.

Hình 3.2.5 Giao diện mail khôi phục mật khẩu

3.5.6 Giao diện khôi phục mật khẩu

Sau khi ấn vào link khôi phục mật khẩu hệ thống sẽ chuyển hướng đến trang khôi phục mật khẩu Ở đây người dùng nhập mật khẩu mới.

Hình 3.2.6 Giao diện khôi phục mật khẩu

[1]: Vùng nhập mật khẩu và nhập lại mật khẩu mới

[2]: Nút xác nhận khôi phục mật khẩu

3.5.7 Giao diện tìm kiếm sản phẩm tự động

Người dùng nhập từ khóa cần tìm ở ô tìm kiếm sản phẩm hệ thống sẽ tự động hiện các sản phẩm liên quan ngay lập tức bên dưới.

Hình 3.2.7 Giao diện tìm kiếm sản phẩm tự động

[2]: Các sản phẩm tương ứng với từ khóa

3.5.8 Giao diện trang kết quả tìm kiếm

Sau khi người dùng nhập từ khóa và ấn nút tìm kiếm Sau đó hệ thống sẽ chuyển hướng đến trang kết quả tìm kiếm Bên cạnh đó hệ thống sẽ liệt kê tất cả sản phẩm phù hợp với từ khóa.

Hình 3.2.8 Giao diện kết quả tìm kiếm sản phẩm

[2]: Sản phẩm tương ứng với kết quả tìm kiếm

3.5.9 Giao diện chi tiết sản phẩm

Hình 3.2.9 Giao diện chi tiết sản phẩm

Giao diện chi tiết sản phẩm mà người dùng chọn trước đó

[1]: Hình ảnh của sản phẩm

[2]: Thông tin và quà tặng sản phẩm khi mua kèm

Sau khi chọn mua sản phẩm, hệ thống sẽ chuyển sản phẩm của người dùng vào giỏ hàng và lưu trữ ở localstorage sau mỗi lần mở web lên không bị mất Người dùng có thể tùy ý thêm, xóa, sửa và tăng giảm số lượng theo ý thích và sau đó ấn mua hàng để hoàn tất.

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

[2]: Thông tin người dùng mua hàng

3.5.11 Giao diện thanh toán Momo

Sau khi chọn mua hàng bằng phương thức thanh toán momo hệ thống sẽ chuyển sang trang thanh toán trực tuyến của momo để thanh toán.

Hình 3.2.11 Giao diện thanh toán momo

[2]: Mã QR quét để thanh toán đơn hàng

[3]: Nút hủy thanh toán và quay lại trang thông tin đơn hàng của website

3.5.12 Giao diện thanh toán Paypal

Sau khi người dùng chọn phương thức thanh toán Paypal hệ thống sẽ chuyển hướng đến trang thanh toán của Paypal.

Hình 3.2.12 Giao diện thanh toán Paypal

3.5.13 Giao diện thanh toán Vnpay

Sau khi người dùng chọn phương thức thanh toán Vnpay hệ thống sẽ chuyển hướng đến trang thanh toán của Vnpay

Hình 3.2.13 Giao diện thanh toán Vnpay

[1]: Mã QR thanh toán đơn hàng

[2]: Thông tin chủ tài khoản

[3]: Hủy thanh toán và trở về trang thông tin đơn hàng website

Sau khi thanh toán đơn hàng người dùng sẽ được chuyển hướng đến trang chi tiết đơn hàng Ở đây người dùng có thể xem lại thông tin đơn hàng của mình đã đặt.

Hình 3.2.14 Giao diện chi tiết đơn hàng hủy

Hình 3.2.14 1 Giao diện chi tiết đơn hàng thành công Chú thích:

[1]: Đơn hàng đã bị hủy do người dùng

[2]: Tổng tiền và thời gian mua hàng

[4]: Đơn hàng thanh toán thành công

[5]: Chuyển đến trang xem chi tiết đơn hàng

3.5.15 Giao diện xây dựng cấu hình

Người dùng chọn từng linh kiện phù hợp với nhu cầu Sau đó người dùng có thể tải file cấu hình để được nhân viên tư vấn hoặc sang cửa hàng nào đó để mua với giá cả hợp lý nhất.

Hình 3.2.15 Giao diện xây dựng cấu hình

Hình 3.2.15.1 Giao diện chọn linh kiện

Hình 3.2.15.2 Giao diện chọn xong linh kiện cho cấu hình

[1]: Xây dựng lại cấu hình

[2]: Chi phí của cấu hình

[3]: Các linh kiện của cấu hình

[4]: Tải file pdf cấu hình

[5]: Tải file ảnh cấu hình

[8]: Tên sản phẩm được chọn

[10]: Nút xóa sản phẩm ra khỏi cấu hình

3.5.16 Giao diện tất cả đơn hàng chưa thanh toán

Khi người dùng chọn xem tất cả đơn hàng chưa thành toán, hệ thống sẽ liệt kê tất cả đơn hàng chưa thanh toán theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.16 Giao diện tất cả đơn hàng chưa thanh toán

3.5.17 Giao diện tất cả đơn hành đã thanh toán

Khi người dùng chọn xem tất cả đơn hàng đã thành toán, hệ thống sẽ liệt kê tất cả đơn hàng đã thanh toán theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.17 Giao diện tất cả đơn hàng đã thanh toán

3.5.18 Giao diện tất cả đơn hàng đã hoàn thành

Khi người dùng chọn xem tất cả đơn hàng đã hoàn thành, hệ thống sẽ liệt kê tất cả đơn hàng đã hoàn thành theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.18 Giao diện tất cả đơn hàng đã hoàn thành

3.5.19 Giao diện tất cả đơn hàng đã hủy

Khi người dùng chọn xem tất cả đơn hàng đã hủy, hệ thống sẽ liệt kê tất cả đơn hàng đã hủy theo người dùng gồm khác thông tin như sau: Mã đơn hàng, ngày đặt hàng, hình thức vận chuyển, thanh toán, tổng tiền đơn hàng, trạng thái của đơn hàng.

Hình 3.2.19 Giao diện tất cả đơn hàng đã hủy

3.5.20 Giao diện thông tin tài khoản

Hình 3.2.20 Giao diện thông tin tài khoản Ở giao diện thông tin tài khoản người dùng có thể xem thông tin tài khoản của mình và chỉnh sửa thông tin ( Email không thể thay đổi).

[1]: Thông tin tài khoản người dùng

[2]: Nút thay đổi thông tin

3.5.21 Giao diện thay đổi mật khẩu

Người dùng có thể thay đổi mật khẩu của mình (đã đăng nhập vào hệ thống)

Hình 3.2.21 Giao diện thay đổi mật khẩu

[1]: Khung nhập mật khẩu cũ, mật khẩu mới và nhập lại mật khẩu mới

[2]: Nút thay đổi mật khẩu

3.5.22 Giao diện hướng dẫn thanh toán

Trang hướng dẫn thanh toán giúp người dùng dễ dàng thanh toán hơn, hướng dẫn một cách dễ hiểu nhất

Hình 3.2.22 Giao diện hướng dẫn thanh toán

Giao diện trang quản trị

3.6.1 Giao diện trang chủ Ở giao diện trang chủ admin, người quản trị có thể xem được top sản phẩm được bán nhiều nhất, danh thu trong tháng, danh thu trong 1 năm, xuất thống kê và các đơn hàng được mua gần nhất.

Hình 3.3.1 Giao diện trang chủ (Top 5 sản phẩm được bán nhiều nhất)

Giao diện hiển thị trang chủ quản trị thống kê danh thu theo tháng

Hình 3.3.1.1 Giao diện trang chủ quản trị (thống kê theo tháng)

Hình 3.3.1.2 Giao diện quản trị (thống kê theo năm) Chú thích:

[1]: Top những sản phẩm được mua nhiều nhất

[3]: Biểu đồ danh thu theo tháng

[4]: Biểu đồ danh thu theo năm và những đơn hàng mới nhất.

Sau khi xuất excel thống kê theo tháng, hệ thống sẽ liệt kê tổng danh thu và tổng đơn hàng trong tháng đó.

Hình 3.3.1 3 Giao diện excel thống kê theo tháng

Sau khi xuất excel thống kê theo năm, hệ thống sẽ liệt kê tổng danh thu và tổng đơn hàng trong năm đó.

Giao diện trang quản lý sản phẩm Ở giao diện quản lý sản phẩm, hệ thống

Hình 3.3.1.4 Giao diện excel thống kê theo năm liệt kê tất cả sản phẩm theo từng trang ( mỗi trang gồm có 10 sản phẩm) Các chức năng cơ bản như: Thêm sản phẩm mới, tìm kiếm sản phẩm, sửa sản phẩm và cuối cùng là xóa sản phẩm.

[1]: Chuyển đến trang thêm sản phẩm mới

[3]: Tác vụ lọc sản phẩm

[4]: Chức năng xóa và chỉnh sửa sản phẩm

3.6.3 Giao diện trang thêm sản phẩm Ở giao diện thêm sản phẩm mới gồm có 3 tab: sản phẩm, cấu hình sản phẩm và ảnh sản phẩm Ở tab đầu tiên người dùng nhập thông tin của sản phẩm mới như: tên sản phẩm,

Hình 3.3.2 Giao diện quản lý sản phẩm mô tả sản phẩm, hãng sản xuất, giá cũ, giá khuyến mại, số lượng, ảnh đại diện và chọn loại sản phẩm

 Một số ràng buộc của các trường như sau:

 Tên sản phẩm: Yêu cầu nhập tên sản phẩm đầy đủ và không được bỏ trống

 Mô tả: Có thể tự nhập văn bản mô tả sản phẩm hoặc có thể sao chép một bài viết mô tả sản phẩm bất kỳ và không được bỏ trống

 Hãng sản xuất: Hãng sản xuất của sản phẩm và yêu cầu không được bỏ trống

 Giá cũ: Giá cũ sản phẩm

 Giá khuyến mại: Giá khuyến mại sản phẩm

 Số lượng: Số lượng sản phẩm

 Ảnh đại diện: Chọn ảnh đại diện của sản phẩm

 Loại sản phẩm: Chọn 1 loại cho sản phẩm

Hình 3.3 3 Giao diện thêm sản phẩm

[1]: Vùng nhập thông tin sản phẩm

[3]: Tiến hành thêm sản phẩm mới

3.6.4 Giao diện thêm cấu hình sản phẩm Ở tab cấu hình sản phẩm, người quản trị thêm cấu hình cho mỗi linh kiện phù hợp cho sản phẩm cần thêm

Hình 3.3.4 Giao diện thêm cấu hình sản phẩm

[1]: Vùng nhập cấu hình cho sản phẩm

3.6.5 Giao diện trang thêm ảnh cho sản phẩm Ở tab thêm ảnh cho sản phẩm người quản trị có thể thêm một hoặc nhiều ảnh cho sản phẩm.

3.5.6 Giao diện trang sửa sản phẩm

Sau khi chọn sản phẩm cần cập nhật hệ thống sẽ chuyển hướng đến trang chỉnh sửa sản phẩm người quản trị có thể sửa những thông tin chưa phù trước đó.

Hình 3.3.5 Giao diện trang thêm ảnh sản phẩm

Hình 3.3.6 Giao diện cập nhật sản phẩm

Hình 3.3.6.1 Giao diện cập nhật sản phẩm (2)

[1]: Mô tả sản phẩm, có thể tự tạo hoặc coppy 1 bài viết nào đó

[2]: Vùng sửa thông tin sản phẩm

[3]: Tiến hành sửa sản phẩm

3.6.7 Giao diện trang quản lý loại sản phẩm

Hình 3.3.7 Giao diện quản lý loại sản phẩm

[1]: Thêm mới loại sản phẩm

[2]: Khung tìm kiếm sản phẩm

[3]: Thông tin loại sản phẩm

[4]: Tác vụ xóa, sửa sản phẩm

[5]:Thùng rác loại sản phẩm

3.6.8 Giao diện trang thêm loại sản phẩm

Sau khi chọn thêm loại sản phẩm mới hệ thống chuyển đến trang thêm loại sản phẩm Những thông tin yêu cầu như: tên loại, icon của danh mục, loại sản phẩm thuộc loại (cho biết loại sản phẩm là loại cha hay thuộc loại nào khác).

Hình 3.3.8 Giao diện trang thêm loại sản phẩm

[1]: Vùng nhập thông tin loại sản phẩm

[2]: Chọn loại sản phẩm thuộc loại nào

[3]: Nút thêm loại sản phẩm

3.6.9 Giao diện sửa loại sản phẩm

Sau khi chọn sản phẩm cần sửa hệ thống chuyển hướng đến trang sửa loại sản phẩm

Hình 3.3 9 Gioa diện sửa loại sản phẩm

Hình 3.3.9 1 Giao diện popup thêm cấu hình mới

[1]: Nút thêm cấu hình mới

[2]: Nút thêm từng cấu hình (CPU, RAM, …)

[4]: Nút cập nhật loại sản phẩm

[5]: Nút thêm cấu hình vào loại sản phẩm

[6]: Loại bỏ cấu hình ra loại sản phẩm

3.6.10 Giao diện quản lý đơn hàng

Quản lý tất cả đơn hàng của khách hàng có thể đổi trạng thái của đơn hàng khi khách hàng nhận hàng thành công

Hình 3.3.10 Giao diện quản lý đơn hàng

[2]: Khung tìm kiếm đơn hàng

[4]: Xem chi tiết đơn hàng

Sau khi chọn đơn hàng cần xem hệ thống chuyển đến chi tiết đơn hàng.

Hình 3.3.11 Giao diện chi tiết đơn hàng

[1]: Thông tin của đơn hàng

[2]: Nút hoàn thành đơn hàng (Khi khách hàng nhận hàng thành công)

[3]: Số lượng sản phẩm của đơn hàng

3.6.12 Giao diện quản lý người dùng

Quản lý người dùng người quản trị có thể thêm người dùng mới, xem chi tiết tài khoản người dùng, khóa tài khoản người dùng

Hình 3.3.12 Giao diện quản lý người dùng

[1]: Nút thêm tài khoản mới

[2]: Khung tìm kiếm người dùng

[3]: Xem thông tin tài khoản

3.6.13 Giao diện thêm người dùng

Hình 3.3.13 Giao diện thêm người dùng (1)

Hình 3.3.13.1 Giao diện thêm người dùng (2)

[2]: Chọn loại người dùng (admin hoặc người dùng)

[3]: Tiến hành thêm và quay lại trang quản lý người dùng

3.6.14 Giao diện cập nhật người dùng

Hình 3.3.14 Giao diện cập nhật người dùng (1)

Hình 3.3.14.1 Giao diện cập nhật người dùng (2)

Sau khi người quản trị chọn một tài khoản cần cập nhật, hệ thống sẽ chuyển hướng đến trang cập nhật người dùng Ở đây, người quản trị sẽ có thể cập nhật được những thông tin cơ bản như: Tên người dùng, số điện thoại, địa chỉ, giới tính, mật khẩu.

[1]: Vùng sửa thông tin người dùng

[3]: Danh sách đơn hàng của người dùng

3.6.15 Giao diện quản lý slide

Hình 3.3.15 Giao diện quản lý slide

Hình 3.3.15.1 Giao diện chọn ảnh slide

Hình 3.3.15 2 Giao diện popup xóa ảnh slide

Người quản trị thêm ảnh ở slide trang người dùng Người quản trị có thể lựa chọn một hoặc nhiều ảnh tùy nhu cầu và thao tác dễ dàng.

[5]: Nút t chọn ảnh từ máy người dùng

Tiêu đề	Thiết kế website bán hàng NB STORE
Tác giả	Phùng Duy Long
Người hướng dẫn	Cô Nguyễn Vân Anh
Trường học	Trường Đại Học Kinh Doanh Và Công Nghệ Hà Nội
Chuyên ngành	Công Nghệ Thông Tin
Thể loại	Luận văn tốt nghiệp
Năm xuất bản	2022
Thành phố	Hà Nội

Định dạng
Số trang	94
Dung lượng	2,43 MB