Xây dựng website bán linh kiện máy tính

+ Ở trang quản lý sản phẩm, các tài khoản có quyền vào được phép thêm, xem ,xóa, sửa sản phẩm.. + Ở trang quản lý chủng loại sản phẩm, các tài khoản có quyền vào được phépthêm, xem , xóa

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG ĐẠI HỌC NGUYỄN TẤT THÀNH

KHOA CÔNG NGHỆ THÔNG TIN

TIỂU LUẬN MÔN HỌC

THIẾT KẾ VÀ XÂY DỰNG WEBSITE BÁN LINH

KIỆN MÁY TÍNH

Giảng viên hướng dẫn: ThS VƯƠNG XUÂN CHÍ

Sinh viên thực hiện: NGUYỄN HOÀNG TRÍ

LỜI CẢM ƠN

Qua một thời gian nghiên cứu, phân công công việc và tiến hành thực hiện đếnnay, đề tài “xây dựng website bán linh kiện máy tính” đã hoàn thành Chúng em xinchân thành cảm các thầy cô đã trang bị kiến thức quý báu cho chúng em trong suốtquá trình học Đặc biệt là các thầy các cô trong khoa Công nghệ thông tin đã tận tìnhgiảng dạy, chỉ bảo, trang bị cho chúng em những kiến thức cần thiết nhất trong suốtquá trình học tập và nghiên cứu tại khoa, đã tạo mọi điều kiện thuận lợi giúp chúng

em thực hiện đề tài lớn này

Em xin chân thành cảm ơn thầy giảng viên hướng dẫn môn học – thầy VươngXuân Chí trong khoảng thời gian học kỳ này đã cố gắng nhắc nhở, chỉ dạy, hướng dẫn

về mẫu chuẩn báo cáo và bài tập đồ án

Trong khoảng gian thực hiện đồ án, những điều sai và thiếu kinh nghiệm vìkiến thức còn rất hạn hẹp Cho nên bài tập đồ án sẽ không tránh khỏi những sơ sótđáng tiếc Em xin cảm ơn thầy đã đọc hết bài tập đồ án của em và mong thầy góp ýnhận xét để chúng em hoàn thành đề tài này

LỜI MỞ ĐẦU

Ngày nay, công nghệ thông tin đã có những bước phát triển mạnh mẽ theo cảchiều rộng và sâu Máy tính điện tử không còn là một thứ phương tiện quý hiếm màđang ngày càng trở thành một công cụ làm việc và giải trí thông dụng của con người,không chỉ ở công sở mà còn ngay cả trong gia đình

Đứng trước vai trò của thông tin hoạt động cạnh tranh gay gắt, các tổ chức vàcác doanh nghiệp đều tìm mọi biện pháp để xây dựng hoàn thiện hệ thống thông tincủa mình nhằm tin học hóa các hoạt động tác nghiệp của đơn vị

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ệncá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ênInternet 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ầmquan 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ênmá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ấtnhiề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 theohướ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à chobạn

Để tiếp cận và góp phần đẩy mạnh sự phổ biến của thương mại điện tử ở ViệtNam, nhóm em đã quyết định thực hiện đề tài “Xây dựng Website bán linh kiện máytính”

Để đáp ứng như cầu cần thay sửa các linh kiện máy tính tốt nhất vầ ổn địnhnhất cho thị trường Việt Nam

Với sự hướng dẫn tận tình của thầy Vương Xuân Chí, nhóm em đã hoàn thành

đề tài này Tuy đã cố gắng hết mình nhưng do thời gian có hạn, năng lực bản thân cònnhiều hạn chế nên chắc rằng không tránh khỏi những thiếu sót Em rất mong nhậnđược sự thông cảm và đóng góp của quí thầy cô

Em xin chân thành cảm ơn

MỤC LỤC

THÀNH VIÊN NHÓM i

LỜI CẢM ƠN ii

LỜI MỞ ĐẦU iii

MỤC LỤC iv

DANH MỤC CÁC HÌNH ẢNH vi

DANH MỤC CÁC TỪ VIẾT TẮT vii

CHƯƠNG 1: LÝ THUYẾT VỀ WEBSITE 8

1.1 GIỚI THIỆU ASP.NET MVC 8

