105
TRƢỜNG ĐẠI HỌC SƢ PHẠM KTHUT THÀNH PHHCHÍ MINH KHOA ĐO TẠO CHẤT LƢNG CAO ĐỒ ÁN TT NGHIP XÂY DNG WEBSITE BÁN HÀNG SDNG ASP.NET MVC 5 Nhóm SVTH : NGUYN HUNH MINH LUÂN 10110066 PHM THANH PHONG 10110084 Khoá : 2010-2014 Ngành : Công nghthông tin GVHD : ThS. NGUYỄN MINH ĐẠO Tp. HChí Minh, tháng 1 năm 2015

TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

Embed Size (px)

Citation preview

Page 1: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH

KHOA ĐAO TẠO CHẤT LƢƠNG CAO

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG

ASP.NET MVC 5

Nhóm SVTH : NGUYỄN HUỲNH MINH LUÂN 10110066

PHẠM THANH PHONG 10110084

Khoá : 2010-2014

Ngành : Công nghệ thông tin

GVHD : ThS. NGUYỄN MINH ĐẠO

Tp. Hồ Chí Minh, tháng 1 năm 2015

Page 2: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ CHÍ MINH

KHOA ĐAO TẠO CHẤT LƢƠNG CAO

ĐỒ ÁN TỐT NGHIỆP

XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG

ASP.NET MVC 5

Nhóm SVTH : NGUYỄN HUỲNH MINH LUÂN 10110066

PHẠM THANH PHONG 10110084

Khoá : 2010-2014

Ngành : Công nghệ thông tin

GVHD : ThS. NGUYỄN MINH ĐẠO

Tp. Hồ Chí Minh, tháng 1 năm 2015

Page 3: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh Phúc

*******

Tp. Hồ Chí Minh, ngày 22 tháng 9 năm 2014

NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP

Họ và tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN MSSV: 10110066

PHẠM THANH PHONG MSSV: 10110084

Ngành: Công nghệ thông tin Lớp: 10110CLC

Giảng viên hƣớng dẫn: NGUYỄN MINH ĐẠO ĐT: 0903982082

Ngày nhận đề tài: 22/9/2014 Ngày nộp đề tài: 10/1/2014

1. Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5.

2. Các số liệu, tài liệu ban đầu: 3. Nội dung đề tài thực hiện:

- Tìm hiểu mô hình bán lẻ B2C trong thƣơng mại điện tử.

- Xây dựng cơ sở dữ liệu trên Microsoft SQL Server 2012.

- Tìm hiểu công nghệ ASP.NET MVC5

- Xây dựng một trang web sử dụng công nghệ ASP.NET MVC5 giao diện

Bootstrap.

- Upload website lên internet

4. Sản phẩm: Website bán laptop.

TRƢỞNG NGÀNH GIẢNG VIÊN HƢỚNG DẪN

Page 4: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh Phúc

*******

BẢNG NHẬN XÉT CỦA GIÁO VIÊN HƢỚNG DẪN

Họ và tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN . MSSV: 10110066 ..............

PHẠM THANH PHONG ............... MSSV: 10110084 ..............

Ngành: Công nghệ thông tin .........................................................................................

Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5.......

Họ và tên giáo viên hƣớng dẫn: NGUYỄN MINH ĐẠO .............................................

NHẬN XÉT

1. Về nội dung đề tài & khối lƣợng thực hiện:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

2. Ƣu điểm:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

3. Khuyết điểm:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

4. Đề nghị cho bảo vệ hay không?

.......................................................................................................................................

5. Đánh giá loại: .......................................................................................................................................

6. Điểm:……………….(Bằng chữ:............................................................................ )

.......................................................................................................................................

Tp. Hồ Chí Minh, ngày tháng năm 2015

Giáo viên hƣớng dẫn

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

Nguyễn Minh Đạo

Page 5: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAM

Độc lập – Tự do – Hạnh Phúc

*******

BẢNG NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN

Họ và tên Sinh viên: NGUYỄN HUỲNH MINH LUÂN . MSSV: 10110066 ..............

PHẠM THANH PHONG ............... MSSV: 10110084 ..............

Ngành: Công nghệ thông tin .........................................................................................

Tên đề tài: XÂY DỰNG WEBSITE BÁN HÀNG SỬ DỤNG ASP.NET MVC5.......

Họ và tên giáo viên phản biện: NGUYỄN THANH PHƢỚC ......................................

NHẬN XÉT

1. Về nội dung đề tài & khối lƣợng thực hiện:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

2. Ƣu điểm:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

3. Khuyết điểm:

.......................................................................................................................................

.......................................................................................................................................

.......................................................................................................................................

4. Đề nghị cho bảo vệ hay không?

.......................................................................................................................................

5. Đánh giá loại: .......................................................................................................................................

6. Điểm:……………….(Bằng chữ:............................................................................ )

.......................................................................................................................................

Tp. Hồ Chí Minh, ngày tháng năm 2015

Giáo viên phản biện

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

Nguyễn Thanh Phước

Page 6: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

i

LỜI CẢM ƠN

Chúng em xin chân thành cảm ơn Quý Thầy Cô Khoa Chất Lƣợng Cao Trƣờng Đại

Học Sƣ Phạm Kỹ Thuật Tp.HCM đã tạo điều kiện cho em thực hiện đề tài này.

Em xin chân thành cảm ơn Thầy Nguyễn Minh Đạo đã tận tình hƣớng dẫn, chỉ bảo

em trong suốt quá trình thực hiện khóa luận tốt nghiệp này.

Chân thành cảm ơn Quý Thầy Cô Khoa Công Nghệ Thông Tin, trƣờng Đại Học Sƣ

Phạm Kỹ thuật TP Hồ Chí Minh, về những bài giảng trong suốt khóa học, về những

kiến thức nền tảng cũng nhƣ những kiến thức về chuyên ngành đã giúp cho em hoàn

thành tốt đề tài.

Xin chân thành cám ơn các anh chị và bạn bè đã ủng hộ, giúp đỡ và động viên em

trong thời gian học tập và nghiên cứu.

Trong phạm vi khả năng cho phép, em đã rất cố gắng để hoàn thành đề tài một cách

tốt nhất. Song, chắc chắn sẽ không tránh khỏi những thiếu sót. Em kýnh mong nhận

đƣợc sự cảm thông và những ý kiến đóng góp của Quý Thầy Cô và các bạn.

Nhóm sinh viên thực hiện:

Nguyễn Huỳnh Minh Luân

Phạm Thanh Phong

Page 7: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

ii

TÓM TẮT BẰNG TIẾNG VIỆT

Ngày nay, công nghệ web trên nền .NET Framework của Microsoft ngày càng phát

triển mạnh mẽ, cùng với các công nghệ khác nhƣ: PHP, JSP,....Trong đó công nghệ

ASP.NET MVC là một công nghệ mang nhiều tính năng ƣu việt. Bên cạnh đó, việc bán

hàng qua mạng thông qua những website trực tuyến đã không còn quá xa lạ đối với

ngƣời Việt và ngày càng phát huy thế mạnh của nó. Những gian hàng online giúp tiết

kiệm đƣợc rất nhiều thời gian cho những ngƣời bận rộn.

Vì vậy nhóm chúng em đã chọn xây dựng website bán Laptop dựa trên nền tảng

framework ASP.NET MVC5 và một số tính năng khác để hỗ trợ khách hàng trong việc

đặt hàng qua mạng Internet.

Các vấn đề mà nhóm em đã nghiên cứu đƣợc về framework ASP.NET MVC5, công

nghệ AJAX, cấu trúc JSON, API service, dịch vụ SMS, Bootstrap. Các hƣớng tiếp cận

phát triển của chúng em là tìm kiếm thông tin qua Internet, xử lý thông tin dƣới sự giúp

đỡ của Giáo viên hƣớng dẫn.

Trong quá trình nghiên cứu chúng em đã gặp nhiều khó khăn và có một số phƣơng

pháp giải quyết vấn đề nhƣ: lên các forum tham khảo và hỏi ý kiến mọi ngƣời, xin ý

kiến đóng góp của giáo viên hƣớng dẫn, trao đổi ý kiến với bạn cùng nhóm để tìm ra

vấn đề giải quyết.

Kết quả cuối cùng, chúng em đã xây dựng thành công website bán laptop đáp ứng

đầy đủ các nhu cầu của khách hàng. Website sử dụng giao diện Bootstrap, hỗ trợ ngƣời

dùng sử dụng nhiều thiết bị với các kích thƣớc màn hình khác nhau nhƣ máy desktop,

laptop, tablet, smartphone.

Page 8: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

iii

TÓM TẮT BẰNG TIẾNG ANH

Today, technical web base on Microsoft’s .NET Framework is strong growing up

beside other technicals such as PHP, JSP,.... However, ASP.NET MVC technical have

many good feature. In addition ,the online sales website was not so strange with the

Vietnamese. The online stores help to save a lot of time for busy people.

So, we decided to build a website sell Laptops base on ASP.NET MVC5 Framework

and some other features to support customer order product via internet.

Issues that we reseached are ASP.NET MVC5 Framework, technical AJAX, structor

JSON, API Service, service SMS, Bootstrap. Our approach to development are: find

information via internet, processing information with the helping of supervisor

During our research, we had many trouble and had some method to solve the problem

such as references to the forum and ask for people's opinions, ask opinions of

supervisor, ask opinions team mate to solved the problem.

Finally, we are build website sell laptop successfully, website satisfies customer’s

requirement. Website used Bootstrap interface, the maximum support from the users

use desktop to the users who love smartphones or tablet screen ... with the compact

size.

Page 9: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

iv

MỤC LỤC NHIỆM VỤ ĐỒ ÁN TỐT NGHIỆP ................................................................................ 3

BẢNG NHẬN XÉT CỦA GIÁO VIÊN HƢỚNG DẪN ................................................. 4

BẢNG NHẬN XÉT CỦA GIÁO VIÊN PHẢN BIỆN .................................................... 5

LỜI CẢM ƠN ................................................................................................................... i

TÓM TẮT BẰNG TIẾNG VIỆT .....................................................................................ii

TÓM TẮT BẰNG TIẾNG ANH ................................................................................... iii

MỤC LỤC ....................................................................................................................... iv

DANH SÁCH CÁC CHỮ VIẾT TẮT ............................................................................ ix

DANH SÁCH CÁC BẢNG BIỂU .................................................................................. x

DANH SÁCH CÁC HÌNH ẢNH, BIỂU ĐỒ ................................................................xii

Chƣơng 1 - TỔNG QUAN ........................................................................................... 1

1.1. Giới thiệu tổng quát ............................................................................................ 1

1.2. Mục đích của đồ án ............................................................................................. 1

1.3. Kết quả của phần mềm ....................................................................................... 1

Chƣơng 2 CƠ SỞ LÝ THUYẾT .................................................................................. 2

2.1 Công nghệ ASP.NET MVC5 ............................................................................. 2

2.1.1 Lịch sử ra đời của MVC .............................................................................. 2

2.1.2 Sự khác nhau giữa MVC và webform ......................................................... 2

2.1.3 Kiến trúc sử dụng ASP.NET MVC ............................................................. 3

2.1.4 Đặc điểm ASP.NET MVC Framework ....................................................... 4

2.2 Mô hình MVC5 .................................................................................................. 5

2.2.1 Các tính năng của mô hình MVC3 và MVC4 ............................................. 5

2.2.2 Các cải tiến của MVC5 ................................................................................ 6

2.3 Vài nét về thƣơng mại điện tử B2C .................................................................... 8

2.3.1 Khái niệm ..................................................................................................... 8

2.3.2 Phân loại mô hình B2C ................................................................................ 8

Page 10: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

v

2.3.3 Hoạt động của mô hình B2C ....................................................................... 9

2.4 Giới thiệu về hệ thống SMS ............................................................................... 9

Chƣơng 3 - THIẾT KẾ GIAO DIỆN .......................................................................... 10

3.1 Giao diện ngƣời dùng (FrontEnd) .................................................................... 10

3.1.1 Giao diện trang chủ .................................................................................... 10

3.1.2 Giao diện tìm kiếm .................................................................................... 11

3.1.3 Giao diện chi tiết sản phẩm ....................................................................... 12

3.1.4 Giao diện danh sách yêu thích ................................................................... 13

3.1.5 Giao diện so sánh sản phẩm ....................................................................... 13

3.1.6 Giao diện Shopping Cart............................................................................ 14

3.1.7 Giao diện thanh toán .................................................................................. 15

3.1.8 Giao diện quản lý đơn hàng ....................................................................... 16

3.1.9 Giao diện đăng ký ...................................................................................... 17

3.1.10 Giao diện đăng nhập ............................................................................... 18

