Báo cáo Đồ án cơ sở 4 Đề tài xây dựng hệ thống website thương mại Điện tử bán giày

MỤC TIÊU ĐỀ TÀI: - Mục tiêu của dự án là tạo ra một hệ thống trên nền tảng java để người quản lý ởbất cứ đâu cũng có thể quản lý cửa hàng của mình.. NỘI DUNG ĐỀ TÀI: - Để có thể giải quy

ĐẠI HỌC ĐÀ NẴNG

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ

TRUYỀN THÔNG VIỆT - HÀN

Sinh viên thực hiện : ĐẶNG CHÍ NGHĨA

Giảng viên hướng dẫn : THS.DƯƠNG THỊ MAI NGA

Lớp : 20SE6

Đà nẵng, 10 tháng 11 năm 2022

ĐẠI HỌC ĐÀ NẴNG

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ THÔNG TIN VÀ

TRUYỀN THÔNG VIỆT - HÀN

BÁO CÁO ĐỒ ÁN CƠ SỞ 4

ĐỀ TÀI:

XÂY DỰNG HỆ THỐNG WEBSITE THƯƠNG MẠI ĐIỆN TỬ BÁN GIÀY

Sinh viên thực hiện : ĐẶNG CHÍ NGHĨA

Giảng viên hướng dẫn : THS.DƯƠNG THỊ MAI NGA

Lớp : 20SE6

Đà Nẵng, 10 tháng 11 năm 2022

MỞ ĐẦU

Trước đây, khi máy tính chưa được sử dụng phổ biến, việc mua bánthường được thực hiện tại các cửa hàng nhỏ lẻ, chợ, siêu thị,… theo phươngthức truyền thống tốn nhiều thời gian, nhân lực cũng như tài chính Ngày nayvới sự phát triển của khoa học kỹ thuật và công nghệ thông tin cũng rất pháttriển và được ứng dụng rộng rãi trong mọi lĩnh vực của đời sống giúp cho việcmua bán trở nên dễ dàng và thuận tiện hơn

Do đó, việc sử dụng công nghệ trong giao dịch là điều cần thiết đểchuyển từ phương thức bán hàng truyền thống sang phương thức bán hàngđiện tử Với ý nghĩ đó Tôi đã xây dựng dự án “Xây dựng hệ thống websitethương mại điện tử giày dép” nhằm giải quyết các vấn đề trong mua sắmtruyền thống và đóng góp một lối sống mới Tôi đã sử dụng một số loại ngônngữ lập trình như HTML, CSS, JAVA, Javascript, MySQL và SpringFramework để tạo một trang web mua sắm trực tuyến Trang web này cungcấp cho khách hàng thông tin chính xác về các sản phẩm giày dép và họ cóthể đặt hàng dễ dàng với vài cú nhấp chuột Nhờ đó, việc mua sắm trở nênnhanh chóng và thuận tiện hơn cho khách hàng

Tuy nhiên việc nghiên cứu còn gặp nhiều khó khăn nên đề tài chưakhai thác hết, đề tài còn nhiều thiếu sót, mong thầy cô thông cảm

LỜI CẢM ƠN

Chúng em xin chân thành cảm ơn cô Ths.Dương Thị Mai Nga , nhờ sự chỉ bảo vàhướng dẫn tận tình của thầy đã giúp chúng em hoàn thành được Đồ án cơ sở của mình.Chúng em xin cam đoan ý tưởng và nội dung trong bài báo cáo của mình là sự tự nghiêncứu, sáng tạo và ghi chép lại bằng ý hiểu của chúng em cũng như sự hỗ trợ từ thầy Nhữngnguồn nghiên cứu hay trích dẫn trong tài liệu đều được chúng em chú thích lại ở cuối tàiliệu này

Do thời gian thực hiện và kiến thức còn hạn chế nên dù đã cố gắng vẫn còn nhiềuthiếu sót trong quá trình thực hiện đề tài, rất mong được sự bổ sung đóng góp của các thầy

NHẬN XÉT

(Nhận xét của giảng viên hướng dẫn)

Đà Nẵng, ngày … tháng năm 2022 Giảng viên hướng dẫn

THS.DƯƠNG THỊ MAI NGA

MỤC LỤC

LỜI CẢM ƠN 4

NHẬN XÉT 5

MỤC LỤC 6

DANH MỤC HÌNH 1

TỔNG QUAN ĐỀ TÀI 2

1 GIỚI THIỆU CHUNG: 2

2 MỤC TIÊU ĐỀ TÀI: 2

3 NỘI DUNG ĐỀ TÀI: 2

