Ngày nay với sự phát triển không ngừng của các ngành khoa học kỹ thuật CNTT cũng không nằm ngoài vòng xoáy phát triển đó. Cùng với sự phát triển mạnh mẽ của các ngành khoa học kỹ thuật khác. CNTT đã có những ứng dụng to lớn trong hầu hết các lĩnh vực của đời sống. Đây là môt ngành khoa học mũi nhọn ảnh hưởng trực tiếp đến đời sống xã hội.Trong bất cứ lĩnh vực nào, thương mại điện tử cũng có lợi thế. Nó không chỉ làm giảm thời gian mà còn làm giảm chi phí cho mọi vấn đề giao dịch của con người. Việc kinh doanh qua mạng không chỉ đáp ứng nhu cầu của con người mà còn giúp cho người sử dụng so sánh giá ở nhiều nơi để mua những mặt hàng tốt, giá hợp lý. Với những kiến thức đã học và thời gian thực tế, chúng em xin lựa chọn đề tài: “Xây dựng trang web bán thiết bị chơi game cho PC” trong khuôn khổ bài tập lớn môn phát triển ứng dụng web.
Nhóm 12: TRẦN TRỌNG TRƯỜNG (1421050221) (C) NGUYỄN THẾ QUANG (1421050157) ĐỖ ĐÌNH NHƯỢNG (1421050149) WEBSITE BÁN THIẾT BỊ CHƠI GAME CHO PC, L BÀI TẬP LỚN MÔN: PHÁT TRIỂN ỨNG DỤNG WEB + BTL 4080106 Giáo viên hướng dẫn: Ths Hoàng Anh Đức Hà Nội, 2018 Bài tập lớn môn phát triển ứng dụng web + BTL 2 Lớp Tin trắc địa k59 Bài tập lớn môn phát triển ứng dụng web + BTL MỤC LỤC 3 Lớp Tin trắc địa k59 Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL DANH MỤC CÁC HÌNH VẼ DANH MỤC CÁC BẢNG BIỂU 4 Lớp: Tin Trắc Địa k59 Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL MỞ ĐẦU Ngày với phát triển không ngừng ngành khoa học kỹ thuật CNTT khơng nằm ngồi vòng xốy phát triển Cùng với phát triển mạnh mẽ ngành khoa học kỹ thuật khác CNTT có ứng dụng to lớn hầu hết lĩnh vực đời sống Đây môt ngành khoa học mũi nhọn ảnh hưởng trực tiếp đến đời sống xã hội Trong lĩnh vực nào, thương mại điện tử có lợi Nó khơng làm giảm thời gian mà làm giảm chi phí cho vấn đề giao dịch người Việc kinh doanh qua mạng không đáp ứng nhu cầu người mà giúp cho người sử dụng so sánh giá nhiều nơi để mua mặt hàng tốt, giá hợp lý Với kiến thức học thời gian thực tế, chúng em xin lựa chọn đề tài: “Xây dựng trang web bán thiết bị chơi game cho PC” khuôn khổ tập lớn môn phát triển ứng dụng web Đây ứng dụng thực tế hay, kinh nghiệm chúng em chưa nhiều nhiều hạn chế sai sót mong thầy bạn đóng góp ý kiến để đề tài hồn thiện Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG TỔNG QUAN 1.1 Mục tiêu hệ thống 1.1.1 Đối với khách hàng Cung cấp cho khách hàng chức đưa ý kiến sản phẩm thông qua yahoo, email đường dây nóng Đây coi cơng cụ tư vấn khách quan giúp người mua chọn cho sản phẩm ưng ý Cùng với chức đặt mua hình thức tốn nhanh nhất, website tiết kiệm nhiều thời gian cho việc chọn mua Việc mua bán thuận tiện với click chuột Website cung cấp nguồn thông tin sản phẩm rõ nguồn gốc, xuất sứ Đảm bảo chất lượng tất mặt hàng Chức tìm kiếm sản phẩm giúp khách hàng có lựa chọn thuận tiện, nhanh chóng để mua sản phẩm cần nhanh 1.1.2 Đối với người quản trị Có thể dễ dàng cập nhật sản phẩm hot, bán chạy theo xu hướng khách hàng Dễ dàng quản lý sản phẩm, danh mục sản phẩm Dễ dàng tìm kiếm thông tin khách hàng, thông tin sản phẩm Cập nhật trạng thái đơn hàng Tạo báo cáo thống kê, đưa danh sách mặt hàng bán chạy Phải có chế đăng nhập để xác định người có quyền hạn đăng nhập vào hệ thống quản trị website Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL Quản lý, cập nhật trạng thái danh sách tài khoản khách hàng Có thể phân quyền người dùng 1.2 Phạm vi hệ thống STT Đối tượng Vai trò, quyền hạn Thành viên Admin Khách vãng lai Thực xem hàng, mua hàng, xem danh sách u thích, lịch sử giao dịch Có quyền hạn Xem sản phẩm, đăng ký Bảng 1.1: Bảng phạm vi hệ thống Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG 2: CẤU TRÚC WEBSITE Website chia làm phần phía Trang người dùng ( frontend ), phía người quản trị (backend) 2.1 Phía người quản trị ( backend ) Gồm thứ mục: • • • • Connect: chứa file kết nối csdl Category : chưa file php chức quản lý danh mục Product: chưa file php chức quản lý quản lý sản phẩm Order: chưa file php chức quản lý quản lý quản lý đơn • • • • hàng Public: Chứa file css, boostrap, js, image Upload: chứa ảnh sản phẩm upload Index.php, footer,php, header.php hiển thị giao diện phần backend Login.php, logout.php chức đăng nhập, đăng xuất phía backend 2.2 Phía người dùng (frontend) • • • • • Connect: chứa file kết nối csdl Public: Chứa file css, boostrap, js, image Index.php, footer,php, header.php hiển thị giao diện phần fronend Login.php, logout.php chức đăng nhập, đăng xuất phía fronend Sigup.php chức đăng ký Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG 3: ĐẶC TẢ CHỨC NĂNG 3.1 Mơ hình phân rã chức Hình 3.1: Mơ hình phân rã chức phía backend Hình 3.2: Mơ hình phân rã chức phí fronend Bài tập lớn Mơn Phát Triển Ứng Dụng Web + BTL 3.2 Các chức website 3.2.1 Đối với khách vãng lai Xem thơng tin sản phẩm Tìm kiếm sản phẩm Thêm sản phẩm vào giỏ Đăng ký tài khoản 3.2.2 Đối với người dùng có tài khoản Xem thông tin sản phẩm Thêm sản phẩm vào giỏ hàng Xem thơng tin đơn hàng Tìm kiếm sản phẩm Thanh toán Đăng nhập, đăng xuất 3.2.3 Đối với admin Đăng nhập, đăng xuất phẩn quản trị Quản lý danh mục Quản lý sản phẩm Quản lý đơn hàng Quản lý người dùng Quản lý hóa đơn Bài tập lớn Mơn Phát Triển Ứng Dụng Web + BTL - Shipping_name, Shipping_phone, Shipping_adress thông tin để chuyển đơn hang - status lv = đơn hang chờ xác nhận, lv = đơn hàng xác nhận 4.5 Bảng order_detail STT Tên Trường Kiểu Dữ Liệu Độ Rộng Rằng Buộc Mơ tả order_id int 11 Primary key Khóa ngoại liên kết với bảng orders product_id int 11 Foreign key Khóa ngoại liên kết đến bảng product quantity int 11 Not Null Số lượng price int 11 Not Null Đơn giá Bảng 4.6: Bảng order_detail GHI CHÚ: - Bảng order_detail để xem thông tin chi tiết đơn hàng 4.6 Sơ đồ quan hệ bảng Database Hình 4.3: Sơ đồ quan hệ CHÚ THÍCH: - Quan hệ thực tế từ users - orders, orders – order_detail, order_detail – product, category-product quan hệ 1-n Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL - Khi người dung đăng nhập vào hệ thống mà muốn đặt hàng thơng tin user chuyển vào bnarg orders id orders vừa tạo thông tin sản phẩm đẩy vào bảng order_detail Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG 5: THIẾT KẾ GIAO DIỆN 5.1 Frontend 5.1.1 From Đăng nhập Hình 5.4: Giao diện đăng nhập Bài tập lớn Mơn Phát Triển Ứng Dụng Web + BTL 5.1.2 Trang index Hình 5.5: Trang index Bài tập lớn Mơn Phát Triển Ứng Dụng Web + BTL 5.1.3 Trang chi tiết sản phẩm Hình 5.6: Trang chi tiết sản phẩm 5.1.4 Trang giỏ hàng Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL Hình 5.7: Trang giỏ hàng 5.1.5 Trang tốn Hình 5.8: Trang tốn Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL 5.1.6 Trang giới thiệu Hình 5.9: Trang giới thiệu 5.1.7 Trang liên hệ Hình 5.10: Trang liên hệ Bài tập lớn Mơn Phát Triển Ứng Dụng Web + BTL 5.2 Backend 5.2.1 Trang đăng nhập Hình 5.11: Trang đăng nhập admin 5.2.2 Trang quản trị Hình 5.12: Trang quản trị Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL 5.2.3 Các trang quản lý Hình 5.13: Giao diện quản lý danh mục Hình 5.14: Giao diện quản lý sản phẩm Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL Hình 5.15: Giao diện quản lý người dùng Hình 5.16: Giao diện quản lý đơn hàng Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL 5.2.4 Các trang thêm Hình 5.17: Thêm danh mục Hình 5.18: Thêm sản phẩm Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL 5.2.5 Trang chi tiết đơn hàng Hình 5.19: Giao diện chi tiết đơn hàng Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG 6: KẾT LUẬN Sau trình tham khảo tìm hiểu số web thương mại điện tử, tim hiểu cầu thị trường, nhóm em thiết kế tạo “ Website bán thiết bị chơi game cho PC “ Do lượng thời gian không đủ kiến thức eo hẹp nên trang web thiếu nhiều chức năng, nhóm em mong thầy có thêm góp ý để bọn em trau dồi thêm hiểu biết cho thân hoàn thiện trang web đầy đủ xác Em xin chân thành cảm ơn! Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL TÀI LIỆU THAM KHẢO [1] H A Đức, Phát triển ứng dụng web, Hanoi: Tự biên tập, 2015 [2] "Playzone," [Online] Available: https://www.playzone.vn/ Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL PHỤ LỤC Phân công công việc Tên Thành Viên Các Phần Làm Công việc Trần Trọng Trường Backend, fronend Thiết kế giao diện, code chức backend frondend Nguyễn Thế Quang fronend Thiết kế giao diện người dùng Đỗ Đình Nhượng backend Thiết kế giao diện trang quản trị .. .Bài tập lớn môn phát triển ứng dụng web + BTL 2 Lớp Tin trắc địa k59 Bài tập lớn môn phát triển ứng dụng web + BTL MỤC LỤC 3 Lớp Tin trắc địa k59 Bài tập lớn Môn Phát Triển Ứng Dụng Web +... order_detail Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL CHƯƠNG 5: THIẾT KẾ GIAO DIỆN 5.1 Frontend 5.1.1 From Đăng nhập Hình 5.4: Giao diện đăng nhập Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL... Trang index Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL 5.1.3 Trang chi tiết sản phẩm Hình 5.6: Trang chi tiết sản phẩm 5.1.4 Trang giỏ hàng Bài tập lớn Môn Phát Triển Ứng Dụng Web + BTL Hình