3.1.11 Giao diện lấy lại mật khẩu ...................................................................... 18

3.1.12 Giao diện liên hệ ..................................................................................... 19

3.1.13 Giao diện bình luận ................................................................................ 20

3.1.14 Giao diện chia sẻ qua Facebook ............................................................. 20

3.2 Giao diện quản trị website (admin) .................................................................. 21

3.2.1 Giao diện trang chủ .................................................................................... 21

3.2.2 Giao diện quản lý sản phẩm ....................................................................... 22

3.2.3 Giao diện quản lý chi tiết sản phẩm ........................................................... 24

3.2.4 Giao diện quản lý nhà cung cấp ................................................................. 26

3.2.5 Giao diện quản lý đặt hàng ........................................................................ 27

3.2.6 Giao diện quản lý phí vận chuyển ............................................................. 28

3.2.7 Giao diện quản lý tài khoản ....................................................................... 29

Page 11: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

vi

3.2.8 Giao diện thống kê ..................................................................................... 30

3.3 Giao diện responsive ....................................................................................... 33

3.3.1 Giao diện trang chủ .................................................................................... 33

3.3.2 Giao diện đăng ký responsive .................................................................... 35

3.3.3 Giao diện đăng nhập resonsive .................................................................. 35

3.3.4 Giao diện chi tiết sản phẩm ....................................................................... 36

3.3.5 Giao diện so sánh sản phẩm responsive .................................................... 37

3.3.6 Giao diện giỏ hàng responsive ................................................................... 38

3.3.7 Giao diện loại sản phẩm responsive .......................................................... 39

3.3.8 Giao diện thanh toán responsive ................................................................ 39

3.3.9 Giao diện trang chủ Admin responsive .................................................... 40

3.3.10 Giao diện quản lý nhà cung cấp responsive ........................................... 40

3.3.11 Giao diện thống kê theo nhà sản xuất responsive .................................. 41

3.3.12 Giao diện biểu đồ doanh thu theo nhà sản xuất ...................................... 41

Chƣơng 4 - THIẾT KẾ CHƢƠNG TRÌNH VÀ CƠ SỞ DỮ LIỆU ........................... 42

4.1 Sơ đồ use case ................................................................................................... 42

4.2 Mô tả use case ................................................................................................... 43

4.2.1 Use case đăng ký ........................................................................................ 43

4.2.2 Use case đăng nhập .................................................................................... 43

4.2.3 Use case đăng xuất ..................................................................................... 44

4.2.4 Use case đổi mật khẩu ............................................................................... 44

4.2.5 Use case lấy lại mật khẩu ........................................................................... 45

4.2.6 Use case bình luận ..................................................................................... 45

4.2.7 Use case quản lý danh sách yêu thích ........................................................ 46

4.2.8 Use case xem chi tiết sản phẩm ................................................................. 46

4.2.9 Use case tìm kiếm theo tên ........................................................................ 47

Page 12: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

vii

4.2.10 Use case chia sẻ Facebook ..................................................................... 47

4.2.11 Use case tìm kiếm nâng cao ................................................................... 48

4.2.12 Use case so sánh sản phẩm ..................................................................... 48

4.2.13 Use case quản lý giỏ hàng ...................................................................... 49

4.2.14 Use case thanh toán ................................................................................ 49

4.2.15 Use case xem/xóa đặt hàng .................................................................... 50

4.2.16 Use case quản lý tài khoản ..................................................................... 50

4.2.17 Use case quản lý sản phẩm ..................................................................... 51

4.2.18 Use case quản lý chi tiết sản phẩm ......................................................... 52

4.2.19 Use case quản lý loại sản phẩm .............................................................. 53

4.2.20 Use case quản lý nhà sản xuất ................................................................ 54

4.2.21 Use case quản lý phí vận chuyển............................................................ 55

4.2.22 Use case quản lý đơn hàng ..................................................................... 56

4.2.23 Use case thống kê ................................................................................... 56

4.2.24 Use case quản lý quyền hạn ................................................................... 57

4.3 Sơ đồ tuần tự (Sequence Diagram) ................................................................... 58

4.3.1 Sơ đồ tuần tự đăng ký ................................................................................ 58

4.3.2 Sơ đồ tuần tự đăng nhập ............................................................................ 58

4.3.3 Sơ đồ tuần tự thay đổi mật khẩu ................................................................ 59

4.3.4 Sơ đồ tuần tự lấy lại mật khẩu ................................................................... 59

4.3.5 Sơ đồ tuần tự tìm kiếm sản phẩm .............................................................. 60

4.3.6 Sơ đồ tuần tự quản lý danh sách yêu thích ................................................ 60

4.3.7 Sơ đồ tuần tự so sánh sản phẩm ................................................................. 61

4.3.8 Sơ đồ tuần tự mua hàng ............................................................................. 61

4.3.9 Sơ đồ tuần tự quản lý sản phẩm ................................................................. 62

4.4 Cơ sở dữ liệu ..................................................................................................... 63

Page 13: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

viii

4.4.1 Sơ đồ mối quan hệ giữa các thực thể ......................................................... 63

4.4.2 Cấu trúc bảng CSDL SQL Server .............................................................. 64

Chƣơng 5 KẾT QUẢ SO SÁNH, THỰC NGHIỆM, PHÂN T CH, TỔNG H P .... 74

5.1 Kết quả đạt đƣợc ............................................................................................... 74

5.2 Thực nghiệm ..................................................................................................... 75

Chƣơng 6 KẾT LUẬN ................................................................................................ 75

6.1 Ƣu và khuyết điểm ........................................................................................... 75

6.2 Hƣớng phát triển ............................................................................................... 75

TÀI LIỆU THAM KHẢO ................................................................................................ 1

Chƣơng 7 PHỤ LỤC .................................................................................................... 2

7.1 Cài đặt ứng dụng ................................................................................................. 2

7.2 Cài đặt up host .................................................................................................... 5

7.3 Các tài khoản sử dụng trong đồ án ................................................................... 11

Page 14: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

ix

DANH SÁCH CÁC CHỮ VIẾT TẮT

STT Các từ viết tắt Từ viết đầy đủ

1. app Application

2. ASP Active Server Page

3. AJAX Asynchronous JavaScript and XML

4. CSDL Cơ Sở Dữ Liệu

5. ID Indentification number

6. IOS Intelligent Opperating System

7. JS Javascript

8. JSON JavaScript Object Notation

9. MVC Model View Controller

10. OOP Object Oriented Programming

11. SMS Sort Message Service

12. SQL Structured Query Language

13. UI User Interface

14. URL Uniform Resource Locator

15. VS Visual

Page 15: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

x

DANH SÁCH CÁC BẢNG BIỂU Bảng 2-1 Lịch sử các phiên bản MVC ............................................................................. 2

Bảng 2-2 Sự khác nhau giữa MVC và Webform ............................................................. 3

Bảng 2-3Các loại security trong MVC5 .......................................................................... 7

Bảng 4-1Use case đăng ký ............................................................................................. 43

Bảng 4-2: Use case đăng nhập ....................................................................................... 43

Bảng 4-3 Use case đăng xuất ......................................................................................... 44

Bảng 4-4: Use case đổi mật khẩu ................................................................................... 44

Bảng 4-5Use case quên mật khẩu .................................................................................. 45

Bảng 4-6 Use case bình luận .......................................................................................... 45

Bảng 4-7: Use case quản lý danh sách yêu thích ........................................................... 46

Bảng 4-8: Use case xem chi tiết sản phẩm ..................................................................... 46

Bảng 4-9: Use case tìm kiếm theo tên ............................................................................ 47

Bảng 4-10 Use case chia sẻ Facebook ........................................................................... 47

Bảng 4-11: Use case tìm kiếm nâng cao ........................................................................ 48

Bảng 4-12: Use case so sánh sản phẩm .......................................................................... 48

Bảng 4-13: Use case quản lý giỏ hàng ........................................................................... 49

Bảng 4-14: Use case thanh toán ..................................................................................... 49

Bảng 4-15 Quản lý đặt hàng........................................................................................... 50

Bảng 4-16: Use case quản lý tài khoản .......................................................................... 50

Bảng 4-17: Use case quản lý sản phẩm .......................................................................... 51

Bảng 4-18 Use case quản lý chi tiết sản phẩm ............................................................... 52

Bảng 4-19: Use case quản lý loại sản phẩm ................................................................... 53

Bảng 4-20: Use case quản lý nhà sản xuất ..................................................................... 54

Bảng 4-21Use case quản lý phí vận chuyển .................................................................. 55

Bảng 4-22 Use case quản lý đơn hàng ........................................................................... 56

Bảng 4-23 Use case thống kê ......................................................................................... 56

Bảng 4-23Use case quản lý quyền hạn .......................................................................... 57

Bảng 4-24 Bảng LOAISP............................................................................................... 64

Bảng 4-25 Bảng CTSP ................................................................................................... 65

Bảng 4-26 Bảng CTHD .................................................................................................. 66

Bảng 4-27 Bảng DATHANG ......................................................................................... 67

Bảng 4-28 Bảng SANPHAM ......................................................................................... 68

Bảng 4-29 Bảng WISHLIST .......................................................................................... 69

Page 16: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

xi

Bảng 4-30 Bảng NHACUNGCAP ................................................................................. 69

Bảng 4-31 Bảng SHIP .................................................................................................... 70

Bảng 4-32 Bảng AspNetRoles ...................................................................................... 70

Bảng 4-33 Bảng AspNetUser ......................................................................................... 72

Bảng 4-34 Bảng AspNetUserLogins ............................................................................. 72

Bảng 4-35 Bảng AspNetUserRoles ............................................................................... 73

Bảng 4-36 Bảng AspNetClaims .................................................................................... 73

Page 17: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

xii

DANH SÁCH CÁC HÌNH ẢNH, BIỂU ĐỒ Hình 2-1 Mô hình MVC ................................................................................................... 3

Hình 2-2 SMS API ........................................................................................................... 9

Hình 3-1 Màn hình trang chủ ......................................................................................... 10

Hình 3-2 Màn hình tìm kiếm .......................................................................................... 11

Hình 3-3 Menu tìm kiếm nâng cao ................................................................................ 11

Hình 3-4 Màn hình chi tiết sản phẩm ............................................................................. 12

Hình 3-5 Màn hình danh sách yêu thích ........................................................................ 13

Hình 3-6 Giao diện những sản phẩm trong danh sách so sánh ...................................... 13

Hình 3-7 Màn hình so sánh sản phẩm ............................................................................ 14

Hình 3-8 Giao diện Shopping Cart trong màn hình chính ............................................. 14

Hình 3-9 Màn hình Shopping Cart ................................................................................. 15

Hình 3-10 Màn hình thanh toán ..................................................................................... 15

Hình 3-11 Màn hình quản lý đơn hàng .......................................................................... 16

Hình 3-12 Màn hình chi tiết đơn hàng ........................................................................... 16

Hình 3-13 Màn hình đăng ký tài khoản ......................................................................... 17

Hình 3-14 Thông báo đăng ký thành công ..................................................................... 17

Hình 3-15 Màn hình đăng nhập tài khoản ...................................................................... 18

Hình 3-16 Màn hình quên mật khẩu .............................................................................. 18

Hình 3-17 Màn hình thay đổi mật khẩu ......................................................................... 19

Hình 3-18Màn hình liên hệ ............................................................................................ 19

Hình 3-19Màn hình bình luận ........................................................................................ 20

Hình 3-20 Màn hình chia sẻ qua Facebook .................................................................... 20

Hình 3-21Kết quả hiển thị chia sẻ trên Facebook .......................................................... 20

Hình 3-22Màn hình trang chính Admin ......................................................................... 21

Hình 3-23 Màn hình danh sách sản phẩm ...................................................................... 22

Hình 3-24 Màn hình thông tin sản phẩm ....................................................................... 23

Hình 3-25 Màn hình sửa sản phẩm ............................................................................... 23

Hình 3-26 Màn hình thêm sản phảm .............................................................................. 24

Hình 3-27 Màn hình danh sách chi tiết sản phẩm ......................................................... 24

Hình 3-28 Màn hình thông tin chi tiết sản phẩm ........................................................... 25

Hình 3-29 Màn hình sửa chi tiết sản phẩm .................................................................... 25

Hình 3-30 Màn hình thêm chi tiết sản phẩm .................................................................. 26

Hình 3-31Màn hình quản lý nhà cung cấp ..................................................................... 26

Page 18: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

xiii

Hình 3-32 Màn hình danh sách đặt hàng ....................................................................... 27

Hình 3-33 Màn hình thông tin đặt hàng ......................................................................... 27

Hình 3-34 Màn hình sửa thông tin đặt hàng .................................................................. 28