4 YÊU CẦU CHỨC NĂNG: 3

5 BỐ CỤC BÁO CÁO: 4

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT 5

1.1 GIỚI THIỆU VỀ SPRING BOOT: 5

1.1.1 Tổng quan: 5

1.1.2 Lợi ích của Spring boot: 5

1.2 Giới thiệu về HTML: 6

1.3 Giới thiệu về CSS: 7

1.4 Giới thiệu về Javascript: 7

1.5 Giới thiệu về MySQL: 8

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG 9

2.1 MÔ TẢ TỔNG QUAN: 9

2.1.1 Khảo sát người dùng: 9

2.1.2 Các Actor: 9

2.1.3 Đặc điểm các Actor: 9

2.1.4 Use-case Specification: 9

2.1.5 Use-case quản lý danh mục: 10

2.1.6 Use-case quản lý tài khoản: 11

2.1.7 Use-case quản lý sản phẩm: 11

2.1.8 Use-case quản lý giỏ hàng: 12

2.1.9 Biểu đồ tuần tự chức năng Đăng nhập: 12

2.1.10 Biểu đồ tuần tự chức năng Đăng kí: 13

2.1.11 Biểu đồ tuần tự chức năng Xem sản phẩm: 13

2.1.12 Biểu đồ lớp: 13

CHƯƠNG 3 PHÁT TRIỂN VÀ TRIỂN KHAI ỨNG DỤNG 15

3.1 Thiết kế kiến trúc: 15

3.2 Xây dựng ứng dụng: 15

3.2 Minh họa các chức năng chính: 15

CHƯƠNG 4: KẾT LUẬN 20

4.1 Kết quả đạt được: 20

4.2 Hạn chế: 20

4.3 Hướng phát triển: 20

TÀI LIỆU THAM KHẢO 21

DANH MỤC HÌNH

Trang

Hình 1:Tổng quan về Spring boot 5

Hình 2: Lợi ích về Spring boot 6

Hình 3: Giới thiệu về HTML 7

Hình 4 : Giới thiệu về CSS 7

Hình 5 :Giới thiệu về Javascript 8

Hình 6 : Giới thiệu về MySQL 8

Hình 7:Tổng quan sơ đồ use-case 10

Hình 8 : Use-case quản lý danh mục 10

Hình 9 : Use-case quản lý tài khoản 11

Hình 10 : Use-case quản lý sản phẩm 11

Hình 11 : Use-case quản lý giỏ hàng 12

Hình 12 : Biểu đồ tuần tự chức năng Login 12

Hình 13: Biểu đồ tuần tự chức năng Đăng kí 13

Hình 14 : Biểu đồ tuần tự chức năng Xem sản phẩm 13

Hình 15 : Biểu đồ lớp 14

Hình 16 : Mô hình MVC 15

Hình 17 :Trang chủ 16

Hình 18 : Trang đăng kí tài khoản 16

Hình 19 : Trang đăng nhập tài khoản 17

Hình 20 : Trang hiển thị thông tin người dùng 17

Hình 21 : Trang hiển thị lịch sử đặt hàng 17

Hình 22 : Trang hiển thị tất cả sản phẩm 18

Hình 23 : Trang hiển thị chi tiết sản phẩm 18

Hình 24 : Trang thanh toán 19

Hình 25 : Trang admin 19

1

TỔNG QUAN ĐỀ TÀI

1 GIỚI THIỆU CHUNG:

Ngày nay, với sự phát triển và bùng nổ của Công nghệ thông tin và Cách mạngcông nghiệp lần thứ 4, hầu hết các ứng dụng tin học đã được ứng dụng rộng rãi trongđời sống, từ nghiên cứu khoa học đến các lĩnh vực khác nhau của đời sống xã hội Nó

đã trở thành một công cụ hữu ích giúp con người quản lý, lưu trữ và xử lý thông tin hiệuquả trong nhiều ngành nghề như y tế, giao thông vận tải, giáo dục,… đặc biệt là trongcông tác quản lý nói chung và quản lý cửa hàng nói riêng

Với những tính năng đa dạng của website sẽ loại bỏ những phương pháp quản lý lỗithời, lạc hậu gây tốn kém về nhiều mặt Đồng thời cung cấp giao diện đơn giản, bắt mắt

để người dùng dễ dàng quản lý và cải tiến hệ thống, giúp việc quản lý cửa hàng đượcthực hiện nhanh chóng, tránh sai sót

2 MỤC TIÊU ĐỀ TÀI:

