Đồ án môn học lập trình web xây dựng website bán laptop

Hiểu được các vấn đề đó cũng như mong muốn đưa các sản phẩm laptop của nước ta phát triển hơn, muốn giới thiệu các s n ph m laptop n vả ẩ đế ới nhiều người hơn qua mạng internet r ng lộ

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT VIỆN KỸ THUẬT – CÔNG NGHỆ

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

GVHD: NGUY N HỄ ỮU VĨNH

SVTH: MAI VĂN CHÁNH MSSV: 1824801030028

L ỚP: D18PM04

i

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT VIỆN KỸ THUẬT – CÔNG NGHỆ

ĐỒ ÁN MÔN HỌC LẬP TRÌNH WEB

GVHD: NGUY N HỄ ỮU VĨNH

SVTH: MAI VĂN CHÁNH MSSV: 1824801030028

L ỚP: D18PM04

TRƯỜNG ĐẠI HỌC THỦ DẦU MỘT VIỆN KỸ THUẬT – CÔNG NGH Ệ

NHẬN XÉT VÀ CH ẤM ĐIỂM CỦ A GI NG VIÊN Ả

Họ và tên giảng viên: Nguyễn Hữu Vĩnh

Tên đề tài: XÂY DỰNG WEBSITE BÁN LAPTOP Nội dung nh n xét: ậ

Điểm:

Bằng s : ố Bằng ch : ữ

GIẢNG VIÊN CHẤM

(Ký, ghi rõ h ọ tên)

Nguyễn Hữu Vĩnh

PHIẾU ĐÁNH GIÁ PROJECT

(Đánh giá quá trình thực hiện, báo cáo văn bản và sản phẩm)

Khá 75%

Trung bình 50%

Kém 0%

ý tưởng mang tính mới

Tìm ki m và ế đưa ra được ý tưở ng khá t t ố

Chọn ý tưởng trong số được

đề ngh ị

Không quan tâm l a ch ự ọn

Khá h p lý, ợ điều ch nh chút ỉ

ít theo góp ý

Chưa hợp lý, có điều ch nh theo ỉ góp ý

Không h p lý ợ

và không điều chỉnh theo góp ý

Chuẩn bị được

đa số điều kiện cho vi c th ệ ực hiện, có th ể khởi động và

bổ sung sau

Chuẩn bị được một số điều kiện cho vi c th ệ ực hiện nhưng cần

bổ sung thêm mới có thể khởi động

Không chuẩn

bị được điều kiện nào

Thực hiện khá đúng phương pháp, sai sót nhỏ và có sửa chữa

Thực hiện tương đối đúng phương pháp, sai sót quan trọng và có sửa chữa

Thực hiện không đúng phương pháp, sai sót không sửa chữa

10

Triển khai đúng kế hoạch

Triển khai khá đúng kế hoạch,

có ch m tr ậ ễ nhưng không gây ảnh hưởng

Triển khai tương đối đúng kế hoạ ch, có ch m ậ trễ gây ảnh hưởng nhưng khắc ph ục đượ c

Triển khai chậm trễ, gây ảnh hưởng không khắ c ph c ụ được Mức độ

- Phát bi u bài toán, phân tích và thi t k (5) ể ế ế

- Xây d ng s n ph m (lâp trình, giao di n, kiự ả ẩ ệ ểm thử) (10)

MỤC LỤC

Contents

LỜI NÓI ĐẦU ix

CHƯƠNG 1 TỔNG QUAN VỀ ĐỀ TÀI 1

Tên đề tài: 1

Mục tiêu của đề tài: 1

Ý nghĩa của đề tài: 1

Đối tư ng và phạm vi của đề ợ tài: 1

Đối tượng c ủa đề tài: 1

Ph ạm vi của đề tài: 1

CHƯƠNG 2 KHẢO SÁT VÀ XÁC ĐỊNH YÊU CẦU 2

2.1 Phân tích yêu cầu đề tài 2

2.1.1 Tên đề 2 tài 2.1.2 Chức năng 2

2.1.3 Yêu cầu đặt ra 2

2.2 Phân tích và thi t k h ế ế ệ thống 3

2.2.1 Kh o sát hi n tr ng và xây d ng hả ệ ạ ự ệ thố ng 3

2.2.2 Phân tích h ệ thố ng 3

2.3 Sơ đồ phân cấp chức năng của khách hàng 4

2.4 Sơ đồ phân cấp chức năng cùa admin 7

CHƯƠNG 3 PHÂN TÍCH THIẾT KẾ VỚI UML 7

3.1 Biểu đồ Usecase 7