1.1.1 Tổng quan về asp.net mvc 8

1.1.2 Mô hình MVC 8

1.1.3 Tính năng của ASP.Net MVC 5 9

CHƯƠNG 2: THIẾT KẾ VÀ XÂY DỰNG WEBSITE BÁN LINH KIỆN MÁY TÍNH 11

2.1 PHÂN TÍCH YÊU CẦU 11

2.1.1 Mô tả dự án 11

2.1.2 Actors và Use Cases 12

2.1.3 Mô tả Actors 15

2.1.4 Mô tả Use Cases 15

2.2 THIẾT KẾ HỆ THỐNG 16

2.2.1 Kiến trúc hệ thống 16

2.2.2 Thiết kế dữ liệu 18

2.2.3 Hệ thống được xây dựng 20

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

2.3.1 Trang chủ bán hàng 22

2.3.2 Trang chi tiết sản phẩm 23

2.3.3 Trang danh sách sản phẩm 24

2.3.4 Trang đăng nhập 25

2.3.5 Trang đăng kí 26

2.3.6 Trang giỏ hàng 27

2.3.7 Trang Admin 28

2.3.8 Trang quản lý thành viên 28

2.3.9 Trang quản lý quyền 29

2.3.10 Trang quản lý phân quyền 29

2.3.12 Trang quản lý nhập hàng 30

2.3.13 Trang sản phẩm gần hết 32

2.3.15 Trang quản lý nhà sản xuất 33

2.3.16 Trang quản lý sản phẩm 35

3.3 ĐÁNH GIÁ KẾT QUẢ VÀ HƯỚNG PHÁT TRIỂN 36

TÀI LIỆU THAM KHẢO 38

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

DANH MỤC CÁC HÌNH ẢNH

Hình 1: Mô hình MVC 9

Hình 2: Biểu đồ Use case chính 13

Hình 3: Biểu đồ Use case quản lý quyền 14

Hình 4: Biểu đồ Use case quản lý tài khoản 14

Hình 5: Biểu đồ Use case tra cứu sản phẩm 14

Hình 6: Biểu đồ Use case đặt hàng 15

Hình 7: Biểu đồ Use case quản lý danh mục 15

Hình 8: Biểu đồ Use case quản lý nhập xuất 16

Hình 9: Sơ đồ màn hình 22

Hình 10: Trang chủ bán hàng 23

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

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

Hình 13: Trang đăng nhập 26

Hình 14: Trang đăng kí 27

Hình 15: Trang giỏ hàng 28

Hình 16: Trang admin 29

Hình 17: Trang quản lý thành viên 29

Hình 18: Trang quản lý quyền 30

Hình 19: Trang quản lý phân quyền 30

Hình 20: Trang quản lý đơn đặt hàng 31

Hình 21: Trang quản lý nhập hàng 31

Hình 22: Trang sản phẩm gần hết 32

Hình 23: Trang quản lý sản phẩm 33

Hình 24: Trang quản lý nhà sản xuất 34

Hình 25: Trang quản lý sản phẩm 35

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

CHƯƠNG 1: LÝ THUYẾT VỀ WEBSITE

1.1 GIỚI THIỆU ASP.NET MVC

1.1.2 Mô hình MVC

Hình 1: Mô hình MVC

Model: Các đối tượng Models là một phần của ứng dụng, các đối

tượng này thiết lập logic của phần dữ liệu của ứng dụng Thông thường,các đối tượng model lấy và lưu trạng thái của model trong CSDL

Views: Views là các thành phần dùng để hiển thị giao diện người

dùng (UI) Thông thường, view được tạo dựa vào thông tin dữ liệumodel

Controllers: Controller là các thành phần dùng để quản lý tương

tác người dùng, làm việc với model và chọn view để hiển thị giao diệnngười dùng

Luồng xử lý dữ liệu trong MVC: Khi có một yêu cầu từ phía