- Mục tiêu của dự án là tạo ra một hệ thống trên nền tảng java để người quản lý ởbất cứ đâu cũng có thể quản lý cửa hàng của mình Để xây dựng được một hệthống hỗ trợ web hoàn chỉnh như vậy cần phải có người quản lý và nhân viên củacửa hàng Một hệ thống web hoàn chỉnh và hiệu quả có thể cung cấp dịch vụquản lý sản phẩm, danh mục, thương hiệu và blog là mục tiêu cơ bản của dự án

Em hy vọng sẽ mang lại trải nghiệm tốt nhất cho người dùng, giống như có thểmang lại giá trị để giúp công việc của người quản lý dễ dàng hơn Hệ thống này

sẽ cung cấp một giao diện người dùng đơn giản và dễ vận hành, có thể đượcquản lý bởi bất kỳ người dùng nào mà không cần có kiến thức chuyên sâu về hệthống máy tính

3 NỘI DUNG ĐỀ TÀI:

- Để có thể giải quyết các vấn đề đã nêu trong phần Tổng kết và Đặt vấn đề, em đãchọn đề tài cho đồ án tốt nghiệp của mình là xây dựng ứng dụng bán hàng trựctuyến sử dụng các ngôn ngữ và công nghệ lập trình web, HTML, CSS, JavaSpring boot – Spring security – Spring Data JPA-MYSQL

- Đầu tiên, người quản trị sẽ có nhiều quyền kiểm soát hơn đối với dữ liệu củatrang web, có thể cập nhật lịch sử đặt hàng, thống kê sản phẩm, mở các chươngtrình khuyến mãi trong một khoảng thời gian cụ thể cho từng sản phẩm, quản lý

2

doanh thu và quản lý việc thanh toán của người dùng, quản lý doanh thu, phânquyền người dùng.

- Nhân viên có thể tự mở tài khoản và quản lý thông tin đơn hàng, quản lý và chiađơn hàng cho shipper, kiểm tra lịch sử giao hàng, chuyển đổi trạng thái đơnhàng, quản lý mặt hàng, quản lý kho

- Người gửi hàng có thể đăng nhập và kiểm tra để xem thông tin đơn hàng đượcgiao

- Người dùng có thể mở tài khoản để có thể mua hàng, thay đổi thông tin cá nhân,xem thông tin lịch sử đơn hàng mua hàng

4 YÊU CẦU CHỨC NĂNG:

- Phần người dùng:

+ Đăng ký đăng nhập (Spring security JWT)

+ Xem thông tin tài khoản

+ Thay đổi thông tin tài khoản và mật khẩu

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

+ Xem toàn bộ sản phẩm

+ Xem chi tiết bài viết

+ Xem trạng thái đơn hàng đã đặt

+ Hủy trạng thái đơn hàng khi ở chờ lấy hàng

+ Tìm kiếm theo tên, khoảng giá, danh muc, nhãn hiệu, size sản phẩm, + Bình luận sản phẩm

+ Chat với shop thông qua messeger

- Phần quản trị:

+ Quản lý danh mục

+ Thêm sửa xóa danh mục

+ Quản lý sản phẩm

+ Thêm sửa xóa sản phẩm

+ Nhập số lượng sản phẩm theo size

+ Quản lý nhãn hiệu

+Thêm sửa xóa nhãn hiệu

+ Quản lý đơn hàng

+ Tạo đơn hàng khi khách không có tài khoản

+ Thay đổi thông tin sản phẩm khi khác hàng đã đặt hàng muốn thay đổi + Thay đổi trạng thái đơn hàng khi khách hàng đặt

3

+ Quản lý bài viết

+ Thêm sửa xóa bài viết+ Quản lý tài khoản

CHƯƠNG 1 CƠ SỞ LÝ THUYẾT

1.1 GIỚI THIỆU VỀ SPRING BOOT:

1.1.1 Tổng quan:

- Spring Boot giúp bạn tạo các Ứng dụng dựa trên Spring cấp độ sản xuất độc lập

mà bạn có thể chạy Chúng tôi có quan điểm nhất định về nền tảng Spring và cácthư viện của bên thứ ba, để bạn có thể bắt đầu với ít phiền phức nhất Hầu hếtcác ứng dụng Spring Boot cần rất ít cấu hình Spring

- Cung cấp trải nghiệm bắt đầu nhanh hơn và có thể truy cập rộng rãi cho tất cảquá trình phát triển Spring

- Hãy kiên quyết vượt ra ngoài khuôn khổ nhưng hãy nhanh chóng tránh xa khicác yêu cầu bắt đầu khác với các mặc định