Hình 3-35Màn hình quản lý phí vận chuyển .................................................................. 28

Hình 3-36 Màn hình danh sách tài khoản ...................................................................... 29

Hình 3-37 Màn hình sửa thành viên ............................................................................... 29

Hình 3-38Màn hình quyền hạn thành viên ..................................................................... 30

Hình 3-39 Màn hình thống kê theo nhà sản xuất ........................................................... 30

Hình 3-40Biểu đồ doanh thu theo nhà sản xuất ............................................................. 31

Hình 3-41 Màn hình thống kê theo mặt hàng ................................................................ 31

Hình 3-42 Màn hình thống kê theo khách hàng ............................................................. 32

Hình 3-43 Màn hình thống kê danh thu theo tháng ....................................................... 32

Hình 3-44Biểu đồ doanh thu theo tháng ........................................................................ 33

Hình 3-45 Giao diện trang chủ responsive (1) ............................................................... 33

Hình 3-46 Giao diện trang chủ responsive (2) ............................................................... 34

Hình 3-47 Giao diện trang chủ responsive (3) ............................................................... 34

Hình 3-48 Màn hình giao diện đăng ký responsive ....................................................... 35

Hình 3-49Màn hình giao diện đăng nhập resonsive ...................................................... 35

Hình 3-50Màn hình giao diện chi tiết sản phẩm(1) ....................................................... 36

Hình 3-51 Màn hình giao diện so sánh sản phẩm responsive (1) .................................. 36

Hình 3-52Màn hình giao diện so sánh sản phẩm responsive (1) ................................... 37

Hình 3-53Màn hình giao diện so sánh sản phẩm responsive (2) ................................... 37

Hình 3-54Giao diện giỏ hàng trên trang chủ responsive ............................................... 38

Hình 3-55 Màn hình giao diện giỏ hàng responsive ...................................................... 38

Hình 3-56Màn hình giao diện loại sản phẩm responsive ............................................... 39

Hình 3-57 Giao diện thanh toán responsive ................................................................... 39

Hình 3-58Giao diện trang chủ Admin responsive ......................................................... 40

Hình 3-59 Giao diện quản lý nhà cung cấp responsive.................................................. 40

Hình 3-60 Giao diện thống kê theo nhà sản xuất responsive ......................................... 41

Hình 3-61Màn hình giao diện biểu đồ doanh thu theo nhà sản xuất ............................. 41

Hình 4-1Sơ đồ use case .................................................................................................. 42

Hình 4-2Sơ đồ tuần tự của quá trình đăng ký ................................................................ 58

Hình 4-3 Sơ đồ tuần tự của quá trình Login .................................................................. 58

Hình 4-4 Sơ đồ tuần tự của quá trình thay đổi mật khẩu ............................................... 59

Page 19: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

xiv

Hình 4-5 Sơ đồ tuần tự của quá trình lấy lại mật khẩu ................................................. 59

Hình 4-6 Sơ đồ tuần tự của quá trình tìm kiếm sản phẩn .............................................. 60

Hình 4-7 Sơ đồ tuần tự của quá trình quản lý danh sách yêu thích ............................... 60

Hình 4-8 Sơ đồ tuần tự của quá trình so sánh sản phẩm ................................................ 61

Hình 4-9 Sơ đồ tuần tự của quá trình mua hàng ............................................................ 61

Hình 4-10 Sơ đồ tuần tự của quá trình quản lý sản phẩm .............................................. 62

Hình 4-11 Sơ đồ mối quan hệ giữa các thực thể ............................................................ 63

Hình 4-12 Bảng LOAISP ............................................................................................... 64

Hình 4-13 Bảng CTSP ................................................................................................... 64

Hình 4-14 Bảng CTHD .................................................................................................. 66

Hình 4-15 Bảng DATHANG ......................................................................................... 67

Hình 4-16 Bảng SANPHAM ......................................................................................... 68

Hình 4-17 Bảng WISHLIST .......................................................................................... 69

Hình 4-18 Bảng NHACUNGCAP ................................................................................. 69

Hình 4-19Bảng SHIP ..................................................................................................... 70

Hình 4-20 Bảng AspNetRoles ....................................................................................... 70

Hình 4-21 Bảng AspNetUser ......................................................................................... 71

Hình 4-22 Bảng AspNetUserLogins ............................................................................. 72

Hình 4-23 Bảng AspNetUserRoles ............................................................................... 73

Hình 4-24 Bảng AspNetClaims .................................................................................... 73

Page 20: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

1

Chƣơng 1 - TỔNG QUAN 1.1. Giới thiệu tổng quát

- Ngày nay, công nghệ web trên nền .NET Framework của Microsoft ngày càng

phát triển mạnh mẽ, cùng với các công nghệ khác nhƣ: PHP, JSP,....Trong đó

công nghệ ASP.NET MVC là một công nghệ mang nhiều tính năng ƣu việt. Bên

cạnh đó, với việc phát triển của Internet, các website bán hàng online trên thế giới

ngày càng phổ biến, giúp ngƣời dùng tiết kiếm thời gian và tiền bạc trong việc

mua sản phẩm. Vì thế nhóm quyết định làm website bán laptop online.

1.2. Mục đích của đồ án

- Muốn nghiên cứu, nắm vững: framework ASP.NET MVC5, giao diện Bootstrap

để xây dựng website thực tiễn đáp ứng nhu cầu khách hàng.

- Xây dựng website bán Laptop online đáp ứng đƣợc đầy đủ các quy trình của bán

hàng online.

1.3. Kết quả của phần mềm

Nhóm đã xây dựng đƣợc đầy đủ các chức năng chính của một website phục vụ cho:

- Đối với ngƣời dùng mua sản phẩm online:

Đăng nhập

Đăng ký

Đổi mật khẩu

Lấy lại mật khẩu

Tìm kiếm theo tên sản phẩm

Tìm kiếm nâng cao

Xem chi tiết sản phẩm

Bình luận, chia sẻ qua Facebook

So sánh sản phẩm

Quản lý giỏ hàng

Quản lý danh sách yêu thích

Thanh toán

Quản lý đặt hàng

- Đối với quản trị viên thì có thêm các chức năng sau:

Quản lý sản phẩm

Quản lý loại sản phẩm

Quản lý nhà sản xuất Quản lý tài khoản, quyền hạn

Quản lý đơn hàng

Quản lý chi tiết sản phẩm

Quản lý phí vận chuyển

Thống kê

Page 21: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

2

Chƣơng 2 CƠ SỞ LÝ THUYẾT

2.1 Công nghệ ASP.NET MVC5

2.1.1 Lịch sử ra đời của MVC

- Tất cả bắt đầu vào những năm 70 của thế kỷ 20, tại phòng thí nghiệm Xerox

PARC ở Palo Alto. Sự ra đời của giao diện đồ họa (GUI) và lập trình hƣớng đối

tƣợng (Object Oriented Programming) cho phép lập trình viên làm việc với

những thành phần đồ họa nhƣ những đối tƣợng đồ họa có thuộc tính và phƣơng

thức riêng của nó. Không dừng lại ở đó, những nhà nghiên cứu ở Xerox PARC

còn đi xa hơn khi cho ra đời cái gọi là kiến trúc MVC (viết tắt của Model – View

– Controller).[1]

- MVC đƣợc phát minh tại Xerox Parc vào những năm 70, bởi TrygveReenskaug.

MVC lần đầu tiên xuất hiện công khai là trong Smalltalk-80. Các giấy tờ quan

trọng đầu tiên đƣợc công bố trên MVC là “A Cookbook for Using the Model-

View-Controller User Interface Paradigm in Smalltalk – 80”, bởi Glenn Krasner

và Stephen Pope, xuất bản trong tháng 8 / tháng 9 năm 1988.

- Thế hệ tiếp theo của MVC xuất hiện cùng với hệ điều hành NeXT và các phần

mềm của nó.

- Kiến trúc này ngày càng đƣợc phát triển và hoàn thiện nhằm giải quyết các vấn

đề phát sinh cũng nhƣ các giải pháp cho quá trình phát triển phần mềm.

- Vì vậy sau đó, lần lƣợt các MVC framework ra đời dựa trên mô hình MVC nhƣ:

CodeIgniter, Zend, ASP.NET MVC …

Thời gian phát hành Phiên bản

2008 ASP.NET MVC 1.0

2008 ASP.NET MVC 2.0 (.NET 3.5)

1/2010 ASP.NET MVC 3.0 (.Net 4)

15/8/2012 ASP.NET MVC 4.0 (.Net 4.5)

17/10/2013 ASP.NET MVC 5.0 (.Net 5.0) Bảng 2-1 Lịch sử các phiên bản MVC

2.1.2 Sự khác nhau giữa MVC và webform

MVC Webform

Thành

phần

ASP.net MVC chia ra làm 3 phần:

– Models

– View

– Controller.

Mọi tƣơng tác của ngƣời dùng với

Views sẽ đƣợc xử lý thông qua việc

thực hiện các action hành động trong

ASP.net WebForm sử dụng

ViewState để quản lý Các

trang ASP.net đều có

lifecycle, postback và dùng

các web controls, các event

để thực hiện các hành động

cho UI (User Interface) .

Page 22: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

3

Controllers, không còn postback,

lifecycle và events.

Khi có sự tƣơng tác với

ngƣời dùng nên hầu hết

ASP.net WebForm xử lý

chậm.

Việc

kiểm

tra

(test),

gỡ lỗi

(debug)

Đối với MVC thì việc đó có thể sử

dụng các unit test có thể thẩm định rất

dễ dàng các Controllers thực hiện nhƣ

thế nào.

Với ASP.net WebForm đều

phải chạy tất cả các tiến

trình của ASP.net, và sự thay

đổi ID của bất kỳ Controls

nào cũng ảnh hƣởng đến ứng

dụng. Bảng 2-2 Sự khác nhau giữa MVC và Webform

2.1.3 Kiến trúc sử dụng ASP.NET MVC

ASP.NET MVC đƣợc thiết kế một cách gọn nhẹ, giảm thiểu sự phức tạp của việc xây

dựng ứng dụng website bằng cách chia một ứng dụng thành 3 tầng (layer): Model,

View và Controller. Sự chia nhỏ này giúp lập trình viên dễ dàng kiểm soát các thành

phần trong khi phát triển, cũng nhƣ lợi ích lâu dài trong việc kiểm tra, bảo trì và nâng

cấp.

a. Model Model chứa và thể hiện các đặc tính và logic ứng dụng. Theo một cách hiểu khác,

Model đại diện cho dữ liệu và logic cốt lõi. Nó chính là những lớp (class) chứa thông

tin về các đối tƣợng mà ta cần phải thao tác, làm việc trên nó. Ví dụ: "Sách" chứa các

thông tin nhƣ "Tên", "Ngày phát hành", "Giá", "Nhà sản xuất", ...

b. View View làm nhiệm vụ thể hiện một Model hay nhiều Model một cách trực quan, nó nhận

thông tin (một Model hoặc nhiều Model) sau đó biểu diễn lên trang website.

c. Controller Controller nằm giữa tầng View và Model, làm nhiệm vụ tìm kiếm, xử lý một hoặc

nhiều Model, sau đó gửi Model tới View để View hiển thị.

H nh 2-1 Mô hình MVC

Page 23: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

4

2.1.4 Đặc điểm ASP.NET MVC Framework

Tiếp tục hỗ trợ các tính năng trong ASP.NET

- Hỗ trợ sử dụng các các tập tin:.ASPX, .ASCX, .Master nhƣ là thành phần

View.

- Hỗ trợ đầy đủ các tính năng bảo mật của ASP.net: Form/ Windows

authenticate, URL authorization, membership/roles, output và data

caching, section/ profile state, configuration system, provider architecture.

Tách rõ ràng các mối liên quan, mở ra khả năng test TDD (Test Driven Developer).

- Có thể test unit trong ứng dụng mà không cần phải chạy Controllers cùng

với tiến trình của ASP.NET và có thể dùng bất kỳ một unit testing

framework nào nhƣ NUnit, MBUnit, MS Test,…

Có khả năng mở rộng, mọi thứ trong MVC đƣợc thiết kế để dễ thay thế, dễ dàng tùy biến. Ánh xạ URL mạnh mẽ, cho phép xây dựng ứng dụng với những URL sạch.

Không sử dụng mô hình post-back từ giao diện gửi đến server. Thay vào đó, chủ

động đƣa những post-back từ View đến thẳng lớp Controller.

Hỗ trợ nhiều công cụ tạo View (Support for Multiple View Engines) - Cho phép chọn công cụ tạo view. Hộp thoại New Project cho phép xác định

view engine mặc định cho một project.

- Các loại view engine

