ĐỒ ÁN CƠ SỞ ĐỀ TÀI XÂY DỰNG WEBSITE BÁN HÀNG ĐIỆN TỬ BẰNG LARAVEL FRAMEWORK

Thông qua những ứng dụng này, thông tin về họ cũng như các sản phẩm, dịch vụ mới của công ty sẽ đến với những người quan tâm, đến với khách hàng của họ một cách nhanh chóng kịp thời,

ĐẠ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

Giảng Viên Hướng Dẫn: TS Dương Hữu Ái

Sinh Viên Thực Hiện: Lê Văn Truyền

18IT2

ĐẠ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

ĐỒ ÁN CƠ SỞ 2

ĐỀ TÀI

XÂY DỰNG WEBSITE BÁN HÀNG ĐIỆN TỬ

BẰNG LARAVEL FRAMEWORK

Đà Nẵng, tháng 1 năm 2020

MỞ ĐẦU

Ngày nay, ứng dụng công nghệ thông tin và việc tin học hóa được xem là một trong những yếu tố mang tính quyết định trong hoạt động của các chính phủ, tổ chức, cũng như của các công ty, nó đóng vai trò hết sức quan trọng, có thể tạo ra những bước đột phá mạnh mẽ

Việc tạo và phát triển các ứng dụng điện thoại để phục vụ cho các nhu cầu riêng củacác tổ chức, công ty thậm chí các cá nhân, ngày nay, không lấy gì làm xa lạ Với một vài thao tác đơn giản, một người bất kì có thể tải và cài đặt trên điện thoại các ứng dụng liên quan đến lĩnh vực mà anh ta quan tâm, như là: về âm nhạc, video,mạng xã hội, giáo dục, gia đình, nấu ăn ….v.v

Đối với các công ty, doanh nghiệp thì việc tạo và phát triển các website là điều rất cần thiết để phát triển Thông qua những ứng dụng này, thông tin về họ cũng như các sản phẩm, dịch vụ mới của công ty sẽ đến với những người quan tâm, đến với khách hàng của họ một cách nhanh chóng kịp thời, tránh những phiền hà mà

phương thức giao tiếp truyền thống thường gặp phải

Bắt nguồn với ý tưởng này, cùng với những gợi ý của thầy Dương Hữu Ái, em đã thực hiện đồ án:

“XÂY DỰNG ỨNG DỤNG BÁN HÀNG (ĐIỆN TỬ) –TR-TechnologY”

Chữ ký giảng viên:

TS.Dương Hữu Ái

MỤC LỤC

Trang

Chương 1 Giới thiệu 1

1.1 Tên dự án 1

1.2 Nhóm thực hiện: 1

1.3 Bối cảnh thực hiện: 1

1.4 Mục tiêu dự án 1

1.5 Phương pháp thực hiện: 1

1.6 Kế hoạch thực hiện dự án 2

Chương 2 Nghiên Cứu Thiết Kế 3

2.1 Phân Tích hệ thống 3

2.1.1 Yêu cầu 3

2.1.2 Đặt tả yêu cầu 3

2.1.3 Biểu đồ Use-Case 7

2.1.4 Biểu đồ hoạt động 7

2.1.5 Biểu đồ tuần tự 11

2.1.6 Biểu đồ lớp 12

2.2 Công cụ và ngôn ngữ lập trình được sử dụng: 12

2.2.1 Sublime Text 3: 12

2.2.2 Xampp: 12

2.2.3 PHP(Laravel Framework): 12

2.3 Phân tích, tham khảo các ứng dụng, các mô hình mẫu: 13

2.3.1 Một số ứng dụng đã có: 13

2.3.2 Đúc kết: 14

Chương 3 Xây dựng website Laravel 15

3.1 Mục tiêu và phân tích: 15

3.2 Xây dựng: 15

3.2.1 Các Controller (8 Controllers): 15

3.2.2 Database (Migrations): 15

3.2.3 Blade View: 16

3.2.4 Route (routes/web.php): 16

3.3 Sản phẩm website bán điện tử ”TR-Technology”: 17

3.3.1 Giao diện màn hình Đăng nhập – Đăng ký: 17

3.3.2 Giao diện Home: 18

3.3.3 Giao diện chi tiết mô tả giá cả của sản phẩm : 19

3.3.4 Giao diện tìm kiếm sản phẩm: 19

