XÂY DỰNG WEBSITE BÁN HÀNG ĐIỆN TỬ

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM KHOA TIN HỌC - - BÁO CÁO ĐỒ ÁN CHUYÊN NGÀNH ĐỀ TÀI XÂY DỰNG WEBSITE BÁN HÀNG ĐIỆN TỬ Sinh viên thực hiện: Trần Hữu Thắng Lớp:18CNTT3 Giảng viên hướng dẫn: TS Trần Văn Hưng Đà Nẵng -2020 Lời Cảm Ơn Đầu tiên, em xin chân thành cảm ơn thầy cô khoa Tin học trang bị kiến thức cho em suốt trình học tập Trường Đại học Sư phạm Đà Nẵng vừa qua Chính nhờ cơng lao giảng dạy, bảo tận tình thầy mà em có kiến thức chun ngành cơng nghệ thơng tin để thực tiếp chặng đường học tập, vận dụng sáng tạo sản phẩm hữu ích góp phần phục vụ lĩnh vực khác Thứ hai, em xin chân thành cảm ơn cán hướng dẫn thầy Trần Văn Hưng người tận tình hướng dẫn, bảo cho em suốt trình thực đề tài Mặc dù có nhiều cố gắng để hồn thành đồ án phạm vi khả cho phép, chắn đồ án khơng tránh khỏi thiếu sót Em mong nhận thơng cảm, góp ý tận tình bảo q thầy Em xin chân thành cảm ơn người! SVTH: Trần Hữu Thắng - Lớp 18CNTT3 NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… …………………………………………………………………………… Đà nẵng Ngày… Tháng… Năm Giảng viên hướng dẫn (Ký ghi rõ họ tên) SVTH: Trần Hữu Thắng - Lớp 18CNTT3 LỜI CAM ĐOAN “Em xin cam đoan đề tài: “Thiết Kế Website Bán Hàng Điện Tử” là cơng trình nghiên cứu độc lập hướng dẫn giáo viên hướng dẫn:TS Trần Văn Hưng Ngồi khơng có chép người khác Đề tài, nội dung báo cáo thực tập sản phẩm mà em nỗ lực nghiên cứu trình học tập trường cơng việc Các số liệu, kết trình bày báo cáo hoàn toàn trung thực, em xin chịu hoàn toàn trách nhiệm, kỷ luật mơn nhà trường đề có vấn đề xảy SVTH: Trần Hữu Thắng - Lớp 18CNTT3 MỤC LỤC LỜI CẢM ƠN………………………………………………………………… NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN………………………… ….3 LỜI CAM ĐOAN……………………….……………………………………….4 MỤC LỤC…………… ………………….………………………………… MỞ ĐẦU………………………………… ……………………… ………….10 Lý Do Chọn đề tài……………………………………………… …… 11 Mục Tiêu đề tài………………………………………………… …12 Đối tượng phạm vi đề tài…………………………………………….12 a Đối tượng nghiên cứu……….…………………………………… 12 b Phạm vi đề tài…………………………………………………… 12 CHƯƠNG 1: CƠ SỞ LÝ THUYẾT………………………………………………13 1.1 Khái niệm fontend…………………………………… …………………… 13 1.2 Khái niệm backend…………………………………… ………………….….13 1.3 HTML………………………………………………… ……………………13 1.4 CSS & SCSS……………………………………………………………… 13 1.4.1 CSS……………………………….…………….………………………… 13 1.4.2 SCSS…………………………….…………….……………………………13 1.5 Bootstrap……….……………………………………………………….… 14 1.5.1 Khái niệm………………………… …………… ……………………….14 1.5.2 Vì nên sử dụng…….…… …….………… ………………………… 14 1.5.3 Cài đặt……………………………………… …………………………… 14 1.6 Javascript……………………………………………………………….…….15 1.6.1 Khái niệm…………………………………… …………………………15 1.6.2 DOM……………………………………… ……………………………15 1.6.3 Các kiểu liệu…………………………… … …………………… 16 1.6.4 Biến khai báo biến…………………… ….…………………… .16 1.6.5 Function…………………………………… ………………………… 17 SVTH: Trần Hữu Thắng - Lớp 18CNTT3 1.6.6 Các Framework……………………… ………… …………………… 17 1.7 Laravel Framework………………………………………………………….18 1.7.1 Khái Niệm Framework……… …………………………………… 18 1.7.2 Laravel Là gì………………………………………… ……… ………18 1.7.3 Ưu điểm nhược điểm………… ………… ………….……… ……18 1.7.4 Cài đặt……………………………… …… ………….…… …… …18 1.7.5 Mơ Hình MVC……………………… …… ………….…… ……….19 1.7.6 Routing Router………………….… … ………………… ………19 1.7.7 Nguyên lý hoạt động MVC………… … ………………… ……… 19 1.7.8 MiddleWare…………………………… ……………………… …… 21 1.7.9 Query Builder………………………… …………………….… …… 23 1.7.10 Eloquent ORM… ……………………………………… … ….… 25 1.7.11 RelationShip…… ……………………………………… ……… 26 1.7.12 Migration……… …………………………… ………… ….………30 1.7.13 Pagination……… …………………… …… …… ……….…… 31 1.7.14 Restful API………………………… ………… ……… …….…… 32 1.8 Vue Js Trong laravel………………………………………………………… 34 1.8.1 Khái niệm vue Js………… .….………………………………………34 1.8.2 Instance Lifecycle Hook…… ……….…………………………………34 1.8.3 Template Syntax…………… ……….……………………………… 35 1.8.4 Watcher……………………… ……….……………………………… 36 1.8.5 Components………………… ………….………………………………37 1.8.6 Props………………………… .…………………………………… 37 1.8.7 Vue Router laravel…… ……… …………… ……………….38 1.8.8 Rest API with Axios Setup ……………….…………………………… 39 SVTH: Trần Hữu Thắng - Lớp 18CNTT3 1.9 Mysql workbench…………………………………… ………………………39 1.9.1 Mysql ? .39 1.9.2 Mysql workbench ? 39 1.9.3 Các tính năng………………………………………………….…… .39 1.9.4 Tại nên dùng mysql workbench………………………… ………….41 1.9.5 Cài đặt…………………………………………………………………….42 1.10 Visual Studio Code………… ………… ………………………………… 42 1.10.1 Visual Studio code ? .42 1.10.2 Tại phải dùng……………… .….……………………………… 42 1.10.3 Cài đặt………………… ………… …………… ………………….42 1.11 Docker……………………………………………………………………….43 1.11.1 Docker gì…………………………………………………………… 43 1.11.2 Lợi ích docker…………………………….……………………… 43 1.11.3 Cài đặt………………………………………….……………………… 45 CHƯƠNG 2: PHÂN TÍCH VÀ THIẾT KẾ WEBSITE………… …………… 46 2.1 Phân tich yêu cầu hệ thống………………………………………… .46 2.1.1 Mô tả hệ thống…………….……………….…………………………… 46 2.1.2 Yêu cầu chức hệ thống……….…… …………………….……46 2.1.3 Yêu cầu phi chức hệ thống….……… ……….………….…….46 2.2 Mơ hình hóa chức năng… ….…………………… …… ……….… …….48 2.2.1 Sơ đồ usecase tổng quát………………….….……………………………48 2.2.2 Sơ đồ usecase đăng ký…… …….……….………………………………49 2.2.3 Sơ đồ usecase quản lý đăng nhập.………….……… ………………… 50 2.2.4 Sơ đồ usecase quản lý đơn hàng ……………………………………… 50 2.2.5 Sơ đồ usecase quản lý danh mục ……………………………………… 51 SVTH: Trần Hữu Thắng - Lớp 18CNTT3 2.2.6 Sơ đồ usercase quản lý sản phẩm……………………………………… 51 2.2.7 Sơ đồ usecase quản lý người dùng …………………………………… 52 2.2.8 Sơ đồ usecase xem sản phẩm………………………………………… 52 2.2.9 Sơ đồ usecase quản lý giỏ hàng…………………………………………53 2.2.10 Sơ đồ usecase đăng xuất……………………………………………….53 2.3 Đặc tả usecase…………………………………………………………………53 2.3.1 Usecase quản lý khách hàng…………………………………………… 53 2.3.2 Usecase quản lý đăng nhập………………………………………………54 2.3.3 Usecase quản lý đăng xuất………………………………… ………….55 2.3.4 Usecase quản lý sản phẩm……………………………………………….55 2.3.5 Usecase quản lý người dùng…………………………………………… 56 2.3.6 Usecase quản lý danh mục …………………………………………… 57 2.3.7 Usecase quản lý đơn hàng ………………………….……………………58 2.4 Mô tả bảng sở liệu………………………………………………….59 2.4.1 Bảng khách hàng…………………………………….………………… 59 2.4.2 Bảng sản phẩm………………………………………………………… 60 2.4.3 Bảng người dùng……………………………………………………… 60 2.4.4 Bảng danh mục……………….………………………………………….61 2.5.5 Bảng phân quyền……………………………………….……………… 61 CHƯƠNG 3: CÀI ĐẶT WEB SHOP PROJECT…… ………… …………… 63 3.1 Triển khai môi trường làm việc……… …………………………………… 63 3.1.1 Yêu Cầu………………………… …………………….……………… 63 3.1.2 Cài môi trường……………….… … …………… ….…….…… .63 3.2 Thực hiện………… ………………………………………………………….63 3.2.1 Register……………………… ……….…………………………… 63 3.2.2 Login………………………… ………………….………………… 63 SVTH: Trần Hữu Thắng - Lớp 18CNTT3 3.2.3 Logout.……………………… …… ……………….…………………65 3.2.4 Change Password…………… …… ……………… ……………… 66 3.2.5 Product Interface…………… …… ……………… ……………… 66 3.2.6 Manage CartList.……….…… …… .……………… ……….…… 67 3.2.7 Manage Product………….…… …… .…………… ………… … 71 3.2.8 Manage Category………………………… ………… ……………… 81 3.2.9 ManageUser & Roles……………………… ……… ………………….86 3.2.10 Category Filter…………………………… ……… ………………….93 3.2.11 Product Detail ………………… ….…… ……… …………………93 3.2.12 Product Order & Dashboad…… …….……………………………… 94 KẾT LUẬN VÀ HƯỚNG PHÁT TRIỂN…………………………………….… 95 Các kết đạt được……………………………………………………….… 95 Nhận xét đề xuất…………………………………………………… … … 95 Hướng phát triển……………………………………………………………… 95 TÀI LIỆU THAM KHẢO…………………………………………… …… … 96 PHỤ LỤC MÃ NGUỒN……………………………………………………….…97 SVTH: Trần Hữu Thắng - Lớp 18CNTT3 MỞ ĐẦU Ngày nay, với phát triển mạnh mẽ công nghệ thông tin ứng dụng đời sống Máy tính điện tử khơng cịn thứ phương tiện lạ lẫm người mà dần trở thành cơng cụ làm việc giải trí thơng dụng hữu ích chúng ta, khơng cơng sở mà cịn gia đình Với phát triển công nghệ 4.0 bao trùm giới , việc sử dụng phương tiện, công cụ, web, app xuất rộng rãi.Trong kinh tế nay, với xu tồn cầu hố kinh tế giới, mặt đời sống xã hội ngày nâng cao, đặc biệt nhu cầu trao đổi hàng hoá người ngày tăng số lượng chất lượng.Hiện công ty tin học hàng đầu giới không ngừng đầu tư cải thiện giải pháp sản phẩm nhằm cho phép tiến hành thương mại hóa Internet Thơng qua sản phẩm công nghệ này, dễ dàng nhận tầm quan trọng tính tất yếu thương mại điện tử Với thao tác đơn giản máy có nối mạng Internet bạn có tận tay cần mà khơng phải nhiều thời gian Bạn cần vào trang dịch vụ thương mại điện tử, làm theo hướng dẫn click vào bạn cần Các nhà dịch vụ mang đến tận nhà cho bạn Để tiếp cận góp phần đẩy mạnh phổ biến thương mại điện tử Việt Nam Chúng em tìm hiểu lựa chọn đề tài Nghiên cứu khoa học “ Xây Dựng website bán hàng điện tử KATSU” SVTH: Trần Hữu Thắng - Lớp 18CNTT3 10 ['roles' => $role] ); } /** * Store a newly created resource in storage * * @param \Illuminate\Http\Request $request * @return \Illuminate\Http\Response */ public function store(Request $request, product $product) { $request->validate([ 'name' => 'required|min:5', 'price' => 'required|min:5', 'descripsion' => 'required|min:10', ]); if ( Auth::user()->role->name == 'admin' && isset($_POST['show_on_home']) ){ $product->show_on_home = $request->show_on_home; } if ($request->hasFile('image')) { $ext = $request->image->getClientOriginalExtension(); $file = date('YmdHis') rand(1, 9999) '.' $ext; $request->image->storeAs('/public/products', $file); } else { $file = ''; } $product->user_id = Auth::user()->id; $product->category_id = $request->category_id; $product->image = $file; $product->name = $request->name; $product->price = $request->price; $product->descripsion = $request->descripsion; $product->save(); $notification = [ 'message' => 'Đã Tạo sản phẩm', 'alert-type' => 'success', ]; SVTH: Trần Hữu Thắng - Lớp 18CNTT3 108 return redirect() ->route('product.index') ->with($notification); } /** * Display the specified resource * * @param int $id * @return \Illuminate\Http\Response */ public function show(request $request, $id) { // // $product = Product::find($id); // print_r ($product->category); } /** * Show the form for editing the specified resource * * @param int $id * @return \Illuminate\Http\Response */ public function edit($id) { // $product = product::findOrFail($id); $category = Category::all(); $role = Auth::User(); if ( Auth::user()->role->name == 'admin' || $product->user_id == Auth::user()->id ){ return view('auth.admin.product.edit', [ 'product' => $product, 'categories' => $category, 'roles' => $role, ]); } else { $notification = [ SVTH: Trần Hữu Thắng - Lớp 18CNTT3 109 'message' => 'Bạn admin người đăng sản phẩm nên khơng có quyền sửa', 'alert-type' => 'error', ]; return back()->with($notification); } } /** * Update the specified resource in storage * * @param \Illuminate\Http\Request $request * @param int $id * @return \Illuminate\Http\Response */ public function update(Request $request, Product $product) { // $request->validate([ 'name' => 'required|min:5', 'price' => 'required|min:5', 'descripsion' => 'required|min:10', ]); if ( Auth::user()->role->name == 'admin' && isset($_POST['show_on_home']) ){ $product->show_on_home = $request->show_on_home; } else { $product->show_on_home = 0; } if ( isset($request->image) && $request->image->getClientOriginalName() ){ $ext = $request->image->getClientOriginalExtension(); $file = date('YmdHis') rand(1, 9999) '.' $ext; $request->image->storeAs('public/products', $file); } else { if (!$product->image) { $file = ''; SVTH: Trần Hữu Thắng - Lớp 18CNTT3 110 } else { $file = $product->image; } } $product->category_id = $request->category_id; $product->name = $request->name; $product->price = $request->price; $product->image = $file; $product->descripsion = $request->descripsion; $product->save(); $notification = [ 'message' => 'cập nhật sản phẩm thành công', 'alert-type' => 'success', ]; return redirect() ->route('product.index') ->with($notification); } /** * Remove the specified resource from storage * * @param int $id * @return \Illuminate\Http\Response */ public function destroy($id) { // $product = product::findOrFail($id); if ( Auth::user()->role->name == 'admin' || $product->user_id == Auth::user()->id ){ Product::destroy($id); return redirect()->route('product.index'); } else { $notification = [ 'message' => 'Bạn admin người đăng sản phẩm nên khơng có quyền xóa', 'alert-type' => 'error', ]; return back()->with($notification); SVTH: Trần Hữu Thắng - Lớp 18CNTT3 111 } } public function hotProduct(Request $request) { return response()->json( Product::where('show_on_home', true) ->limit(10) ->get() ); } public function Product(Request $request) { return response()->json( Product::where('show_on_home', false) ->limit(10) ->get() ); } public function showcategories(Request $request) { return response()->json(Category::get()); } public function show_product_category($id) { return response()->json(Product::where('category_id', $id)->get()); } public function ProductDetail($id) { return response()->json(Product::find($id)); } } User