o Web Forms (ASPX)

o Razor

o Hay một view engine nguồn mở nhƣ Spark, NHaml, NDjango.

Hỗ trợ định tuyến

- ASP.NET MVC Framework có một bộ máy ánh xạ URL thật sự mạnh mẽ.

- Bộ máy này cung cấp phƣơng pháp rất linh hoạt trong việc ánh xạ URLs

sang các Controller Classes.

- Bạn có thể dễ dàng định ra các quy luật, cài đặt đƣờng đi, ASP.NET dựa

vào các quy luật đƣờng đi đó để xác định Controller và action cần phải thực

thi.

- ASP.NET còn có khả năng phân tích URL, chuyển các thông số trong URL

thành các tham số trong lời gọi hàm của Controller.

Model Binding

- Model Binding là tính năng thế mạnh của ASP.NET MVC (và bây giờ nó

cũng đƣợc áp dụng cho cả Web Forms trong phiên bản ASP.NET 4.5).

- Hỗ trợ bạn viết phƣơng thức nhận một đối tƣợng tùy biến nhƣ là một tham

số

Page 24: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

5

- Với sự hỗ trợ của Model Binding, bây giờ bạn chỉ cần tập trung vào việc

cài đặt các nghiệp vụ logic, không cần phải bận tâm về việc suy nghĩ làm

cách nào để ánh xạ dữ liệu từ ngƣời dùng sang các đối ƣợng .NET.

Filters

- Là tính năng mạnh trong ASP.NET MVC. Hỗ trợ cho việc kiểm tra tính

hợp lệ trƣớc khi một action method đƣợc gọi hoặc sau khi một action

method thi hành.

Razor View.

Từ ASP.net MVC 3 đi kèm với một công cụ View mới có tên là Razor với

những lợi ích sau:

- Cú pháp Razor là sạch sẽ và xúc tích, đòi hỏi một số lƣợng tối thiểu các tổ

hợp phím.

- Việc tìm hiểu Razor tƣơng đối dễ dàng vì nó dựa trên ngôn ngữ C# và

Visual Basic.

- Visual Studio bao gồm IntelliSense và mã cú pháp Razor đƣợc màu hóa.

- Với Razor views có thể kiểm tra từng đơn vị mà không đòi hỏi bạn phải

chạy các ứng dụng hoặc phải chạy website.

2.2 Mô hình MVC5

2.2.1 Các tính năng của mô hình MVC3 và MVC4

2.2.1.1 MVC3

- So với phiên bản ASP.NET MVC2 thì MVC3 đƣợc hỗ trợ thêm HTML5 và CSS3.

- Cải thiện về Model Validation – tính năng kiểm tra tính hợp lệ của dữ liệu do

ngƣời dùng nhập vào.

- Hỗ trợ 2 View Engine: RAZOR, ASPX, kể cả Open source trong khi ASP.NET

MVC2 chỉ có ASPX.

- Controller đƣợc cải tiến hơn nhƣ thuộc tính ViewBag và kiểu ActionResult.

- Cải thiện Dependency Injection với IDpendencyResolver (có 2 phần:

DependencyResolver và interface IDpendencyResolver) trong ASP.NET MVC3;

đây là lớp thực thi mô hình Service Locator, cho phép framework gọi DIContainer

khi cần làm việc với 1 lớp thực thi từ 1 kiểu cụ thể.

- Cách tiếp cận với JavaScript đƣợc hạn chế.

- Hỗ trợ caching trong Partial page.

Page 25: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

6

2.2.1.2 MVC4

- ASP.NET Web API ra đời, nhằm đơn giản hoá việc lập trình với HTML hiện đại

và đây là một cải tiến mới thay cho WCF Web API.

- Mặc định của dự án đƣợc cải thiện hơn về hình thức bố trí, giúp dễ nhìn hơn.

- Mẫu Empty Project là project trống, phù hợp cho những developer muốn nâng cao

khả năng lập trình với ASP.NET MVC4.

- Giới thiệu jQuery Mobile và mẫu Mobile Project cho dự án.

- Hỗ trợ Asynchrnous Controller.

- Kiểm soát Bundling và Minification thông qua web.config.

- Hỗ trợ cho việc đăng nhập OAuth và OpenID bằng cách sử dụng thƣ viện

DotNetOpenAuth. Cho phép Logins từ Facebook và những tài khoản khác.

- Phiên bản mới Windows Azure SDK 1.6 đƣợc phát hành.

2.2.2 Các cải tiến của MVC5

- Với MVC5 thì cải tiến hơn so với ASP.NET MVC4, Bootstrap đƣợc thay thế mẫu

MVC mặc định.

- Chứng thực ngƣời dùng Authentication Filter đƣợc tuỳ chỉnh hoặc chứng thực từ

hãng thứ 3 cung cấp.

- Với Filter overrides, chúng ta có thể Filter override trên Method hoặc Controller.

- Thuộc tính Routing đƣợc tích hợp vào MVC5.

2.2.2.1 Bootstrap.

Bootstrap là một framework CSS đƣợc Twitter phát triển. Nó là một tập hợp các bộ

chọn, thuộc tính và giá trị có sẵn để giúp web designer tránh việc lặp đi lặp lại trong

quá trình tạo ra các class CSS và những đoạn mã HTML giống nhau trong dự án

web của mình. Ngoài CSS ra, thì bootstrap còn hỗ trợ các function tiện ích đƣợc

viết dựa trên JQuery(Carousel, Tooltip, Popovers ,...)

Những lý do để sử dụng Bootstrap:

- Đƣợc viết bởi những ngƣời có óc thẩm mỹ và tài năng trên khắp thế giới. Sự

tƣơng thích của trình duyệt với thiết bị đã đƣợc kiểm tra nhiều lần nên có thể tin

Page 26: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

7

tƣởng kết quả mình làm ra và nhiều khi không cần kiểm tra lại. Vì vậy, giúp cho

dự án của bạn tiết kiệm đƣợc thời gian và tiền bạc.

- Chỉ cần biết sơ qua HTML, CSS, Javascript, Jquery là bạn có thể sử dụng

Bootstrap để tạo nên một trang web sang trọng và đầy đủ. Nhƣng lại không cần

code quá nhiều CSS.

- Với giao diện mặc định là màu xám bạc sang trọng, hỗ trợ các component thông

dụng mà các website hiện nay cần có. Vì nó là opensource nên bạn có thể vào

mã nguồn của nó để thay đổi theo ý thích của bản thân.

- Do có sử dụng Grid System nên Bootstrap mặc định hỗ trợ Responsive.

Bootstrap đƣợc viết theo xu hƣớng Mobile First tức là ƣu tiên giao diện trên

Mobile trƣớc. Nên việc sử dụng Bootstrap cho website của bạn sẽ phù hợp với

tất cả kých thƣớc màn hình. Nhờ đó mà chúng ta không cần xây dựng thêm một

trang web riêng biệt cho mobile.

- Đội ngũ phát triển Bootstrap đã bổ sung thêm tính năng Customizer. Giúp cho

designer có thể lựa chọn những thuộc tính, component phù hợp với project của

họ. Chức năng này giúp ta không cần phải tải toàn bộ mã nguồn về máy.

2.2.2.2 Authentication Filter

- Một trong những vấn đề bảo mật cơ bản nhất là đảm bảo những ngƣời dùng hợp

lệ truy cập vào hệ thống. ASP.NET đƣa ra 2 khái niệm: Authentication và

Authorize

- Authentication là xác thực ngƣời dùng, trong MVC5 Authentication Filter

đƣợc tuỳ chỉnh hoặc chứng thực từ hãng thứ 3 cung cấp.

- Khi tạo 1 Project MVC5, ngƣời dùng đƣợc lựa chọn 4 loại security:

Loại Mô tả

No Authentication Ứng dụng không hỗ trợ security

Individual User Accounts Ứng dụng sử dụng tài khoản đƣợc quản lý

bởi SQL Server hoặc từ gmail, facebook

Organizational Accounts Ứng dụng sử dụng tài khoản đƣợc quản lý

bởi Active Directory hoặc Windows

Azure Directory

Windown Authentication Ứng dụng chạy trên intranet tức sử dụng

tài khoản windows để đăng nhập

Bảng 2-3Các loại security trong MVC5

Page 27: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

8

- Mỗi loại security khác nhau sẽ phù hợp với các ứng dụng khác nhau. Khi chọn

Individual User Accounts thì ứng dụng chạy trên Internet và sử dụng SQL Server

để lƣu trữ thành viên hoặc đăng nhập từ các hệ thống khác nhƣ Google, Facebook...

Khi đó ngƣời dùng có thể đăng ký, đăng nhập, đổi mật khẩu, đăng xuất với tài

khoản cục bộ hoặc từ bên ngoài(Google, Facebook…).

- Code của AccountController có 2 sự khác biệt

o Annotation [Authorize] đƣợc sử dụng để làm cho mọi action trong controller

không thẻ truy xuất khi chƣa đăng nhập ngoại trừ action đó đƣợc đánh dấu với

annotion [AllowAnontmous].

o Thuộc tính UserManager đƣợc tạo ra trong constructor để quản lý các thành

viên. Các trang chức năng security đăng ký, đăng nhập và đổi mật khẩu đƣợc

thực hiện nhờ thuộc tính này.

2.3 Vài nét về thƣơng mại điện tử B2C

2.3.1 Khái niệm

- Mô hình B2C (Business to Consumer) - còn gọi là mô hình bán lẻ trực tuyến là mô

hình thƣơng mại điện tử diễn ra giữa doanh nghiệp và ngƣời tiêu dùng. Các công ty,

doanh nghiệp sẽ buôn bán, trao đổi hàng hóa và dịch vụ cho ngƣời tiêu dùng.

Doanh nghiệp ở đây có thể là nhà sản xuất, nhà phân phối hoặc đại lý.

- Đây là loại giao dịch quen thuộc và phổ biến nhất trong thƣơng mại điện tử xuất

phát từ những nhu cầu mua bán hàng hóa qua mạng.

2.3.2 Phân loại mô hình B2C

- Mô hình B2C đƣợc chia thành 2 loại là cửa hàng điện tử và siêu thị điện tử.

o Cửa hàng điện tử (e-store) là một trang web bán hàng hóa, dịch vụ thƣờng đƣợc

sở hữu bởi các cá nhân, nhà sản xuất, nhà bán lẻ. Một website cửa hàng điện tử

thƣờng chứa danh mục hàng hóa, dịch vụ; công cụ tìm kiếm; giỏ hàng; cổng

thanh toán; dịch vụ khách hàng...

o Siêu thị điện tử (e-mall) là một trang web chứa nhiều cửa hàng điện tử. Đặc

trƣng của siêu thị điện tử là thƣờng chứa danh bạ hàng hóa và danh mục các cửa

hàng điện tử.

Page 28: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

9

2.3.3 Hoạt động của mô hình B2C

- Mô hình B2C đƣợc áp dụng trong các mô hình siêu thị điện tử và các website bán

lẻ. Khách hàng truy cập vào website, chọn những món hàng cho mình và cung cấp

thông tin cần thiết cho việc mua hàng, chọn hình thức thanh toán và hoàn thành

thao tác đặt hàng.

2.4 Giới thiệu về hệ thống SMS

- MS API là giao thức kết nối để sử dụng các dịch vụ SMS thông

qua API(Application Programing Interface : giao diện lập trình ứng dụng). Nằm

trên nền SMS Hosting, các kết nối từ SMS API sẽ giao tiếp với nền tảng SMS

Hosting để triển khai các ứng dụng SMS.

- Việc lập trình SMS sẽ dễ dàng hơn bao giờ hết thông qua các giao thức này.

o Có thể kết nối bằng tấ tcả các ngôn ngữ lập trình thông dụng: ASP, PHP, dotNet, thậm chí có thể kết nối thông qua HTML

o Chạy đa nền : Unix, Windows, Mac.

H nh 2-2 SMS API

- Cơ chế hoạt động:

o Kết nối thông qua Web Services : POST/GET, SOAP.

o Hỗ trợ gửi tin nhắn SMS thông qua giao thức SMTP, SMPP (tích hợp vào các

ứng dụng chuẩn theo giao thức này ).

- Một số ứng dụng đƣợc xây dựng từ SMS API

o Triển khai các giải pháp SMS marketing, Mobile marketing.

o Lập trình SMS tích hợp hệ thống báo cáo, các thông tin quản lý vào website

o Hệ thống quản lý : ERP, CRM, CMS….

o Các phần mềm SMS sử dụng cho mục đích giao tiếp với khách hàng, nhân viên.

o Báo động, tin khẩn cấp, tin tức đặc biệt.

