Salvando pedido de ajuda

paulovirote · Oct 21, 2017 · b08df85 · b08df85
1 parent 09b9cf7
commit b08df85
Show file tree

Hide file tree

Showing 8 changed files with 154 additions and 87 deletions.
diff --git a/src/components/done/Done.vue b/src/components/done/Done.vue
@@ -11,25 +11,56 @@
       </div>
     </div>
 
-    <vulma-button v-if="isLoading" disabled class="confirm" color='primary'>Concluir</vulma-button> 
-
     <router-link :to="{ name: 'Home' }">
-      <vulma-button v-if="isConcluded" class="confirm" color='primary'>Concluir</vulma-button> 
+      <vulma-button v-bind:class="{ disabled: !isConcluded }" class="confirm" color='primary'>Concluir</vulma-button> 
     </router-link>
 
   </div>
 </template>
 <script>
-export default {
-  name: 'done',
+  import { saveInformation } from '../../services/save/Save'
+  import VueLocalStorage from 'vue-ls'
+  import Vue from 'vue'
+
+  Vue.use(VueLocalStorage)
+  
+  export default {
+    name: 'done',
+
+    data () {
+      return {
+        isLoading: true,
+        isConcluded: false
+      }
+    },
+
+    methods: {
+      saveInfo () {
+        let dados = this.getDados()
+
+        saveInformation(dados)
+          .then(data => {
+            Vue.ls.clear()
+            this.isLoading = false
+            this.isConcluded = true
+          })
+      },
+      getDados () {
+        let dados = {}
 
-  data () {
-    return {
-      isLoading: false,
-      isConcluded: true
+        dados.lat = Vue.ls.get('lat').toString()
+        dados.lng = Vue.ls.get('lng').toString()
+        dados.momento = Vue.ls.get('momento')
+        dados.situacao = Vue.ls.get('situacao')
+
+        return dados
+      }
+    },
+
+    mounted () {
+      this.saveInfo()
     }
   }
-}
 </script>
 <style lang="stylus" scoped>
 
@@ -46,7 +77,7 @@ loader-border-secondary-color= 0.4;
     border-top: loader-border solid rgba(255, 255, 255, loader-border-secondary-color);
     border-right: loader-border solid rgba(255, 255, 255, loader-border-secondary-color);
     border-bottom: loader-border solid rgba(255, 255, 255, loader-border-secondary-color);
-    border-left: loader-border solid #ffffff;
+    border-left: loader-border solid #00d1b2;
     -webkit-transform: translateZ(0);
     -ms-transform: translateZ(0);
     transform: translateZ(0);
@@ -104,6 +135,10 @@ loader-border-secondary-color= 0.4;
   left: 50%
   transform: translate3d(-50%,0,0)
 
+.confirm.disabled
+  cursor not-allowed
+  opacity 0.5
+
 @-webkit-keyframes load {
     0% {
         -webkit-transform: rotate(0deg);

diff --git a/src/components/location/Location.vue b/src/components/location/Location.vue
@@ -25,6 +25,10 @@
 <script>
 import { getLocation } from '../../services/location/LocationService'
 import { getCityName } from '../../services/location/CityService'
+import VueLocalStorage from 'vue-ls'
+import Vue from 'vue'
+
+Vue.use(VueLocalStorage)
 
 export default {
   name: 'location',
@@ -38,10 +42,16 @@ export default {
   methods: {
     location () {
       getLocation()
+        .then(this.saveInformation)
         .then(getCityName)
         .then(data => {
           this.address = data.endereco
         })
+    },
+    saveInformation (position) {
+      Vue.ls.set('lat', position.lat)
+      Vue.ls.set('lng', position.lng)
+      return position
     }
   },
 

diff --git a/src/components/moment/Moment.vue b/src/components/moment/Moment.vue
@@ -8,36 +8,54 @@
     <form action="">
       <div class="wrapper">
         <div class="wrapp-input">
-          <input type="checkbox" class="option" name="pre"> 
+          <input type="radio" class="option" name="momentGroup" value="pre" v-model="checkedMoment"> 
         </div>
         <label class="label" for="pre">Irá Acontecer</label>
       </div>
 
       <div class="wrapper">
         <div class="wrapp-input">
-          <input type="checkbox" class="option" name="durante">
+          <input type="radio" class="option" name="momentGroup" value="durante" v-model="checkedMoment">
         </div>
         <label class="label" for="enchente">Está Acontendo</label>
       </div>
 
       <div class="wrapper">
         <div class="wrapp-input">
-          <input type="checkbox" class="option" name="pos">
+          <input type="radio" class="option" name="momentGroup" value="pos" v-model="checkedMoment">
         </div>
         <label class="label" for="pos">Aconteceu</label>
       </div>
     </form>
 
     <router-link :to="{ name: 'Done' }">
-      <vulma-button class="confirm" color='primary'>Confirmar</vulma-button> 
+      <vulma-button class="confirm" color='primary' v-on:click="saveInformation">Confirmar</vulma-button> 
     </router-link>
 
   </div>
 </template>
 <script>
-export default {
-  name: 'moment'
-}
+  import VueLocalStorage from 'vue-ls'
+  import Vue from 'vue'
+
+  Vue.use(VueLocalStorage)
+
+  export default {
+    name: 'moment',
+
+    data () {
+      return {
+        checkedMoment: ''
+      }
+    },
+
+    methods: {
+      saveInformation () {
+        let checked = this.checkedMoment
+        Vue.ls.set('momento', checked)
+      }
+    }
+  }
 </script>
 <style lang="stylus" scoped>
 .weather-image-wrapper

diff --git a/src/components/situation/Situation.vue b/src/components/situation/Situation.vue
@@ -4,54 +4,91 @@
     <h2 class="situation-title"> Situação </h2>
 
     <form action="">
-      <div class="wrapper">
-        <div class="wrapp-input">
-          <input type="checkbox" class="option" name="deslizamento"> 
+      <div class="wrapper-check">
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Deslizamento" v-model="checkedSituation"> 
+          </div>
+          <label class="label" for="deslizamento">Deslizamento</label>
         </div>
-        <label class="label" for="deslizamento">Deslizamento</label>
-      </div>
-
-      <div class="wrapper">
-        <div class="wrapp-input">
-          <input type="checkbox" class="option" name="enchente">
+
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Enchente" v-model="checkedSituation">
+          </div>
+          <label class="label" for="enchente">Enchente</label>
         </div>
-        <label class="label" for="enchente">Enchente</label>
-      </div>
 
-      <div class="wrapper">
-        <div class="wrapp-input">
-          <input type="checkbox" class="option" name="granizo">
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Granizo" v-model="checkedSituation">
+          </div>
+          <label class="label" for="granizo">Granizo</label>
         </div>
-        <label class="label" for="granizo">Granizo</label>
-      </div>
 
-      <div class="wrapper">
-        <div class="wrapp-input">
-          <input type="checkbox" class="option" name="tornado">
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Resgate" v-model="checkedSituation">
+          </div>
+          <label class="label" for="resgate">Resgate</label>
         </div>
-        <label class="label" for="tornado">Tornado</label>
-      </div>
 
-      <div class="wrapper">
-        <div class="wrapp-input">
-          <input type="checkbox" class="option" name="outro">
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Temporal" v-model="checkedSituation">
+          </div>
+          <label class="label" for="temporal">Temporal</label>
+        </div>
+
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Tornado" v-model="checkedSituation">
+          </div>
+          <label class="label" for="tornado">Tornado</label>
+        </div>
+
+        <div class="wrapper">
+          <div class="wrapp-input">
+            <input type="radio" class="option" name="radioGroup" value="Outro" v-model="checkedSituation">
+          </div>
+          <label class="label" for="outro">Outro</label>
         </div>
-        <label class="label" for="outro">Outro</label>
       </div>
     </form>
 
     <router-link :to="{ name: 'Moment' }">
-      <vulma-button class="confirm" color='primary'>Confirmar</vulma-button> 
+      <vulma-button class="confirm" color='primary' v-on:click="saveInformation">Confirmar</vulma-button> 
     </router-link>
 
   </div>
 </template>
 <script>
+import VueLocalStorage from 'vue-ls'
+import Vue from 'vue'
+
+Vue.use(VueLocalStorage)
+
 export default {
-  name: 'situation'
+  name: 'situation',
+
+  data () {
+    return {
+      checkedSituation: 'Outros'
+    }
+  },
+
+  methods: {
+    saveInformation () {
+      let checked = this.checkedSituation
+      Vue.ls.set('situacao', checked)
+    }
+  }
 }
 </script>
 <style lang="stylus" scoped>
+.wrapper-check
+  margin-bottom 85px
+
 .wrapper 
   width 80%
   margin 0 auto 10px
@@ -88,7 +125,7 @@ export default {
   font-size: 20px;
   width 100%
   height: 66px;
-  position: absolute;
+  position: fixed;
   bottom: 0;
   left: 50%;
   transform: translate3d(-50%,0,0);

diff --git a/src/components/weatherForecast/WeatherForecast.vue b/src/components/weatherForecast/WeatherForecast.vue
@@ -70,7 +70,7 @@ export default {
         })
     },
     saveInformation (position) {
-      Vue.ls.set('position', position, 3600)
+      Vue.ls.set('position', position)
       return position
     }
   },

diff --git a/src/services/save/Save.js b/src/services/save/Save.js
@@ -0,0 +1,5 @@
+import Http from '../client'
+
+export const saveInformation = (data) => {
+  return Http.post('/ocorrencia', data)
+}
diff --git a/static/markers/Outro.svg b/static/markers/Outro.svg
diff --git a/static/markers/User2.svg b/static/markers/User2.svg