3.1.1 Biểu đồ Usecase m ức tổ ng quát 8

3.1.2 Đặt tả Usecase 8

3.2 Biểu đồ tuầ ựn t (Sequence Diagram) 12

3.2.1 Đăng ký 12

3.2.2 Đăng nhập 12

3.2.3 Thanh toán 13

CHƯƠNG 4 THIẾT KẾ CƠ SỞ DỮ LIỆU 14

4.1 Các b ng CSDL 14ả

4.1.3 B ng Khách Hàng 15ả

4.1.4 B ng Lo i LapTop 15ả ạ

vii

4.1.5 B ng nhà s n xu t 15ả ả ấ

4.1.6 Bảng đơn đặt hàng 15

4.1.7 Bảng đơn chi tiết 16

CHƯƠNG 5 GIAO DIỆN WEBSITE 17

5.1 Một số giao diện người dùng 17

5.1.1 Giao di n trang ch 17ệ ủ 5.1.2 Giao di n trang ệ đăng ký 17

5.1.3 Giao diện trang đăng nhập 18

5.2 Một số giao di n trang Admin 18ệ 5.2.1 Giao di n trang qu n lý thêm thành viên qu n tr 18ệ ả ả ị 5.2.2 Giao di n trang trang quệ ản lý đơn hàng 19

5.2.1 Giao di n trang thêm nhà s n xu t 19ệ ả ấ 5.2.2 Giao di ện Trang Người dùng 20

Hình 20 Giao di ện Trang Người dùng 20

KẾT LUẬN 21

DANH M C HÌNH Ụ

Hình 1: Sơ đồ thưc hiệ n chung cho website laptop 4

Hình 2 : Sơ đồ ch ức năng khách hàng .4

Hình 3: Sơ đồ quản lý khách hàng 7

Hình 4: Sơ đồ quản lý sản ph ẩm 7

Hình 5: Usecase tổng quát 8

Hình 6 Sơ đồ tuần tự đăng ký 12

Hình 7 Sơ đồ tuần tự đăng nhập 12

Hình 8 Sơ đồ tuần t thanh toán ự 13

Hình 9 CSDL gi hàng ỏ 14

Hình 10 CSDL s n ph ả ẩm 14

Hình 11 CSDL tài kho n ả 15

Hình 12 CSDL Lo i LapTop ạ 15

Hình 13: CSDL nhà s n xu t ả ấ 15

Hình 14:CSDL đơn đặt hàng 16

Hình 15:CSDL đơn chi tiết 16

Hình 16 Giao diện trang đăng nhập 18

Hình 17 Giao di n trang th ng kê ệ ố 18

Hình 18: Giao di n qu ệ ản lý đơn đặt hàng 19

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

Hình 20 Giao diện Trang Người dùng 20

ix

LLLLLỜI NÓI ĐẦU ỜI NÓI ĐẦU ỜI NÓI ĐẦU

Hiện nay, trên th gi i công ngh ế ớ ệ thông tin và thương mại điện t ử đang phát triển rất m nh m K thu t s giúp chúng ta ti t kiạ ẽ ỹ ậ ố ế ệm đáng kể các chi phí nh chi phí v n ờ ậchuyển trung gian, chi phí giao dịch và đặc biệt là giúp ti t ki m thế ệ ời gian để con người đầu tư vào các hoạ ộng khác Hơn nữa, thương mạt đ i điện tử còn giúp con người có thể tìm ki m tế ự động theo nhi u mề ục đích khác nhau, tự động cung c p thông tin theo nhu ấcầu và s thích cở ủa con người Giờ đây, con người có th ng i tể ồ ại nhà để mua s m mắ ọi thứ theo ý muốn và các website bán hàng trên m ng sạ ẽ giúp ta làm được điều đó

Chính vì v y, các công ngh mã ngu n mậ ệ ồ ở trở nên được chú ý vì các tính năng của nó Giá thành r ẻ và được hỗ trợ rất nhiều trên m ng s giúp ta nhanh chóng Thi t k ạ ẽ ế ếcác website bán hàng thân thi n và d s d ng vệ ễ ử ụ ới người dùng Đặc biệt thương mại điện tử đã và đang phát triển v i tớ ốc độ chóng mặt và được dự đoán còn rất nhiều tiềm năng phát triển trong tương lai Đặc biệt là khi dịch Covid 19 bùng nổ vào cuối năm