- Cung cấp một loạt các tính năng phi chức năng phổ biến cho các loại dự án lớn(chẳng hạn như máy chủ nhúng, bảo mật, số liệu, kiểm tra tình trạng và cấu hìnhbên ngoài)

- Hoàn toàn không sinh mã và không yêu cầu cấu hình XML

Hình 1:Tổng quan về Spring boot

1.1.2 Lợi ích của Spring boot:

- Cấu hình đơn giản

- Nhanh chóng tích hợp các khung của bên thứ ba mà không cần tệp cấuhình

- Ít mã hơn, ít tệp cấu hình hơn, không cần phải lo lắng về khung của bênthứ ba, các dự án được đơn giản hóa và tiết kiệm chi phí lớn hơn choviệc phát triển và bảo trì toàn bộ nhóm

5

- Nó giảm rất nhiều thời gian phát triển và tăng năng suất.

- Nó tránh viết nhiều mã soạn sẵn, nhận xét và Cấu hình XML

- Các ứng dụng Spring Boot và hệ sinh thái Spring của chúng (chẳng hạnnhư Spring JDBC, Spring ORM, Spring Data, Spring Security, v.v.)Việc tích hợp rất dễ dàng

- Nó cung cấp nhiều plugin để phát triển và thử nghiệm các ứng dụngSpring Boot rất dễ sử dụng các công cụ xây dựng như Maven vàGradle

- Nó cung cấp nhiều plug-in để làm việc với cơ sở dữ liệu nhúng và trong

cơ bản trong một lần ngồi; và khá mạnh mẽ trong những gì nó cho phép bạn tạo ra

- Định nghĩa của HTML là Ngôn ngữ đánh dấu siêu văn bản

- Siêu văn bản là phương pháp giúp bạn di chuyển trên web - bằng cách nhấp vào văn bản đặc biệt được gọi là siêu liên kết đưa bạn đến trang tiếp theo

- Đánh dấu là những gì các thẻ HTML làm với văn bản bên trong chúng Họ đánh dấu nó là một loại văn bản nhất định (ví dụ: văn bản in nghiêng)

- HTML là một Ngôn ngữ, vì nó có các từ mã và cú pháp giống như bất kỳ ngôn ngữ nào khác

6

1.3 Giới thiệu về CSS:

- CSS là ngôn ngữ để mô tả cách trình bày của các trang Web, bao gồm màu sắc,

bố cục và phông chữ Nó cho phép một người điều chỉnh bản trình bày với các loại thiết bị khác nhau, chẳng hạn như màn hình lớn, màn hình nhỏ hoặc máy in

- CSS độc lập với HTML và có thể được sử dụng với bất kỳ ngôn ngữ đánh dấu dựa trên XML nào Việc tách HTML khỏi CSS giúp dễ dàng duy trì các trang web, chia sẻ biểu định kiểu trên các trang và điều chỉnh các trang cho phù hợp với các môi trường khác nhau Điều này được gọi là sự tách biệt giữa cấu trúc (hoặc: nội dung) khỏi cách trình bày

-Hình 4 : Giới thiệu về CSS

1.4 Giới thiệu về Javascript:

- JavaScript ban đầu được tạo ra để “làm cho các trang web trở nên sống động”

- Các chương trình trong ngôn ngữ này được gọi là tập lệnh Chúng có thể được viết ngay trong HTML của trang web và chạy tự động khi tải trang Các tập lệnh được cung cấp và thực thi dưới dạng văn bản thuần túy Họ không cần chuẩn bị hoặc biên dịch đặc biệt để chạy Ở khía cạnh này, JavaScript rất khác so với một ngôn ngữ khác có tên là Java

7

- Ngày nay, JavaScript có thể thực thi không chỉ trên trình duyệt mà còn trên máy chủ hoặc trên thực tế trên bất kỳ thiết bị nào có chương trình đặc biệt gọi là công

cụ JavaScript

- Trình duyệt có một công cụ nhúng đôi khi được gọi là “máy ảo JavaScript”

Hình 5 :Giới thiệu về Javascript

1.5 Giới thiệu về MySQL:

- MySQL là một hệ thống quản lý cơ sở dữ liệu mã nguồn mở hàng đầu Nó là một

hệ thống quản lý cơ sở dữ liệu đa luồng, nhiều người dùng MySQL đặc biệt phổ biến trên web Nó là một trong những phần của nền tảng LAMP rất phổ biến Linux, Apache, MySQL và PHP Cơ sở dữ liệu MySQL có sẵn trên hầu hết các nền tảng HĐH quan trọng Nó chạy trên BSD Unix, Linux, Windows hoặc Mac Wikipedia, YouTube, Facebook sử dụng MySQL

