Added components #337

app/javascript/vue/components/switch.vue

@@ -0,0 +1,53 @@
+<template>
+  <div class="switch-radio separate-bottom">
+    <template
+      v-for="(item, index) in options.concat(addOption)">
+      <template v-if="filter(item)">
+        <input
+          @click="$emit('input', item)"
+          :value="item"
+          :id="`switch-${name}-${index}`"
+          :name="`switch-${name}-options`"
+          type="radio"
+          :checked="item === value"
+          class="normal-input button-active"
+        >
+        <label
+          :for="`switch-${name}-${index}`"
+          class="capitalize">{{ item }}
+        </label>
+      </template>
+    </template>
+  </div>
+</template>
+<script>
+  export default {
+    props: {
+      options: {
+        type: Array,
+        required: true
+      },
+      value: {
+        required: true
+      },
+      addOption: {
+        type: Array,
+        required: false,
+        default: () => {
+          return []
+        }
+      },
+      name: {
+        type: String,
+        required: true
+      },
+      filter: {
+        type: Function,
+        default: () => {
+          return true
+        }
+      }
+    }
+  }
+
+</script>

app/javascript/vue/tasks/digitize/components/collectionEvent/components/GeographyLayout.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+    <geography/>
+    <elevation/>
+  </div>
+</template>
+<script>
+
+  import Geography from './geography/geography.vue'
+  import Elevation from './geography/elevation.vue'
+
+  export default {
+    components: {
+      Geography,
+      Elevation
+    }  
+  }
+</script>

app/javascript/vue/tasks/digitize/components/collectionEvent/components/geography/elevation.vue

@@ -0,0 +1,73 @@
+<template>
+  <div>
+    <label>Elevation</label>
+    <div>
+      Minimun
+      <input
+        type="text"
+        v-model="minimum_elevation">
+    </div>
+    <div>
+      Maximun
+      <input
+        type="text"
+        v-model="maximum_elevation">
+    </div>
+    <div>
+      Precision
+      <input
+        type="text"
+        v-model="elevation_precision">
+    </div>
+    <div>
+      Unit
+      <label>
+        <input
+          type="radio"
+          name="elevation">
+        Meters
+      </label>
+      <label>
+        <input
+          type="radio"
+          name="elevation">
+        Feets
+      </label>
+    </div>
+  </div>
+</template>
+
+<script>
+
+  import { GetterNames } from '../../../../store/getters/getters.js'
+  import { MutationNames } from '../../../../store/mutations/mutations.js'
+
+  export default {
+    computed: {
+      minimum_elevation: {
+        get() {
+          return this.$store.getters[GetterNames.GetCollectionEvent].minimum_elevation
+        },
+        set(value) {
+          this.$store.commit(MutationNames.SetCollectionEventMinimumElevation, value)
+        }
+      },
+      maximum_elevation: {
+        get() {
+          return this.$store.getters[GetterNames.GetCollectionEvent].maximum_elevation
+        },
+        set(value) {
+          this.$store.commit(MutationNames.SetCollectionEventMaximumElevation, value)
+        }
+      },
+      elevation_precision: {
+        get() {
+          return this.$store.getters[GetterNames.GetCollectionEvent].elevation_precision
+        },
+        set(value) {
+          this.$store.commit(MutationNames.SetCollectionEventElevationPrecision, value)
+        }
+      }
+    }
+  }
+</script>

app/javascript/vue/tasks/digitize/components/collectionEvent/components/geography/geography.vue

@@ -0,0 +1,26 @@
+<template>
+  <div>
+    <h2>Geography</h2>
+    <smart-selector
+      name="geography"
+      v-model="view"
+      :options="tabs"/>
+  </div>
+</template>
+
+<script>
+
+  import SmartSelector from '../../../../../../components/switch.vue'
+
+  export default {
+    components: {
+      SmartSelector
+    },
+    data() {
+      return {
+        tabs: ['Quick', 'Look back', 'Search'],
+        view: undefined
+      }
+    }
+  }
+</script>

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/collectors.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     collectors: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventCollectors]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_collectors
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventCollectors, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/date.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     date: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventDate]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_date
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventDate, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/datum.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     datum: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventDatum]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_datum
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventDatum, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/elevation.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     elevation: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventElevation]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_elevation
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventElevation, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/geolocationUncertainty.vue

@@ -16,10 +16,10 @@ export default {
   computed: {
     geolocationUncertainty: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventGeolocationUncertainty]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_geolocation_uncertainty
       },
       set(value) {
-        this.$store.commit(MutationNames.SetCollectionEventGeolocationUncertainty, value)
+        this.$store.commit(MutationNames.SetCollectionEventGeolocation, value)
       }
     }
   }

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/habitat.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     habitat: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventHabitat]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_habitat
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventHabitat, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/label.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     label: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventLabel]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_label
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventLabel, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/latitude.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     latitude: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventLatitude]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_latitude
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventLatitude, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/locality.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     locality: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventLocality]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_locality
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventLocality, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/longitude.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     longitude: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventLongitude]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_longitude
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventLongitude, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/method.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     method: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventMethod]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_method
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventMethod, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/components/verbatim/tripIdentifier.vue

@@ -16,7 +16,7 @@ export default {
   computed: {
     identifier: {
       get() {
-        return this.$store.getters[GetterNames.GetCollectionEventTripIdentifier]
+        return this.$store.getters[GetterNames.GetCollectionEvent].verbatim_trip_identifier
       },
       set(value) {
         this.$store.commit(MutationNames.SetCollectionEventTripIdentifier, value)

app/javascript/vue/tasks/digitize/components/collectionEvent/main.vue

@@ -1,16 +1,19 @@
 <template>
   <div>
     <block-verbatin/>
+    <block-geography/>
   </div>
 </template>
 
 <script>
 
-  import blockVerbatin from './components/blockOne.vue'
+  import blockVerbatin from './components/verbatimLayout.vue'
+  import blockGeography from './components/GeographyLayout.vue'
 
   export default {
     components: {
-      blockVerbatin
+      blockVerbatin,
+      blockGeography
     },
     data() {
       return {

app/javascript/vue/tasks/digitize/store/getters/getCollectionEvent.js

@@ -0,0 +1,3 @@
+export default function(state) {
+  return state.collection_event
+}

app/javascript/vue/tasks/digitize/store/getters/getters.js

@@ -1,11 +1,14 @@
+import getCollectionEvent from './getCollectionEvent'
 import getCollectionEventLabel from './getCollectionEventLabel'
 
 const GetterNames = {
+  GetCollectionEvent: 'getCollectionEvent',
   GetCollectionEventLabel: 'getCollectionEventLabel',
 }
 
 const GetterFunctions = {
   [GetterNames.GetCollectionEventLabel]: getCollectionEventLabel,
+  [GetterNames.GetCollectionEvent]: getCollectionEvent
 }
 
 export {