o Báo giá (chủ động gửi SMS): vàng, chứng khoán, xổ số, bóng đá…

Page 29: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

10

Chƣơng 3 - THIẾT KẾ GIAO DIỆN 3.1 Giao diện ngƣời dùng (FrontEnd)

3.1.1 Giao diện trang chủ

H nh 3-1 Màn h nh trang chủ

Page 30: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

11

3.1.2 Giao diện tìm kiếm

H nh 3-2 Màn h nh t m kiếm

H nh 3-3 Menu t m kiếm nâng cao

Page 31: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

12

3.1.3 Giao diện chi tiết sản phẩm

H nh 3-4 Màn h nh chi tiết sản phẩm

Page 32: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

13

3.1.4 Giao diện danh sách yêu thích

H nh 3-5 Màn hình danh sách yêu thích

3.1.5 Giao diện so sánh sản phẩm

H nh 3-6 Giao diện những sản phẩm trong danh sách so sánh

Page 33: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

14

H nh 3-7 Màn h nh so sánh sản phẩm

3.1.6 Giao diện Shopping Cart

H nh 3-8 Giao diện Shopping Cart trong màn h nh chính

Page 34: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

15

H nh 3-9 Màn hình Shopping Cart

3.1.7 Giao diện thanh toán

H nh 3-10 Màn hình thanh toán

Page 35: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

16

3.1.8 Giao diện quản lý đơn hàng

H nh 3-11 Màn h nh quản lý đơn hàng

H nh 3-12 Màn h nh chi tiết đơn hàng

Page 36: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

17

3.1.9 Giao diện đăng ký

H nh 3-13 Màn h nh đăng ký tài khoản

H nh 3-14 Thông báo đăng ký thành công

Page 37: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

18

3.1.10 Giao diện đăng nhập

H nh 3-15 Màn h nh đăng nhập tài khoản

3.1.11 Giao diện lấy lại mật khẩu

H nh 3-16 Màn h nh quên mật khẩu

Page 38: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

19

H nh 3-17 Màn h nh thay đổi mật khẩu

3.1.12 Giao diện liên hệ

H nh 3-18Màn h nh liên hệ

Page 39: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

20

3.1.13 Giao diện bình luận

H nh 3-19Màn h nh b nh luận

3.1.14 Giao diện chia sẻ qua Facebook

H nh 3-20 Màn h nh chia sẻ qua Facebook

H nh 3-21Kết quả hiển thị chia sẻ trên Facebook

Page 40: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

21

3.2 Giao diện quản trị website (admin)

3.2.1 Giao diện trang chủ

H nh 3-22Màn hình trang chính Admin

Page 41: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

22

3.2.2 Giao diện quản lý sản phẩm

H nh 3-23 Màn h nh danh sách sản phẩm

Page 42: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

23

H nh 3-24 Màn hình thông tin sản phẩm

H nh 3-25 Màn hình sửa sản phẩm

Page 43: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

24

H nh 3-26 Màn h nh thêm sản phảm

3.2.3 Giao diện quản lý chi tiết sản phẩm

H nh 3-27 Màn hình danh sách chi tiết sản phẩm

Page 44: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

25

H nh 3-28 Màn h nh thông tin chi tiết sản phẩm

H nh 3-29 Màn h nh sửa chi tiết sản phẩm

Page 45: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

26

H nh 3-30 Màn h nh thêm chi tiết sản phẩm

3.2.4 Giao diện quản lý nhà cung cấp

H nh 3-31Màn h nh quản lý nhà cung cấp

Page 46: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

27

3.2.5 Giao diện quản lý đặt hàng

H nh 3-32 Màn h nh danh sách đặt hàng

H nh 3-33 Màn h nh thông tin đặt hàng

Page 47: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

28

H nh 3-34 Màn h nh sửa thông tin đặt hàng

3.2.6 Giao diện quản lý phí vận chuyển

H nh 3-35Màn h nh quản lý phí vận chuyển

Page 48: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

29

3.2.7 Giao diện quản lý tài khoản

H nh 3-36 Màn h nh danh sách tài khoản

H nh 3-37 Màn h nh sửa thành viên

Page 49: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

30

H nh 3-38Màn h nh quyền hạn thành viên

3.2.8 Giao diện thống kê

H nh 3-39 Màn h nh thống kê theo nhà sản xuất

Page 50: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

31

H nh 3-40Biểu đồ doanh thu theo nhà sản xuất

H nh 3-41 Màn h nh thống kê theo mặt hàng

Page 51: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

32

H nh 3-42 Màn h nh thống kê theo khách hàng

H nh 3-43 Màn h nh thống kê danh thu theo tháng

Page 52: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

33

H nh 3-44Biểu đồ doanh thu theo tháng

3.3 Giao diện responsive

Trang web sử dụng giao diện Bootstrap nên giao diện có tính năng responsive, có

khả năng thay đổi giao diện theo kích thƣớc của màn hình (màn hình smartphone,

tablet)

3.3.1 Giao diện trang chủ

H nh 3-45 Giao diện trang chủ responsive (1)

Page 53: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

34

H nh 3-46 Giao diện trang chủ responsive (2)

H nh 3-47 Giao diện trang chủ responsive (3)

Page 54: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

35

3.3.2 Giao diện đăng ký responsive

H nh 3-48 Màn hình giao diện đăng ký responsive

3.3.3 Giao diện đăng nhập resonsive

H nh 3-49Màn hình giao diện đăng nhập resonsive

Page 55: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

36

3.3.4 Giao diện chi tiết sản phẩm

H nh 3-50Màn hình giao diện chi tiết sản phẩm(1)

H nh 3-51 Màn hình giao diện so sánh sản phẩm responsive (1)

Page 56: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

37

3.3.5 Giao diện so sánh sản phẩm responsive

H nh 3-52Màn hình giao diện so sánh sản phẩm responsive (1)

H nh 3-53Màn hình giao diện so sánh sản phẩm responsive (2)

Page 57: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

38

3.3.6 Giao diện giỏ hàng responsive

H nh 3-54Giao diện giỏ hàng trên trang chủ responsive

H nh 3-55 Màn h nh giao diện giỏ hàng responsive

Page 58: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

39

3.3.7 Giao diện loại sản phẩm responsive

H nh 3-56Màn hình giao diện loại sản phẩm responsive

3.3.8 Giao diện thanh toán responsive

H nh 3-57 Giao diện thanh toán responsive

Page 59: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

40

3.3.9 Giao diện trang chủ Admin responsive

H nh 3-58Giao diện trang chủ Admin responsive

3.3.10 Giao diện quản lý nhà cung cấp responsive

H nh 3-59 Giao diện quản lý nhà cung cấp responsive

Page 60: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

41

3.3.11 Giao diện thống kê theo nhà sản xuất responsive

H nh 3-60 Giao diện thống kê theo nhà sản xuất responsive

3.3.12 Giao diện biểu đồ doanh thu theo nhà sản xuất

H nh 3-61Màn hình giao diện biểu đồ doanh thu theo nhà sản xuất

Page 61: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

42

Chƣơng 4 - THIẾT KẾ CHƢƠNG TRÌNH VA CƠ SỞ DỮ LIỆU 4.1 Sơ đồ use case

Có đính kèo trang A3 photo

H nh 4-1Sơ đồ use case

uc

Us

e C

as

e M

o...

Qu

an

ly gio

ha

ng

Qu

an

ly loa

i sa

n

ph

am

Kh

ac

h h

an

g

Da

ng

nh

ap

Tim k

iem

sa

n p

ha

m

Da

ng

xu

at

Qu

an

ly sa

n p

ha

m

Da

ng

ky

Qu

an

ly tai k

ho

an

Tha

nh

toa

n

Ad

min

Do

i ma

t kh

au

Qu

an

ly do

n h

an

g

Qu

an

ly da

nh

sa

ch

yeu

thic

h

So

sa

nh

sa

n p

ha

m

Qu

an

ly nh

a s

an

xu

at

Tim k

iem

na

ng

ca

o

Tim k

iem

the

o te

n

Xe

m c

hi tie

t sa

n

ph

am

Tho

ng

ke

Qu

an

ly ch

i tiet s

an

ph

am

Xe

m/X

oa

da

t ha

ng

Bin

h lu

an

Qu

en

ma

t kh

au

Qu

an

ly ph

i va

n

ch

uye

n

Ch

ia s

e F

ac

eb

oo

k

Qu

an

ly qu

yen

ha

n

«e

xte

nd

»

«e

xte

nd

»

Page 62: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

43

4.2 Mô tả use case

4.2.1 Use case đăng ký

Use case Đăng ký

Mô tả chung Use case cho phép ngƣời dùng đăng ký tài

khoản.

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không

Luồng chính 1. Use case bắt đầu khi ngƣời dùng

chọn đăng ký

2. Ngƣời dùng điền thông tin cá nhận

vào form đăng ký

3. Nhấn nút đăng ký

Trƣờng hợp ngoại lệ Hệ thống sẽ không cho đăng ký nếu các

thông thông tin không hợp lệ

Trạng thái của hệ thống sau khi use case

kết thúc

Một tài khoản mới đƣợc tạo

Bảng 4-1Use case đăng ký

4.2.2 Use case đăng nhập

Use case Đăng nhập

Mô tả chung Use case cho phép ngƣời dùng đăng nhập

tài khoản có sẵn, tài khoản Google,

Facebook

Các actor liên quan Khách hàng, admin

Điều kiện tiên quyết Tài khoản đã đƣợc đăng ký

Luồng chính 1. Use case bắt đầu khi ngƣời dùng

chọn đăng nhập

2. Ngƣời dùng điền username,

password vào form đăng nhập

3. Nhấn nút đăng nhập

Trƣờng hợp ngoại lệ Hệ thống sẽ không cho đăng nhập nếu các

thông tin không hợp lệ hoặc tài khoản

không tồn tại.

Trạng thái của hệ thống sau khi use case

kết thúc

Ngƣời dùng đăng nhập thành công

Bảng 4-2: Use case đăng nhập

Page 63: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

44

4.2.3 Use case đăng xuất

Use case Đăng nhập

Mô tả chung Use case cho phép ngƣời dùng đăng xuất

tài khoản

Các actor liên quan Khách hàng, admin

Điều kiện tiên quyết Ngƣời dùng đã đăng nhập tài khoản

Luồng chính Use case bắt đầu khi khách hàng nhấn

button “Đăng xuất”

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Khách hàng đăng xuất thành công

Bảng 4-3 Use case đăng xuất

4.2.4 Use case đổi mật khẩu

Use case Đổ mật khẩu

Mô tả chung Use case cho phép ngƣời dùng đổi mật

khẩu khi biết mật khẩu cũ

Các actor liên quan Khách hàng, admin

Điều kiện tiên quyết Đã đăng nhập

Luồng chính 1. Use case bắt đầu khi ngƣời dùng

chọn đổi mật khẩu

2. User điền mật khẩu cũ, mật khẩu mới, xác nhận mật khẩu mới

3. Nhấn nút đổi mật khẩu

Trƣờng hợp ngoại lệ Hệ thống sẽ không cho đổi mật khẩu nếu

mật khẩu cũ không đúng, mật khẩu mới

không hợp lê, xác nhận mật khẩu không

chính xác

Trạng thái của hệ thống sau khi use

case kết thúc

Ngƣời dùng đổi mật khẩu thành công

Bảng 4-4: Use case đổi mật khẩu

Page 64: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

45

4.2.5 Use case lấy lại mật khẩu

Use case Đổ mật khẩu

Mô tả chung Use case cho phép ngƣời dùng thay đổi

mật khẩu khi biết tài khoản email đăng ký.

Các actor liên quan Khách hàng, admin

Điều kiện tiên quyết Đã đăng nhập

Luồng chính 1. Use case bắt đầu khi ngƣời dùng chọn “quên mật khẩu”

2. Ngƣời dùng điền tên tài khoản, tài

khoản email

3. Nhấn nút lấy lại mật khẩu

4. Ngƣời dùng copy đoạn mã gửi qua email, mật khẩu mới

5. Nhấn nút thay đổi mật khẩu

Trƣờng hợp ngoại lệ Ngƣời dùng nhập sai email đăng ký

Trạng thái của hệ thống sau khi use

case kết thúc

Ngƣời dùng đổi mật khẩu thành công

Bảng 4-5Use case quên mật khẩu

4.2.6 Use case bình luận

Use case Đăng nhập

Mô tả chung Use case cho phép ngƣời dùng bình luận

về sản phẩm bằng các tài khoản xã hội

(Facebook, Yahoo…)

Các actor liên quan Khách hàng, admin

Điều kiện tiên quyết Ngƣời dùng đã đăng nhập tài khoản xã

hội