3.3.5 Giao diện giỏ hàng và thanh toán: 20

3.3.6 Giao diện Admin 22

KẾT LUẬN 25

1 Tổng kết 25

1.1 Kết quả đạt được 25

1.2 Ưu điểm 25

1.3 Nhược điểm 25

2 Hướng phát triển 25

Chương 1 Giới thiệu

1.1 Tên dự án

Website Bán Hàng Điện Tử Bằng Laravel Framework

1.2 Nhóm thực hiện:

 Lê Văn Truyền -18IT113

1.3 Bối cảnh thực hiện:

Cùng với sự phát triển không ngừng về kỹ thuật máy tính và mạng internet, công nghệ thông tin đang ngày càng chinh phục các đỉnh cao Mạng internet là một trong những sản phẩm có giá trị hết sức lớn lao và ngày càng trở nên là một công cụ không thể thiếu trongmọi lĩnh vực cuộc sống

Với internet, chúng ta đã thực hiện được nhiều công việc với tốc độ nhanh hơn và chi phí thấp hơn nhiều so với cách thức truyền thống Chính điều này, đã thúc đầy sự khai sinh và phát triển của thương mại điện tử và chính phủ điện từ trên khắp thể giới, làm biến đối đáng kể bộ mặt văn hóa, nâng cao chẩt lượng cuộc sống con người

Trong những năm gần đây, do CNTT đang phát triển rất mạnh nên việc ứng dụng tin học đời sống ngày càng được quan tâm hơn

Dự án em đề xuất là website về bán hàng online là bán điện tử , cung cấp cho người dùng thông tin về các loại giày cao cấp (hình ảnh , mô tả , giá cả )

1.4 Mục tiêu dự án

Tạo ra một website đơn giản , giao diện đẹp , dễ nhìn , cung cấp miễn phí thông tin vềcác dòng giày cao cấp , đẹp mắt hợp thời trang Hỗ trợ những tín đồ công nghệ có nơiđáng tin cậy để mua đồ nghệ chính hãng

1.5 Phương pháp thực hiện:

Tìm hiểu về các ứng dụng đã có sẵn (Shoppee, Lazada ) Phân tích giao diện, chức năng nổi bật Từ đó, dựa vào những chức năng đã lên kế hoạch từ đầu, đúc kết, và đưa ra các chức năng, yêu cầu hoàn chỉnh cho ứng dụng

Xây dựng cơ sở dữ liệu cho back-end và ứng dụng.

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

Tuần thứ ba

(Từ ngày24/11 đến

ngày 30/11)

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

Xây dựng giao diện admin website Xây dựng hoàn thiện các chức năng của trang admin

Thực hiện báo cáo word, slide bằng tiếng anh, kiểm thử

Chương 2 Nghiên Cứu Thiết Kế

 Hiện Thị Danh Sách Sản Phẩm.

 Xem Thông Tin Sản Phẩm.

 Đặt Sản Phẩm Vào Giỏ Hàng.

 Lập Phiếu Mua Hàng.

 Xem Thông Tin Nơi Bán Hàng.

 Tư Vấn Khách Hàng.

 Phía Quản trị:

 Đăng Nhập Vào Hệ Thống.

 Thông Tin Tài Khoản.

 Xem Sửa Xóa Sản Phẩm.

- Khách hàng chọn mục đăng ký thành viên-Form đăng ký thành viên hiển thị

- Khách hàng đăng nhập thông tin cá nhân vào form đăng ký

- Nhấn nút đăng ký

- Hệ thống báo kết quả quá trình nhập thông tin cá nhân Nếu thông tin nhập không chính xác thì thực hiện luồn rẽ nhánh A1 Nếu nhập chính xác thì thực hiện bước đăng nhập vào ứng dụng.

- Hệ thống cập nhật thông tin của khách hàng vào danh sách thành viên

- UC kết thúc

d) Hậu điều kiện: khách hàng trở thành thành viên của hệ thống

e) Luồng nhánh A1:

- Thông tin nhập không hợp lệ

- Hệ thống báo việc nhập dữ liệu không hợp lệ

- Thành viên nhập lại thông tin

 Đăng nhập:

a) Tác nhân: Khách hàng

b) Mô tả: UC cho phép thành viên đăng nhập vào hệ thống

c) Tiền điều kiện: thành viên chưa đăng vào hệ thống

