BÁO CÁO BÀI TẬP LỚN MÔN Phân tích thiết kế hướng đối tượng Đề tài Website bán quần áo, phụ kiện online

Việc quản lý cũng ngày một tiện dụng hơn với sự hỗ trợ của công nghệ : Máy tính, điện thoại thông minh hỗ trợ GSM, CDMA,… Dựa trên nhu cầu ngày càng cao của các cửa hàng và khách hàng,

TRƯỜNG ĐẠI HỌC GIAO THÔNG VẬN TẢI

KHOA CÔNG NGHỆ THÔNG TIN

~~~*********~~~

BÁO CÁO BÀI TẬP LỚN MÔN: Phân tích thiết kế hướng đối tượng

Đề tài: Website bán quần áo, phụ kiện online

Giáo viên hướng dẫn: Đào Thị Lệ Thủy

Sinh viên thực hiện:

Đỗ Thị Thảo(181203068) Nguyễn Thanh Bình(181203069) Bùi Hữu Đức Hoàng(181210675) Lớp: Công nghệ thông tin 3 K59

Hà Nội, ngày 23 tháng 10 năm 2021

Lời mở đầu

Công nghệ ngày một trở nên phát triển và trở thành một phần thiết yếu của cuộc sống Với việc phát triển của công nghệ, con người đã tiết kiệm được nhiều nguyên liệu và nhiên liệu, thời gian và công sức hơn trong việc sản xuất, vận chuyển, lưu thông

và quản lý hàng hóa Chuyên môn hóa và tự động trong từng khâu làm tăng hiệu năng trong sản xuất Việc quản lý cũng ngày một tiện dụng hơn với sự hỗ trợ của công nghệ : Máy tính, điện thoại thông minh hỗ trợ GSM, CDMA,…

Dựa trên nhu cầu ngày càng cao của các cửa hàng và khách hàng, chúng em thực hiện xây dựng trang web “Bán quần áo, phụ kiện online” nhằm hỗ trợ quá trình quản

lý sản phẩm được dễ dàng hơn, việc mua bán được diễn ra thuận lợi hơn.

Trong quá trình làm việc, do những hiểu biết còn hạn chế nên không thể tránh khỏi những khuyết điểm Rất mong cô và các bạn góp ý để đề tài chúng em được hoàn thiện hơn nữa.

2

Chương I: Tìm hiểu về PHP và MySQL

1 PHP

a Một vài nét về PHP

 PHP là viết tắt của từ Hypertext Preprocessor Ngôn ngữ này được phát triển từ năm 1994 và cho đến nay đã được nhiều người sử dụng để phát triển các ứng dụng phần mềm thông qua lập trình web Đặc điểm của ngôn ngữ lập trình này

là sử dụng mã nguồn mở, dễ dàng nhúng vào HTML và tích hợp với web

 Ưu điểm của ngôn ngữ lập trình PHP là cú pháp đơn giản, tốc độ xử lý nhanh, tính cộng đồng cao Chính vì vậy mà lập trình PHP được sử dụng chủ yếu để thiết kế web Để tạo ra các ứng dụng web bằng ngôn ngữ PHP, người lập trình phải sử dụng các dòng lệnh cơ bản

 Bạn có thể sử dụng ngôn ngữ lập trình PHP để tạo ra các blog cá nhân hoặc những website lớn Bởi, ngôn ngữ này có nhiều Framework được xây dựng từ các mã nguồn mở như Wordpress, OpenCart

 Link tham khảo: https://www.php.net/

 Tạo ứng dụng Facebook như Family Treen và eBuddy, hoặc cũng có thể được

sử dụng để tạo ra các trang mạng xã hội

 Phát triển plugin WordPress

 Tạo tệp PDF

 Các trang web thương mại điện tử

2 MySQL

a Đôi nét về MySQL

 MySQL là một hệ thống quản trị cơ sở dữ liệu mã nguồn mở (gọi tắt là

RDBMS) hoạt động theo mô hình client-server Với RDBMS là viết tắt

của Relational Database Management System.

 MySQL được tích hợp apache, PHP

 MySQL quản lý dữ liệu thông qua các cơ sở dữ liệu Mỗi cơ sở dữ liệu có thể

có nhiều bảng quan hệ chứa dữ liệu MySQL cũng có cùng một cách truy xuất