Client gửi đến Server, bộ phận Controller có nhiệm vụ tiếp nhận yêucầu, xử lý dữ liệu đầu vào và quyết định luồng đi tiếp theo (trả về kếtquả hay tương tác với Cơ sở dữ liệu để lấy dữ liệu) Nếu cần tương tácvới cơ sở dữ liệu, Controller sẽ gọi tới Model để lấy dữ liệu đầu ra.Model tương tác với Cơ sở dữ liệu để truy xuất dữ liệu phù hợp với yêucầu của phía Controller, sau đó Model trả dữ liệu về cho Controller xử

lý Controller sẽ gọi đến View phù hợp với yêu cầu kèm theo dữ liệucho View View có trách nhiệm hiển thị kết quả, dữ liệu đầu ra phù hợpvới yêu cầu của người dùng trên giao diện Web

1.1.3 Tính năng của ASP.Net MVC 5

Tách bạch các tác vụ của ứng dụng (logic nhập liệu, businesslogic, và logic giao diện), dễ dàng kiểm thử và mặc định áp dụnghướng phát triển Test Driven Development (TDD) Tất cả các tính năngchính của mô hình MVC được cài đặt dựa trên interface và được kiểmthử bằng cách sử dụng các đối tượng mocks, mock object là các đốitượng mô phỏng các tính năng của những đối tượng thực sự trong ứngdụng Bạn có thể kiểm thử unit-test cho ứng dụng mà không cần chạycontroller trong tiến trình ASP.NET, và điều đó giúp unit test được ápdụng nhanh chóng và tiện dụng Bạn có thể sử dụng bất kỳ nền tảngunit-testing nào tương thích với nền tảng NET

MVC là một nền tảng khả mở rộng (extensible) & khả nhúng

(pluggable) Các thành phần của ASP.NET MVC 5 được thiết kể để

chúng có thể được thay thế một cách dễ dàng hoặc dễ dàng tùy chỉnh

Bạn có thể nhúng thêm view engine, cơ chế định tuyến cho URL, cáchkết xuất tham số của action-method và các thành phần khác ASP.NETMVC cũng hỗ trợ việc sử dụng Dependency Injection (DI) và Inversion

of Control (IoC) DI cho phép bạn gắn các đối tượng vào một lớp cho lớp

đó sử dụng thay vì buộc lớp đó phải tự mình khởi tạo các đối tượng IoCquy định rằng, nếu một đối tượng yêu cầu một đối tượng khác, đốitượng đầu sẽ lấy đối tượng thứ hai từ một nguồn bên ngoài, ví dụ như

từ tập tin cấu hình Và nhờ vậy, việc sử dụng DI và IoC sẽ giúp kiểm thử

dễ dàng hơn

ASP.NET MVC có thành phần ánh xạ URL mạnh mẽ cho phép bạnxây dựng những ứng dụng có các địa chỉ URL xúc tích và dễ tìm kiếm.Các địa chỉ URL không cần phải có phần mở rộng của tên tập tin vàđược thiết kế để hỗ trợ các mẫu định dạng tên phù hợp với việc tối ưuhóa tìm kiếm (URL) và phù hợp với lập địa chỉ theo kiểuRepresentational State Transfer (REST)…

Hỗ trợ các tính năng có sẵn của ASP.NET như cơ chế xác thựcngười dùng, quản lý thành viên, quyền, output caching và datacaching, seession và profile, quản lý tình trạng ứng dụng, hệ thống cấu

hình… – ASP.NET MVC 5 sử dụng view engine Razor View Engine cho

phép thiết lập các view nhanh chóng, dễ dàng và tốn ít công sức hơn

so với việc sử dụng Web Forms view engine

CHƯƠNG 2: THIẾT KẾ VÀ XÂY DỰNG WEBSITE BÁN LINH

+ Người dùng đã đăng ký tài khoản để mua sản phẩm mà không cần phải điềnform thông tin.

Ở trang website Admin:

+ Các admin có quyền đăng nhập và đăng ký

+ Tại trang chủ sẽ thống kê các thông tin của cửa hàng

+ Admin được phép thêm, xem, xóa, sửa quyền

+ Mỗi loại tài khoản sẽ được phân quyền khác nhau

+ Ở trang quản lý sản phẩm, các tài khoản có quyền vào được phép thêm, xem ,xóa, sửa sản phẩm

+ Ở trang quản lý chủng loại sản phẩm, các tài khoản có quyền vào được phépthêm, xem , xóa, sửa chủng loại sản phẩm