d) Luồng sự kiện chính:

- Thành viên chọn chức năng đăng nhập

- Form đăng nhập hiển thị

- Nhập tên, mật khẩu vào form đăng nhập

- Hệ thống kiểm tra tên, mật khẩu của thành viên

- Nếu việc đăng nhập thành công thì thành viên có thể sử dụng các chức năng

mà ứng dụng có Nếu thành viên nhập sai tên, mật khẩu thì chuyển sang luồng rẽ nhánh A1

- UC kết thúc

d) Luồng rẽ nhánh A1:

- Thành viên đăng nhập không thành công

- Hệ thống thông báo quá trình đăng nhập không thành công

- Chọn: đăng ký hay đăng nhập lại.

- Hệ thống yêu cầu thành viên nhập lại tên và mật khẩu

- Nếu khách hàng đồng ý thì quay về bước 2 của luồng sự kiện chính, nếu không đồng ý thì UC kết thúc.

Hậu điều kiện:

- Thành viên đã đăng nhập thành công và có thể sử dụng các chức năng mà ứng dụng có

 Xem thông tin sản phẩm.

a Tác nhân: người quản lý, khách hàng

b Mô tả: cho phép người quản lý, khách hàng xem thông tin về các sản phẩm có

trong cửa hàng

c Luồng sự kiện chính:

- Người quản lý, khách hàng chọn sản phẩm cần xem

- Form xem thông tin sản phẩm xuất hiện, hệ thống hiển thị thông tin về sản phẩm đã chọn

- Người quản lý, khách hàng xem thông tin chi tiết về sản phẩm được hiển thị

- UC kết thúc

 Thêm vào giỏ hàng

a Tác nhân: khách hàng

b Mô tả: UC cho phép khách hàng đưa sản phẩm đã chọn vào giỏ hàng

c Tiền điều kiện: sản phẩm đã được chọn

d Luồng sự kiện chính:

- Chọn chức năng thêm vào giỏ hàng để đưa sản phẩm đã chọn vào lưu trữ trong giỏ hàng Nếu chưa chọn sản phẩm mà nhấn nút thêm vào giỏ hàng thì thực hiện luồng rẽ nhánh A1

- Hệ thống hiển thị thông tin sản phẩm đưa vào giỏ hàng

- UC kết thúc

f Luồng rẽ nhánh A1: Chưa chọn sản phẩm cần mua

- Hệ thống thông báo sản phẩm chưa được chọn

- Hiển thị sản phẩm đểkhách hàng chọn

- Quay lại bước 1 của luồng sự kiện chính

 Tìm kiến sản phẩm

a Tác nhân: người quản lý

b Mô tả: cho phép tìm kiếm các sản phẩm

c Luồng sự kiện:

- Người quản lý kích vào mục tìm kiếm sản phẩm

- Hệ thống hiển thị form tìm kiếm: tìm kiếm theo tên, tìm kiếm theo nhà cung cấp, tìm theo mã sản phẩm, tìm theo giá

- Người sử dụng nhập thông tin cần thiết vào form tìm kiếm

- Nhấn nút tìm kiếm

- Hệ thống báo kết quả tìm kiếm

- Kết thúc UC

 Xem thông tin liên hệ

a Tác nhân : thành viên của hệ thống

b Mô tả: UC cho phép thành viên xem thông tin, liên hệ với người bán

c Tiền điều kiện : thành viên phải đăng nhập vào hệ thống

d Luồng sự kiện chính:

- Thành viên chọn chức năng gọi, gửi mail

- Nhấn nút chọn gọi hoặc gửi mail

- Thực hiện chức năng

- UC kết thúc

 Sửa thông tin sản phẩm

a) Tác nhân : người quản lý của hệ thống

b) Mô tả: UC cho phép người quản lý thay đổi các thông tin sản phẩm

c) Tiền điều kiện : người quản lý phải đăng nhập vào hệ thống

d) Luồng sự kiện chính:

- Người quản lý chọn chức năng sửa thông tin sản phẩm

- Hệ thống hiển thị form sửa thông tin với các thông tin cũ của sản phẩm hiện tại

- Người quản lý nhập các thông tin mới

- Nhấn nút lưu thông tin

- Nếu việc cập nhật thành công thì thực hiện bước 6 Nếu sai thì thực hiện luồng rẽ nhánh A1