và mã lệnh tương tự với ngôn ngữ SQL

 MySQL được phát hành từ thập niên 90s

 Link tham khảo: https://www.mysql.com/

Hình 2: Hình ảnh minh họa MySQL

b Ưu điểm

 Dễ sử dụng: MySQL là cơ sở dữ liệu tốc độ cao, ổn định, dễ sử dụng và hoạt

động trên nhiều hệ điều hành cung cấp một hệ thống lớn các hàm tiện ích rất mạnh

 Độ bảo mật cao: MySQL rất thích hợp cho các ứng dụng có truy cập CSDL

trên Internet khi sở hữu nhiều nhiều tính năng bảo mật thậm chí là ở cấp cao

 Đa tính năng: MySQL hỗ trợ rất nhiều chức năng SQL được mong chờ từ một

hệ quản trị cơ sở dữ liệu quan hệ cả trực tiếp lẫn gián tiếp

4

 Khả năng mở rộng và mạnh mẽ: MySQL có thể xử lý rất nhiều dữ liệu và hơn

thế nữa nó có thể được mở rộng nếu cần thiết

 Nhanh chóng: Việc đưa ra một số tiêu chuẩn cho phép MySQL để làm việc rất

hiệu quả và tiết kiệm chi phí, do đó nó làm tăng tốc độ thực thi

3 HTML&CSS

 HTML, HyperText Markup Language, cung cấp cấu trúc nội dung và ý nghĩa

bằng cách xác định nội dung đó, ví dụ như tiêu đề, đoạn văn hoặc hình ảnh

 CSS, hay Cascading Style Sheets, là ngôn ngữ trình bày được dùng để tạo kiểu

cho sự xuất hiện của nội dung sử dụng, ví dụ như phông chữ hoặc màu sắc

 Hai ngôn ngữ HTML và CSS độc lập với nhau và vẫn giữ nguyên như vậy CSS không nên được viết bên trong một tài liệu HTML và ngược lại Theo quy định, HTML sẽ luôn đại diện cho nội dung và CSS sẽ luôn thể hiện sự xuất hiện của nội dung đó

 Link tham khảo HTML: https://www.w3schools.com/html/

 Link tham khảo CSS: https://www.w3schools.com/css/

 Link tham khảo: https://getbootstrap.com/docs/4.0/getting-started/introduction/

Hình 4: Hình ảnh minh họa Bootstrap4

b Javascript

 JavaScript thường được nhúng trực tiếp vào một trang web hoặc được tham

chiếu qua file js riêng

 Nó là ngôn ngữ lập trình từ phía client, tức là script được tải về máy của người dùng đang truy cập và được xử lý tại đó, thay vì xử lý trên máy chủ rồi mới đưa kết quả tới khách hàng

 Link tham khảo: https://www.w3schools.com/js/

Hình 5: Hình ảnh minh họa Javascript

6

c Jquery

 Là thư viện mã nguồn mở viết bằng ngôn ngữ javascript, giúp đơn giản cách viếtjavascript và tăng tốc độ xử lý các xự kiện trên trang web Phát hành vào tháng 1năm 2006 tại BarCamp NYC bởi John Resig Được sử dụng bởi hơn 52% trong 10.000 truy cập nhiều nhất các trang web

 Jquery không những có thể thay đổi giao diện(CSS) mà còn có thể thay đổi nội dung trang bên trong trang web

 Link tham khảo: https://jquery.com/

Hình 6: Hình ảnh minh họa Jquery

d Laravel Framework

 Laravel là một framework rõ ràng và ưu việt cho việt phát triển web PHP.

Giải thoát bạn khỏi mã spaghetti, nó giúp bạn tạo ra những ứng dụng tuyệt vời, sử dụng syntax đơn giản Phát triển là thích thú những trải nghiệm sáng tạo chứ không phải là sự khó chịu

 Laravel là một framework PHP 5.3 được miêu tả như ‘một framework cho web artisan’ Theo tác giả Taylor Otwell, Laravel mang lại niềm vui cho việc lập trình bởi nó đơn giản, súc tích và đặc biệt là trình bày hợp lý.

 Laravel có 3 đặc tính nổi trội

o Đơn giản: các chức năng của Laravel rất dễ hiểu và thực hiện

