Xây dựng hệ thống tra cứu dinh dưỡng và quản lý thực đơn

ĐẠI HỌC ĐÀ NẴNG TRƯỜNG ĐẠI HỌC SƯ PHẠM ĐÀ NẴNG KHOA TIN HỌC  Đề tài: XÂY DỰNG HỆ THỐNG TRA CỨU DINH DƯỠNG VÀ QUẢN LÝ THỰC ĐƠN Giảng viên hướng dẫn Sinh viên thực Lớp : TS Nguyễn Trần Quốc Vinh : Đồng Diễm Thúy : 11CNTT1 Đà Nẵng, tháng 05/2015 LỜI CẢM ƠN Đầu tiên, em xin bày tỏ lòng biết ơn chân thành sâu sắc tới Tiến sĩ Nguyễn Trần Quốc Vinh, người tận tình hướng dẫn, giúp đỡ em để khóa luận hoàn thành Em xin chân thành cảm ơn Trường Đại học Sư Phạm Đà Nẵng toàn thể giảng viên khoa Tin học, trường Đại học Sư Phạm Đà Nẵng tạo điều kiện thuận lợi cho em trình học tập hồn thành khóa luận tốt nghiệp đại học Em xin cảm ơn dạy dỗ, bảo quan tâm thầy cô khoa Tin học suốt thời gian em theo học hồn thành khóa luận Cuối cùng, em muốn gửi lời cảm ơn chân thành tới gia đình, bạn bè, người ln động viên khích lệ giúp em hồn thành khóa luận tốt nghiệp Xin chân thành cảm ơn Sinh viên Đồng Diễm Thúy LỜI CAM ĐOAN Tôi xin cam đoan: Những nội dung báo cáo thực hướng dẫn trực tiếp Tiến sĩ Nguyễn Trần Quốc Vinh, trưởng khoa Tin học, trường Đại học Sư phạm- Đại học Đà Nẵng Mọi tham khảo dùng báo cáo trích dẫn rõ ràng tên tác giả, tên cơng trình, thời gian, địa điểm công bố Mọi chép không hợp lệ, vi phạm quy chế đào tạo, hay gian trá, xin chịu hoàn toàn trách nhiệm Sinh viên Đồng Diễm Thúy NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… ………………………………………………………………………………… Đà Nẵng, ngày 03 tháng 05 năm 2015 TRƯỞNG KHOA TS Nguyễn Trần Quốc Vinh GIẢNG VIÊN HƯỚNG DẪN TS Nguyễn Trần Quốc Vinh SINH VIÊN KÝ TÊN Đồng Diễm Thúy MỤC LỤC DANH MỤC VIẾT TẮT i DANH MỤC BẢNG BIỂU iii DANH MỤC HÌNH VẼ iv MỞ ĐẦU 1 Tính cấp thiết đề tài Mục tiêu nghiên cứu 3 Đối tượng phạm vi nghiên cứu Phương pháp nghiên cứu Bố cục đề tài CHƯƠNG CƠ SỞ LÝ THUYẾT 1.1 Mơ hình web service 1.2 Giao thức HTTP 1.3 RESTful Web Service 10 1.4 Công nghệ JAX_RS 12 1.5 Servlet 12 1.6 Phương pháp phát triển ứng dụng dựa mơ hình TDD (Test-Driven Development) 13 1.7 Phương pháp phát triển ứng dụng web dựa mơ hình SPA 15 1.7.1 Giới thiệu SPA 15 1.7.2 Ưu nhược điểm SPA 15 1.8 AngularJS 16 1.8.1 Các khái niệm dùng AngularJS 17 1.8.2 Mơ hình MVC AngularJS 18 1.9 Xây dựng ứng dụng di động Ionic Framework 19 1.9.1 Giới thiệu Ionic Framework 19 1.9.2 1.9.3 Cordova 20 Tính bật Ionic Framework 20 CHƯƠNG PHÂN TÍCH THIẾT KẾ HỆ THỐNG 22 2.1 Khái quát nghiệp vụ toán 22 2.2 Hướng tiếp cận toán 23 2.3 Chức hệ thống 26 2.4 Các tác nhân hệ thống 27 2.5 Lược đồ Usecase toàn hệ thống 27 2.5.1 Mô tả Usecase hình thức User Story 28 2.5.2 Mô tả Acception Test 28 2.6 Sequence Diagram 30 2.7 2.8 Class Diagram 35 Cơ sở liệu 37 2.9 Mô tả liệu 38 CHƯƠNG THỬ NGHIỆM CHƯƠNG TRÌNH 45 3.1 Cài đặt cấu hình hệ thống 45 3.2 Các giao diện 45 3.2.1 3.2.2 Giao diện trang chủ 45 Giao diện truy cập vào sở liệu 46 3.2.3 Giao diện quản lý hệ thống 47 3.2.4 Giao diện dành cho người sử dụng 49 3.2.5 Giao diện mobile tảng Android 52 KẾT LUẬN VÀ KIẾN NGHỊ 54 TÀI LIỆU THAM KHẢO 55 PHỤ LỤC 57 i DANH MỤC VIẾT TẮT STT Kí hiệu Tên ký hiệu viết tắt FAO Food and Agriculture Tổ chức Lương thực Nông Organization of the United nghiệp Liên Hiệp Quốc Nations WHO World Health Organization Tổ chức Y tế Thế giới USDA United States Department of Agriculture Bộ Nông nghiệp Hoa Kỳ BMI Body Mass Index Chỉ số khối thể TDD Test Driven Development Mơ hình phát triển với trọng tâm hướng việc kiểm thử API Application Programming Giao diện lập trình ứng dụng Interface REST Representational State Transfer Web Service SPA Single Page Application Ứng dụng trang HTTP Hypertext Transfer Protocol Giao thức truyền siêu văn 10 JDBC Java Database Connectivity Công nghệ kết nối sở liệu Java 11 URL Uniform Resource Location Định vị tài nguyên thống Tên tiếng việt ii 12 JSON JavaScript Object Notation 13 XML eXtensible Markup Language Ngôn ngữ đánh dấu mở rộng 14 DOM Document Object Model Mơ hình đối tượng tài liệu 15 CSS Cascading Style Sheet 16 JDK Java Development Kit iii DANH MỤC BẢNG BIỂU Bảng 2.1 Tác nhân hệ thống 27 Bảng 2.2 Bảng mô tả Acceptance Test cho chức tìm kiếm thành phần dinh dưỡng thực phẩm 30 Bảng 2.3 Cấu trúc thông tin liệu Ingredient 38 Bảng 2.4 Cấu trúc thông tin liệu nutrient 39 Bảng 2.5 Cấu trúc thông tin liệu bảng ingredient_join_nutrient 40 Bảng 2.6 Cấu trúc thông tin liệu bảng nutrix_recipe_join_ingredient 40 Bảng 2.7 Cấu trúc thông tin liệu bảng nutrix_recipe_join_ingredient 40 Bảng 2.8 Bảng mô tả cấu trúc thông tin liệu thành phần dinh dưỡng thực phẩm thịt heo nạc (pork) Hoa Kỳ 43 iv DANH MỤC HÌNH VẼ Hình 1.1 Mơ hình web service Hình 1.2 Giao thức HTTP Hình 1.3 Chu trình Test Driven Development 14 Hình 1.4 Mơ hình MVC Angularjs 19 Hình 2.1 Bài tốn đặt hệ thống 24 Hình 2.2 Sơ đồ mối quan hệ phương diện hệ thống 24 Hình 2.3 Các phương tiện hệ thống sử dụng 26 Hình 2.4 Lược đồ usecase hệ thống 27 Hình 2.5 Sơ đồ cho chức tìm kiếm thông tin lọại thực phẩm giao diện 30 Hình 2.6 Sơ đồ cho chức tìm kiếm thơng tin loại thực phẩm người dùng cung cấp tên loại thực phẩm cho service 31 Hình 2.7 Sơ đồ cho chức tìm kiếm thơng tin chất dinh dưỡng giao diện 31 Hình 2.8 Sơ đồ cho chức tìm kiếm thông tin chất dinh dưỡng người dùng cung cấp tên chất dinh dưỡng cho service 32 Hình 2.9 Sơ đồ cho chức tạo thực đơn giao diện 32 Hình 2.10 Sơ đồ cho chức tạo thực đơn service 33 Hình 2.11 Sơ đồ cho chức thêm loại thực phẩm giao diện 33 Hình 2.12 Sơ đồ cho chức sửa loại thực phẩm giao diện 34 Hình 2.13 Sơ đồ cho chức xóa loại thực phẩm giao diện 34 Hình 2.14 Các thực thể Boundary, Control, Entity Class Diagram 35 Hình 2.15 Class Diagram tìm kiếm thơng tin hàm lượng dinh dưỡng 36 Hình 2.16 Class Diagram Tạo thực đơn 37 Hình 2.17 Cơ sở liệu dinh dưỡng 37 Hình 2.18 Cơ sở liệu quản lý hệ thống 38 Hình 3.1 Giao diện trang chủ 45 Hình 3.2 Giao diện nutrix web service 46 Hình 3.3 Giao diện khai thác liệu cho nutrient 47 Hình 3.4 Giao diện trang quản lý hệ thống 47 Hình 3.5 Giao diện trang xem thông tin thực phẩm 48 Hình 3.6 Giao diện trang xem thơng tin chất dinh dưỡng 48 Hình 3.7 Giao diện trang sửa thông tin thực phẩm 49 Hình 3.8 Giao diện trang quản lý người dùng 50 Hình 3.9 Giao diện trang xem chi tiết thực phẩm 50 51 Hình 3.10 Giao diện trang tạo thực đơn Hình 3.11 giao diện chỉnh sửa thực đơn với chỉnh sửa thêm xóa thực phẩm Lúc thơng số chất dinh dưỡng có thực đơn tính tốn lại Hình 3.11 Giao diện trang chỉnh sửa thực đơn Hình 3.12 giao diện thêm thực phẩm thực đơn với lựa chọn thực phẩm số lượng thực phẩm sử dụng thực đơn 52 Hình 3.12 Giao diện trang thêm thực phẩm thực đơn 3.2.5 Giao diện mobile tảng Android Là giao diện mobile sử dụng Ionic framework Với Ionic, chạy Android, iOS, Winphone với khóa luận này, điều kiện cịn hạn chế nên ứng dụng chạy Android 53 Hình 3.13 Các giao diện xem thơng tin thực phẩm, chất dinh dưỡng xem chi tiết thông tin thực phẩm Các hình giao diện hiển thị xem danh sách thực phẩm, danh sách chất dinh dưỡng xem chi tiết thực phẩm thiết bị di động chạy Android 54 KẾT LUẬN VÀ KIẾN NGHỊ Sau thời gian học tập tìm hiểu cơng nghệ mới,với sáu tháng để hồn thành khóa luận, em xây dựng ứng dụng để tra cứu xây dựng thực đơn dinh dưỡng dựa mơ hình Web Service Onepage Application Thơng qua khóa luận này, em hiểu thêm dịch vụ Web (Web Service), học thêm công nghệ mới, xây dựng Web Service Java, sử dụng Spring Framework phát triển ứng dụng phía client web thiết bị di động với AngularJS, Ionic framework Với thời gian kỹ có hạn, ứng dụng cịn thiếu sót nhiều tính nên hướng phát triển nghiên cứu thêm là: Có thể phát triển thêm chức khác lưu trữ thực đơn, tính lượng cần thiết tùy theo người Thu thập xác liệu dinh dưỡng Việt Nam để làm đa dạng sở liệu Phát triển hệ thống hướng đa tảng, đa thiết bị Bảo mật liệu cho website Với kinh nghiệm tiếp cận cơng nghệ cịn hạn chế nên kết ứng dụng cịn nhiều thiếu sót Rất mong thầy bạn đóng góp ý kiến để ứng dụng hoàn thiện thêm Cuối cùng, em xin chân thành cảm ơn toàn thể giảng viên khoa công nghệ thông tin Đại học Sư Phạm Đà Nẵng, đặc biệt giảng viên hướng dẫn Tiến sĩ Nguyễn Trần Quốc Vinh nhiệt tình giúp đỡ em hoàn thành đề tài Xin chân thành cảm ơn! 55 TÀI LIỆU THAM KHẢO Tiếng Việt [5] Hà Anh, Nâng cao tầm vóc trẻ em, 30/09/2013, truy cập ngày 29 tháng 01 năm 2015, [7] Viện dinh dưỡng Chiến lược quốc gia dinh dưỡng giai đoạn 2011-2020 tầm nhìn đến năm 2030 Viện dinh dưỡng, pages 1–2, 02-2012 [8] Viện dinh dưỡng Số liệu thống kê tình trạng dinh dưỡng trẻ em qua năm, 3-2014, truy cập ngày 08 tháng 12 năm 2014, http://www.nutrition.org.vn/news/vi/134/89/a/so-lieu-thong-ke-ve-tinh-trangdinh-duong-tre-em-qua-c aspx [20] PGS TS Hà Thị Anh Đào PGS TS Nguyễn Công Khẩn Bảng thành phần thực phẩm Việt Nam Nhà xuất Y học, 2007 [26] Liên Hợp Quốc Việt Nam Dinh dưỡng bà mẹ trẻ em việt nam, 2013, truy cập ngày 25 tháng 11 năm 2014, Tiếng Anh [1] Scott W Ambler Acceptance/customer tests as requirements artifacts: An agile introduction, truy cập ngày 11 tháng 01 năm [2] AngularJS Conceptual overview, truy cập ngày 12 tháng 12 năm 2014, < https://docs.angularjs.org/guide/concepts> 2015, 56 [3] Scott Ambler + Associates User stories: An agile introduction, 2014, truy cập ngày 09 tháng 12 năm 2014, [4] Dan Bunea How tdd improves development speed and is very cost effective, September 22, 2005, truy cập ngày [6] William C.Wake Refactoring Workbook Addsion-Wesley, 2004 [9] Drifty The ionic book, 2014, truy cập ngày 12 tháng 01 năm 2015, [10] FAO New developments in nutrition education utilising computer technology, 2014, truy cập ngày 15 tháng 11 năm 2014, [11] Happyworm The future of web apps – single page applications, Monday, August 23rd, 2010, truy cập ngày [12] United States Department of Agriculture Usda national nutrient database for standard reference, 2014, truy cập ngày 16 tháng 11 năm 2014, [13] Ruby on Rails insights for developers Single page application done right, Monday, August 23rd, 2010, truy cập ngày 19 tháng 12 năm 2014, 04/single-page-application- 57 [14] Oracle The Java EE 6Tutorial - Developing RESTfulWeb Services with JAX-RS [15] Oracle The Java EE 6Tutorial Oracle page 23-25 [16] Oracle Developing Applications For the Java EE Platform Oracle page 120-124 [17] Oracle Jdbc-oracle, 2014, truy cập ngày 09 tháng 12 năm 2014, [18] Oracle Annotations, 2014, truy cập ngày 23 tháng 12 năm 2014, [19] David Orenstein How to application programming interface Computerworld, October, 2000 [21] Uri Shaked Angularjs vs backbone.js vs ember.js, truy cập ngày 15 tháng 12 năm 2014, [22] James Shore The Art of Agile Development 2010 [23] Pathfinder Solutions The pros and cons of tdd, June 11, 2012, truy cập ngày 25 tháng 12 năm 2014, [24] tutorialspoint Http-request, 2014, truy cập ngày 08 tháng 01 năm 2014, [25] tutorialspoint Http-response, 2014, truy cập ngày 29 tháng 12 năm 2014, 58 [27] USDA About the database, 2014, truy cập ngày 19 tháng 12 năm 2014, [28] versionone Test-first programming, 2014, truy cập ngày 02 tháng 04 năm 2015, [29] Wikipedia Android, 2014, truy cập ngày 06 tháng 02 năm 2015, [30] Wikipedia Hypertext transfer protocol, 2014, truy cập ngày 12 tháng 03 năm 2015, [31] Wikipedia Representational state transfer, 2014, truy cập ngày 16 tháng 12 năm 2014, [32] Wikipedia Single-page application, 2014, truy cập ngày 18 tháng 02 năm 2015, PHỤ LỤC Mã nguồn file controller.js (nutrix_user_gui) var app = angular.module('nutrixApp'); app.directive('listingredient', function($timeout, $log, $http, baseUrl, $stateParams) { return { restrict: 'E', scope: {}, templateUrl: 'tmpl/listingredient.html', replace: true, controller: function ($scope , $http, baseUrl) { $log.debug("IngredientCtrl get here"); $scope.ingredients = []; $scope.nutrients = []; $scope.selectedIngredient = {}; $scope.viewIngredientForm = null; $scope.init = function() { $scope.ingredients = []; $scope.query = undefined; $scope.currentPage = 1; $scope.itemsPerPage = 15; $scope.totalItems = -1; $scope.bigTotalItems = -1; $scope.bigCurrentPage = 1; $scope.maxSize = 7; } $scope.loadMoreIngredients = function() { var myparams = { offset: ($scope.bigCurrentPage - 1) * $scope.itemsPerPage, max: $scope.itemsPerPage } if ($scope.query != undefined && $scope.query != null) { myparams['q'] = $scope.query; } $http.get(baseUrl + '/nutrix/adm/ingredient', { params: myparams }).then(function(resp) { console.log('Success', resp); $log.debug("Start:" + ($scope.bigCurrentPage - 1) * $scope.itemsPerPage); $scope.bigTotalItems = resp.data.total; $log.debug("Total:" + $scope.bigTotalItems); $scope.ingredients = resp.data.collection; console.log($scope.itemsPerPage); }, function(err) { console.error('ERR', err); }); }; $scope.$watch('bigCurrentPage + itemsPerPage', function() { $scope.loadMoreIngredients(); }); $scope.doSearchIngredients = function(q) { console.log('doSearchIngredients'); $scope.init(); $scope.query = q; $scope.loadMoreIngredients(); }; $scope.openViewIngredientForm = function(ingredient) { $scope.viewIngredientForm = "edit"; $scope.selectedIngredient = ingredient; } $scope.isViewIngredienShow = function() { return ($scope.viewIngredientForm == "edit"); } $scope.init(); }, // end of controller link: function($scope, element, attrs) { $log.debug("listingredient go to here"); } // end of link } }; Mã nguồn file listrecipe.js (nutrix-user-gui) var app = angular.module('nutrixApp'); app.directive('listrecipe', function($timeout, $log, $http, baseUrl) { return { restrict: 'E', scope: {}, templateUrl: 'tmpl/listrecipe.html', replace: true, controller: function ($scope , $http, baseUrl) { //init recipes $scope.recipes = []; $scope.recipe = {}; $scope.currentPage = 1; $scope.itemsPerPage = 4; $scope.totalItems = -1; $scope.bigTotalItems = -1; $scope.bigCurrentPage = 1; $scope.maxSize = 4; $scope.recipeForm = null; $http.get(baseUrl + '/nutrix/adm/recipe').success(function (data) { $scope.recipes = data.collection; }); $scope.loadMoreRecipes = function() { var myparams = { offset: ($scope.bigCurrentPage - 1) * $scope.itemsPerPage, max: $scope.itemsPerPage } $http.get(baseUrl + '/nutrix/adm/recipe', { params: myparams }).then(function(resp) { console.log('Success', resp); $log.debug("Start:" + ($scope.bigCurrentPage - 1) * $scope.itemsPerPage); $scope.bigTotalItems = resp.data.total; $log.debug("Total:" + $scope.bigTotalItems); $scope.recipes = resp.data.collection; console.log($scope.itemsPerPage); }, function(err) { console.error('ERR', err); }); }; $scope.$watch('bigCurrentPage + itemsPerPage', function() { $scope.loadMoreRecipes(); }); $scope.isRecipeFormShow = function() { return ($scope.recipeForm == "edit"); } $scope.openEditRecipeForm = function(recipe) { $scope.recipeForm = "edit"; $scope.recipeItem = angular.copy(recipe); }; $scope.$watch("recipeForm", function(newValue, oldValue) { console.log('old:' + oldValue + ' / new:' + newValue); if ($scope.recipeForm == "create-done") { $http.post(baseUrl + '/nutrix/adm/recipe', $scope.recipeItem).success(function (newRecipe) { $scope.recipes.push(newRecipe); }); } if ($scope.recipeForm == "update-done") { $http.put(baseUrl + '/nutrix/adm/recipe' + '/'+ $scope.recipeItem.id, $scope.recipeItem) success(function (newRecipe) { for (var i = 0; i < $scope.recipes.length; i++) { if ($scope.recipes[i].id == newRecipe.id) { $scope.recipes[i] = newRecipe; break; } } $scope.recipeItem = {}; $scope.recipeForm = null; //"edit" }); } if ($scope.recipeForm == "delete-done") { if (angular.isDefined($scope.recipeItem.id)) { $http.delete(baseUrl + '/nutrix/adm/recipe' +'/'+ $scope.recipeItem.id).success(function () { var position = -1; for (var i = 0; i < $scope.recipes.length; i++) { if ($scope.recipes[i].id == $scope.recipeItem.id) { position = i; break; } } if (position >= 0) { $scope.recipes.splice(position, 1); } $scope.recipeItem = {}; $scope.recipeForm = null; //"edit" }); } } }); $scope.consoleLogModel = function() { $log.debug(" -"); $log.debug("List Recipe object:"); $log.debug($scope.recipes); $log.debug($scope.recipeItem); }; // open directive editrecipe $scope.isCollapsed = true; }, link: function($scope, element, attrs) { $log.debug("listrecipe go to here"); } } }); Mã nguồn file router.js //Setting up route angular.module('nutrixApp').config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) { $urlRouterProvider.otherwise('/'); $stateProvider state('viewingredient', { url: '/viewingredient/:id', resolve: { ingredientId: function($stateParams) { return $stateParams.id; }, }, controller: 'viewIngredientCtrl', templateUrl: 'view/viewingredient.html' }) state('ingredients', { url: '/ingredients', controller: 'IngredientCtrl', templateUrl: 'view/ingredient.html' }) state('listingredients', { url: '/listingredients', controller: 'IngredientCtrl', templateUrl: 'view/listingredients.html' }) state('recipes', { url: '/recipes', controller: 'IngredientCtrl', templateUrl: 'view/recipes.html' }) } ]); ... cứu Xây dựng hệ thống "Tra cứu thông tin tạo thực đơn dinh dưỡng" giúp người dùng tra cứu thành phần dinh dưỡng thực phẩm, tạo thực đơn dinh dưỡng để kiểm soát lượng calories hấp thụ thể Để xây. .. xây dựng hệ thống "Tra cứu thông tin tạo thực đơn dinh dưỡng" với sở liệu tham khảo từ sở liệu dinh dưỡng Bộ Nông nghiệp Hoa Kì giúp người sử dụng tra cứu thành phần dinh dưỡng thực phẩm, tạo thực. .. "Tra cứu thông tin tạo thực đơn dinh dưỡng" với sở liệu tham khảo từ sở liệu dinh dưỡng Bộ Nơng nghiệp Hoa Kì giúp người sử dụng tra cứu thành phần dinh dưỡng thực phẩm, tạo thực đơn dinh dưỡng