- Lưu thông tin

- UC kết thúc

e) Luồng sự kiện rẽ nhánh:

- thông tin nhập không hợp lệ

- Hệ thống báo việc nhập dữ liệu không hợp lệ

- Người quản lý nhập lại thông tin

- Quay lại bước 4 của luồng sự kiện chính

2.1.3 Biểu đồ Use-Case

 Biểu đồ use-case tổng quát

Hình 2.1 Biểu đồ use-case tổng quát

2.1.4 Biểu đồ hoạt động

 Đăng ký

Hình 2.2 Biểu đồ hoạt động đăng ký

 Đăng nhập

Hình 2.3 Biểu đồ hoạt động đăng nhập

 Xem, xóa giỏ hàng

Hình 2.4 Biểu đồ hoạt động xem, xóa giỏ

 Xem sản phẩm

Hình 2.5 Biểu đồ hoạt động xem sản phẩm

 Tìm kiếm sản phẩm

Hình 2.6 Biểu đồ hoạt động tìm kiếm

 Sửa sản phẩm

Hình 2.7 Biểu đồ hoạt đống sửa sản phẩm 1

 Xóa sản phẩm

Hình 2.8 Biểu đồ hoạt động xóa sản phẩm

2.1.5 Biểu đồ tuần tự

 Đăng ký

Hình 2.9 Biểu đồ tuần tự đăng ký 1

 Đăng nhập

Hình 2.10 Biểu đồ tuần tự đăng nhập

2.1.6 Biểu đồ lớp

Hình 2.11 Biểu đồ lớp

2.2 Công cụ và ngôn ngữ lập trình được sử dụng:

2.2.1 Sublime Text 3:

Sublime Text 3 (ST3) là phiên bản mới nhất của chương trình soạn thảo văn bản được

sử dụng nhiều nhất bởi web developers, coders, và programmers Nó sẵn có cho Mac, Windows, Linux và cho phép tải về và sử dụng miễn phí

2.2.2 Xampp:

Xampp là chương trình tạo máy chủ Web (Web Server) được tích hợp sẵn Apache,

PHP, MySQL, FTP Server, Mail Server và các công cụ như phpMyAdmin Không như

Appserv, Xampp có chương trình quản lý khá tiện lợi, cho phép chủ động bật tắt hoặc

khởi động lại các dịch vụ máy chủ bất kỳ lúc nào

2.2.3 PHP(Laravel Framework):

PHP là ngôn ngữ lập trình web được sử dụng rộng rãi nhất Vớisự phát triển của PHP, nhiều PHP Framework đã xuất hiện nhưng chỉ có một vài trong sốchúng thực sự sử dụng toàn bộ tiềm năng của ngôn ngữ PHP

PHP Framework là một tập hợp các class PHP giúp bạn xây dựng ứngdụng web một cách dễ dàng

Laravel là một trong những PHP Framework phổ biến nhất trên thế giới được sử dụng để xây dựng ứng dụng web từ các dự án nhỏ đến lớn

Laravel là sự lựa chọn của nhiều lập trình viên PHP chuyên nghiệp vì hiệu suất, tính năng và khả năng mở rộng của nó

Laravel tuân theo Mô hình MVC (Model View Controller) giúp dễ dàng học và nhanh

chóng tạo nguyên mẫu cho các ứng dụng web

2.3 Phân tích, tham khảo các ứng dụng, các mô hình mẫu:

 Nổi bật:

 Lọc danh sách tìm kiếm đa dạng

 Có nhiều khuyến mãi, chương trình hấp dẫn và đa dạng

 Phải đơn giản, ưa nhìn, bắt mắt, dễ sử dụng

 Không quá nhiều thông tin trong một layout

 Chức năng cần có:

 Xem danh sách loại hàng

 Xem danh sách loại được tìm kiếm

 Tim kiếm loại hàng dễ dàng theo chữ cái

 Xem chi tiết từng sản phẩm (mô tả, giá thành, tên)

 Quản trị viên có xem, thêm, sửa đổi, xóa sản phẩm (Admin ).

 Giao diện thêm sản phẩm dễ hiểu, dễ sử dụng

 Chức năng riêng dự kiến thực hiện:

 Chức năng liên hệ giữa người dùng và admin

Chương 3 Xây dựng website Laravel

3.1 Mục tiêu và phân tích:

