thiết kế và xây dựng website giới thiệu và bán motor – xe máy cho cửa hàng xe máy cao sơn

TRƯỜNG ĐẠI HỌC CÔNG NGHỆ GIAO THÔNG VẬN TẢI KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN TỐT NGHIỆP TÊN ĐỀ TÀI: THIẾT KẾ VÀ XÂY DỰNG WEBSITE GIỚI THIỆU VÀ BÁN MOTOR – XE MÁY CHO CỬA HÀNG XE MÁY CAO SƠN GIẢNG VIÊN HƯỚNG DẪN: VŨ VIỆT DŨNG SINH VIÊN THỰC HIỆN: TẠ MẠNH TIỀN LỚP: 66DCHT21 CHUYÊN NGÀNH: HỆ THỐNG THÔNG TIN HÀ NỘI 2019 LỜI CẢM ƠN Sau trình học tập nghiên cứu trường Đại học Công nghệ Giao thông vận tải, hỗ trợ giúp đỡ từ quý thầy cô Trước tiên, em xin phép gửi lời cảm ơn chân thành đến Th.S Vũ Việt Dũng, giảng viên Trường Cao đẳng Du lịch Hà Nội, người tận tình hướng dẫn, khuyến khích, bảo tạo điều kiện tốt cho em từ bắt đầu hồn thành đồ án Em xin chân thành cảm ơn Ban giám hiệu nhà trường thầy cô khoa Công nghệ thông tin cung cấp kiến thức, đào tạo tận tình tạo điều kiện tốt cho em suốt trình học tập nghiên cứu Trường Em xin gửi lời cảm ơn đến thành viên lớp, người bên em, học tập rèn luyện động viên em q trình hồn thành đồ án Trong q trình hồn thành đồ án nhiều thiếu sót, em mong nhận lời nhận xét, góp ý, bảo từ thầy để hồn thiện đồ án tốt Em xin chân thành cảm ơn ! Hà Nội, ngày … tháng 06 năm 2019 Sinh viên thực LỜI CAM ĐOAN Em xin cam đoan đồ án công trình nghiên cứu riêng em hướng dẫn Th.S Vũ Việt Dũng, giảng viên Trường Cao đẳng Du lịch Hà Nội Các nội dung nghiên cứu, kết đề tài trung thực, không chép tài liệu chưa công bố nội dung đâu Các nguồn trích dẫn có thích rõ ràng, có tính kế thừa, phát triển từ tài liệu website Em xin chịu trách nhiệm lời cam đoan Em xin chân thành cảm ơn! Hà Nội, ngày … tháng … năm 2019 Sinh viên thự TÓM TẮT Hiện với phát triển không ngừng thương mại điện tử, nhu cầu mua bán trực tuyến người ngày tăng Các website thương mại điện tử dần thay phương pháp mua bán truyền thống có ưu điểm giúp người giảm thời gian mà giảm chi phí cho vấn đề giao dịch Nhờ có phát triển vượt bậc công nghệ thông tin website thương mại điện tử mà việc kinh doanh buôn bán ngày dễ dàng Mục tiêu xây dựng đồ án nhằm giúp cho khách hàng nắm rõ tìm hiểu dòng xe máy – motor thị trường Việt Nam thông qua viết giới thiệu sản phẩm tin tức Khách hàng đặt mua xe trực tiếp từ xa thông qua mạng internet website thương mại điện tử Dù đâu, khách hàng tham khảo thơng tin sản phẩm cần, lựa chọn cho mẫu xe ưa thích, phục hợp với nhu cầu sử dụng thân, giúp cho việc mua sắm nhanh gọn, tiện ích tiết kiệm thời gian Hệ thống có chức tìm kiếm dễ dàng, giao diện dễ sử dụng Khách hàng chủ động tương tác với hệ thống mua tạo đơn hàng Để xây dựng website hoàn chỉnh em lên kế hoạch xây dựng đầy đủ chức năng: quản lý người dùng, quản lý đơn hàng, quản lý sản phẩm Dành cho khách hàng có nhiều chức thú vị tìm kiếm sản phẩm, chức giỏ hàng toán Bố cục đồ án em gồm chương: CHƯƠNG 1: TỔNG QUAN Chương phần tổng quan, giới thiệu lý chọn đề tài, mục tiêu đề tài, giới hạn phạm vi đề tài, kết dự kiến đạt CHƯƠNG 2: CƠ SỞ LÝ THUYẾT Chương hai, trình bày sở lý thuyết dùng để xây dựng đồ án lý thuyết phân tích thiết kế hướng đội tượng UML, ngơn ngữ lập trình HTML, CSS, PHP, Javascript, Framework Bootstrap, Laravel, jQuery hệ sở liệu MySQL, số công cụ sử dụng hỗ trợ làm đồ án Git, XAMPP, PhpStorm CHƯƠNG 3: PHÂN TÍCH VÀ THIẾT KẾ Chương ba trình bày phân tích thiết kế hệ thống theo phương pháp luận hướng đối tượng gồm phần: khảo sát hệ thống, phân tích thiết kế hệ thống, thiết kế CSDL CHƯƠNG 4: XÂY DỰNG CHƯƠNG TRÌNH Chương bốn xây dựng chương trình gồm: xây dựng hệ thống, kết đạt phương hướng phát triển MỤC LỤC LỜI CẢM ƠN LỜI CAM ĐOAN MỤC LỤC DANH MỤC BẢNG DANH MỤC HÌNH ẢNH THUẬT NGỮ VIẾT TẮT 10 LỜI MỞ ĐẦU 11 CHƯƠNG 1: TỔNG QUAN 12 1.1 Lý chọn đề tài 12 1.2 Mục tiêu nhiệm vụ 12 1.2.1 Mục tiêu 12 1.2.2 Nhiệm vụ 13 1.3 Giới hạn phạm vi đề tài 13 1.4 Kết dự kiến đạt .13 CHƯƠNG 2: CƠ SỞ LÝ THUYẾT .14 2.1 Kiến thức tảng 14 2.1.1 Trình bày phân tích thiết kế hướng đối tượng UML 14 2.1.2 Trình bày HTML, CSS .16 2.1.3 Trình bày Javascript jQuery 19 2.1.4 Trình bày PHP, mơ hình MVC 21 2.1.5 Tìm hiểu Framework Bootstrap 23 2.1.6 Trình bày MYSQL 25 2.2 CÔNG CỤ SỬ DỤNG 27 2.2.1 Tìm hiểu phầm mềm hỗ trợ phân tích thiết kế Rational Rose 27 2.2.2 Phần mềm hỗ trợ code Sublime Text 27 2.2.3 Chương trình tạo máy chủ Web XAMPP 28 CHƯƠNG 3: PHÂN TÍCH THIẾT KẾ HỆ THỐNG THƠNG TIN 30 3.1 Khảo sát hệ thống 30 3.1.1 Khảo sát trạng thực tế hệ thống mua bán trực tuyến 30 3.1.2 Lập mục tiêu cho hệ thống 34 3.1.3 Lên kế hoạch cho dự án 34 3.2 Phân tích thiết kế hệ thống 35 3.2.1 Biểu đề UseCase 35 3.2.2 Biểu đồ lớp .52 3.2.3 Biểu đồ biểu đồ tương tác 53 3.3 Thiết kế sở liệu vật lý 90 CHƯƠNG 4: XÂY DỰNG CHƯƠNG TRÌNH 94 4.1 Xây dựng hệ thống 94 4.1.1 Giao diện chương trình 94 4.1.2 Chức 110 4.1.3 Code số chức 110 4.2 Kết đạt phương hướng phát triển 121 4.2.1 Kết đạt 121 4.2.2 Thuận lợi khó khăn 121 4.2.3 Hướng phát triển đồ án .121 TÀI LIỆU THAM KHẢO 122 DANH MỤC BẢNG Bảng 2.1: Các vấn đề liên quan đến UML 16 Bảng 3.1: Bảng khảo sát người quản lý 31 Bảng 3.2: Bảng khảo sát khách hàng 33 Bảng 3.3: Các tác nhân (Actor) chức (Use case) 36 Bảng 3.4: Đặc tả UC Add User (thêm tài khoản người dùng): 39 Bảng 3.5: Đặc tả UC Edit User (Sửa người dùng) 40 Bảng 3.6: Đặc tả UC Delete User .40 Bảng 3.7: Đặc tả UC Search User (Tìm kiếm người dùng) .40 Bảng 3.8: Đặc tả UC Add Product (Thêm sản phẩm) 41 Bảng 3.9: Đặc tả UC Edit Product (Sửa sản phẩm) 41 Bảng 3.10: Đặc tả UC Delete Product (Xóa sản phẩm) 42 Bảng 3.11: Đặc tả UC Search Product (Tìm kiếm sản phẩm) 42 Bảng 3.12: Đặc tả UC View Booking (Xem đơn hàng) 43 Bảng 3.13: Đặc tả UC Search Booking (Tìm kiếm đơn hàng) 43 Bảng 3.14: Đặc tả UC Add Post (Thêm viết) .44 Bảng 3.15: Đặc tả UC Edit Post (Sửa viết) 44 Bảng 3.16: Đặc tả UC Delete Post (Xóa viết) .45 Bảng 3.17: Đặc tả UC Search Post (Tìm kiếm viết) 45 Bảng 3.18: Đặc tả UC View Comment (Xem bình luận) 46 Bảng 3.19: Đặc tả UC Reply Comment (Trả lời bình luận) .46 Bảng 3.20: Đặc tả UC Register (Đăng kí) 47 Bảng 3.21: Đặc tả UC Login (Đăng nhập) 47 Bảng 3.22: Đặc tả UC Statistics 49 Bảng 3.23: Đặc tả UC Views .50 Bảng 3.24: Đặc tả Search 50 Bảng 3.25: Đặc tả Booking .51 Bảng 3.26: Đặc tả Comment .52 Bảng 3.27: Đặc tả UC Contact 52 Bảng 3.28: Bảng User (Người dùng) 90 Bảng 3.29: Bảng Category Product (Danh mục sản phẩm) 90 Bảng 3.30: Bảng Product (Sản phẩm) .91 Bảng 3.31: Bảng Category Post (Danh mục tin tức) 91 Bảng 3.32: Bảng Post (Tin tức) 91 Bảng 3.33: Bảng Booking_product (Đơn hàng sản phẩm) 92 Bảng 3.34: Bảng Comment (Bình luận) .92 Bảng 3.35: Bảng Booking (Đơn hàng) 92 DANH MỤC HÌNH ẢNH Hình 2.1: Cấu hình tập tin HTML 18 Hình 2.2: Quy trình hoạt động PHP 23 Hình 2.3: Mơ hình MVC 24 Hình 3.1: Sơ đồ UseCase tổng quát 37 Hình 3.2: UseCase Manages .38 Hình 3.3: UseCase Manage Users 39 Hình 3.4: UseCase Manage Products .41 Hình 3.5: UseCase Manage Booking 42 Hình 3.6: UseCase Manage Posts .43 Hình 3.7: UseCase Manage Comment 45 Hình 3.8: UseCase Authenticate 46 Hình 3.9: UseCase Statistics .47 Hình 3.10: UseCase View 48 Hình 3.11: UseCase Search .49 Hình 3.12: UseCase Booking 49 Hình 3.13: UseCase Comment 50 Hình 3.14: UseCase Contact .51 Hình 3.15: Class tổng quát 52 Hình 3.16: Biểu đồ trình tự “Add User” 53 Hình 3.17: Biểu đồ trình tự “Edit User” 54 Hình 3.18: Biểu đồ trình tự “Delete User” .54 Hình 3.19: Biểu đồ trình tự “Add Product” 55 Hình 3.20: Biểu đồ trình tự “Edit Product” 56 Hình 3.21: Biểu đồ trình tự “Delete Product” 56 Hình 3.22: Biểu đồ trình tự “Add Post” 57 Hình 3.23: Biểu đồ trình tự “Edit Post” 58 Hình 3.24: Biểu đồ trình tự “Delete Post” 58 Hình 3.25: Biểu đồ trình tự “View Booking” 59 Hình 3.26: Biểu đồ trình tự “Statistics” 59 Hình 3.27: Biểu đồ trình tự “Comment” 60 Hình 3.28: Biểu đồ trình tự “Register” .61 Hình 3.29: Biểu đồ trình tự “Login” 62 Hình 3.30: Biểu đồ trình tự “View” 62 Hình 3.31: Biểu đồ trình tự “Search” .63 Hình 3.32: Biểu đồ trình tự “Booking” .63 Hình 3.33: Biểu đồ trình tự “Contact” 64 Hình 3.34: Biểu đồ tương tác “Add User” 64 Hình 3.35: Biểu đồ tương tác “Edit User” 65 Hình 3.36: Biểu đồ tương tác “Delete User” 65 Hình 3.37: Biểu đồ tương tác “Add Product” 66 Hình 3.38: Biểu đồ tương tác “Edit Product” 66 Hình 3.39: Biểu đồ tương tác “Delete Product” .67 Hình 3.40: Biểu đồ tương tác “Add Post” 67 Hình 3.41: Biểu đồ tương tác “Edit Post” 68 Hình 3.42: Biểu đồ tương tác “Delete Post” .68 Hình 3.43: Biểu đồ tương tác “View Booking” 69 Hình 3.44: Biểu đồ tương tác “Statistics” 69 Hình 3.45: Biểu đồ tương tác “Comment” 70 Hình 3.46: Biểu đồ tương tác “Register” 70 Hình 3.47: Biểu đồ tương tác “Login” 71 Hình 3.48: Biểu đồ tương tác “View” .71 Hình 3.49: Biểu đồ tương tác “Search” 72 Hình 3.50: Biểu đồ tương tác “Booking” 72 Hình 3.51: Biểu đồ tương tác “Contact” 73 Hình 3.52: Biểu đồ hoạt động “Add User” .74 Hình 3.53: Biểu đồ hoạt động “Edit User” .75 Hình 3.54: Biểu đồ hoạt động “Delete User” 75 Hình 3.55: Biểu đồ hoạt động “Add Product” 76 Hình 3.56: Biểu đồ hoạt động “Edit Product” 77 Hình 3.57: Biểu đồ hoạt động “Delete Product” 77 Hình 3.58: Biểu đồ hoạt động “Add Post” 78 Hình 3.59: Biểu đồ hoạt động “Edit Post” 79 Hình 3.60: Biểu đồ hoạt động “Delete Post” 79 Hình 3.61: Biểu đồ hoạt động “View Booking” 80 Hình 3.62: Biểu đồ hoạt động “Statistics” 80 Hình 3.63: Biểu đồ hoạt động “Comment” .81 Hình 3.64: Biểu đồ hoạt động “View” .82 Hình 3.65: Biểu đồ hoạt động “Search” 83 Hình 3.66: Biểu đồ hoạt động “Booking” 84 Hình 3.67: Biểu đồ hoạt động “Register” 85 Hình 3.68: Biểu đồ hoạt động “Login” .86 Hình 3.69: Biểu đồ hoạt động “Contact” 87 Hình 3.70: Biểu đồ trạng thái “Sản phẩm” .87 Hình 3.71: Biểu đồ trạng thái “Thanh toán đơn hàng” 88 Hình 3.72: Biểu đồ thành phần 88 Hình 3.73: Biểu đồ triển khai 89 Hình 4.1: Giao diện Trang chủ 93 Hình 4.2: Giao diện trang Đăng nhập tài khoản khách hàng 93 Hình 4.3: Giao diện trang Đăng ký tài khoản khách hàng 94 Hình 4.4: Giao diện trang Sản phẩm 94 Hình 4.5: Giao diện trang Chi tiết sản phẩm 95 Hình 4.6: Giao diện trang Tin tức .95 Hình 4.7: Giao diện trang Chi tiết tin tức 96 Hình 4.8: Giao diện trang Giỏ hàng 96 Hình 4.9: Giao diện trang Đăng nhập tài khoản Admin 97 Hình 4.10: Giao diện trang Quản lý Admin 97 Hình 4.11: Giao diện trang Quản lý danh mục Sản phẩm 98 Hình 4.12: Giao diện Thêm danh mục sản phẩm .98 Hình 4.13: Giao diện Sửa danh mục sản phẩm 99 Hình 4.14: Giao diện trang Quản lý sản phẩm 99 Hình 4.15: Giao diện trang Thêm sản phẩm 100 Hình 4.16: Giao diện trang Sửa thông tin sản phẩm .100 Hình 4.17: Giao diện trang Quản lý danh mục tin tức 101 Hình 4.18: Giao diện trang Thêm danh mục tin tức 101 Hình 4.19: Giao diện trang Sửa danh mục tin tức 102 Hình 4.20: Giao diện trang Quản lý viết tin tức 102 Hình 4.21: Giao diện trang Thêm viết tin tức .103 Hình 4.22: Giao diện trang Sửa thơng tin viết tin tức .103 Hình 4.23: Giao diện Quản lý tài khoản Admin 104 Hình 4.24: Giao diện Thêm tài khoản Admin 104 Hình 4.25: Giao diện Sửa thơng tin tài khoản Admin 105 Hình 4.26: Giao diện Quản lý tài khoản khách hàng 105 Hình 4.27: Giao diện Xem thơng tin chi tiết tài khoản khách hàng 106 Hình 4.28: Giao diện trang Quản lý đơn hàng 106 Hình 4.29: Giao diện trang Xem thông tin chi tiết đơn hàng 107 Hình 4.30: Giao diện Quản lý bình luận khách hàng 107 Hình 31: Giao diện trang Xem chi tiết bình luận khách hàng .108 Hình 4.32: Giao diện trang Liên hệ khách hàng .108 Hình 4.33: Giao diện trang Quản lý liên hệ Admin 109 Hình 4.34: Giao diện trang Xem chi tiết liên hệ khách hàng 109 - Giao diện trang Xem thơng tin chi tiết đơn hàng: Hình 4.28: Giao diện trang Xem thông tin chi tiết đơn hàng - Giao diện trang Quản lý bình luận khách hàng: Hình 4.29: Giao diện Quản lý bình luận khách hàng 113 - Giao diện trang Xem chi tiết bình luận khách hàng: Hình 4.30: Giao diện trang Xem chi tiết bình luận khách hàng - Giao diện trang Liên hệ khách hàng: Hình 4.31: Giao diện trang Liên hệ khách hàng 114 - Giao diện trang Quản lý liên hệ Admin: Hình 4.32: Giao diện trang Quản lý liên hệ Admin - Giao diện trang Xem chi tiết liên hệ khách hàng: Hình 4.33: Giao diện trang Xem chi tiết liên hệ khách hàng 4.1.2 Chức - Giỏ hàng - Bình luận 4.1.3 Code số chức - Đăng ký tài khoản khách hàng: require_once DIR ."/autoload/autoload.php"; // Bắt điều kiện đăng nhập thành cơng khơng vào trang đăng ký 115 if (isset($_SESSION['name_id'])) { echo "alert('Bạn có tài khoản nên khơng thể đăng ký thêm tài khoản.');location.href='index.php'"; } $data = [ "name" => postInput('name'), "email" => postInput('email'), "password" => postInput('password'), "address" => postInput('address'), "phone" => postInput('phone') ]; $error = []; if ($_SERVER["REQUEST_METHOD"] == "POST") { // Nếu tồn phương thức POST tiến hàng validate đăng ký // echo "Đã submit"; if ($data['name'] == '') { $error['name'] = "Yêu cầu nhập đầy đủ thông tin."; } if ($data['email'] == '') { $error['email'] = "Yêu cầu nhập đầy đủ thông tin."; } else { $is_check = $db->fetchOne("users","email = '".$data['email']."' "); if ($is_check != NULL) { $error['email'] = "Địa email tồn Yêu cầu nhập địa email khác."; } } if ($data['password'] == '') { $error['password'] = "Yêu cầu nhập đầy đủ thông tin."; } else { $data['password'] = MD5(postInput('password')); } if ($data['address'] == '') { $error['address'] = "Yêu cầu nhập đầy đủ thông tin."; } 116 if ($data['phone'] == '') { $error['phone'] = "Yêu cầu nhập đầy đủ thông tin."; } // Kiểm tra mảng error if (empty($error)) { $idinsert = $db->insert('users', $data); if ($idinsert > 0) { $_SESSION['success'] = "Đăng ký thành công"; // Nếu đăng ký thành công sử dụng câu lệnh header("location: dangnhap.php"); // để chuyển sang trang đăng nhập header("location: dang-nhap.php"); } else { // Thêm thất bại $_SESSION['error'] = "Đăng ký thất bại"; } } } ?> Đăng ký thành viên Họ tên