From 73a953371ccca8dfbe6fd7f6076057b565a32ff1 Mon Sep 17 00:00:00 2001
From: Joel Salisbury <joel.salisbury@gmail.com>
Date: Thu, 1 Mar 2018 15:23:14 -0500
Subject: [PATCH] food lookup now working

---
 package-lock.json         | 33 +++++++++++--
 package.json              |  1 +
 src/App.vue               |  1 +
 src/components/Food.vue   | 23 ++++-----
 src/components/Search.vue | 99 ++++++++++++++++++++++++++++++++-------
 src/http-common.js        |  5 ++
 src/main.js               |  3 +-
 7 files changed, 127 insertions(+), 38 deletions(-)
 create mode 100644 src/http-common.js

diff --git a/package-lock.json b/package-lock.json
index ba2da38..8afb62c 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -387,6 +387,15 @@
         "postcss-value-parser": "3.3.0"
       }
     },
+    "axios": {
+      "version": "0.18.0",
+      "resolved": "https://registry.npmjs.org/axios/-/axios-0.18.0.tgz",
+      "integrity": "sha1-MtU+SFHv3AoRmTts0AB4nXDAUQI=",
+      "requires": {
+        "follow-redirects": "1.4.1",
+        "is-buffer": "1.1.6"
+      }
+    },
     "babel-code-frame": {
       "version": "6.26.0",
       "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@@ -3648,6 +3657,24 @@
         "readable-stream": "2.3.3"
       }
     },
+    "follow-redirects": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.4.1.tgz",
+      "integrity": "sha512-uxYePVPogtya1ktGnAAXOacnbIuRMB4dkvqeNz2qTtTQsuzSfbDolV+wMMKxAmCx0bLgAKLbBOkjItMbbkR1vg==",
+      "requires": {
+        "debug": "3.1.0"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npmjs.org/debug/-/debug-3.1.0.tgz",
+          "integrity": "sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
+      }
+    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",
@@ -4488,8 +4515,7 @@
     "is-buffer": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/is-buffer/-/is-buffer-1.1.6.tgz",
