BÁO cáo môn học lập TRÌNH WEB và ỨNG DỤNG đề TÀIWEBSITE bán máy TÍNH

TRƯỜNG ĐẠI HỌC TÔN ĐỨC THẮNG BAN CĐTH – TCCN NGÀNH : CÔNG NGHỆ THÔNG TIN -oOo - BÁO CÁO MƠN HỌC LẬP TRÌNH WEB VÀ ỨNG DỤNG ĐỀ TÀI:WEBSITE BÁN MÁY TÍNH GVHD: DZOAN XUÂN THANH SVTH: TRẦN QUỐC TRUNG _19607084 Lớp: 19607211 Khoá: 196 THÀNH PHỐ HỒ CHÍ MINH, NĂM 2021 LỜI NĨI ĐẦU Ngày Cơng nghệ thơng tin đóng vai trị quan trọng phát triển kinh tế - xã hội quốc gia, chiếm vị trí quan trọng lĩnh vực đời sống, trở thành động lực phát triển kinh tế - xã hội, đưa giới chuyển từ kỷ nguyên công nghiệp sang kỷ nguyên thông tin phát triển kinh tế tri thức Đối với tổ chức nào, từ doanh nghiệp đến tổ chức phủ, giải tốn nhằm tối ưu hóa hoạt động nghiệp vụ, kinh doanh quản lý dựa sở ứng dụng Công nghệ thông tin yêu cầu quan trọng đặt hàng đầu Trong thời đại bùng nổ Công nghệ thông tin xu hướng phát triển kinh tế mạnh mẽ nay, nhu cầu thiết kế quản trị Website cho cá nhân tổ chức, quan, trở thành nhu cầu cấp bách Chính thiết kế quản trị Website ngày nhiều người yêu thích chọn làm hướng riêng cho Với kiến thức học thiết kế website, đồ án tốt nghiệp em phát triển xây dựng đề tài "Xây dựng website bán máy tính trực tuyến cơng nghệ ASP.NET" Xin chần thành cảm ơn! LỜI CẢM ƠN Để hoàn thành báo cáo này, em nhận hướng dẫn, giúp đỡ góp ý nhiệt tình q thầy Dzoan Xn Thanh – Giảng viên mơn Lập trình Web ứng dụng- Trường Đại Học Tôn Đức Thắng Em xin gửi lời biết ơn sâu sắc đến thầy Dzoan Xuân Thanh dành nhiều thời gian tâm huyết hướng dẫn nghiên cứu giúp em hoàn thành báo cáo cuối kì Em xin chân thành cảm ơn đến quý thầy cô Ban Cao Đẳng-Trung Cấp Chuyên Nghiệp Đại Học, Trường Tôn Đức Thắng, đặc biệt thầy tận tình dạy bảo cho em suốt thời gian học tập trường Em xin chân thành cảm ơn Ban Giám Hiệu Ban Cao Đẳng-Trung Cấp Chuyên Nghiệp Đại Học Tôn Đức Thắng quý thầy cô Khoa Công Nghệ Thông Tin tạo nhiều điều kiện để em học tập hoàn thành tốt khóa học Em có nhiều cố gắng hồn thiện báo cáo cuối học kì tất lực mình, nhiên khơng thể tránh khỏi nhiều thiếu sót, mong nhận đóng góp q báu q thầy bạn TP.HCM, ngày tháng Sinh viên thực năm 2021 TÁC GIẢ CAM KẾT Tôi xin cam kết báo cáo hoàn thành dựa kết nghiên cứu kết nghiên cứu chưa dùng cho báo cáo cấp khác TP.HCM, ngày tháng năm 2021 Người thực NHẬN XÉT CỦA GIẢNG VIÊN TP.HCM, ngày tháng năm 2021 Chữ ký giảng viên Họ tên giảng viên MỤC LỤC LỜI NÓI ĐẦU LỜI CẢM ƠN CHƯƠNG 1:CƠ SỞ LÝ THUYẾT 1.1.ASP.NET MVC gì? 1.2.Cơ chế hoạt động ASP.NET MVC 10 1.3.Những ưu điểm ASP.NET MVC 10 1.4.So sánh ASP.NET Webform với ASP.NET MVC 11 CHƯƠNG 2:PHÂN TÍCH THIẾT KẾ HỆ THỐNG 13 2.1 Mô tả dự án 13 2.2.Actor Use Cases 14 2.2.1.Xác định Actor 14 2.2.2.Xác định USE-CASE 14 2.3.Bản vẽ USE-CASE 15 2.4.Đặc tả USE-CASE 18 2.4.1.Use case “Khách hàng tiềm năng” 18 2.4.1.Use case “Khách hàng” 18 2.4.2.Use case “Người bán hàng” 19 2.4.3.Use case “Quản lý bán hàng” 19 2.4.4.Use case “Quản lý hệ thống” 20 2.5.Sơ Đồ Tuần Tự 21 2.5.1.Đăng nhập 21 2.5.2.Tìm kiếm 21 2.5.3.Thêm Sản Phẩm 22 2.5.4.Quản lý khách hàng 22 2.6.Sơ Đồ Hoạt Động 23 2.6.1.Đăng ký 23 2.6.2.Đăng nhập 23 2.6.3.Thêm sản phẩm 24 2.6.4.Sửa thông tin sản phẩm 24 2.6.5.Tìm kiếm sản phẩm 25 2.6.6.Xem giỏ hàng 25 2.7.Thiết kế liệu 26 2.8.1.Hệ thống xây dựng 27 CHƯƠNG 3:CÀI ĐẶT HỆ THỐNG 28 3.4.Giao diện đăng nhập 29 3.5.Giao Diện Giỏ Hàng 30 3.6.Giao Diện Thống Kê ADMIN 30 3.7.Giao Diện Quản Lý Khách 31 3.8.Trang quản lí đơn hàng 31 Chương 4: TỔNG KẾT 32 4.1.Kết đạt được: 32 4.2.Các chức hoàn thành 32 4.3.Các chức phát triển 33 TÀI LIỆU THAM KHẢO 34 DANH MỤC HÌNH ẢNH Hình 0-1: Mơ Hình ASP.NET MVC Hình 0-2:Bảng Mơ Tả Các Phiên Bản Của ASP.NET MVC Hình 0-3:Cơ Chế Hoạt Động ASP.NET MVC 10 Hình 0-1:Sơ đồ Use Case Khách Hàng Tiềm Năng 16 Hình 0-2:Sơ Đồ Use Case Khách Hàng 16 Hình 0-3:Sơ Đồ Use Case Người Bán Hàng 17 Hình 0-4:Sơ Đồ Use Case Quản Lý Hệ Thống 17 Hình 0-5:Sơ Đồ Use Case Quản Lý Bán Hàng 18 Hình 0-6:Sơ Đồ Tuần Tự Đăng Nhập 21 Hình 0-7:Sơ Đồ Tuần Tự Tìm Kiếm 21 Hình 0-8:Sơ đồ Tuần Tự Thêm Sản Phẩm 22 Hình 0-9:Sơ Đồ Tuần Tự Quản Lý Khách Hàng 22 Hình 0-10: Sơ Đồ Hoạt Động Đăng Ký 23 Hình 0-11: Sơ Đồ Hoạt Động Đăng Nhập 23 Hình 0-12:Sơ Đồ Hoạt Động Thêm Sản Phẩm 24 Hình 0-13:Sơ Đồ Hoạt Động Sửa Thông Tin Sản Phẩm 24 Hình 0-14:Sơ Đồ Hoạt Động Tìm Kiếm Sản Phẩm 25 Hình 0-15:Sơ Đồ Hoạt Động Xem Giỏ Hàng 25 Hình 0-16: Sơ Đồ Trạng Thái Giỏ Hàng Error! Bookmark not defined Hình 0-1:Giao diện trang chủ 28 Hình 0-2:Giao diện chi tiết sản phẩm 28 Hình 0-3:Giao diện đăng ký 29 Hình 0-4:Giao diện đăng nhập 29 Hình 0-5:Giao Diện Giỏ Hàng 30 Hình 0-6:Giao diện Admin 30 Hình 0-7:Giao diện quản lí khách hàng 31 Hình 0-8:Giao diện quản lí đơn hàng 31 CHƯƠNG 1:CƠ SỞ LÝ THUYẾT 1.1.ASP.NET MVC gì? ASP.NET MVC framework tuyệt vời hỗ trợ pattern MVC cho ASP.NET Nếu bạn muốn hiểu ASP.NET MVC làm việc nào, bạn cần phải có hiểu biết rõ ràng mơ hình MVC MVC cụm từ viết tắt odel-View-Controller, phân chia pattern ứng dụng thành phần - model, controller view Hình 0-1: Mơ Hình ASP.NET MVC  Model giúp lưu trữ liệu ứng dụng trạng thái Nó sở liệu tập tin XML  View coi giao diện người dùng sử dụng khách truy cập trang web bạn để nhìn thấy liệu Các trang ASPX thường sử dụng để hiển thị view ứng dụng ASP.NET MVC  Controller chịu trách nhiệm xử lý tương tác người dùng với trang web Nó sử dụng để xác định loại view cần phải hiển thị Controller sử dụng cho mục đích giao tiếp với model Hình 0-2:Bảng Mơ Tả Các Phiên Bản Của ASP.NET MVC Qua hình mơ tả phía cho bạn thấy ASP.Net MVC đời năm 2009 mà tính tới năm 2013 nâng cấp lên tới phiên ASP.Net MVC 5, ưu điểm ông lớn Microsoft cập nhật công nghệ liên tục Mới ASP.Net cho đời cơng nghệ ASP.Net core 1.0 Với cập nhật thường xuyên giúp cho ASP.Net MVC ngày phát triển mạnh mẽ không thua cơng nghệ lập trình web sử dụng Java PHP 1.2.Cơ chế hoạt động ASP.NET MVC Hình 0-3:Cơ Chế Hoạt Động ASP.NET MVC Dựa vào hình mơ phía khái q sơ qua chế hoạt động ASP.Net MVC User gửi yêu cầu tới server cách truyền vào URL browser Yêu cầu gửi tới controller đầu tiên, controller xử lý yêu cầu, yêu cầu cần truy xuất liệu controller chuyển qua tầng model Tại tầng model, liệu truy xuất từ database sau truyền qua view thông qua controller Controller giúp liệu chuyển từ model qua view View tầng cuối giao tiếp với User, liệu hiển thị cho User thông qua tầng View 1.3.Những ưu điểm ASP.NET MVC Do sử dụng mơ hình MVC nên ASP.Net MVC tách biệt tầng mơ hình lập trình web giúp tối ưu ứng dụng dễ dàng việc viết code, giao diện 10 2.4.4.Use case “Quản lý hệ thống” Quản lý hệ thống Tên USE-CASE Mô tả Có thể cấp quyền tài khoản , cấu hình hệ thống website Điều kiện kích hoạt Đăng nhập hợp lệ Tiền điều kiện Actor phải đăng nhập vào hệ thống Hậu điều kiện Nếu use case thành công, thông tin thêm, cập nhật xóa khỏi hệ thống Ngược lại, trạng thái không thay đổi Luồng kiện Hệ thống yêu cầu actor chọn chức muốn thực (Thêm nhân viên, Cập nhật thông tin nhân viên, Xóa nhân viên) Sau actor cung cấp thông tin yêu cầu, luồng phụ sau thực Nếu chọn “Thêm thông tin nhân viên”, luồng phụ Thêm nhân viên thực Nếu chọn “Cập nhật thông tin nhân viên”, luồng phụ Cập nhât thông tin nhân viên thực Nếu chọn “Xóa thơng tin nhân viên”, luồng phụ Xóa nhân viên thực 20 Kết thúc 2.5.Sơ Đồ Tuần Tự 2.5.1.Đăng nhập Hình 0-6:Sơ Đồ Tuần Tự Đăng Nhập 2.5.2.Tìm kiếm Hình 0-7:Sơ Đồ Tuần Tự Tìm Kiếm 21 2.5.3.Thêm Sản Phẩm Hình 0-8:Sơ đồ Tuần Tự Thêm Sản Phẩm 2.5.4.Quản lý khách hàng Hình 0-9:Sơ Đồ Tuần Tự Quản Lý Khách Hàng 22 2.6.Sơ Đồ Hoạt Động 2.6.1.Đăng ký Hình 0-10: Sơ Đồ Hoạt Động Đăng Ký 2.6.2.Đăng nhập Hình 0-11: Sơ Đồ Hoạt Động Đăng Nhập 23 2.6.3.Thêm sản phẩm Hình 0-12:Sơ Đồ Hoạt Động Thêm Sản Phẩm 2.6.4.Sửa thơng tin sản phẩm Hình 0-13:Sơ Đồ Hoạt Động Sửa Thông Tin Sản Phẩm 24 2.6.5.Tìm kiếm sản phẩm Hình 0-14:Sơ Đồ Hoạt Động Tìm Kiếm Sản Phẩm 2.6.6.Xem giỏ hàng Hình 0-15:Sơ Đồ Hoạt Động Xem Giỏ Hàng 25 2.7.Thiết kế liệu  Sơ đồ class diagram: 26 2.8.1.Hệ thống xây dựng  Sơ đồ hình 27 CHƯƠNG 3:CÀI ĐẶT HỆ THỐNG 3.1 Giao Diện Trang Chủ Hình 0-1:Giao diện trang chủ - Trang chủ bán hàng dùng để hiển thị sản phẩm theo style khác 3.2 Trang Chi Tiết Sản Phẩm Hình 0-2:Giao diện chi tiết sản phẩm 28 - Hiển thị thông tin chi tiết sản phẩm cấu hình, giá bán, thơng tin mô tả, thông số kĩ thuật nút chức thêm vào giỏ hàng 3.3 Giao Diện Đăng Ký Hình 0-3:Giao diện đăng ký - Trang đăng ký dành cho thành viên chưa có tài khoản Có mã captcha để xác nhận 3.4.Giao diện đăng nhập Hình 0-4:Giao diện đăng nhập 29 3.5.Giao Diện Giỏ Hàng Hình 0-5:Giao Diện Giỏ Hàng - Hiển thị sản phẩm thêm vào giỏ hàng có chức chỉnh sửa số lượng sản phẩm xóa sản phẩm Bấm đặt hàng đủ thông tin khách hàng đăng nhập 3.6.Giao Diện Thống Kê ADMIN Hình 0-6:Giao diện Admin 30 3.7.Giao Diện Quản Lý Khách Hình 0-7:Giao diện quản lí khách hàng - Hiển thị danh sách thành viên hệ thống có chức thêm, xóa , sửa thành viên 3.8.Trang quản lí đơn hàng Hình 0-8:Giao diện quản lí đơn hàng Hiển thị danh sách đơn nhập hàng chưa toán, chưa giao toán, giao tốn Và có chức duyệt đơn hàng để cập nhật trạng thái đơn hàng 31 Chương 4: TỔNG KẾT 4.1.Kết đạt được: + Cơ nắm bước để xây dựng website bán điện tử trực tuyến, thực yêu cầu tiện ích người dùng +Tìm hiểu nắm rõ công cụ để xây dựng website:SQL,Visual Studio + Xây dựng hệ thống có bố cục trang hợp lý ,tiện lợi cho khách hàng,bước đầu thực nghiệp vụ hệ thống + Website giúp người dùng tiết kiệm thời gian, cơng sức để có sản phẩm ưng ý Dễ dàng quản lý thông tin chi tiết người dùng, thông tin sản phẩm đơn hàng người mua sản phẩm từ thuận tiện cho việc tốn giao hàng + Thực kiểm thử phần mềm mức độ lập trình 4.2.Các chức hồn thành *Đồ án thực giai đoạn 1: -Thêm giỏ hàng, xóa sửa chi tiết giỏ hàng, đặt hàng -Đăng ký, đăng nhập -Hiển thị danh sách sản phẩm theo loại, theo nhà sản xuất -Thống kê liệu -Phân quyền quản lý quyền -Quản lý tài khoản -Quản lý đơn đặt hàng -Quản lí banner -Quản lí menu -Quản lý sản phẩm, loại sản phẩm, nhà sản xuất 32 4.3.Các chức phát triển - Thêm ưu đãi cho hội viên - Bình luận sản phẩm - Tìm kiếm trang quản lý - Xác thực yếu tố qua gmail điện thoại đăng ký, quên mật khẩu, mã hóa mật - Áp dụng async & await để tối ưu hóa trang web - Thêm sơ đồ trang dashboard - Dùng attribute routing để đường dẫn chuẩn seo - Áp dụng design pattern để hệ thống dễ quản lý code dễ mở rộng 33 TÀI LIỆU THAM KHẢO [1] Ths.Nguyễn Minh Đạo, Gíao trình Lập Trình Web với ASP.NET, NXB Đại Học Quốc Gia TP Hồ Chí Minh,năm 2014 [2] Tedu, Khóa học lập trình ASP.NET MVC [3] Đỗ Lâm Thiên, Giáo trình ứng dụng web với ASP.NET,NXB Đại Học Quốc Gia, năm 2005 34 ... kế quản trị Website ngày nhiều người yêu thích chọn làm hướng riêng cho Với kiến thức học thiết kế website, đồ án tốt nghiệp em phát triển xây dựng đề tài "Xây dựng website bán máy tính trực tuyến... ơn! LỜI CẢM ƠN Để hoàn thành báo cáo này, em nhận hướng dẫn, giúp đỡ góp ý nhiệt tình quý thầy Dzoan Xuân Thanh – Giảng viên mơn Lập trình Web ứng dụng- Trường Đại Học Tôn Đức Thắng Em xin gửi... MVC Do sử dụng mơ hình MVC nên ASP.Net MVC tách biệt tầng mơ hình lập trình web giúp tối ưu ứng dụng dễ dàng việc viết code, giao diện 10 Giao diện ASP.Net MVC sử dụng công nghệ thiết kế web HTML,