+ Ở trang quản lý chủng loại sản phẩm, các tài khoản có quyền vào được phépthêm, xem , xóa, sửa nhà sản xuất.1

+ Ở trang quản lý nhập hàng, các tài khoản có quyền vào được phép thêm, xem ,xóa, sửa đơn nhập hàng

+ Ở đơn đặt hàng, các tài khoản có quyền vào được phép xem các đơn hàng chưathanh toán, đã thanh toán nhưng chưa giao, đã thanh toán và đã giao, và duyệt đơn hàng

2.1.2 Actors và Use Cases

Các Use Case Diagram

Hình 2: Biểu đồ Use case chính

Hình 3: Biểu đồ Use case quản lý quyền

Hình 4: Biểu đồ Use case quản lý tài khoản

Hình 5: Biểu đồ Use case tra cứu sản phẩm

Hình 6: Biểu đồ Use case đặt hàng

Hình 7: Biểu đồ Use case quản lý danh mục

1 UC01 Đăng nhập Cho phép actor đăng nhập vào hệ thống

3 UC03 Quản lý quyền Cho phép actor điều chỉnh quyền các loại

tàikhoản và các quyền

4 UC04 Quản lý tài khoản Cho phép actor thêm, xóa, sửa các tài

khoản

5 UC05 Tra cứu sản phẩm Cho phép các actor tìm kiếm, liệt kê danh

sách sản phẩm và xem chi tiết sản phẩm

hàng, xóa giỏ hàng, thanh toán

7 UC07 Quản lý danh mục Cho phép actor thêm, xóa, sửa các danh

mục như: sản phẩm, loại sản phẩm, nhà sản xuất

8 UC08 Quản lý nhập xuất Cho phép actor quản lý phiếu nhập hàng

vàđơn đặt hàng

Hình 8: Biểu đồ Use case quản lý nhập xuất

1 Admin Là quản trị viên của hệ thống, có mọi quyền và thực

hiện mọi chức năng

2 Staff Là người quản lý số liệu của hệ thống, doanh thu

3 Customer Là khách hàng gồm người có tài khoản và người

Model (M):Là bộ phận có chức năng lưu trữ toàn bộ dữ liệu củaứng dụng Bộ phận này là một cầu nối giữa 2 thành phần bên dưới làView và Controller Model thể hiện dưới hình thức là một cơ sở dữ liệuhoặc có khi chỉ đơn giản là một file XML bình thường Model thể hiện rõcác thao tác với cơ sở dữ liệu như cho phép xem, truy xuất, xử lý dữliệu,…

View (V):Đây là phần giao diện (theme) dành cho người sử dụng.Nơi mà người dùng có thể lấy được thông tin dữ liệu của MVC thông

qua các thao tác truy vấn như tìm kiếm hoặc sử dụng thông qua cácwebsite.

Controller (C): Bộ phận có nhiệm vụ xử lý các yêu cầu người dùngđưa đến thông qua view Từ đó, C đưa ra dữ liệu phù hợp với ngườidùng Bên cạnh đó, Controller còn có chức năng kết nối với model

*Framework:

Đồ án Sử dụng công nghệ ASP.NET MVC 5 với ngôn ngữ lập trìnhC# 7.3 trong Backend và một phần lớn framework bootstrap 4 làmFrontend

Ngoài ra còn sử dụng công nghệ Entity Framework để ánh xạ dữliệu từ database Entity Framework (EF) là một framework ánh xạ quan

hệ đối tượng (ORM) dành cho ADO.NET, là 1 phần của NET Framework

EF cho phép các nhà phát triển Web tương tác với dữ liệu quan hệ theophương pháp hướng đối tượng đặc trưng Lợi ích lớn nhất của EF là giúplập trình viên giảm thiểu việc lập trình mã nguồn cần thiết để truy cập

và tương tác với cơ sở dữ liệu EF được Microsoft hỗ trợ phát triển lâudài và bền vững, vì vậy EF là 1 framework mạnh nhất hiện nay để pháttriển ứng dụng Web với sự hỗ trợ đông đảo của các nhà phát triển Web