Luồng chính Ngƣời dùng nhập nội dung bình luận và

nhấn nút “Bình luận”

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Website hiển thị nội dung bình luẩn của

ngƣời dùng

Bảng 4-6 Use case b nh luận

Page 65: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

46

4.2.7 Use case quản lý danh sách yêu thích

Use case Quản lý giỏ hàng

Mô tả chung Use case cho phép ngƣời dùng quản lý

danh sách yêu thích của khách hàng

Các actor liên quan Khách hàng

Điều kiện tiên quyết Ngƣời dùng đã đăng nhập

Luồng chính Use case bắt đầu khi ngƣời dùng chọn một

trong 3 chức năng:

1. Thêm

Nhấn nút “Yêu thích”

2. Xem

Chọn xem danh sách yêu thích

3. Xóa

Nhấn nút “xóa”

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use

case kết thúc

Sản phẩm trong danh sách yêu thích đƣợc

thêm mới hoặc đƣợc xóa.

Bảng 4-7: Use case quản lý danh sách yêu thích

4.2.8 Use case xem chi tiết sản phẩm

Use case Xem chi tiết sản phẩm

Mô tả chung Use case cho phép ngƣời dùng xem chi

tiết sản phẩm

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không có

Luồng chính Use case bắt đầu khi ngƣời dùng bấm vào

một sản phẩm

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Ngƣời dùng xem đƣợc chi tiết sản phẩm

Bảng 4-8: Use case xem chi tiết sản phẩm

Page 66: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

47

4.2.9 Use case tìm kiếm theo tên

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng tìm kiếm sản

phẩm theo tên sản phẩm

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không có

Luồng chính Use case bắt đầu sau khi ngƣời dùng

nhập thông tin vô ô tìm kiếm và nhấn

button “Search”

Trƣờng hợp ngoại lệ Không tìm đƣợc sản phẩm có tên sản

phẩn chứa nội dung khách hàng đã nhập

Trạng thái của hệ thống sau khi use case

kết thúc

Hệ thống hiển thị những sản phẩm phẩm

có tên sản phẩn chứa nội dung ngƣời

dùng đã nhập

Bảng 4-9: Use case t m kiếm theo tên

4.2.10 Use case chia sẻ Facebook

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng chia sẻ thông

tin về sản phẩm lên Facebook

Các actor liên quan Khách hàng

Điều kiện tiên quyết Ngƣời dùng đã đăng nhập tài khoản

Facebook

Luồng chính Use case bắt đầu sau khi ngƣời dùng

nhấp button “Chia sẻ”

Ngƣời dùng nhập thông tin muốn chia sẻ

lên Facebook

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Trang Facebook của ngƣời dùng hiện

thông tin chia sẻ về sản phẩm

Bảng 4-10 Use case chia sẻ Facebook

Page 67: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

48

4.2.11 Use case tìm kiếm nâng cao

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng tìm kiếm sản

phẩm đáp ứng các yêu cầu khách hàng

cần tìm về đĩa cứng, CPU, RAM

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không có

Luồng chính Use case bắt đầu sau khi ngƣời dùng lựa

chọn những combobox trong phần tìm

kiếm nâng cao

Trƣờng hợp ngoại lệ Không tìm đƣợc sản phẩm đáp ứng đƣợc

các yêu cầu ngƣời dùng đã chọn

Trạng thái của hệ thống sau khi use case

kết thúc

Hệ thống hiển thị những sản phẩm đáp

ứng đƣợc các yêu cầu ngƣời dùng đã

chọn

Bảng 4-11: Use case t m kiếm nâng cao

4.2.12 Use case so sánh sản phẩm

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng so sánh các sản

phẩm trong danh sách so sánh

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không có

Luồng chính Use case bắt đầu sau khi ngƣời dùng

chọn 1 trong 3 chức năng:

1. Thêm sản phẩm

Ngƣời dùng nhấn vào button “So

sánh” của sản phẩm

2. Xóa sản phẩm

Ngƣời dùng nhấn vào button

“Xóa” trong danh sách so sánh

3. So sánh sản phẩm

Ngƣời dùng nhấn vào button “So

sánh” trong danh sách so sánh

Trƣờng hợp ngoại lệ Khách hàng thêm sản phẩm trong khi

danh sách so sánh đã có đủ 4 sản phẩm

Trạng thái của hệ thống sau khi use case

kết thúc

Hệ thống hiển thị thông tin chi tiết của tất

cả các sản phẩm trong danh sách so sánh

Bảng 4-12: Use case so sánh sản phẩm

Page 68: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

49

4.2.13 Use case quản lý giỏ hàng

Use case Quản lý giỏ hàng

Mô tả chung Use case cho phép ngƣời dùng quản lý giỏ

hàng

Các actor liên quan Khách hàng

Điều kiện tiên quyết Không có

Luồng chính Use case bắt đầu khi ngƣời dùng chọn một

trong 4 chức năng:

1. Thêm

Nhấn nút “Mua hàng”

2. Xem

Nhấn nút “Xem giỏ” 3. Xóa

Chọn xem giỏ hàng

Nhấn nút “xóa”

4. Sửa

Chỉ cần điền số lƣợng đơn hàng vào textbox là tự động số lƣợng sản

phẩm đƣợc cập nhật

Trƣờng hợp ngoại lệ Cập nhật số lƣợng sản phẩm lớn hơn số

lƣợng sản phẩm trong kho của cửa hàng

Trạng thái của hệ thống sau khi use

case kết thúc

Giỏ hàng đƣợc thêm mới sản phẩm, hoặc

số lƣợng sản phẩm trong giỏ hàng đƣợc

cập nhật, hoặc xóa đƣợc sản phẩm

Bảng 4-13: Use case quản lý giỏ hàng

4.2.14 Use case thanh toán

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng mua các sản

phẩm đã chọn trong giỏ hàng

Các actor liên quan Khách hàng

Điều kiện tiên quyết Đã đăng nhập, giỏ hàng có sản phẩm

Luồng chính Use case bắt đầu sau khi ngƣời dùng

nhấn nút “thanh toán” trong giỏ hàng

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Hệ thống hiển thị thông tin chi tiết của

đơn hàng

Bảng 4-14: Use case thanh toán

Page 69: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

50

4.2.15 Use case xem/xóa đặt hàng

Use case Cập nhật đơn hàng

Mô tả chung Use case cho ngƣời dùng xem xóa các

đơn hàng đã đặt.

Các actor liên quan Khách hàng

Điều kiện tiên quyết Đã đăng nhập tài khoản

Luồng chính Use case bắt đầu sau khi ngƣời dùng

nhấn “Quản lý đặt hàng”

Khách hàng có thể tìm kiếm đơn hàng,

xem đơn hàng của mình, xóa đơn hàng

trong vòng 5 ngày kể từ sau khi đặt hàng

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Hệ thống hiển thị các đơn hàng của

khách hàng

Bảng 4-15 Quản lý đặt hàng

4.2.16 Use case quản lý tài khoản

Use case Quản lý tài khoản

Mô tả chung Use case cho phép admin quản lý tài

khoản khách hàng

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản admin

Luồng chính Chọn quản lý thành viên

Admin có thể thực hiện các chức năng:

1. Thêm

Nhấn link “thêm tài khoản”

Điền thông tin tài khoản mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn button “xóa”

3. Sửa

Nhấn link “ sửa”

Nhập thông tin muốn sửa

Nhấn nút sửa

Trƣờng hợp ngoại lệ Thêm tài khoản trùng hoặc thông tin điền

không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Tài khoản mới đƣợc tạo, hoặc tài khoản

đƣợc sửa, hoặc xóa đƣợc tài khoản.

Bảng 4-16: Use case quản lý tài khoản

Page 70: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

51

4.2.17 Use case quản lý sản phẩm

Use case Quản lý sản phẩm

Mô tả chung Use case cho phép admin quản lý sản

phẩm

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý sản phẩm

Use case bắt đầu khi admin chọn một

trong 4 chức năng:

1. Thêm

Nhấn link “thêm”

Điền thông tin sản phẩm mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn link “xóa”

Hiện ra màn hình xóa

Nhấn nút “xóa” 3. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 4. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết sản phâm

Trƣờng hợp ngoại lệ Thêm hoặc sửa sản phẩm không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Sản phẩm mới đƣợc tạo, hoặc sản phẩm

đƣợc sửa, hoặc xóa đƣợc sản phẩm

Bảng 4-17: Use case quản lý sản phẩm

Page 71: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

52

4.2.18 Use case quản lý chi tiết sản phẩm

Use case Quản lý sản phẩm

Mô tả chung Use case cho phép admin quản lý chi tiết

sản phẩm

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý chi tiết sản phẩm

Use case bắt đầu khi admin chọn một

trong 4 chức năng:

1. Thêm

Nhấn link “thêm”

Điền thông tin chi tiết sản phẩm mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn link “xóa”

Hiện ra màn hình xóa

Nhấn nút “xóa” 3. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 4. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết “chi tiết sản phâm”

Trƣờng hợp ngoại lệ Thêm hoặc sửa chi tiết sản phẩm không

hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Chi tiết sản phẩm mới đƣợc tạo, hoặc chi

tiết sản phẩm đƣợc sửa, hoặc xóa .

Bảng 4-18 Use case quản lý chi tiết sản phẩm

Page 72: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

53

4.2.19 Use case quản lý loại sản phẩm

Use case Quản lý loại sản phẩm

Mô tả chung Use case cho phép admin quản lý sản

phẩm

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý loại sản phẩm

Use case bắt đầu khi admin chọn một

trong 4 chức năng:

1. Thêm

Nhấn link “thêm”

Điền thông tin loại sản phẩm mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn link “xóa”

Hiện ra màn hình xóa

Nhấn nút “xóa” 3. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 4. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết loại sản phâm

Trƣờng hợp ngoại lệ Thêm hoặc sửa loại sản phẩm không hợp

lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Loại sản phẩm mới đƣợc tạo, hoặcloại sản

phẩm đƣợc sửa, hoặc xóa đƣợc loại sản

phẩm

Bảng 4-19: Use case quản lý loại sản phẩm

Page 73: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

54

4.2.20 Use case quản lý nhà sản xuất

Use case Quản lý nhà sản xuất

Mô tả chung Use case cho phép admin quản lý nhà sản

xuất

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý nhà sản xuất

Use case bắt đầu khi admin chọn một trong 4

chức năng:

1. Thêm

Nhấn link “thêm”

Điền thông tin nhà sản xuất mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn link “xóa”

Hiện ra màn hình xóa

Nhấn nút “xóa” 3. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 4. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết nhà sản xuất

Trƣờng hợp ngoại lệ Thêm hoặc sửa nhà sản xuất không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Nhà sản xuất mới đƣợc tạo, hoặc nhà sản

xuất đƣợc sửa, hoặc xóa đƣợc nhà sản xuất

Bảng 4-20: Use case quản lý nhà sản xuất

Page 74: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

55

4.2.21 Use case quản lý phí vận chuyển

Use case Quản lý nhà sản xuất

Mô tả chung Use case cho phép admin quản lý phí vận

chuyển

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý phí vận chuyển

Use case bắt đầu khi admin chọn một trong 4

chức năng:

1. Thêm

Nhấn link “thêm”

Điền thông tin phí vận chuyển mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn link “xóa”

Hiện ra màn hình xóa

Nhấn nút “xóa” 3. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 4. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết phí vận chuyển

Trƣờng hợp ngoại lệ Thêm hoặc sửa phí vận chuyển không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

phí vận chuyển mới đƣợc tạo, hoặc phí vận

chuyển đƣợc sửa, hoặc xóa đƣợc phí vận

chuyển

Bảng 4-21Use case quản lý phí vận chuyển

Page 75: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

56

4.2.22 Use case quản lý đơn hàng

Use case Quản lý nhà sản xuất

Mô tả chung Use case cho phép admin quản lý đơn

hàng

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Chọn quản lý đặt hàng

Use case bắt đầu khi admin chọn một

trong 2 chức năng:

1. Sửa

Nhấn link “ sửa”

Hiện ra màn hình sửa

Nhập thông tin muốn sửa

Nhân nút sửa 2. Xem

Nhấn button “xem”

Màn hình hiển thị chi tiết đơn hàng

Trƣờng hợp ngoại lệ Sửa đơn không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Hiển thị danh sách đơn hàng, sửa đơn hàng

Bảng 4-22 Use case quản lý đơn hàng

Use case quyền

4.2.23 Use case thống kê

Use case Xem chi tiết sản phẩm

Mô tả chung Use case cho phép admin xem thống kê của

website

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản Admin

Luồng chính Use case bắt đầu khi Admin nhấn vào các

button thống kê