-      "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==",
-      "dev": true
+      "integrity": "sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w=="
     },
     "is-builtin-module": {
       "version": "1.0.0",
@@ -5454,8 +5480,7 @@
     "ms": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz",
-      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=",
-      "dev": true
+      "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g="
     },
     "multicast-dns": {
       "version": "6.2.3",
diff --git a/package.json b/package.json
index 9b3e520..d8ec918 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "build": "node build/build.js"
   },
   "dependencies": {
+    "axios": "^0.18.0",
     "vue": "^2.5.2",
     "vue-resource": "^1.3.5",
     "vue-router": "^3.0.1"
diff --git a/src/App.vue b/src/App.vue
index 9abfc06..e2c5e86 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,6 +5,7 @@
 </template>
 
 <script>
+
 export default {
   name: 'App'
 }
diff --git a/src/components/Food.vue b/src/components/Food.vue
index 38efd22..b1c033b 100644
--- a/src/components/Food.vue
+++ b/src/components/Food.vue
@@ -7,6 +7,7 @@
 </template>
 
 <script>
+import axios from 'axios';
 export default {
 	name: 'Food',
 	data () {
@@ -25,23 +26,17 @@ export default {
 	methods:{
 
 	  	getFoodInfo: function() {
-			this.$http.get('http://foodbank.develop.digitalmediauconn.org/api/food/barcode/038000311307').then((response) =>  {
-			        	if(response.ok) {
-			        		return response.body
-			        	}
-			        }).then(function(results) {
-			        	if(results.id === null) {
-			        		this.$router.replace({name: '404'})
-			        	} else {
-			        		this.header = results.data.name
-			        		this.rank = results.data.rank.name
-			        		this.category = results.data.category.name
-			        	}
-			        })
+			axios.get('http://foodbank.develop.digitalmediauconn.org/api/food/barcode/038000311307').then((response)  =>  {
+		        this.loading = false;
+		         this.header = response.data.data.name;
+		      }, (error)  =>  {
+		        this.loading = false;
+		      })
+		    }
 		}
     }
 	
-}
+
 </script> 
 
 <style scoped>
diff --git a/src/components/Search.vue b/src/components/Search.vue
index b5b404d..d36fcbe 100644
--- a/src/components/Search.vue
+++ b/src/components/Search.vue
@@ -2,34 +2,97 @@
 	<div class="searchform">
 		<h1>{{header}}</h1>
 		<fieldset>
-			<p><label for="upc">UPC</label> <input type="text" id="upc"></p>
-			<select name="category">
-
-				<option>Fruit</option>
-				<option>Vegetables</option>
-				<option>Grains</option>
-				<option>Protein: Plant-Based</option>
-				<option>Protein: Animal</option>
-				<option>Combination Foods/Meals</option>
-				<option>Dairy - Milk</option>
-				<option>Dairy - Yogurt</option>
-				<option>Dairy - Cheese</option>
-				<option>Condiments</option>
-				<option>Beverages</option>
-				<option>Snacks/Desserts</option>
-			</select>
+			<p><label for="upc">UPC</label> <input type="text" name="upc" id="upc" v-model="searchTerm"></p>
+			<div class="notFound" v-if="notFound">
+				<p>Hmm...that food wasn't in SWAP Global. Want to look it up?</p>
+				<select v-model="rulesCat" name="category">
+					<option value="1">Fruit</option>
+					<option value="2">Vegetables</option>
+					<option value="3">Grains</option>
+					<option value="4">Protein: Plant-Based</option>
+					<option value="5">Protein: Animal</option>
+					<option value="6">Combination Foods/Meals</option>
+					<option value="7">Dairy - Milk</option>
+					<option value="8">Dairy - Yogurt</option>
+					<option value="9">Dairy - Cheese</option>
+					<option value="10">Condiments</option>
+					<option value="11">Beverages</option>
+					<option value="12">Snacks/Desserts</option>
+				</select>
+			</div>
+
+
+
+
+
+			<button  v-on:click="getData">Search</button>
 		</fieldset>
+
+		<div class="search-results" v-if="food.id">
+					<h3> Search Results </h3>
+					
+					<div class="food-result">
+
+						<h4 v-if="food.id">{{food.name}}</h4>
+						<p v-if="food.id">{{food.category.name}}</p>
+						<p v-if="food.id">{{food.rank.name}}</p>
+
+					</div>
+		</div>
+
+		
+
+
 	</div>
 </template>
 
+
+
+
 <script>
+import axios from 'axios';
 export default {
 	name: 'SearchForm',
 	data () {
 		return {
-			header:"Search for a Food by UPC"
+			header:"Search for a Score by UPC",
+			food:{},
+			upc:"",
+			searchTerm:"",
+			rulesCat: "",
+			notFound:false,
+			requestMess: ""
+		}
+	} ,
+	methods: {
+			getData: function(event) {
+				// if we're not looking up a new food
+				if (!this.notFound) {
+					axios.get('http://foodbank.develop.digitalmediauconn.org/api/food/barcode/' + this.searchTerm).then((response)  =>  {
+				         this.loading = false;
+				         this.food = response.data.data;
+				         if (!this.food.id) {
+				         	this.notFound = true;
+				         }
+				      }, (error)  =>  {
+				        this.loading = false;
+				      })
+					} else { // if we're looking up a new food (not found in swap db)
+						axios.get('http://foodbank.develop.digitalmediauconn.org/api/getDecision/' + this.searchTerm + "/" + this.rulesCat).then((response)  =>  {
+					         this.loading = false;
+					         this.food = response.data.data[0].food;
+					         this.food.id = this.food.name;
+					         console.log(this.food);
+					         // if (!this.food.id) {
+					         // 	this.notFound = true;
+					         // }
+					      }, (error)  =>  {
+					        this.loading = false;
+					      })
+						}
+				} 
+
 		}
-	}
 }
 </script> 
 
diff --git a/src/http-common.js b/src/http-common.js
new file mode 100644
index 0000000..3262b15
--- /dev/null
+++ b/src/http-common.js
@@ -0,0 +1,5 @@
+import axios from 'axios';
+
+export const HTTP = axios.create({
+  baseURL: `http://foodbank.develop.digitalmediauconn.org/api/`
+})
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index ae2375c..de7603b 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,8 +1,7 @@
 // The Vue build version to load with the `import` command
 // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
 import Vue from 'vue'
-import vueResource from 'vue-resource'
-Vue.use(vueResource);
+
 
 
 import App from './App'