Đồ án sử dụng chiến lược database first với MSSQL Server, cùng cúpháp LinQ hỗ trợ trong việc truy vấn dữ liệu một cách dễ dàng hơn.

383

384

385

2.3.WEBSITE BÁN LINH KIỆN MÁY TÍNH

Trang chủ bán hàng dùng để hiển thị những sản phẩm mới theocác style khác nhau.

2.3.2 Trang chi tiết sản phẩm

Hình 11: Trang chi tiết sản phẩm Hiển thị thông tin chi tiết của sản phẩm như về cấu hình, giá bán, thông tin mô tả,thông số kĩ thuật và nút chức năng thêm vào giỏ hàng

2.3.3 Trang danh sách sản phẩm.

Hình 12: Trang danh sách sản phẩmHiển thị danh sách sản phẩm theo từng loại sản phẩm, từng nhà sản xuất, từ từkhóa tìm kiếm Có nút chức năng xem chi tiết và thêm vào giỏ hàng Và còn được phântrang mỗi 6 sản phẩm

2.3.4 Trang đăng nhập.

Hình 13: Trang đăng nhậpHiển thị form đăng nhập với các phím chức năng như đăng ký, đăng nhập

2.3.6 Trang giỏ hàng.

Hình 15: Trang giỏ hàng Hiển thị những sản phẩm đã được thêm vào giỏ hàng và có chứcnăng chỉnh sửa số lượng sản phẩm hoặc xóa sản phẩm Bấm đặt hàngchỉ khi nào đủ thông tin khách hàng hoặc đã đăng nhập

2.3.7 Trang Admin

Hình 16: Trang adminHiển thị số liệu thống kê của hệ thống

2.3.8 Trang quản lý thành viên

Hình 17: Trang quản lý thành viênHiển thị danh sách thành viên trong hệ thống và có chức năng thêm, xóa , sửa các thành viên

2.3.9 Trang quản lý quyền

Hình 18: Trang quản lý quyềnHiển thị danh sách quyền trong hệ thống và có chức năng thêm, xóa ,sửa các quyền

2.3.10 Trang quản lý phân quyền

Hình 19: Trang quản lý phân quyềnHiển thị các loại thành viên và có chức năng phân quyền cho từngloại thành viên khác

2.3.11 Trang quản lý đơn đặt hàng

Hình 20: Trang quản lý đơn đặt hàng

Hiển thị danh sách các đơn nhập hàng chưa thanh toán, chưagiao và đã thanh toán, đã giao và đã thanh toán Và có chức năngduyệt đơn hàng để cập nhật trạng thái đơn hàng

Thêm vào từng sản phẩm cần được nhập hàng, và nút nhập hàng

để submit dữ liệu

468

469

2.1.14 Trang quản lý loại sản phẩm

Hình 23: Trang quản lý sản phẩmHiển thị danh sách các loại sản phẩm và chức năng thêm, xóa, sửa loại sản phẩm

2.3.15 Trang quản lý nhà sản xuất

Hình 24: Trang quản lý nhà sản xuấtHiển thị danh sách các nhà sản xuất và chức năng thêm, xóa, sửa nhà

sản xuất483

CHƯƠNG 3: KẾT LUẬN

3.1 CÁC CHỨC NĂNG ĐÃ HOÀN THÀNH

* Đồ án hiện chỉ mới được thực hiện ở giai đoạn 1:

- Thêm giỏ hàng, xóa và sửa chi tiết giỏ hàng, đặt hàng

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

- Hiển thị danh sách sản phẩm theo loại, theo nhà sản xuất

- Thống kê dữ liệu

- Phân quyền và quản lý quyền

- Quản lý tài khoản

- Tìm kiếm trong trang quản lý

- Xác thực 2 yếu tố qua gmail hoặc điện thoại khi đăng ký, quên mật khẩu, mã hóa mật khẩu

- Áp dụng async & await để tối ưu hóa trang web

- Thêm sơ đồ trong trang dashboard

- Dùng attribute routing để đường dẫn chuẩn seo

- Áp dụng design pattern để hệ thống dễ quản lý code và dễ mở rộng hơn

3.3 ĐÁNH GIÁ KẾT QUẢ VÀ HƯỚNG PHÁT TRIỂN