Trƣờng hợp ngoại lệ Không có

Trạng thái của hệ thống sau khi use case

kết thúc

Admin xem đƣợc thống kê của website

Bảng 4-23 Use case thống kê

Page 76: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

57

4.2.24 Use case quản lý quyền hạn

Use case Quản lý tài khoản

Mô tả chung Use case cho phép admin quản lý các loại

quyền hạn

Các actor liên quan Admin

Điều kiện tiên quyết Đã đăng nhập tài khoản admin

Luồng chính Chọn quản lý quyền hạn

Admin có thể thực hiện các chức năng:

1. Thêm

Nhấn button “tạo mới”

Điền thông tin quyền hạn mới

Nhấn nút “tạo mới” 2. Xóa

Nhấn button “xóa”

3. Sửa

Nhấn button “ sửa”

Nhập thông tin muốn sửa

Nhấn nút sửa

Trƣờng hợp ngoại lệ Thêm xóa quyền hạn không hợp lệ

Trạng thái của hệ thống sau khi use

case kết thúc

Quyền hạn mới đƣợc tạo, hoặc quyền hạn

đƣợc sửa, hoặc xóa đƣợc quyền hạn

Bảng 4-24Use case quản lý quyền hạn

Page 77: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

58

4.3 Sơ đồ tuần tự (Sequence Diagram)

4.3.1 Sơ đồ tuần tự đăng ký

H nh 4-2Sơ đồ tuần tự của quá tr nh đăng ký

4.3.2 Sơ đồ tuần tự đăng nhập

H nh 4-3 Sơ đồ tuần tự của quá tr nh Login

sd Sequence_DangKy

User

MH Trang chu MH Dang ky DBMH Thong bao

dang ky thanh

cong

Click "Dang ky"()

Call()

Nhap thong tin tai khoan()

UpdateDB()

sd Sequence_Login

Khach hang

MH Trang chu MH Login DB

Click button "Dang nhap"()

Call()

Nhap acount()

GetDB()

Page 78: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

59

4.3.3 Sơ đồ tuần tự thay đổi mật khẩu

H nh 4-4 Sơ đồ tuần tự của quá trình thay đổi mật khẩu

4.3.4 Sơ đồ tuần tự lấy lại mật khẩu

H nh 4-5 Sơ đồ tuần tự của quá tr nh lấy lại mật khẩu

sd Sequence_ThayDoiMatKhau

Khach hang

MH Trang chu MH doi mat khau DB

Login()

GetBD()

Hien thi()

Click "Doi mat khau"()

Call()

Nhap mat khau hien tai, mat khau moi()

UpdateDB()

sd Sequence_LayLaiMatKh...

Khach hang

MH Trang chu MH Quen mat

khau

MH Thay doi mat

khau

DB

Click "Quen mat khau"()

Call()

Nhap ten tai khoan, dia chi email()

GetDB()

Nhap ma xac nhan, mat khau moi()

UpdateDB()

Page 79: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

60

4.3.5 Sơ đồ tuần tự tìm kiếm sản phẩm

H nh 4-6 Sơ đồ tuần tự của quá tr nh t m kiếm sản phẩn

4.3.6 Sơ đồ tuần tự quản lý danh sách yêu thích

H nh 4-7 Sơ đồ tuần tự của quá tr nh quản lý danh sách yêu thích

sd Sequence_TimkiemSanPham

DBMH Trang chu

User

Nhap tu khoa vào Textbox "Search"()

Click button "Search"()

GetDB()

Hien thi()

sd Sequence_DanhSachYeuThich

Khach hang

MH Trang chu MH Danh sach

yeu thich

DB

Login()

GetBD()

Them/Xoa san pham yeu thich()

UpdateDB()

Xem danh sach yeu thich()

GetBD()

Hien thi()

Page 80: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

61

4.3.7 Sơ đồ tuần tự so sánh sản phẩm

H nh 4-8 Sơ đồ tuần tự của quá trình so sánh sản phẩm

4.3.8 Sơ đồ tuần tự mua hàng

H nh 4-9 Sơ đồ tuần tự của quá tr nh mua hàng

sd Sequence_SoSanh

Khach hang

Trang chu DB

Them san pham()

Hien thi()

Click button "So sanh"()

GetDB()

Hien thi()

sd Sequence_Muaha...

MH Trang chu

Khach hang

DBMH phuong thuc

thanh toan

MH gio hang MH Chi tiet dat

hang

Login()

getDB()

Hien

thi()

Click button "Mua hang"()

Call()

GetDB()

Chinh sua gio

hang() GetDB()

Hien

thi()Click button "Thanh toan"()

Call()

Cap nhat

thong tin()

Click button "Thanh toan"()

UpdateDB()

Call()

Page 81: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

62

4.3.9 Sơ đồ tuần tự quản lý sản phẩm

H nh 4-10 Sơ đồ tuần tự của quá trình quản lý sản phẩm

sd Sequence_QuanLySanPham

Admin

MH Quan Ly San

Pham

MH Xem MH Sua MH Xoa MH Them DBMH Admin

alt Xem san pham

alt Sua san pham

alt Them san pham

Login()

GetDB()

Hien

thi()

Click "Quan ly san pham"()

Call()

GetDB()

Click botton

"Xem"()Call()

GetDB()

Click button "Sua"()

Call()

GetDB()

Nhap thong tin

chinh sua()UpdateDB()

Hien

thi()

Click button "Thêm"()

Call()

Nhap san pham moi()

UpdateDB()

Hien

thi()

Page 82: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

63

4.4 Cơ sở dữ liệu

4.4.1 Sơ đồ mối quan hệ giữa các thực thể

H nh 4-11 Sơ đồ mối quan hệ giữa các thực thể

AspNetR

oles

IdNam

e

AspNetU

serClaim

s

IdUserId

ClaimType

ClaimValue

AspNetU

serLogins

LoginProvider

ProviderKey

UserId

AspNetU

serRoles

UserId

RoleId

AspNetU

sers

IdFullNam

e

Activated

Email

EmailConfirm

ed

PasswordH

ash

SecurityStamp

PhoneN

umber

PhoneN

umberConfirm

ed

TwoFactorEnabled

LockoutEndDateU

tc

LockoutEnabled

AccessFailedCount

UserN

ame

CTDHMaCTD

H

MaDatH

ang

MaSP

SoLuong

Gia

Giam

Gia

CTSPMaCTSP

MaSP

CPU

RAM

DiaCung

ManH

inhRong

CamUng

DoHoa

DiaQ

uang

HDH

Pin

TrongLuo

ng

Hinh1

Hinh2

Hinh3

Hinh4

DATHANG

MaDatH

ang

Ngay

SDT

DiaChi

TongTien

TrangThai

MaKH

GiaShip

LOAISP

MaLoaiSP

TenLoaiSP

SANPHAM

MaSP

TenSP

Gia

Giam

Gia

BaoHanh

DoUuTien

Hinh

SoLuong

HoatD

ong

MaLoaiSP

MaNSX

SHIPM

aShip

Quan

Gia

WISHLIS

T

Ma

MaSP

MaUser

NHACUNGCAP

MaNSX

TenNSV

Page 83: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

64

4.4.2 Cấu trúc bảng CSDL SQL Server

4.4.2.1 Cấu trúc bảng Loại sản phẩm( LOAISP)

H nh 4-12 Bảng LOAISP

- Mô tả bảng

LoaiSP

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaLoaiSP nvarchar(128) 128 Lƣu trữ mã loại sản

phẩm

2 TenLoaiSP nvarchar(MAX) Max Lƣu trữ tên của loại

sản phẩm Bảng 4-25 Bảng LOAISP

4.4.2.2 Cấu trúc bảng Chi tiết sản phẩm (CTSP)

H nh 4-13 Bảng CTSP

Page 84: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

65

- Mô tả bảng

CTSP

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaCTSP nvarchar(8) 8 Lƣu trữ mã chi tiết

sản phẩm

2 MaSP nvarchar(6) 6 Lƣu trữ mã sản phẩn

3 CPU nvarchar(MAX) Max CPU của sản phẩm

4 RAM nvarchar(MAX) Max Mô tả RAM của sản

phẩm

5 DiaCung nvarchar(MAX) Max Mô tả dĩa cứng của

sản phẩm

6 ManHinhRong nvarchar(MAX) Max Mô tả màn hình của

sản phẩm

7 CamUng nvarchar(MAX) Max

8 DoHoa nvarchar(MAX) Max Mô tả Card đồ họa

của sản phẩm

9 DiaQuang nvarchar(MAX) Max Mô tả đĩa quang của

sản phẩm

10 HDH nvarchar(MAX) Max Mô tả hệ điều hành

của sản phẩm

11 Pin nvarchar(MAX) Max Mô tả Pin của sản

phẩm

12 TrongLuong nvarchar(MAX) Max Mô tả trọng lƣợng của

sản phẩm

13 Hinh1 nvarchar(MAX) Max Hình ảnh của sản

phẩm

14 Hinh2 nvarchar(MAX) Max Hình ảnh của sản

phẩm

15 Hinh3 nvarchar(MAX) Max Hình ảnh của sản

phẩm

16 Hinh4 nvarchar(MAX) Max Hình ảnh của sản

phẩm Bảng 4-26 Bảng CTSP

Page 85: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

66

4.4.2.3 Cấu trúc bảng Chi tiết hợp đồng (CTHĐ)

H nh 4-14 Bảng CTHD

- Mô tả bảng

CTHD

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaCTDH int Lƣu trữ mã chi tiết

hợp đồng

2 MaDatHang int Lƣu trữ mã đặt hàng

3 MaSP nvarchar(MAX) Max Lƣu trữ mã sản phẩm

4 MaPK nvarchar(MAX) Max Lƣu trữ mã phụ kiện

5 SoLuong int Số lƣợng của hợp

đồng

6 Gia nvarchar(MAX) Max Giá của hợp đồng

7 GiamGia nvarchar(MAX) Max Số tiền giảm giá Bảng 4-27 Bảng CTHD

Page 86: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

67

4.4.2.4 Cấu trúc bảng Đặt hàng (DATHANG)

H nh 4-15 Bảng DATHANG

- Mô tả bảng

DATHANG

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaDatHang int Lƣu trữ mã đặt hàng

2 Ngay datetime Ngày đặt hàng

3 SDT int Số điện thoại của

khách hàng

4 DiaChi nvarchar(MAX) Max Địa chỉ của khách

hàng

5 TongSoLuong int Tổng số lƣợng của

đơn hàng

6 TongTien float Tổng tiền của đơn

hàng

7 HuyDonHang bit Hủy đơn hàng

8 TrangThai nvarchar(MAX) Max Trạng thái của đơn

hàng

9 MaKH nvarchar(MAX) Max Mã khác hàng của

đơn hàng Bảng 4-28 Bảng DATHANG

Page 87: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

68

4.4.2.5 Cấu trúc bảng Sản phẩm (SANPHAM)

H nh 4-16 Bảng SANPHAM

- Mô tả bảng

SANPHAM

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaSP nvarchar(6) 6 Lƣu trữ mã sản phẩm

2 TenSP nvarchar(MAX) Max Tên của sản phẩm

3 Gia float Giá của sản phẩm

4 GiamGia float Số tiền giảm giá

5 BaoHanh nvarchar(MAX) Max Thời gian bảo hành

6 DoUuTien nvarchar(MAX) Max Độ ƣu tiên của sản

phẩm

7 Hinh nvarchar(MAX) Max Hình của sản phẩm

8 SoLuong int Số lƣợng sản phẩm

9 HoatDong bit Tình trạng của sản

phẩm

10 MaLoaiSP nvarchar(128) 128 Mã loại của sản phẩm

11 MaNSX nvarchar(128) 128 Mã nhà sản suất của

sản phẩm Bảng 4-29 Bảng SANPHAM

Page 88: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

69

4.4.2.6 Cấu trúc bảng WISHLIST

H nh 4-17 Bảng WISHLIST

- Mô tả bảng

WISHLIST

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaSP nvarchar(6) 6 Lƣu trữ mã sản phẩm

2 MaUser nvarchar(MAX) Max Lƣu trữ mã User Bảng 4-30 Bảng WISHLIST

4.4.2.7 Cấu trúc bảng NHACUNGCAP

H nh 4-18 Bảng NHACUNGCAP

- Mô tả bảng

NHACUNGCAP

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaNSX nvarchar(128) 128 Lƣu trữ mã nhà sản

xuất

2 TenNSX nvarchar(MAX) Max Tên của nhà sản xuất Bảng 4-31 Bảng NHACUNGCAP

Page 89: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

70

4.4.2.8 Cấu trúc bảng SHIP

H nh 4-19Bảng SHIP

- Mô tả bảng