2019 v a qua, mừ ọi người điều h n chạ ế ra đường, t tụ ập nơi đông người, các hoạt động sản xuất, trao đổi mua bán tr c tiự ếp điều b ị đình trệ, không giao dịch được Đây cũng là lúc vi c mua bán tr c tuyệ ự ến có cơ hội phát tri n m nh mể ạ ẽ hơn, đặc bi t là các thi t b ệ ế ịhọc t p và làm viậ ệc văn phòng.Trong những năm gần đây, công nghệ ngày càng phát triển nhu cầu sử ụ d ng các thiết bị để ph c vụ ụ đờ ối s ng , gi i trí và công vi c ngày càng ả ệnhiều Laptop công cụ tuyệt vời hàng đầu để làm việc, học t p và giậ ải trí

Sự hi n di n cệ ệ ủa chúng đã khiến cuộc sống của chúng ta dễ dàng hơn Mọi thắc mắc, câu hỏi c n giầ ải đáp chúng ta đều có thể tìm thấy thông qua chiếc máy tính xách tay Điều này còn quan trọng hơn đối với các bạn sinh viên trong quá trình học tập và tìm hiểu các tài li u c n thiệ ầ ết Mọi câu hỏi, băn khoăn thay vì phải tìm tòi lụng tung

đống tài liệu l n xộn, nay chúng ta ch cần gõ vài từ trên chiếc máy tính xách tay của ộ ỉmình, từ đây bạn s ẽ có được câu trả ờ l i mà mình muốn

Hiểu được các vấn đề đó cũng như mong muốn đưa các sản phẩm laptop của nước ta phát triển hơn, muốn giới thiệu các s n ph m laptop n vả ẩ đế ới nhiều người hơn qua mạng internet r ng lộ ớn, cũng là xây dựng nơi mọi người, m i khách hàng có thọ ể truy cập xem, tìm hiểu các loại trà và có thể mua, s d ng thuử ụ ận tiện nh t Chính vì v y ấ ậ

trong em đã chọn đề tài về: “Thiết kế website bán laptop” để thực hiện

CHƯƠNG 1 TỔNG QUAN V Ề ĐỀ TÀI

Tên đề tài:

Mục tiêu của đề tài:

Phân tích và thiết kế website BÁN LAPTOP Phân tích các quy trình và nghiệp v c a khách hàng khi mua, tìm xem các web laptop ụ ủ trên internet Trên cơ sở

đó thiết kế website phục vụ cho quá trình tìm kiếm thông tin các sản phẩm laptop của khách hàng, xây d ng website c i thi n tr i nghi m mua hàng cự ả ệ ả ệ ủa khách hàng và đem đến cho khách hàng một trải nghiệm mua hàng tốt nhất khi mua online laptop trên website của shop Ngoài ra web còn cung c p chấ ức năng “ĐÀM ĐẠO” để ọi người, mmọi khách hàng có thể trao đổi thông tin, tr i nghiả ệm, hiểu biế ề s n ph m c a ct v ả ẩ ủ ửa hàng

Ý nghĩa của đề tài:

Đưa các loại laptop đến với nhiều người dùng, quảng bá sản phẩm tốt hơn trên mạng internet r ng lộ ớn

Xây dựng niềm tin, m i quan hố ệ ớ v i khách hàng T o dạ ựng nơi để tìm hi u, trao ểđổi trực tuyến 24/24 với khách hàng

Đối tượng và phạm vi của đề tài:

Đối tượng của đề tài:

Đối tư ng nghiên cứu c a đềợ ủ tài chủ y u là các lo i sản ph m về laptop, các ế ạ ẩloại website đem lại trải nghiệm của người dùng trên lĩnh vực thương mại điện tử Ngoài ra đề tài tìm hiểu các công nghệ thi t kếế mang l i tr i nghiệm v giao diện(UI) ạ ả ề

và mang l i tr i nghiạ ả ệm người dùng(UX)

Phạm vi của đề tài:

Không gian: đề tài thi t k website ế ế BÁN LAPTOP được xây dựng d a trên kh o ự ảsát các cửa hàng ,cơ sở bán laptop ở tỉnh Bình Dương Và đề tài cũng tham khảo các trang bán lẻ trực tuyến về trà trên internet

2

CHƯƠNG 2. KHẢO SÁT VÀ XÁC ĐỊNH YÊU CẦU

2.1 Phân tích yêu cầu đề tài

▪ Cho phép c p nh t hàng vào CSDL ậ ậ

▪ Hiển th danh sách các mị ặt hàng theo từng loại

▪ Hiển th ị hàng hoá khách hàng đã chọn mua

▪ Hiển th thông tin khách hàng ị

o Chức năng cập nhật, sửa, xoá các mặt hàng, loại hàng, nhà s n xu t, ả ấ

o Tiếp nh n kiậ ểm tra đơn đặt hàng của khách hàng Hiển th ị đơn đặt hàng