- Sự phát triển của MySQL bắt đầu vào năm 1994 bởi một công ty Thụy Điển MySQL AB Sun Microsystems mua lại MySQL AB vào năm 2008 Sun được Oracle mua lại vào năm 2010

- MySQL, PostgreSQL, Firebird, SQLite, Derby và HSQLDB là những hệ thống

cơ sở dữ liệu nguồn mở nổi tiếng nhất

Hình 6 : Giới thiệu về MySQL

8

CHƯƠNG 2 PHÂN TÍCH THIẾT KẾ HỆ THỐNG2.1 MÔ TẢ TỔNG QUAN:

2.1.1 Khảo sát người dùng:

- Dựa trên những phân tích ở của website lazada và shoppe, em rút ra một số chức năng cần có trong một hệ thống brand-shop:

● Đăng ký, đăng nhập

● Quản lý tài khoản cá nhân, chỉnh sửa thông tin

● Kiểm tra trạng thái đơn hàng, lịch sử giao dịch trên hệ thống

● Sản phẩm đa dạng và đầy đủ thông tin như tên hàng, giá, chủng loại, mô tả, đánh giá,

- Tác nhân người dùng: Là loại tác nhân cơ bản nhất, có thể thực hiện các chức

năng cơ bản như:

- Tác nhân quản trị viên (admin): Là loại tác nhân có quyền cao nhất trong hệ

thống, ngoài việc kế thừa các chức năng của người dùng, người quản trị có thể

● Quản lý thành viên trên hệ thống

9

● Quản lý danh mục

● Quản lý thương hiệu

● Quản lý sản phẩm

● Thống kê

Hình 7:Tổng quan sơ đồ use-case

2.1.5 Use-case quản lý danh mục:

Hình 8 : Use-case quản lý danh mục

Xem chuyên mục: Xem thông tin chuyên mục:

Sửa chuyên mục: Tạo mới hoặc xóa thông tin của chuyên mụcXóa danh mục: Xóa danh mục

10

Tạo mới Category: Tạo thông tin của Category

2.1.6 Use-case quản lý tài khoản:

Hình 9 : Use-case quản lý tài khoản

Sửa thông tin: Tạo mới hoặc xóa các thông tin: tên, email, điện thoại, ngày sinh, địa chỉ

Bảo mật: Chỉnh sửa mật khẩu

Xem thông tin: Xem thông tin tài khoản hiện tại

2.1.8 Use-case quản lý giỏ hàng:

Hình 11 : Use-case quản lý giỏ hàng

Xem đơn hàng: Xem thông tin đơn hàng: mã hàng, giá cả, thanh toánSửa đơn hàng: Kiểm tra lịch sử giao hàng của đơn hàng, tạo, xóa thông tin đơn hàng

Xóa đơn hàng: Xóa đơn hàng

Tạo mới đơn hàng: Tạo mới nội dung đơn hàng

2.1.9 Biểu đồ tuần tự chức năng Đăng nhập:

Hình 12 : Biểu đồ tuần tự chức năng Login

12

2.1.10 Biểu đồ tuần tự chức năng Đăng kí:

Hình 13: Biểu đồ tuần tự chức năng Đăng kí

2.1.11 Biểu đồ tuần tự chức năng Xem sản phẩm:

Hình 14 : Biểu đồ tuần tự chức năng Xem sản phẩm

2.1.12 Biểu đồ lớp:

13

14

CHƯƠNG 3 PHÁT TRIỂN VÀ TRIỂN KHAI

ỨNG DỤNG

3.1 Thiết kế kiến trúc:

- Model-View-Control (MVC) là một kiến trúc phần mềm, hiện được coi là một

mẫu thiết kế trong công nghệ phần mềm Mô hình MVC tách phần xử lý dữ liệu khỏi giao diện, cho phép phát triển, kiểm tra và bảo trì các thành phần một cách độc lập

- Ứng dụng code JDE : Intellij idea

- Thiết kế cơ sở dữ liệu: MySQL Workbench

- JAVA development environment : JDK 11

3.2 Minh họa các chức năng chính:

Trang chủ

15

Trang đăng kí tài khoản :

Tại trang đăng ký thành viên, khách hàng có thể đăng ký tài khoản làm thành viên của website bằng cách nhập đúng và đầy đủ các yêu cầu được nêu trong biểu mẫu như: Email, mật khẩu, tên, địa chỉ,…

Hình 18 : Trang đăng kí tài khoản

Trang đăng nhập tài khoản :

16