SHIP

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 MaShip Int Lƣu trữ mã Ship

2 Quan nvarchar(MAX) Max Tên của các quận

trong thành phố

3 Gia Float Giá Ship của quận

tƣơng ứng Bảng 4-32 Bảng SHIP

4.4.2.9 Cấu trúc bảng AspNetRoles

H nh 4-20 Bảng AspNetRoles

- Mô tả bảng

AspNetRoles

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 Id nvarchar(128) 128 Mã vai trò

2 Name nvarchar(256) 256 Tên vai trò Bảng 4-33 Bảng AspNetRoles

Page 90: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

71

4.4.2.10 Cấu trúc bảng AspNetUser

H nh 4-21 Bảng AspNetUser

- Mô tả bảng

AspNetUser

Tên trƣờng Kiểu dữ liệu

Số ký

tự tối

đa

Mô tả

1 Id nvarchar(128) 128 Mã chuỗi tự tăng

2 FullName nvarchar(50) 50 Tên đăng nhập

3 Activated bit Kích hoạt

4 Email nvarchar(256) 256 Email

5 EmailConfirmed bit Xác nhận Email

6 PasswordHash nvarchar(MAX) Max Mật khẩu đã đƣợc

băm

7 SecurityStamp nvarchar(MAX) Max Hình của sản phẩm

8 PhoneNumber nvarchar(MAX) Max Điện thoại

Page 91: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

72

9 PhoneNumberConfirmed bit Xác nhận điện thoại

10 TwoFactorEnabled bit

11 LockoutEndDateUtc datetime

12 LockoutEnabled bit

13 AccessFailedCount int Số lần đăng nhập thất

bại

14 UserName nvarchar(256) 256 Tên thành viên Bảng 4-34 Bảng AspNetUser

4.4.2.11 Cấu trúc bảng AspNetUserLogins

H nh 4-22 Bảng AspNetUserLogins

- Mô tả bảng

AspNetUserLogins

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 LoginProvider nvarchar(128) 128 Tên nhà cung cấp

dịch vụ nhƣ Google,

Facebook

2 ProviderKey nvarchar(128) 128 Khóa đại diện cho nhà

cung cấp(url)

3 UserId nvarchar(128) 128 Mã thành viên

Bảng 4-35 Bảng AspNetUserLogins

Page 92: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

73

4.4.2.12 Cấu trúc bảng AspNetUserRoles

H nh 4-23 Bảng AspNetUserRoles

- Mô tả bảng

AspNetUserRoles

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 UserId nvarchar(128) 128 Mã thành viên

2 RoleId nvarchar(128) 128 Mã vai trò Bảng 4-36 Bảng AspNetUserRoles

4.4.2.13 Cấu trúc bảng AspNetUserClaims

H nh 4-24 Bảng AspNetClaims

- Mô tả bảng

AspNetUserClaims

Tên trƣờng Kiểu dữ liệu

Số ký tự

tối đa

Mô tả

1 Id int Khóa chính

2 UserId nvarchar(128) 128 Mã thành viên

3 ClaimType nvarchar(MAX) Max Kiểu Claim

4 ClaimValue nvarchar(MAX) Max Giá trị Claim Bảng 4-37 Bảng AspNetClaims

Page 93: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

74

Chƣơng 5 KẾT QUẢ SO SÁNH THỰC NGHIỆM PH N T CH

TỔNG HƠP

5.1 Kết quả đạt đƣợc

Đã xây dựng hoàn chỉnh ứng dụng dựa trên mô hình MVC trên framework ASP.NET vào website, với đầy đủ các chức năng cơ bản:

a. Chức năng dành cho ngƣời dùng:

1) Đăng nhập, đăng xuất 2) Đăng ký

3) Đổi mật khẩu

4) Lấy lại mật khẩu

5) Tìm kiếm theo tên sản phẩm

6) Tìm kiếm nâng cao

7) Xem chi tiết sản phẩm

8) Bình luận, chia sẻ qua Facebook

9) Thanh toán có tính phí vận chuyển trong khu vực TPHCM

10) Lập danh sách yêu thích

11) So sánh sản phẩm

12) Quản lý giỏ hàng

13) Quản lý đặt hàng

14) Đặt hàng

15) Nhận tin nhắn SMS xác nhận đơn hàng đã đặt thành công.

b. Chức năng dành cho Admin: 1) Đăng nhập, đăng xuất 2) Đổi mật khẩu

3) Lấy lại mật khẩu

4) Quản lý loại sản phẩm

5) Quản lý sản phẩm

6) Quản lý đơn hàng

7) Quản lý nhà sản xuất 8) Quản lý đặt hàng

9) Quản lý phí vận chuyển

10) Quản lý tài khoản

11) Quản lý quyền hạn tài khoản

12) Thống kê Ứng dụng sms vào website cho chức năng nhắn tin thông báo khi khách hàng đặt

hàng thành công.

Áp dụng giao diện Bootstrap nên website có thể tƣơng thích với các kích thƣớc màn

hình khác nhau (máy tính, máy tính bảng, điện thoại di động).

Page 94: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

75

5.2 Thực nghiệm

Website đã đƣợc uphost và triển khai cho khách hàng sử dụng, tuy nhiên website vẫn chƣa đƣợc phổ biến rộng rãi.

Địa chỉ website là: http://shopmaytinh.somee.com/

Chƣơng 6 KẾT LUẬN

6.1 Ƣu và khuyết điểm

Ƣu điểm:

- Giúp ngƣời dùng xem và đặt sản phẩm dễ dàng, thuận tiện.

- Có tính ứng dụng cao.

- Website có tính năng responsive.

Nhƣợc điểm:

- Tốc độ thực thi và hiệu suất của hệ thống chƣa cao

6.2 Hƣớng phát triển

Làm thêm một số chức năng mở rộng, phát triển thêm một số chức năng mới:

- Quản lý khách hàng theo nhóm ( vd: Khách hàng VIP, khách hàng thƣờng,…)

- Nâng cao tốc độ thực thi và hiệu suất của hệ thống.

- Nâng cao tính năng bảo mật của hệ thống.

- Nâng cấp hệ thống phí vận chuyển trên toàn nƣớc

Đồ án tốt nghiệp của chúng em không thể tránh đƣợc những khiếm khuyết, rất

mong đƣợc sự tham gia góp ý của Quý Thầy Cô.

Nhóm em xin chân thành cảm ơn!

Page 95: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

1

TÀI LIỆU THAM KHẢO

Tiếng Việt

[1] Nguyễn Tuấn Anh (21/9/2013), “Làm quen với mô hình MVC4

ASP.NET”.

http://nguyentuananhtn.blogspot.com/2013/09/bai-1-lam-quen-voi-mo-

hinh-mvc-4-aspnet.html

[2] Đào Hải Nam (21/7/2013), “Bắt đầu với mô hình ASP.NET MVC5”

http://namdh.wordpress.com/2013/07/23/getting-started-with-asp-net-

mvc-5/

[2] FIBOSMS (2009), “SMS API là gì?”.

http://www.fibosms.com/sms-api-la-gi/

[3] Lập trình ASP.NET MVC.

http://www.slideshare.net/tuoitrecomvn/lap-trinhaspnetmvc

[4] Tổng quan về công nghệ SMS

http://www.thegioitongdai.com.vn/khuyen-mai/tu-van-lap-dat-tong-

dai/tong-quan-cong-nghe-sms/87.html

[5] Tài liệu về thƣơng mại điện tử

http://aitech.edu.vn/thu-vien-tai-lieu/thuong-mai-dien-tu-c82.html

Tiếng Anh

[1] Jon Galloway, Phil Haack, Brad Wilson, K.Scott Allen, Scott Hanselman

(2012), “Proffessional ASP.NET MVC4”, John Wiley & Sons, Inc.

10475 Crosspoint Boulevard Indianapolis, IN 46256

[2] Jose Guay Paz (2013), “Beginning ASP.NET MVC5”, Apress, LLC 233

Spring Street New York, NY 10013

[3] Bryan P. Johnson, John Earl Clark (4/2013), “Creating Mobile Apps

with Sencha Touch 2”, Packt Publishing Ltd. Livery Place35 Livery

Street Birmingham B3 2PB, UK

[4] Adrian Kosmaczewski (14/6/2012), “Mobile JavaScript Application

Development”, O’Reilly Media, Inc., 1005 Gravenstein Highway North,

Sebastopo.f

[5] Learn about ASP.NET MVC

http://www.asp.net/mvc/overview/getting-started

Page 96: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

2

Chƣơng 7 PHỤ LỤC

7.1 Cài đặt ứng dụng

- Sử dụng SQL Server 2012

Import cơ sở dữ liệu vào SQL Server

Bƣớc 1: Mở Microsoft SQL Server Management, kết nối vào server, chọn file open

file.

Bƣớc 2: Chọn đƣờng dẫn đến file Database/DBmaytinh.sql

Page 97: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

3

Bƣớc 3: Nhấn click vào Execute hoặc phím F5 để tạo Database.

Chỉnh sửa cấu hình file config của project

Bƣớc 1: Khởi động visual studio 2012.

Bƣớc 2:Mở file ShopMayTinh.sln.

Bƣớc 2: Bên tay phải chọn cửa sổ Solution Explorer kéo xuống dƣới cùng chọn file

web.config:

Page 98: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

4

Bƣớc 3: Chỉnh cấu hình file web.config.

Nhấn double click vào Web.config sau đó tìm đến thẻ <connectionStrings> trên dòng

<add name=" DBMayTinhContext " tìm đến data source= “tên sqlserver” vào:

Bƣớc 4: Sau đó ta có thể chạy chƣơng trình.

Page 99: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

5

7.2 Cài đặt up host

Đăng ký tài khoản somee.com

- Truy cập vào trang https://somee.com/

- Chọn trang đăng ký thông tin tài khoản somee.com, nếu đã có tài khoản thì bạn

đăng nhập trực tiếp vào. Nếu chƣa có thì bạn đăng kí tài khoản mới.

- Sau khi đăng ký thông tin thành công hệ thống gửi email về cho bạn mã xác nhận

đăng kí tài khoản. Bạn hãy vào email kiểm tra.

Page 100: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

6

- Copy mã xác nhận để hoàn thành đăng ký tài khoản somee.com.

- Đăng nhập vào trang somee.com, trình duyệt sẽ chuyển qua trang quản lý host

somee sau đó vào phần shopping, bạn chọn checkout.

- Check vào hai tùy chọn nhƣ hình sau đó chọn continue.

- Trở về trang quản lý host.

Page 101: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

7

Tạo tên miền cho website

- Chọn create new website sau đó xuất hiện hộp thoại.

- Nhập các thông tin cần thiết, chọn Create website. Trang web thông báo tạo website

thành công.

Page 102: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

8

Hƣớng dẫn Upload website lên web

- Chọn manage website chọn file manage xuất hiện hộp thoại:

- Sau đó click vào phần upload. Chọn file web đã zip. Chọn “Upload and Unzip

archives”.

Đƣa cơ sở dữ liệu vừa tạo lên web

- Qua phần “Manager database” chọn “Create empty database” trong menu quản lý

trang web.

Page 103: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

9

- Nhập các thông tin cần thiết. Chọn “Create empty database” ” nếu thành công thì

xuất hiện hộp thoại:

- Chọn “New SQL query from file” xuất hiện giao diện load file.

- Tiếp theo chọn file script để tải lên rồi chọn “Upload the file and execute it” nếu

thành công thì xuất hiện hộp thoại:

- Sau đó nhấn “click here to manager the database”, thông tin của database xuất hiện,

copy connection string để dán vào connection string trong file web.config.

Page 104: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

10

- Sau đó sửa file web.config trong vào phần quản lí file manager.

Page 105: TRƢỜNG ĐẠI HỌC SƢ PHẠM KỸ THUẬT THÀNH PHỐ HỒ …docshare01.docshare.tips/files/25214/252143646.pdf · hồ chí minh, tháng 1 năm 2015. c ... nhiỆm v è ĐỒ

11

7.3 Các tài khoản sử dụng trong đồ án

1. Tài khoản Admin

Tài khoản Admin

Tên tài khoản Mật khẩu Vai trò

Admin 123456 Administrator

2. Tài khoản ngƣời dùng

Tài khoản ngƣời dùng

Tên tài khoản Mật khẩu Vai trò

luan123 123456 User

3. Tài khoản eSMS hosting

4. Tài khoản host somee

Tài khoản ngƣời dùng

Tên đăng nhập Mật khẩu Link host

nguyenluancntt11 Nguyenluan1911 http://shopmaytinh.somee.com/

Tài khoản eSMS hosting

Tên tài khoản Mật khẩu

[email protected] 123456