o Ngắn gọn: hầu hết các chức năng của Laravel hoạt động liên tục với cấu hình rất nhỏ, dựa vào các quy tắc chuẩn để giảm bớt code-bloat

o Trình bày hợp lý: hướng dẫn sử dụng Laravel rất đầy đủ và luôn cập

khi cho ra một phiên bản mới, đảm bảo những người học lập trình luôn luôn có những tài liệu mới nhất.

 Link tham khảo: https://laravel.com/

Hình 7: Hình ảnh minh họa Laravel

8

Chương II: Tìm hiểu và thiết kế website thương mại điện tử

“Bán quần áo và phụ kiện”

I) Mục đích

 Khi đi xây dựng một website đầu tiên chúng ta phải hình dung ra xem chúng ta cầnphải thiết kế cái gì cho website của mình Không có chủ định và mục tiêu rõ ràng thì cả website đó trở nên sai lầm, lan man và cuối cùng đi tới một hướng khó có thểtrở lại Thiết kế cân thận và định hướng rõ là chìa khóa hướng tới thành công của việc xây dựng một website

 Vận dụng tổng hợp những kiến thức đã học để tiến hành thiết kế website bán hàng online nhằm giải quyết những khó khăn hiện tại của cửa hàng Tìm hiểu thực trạng thương mại điện tử tại Việt Nam để triển khai hệ thống thương mại điện tử tại cửa hàng cho phù hợp Khai phá lợi ích của Internet đế hướng đến một môi trường kinhdoanh toàn cầu

 Giảm chi phí bán hàng tiếp thị và giao dịch Bằng phương tiện Internet/Web, một nhân viên bán hàng có thể giao dịch được với rất nhiều khách hàng Internet/Web giúp người tiêu thụ và các cửa hàng kinh doanh giảm đáng kê thời gian và chi phí giao dịch (giao dịch được hiểu là từ quá trình quảng cáo, tiếp xúc ban đầu, giao dịch đặt hàng, giao dịch thanh toán) Thời gian giao dịch qua Internet chỉ bàng 7% thời gian giao dịch qua Fax, và bằng khoảng 0.5 phần nghìn thời gian giao dịch quabưu điện chuyển phát nhanh, chi phí thanh toán điện tử qua Internet chi bàng từ 10% đến 20% chi phí thanh toán theo lối thông thường Những trở ngại của việc tiếp cận phương tiện Intemet/Web trong hầu hết các trường hợp sẽ mang lại nhiều thuận lợi và lợi ích trong kinh doanh Thế nhưng, tại sao nhiều cửa hàng vẫn không

tận dụng các tiến bộ kỹ thuật tuyệt vời của Internet Đó chính là một số rào cản hay nói cách khác đó chính là những khó khăn khi các cửa hàng tiếp cận đến loại hình bán hàng trực tuyến này.

II) Phạm vi

 Bài toán nhóm em thiết kế có phạm vi trong một cửa hàng nhỏ, các sản phẩm kinh doanh bao gồm quần áo nam nữ và phụ kiện như túi xách, đồng hồ

III) Phân tích và thiết kế chức năng

1 Website dành cho những đối tượng nào?

Website được thiết kế phục vụ 2 đối tượng là Admin(Quản trị viên) và User(Khách hàng)

 Admin:

o Đăng nhập vào hệ thống quản trị

o Xem, cập nhật, sửa, xóa thông tin sản phẩm, danh mục, slide, …

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

o Quản lý và cập nhật tin tức

 Có quyền đănh nhập, đăng xuất.

 Thêm sản phẩm vào giỏ hàng và đặt mua sản phẩm online

2 Các module thiết kế

Các Module hệ thống yêu cầu thân thiện, dễ sử dụng, bảo trì và nâng cấp

 Module sản phẩm: Hiển thị các sản phẩm hiện có

 Module chi tiết sản phẩm: Hiển thị số lượng sản phẩm theo màu sắc và kích cỡ

 Module chi tiết ảnh sản phẩm: Hiển thì các ảnh theo các góc khác nhai cảu sản phẩm

 Module giỏ hàng: Nơi lưu trữ các sản phẩm khách hàng đã thêm vào giỏ hàng

 Module đăng kí, đăng nhập thành viên: Mỗi User sẽ có thê đăng kí 1 tài khoản