- Xây dựng sản phẩm website hoàn chỉnh cho người dùng

- Sản phẩm chỉ dành cho người dùng không dành cho quản trị viên thực hiện các thao tác quản lí hệ thống

- Ứng dụng có nhiều chức năng đa dạng dễ sử dụng

- Quản trị viên có thể dùng ứng dụng để đăng bài hoặc sửa xóa bài viết do chính mình đăng lên

Migration giống như một hệ thống quản lý phiên bản giống như Git nhưng dành cho

cơ sở dữ liệu của bạn Migration cho phép bạn định nghĩa các bảng trong CSDL, định nghĩa nội dung các bảng cũng như cập nhật thay đổi các bảng đó hoàn toàn bằng PHP

Hình 3.3 web.php

3.3 Sản phẩm website bán điện tử ”TR-Technology”:

3.3.1 Giao diện màn hình Đăng nhập – Đăng ký:

- Ở giao diện đăng nhập, người dùng chỉ cần nhập vào email và mật khẩu của tài khoản của mình nếu họ đã có tài khoản, hệ thống sẽ kiểm tra xem tài khoản và mậtkhẩu có hợp lệ hay không, nếu đã hợp lệ thì sẽ chuyển vào màn hình chính, nếu thất bại thì sẽ in ra thông báo

- Trong trường hợp người dùng chưa có tài khoản trên hệ thống, thì chỉ cần nhấp vào nút “Đăng Ký” thì sẽ được chuyển đến giao diện đăng ký tài khoản Tại đây người dùng chỉ cần nhập điền đầy đủ thông tin cần thiết và chọn đăng ký Hệ thống sẽ thông báo thành công hay không, nếu thành công thì sẽ được chuyển đến giao diện đăng nhập để đăng nhập lại, thất bại thì hệ thống sẽ đưa ra thông báo

Hình 3.4 Giao diện đăng nhập ,đăng ký

3.3.2 Giao diện Home:

Hình 3.5 Giao diện màn hình chính

- Giao diện Home hiện các sản phẩn nhờ đổ dữ liệu ra từ Database

- Phía trên cùng là 1 thanh có chưa 5 nút là yêu thích giỏ hàng , thanh toán và đăngxuất

3.3.3 Giao diện chi tiết mô tả giá cả của sản phẩm :

Hình 3.6 Giao diện chi tiết mô tả của từng sản phẩm

- Giao diện mô tả chứa thông tin chi tiết về tên sản phẩm, giá cả và mô tả

- Ở dưới cùng ta có thể thấy phần chọn số lượng và thêm vào giỏ hàng nếu thíchhoặc hủy nếu không thích

3.3.4 Giao diện tìm kiếm sản phẩm:

Hình 3.7 Giao diện tìm kiếm sản phẩm 1

- Người dùng nhấp vào icon tìm kiếm ở thanh công cụ và tiến hành nhập vào gợi ýtìm kiếm, hệ thống sẽ tự động nhận diện và hiển thị kết quả

3.3.5 Giao diện giỏ hàng và thanh toán:

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

- Ở giao diện này người dùng có thể xem thông tin chi tiết giỏ hàng của mình

Hình 3.9 Giao diện điền thông tin gửi hàng

- Ở giao diện này người dùng điền thông tin gửi hàng của mình vào và nhấn nút gửi

Hình 3.10 Giao diện đặt hàng

- Ở giao diện này người dùng có thể xem lại giỏ hàng của mình nếu không muốnmua thì có thể hủy và ngược lại

Hình 3.11 Giao diện sau khi đặt hàng

- Ở đây chúng ta có thể cập nhật số lượng hoặc hủy ra khỏi giỏ hàng

3.3.6 Giao diện Admin

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

- Ở đây là trang đăng nhập admin bằng gmail và mật khẩu

Hình 3.13 Giao diện admin

- Đây là trang giao diện chính của Admin dùng để quản lý các sản phẩm thươnghiệu và đơn hàng

Hình 3.14 Giao diện liệt kê sản phẩm

- Ở đây admin dùng để quản lý các sản phẩm có thể thêm sửa xóa các sảm phẩm

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

- Ở đây là trang quản lý các đơn hàng đã đặt từ khách hàng

Hình 3.16 Giao diện quản lý chi tiết đơn hàng

- Ở đây admin có thể xem quản lý chi tiết các đơn hàng