• Ngoài các chức năng trên thì trang Web phải được thi t k sao cho d hi u, ế ế ễ ểgiao di n mang tính dệ ễ dùng đẹp m t và làm sao cho khách hàng thắ ấy được thông tin c n tìm, cung c p các thông tin qu ng cáo h p d n, các tin tầ ấ ả ấ ẫ ức khuyến mãi để thu hút khách hàng Điều quan trọng là phải đảm bảo an toàn tuyệt đối thông tin khách hàng trong quá trình đặt mua qua mạng Đồng thời trang Web phải luôn đổi m i, hớ ấp d n ẫ

2.2 Phân tích và thiết kế h ệ thống

2.2.1 Khảo sát hi n tr ng và xây dệ ạ ựng hệ thống

– Sau khi khảo sát em đã nắm bắt được các thông tin d u : ữ liệ

▪ Quản lý khách hàng : Mỗi khách hàng được qu n lý các thông tin ảsau: mã khách hàng, h ọ tên, địa ch , s ỉ ố điện tho ại, email, ngày sinh, giới tính và m t khậ ẩu đăng nhập tài kho n ả

▪ Quản lý s n phả ẩm: Mã laptop, tên laptop, đơn giá, số lượng, hình

– Sau khi kh o sát hi n tr ng c a hả ệ ạ ủ ệ thống và xây d ng hự ệ thống thì em

đã đưa ra các tệp CSDL của “Xây dựng website bán laptop”

– Qua quá trình kh o sát, phân tích th c tr ng và xây dả ự ạ ựng hướng phát triển cho hệ thống mới em đa xây dựng c u trúc c a h thấ ủ ệ ống “Xây dựng Website laptop”

– Xây d ng biự ểu đồ phân c p chấ ức năng Biểu đồ luồng dữ liệu: Ta xây dựng biểu đồ luồng dũ liệu như sau:

4

Hình 1: Sơ đồ thưc hiện chung cho website laptop

2.3 Sơ đồ phân cấp chức năng của khách hàng

Hình 2 : Sơ đồ chức năng khách hàng

– Chức năng xem thông tin sản phẩm

▪ Cho phép xem thông tin của sản pẩm đơn giá và nguồn cung c p ấ

• Module thêm mặt hàng vào gi hàng ỏ

• Module chỉnh sữa và loại bỏ ặ m t hàng trong gi hàng ỏ

• Module hiển th danh mị ục mặt hàng hi n có trong gi hàng ệ ỏ

▪ Đầu ra (Output) : Danh mục mặt hàng định đặt mua

o Module nhập các thao tác thông tin c a khách hàng ủ

o Module xác nhận thông tin vừa nhập

o Module kiểm tra sác nhận đăng ký tài kho n ả

o Module lưu thông tin khách hàng vừa đăng ký vào CSDL Đầu ra : Đăng nhập vào tài khoản người dùng

o Module tìm kiếm trong CSDL

o Module hiển th kị ết quả tìm kiếm

• Đầu ra : Kết quả tìm kiếm

– Chức năng thanh toán

▪ Sau khi khách hàng ch n nh ng s n ph m cọ ữ ả ẩ ần mua đặt vào gi hàng, ỏkhách hàng có th t mua hàng chính th c thông qua Website ể đặ ứ

▪ Đầu vào (Input) :

▪ Các quá trình thực hiện :

• Module hi n th ể ị đầy đủ thông tin liên quan đến sản ph m khách ẩhàng đã chọn

2.4 Sơ đồ phân cấp chức năng cùa admin

Hình 3: Sơ đồ quản lý khách hàng

Hình 4: Sơ đồ quản lý s n ph m ả ẩ

đố ới v i website

Bảng 0.1 Danh sách các Actor– Danh sách các Usecase

1 Đăng nhập UC này mô tả chức năng đăng nhập vào h ệ

thống của người dùng ho c Admin ặ

thành viên

website của người dùng

5 Quản lý thông

tin

UC này mô t ả chức năng quản lý các thông tin như quản lý người dùng, sản phẩm, nhà cung cấp c a Admin ủ

- Đối tư ng s d ng (actor) bao gợ ử ụ ồm: khách hàng, admin

- Use case này mô t ả các bước đăng nhập c a các actor vào h ủ ệ thống

- Các bước th c hiự ện:

▪ Hệ thống yêu cầu actor cung cấp thông tin đăng nhập gồm: tên đăng nhập và m t khẩu ậ

9