cá nhân để mua hàng và thanh toán, hưởng các ưu đãi từ của hàng

 Module tìm kiếm sản phẩm: Lọc sản phẩm theo các tùy chọn của khách hàng

 Module quản lý các đơn hàng, chi tiết đơn hàng: Lưu lại các thông tin về giá và

số lượng sản phẩm mà khách hàng đã mua

10

3 Phân tích và thiết kế dữ liệu

3.1 Mô hình Usecase

Hình 8: Mô hình UseCase

ID Tên Use case Mô tả ngắn gọn Use

UC_001 Xem danh

sách sản

phẩm

Khi người dùng truy cập vào website thì hệ thống sẽ tự động hiển thị một số sản phẩm nổi bật Khi người dùng chọn vào một danh mục sản phẩm cụthể nào thì tất cả sản phẩm của danh mục

đó sẽ hiển thị lên giao diện

Hiển thị danh sáchsản phẩm theo từng danh mục

UC_001

UC_002 Xem thông

tin sản phẩm Sau khi tìm thấy sản phẩm cần, người dùng

có thể chọn vào sản phẩm để xem thông tin chi tiết của sản phẩm đó

Xem chi tiết thôngtin của sản phẩm UC_002

UC_003 Tìm kiếm Khi khách hàng cần

tìm một sản phẩm nào

đó thì có thể nhập thông tin sản phẩm vào ô tìm kiếm để thực hiện chức năng tìm kiếm Nếu sản phẩm đó có tồn tại trong dữ liệu thì sẽ hiện thông tin sản phẩm được tìm thấy

Tìm kiếm sản phẩm theo yêu cầukhách hàng

UC_003

UC_004 Đăng ký Khi khách hàng viếng

thăm muốn mua hàng Đăng ký tài khoảnđể nhận ưu đãi và UC_004

12

thì có thể thực hiện chức năng đăng ký để trở thành thành viên của website và thực hiện các chức năng mua hàng.

theo dõi đơn hàng

đã mua

UC_005 Đăng nhập Khách hàng nhập tên

tài khoản và mật khẩu

để đăng nhập vào hệ thống

Đăng nhập vào hệ thống để theo dõi đơn hàng đã mua

Cho phép khách hàng xem thông tin các sản phẩm

mà mình đặt mua

UC_006

UC_008 Quản lý đơn

hàng Để thực hiện chức năng quản lý thì yêu

cầu nhân viên phải đăng nhập hệ thống

Nhân viên chọn mục mình cần thực hiện quản lý như thống kê mọi đơn hàng, thống

kê lợi nhận

Cho phép nhân viên quản lý đơn hàng, thống kê lợi nhuận đã đạt được

UC_008

UC_009 Quản lý sản

phẩm Để thực hiện chức năng quản lý thì yêu

cầu nhân viên phải đăng nhập hệ thống

Nhân viên có thể thêm, xoá, sửa sản phẩm và xem chi tiết khách hàng, sửa trạng thái tài khoản khách hàng

Cho phép nhân viên quản lý việc thêm, sửa, xoá

UC_009

UC_010 Quản lý

khách hàng Cho phép nhân viên xem chi tiết

khách hàng, sửa trạng thái tài khoản khách hàng

UC_010

3.2 Các ca sử dụng

14

3.2 Quy trình xử lí đơn hàng

3.2 Mô hình phân rã chức năng

Hình 9: Mô hình phân rã chức năng

18

3.3 Biểu đồ luồng dữ liệu

Hình 9: Mô hình phân rã chức năng

WireFrame

a Giao diện người dùng

Hình 10: Biểu đồ luồng dữ liệu

4 Xây dựng biểu đồ tuần tự

Mục đích: biểu diễn tương tác giữa những người dùng và những đối tượng

bên trong hệ thống Biểu đồ này cho biết các thông điệp được truyền tuần tự

như thế nào theo thời gian Thứ tự các sự kiện trong biểu đồ tuần tự hoàn toàn

tương tự như trong scenario mô tả use case tương ứng

Biểu diễn: Biểu đồ tuần tự được biểu diễn bởi các đối tượng và message

truyền đi giữa các đối tượng đó

Trong hệ thống quản lý bán hàng, chúng ta lựa chọn biểu đồ tương tác dạng tuần

