Xây dựng hệ thống website đặt đồ ăn trực tuyến ha long food

TRƯỜNG ĐẠI HỌC KINH TẾ QUỐC DÂN VIỆN CÔNG NGHỆ THÔNG TIN VÀ KINH TẾ SỐ ….    … CHUYÊN ĐỀ THỰC TẬP ĐỀ TÀI: XÂY DỰNG HỆ THỐNG WEBSITE ĐẶT ĐỒ ĂN TRỰC TUYẾN HA LONG FOOD Họ tên : LÊ VIỆT THẮNG Mã SV : 11164618 Lớp : CÔNG NGHỆ THÔNG TIN 58A GVHD : TH.S CAO THU HƯƠNG Hà Nội – 2020 MỤC LỤC DANH MỤC HÌNH ẢNH DANH MỤC BẢNG .2 LỜI MỞ ĐẦU .3 CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI 1.1 Giới thiệu sở thực tập 1.1.1 Tổng quan công ty iCheck .4 1.1.2 Quá trình hình thành phát triển 1.1.3 Sản phẩm 1.1.4 Cơ cấu tổ chức công ty iCheck 1.2 Tổng quan đề tài 1.2.1 Giới thiệu đề tài 1.2.2 Công nghệ sử dụng đề tài CHƯƠNG 2: PHÂN TÍCH VÀ THIẾT KẾ HỆ THỐNG 17 2.1 Giới thiệu phương pháp phân tích 17 2.2 Xác định đầu vào, đầu 17 2.3 Biểu đồ phân cấp chức 18 2.3.1 Các tác nhân 18 2.3.2 Biểu đồ phân cấp chức .19 2.3.3 Mô tả chức hệ thống 19 2.4 Biểu đồ luồng liệu .21 2.4.1 Ký hiệu .21 2.4.2 Biểu đồ luồng liệu mức khung cảnh 22 2.4.3 Biểu đồ luồng liệu mức đỉnh .23 2.4.4 Biểu đồ luồng liệu mức đỉnh 24 CHƯƠNG PHÂN TÍCH THIẾT KẾ CƠ SỞ DỮ LIỆU 28 3.1 Tổng quan sở liệu .28 3.1.1 Giới thiệu sở liệu 28 3.1.2 Hệ quản trị sở liệu phi quan hệ NoSQL .28 3.2 Xây dựng sở liệu 30 3.2.1 Giới thiệu Firebase Cloud Firestore 30 3.2.2 Xác định Đối tượng .31 3.2.3 Các liên kết Đối tượng .38 CHƯƠNG 4: MÔI TRƯỜNG CÀI ĐẶT VÀ THIẾT KẾ HỆ THỐNG .39 4.1 Cơng cụ lập trình ngơn ngữ Javascript 39 4.2 Giao diện toán 42 4.2.1 Giao diện Trang chủ 42 4.2.2 Giao diện số trang khác .43 4.2.3 Giao diện trang đăng nhập, đăng xuất 45 4.2.4 Giao diện trang Quản lý 47 4.2.5 Giao diện số chức khác 50 KẾT LUẬN 53 DANH MỤC HÌNH ẢNH Hình 1.1 Cơ cấu tổ chức cơng ty iCheck Hình 1.2 Cơng nghệ Frontend VueJS 10 Hình 1.3 Mơ hình hoạt động VueX 12 Hình 1.4 Cơng nghệ Backend Firebase 13 Hình 1.5 Các dịch vụ cung cấp Firebase 14 Hình 1.6 Cơng nghệ thơng báo đẩy OneSignal 15 Hình 1.7 Cơng nghệ Backend ExpressJS .15 Hình 1.8 Cấu trúc ExpressJS 16 Hình 2.1 Mơ hình phân tích Top-Down .17 Hình 2.2 Biểu đồ phân cấp chức 19 Hình 2.4 Biểu đồ luồng liệu mức khung cảnh 22 Hình 2.5 Biểu đồ luồng liệu mức đỉnh 23 Hình 2.6 Biểu đồ luồng liệu chức Quản lý cửa hàng 24 Hình 2.7 Biểu đồ luồng liệu chức Quản lý người dùng 25 Hình 2.8 Biểu đồ luồng liệu chức Quản trị hệ thống 25 Hình 2.9 Biểu đồ luồng liệu chức Tìm kiếm 26 Hình 2.10 Biểu đồ luồng liệu chức Đặt hàng 26 Hình 2.11 Biểu đồ luồng liệu chức Báo cáo thống kê 27 Hình 2.12 Biểu đồ luồng liệu chức Review bình luận 27 Hình 4.1 Cơ chế Call Stack Javascript 40 Hình 4.2 Cơ chế Callback Javascript 41 Hình 4.3 Giao diện Trang chủ 42 Hình 4.4 Giao diện trang danh sách cửa hàng theo danh mục .43 Hình 4.5 Giao diện trang chi tiết cửa hàng 43 Hình 4.6 Giao diện trang Đặt hàng .44 Hình 4.7 Giao diện Đăng nhập người dùng 45 Hình 4.8 Giao diện Đăng ký người dùng .45 Hình 4.9 Giao diện Đăng nhập, Đăng ký cửa hàng .46 Hình 4.10 Giao diện Reset mật người dùng 46 Hình 4.11 Giao diện trang quản lý thơng tin người dùng .47 Hình 4.0.12 Giao diện quản lý cửa hàng 47 Hình 4.13 Giao diện quản lý cửa hàng (Quản lý menu) .48 Hình 4.14 Giao diện thống kê doanh thu 48 Hình 4.15 Giao diện quản lý trạng thái đơn hàng cửa hàng 49 Hình 4.16 Giao diện quản lý trạng thái đơn hàng người mua vừa đặt 49 Hình 4.17 Giao diện chức Theo dõi trang web 50 Hình 4.18 Giao diện chức Tìm kiếm 51 Hình 4.19 Giao diện ứng dụng Web Desktop 51 Hình 4.20 Icon ứng dụng Desktop .52 DANH MỤC BẢNG Bảng 2.1 Các tác nhân hệ thống 18 Bảng 2.2 Ký hiệu biểu đồ luồng liệu .18 Bảng 3.1 Collection Banner 28 Bảng 3.2 Collection Users 29 Bảng 3.3 Collection Stores 29 Bảng 3.4 Collection Store-details 34 Bảng 3.5 Bảng thuộc tính Menu 35 Bảng 3.6 Collection User-carts .35 Bảng 3.7 Bảng thuộc tính cart 35 Bảng 3.8 Collection User-orders 36 Bảng 3.9 Collection Reviews .36 Bảng 3.10 Collections OrderEachStore 38 LỜI MỞ ĐẦU Sau thời gian khảo sát tìm hiểu thực tế, đồng thời phân tích thực đề tài “Nền tảng đặt đồ ăn trực tuyến Ha Long Food”, em xây dựng website đáp ứng yêu cầu đặt toán, giúp kết nối người mua cửa hàng thành phố lại với Mặc dù nhiều hạn chế, song website đáp ứng ổn định chức quản lý thông tin cửa hàng, giỏ hàng, đặt hàng qua email hay tìm kiếm – tra cứu theo tên cửa hàng hay tên sản phẩm Bên cạnh việc đạt được, website tồn nhiều hạn chế khả tích hợp tốn trực tuyến, chức báo cáo thống kê chưa mức tối ưu hay việc quản lý thông tin cửa hàng sạch, minh bạch cịn nhiều khó khăn Bên cạnh đó, kiến thức thân cịn nhiều hạn chế, sản phẩm cịn nhiều thiếu sót, em mong nhận góp ý Thầy Cơ để sản phẩm ngày hoàn thiện Qua thời gian thực chuyên đề thực tập sở thực tập, em học hỏi rút nhiều học kinh nghiệm quý báu Em tiếp tục xây dựng hoàn thiện sản phẩm, để website trở thành tảng kết nối ẩm thực lớn mạnh, người tin dùng sử dụng thời gian tới Để có báo cáo sản phẩm tại, không nhắc tới dạy giúp đỡ tận tình Th.S Cao Thu Hương Em xin gửi lời cảm ơn sâu sắc tới cô Trong suốt thời gian thực đề tài, cô theo dõi, sát giai đoạn, giúp chúng em khắc phục lỗi sai, đồng thời đưa định hướng, kế hoạch cần thực để chúng em xây dựng hoàn thiện sản phẩm Em xin cám ơn Thầy Cô môn Công Nghệ Thông Tin thuộc Viện Công Nghệ Thông Tin Kinh Tế Số nhiệt tình giảng dạy, giúp đỡ chúng em suốt thời gian học tập để em có kết ngày hơm Em xin chân thành cảm ơn Thầy Cô CHƯƠNG 1: TỔNG QUAN VỀ ĐỀ TÀI 1.1 Giới thiệu sở thực tập 1.1.1 Tổng quan công ty iCheck iCheck công ty công nghệ hàng đầu lĩnh vực truy xuất nguồn gốc sản phẩm, thuộc hệ sinh thái VNLife Với nhiệm vụ cung cấp ứng dụng quét mã vạch, tem QRCode, iCheck mong muốn cung cấp đầy đủ xác thơng tin sản phẩm doanh nghiệp sản xuất, qua đó, góp phần bảo vệ sức khỏe quyền lợi người tiêu dùng  Tầm nhìn cơng ty  Trở thành Tập đồn Cơng nghệ hàng đầu Việt Nam tiến tới trở thành thương hiệu số Đông Nam Á việc cung cấp giải pháp toàn diện cho nhãn hàng  Trở thành Mạng xã hội sản phẩm Việt Nam, tảng kết nối Người tiêu dùng, Nhãn hàng đơn vị phân phối  Tạo nên minh bạch thông tin, tạo dựng niềm tin giá trị cho người tiêu dùng 1.1.2 Quá trình hình thành phát triển  2013: Barcode Việt - Tiền thân iCheck Scanner đời với số người dùng: 95,000  2015: iCheck Scanner đời với 1,2 triệu người dùng  2016: iCheck QR Code đời với 5,9 triệu người dùng  2017: iCheck Shop đời, bên cạnh iCheck đạt 6,8 triệu người dùng 5000 đối tác doanh nghiệp  2018: Đối tác doanh nghiệp đạt 8000 doanh nghiệp, 8,5 triệu người dùng  2019: Ra mắt hệ thống quảng cáo bán hàng cho doanh nghiệp iCheck đạt 14 triệu người dùng 10000 doanh nghiệp đối tác 1.1.3 Sản phẩm  Tem QR Code  E-Commercer  Thông tin thương phẩm  Marketing  Loyalty 1.1.4 Cơ cấu tổ chức cơng ty iCheck Hình 1.1 Cơ cấu tổ chức công ty iCheck Tổng giám đốc: Anh VŨ THẾ TUẤN Phó Tổng giám đốc: Anh NGUYỄN VĂN CHÍNH Phó Tổng giám đốc: Chị TRƯƠNG THỊ TỐ LINH Giám đốc kỹ thuật: Anh ĐỖ ANH BA Kế tốn trưởng: Chị NGƠ THỊ THẢO Trưởng phòng pháp chế: Chị NGUYỄN THỊ GIANG Trưởng phòng data: Chị CHU MINH HƯƠNG Trưởng phịng chăm sóc khách hàng: Chị VŨ THỊ PHƯƠNG THẢO Trưởng phịng nhân Hồ Chí Minh: Chị TRẦN THỊ THANH MAI 10 Trưởng phòng nhân Hà Nội: Chị TRẦN THỊ MINH PHƯƠNG Nhận xét: Trong q trình thực tập cơng ty, em nhận thấy máy tổ chức công ty phân cấp rõ ràng, cụ thể Mỗi phòng ban đảm nhiệm chức riêng, không bị phụ trách việc phịng ban khác Các phịng ban có hỗ trợ, tương tác với tốt nhờ hệ thống công nghệ nội công ty, giúp công ty nắm bắt tình hình cơng việc người tiến độ cơng việc riêng phịng ban, quy mô nhân công ty lớn (trên 300 người) 1.2 Tổng quan đề tài 1.2.1 Giới thiệu đề tài 1.2.1.1 Lý chọn đề tài Hạ Long vốn mảnh đất không tiếng du lịch mà điểm đến du khách tinh túy đa dạng nét ẩm thực nơi Càng ngày, Hạ Long thu hút nhiều khách du lịch không nước mà cịn nước ngồi tới thăm Vậy nên kèm với nhu cầu ẩm thực ngày tăng lên Kết hợp với phát triển Internet, thị trường ẩm thực trực tuyến Việt Nam nói chung Hạ Long nói riêng ngày phát triển với nhiều trang web để cung cấp dịch vụ đặt đồ ăn trực tuyển hay review, đánh giá địa điểm ăn uống Tuy nhiên, chưa có website thực làm tốt việc đặt đồ ăn qua tảng web Các hệ thống đặt đồ ăn Foody hay Now chưa thực thân thiện với người dùng website họ mục đích hướng người dùng sử dụng ứng dụng điện thoại di động Với mong muốn đáp ứng nhu cầu ẩm thực trực tuyến ngày cao, kết nối cửa hàng người mua lại với nhau, mang đến tiện nghi cho khách hàng du khách tới tham quan Hạ Long, việc đặt đồ ăn trực tuyến qua tảng website nhu cầu cần thiết Nền tảng giúp khách hàng dễ dàng tìm kiếm địa điểm, ăn u thích, nhanh chóng, đồng thời giúp cửa hàng Hạ Long tốn cơng sức việc quảng bá thương hiệu 1.2.1.2 Mục đích đề tài Website nhằm cung cấp tảng kết nối người muốn đặt đồ ăn trực tuyến gian hàng, nhà hàng thành phố Hạ Long Website nhằm:  Giúp cho người mua: Người mua người có nhu cầu đặt đồ ăn qua hệ thống website Họ tìm kiếm gian hàng hệ thống, lựa chọn sản phẩm gian hàng tiến hành đặt hàng Vậy nên, website giúp cho người mua:  Tìm kiếm lựa chọn sản phẩm cần: Người mua truy cập vào hệ thống website để tìm kiếm sản phẩm cần, hay đơn giản tham khảo, xem qua mặt hàng cửa hàng giá sản phẩm  Đặt hàng qua email: Sau lựa chọn sản phẩm, người mua chuyển đến trang tiến hành đặt hàng Tại đây, đơn hàng thông báo qua email cửa hàng cách nhanh chóng  Quản lý giỏ hàng lúc nơi: Giỏ hàng quản lý theo tài khoản cá nhân người mua, nên, giỏ hàng bạn không bị hay thay đổi so với lần truy cập trước người mua  Chia sẻ quan điểm, đánh giá thân cửa hàng: Người mua đánh giá, chia sẻ quan điểm cá nhân thân cửa hàng trải nghiệm, nhờ đó, tạo nên cộng đồng chia sẻ minh bạch, khách quan cửa hàng  Giúp cho cửa hàng: ... Sau thời gian khảo sát tìm hiểu thực tế, đồng thời phân tích thực đề tài “Nền tảng đặt đồ ăn trực tuyến Ha Long Food? ??, em xây dựng website đáp ứng yêu cầu đặt toán, giúp kết nối người mua cửa hàng... review, đánh giá địa điểm ăn uống Tuy nhiên, chưa có website thực làm tốt việc đặt đồ ăn qua tảng web Các hệ thống đặt đồ ăn Foody hay Now chưa thực thân thiện với người dùng website họ mục đích hướng... Hạ Long Website nhằm:  Giúp cho người mua: Người mua người có nhu cầu đặt đồ ăn qua hệ thống website Họ tìm kiếm gian hàng hệ thống, lựa chọn sản phẩm gian hàng tiến hành đặt hàng Vậy nên, website