▪ Hệ thống check lại thông tin đăng nhập và thông báo thành công/thất b i cho actor Nạ ếu đăng nhập thành công h ệ thống dựa trên thông tin đăng nhập sẽ đồng th i phân quy n tùy ờ ềtheo lo i nhân viên Nạ ếu đăng nhập th t b i, h ấ ạ ệ thống s hiẽ ện thông báo cho người dùng và yêu cầu đăng nhậ ại p l

➢ Usecase đăng ký

- Actor Người dùng là người sử dụng Use Case này Use Case này được sử dụng để thực hiện chức năng đăng kí tài khoản của người dùng Sau khi đăng kí tài khoản, lúc đó Người dùng mới có thể đăng nhập vào website và thực hiện được các chức năng như là: Thanh toán tiền

- Dòng sự ki n ệ

▪ Dòng sự ki n chính ệ1) Người dùng ch n chọ ức năng đăng ký t trang ch cừ ủ ủa website

2) Trang chủ s mẽ ở đến trang đăng ký

3) Người dùng nhập đầy đủ thông tin tài kho n và thông ảtin cá nhân

4) Hệ thống xác nhận thông tin và lưu lại

5) Hi ển thị thông báo

6) Kết thúc Use Case

▪ Các dòng s ự kiện khác 1) Người dùng hủy yêu cầu đăng ký

2) Hệ thống b ỏ qua trang đăng kí, trở ạ l i trang hi n t ệ ại.3) Kết thúc Use Case

- Trạng thái hệ thống sau khi thực hiện Use Case

▪ Trường hợp đăng ký thành công: hệ thống hiển thị trang đăng nhập để người dùng có thể đăng nhập vào website

▪ Trường hợp đăng k thất bại: Hệ thống đưa ra thông báo ý đăng ký không thành công

➢ Usecase chi tiết sản ph m ẩ

- Use Case này được sử dụng để thực hi n chệ ức năng xem thông tin sản ph m c a ẩ ủ người dùng Sau khi truy cập vào website người dung

có thể xem thông tin các s n ph m có t i website ả ẩ ạ

- Dòng sự ki n ệ

▪ Dòng sự ki n chính ệ1) Người dùng truy c p vào website và nh n chậ ấ ọn s n ảphẩm

2) Trang chủ s mẽ ở đến trang chi ti t s n ph m ế ả ẩ3) Người dùng xem thông tin s n ph m ả ẩ

4) Kết thúc Use Case

➢ Usecase đặt mua

- Use Case này được sử dụng để thực hi n chệ ức năng đặt mua sản phẩm của người dùng Sau khi truy c p vào website và xem thông ậtin s n phả ẩm, người dùng có thể đặt mua s n ph m mà mình cả ẩ ảm thấy vừa ý

- Dòng sự ki n ệ

▪ Dòng sự ki n chính ệ1) Người dùng ch n chọ ức năng xem thông tin chi tiết của sản ph m ẩ

2) Trang ch s mủ ẽ ở đến trang thông tin chi ti t c a sế ủ ản phẩm

3) Người dùng xem và nhấn vào nút “Cho vào gi ỏhàng”

4) Hệ thống xác nhận thông tin và lư ạu l i

5) Hiển thị trang thông tin s n ph m ả ẩ6) Kết thúc Use Case

➢ Usecase thanh toán

- Use Case này được sử dụng để thực hi n chệ ức năng thanh toán tiền cho s n phả ẩm đã đặt mua Sau khi đã đặt mua s n ph m, gi hàng ả ẩ ỏcủa người dùng đã tồn tại một hoặc nhiều sản phẩm, nếu muốn có

2) Trang ch s m n trang gi hàng củ ẽ ở đế ỏ ủa người dùng 3) Người dùng xem và nhấn vào nút “Thanh toán” 4) Hệ thống xác nh n thông tin và quay tr l i trang ậ ở ạ chủ 5) Kết thúc Use Case

3) Hệ thống xác nh n thông tin và thậ ực hiện tìm ki m ế4) Hệ thống tr v thông tin tìm ki m ả ề ế

5) Kết thúc Use Case

➢ Usecase Quản lý

- Use Case này được sử dụng để thực hi n chệ ức năng quản lý thông tin của Admin Sau khi đăng nhập vào hệ thống, Admin có th ểthêm, c p nhậ ật thông tin, xóa các đối tượng có trong h ệ thống như: sản phẩm, nhà s n xuả ất …

- Dòng sự ki n ệ

▪ Dòng sự ki n chính ệ1) Admin ch n chọ ức năng quản lý thông tin t trang ch ừ ủquản trị

2) Hệ thống hi n thể ị trang qu n lý thông tin ả3) Admin nhập đầy đủ thông tin của các đối tượng