tự để biểu diễn các tương tác giữa các đối tượng Để xác định rõ các thành phần cần bổ sung trong biểu đồ lớp, trong mỗi biểu đồ tuần tự của hệ thống quản lý bán hàng sẽ thực hiện:

- Xác định rõ kiểu của đối tượng tham gia trong tương tác (ví dụ giao diện, điều khiển hay thực thể)

- Mỗi biểu đồ tuần tự có thể có ít nhất một lớp giao diện (Form) tương ứng

với chức năng (use case) mà biểu đồ đó mô tả

- Mỗi biểu đồ tuần tự có thể liên quan đến một hoặc nhiều đối tượng thực thể

Các đối tượng thực thể chính là các đối tượng của các lớp đã được xây dựng

trong biểu đồ thiết kế chi tiết Dưới đây là một số biểu đồ tuần tự cho các chức năng của hệ thống quản lý bán hàng:

 Biểu đồ tuần tự cho chức năng đăng nhập

20

 Biểu đồ tuần tự cho chức năng tìm hàng

 Biểu đồ tuần tự cho chức năng thêm hàng

 Biểu đồ tuần tự cho chức năng cho chức năng quản lý bán hàng

 Biểu đồ tuần tự cho chức năng cho chức năng quản lý khách hàng

22

 Biểu đồ tuần tự cho chức năng cho chức năng thông kế bán hàng

5 Wireframe

5.1 Giao diện người dùng

24

Hình 11: Wireframe trang chủ

Hình 12: Wireframe trang sản phẩm

26

Hình 13: Wireframe trang giỏ hàng

Hình 14: Wireframe trang chi tiết sản phẩm

28

4.2 Giao diện admin

Hình 15: Wireframe trang thêm sản phẩm

Hình 16: Wireframe trang thêm sản phẩm

30

Hình 17: Wireframe trang danh sách sản phẩm

4.3 Hệ thống cho quản trị viên

- Chức năng đăng nhập

- Quản lý các danh mục

- Quản lý danh mục sản phẩm: Thêm, sửa, xóa (sản phẩm)

- Quản lý tài khoản người dùng: thêm, sửa, xóa (người dùng)

- Quản lý hóa đơn: cập nhật trạng thái giao hàng

4.4 Hệ thống cho khách hàng

- Giao diện trang chủ mua sắm

- Chức năng đăng kí, đăng nhập thành viên

- Chức năng xem chi tiết sản phẩm

- Chức năng thêm sản phẩm vào giỏ hàng

- Chức năng mua hàng và thanh toán

- Chức năng gửi phản hồi

- Chức năng xuất hóa đơn

6 Phân tích và thiết kế dữ liệu

Hình 21: Bảng Bills

Hình 22: Bảng BillDetails

Hình 23: Bảng Categories

Hình 24: Bảng Colors

Hình 29: Bảng Slides

Chương III: Xây dựng và cài đặt chương trình

Hình 31: Overview sản phẩm trang chủ

Hình 32: Phân trang sản phẩm trang chủ

Hình 33: Sản phẩm theo Category

Hình 34: Trang chi tiết sản phẩm

38

Hình 35: Trang giỏ hàng

Hình 36: Trang Blog

Hình 37: Trang About

Hình 38: Trang contact

40

3 Xây dựng trang quản trị

Hình 39: Trang chủ dashboard

Hình 40: Trang danh sách người dùng

Hình 41: Trang thêm người dùng

Hình 42: Trang chỉnh sửa người dùng

42

Hình 42: Trang danh sách sản phẩm

Hình 43: Trang thêm sản phẩm

Hình 44: Trang danh sách category

Hình 45: Trang thêm category

44

Hình 46: Trang danh sách Size

Hình 47: Trang danh sách màu

Hình 48: Trang danh sách Product Detail

Hình 49: Trang thêm Product Detail

46

Hình 50: Trang danh sách slider

Bảng phân công công việc

- Thiết kế Frontend người dùng, giao diện admin.

- Code phần quản trị phía Backend

- Viết báo cáo

- Thiết kế Frontend người dùng

- Thiết kế database

- Code phần người dùng phía Backend

- Thiết kế Frontend người dùng

- Vẽ UseCase, Wireframe

- Code phần quản trị phía Backend

48