HỌC VIỆN KỸ THUẬT MẬT MÃ KHOA AN TOÀN THÔNG TIN BÁO CÁO CÔNG NGHỆ PHẦN MỀM Đề tài XÂY DỰNG WEBSITE QUẢN LÝ BÁN HÀNG ĐIỆN TỬ
Trang 1Giảng viên giảng
Trang 2Hà Nội, tháng 12 năm 2022
LỜI NÓI ĐẦU
Ngày nay, với sự phát triển mạnh mẽ của công nghệ thông tin và những ứngdụng của nó trong đời sống Máy tính điện tử không còn là một thứ phương tiện lạ lẫm đối với mọi người mà nó dần trở thành một công cụ làm việc và giải trí thông dụng và hữu ích của chúng ta, không chỉ ở công sở mà còn ngay cả trong gia đình.
Trong nền kinh tế hiện nay, với xu thế toàn cầu hoá nền kinh tế thế giới, mọi mặt của đời sống xã hội ngày càng được nâng cao, đặc biệt là nhu cầu trao đổi hàng hoá của con người ngày càng tăng cả về số lượng và chất lượng.Hiện nay các công ty tin học hàng đầu thế giới không ngừng đầu tư và cải thiện các giải pháp cũng như các sản phẩm nhằm cho phép tiến hành thương mại hóa trên Internet Thông qua các sản phẩm và công nghệ này, chúng ta dễ dàng nhận ra tầm quan trọng và tính tất yếu của thương mại điện tử Với những thao tác đơn giản trên máy
có nối mạng Internet bạn sẽ có tận tay những gì mình cần mà không phải mất nhiều thời gian Bạn chỉ cần vào các trang dịch vụ thương mại điện tử, làm theo hướng dẫn và click vào những gì bạn cần Các nhà dịch vụ sẽ mang đến tận nhà cho bạn Các ứng dụng Web ngày càng trở nên phổ biến Trước nhu cầu đó, cùng với yêu
cầu môn học, nhóm chúng em quyết định chọn đề tài Xây dựng Website bán hàng trực tuyến, cụ thể là đồ điện tử máy tính ,camera,thiết bị mạng ,phụ kiện
Chúng em xin chân thành cảm ơn ThS Trần Anh Tú – giảng viên trực tiếp hướng dẫn, chỉ bảo, tạo mọi điều kiện thuận lợi giúp đỡ chúng em trong quá trình thực hiện đề tài.
Tuy đã có rất nhiều cố gắng và sự nỗ lực của các thành viên để hoàn thiện đề
tài, nhưng đề tài “Xây dựng Website quản lý bán hàng điện tử” của chúng em
còn nhiều thiếu sót Chúng em rất mong nhận được sự góp ý từ các thầy cô.
Trang 4MỤC LỤC
LỜI NÓI ĐẦU ii
MỤC LỤC iii
DANH MỤC HÌNH VẼ v
DANH MỤC BẢNG BIỂU vi
Chương 1 KHẢO SÁT, PHÂN TÍCH, THIẾT KẾ HỆ THỐNG QUẢN LÝ BÁN HÀNG 7
1.1 Khảo sát bài toán thực tế, phân tích yêu cầu chức năng của hệ thống 7
1.1.1 Khảo sát bài toán thực tế 7
1.1.2 Yêu cầu chức năng phía quản trị 10
1.1.3 Yêu cầu chức năng phía người dùng 9
1.2 Phân tích hệ thống 10
1.2.1 Biểu đồ Usecase 10
1.2.2 Biểu đồ tuần tự và kịch bản 17
1.3 Thiết kế hệ thống 31
1.3.1 Thiết kế cơ sở dữ liệu 31
1.3.2 Thiết kế giao diện hệ thống 41
Chương 2 LỰA CHỌN CÔNG NGHỆ XÂY DỰNG HỆ THỐNG 47
2.1 Giới thiệu về Javascript, HTML, CSS 47
2.2 Tổng quan về NodeJS, ReactJS 47
2.2.1 Giới thiệu về NodeJS 47
2.2.2 Frameword ExpressJS 48
2.2.3 Thư viện ReactJS 48
Trang 52.4 Những công nghệ, mã nguồn sử dụng để đảm bảo an toàn trong hệ
thống 50
2.4.1 Bcrypt – Mã hóa dữ liệu nhạy cảm 50
2.4.2 Xác thực người dùng sử dụng Json Web Token (JWT) 50
Chương 3 TRIỂN KHAI HỆ THỐNG TRANG WEB QUẢN LÝ BÁN HÀNG 53
3.1 Mô tả hệ thống 53
3.2 Thiết lập môi trường phát triển hệ thống 53
3.2.1 Cài đặt IDE Visual Studio Code (VSC) 53
3.2.2 Cài đặt NodeJS, ExpressJS, ReactJS 54
3.2.3 Cài cơ sở dữ liệ MongoDB 54
KẾT LUẬN 55
Kết quả thu được 55
3.3 Phương hướng phát triển 55
TÀI LIỆU THAM KHẢO 56
Trang 6DANH MỤC HÌNH VẼ
Hình 1.1 Giao diện của Viettel Store 7
Hình 1.2 Giao diện của CellphoneS 8
Hình 1.3 Giao diện của thế giới di dộng 8
Hình 1.4 Giao diện của FTP Shop 9
Hình 1.5 Usecase Tổng quát 11
Hình 1.6 Usecase Quản lý sản phẩm 12
Hình 1.7 Usecase Quản lý đơn hàng 13
Hình 1.8 Usecase Thanh toán 14
Hình 1.9 Usecase Thống kê 15
Hình 1.10 Usecase Quản lý thông tin 16
Hình 1.11 Usecase Tìm kiếm 17
Hình 1.12 Biểu đồ tuần tự quá trình Đăng ký 18
Hình 1.13 Biểu đồ tuần tự quá trình Đăng nhập 20
Hình 1.14 Biểu đồ tuần tự quá trình Tìm kiếm 22
Hình 1.15 Biểu đồ tuần tự quá trình Thanh toán 24
Hình 1.16 Biểu đồ tuần tự quá trình Quản lý thông tin sản phẩm 26
Hình 1.17 Biểu đồ tuần tự quá trình Thống kê 27
Hình 1.18 Biểu đồ tuần tự Quản lý thông tin khách hàng 30
Hình 1.19 Giao diện chính 41
Hình 1.20 Giao diện đăng nhập 41
Hình 1.21 Giao diện đăng ký 42
Hình 1.22 Giao diện admin 42
Hình 1.23 Giao diện quản lý sản phẩm 43
Hình 1.24 Giao diện trang chi tiết sản phẩm 43
Hình 1.25 Giao diện trang thêm sản phẩm 44
Hình 1.26 Giao diện trang danh sách sản phẩm 44
Hình 1.27 Giao diện trang quản lý đơn hàng 45
Hình 1.28 Giao diện trang tìm kiếm 45
Hình 1.29 Giao diện trang chi tiết đơn hàng 46
Trang 7DANH MỤC BẢNG BIỂU
Bảng 1.1 Bảng tổng quát cơ sở dữ liệu 31
Bảng 1.2 Bảng Accessory 32
Bảng 1.3 Bảng PC 33
Bảng 1.4 Bảng Tablet 34
Bảng 1.5 Bảng Cart 35
Bảng 1.6 Bảng Swatch 35
Bảng 1.7 Bảng Smartphone 36
Bảng 1.8 Bảng Comment 37
Bảng 1.9 Bảng User 37
Bảng 1.10 Bảng Quantity 38
Bảng 1.11 Bảng History 38
Bảng 1.12 Bảng Homepage 39
Bảng 1.13 Bảng Accessorypage 40
Trang 8Chương 1 KHẢO SÁT, PHÂN TÍCH, THIẾT KẾ HỆ THỐNG QUẢN LÝ
BÁN HÀNG1.1 Khảo sát bài toán thực tế, phân tích yêu cầu chức năng của hệ thống
1.1.1 Khảo sát bài toán thực tế
Website bán hàng là trang Web cho phép doanh nghiệp và khách hàng có thể tiến
hành việc mua bán sản phẩm/dịch vụ trực tuyến Cụ thể, khi truy cập vào các Websitenày, bạn có thể xem thông tin sản phẩm, tìm kiếm các sản phẩm cần mua, đặt hàng vàthanh toán nhanh chóng
Dựa vào một số website bán đồ điện tử như: CellphoneS, Viettel Store,Thegioididong, FPTshop… Hiểu được nhu cầu của người dân có thể thấy các Websitenày đang hoạt động hiệu quả thay thế cho cửa hàng bán lẻ và nhân viên bán hàng Khônggiới hạn về vị trí địa lý hay thời gian ngày/ đêm Bạn có thể mua sắm bất cứ thứ gì ở bất
cứ nơi đâu chỉ với vài cú nhấp chuột Đặc biệt, mua sắm trực tuyến (Online Shopping)
ngày càng trở nên phổ biến Việc mỗi doanh nghiệp tạo cho mình một Web bán hàng trở
thành điều quan trọng, phổ biến
Dưới đây là một số thông tin khảo sát về các website bán đồ điện tử:
Trang web Viettel Store (https://viettelstore.vn) bán laptop, phụ kiên đi kèm vớilaptop, …
Hình 1.1 Giao diện của Viettel Store
Trang 10Trang web CellphoneS (https://cellphones.com.vn/) chuyên bán đồ điện tử nhưđiện thoại, laptop, đồng hồ và các phụ kiện công nghệ
Hình 1.2 Giao diện của CellphoneS
Trang web Thế Giới Di Động và FPT Shop (https://www.thegioididong.com/) (https://fptshop.com.vn/) bán các đồ về công nghệ
Hình 1.3 Giao diện của thế giới di dộng
Trang 11Hình 1.4 Giao diện của FTP Shop
1.1.2 Yêu cầu chức năng phía người dùng
Giao diện dễ sử dụng và có tính thẩm mỹ cao
Cho phép khách hàng đăng ký thành viên và đảm bảo bí mật thông tin
Xem và thay đổi các thông tin về tài khoản
Hình thức thanh toán phải đảm bảo chính xác
Thông tin sản phẩm phong phú, đa dạng:
Giới thiệu, bày bán nhiều loại hàng, nhiều mặt hàng để khách hàng cónhiều cơ hội lựa chọn về một loại mặt hàng Thông tin về một sảnphẩm phải chi tiết để khách hàng có thể nắm bắt rõ thông tin về sảnphẩm mình lựa chọn Đặc biệt là những mặt hàng được nhiều kháchhàng quan tâm
Luôn cập nhật, giới thiệu những thế hệ thiết bị điện tử mới nhất
Thông tin về bảo hành sản phẩm phải rõ ràng
Cho phép khách hàng tìm kiếm nhanh chóng, chính xác theo nhiều tiêu chí
Trang 121.1.3 Yêu cầu chức năng phía quản trị
Ngoài các yêu cầu giống như của khách hàng, thì hệ thống phải đảm bảonhững yêu cầu sau của nhân viên quản lý web
Quản lí chung: liên quan tới các thông tin nhân viên, khách hàng, hàng,
Cập nhật thông tin hàng hóa trực tuyến: Dễ dàng cập nhật và thường xuyênthay đổi hình ảnh, thông tin chi tiết giá các mặt hàng bạn sẽ kinh doanh ở bất
cứ đâu
Quản lí các đơn hàng trực tuyến: Quản lí, lưu trữ và báo cáo thông tin vềđặt hàng và trạng thái của đơn hàng: đã giao hàng chưa, đã thanh toánchưa
Quản lí khách hàng: Lưu trữ các hoạt động gắn với các khách hàng của cửahàng Mọi hoạt động gắn với khách hàng và đơn hàng đều có thể thực hiện từ
xa, không phụ thuộc vào vị trí địa lý
Thống kê chi tiết cụ thể, chính xác và nhanh chóng
Thống kê được mặt hàng nào bán hết, mặt hàng nào bán chạy, mặthàng nào tồn kho, mặt hàng nào cần chỉnh sửa…
Tổng hợp thu chi hàng ngày, hàng tuần, hàng tháng hàng quý vàhàng năm
Tổng hợp lưu trữ được ý kiến phản ánh của khách hàng để có thểtrả lới khách hàng một cách nhanh chóng và chính xác nhất
Sản phẩm: Có thể thêm, sửa xóa thông tin, danh mục
Quản lý các module: định vị, chỉnh sửa, bật –tắt các module chức năng
Xem các báo cáo, thống kê, đơn đặt hàng
Nhận và phản hồi các yêu cầu của khách hàng
Trang 13 Khách hàng chưa đăng nhập
1.2.1.2 Usecase Tổng quát
Quản lý sản phẩm: Chủ cửa hàng có thể thêm, sửa, xóa sản phẩm.
Quản lý đơn hàng: Chủ cửa hàng có thể xem được các đơn hàng mà các khách hàng đã đặt.
Xem các đơn hàng: Khách hàng có thể xem được các đơn hàng mình đã đặt.
Đăng ký: khách hàng chưa có tài khoản cần đăng ký tài khoản và các thông tin
cá nhân như tên, địa chỉ, số điện thoại để có thể đặt hàng.
Xem sản phẩm: khách hàng có thể xem thông tin chi tiết về sản phẩm.
Đặt hàng: khách hàng đã đăng nhập có thể đặt hàng các sản phẩm có trong giỏ hàng và lựa chọn phương thức thanh toán phù hợp.
Quản lý thông tin: Chủ cửa hàng có thể thêm, sửa, xóa thông tin của khách hàng
Thanh toán: khách hàng điền thông tin giao hàng và xác nhận thanh toán đơn hàng.
Thống kê cửa hàng: Chủ cửa hàng thống kê doanh thu, lợi nhuận, số đơn hàng
và số sản phẩm bán ra của theo tháng, năm.
Trang 14 Mô tả use case:
Thêm sản phẩm: chủ cửa hàng thêm một sản phẩm mới vào hệ thống
Sửa sản phẩm: chủ cửa hàng sửa thông tin một sản phẩm trên hệ thống
Xóa sản phẩm: chủ cửa hàng xóa một sản phẩm trên hệ thống
Trang 15Hình 1.6 Usecase Quản lý sản phẩm
Trang 161.2.1.4 Usecase Quản lý đơn hàng
Mô tả usecase: Người quản trị nắm được thông tin số lượng đơn hàng được giao,đơn hàng bị hủy bỏ, số hàng đang xử lý
Đang xử lý: Đơn hàng cần xác nhận của quản trị viên để thông báo cho ngườidùng biết rằng đơn hàng của họ đã được chấp thuận và chuyển sang trạng tháigiao hàng
Đang giao hàng: Đơn hàng được chuyển đến người dùng thông qua các dịch vụchuyển phát
Đã giao hàng: Người quản trị xác nhận đơn hàng đã chuyển tới người dùng thôngqua dịch vụ chuyển phát
Hủy bỏ: Người dùng hủy mua hàng trong quá trình chờ xử lý hoặc đang giaohàng
Hình 1.7 Usecase Quản lý đơn hàng
Trang 171.2.1.5 Usecase Thanh toán
Mô tả usecase:
Người dùng sau khi chọn được sản phẩm sẽ đặt hàng thông qua chức năng thanh toán:
Trước khi thanh toán, người dùng phải đăng nhập để khi lên đơn, ngườiquản trị có thể biết thông tin người mua là ai? Địa chỉ ở đâu?
Xem sửa đơn hàng: Người dùng xem lại đơn hàng của mình, thêm sảnphẩm hoặc loại bỏ sản phẩm không muốn mua trước khi tính tiền
Tính phí vận chuyển: Hệ thống tính phí vận chuyển thông qua địa chỉ màngười mua cung cấp
Phương thức thanh toán: Người mua lựa chọn phương thức thanh toán (sửdụng ship COD)
Hình 1.8 Usecase Thanh toán
Trang 18 Thống kê sản phẩm đã bán: Người quản trị quản lý được lượng sản phẩmbán ra theo thời gian
Thống kê sản phẩm còn lại: Người quản trị nắm được số lượng, loại mặthàng còn lại trong kho, từ đó đưa ra chiến lược kinh doanh
Thống kê số lượng đơn hàng: Người quản trị dựa vào số lượng đơn hàng vàthời gian các đơn hàng xác định được thời gian mua sắm của người tiêudùng
Hình 1.9 Usecase Thống kê
Trang 191.2.1.7 Usecase Quản lý thông tin
Mô tả usecase:
Quản trị viên muốn quản lý thông tin về sản phẩm, quản lý thông tin người dùng:
Quản lý thông tin người dùng: Quản trị viên có quyền xóa người dùng trên trangweb khi người dùng vi phạm những điều khoản của trang web
Quản lý thông tin sản phẩm: Quản trị viên cập nhật thông tin về sản phẩm
+ Thêm sản phẩm: Thêm mới sản phẩm
+ Xóa sản phẩm: Loại bỏ sản phẩm trên trang web
+ Sửa sản phẩm: Sửa hình ảnh quảng cáo, giá thành sản phẩm, thông tin sảnphẩm, …
Hình 1.10 Usecase Quản lý thông tin
Trang 201.2.1.8 Usecase Tìm kiếm
Mô tả usecase:
Người dùng sau khi vào trang web, muốn tìm kiếm thông tin về sản phẩm:
Tìm kiếm theo tên sản phẩm: Người dùng nhập tên sản phẩm, trang web trả
về tên sản phẩm phù hợp với tìm kiếm của người dùng
Tìm kiếm theo loại sản phẩm: Người dùng chọn loại sản phẩm muốn tìmkiếm, trang web trả về danh sách các sản phẩm theo loại người dùng chọn
Mục đích: Giúp khách hàng đăng kí tài khoản trên trang web
Tóm lược: Khách hàng có nhu cầu mua các mặt hàng có trên webside
Đối tác: Khách hàng
Mô tả các kịch bản:
Tiền điều kiện: Không có
Trang 21o Load form giao diện chính.
o Khách hàng chọn chức năng “Đăng kí tài khoản”
o Hệ thống hiển thị các thông tin yêu cầu để đăng ký: tên đăng nhập, mật
khẩu, email, … các thông tin cá nhân liên quan khác
o Khách hàng cung cấp các thông tin và tạo tài khoản
o Hệ thống xác nhận thông tin và tạo tài khoản cho khách hang
o Lấy thông tin khách hang
o Hệ thống trả về kết quả
o Hiện thị
Các kịch bản khả dĩ khác:
o Khách hàng cung cấp các thông tin yêu cầu không đúng, tên đăng
nhập,email mật khẩu không hợp lệ hay đã tồn tài Người dùng cần
cung cấp lại thông tin hoặc ca sử dụng kết thúc
o Hệ thống không thể tạo được tài khoản Cần thông báo với khách
hàng là chức năng chưa sẵn sàng hoạt động ở thời điểm hiện tại
Trang 221.2.2.2 Biểu đồ tuần tự quá trình Đăng nhập
Mô tả tóm tắt
Tên ca sử dụng: Đăng nhập
Mục đích: giúp người dùng đăng nhập vào hệ thống
Tóm lược: Người dùng muốn đăng nhập vào hệ thống cần điền đúng đầy
đủ tên đăng nhập và mật khẩu
o Hệ thống yêu cầu người dung nhập tên đăng nhập và mật khẩu
o Người dùng nhập tên đăng nhập và mật khẩu
o Hệ thống kiểm tra thông tin đăng nhập
o Hệ thống lấy thông tin đăng nhập
o Trả về kết quả đăng nhập
o Hệ thống thông báo đăng nhập thành công (R1)
Các kịch bản khả dĩ khác:
o R1 Hệ thống thông báo tên đăng nhập và mật khẩu không hợp
lệ, người dùng phải nhập lại hoặc ca sử dụng kết thúc
Trang 23 Biểu đồ tuần tự quá trình đăng nhập:
Hình 1.13 Biểu đồ tuần tự quá trình Đăng nhập
1.2.2.3 Biểu đồ tuần tự quá trình Tìm kiếm
Mô tả tóm tắt
Tên UC: Tìm kiếm thông tin
Mục đích: Giúp người sử dụng tra cứu các thông tin cần thiết liên quan
đến cửa hàng
Tóm lược: Người sử dụng lựa chọn thông tin cần tra cứu gồm: thông tin
cửa hàng, thông tin hàng, thông tin nhân viên hay thông tin hóa đơn Tiến
hành tìm kiếm và tra cứu thông tin, có thêm in thông tin tìm kiếm hay
thoát ra
Trang 25 Mô tả kịch bản
Tiền điều kiền: Không có
Kịch bản chính:
o Khách chọn chức năng tra cứu thông tin
o Hệ thống hiện thị danh mục các thông tin có thể tra cứu
o Khách hàng lựa chọn tra cứu thông tin hàng
o Hệ thống hiển thị các thông tin yêu cầu để tra cứu
o Người sử dụng lựa chọn thông tin cần tra cứu:
A1 Tra cứu thông tin hàng theo mã hàng
A2 Tra cứu thông tin hàng theo tên hàng
A3 Tra cứu thông tin hàng theo giá của sản phẩm
o Hệ thống hiển thị thông tin người dùng yêu cầu
o Khách hàng tra cứu thông tin và lựa chọn hành động:
A4 Chọn thao tác in bảng thông tin tra cứu
A5 Chọn thao tác thoát khỏi chức năng tìm kiếm
o Người dùng kết thúc ca sử dụng
Các kịch bản con:
o A1 Người dùng lựa chọn tra cứu thông tin hàng theo mã hàng: Hệ thốnghiển thị màn hình yêu cầu khách hàng lựa chọn tra cứu thông tin Kháchhàng lựa chọn và nhập mã hàng(R1) Hệ thống hiển thị kết quả tra cứu cácmặt hàng có mã hàng như yêu cầu của khách hàng Ca sử dụng tiếp tục
o A2 Người dùng lựa chọn tra cứu thông tin hàng theo tên hàng : Hệ thốnghiển thị màn hình tra cứu thông tin theo tên hàng Người dùng nhập tên hàngcần tra cứu và xác nhận Hệ thống hiển thị kết quả tìm kiếm của mặt hàng cótên hàng như yêu cầu của khách hàng Ca sử dụng tiếp tục
o A3 Người dùng lựa chọn tra cứu thông tin hàng theo giá của sản phẩm: Hệthống hiển thị màn hình tra cứu thông tin theo giá của các mặt hàng Người
