Merge branch 'develop' into frontend/kathy

frontend/quasar.conf.js

@@ -62,7 +62,10 @@ module.exports = function (ctx) {
         'QAvatar',
         'QSpinnerPuff',
         'QExpansionItem',
-        'QParallax'
+        'QParallax',
+        'QEditor',
+        'QSelect',
+        'QField',
       ],
 
       directives: [
@@ -103,7 +106,7 @@ module.exports = function (ctx) {
     devServer: {
       // https: true,
       port: 8081,
-      open: true // opens browser window automatically
+      open: false // opens browser window automatically
     },
 
     // animations: 'all' --- includes all animations

frontend/src/pages/Cache.vue

@@ -0,0 +1,78 @@
+<template>
+  <div>
+    <form>
+      <div class="q-pa-md q-gutter-y-md">
+        <p class="text-h5">Cache erstellen/bearbeiten</p>
+        <q-input class="col" dense stack-label filled v-model="text" label="Name"/>
+        <q-input
+          v-model="description"
+          dense
+          stack-label
+          filled
+          autogrow
+          type="textarea"
+          label="Beschreibung"
+        />
+        <q-input class="col" dense stack-label filled v-model="text" label="Punktewert"/>
+        <p class="text-h6">Stationen</p>
+        <q-list bordered separator class="rounded-borders" >
+
+          <q-item>
+            <q-item-section avatar>
+              <q-avatar color="primary" text-color="white">
+                1
+              </q-avatar>
+            </q-item-section>
+
+            <q-item-section top>
+              <q-item-label lines="1">
+                <!--<span class="text-weight-medium">[quasarframework/quasar]</span>-->
+                <span class="text-grey-8">Beschreibung:</span>
+              </q-item-label>
+              <q-item-label lines="1" class="q-mt-xs text-body2">
+                <span class="cursor-pointer">Dies ist der Anfang der Beschreibung...</span>
+              </q-item-label>
+            </q-item-section>
+
+            <q-item-section side>
+              <div class="text-grey-8 q-gutter-xs">
+                <q-btn class="" color="" flat dense round icon="delete" />
+                <q-btn class="" color="" flat dense round icon="edit" />
+              </div>
+            </q-item-section>
+          </q-item>
+
+        </q-list>
+        <div class="row reverse">
+          <q-btn @click="addStation" unelevated color="primary" label="Station hinzufügen" icon-right="add"/>
+        </div>
+        <div class="row q-mt-xl">
+          <q-btn @click="saveCache" class="full-width" unelevated stack color="positive" label="Cache speichern" icon="save_alt"/>
+        </div>
+      </div>
+    </form>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "Cache",
+    data() {
+      return {
+        text: ""
+      }
+    },
+    methods: {
+      addStation() {
+
+      },
+      saveCache() {
+
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

frontend/src/pages/CacheView.vue

@@ -1,202 +0,0 @@
-
-<template>
-  <q-card>
-       <q-tab-panels v-model="tab" animated>
-         <q-tab-panel name="list">
-           <q-table
-              title="Caches"
-              :data="data"
-              :columns="columns"
-              row-key="name"
-              selection="multiple"
-              :selected.sync="selected"
-              :filter="filter"
-              grid
-              hide-header>
-              <template v-slot:top-right>
-                <q-input borderless dense debounce="300" v-model="filter" placeholder="Search">
-                  <template v-slot:append>
-                    <q-icon name="search" />
-                  </template>
-                </q-input>
-              </template>
-
-      <template v-slot:item="props">
-        <div
-          class="q-pa-xs col-xs-12 col-sm-6 col-md-4 col-lg-3 grid-style-transition"
-        >
-              <q-expansion-item
-                expand-separator
-                :label="props.row.name"
-                >
-            <q-card>
-              <q-card-section>
-                <q-list dense>
-                  <q-item v-for="col in props.cols.filter(col => col.name !== 'desc')" :key="col.name">
-                    <q-item-section>
-                      <q-item-label>{{ col.label }}</q-item-label>
-                    </q-item-section>
-                    <q-item-section side>
-                      <q-item-label caption>{{ col.value }}</q-item-label>
-                    </q-item-section>
-                  </q-item>
-                </q-list>
-              </q-card-section>
-            </q-card>
-          </q-expansion-item>
-        </div>
-      </template>
-    </q-table>
-         </q-tab-panel>
-
-         <q-tab-panel name="map">
-           <img src="https://www.buga2019.de/we-bilder/3.Gartenausstellung/Gelaendeplan/190320_Gelaendeplan-quadratisch.jpg?m=1553094677" />
-         </q-tab-panel>
-       </q-tab-panels>
-
-       <q-separator />
-
-       <q-tabs
-         v-model="tab"
-         dense
-         class="bg-white text-green-8 shadow-2"
-         align="justify"
-         narrow-indicator
-       >
-         <q-tab name="list" icon="list" />
-         <q-tab name="map" icon="map" />
-       </q-tabs>
-     </q-card>
-</template>
-
-<script>
-export default {
-  data () {
-    return {
-      tab: 'list',
-      filter: '',
-      selected: [],
-      columns: [
-        {
-          name: 'desc',
-          required: true,
-          label: 'Dessert (100g serving)',
-          align: 'left',
-          field: row => row.name,
-          format: val => `${val}`,
-          sortable: true
-        },
-        { name: 'calories', align: 'center', label: 'Calories', field: 'calories', sortable: true },
-        { name: 'fat', label: 'Fat (g)', field: 'fat', sortable: true },
-        { name: 'carbs', label: 'Carbs (g)', field: 'carbs' },
-        { name: 'protein', label: 'Protein (g)', field: 'protein' },
-        { name: 'sodium', label: 'Sodium (mg)', field: 'sodium' },
-        { name: 'calcium', label: 'Calcium (%)', field: 'calcium', sortable: true, sort: (a, b) => parseInt(a, 10) - parseInt(b, 10) },
-        { name: 'iron', label: 'Iron (%)', field: 'iron', sortable: true, sort: (a, b) => parseInt(a, 10) - parseInt(b, 10) }
-      ],
-      data: [
-  {
-    name: 'Frozen Yogurt',
-    calories: 159,
-    fat: 6.0,
-    carbs: 24,
-    protein: 4.0,
-    sodium: 87,
-    calcium: '14%',
-    iron: '1%'
-  },
-  {
-    name: 'Ice cream sandwich',
-    calories: 237,
-    fat: 9.0,
-    carbs: 37,
-    protein: 4.3,
-    sodium: 129,
-    calcium: '8%',
-    iron: '1%'
-  },
-  {
-    name: 'Eclair',
-    calories: 262,
-    fat: 16.0,
-    carbs: 23,
-    protein: 6.0,
-    sodium: 337,
-    calcium: '6%',
-    iron: '7%'
-  },
-      {
-  name: 'Cupcake',
-  calories: 305,
-  fat: 3.7,
-  carbs: 67,
-  protein: 4.3,
-  sodium: 413,
-  calcium: '3%',
-  iron: '8%'
-},
-{
-  name: 'Gingerbread',
-  calories: 356,
-  fat: 16.0,
-  carbs: 49,
-  protein: 3.9,
-  sodium: 327,
-  calcium: '7%',
-  iron: '16%'
-},
-{
-  name: 'Jelly bean',
-  calories: 375,
-  fat: 0.0,
-  carbs: 94,
-  protein: 0.0,
-  sodium: 50,
-  calcium: '0%',
-  iron: '0%'
-},
-      {
-  name: 'Lollipop',
-  calories: 392,
-  fat: 0.2,
-  carbs: 98,
-  protein: 0,
-  sodium: 38,
-  calcium: '0%',
-  iron: '2%'
-},
-{
-  name: 'Honeycomb',
-  calories: 408,
-  fat: 3.2,
-  carbs: 87,
-  protein: 6.5,
-  sodium: 562,
-  calcium: '0%',
-  iron: '45%'
-},
-      {
-  name: 'Donut',
-  calories: 452,
-  fat: 25.0,
-  carbs: 51,
-  protein: 4.9,
-  sodium: 326,
-  calcium: '2%',
-  iron: '22%'
-},
-{
-  name: 'KitKat',
-  calories: 518,
-  fat: 26.0,
-  carbs: 65,
-  protein: 7,
-  sodium: 54,
-  calcium: '12%',
-  iron: '6%'
-}
-]
-    }
-  }
-}
-</script>

frontend/src/pages/Login.vue

@@ -21,8 +21,8 @@
                 <div class="">
                   <div class="" style="max-width: 440px">
                     <q-btn
-                      :outline="this.user.isAuthenticated"
+                      :outline="userAuthenticated"
-                      :disabled="this.user.isAuthenticated"
+                      :disabled="userAuthenticated"
                       label="Login"
                       color="primary"
                       class="full-width"
@@ -30,8 +30,8 @@
                       unelevated
                     />
                     <q-btn
-                      :outline="!this.user.isAuthenticated"
+                      :outline="!userAuthenticated"
-                      :disabled="!this.user.isAuthenticated"
+                      :disabled="!userAuthenticated"
                       label="Logout"
                       color="red"
                       class="full-width q-mt-md"
@@ -69,60 +69,65 @@
           username: "moximoti",
           password: "1234",
           //token: "",
-          isAuthenticated: false
+          // evalAuthentication: false
         },
         credentialsDialog: false,
       };
     },
     // beforeMount: {
     //   init: function () {
-    //     this.isAuthenticated();
+    //     this.evalAuthentication();
     //     console.log("initiated");
     //   }
     // },
-    mounted () {
+    created () {
-      this.isAuthenticated();
+      this.evalAuthentication();
-      //this.pollData();
+      console.log("created: initiated");
-      console.log("mounted: initiated");
+    },
+    computed: {
+      userAuthenticated() {
+        return this.$store.state.auth.userAuthenticated.isAuthenticated
+      }
     },
     methods: {
       login: function () {
-        // const { username, password } = this;
-        // this.$store.dispatch(AUTH_REQUEST, { username, password }).then(() => {
-        //   this.$router.push('/')
-        // })
         const data = {
           username: this.user.username,
           password: this.user.password
-        } //JSON.stringify(this.user);
+        };
+
         console.log("GET http://localhost:8080/api/login/ - json: " + JSON.stringify(data));
-        this.$axios.post('http://localhost:8080/api/login', data) // TODO muss GET mit AUTH Header werden
+
+        this.$axios.post('http://localhost:8080/api/login', data)
           .then((response) => {
+            // TODO Catch clause funktioniert nicht mehr wenn Statuscode zurückgegeben wird. -> hier if/else mit HTTP-Codes
             console.log("GET/POST http://localhost:8080/api/login/ - response: " + response.data);
-            //this.user.token = response.data;
+            localStorage.setItem('userToken', JSON.stringify(response.data));
-            localStorage.setItem('userToken', JSON.stringify(response));
+            this.evalAuthentication();
-            this.isAuthenticated();
           })
           .catch((error) => {
             console.log("error: " + error);
             this.credentialsDialog=true;
           })
       },
-      isAuthenticated: function () {
+      evalAuthentication: function () {
-        console.log("isAuthenticated()");
+        this.$store.commit('auth/SET_AUTHENTICATED');
-        console.log(localStorage.getItem('userToken'));
-        if (localStorage.getItem('userToken')) { // TODO hier muss Abfrage mit API, z.B. /api/user?token="ME" stattfinden.
-          this.user.isAuthenticated = true;
-        } else {
-          this.user.isAuthenticated = false;
-        }
       },
       logout: function () {
         console.log("logout()");
-        console.log(localStorage.getItem('userToken'));
+        console.log(JSON.parse(localStorage.getItem('userToken')));
+        this.$axios.get('http://localhost:8080/api/logout', {
+            params: {
+              token: JSON.parse(localStorage.getItem('userToken'))
+            }
+          })
+          .then((response) => {
+            console.log("GET/POST http://localhost:8080/api/logout/ - response: " + response.data);
             localStorage.removeItem('userToken');
-        console.log(localStorage.getItem('userToken'));
+            this.evalAuthentication();
-        this.isAuthenticated()
+          })
+          .catch((error) => {
+          });
       },
     },
   };

frontend/src/pages/Overview.vue

@@ -9,7 +9,6 @@
         active-bg-color="bg-grey-1"
         active-color="cyan-14"
         indicator-color="cyan-14"
-        narrow-indicator
         switch-indicator
       >
         <q-tab name="list" label="Liste" icon="list"/>
@@ -20,30 +19,41 @@
 
     <div class="col flex column">
       <q-tab-panels v-model="tab" animated swipeable class="col">
+
         <q-tab-panel name="list" class=" fit">
+
           <q-list>
             <q-card class="q-mb-md" v-for="cache in caches" :key="cache.id">
-              <q-item
+            <q-expansion-item
-                class="q-pr-sm "
+              class=""
+              expand-icon-toggle
+              expand-separator
+              icon="location_on"
+              :label="cache.name"
+              :caption="cache.rankingPoints+' Punkte / Size '+cache.stationen.length"
             >
+              <q-item>
                 <q-item-section top avatar class="self-center">
-                  <q-icon rounded color="cyan-14" name="location_on" size="3rem"/>
+                  <!--<q-icon rounded color="cyan-14" name="location_on" size="3rem"/>-->
                 </q-item-section>
                 <q-item-section>
-                  <q-item-label><a class="text-black" style="text-decoration: none" href="/#/CacheDetail?id=2"><span>{{ cache.name }}</span></a></q-item-label>
+                  <q-item-label caption>{{ cache.description }}</q-item-label>
-                  <q-item-label overline>
-                    <span class="text-grey">{{ cache.rankingPoints }} Punkte /</span>
-                    <span class="text-grey"> Size {{ cache.stationen.length }} </span>
-                  </q-item-label>
-                  <q-item-label caption>{{ cache.description.substring(0,80) }} ... </q-item-label>
                 </q-item-section>
+
                 <q-item-section side top class="self-center" >
-                  <q-btn flat unelevated stack color="positive" icon="arrow_forward" label="Starten" size="sm" style="height: 4.5rem"/>
                 </q-item-section>
               </q-item>
+              <q-item class="q-pr-sm reverse q-gutter-x-sm">
+                <q-btn @click="startCache(cache.id)" unelevated color="positive" stack icon="arrow_forward" label="Starten" size="sm"/>
+                <q-btn v-if="hasAdminState" @click="startCache(cache.id)" unelevated color="amber" stack icon="edit" label="Bearbeiten" size="sm"/>
+                <q-btn v-if="hasAdminState" @click="startCache(cache.id)" unelevated color="negative" stack icon="delete" label="Löschen" size="sm"/>
+              </q-item>
+            </q-expansion-item>
             </q-card>
           </q-list>
         </q-tab-panel>
+
+
         <q-tab-panel name="map" class="q-pa-none fit">
           <!--<div class="full-width full-height absolute-full" style="background: url('statics/osm_mock.png'); background-size: cover">-->
           <!--</div>-->
@@ -53,6 +63,7 @@
             </template>
           </q-img>
         </q-tab-panel>
+
       </q-tab-panels>
     </div>
   </q-page>
@@ -66,35 +77,24 @@
 */
 </style>
 <script>
-  import {dom} from 'quasar'
+  //import {dom} from 'quasar'
-
+  //const {height, width} = dom
-  const {height, width} = dom
   export default {
     data() {
       return {
         tab: 'list',
-        hheight: 71.0,
+        // hheight: 71.0,
-        fheight: 36.0, //37
+        // fheight: 36.0, //37
         //header: {h: '0px', w: 0}
         caches: [],
       }
     },
     mounted: function () {
-      //this.header.h = style(this.$refs.layout.$refs.header, 'height')
-      // this.hheight = height(document.getElementById('qheader'));
-      // this.fheight = height(document.getElementById('qfooter'));
     },
     computed: {
-      mapHeight() {
+      hasAdminState() {
-        let header = this.hheight
+        return this.$store.state.auth.userAuthenticated.isAdmin
-        let footer = this.fheight
+      }
-        let offset = header + footer + 1;
-        console.log(offset)
-        return {minHeight: offset ? `calc(100vh - ${offset}px)` : '100vh'};
-      },
-      // computedMainStyle() {
-      //   return { height: `calc( 100vh - ${this.header.h} )` };
-      // }
     },
     created: function() {
       console.log("created(): " + this.caches);
@@ -107,6 +107,22 @@
             console.log("Caches: " + this.caches);
             this.caches = response.data;
           })
+      },
+      startCache(cacheID) {
+        const userToken = JSON.parse(localStorage.getItem('userToken'));
+        let params = { cacheID: cacheID };
+        if (userToken != null) {
+          params.token = userToken;
+        }
+        console.log(params);
+
+        this.$axios.get('http://localhost:8080/api/startCache', { params })
+          .then((response) => {
+            console.log("Angefangen: " + response.data);
+            let stationID = response.data.aktuelleStation.id;
+            console.log(stationID);
+            this.$router.push({ path: `/station/${stationID}` })
+          })
       }
     }
   }

frontend/src/pages/StationEdit.vue

@@ -0,0 +1,94 @@
+<template>
+  <div class="q-ma-md">
+    <p class="text-h5">Neue Station</p>
+    <q-editor
+      :toolbar="[
+        ['bold', 'italic', 'strike', 'underline'],
+        ['undo', 'redo']
+      ]"
+      v-model="station.description" min-height="10rem" />
+    <!--<q-input-->
+      <!--v-model="description"-->
+      <!--filled-->
+      <!--type="textarea"-->
+    <!--/>-->
+    <p class="text-h6 q-mt-md">Location</p>
+    <q-img transition="fade"
+           class="q-mb-md "
+           :ratio="16/9"
+           src="https://www.buga2019.de/we-bilder/3.Gartenausstellung/Gelaendeplan/190320_Gelaendeplan-quadratisch.jpg"
+    ></q-img>
+    <div class="row q-col-gutter-md">
+      <q-input class="col" dense stack-label filled v-model="latlang" @input="separateLatlang" label="Längengrad/Breitengrad" />
+      <div class="col-shrink">
+        <q-btn unelevated color="primary" class="full-height" icon="my_location"/>
+      </div>
+    </div>
+    <p class="text-h6 q-mt-md">Lösung</p>
+    <q-input class="col" dense stack-label filled v-model="station.solution" label="Lösung" />
+    <q-input class="col q-mt-md" dense stack-label filled v-model="station.code" label="Code" readonly/>
+    <div class="row reverse q-mt-md q-gutter-x-md">
+      <q-btn @click="addStation" unelevated color="primary" label="Speichern" icon-right="add"/>
+      <q-btn @click="dismiss" unelevated color="negative" label="verwerfen" icon-right="delete"/>
+    </div>
+
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "Station",
+
+    data() {
+      return {
+        description: "Rätsel, Aufgabe und Informationen zur Station.",
+        text:"v-model !!",
+        latlang: "",
+        station: {
+          description: "description",
+          lattitude: 0.06470,
+          longitude: 0.05551,
+          solution: "solution",
+          code: 357547
+        },
+      }
+    },
+    created: function() {
+    },
+    beforeMount: function() {
+    },
+    mounted: function() {
+      console.log("'id' from url: "+this.$route.params.id);
+      this.concatLatlang();
+    },
+    computed: {
+      // concatLatlang() {
+      //   return this.station.lattitude+", "+this.station.longitude
+      // }
+    },
+    methods: {
+      separateLatlang() {
+        //console.log("separateLatlang()");
+        if (this.latlang.includes(',')) {
+          this.station.lattitude = this.latlang.substr(0, this.latlang.indexOf(',')).trim();
+          this.station.longitude = this.latlang.substr(this.latlang.indexOf(',')+1, this.latlang.length).trim();
+          console.log(this.latlang);
+          console.log(this.station.lattitude + ", " + this.station.longitude);
+        }
+      },
+      concatLatlang() {
+        this.latlang = this.station.lattitude+", "+this.station.longitude;
+      },
+      addStation() {
+
+      },
+      dismiss() {
+
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>

frontend/src/pages/StationView.vue

@@ -0,0 +1,65 @@
+<template>
+  <div>
+    <q-img transition="fade"
+           class="q-mb-md "
+           :ratio="16/9"
+           src="https://www.buga2019.de/we-bilder/3.Gartenausstellung/Gelaendeplan/190320_Gelaendeplan-quadratisch.jpg"
+    ></q-img>
+    <div class="q-ma-md">
+      <p class="text-h4">{{ data.cacheName }}</p>
+      <p class="text-h5">Station {{ data.station.position }}</p>
+      <p>{{ data.station.description }}</p>
+      <!--<q-input-->
+      <!--v-model="description"-->
+      <!--filled-->
+      <!--type="textarea"-->
+      <!--/>-->
+      <!--<p class="text-h5 q-mt-md">Location</p>-->
+      <div class="column q-gutter-y-md">
+        <q-input v-if="false" disabled stack-label filled v-model="code" label="Lösung"/>
+        <q-btn v-if="false" disabled unelevated color="primary" label="Lösung abschicken"/>
+        <q-input stack-label filled v-model="code" label="Code eingeben (wird mit Code scannen ersetzt)"/>
+        <q-btn unelevated color="primary" label="Code scannen (absenden)"/>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: "Station",
+
+    data() {
+      return {
+        code: "",
+        data: {
+          cacheId: 22,
+          cacheName: "Wasserfall Cache",
+          nextStationId: 44,
+          station: {
+            position: 1,
+            id: 22,
+            description: "Ein kleines winterliches Schlaginstrument. Welche Blume ist damit gemeint?",
+            longitude: 9.206628,
+            lattitude: 49.147734,
+            code: 213812,
+            solution: "Schneeglöckchen"
+          }
+        }
+      }
+    },
+    created: function () {
+    },
+    beforeMount: function () {
+    },
+    mounted: function () {
+      console.log("'id' from url: " + this.$route.params.id)
+    },
+    computed: {},
+    methods: {}
+  }
+</script>
+
+<style scoped>
+
+</style>

frontend/src/pages/TestCaches.vue

@@ -1,84 +0,0 @@
-<template>
-  <div class="q-pa-md row items-start q-col-gutter-md">
-
-    <div class="col col-sm-6" v-for="cache in caches" :key="cache.id">
-      <q-card flat bordered class="my-card bg-grey-1">
-        <q-img :ratio="16/9" src="https://cdn.quasar-framework.org/img/parallax2.jpg">
-          <div class="absolute-bottom">
-            <div class="text-h6">
-              <span>{{ cache.name }}</span>
-              <!--<span v-if="cache.stationen.length > 2"> (Multicache)</span>-->
-              <!--<span v-else> (Singlecache)</span>-->
-            </div>
-          </div>
-        </q-img>
-        <q-card-section>
-          {{ cache.description }}
-        </q-card-section>
-        <q-separator inset />
-        <q-card-actions align="around">
-            <q-btn flat color="green" class="btn-fixed-width" >Cache starten</q-btn>
-            <q-btn flat outline class="btn-fixed-width">Ansehen</q-btn>
-        </q-card-actions>
-      </q-card>
-    </div>
-  </div>
-</template>
-
-<style lang="stylus">
-.grid-style-transition
-  transition transform .3s
-.btn-fixed-width
-  width: 48%
-</style>
-
-<script>
-export default {
-  data () {
-    return {
-      denseOn: true,
-      filter: '',
-      selected: [],
-      caches: [],
-      columns: [
-        {
-          name: 'desc',
-          required: true,
-          label: 'Dessert (100g serving)',
-          align: 'left',
-          field: row => row.title,
-          format: val => `${val}`,
-          sortable: true
-        },
-        { name: 'userId', align: 'center', label: 'ID', field: 'userId', sortable: true },
-        { name: 'id', label: 'fID', field: 'id', sortable: true },
-        { name: 'title', label: 'Titel', field: 'title' },
-        { name: 'completed', label: 'Komplett', field: 'completed' },
-      ],
-      // data: [
-      //   {
-      //     "userId": 1,
-      //     "id": 1,
-      //     "title": "delectus aut autem",
-      //     "completed": false
-      //   }
-      // ]
-    }
-  },
-
-  created: function() {
-    console.log("created(): " + this.caches);
-    this.fetchTodos();
-  },
-
-  methods: {
-    fetchTodos () {
-      this.$axios.get('http://localhost:8080/api/allCaches')
-        .then((response) => {
-          console.log("Caches: " + this.caches);
-          this.caches = response.data;
-        })
-    }
-  }
-}
-</script>

frontend/src/router/routes.js

@@ -11,14 +11,19 @@ const routes = [
     children: [{ path: "", component: () => import("pages/Overview.vue") }]
   },
   {
-    path: "/testcaches/",
+    path: "/cache/",
     component: () => import("layouts/MyLayout.vue"),
-    children: [{path: "", component: () => import("pages/TestCaches.vue")}]
+    children: [{ path: "", component: () => import("pages/Cache.vue") }]
   },
   {
-    path: "/cacheview/",
+    path: "/station/",
     component: () => import("layouts/MyLayout.vue"),
-    children: [{ path: "", component: () => import("pages/CacheView.vue") }]
+    children: [{ path: "", component: () => import("pages/StationEdit.vue") }]
+  },
+  {
+    path: "/station/:id",
+    component: () => import("layouts/MyLayout.vue"),
+    children: [{ path: "", component: () => import("pages/StationView.vue") }]
   },
   {
     path: "/ranking/",

frontend/src/store/auth/mutations.js

@@ -1,38 +1,18 @@
 import axios from 'axios'
-/*
+export const SET_AUTHENTICATED = (state) => {
-export function someMutation (state) {
+    console.log("SET_AUTHENTICATED()");
-}
+    console.log(JSON.parse(localStorage.getItem('userToken')));
-*/
+    if (localStorage.getItem('userToken')) {
-export const evalAuth = (state) => {
+      state.userAuthenticated.isAuthenticated = true;
-    console.log("isAuthenticated()");
-    console.log(localStorage.getItem('userToken'));
-    if (localStorage.getItem('userToken')) { // TODO hier muss Abfrage mit API, z.B. /api/user?token="ME" stattfinden.
-      state.user.isAuthenticated = true;
     } else {
-      state.user.isAuthenticated = false;
+      state.userAuthenticated.isAuthenticated = false;
     }
 };
-export const logout = (state) => {
+export const SET_USER_PROPERTIES = (state, user) => {
-    console.log("logout()");
+    console.log("SET_USER_PROPERTIES()");
-    console.log(localStorage.getItem('userToken'));
+    console.log("still todo!");
-    localStorage.removeItem('userToken');
-    console.log(localStorage.getItem('userToken'));
-    state.commit(evalAuth(state));
 };
-export const login = (state) => {
+export const SET_LOGOUT = (state) => {
-    const data = {
+    console.log("SET_LOGOUT()");
-      username: state.user.username,
+    state.userAuthenticated = null;
-      password: state.user.password
-    };
-    console.log("GET http://localhost:8080/api/login/ - json: " + JSON.stringify(data));
-    this.state.$axios.post('http://localhost:8080/api/login', data) // TODO muss GET mit AUTH Header werden
-      .then((response) => {
-        console.log("GET/POST http://localhost:8080/api/login/ - response: " + response.data);
-        localStorage.setItem('userToken', JSON.stringify(response));
-        state.commit(evalAuth(state));
-      })
-      .catch((error) => {
-        console.log("error: " + error);
-        //errorDialog = true;
-      })
 };

frontend/src/store/auth/state.js

@@ -1,7 +1,12 @@
 export default {
-  user: {
+  userAuthenticated: {
-    username: "moximoti",
+    id: 1,
-    password: "1234",
+    firstname: "t",
-    isAuthenticated: false
+    lastname: "v",
+    username: "mo",
+    email: "test@user.com",
+    rankingPointsSum: 345,
+    isAuthenticated: false,
+    isAdmin: false,
   },
 }

frontend/src/store/cacheCollector/actions.js

@@ -0,0 +1,4 @@
+/*
+export function someAction (context) {
+}
+*/

frontend/src/store/cacheCollector/getters.js

@@ -0,0 +1,4 @@
+/*
+export function someGetter (state) {
+}
+*/

frontend/src/store/cacheCollector/index.js

@@ -0,0 +1,12 @@
+import state from './state'
+import * as getters from './getters'
+import * as mutations from './mutations'
+import * as actions from './actions'
+
+export default {
+  namespaced: true,
+  state,
+  getters,
+  mutations,
+  actions
+}

frontend/src/store/cacheCollector/mutations.js

@@ -0,0 +1,4 @@
+/*
+export function someMutation (state) {
+}
+*/

frontend/src/store/cacheCollector/state.js

@@ -0,0 +1,3 @@
+export default {
+  //
+}

frontend/src/store/index.js

@@ -2,6 +2,7 @@ import Vue from "vue";
 import Vuex from "vuex";
 import Axios from "axios";
 import auth from "./auth"
+import cacheCollector from "./cacheCollector"
 
 // import example from './module-example'
 
@@ -12,24 +13,11 @@ Vue.use(Vuex, Axios);
  * directly export the Store instantiation
  */
 
-// export default function(/* { ssrContext } */) {
-//   const Store = new Vuex.Store({
-//     modules: {
-//       // example
-//     },
-//
-//     // enable strict mode (adds overhead!)
-//     // for dev mode only
-//     strict: process.env.DEV
-//   });
-//
-//   return Store;
-// }
-
 export default function (/* { ssrContext } */) {
   const Store = new Vuex.Store({
     modules: {
-      auth
+      auth,
+      cacheCollector
     },
 
     // enable strict mode (adds overhead!)
@@ -45,8 +33,12 @@ export default function (/* { ssrContext } */) {
   */
   if (process.env.DEV && module.hot) {
     module.hot.accept(['./auth'], () => {
-      const newShowcase = require('./auth').default;
+      const auth = require('./auth').default;
-      store.hotUpdate({ modules: { showcase: newShowcase } })
+      store.hotUpdate({ modules: { auth: newAuth } })
+    });
+    module.hot.accept(['./cacheCollector'], () => {
+      const cacheCollector = require('./cacheCollector').default;
+      store.hotUpdate({ modules: { cacheCollector: newCacheCollector } })
     })
   }
 

src/main/java/hhn/labsw/bugageocaching/controller/Controller.java

@@ -40,16 +40,13 @@ public class Controller {
   @Autowired
   UserRepository userRepository;
 
-  @Autowired
-  StationReihenfolgeRepository stationReihenfolgeRepository;
-
   private AtomicLong counter = new AtomicLong();
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/allCaches")
   @ResponseBody
-  public String getAllCaches() {
+  public ResponseEntity getAllCaches() {
-    return new Gson().toJson(cacheRepository.findAll());
+    return ResponseEntity.status(200).body(new Gson().toJson(cacheRepository.findAll()));
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
@@ -59,27 +56,27 @@ public class Controller {
     if (user.getUsername() == null || user.getPassword() == null) {
       System.out.println(user.getUsername());
       System.out.println(user.getPassword());
-      return ResponseEntity.status(401).body(null);
+      return ResponseEntity.status(400).body("Username or password cant be null");
     }
     if (userRepository.findByUsername(user.getUsername()) == null) {
-      return ResponseEntity.status(401).body(null);
+      return ResponseEntity.status(404).body("User was not found");
     }
 
     if (BCrypt.checkpw(user.getPassword(), userRepository.findByUsername(user.getUsername()).getPassword())) {
       String token = user.getUsername() + BCrypt.hashpw(String.valueOf(System.currentTimeMillis() + counter.incrementAndGet()), BCrypt.gensalt());
-      System.out.println(token);
       String hashedToken = BCrypt.hashpw(token, BCrypt.gensalt());
       userRepository.findByUsername(user.getUsername()).setToken(hashedToken);
       userRepository.save(userRepository.findByUsername(user.getUsername()));
-      return ResponseEntity.ok(new Gson().toJson(token));
+      //return ResponseEntity.ok(new Gson().toJson(token));
+      return ResponseEntity.status(200).body(token);
     }
-    return ResponseEntity.status(HttpStatus.BAD_GATEWAY).body(null);
+    return ResponseEntity.status(400).body("Es ist ein Fehler aufgetreten");
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/startCache")
   @ResponseBody
-  public String startCache(@RequestParam(value = "token", defaultValue = "-1") String token,
+  public ResponseEntity startCache(@RequestParam(value = "token", defaultValue = "-1") String token,
                                    @RequestParam String cacheID) throws IllegalParameterException {
 
     if (!token.equals("-1")) { // ein angemeldeter user startet den cache(es werden zwei parameter übergeben)
@@ -87,6 +84,9 @@ public class Controller {
       Bearbeitet bearbeitet = new Bearbeitet();
 
       User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
+      if (user == null) {
+        return ResponseEntity.status(404).body("User was not found");
+      }
       bearbeitet.setUser(user);
 
       Optional<Cache> cacheOptional = cacheRepository.findById(Integer.valueOf(cacheID));
@@ -94,10 +94,10 @@ public class Controller {
         Cache cache = cacheOptional.get();
         bearbeitet.setCache(cache);
 
-        Station startStation = cache.getStartStation();
+        Station startStation = cache.getStationen().get(0);
         bearbeitet.setAktuelleStation(startStation);
       } else {
-        throw new IllegalParameterException("There is no cache with the ID " + cacheID);
+        return ResponseEntity.status(404).body("Couldnt find Cache " + cacheID);
       }
 
       Optional<CacheAccesDefinition> cacheAccesDefinitionOptional =
@@ -106,20 +106,20 @@ public class Controller {
         CacheAccesDefinition cacheAccesDefinition = cacheAccesDefinitionOptional.get();
         bearbeitet.setCacheAccesDefinition(cacheAccesDefinition);
       } else {
-        throw new IllegalParameterException("There is no cacheAccesDefinition with the ID " + 0);
+        return ResponseEntity.status(404).body("There is no cacheAccesDefinition with the ID " + 0);
       }
 
       bearbeitetRepository.save(bearbeitet);
 
-      return new Gson().toJson(bearbeitet);
+      return ResponseEntity.status(200).body(new Gson().toJson(bearbeitet));
 
     } else { // kein angemeldeter User startet den cache(es wird nur der cache als parameter übergeben)
       Optional<Cache> cacheOptional = cacheRepository.findById(Integer.valueOf(cacheID));
       if (cacheOptional.isPresent()) {
         Cache cache = cacheOptional.get();
-        return new Gson().toJson(cache);
+        return ResponseEntity.status(200).body(new Gson().toJson(cache));
       } else {
-        throw new IllegalParameterException("There is no cache with the ID " + cacheID);
+        return ResponseEntity.status(404).body("Couldnt find Cache " + cacheID);
       }
     }
   }
@@ -127,155 +127,138 @@ public class Controller {
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/logout")
   @ResponseBody
-  boolean logout(@RequestParam String token) {
+  public ResponseEntity logout(@RequestParam String token) {
-
+//    System.out.println("logout");
     User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
+//    System.out.println(token);
+//    System.out.println(user.getToken());
+    if (user == null || user.getToken().isEmpty()) {
+      return ResponseEntity.status(404).body("User was not found");
+    }
     user.setToken(null);
     userRepository.save(user);
-    return true;
+    return ResponseEntity.status(200).body("Token was deleted");
-  }
-
-  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
-  @RequestMapping("/api/createStation")
-  @ResponseBody
-  String createStation(@RequestParam String description,
-                       @RequestParam String lattitude,
-                       @RequestParam String longitude,
-                       @RequestParam String solution) throws IllegalParameterException {
-
-    if (description.length() == 0 || lattitude.length() == 0 || longitude.length() == 0 || solution.length() == 0) {
-      throw new IllegalParameterException("Fields can´t be empty");
-    }
-
-    double latti;
-    double longi;
-
-    try {
-      latti = Double.valueOf(lattitude);
-      if (latti < -90 || latti > 90) {
-        throw new IllegalParameterException("Lattitude has to be in the range of -90 to 90 degrees");
-      }
-    } catch (NumberFormatException e) {
-      throw new NumberFormatException("Lattitude has to be a decimal number");
-    }
-
-    try {
-      longi = Double.valueOf(longitude);
-      if (longi < -180 || longi > 180) {
-        throw new IllegalParameterException("Longitude has to be in the range of -180 to 180 degrees");
-      }
-    } catch (NumberFormatException e) {
-      throw new NumberFormatException("Longitude has to be a decimal number");
-    }
-
-    Station station = new Station();
-    station.setDescription(description);
-    station.setLattitude(latti);
-    station.setLongitude(longi);
-    station.setSolution(solution);
-    Random r = new Random();
-    int low = 100000;
-    int high = 1000000;
-    int code = r.nextInt(high - low) + low;
-    station.setCode(code);
-
-    stationRepository.save(station);
-
-    return new Gson().toJson(station);
-
-  }
-
-  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
-  @RequestMapping("/api/checkAdmin")
-  @ResponseBody
-  boolean checkAdmin(@RequestParam String token) {
-    User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
-    for (Role role : user.getRoles()) {
-      if (role.getId() == 0) { // is admin
-        return true;
-      }
-    }
-    return false;
-  }
-
-  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
-  @RequestMapping("/api/getAllStations")
-  @ResponseBody
-  String getAllStations() {
-    return new Gson().toJson(stationRepository.findAll());
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/createCache")
   @ResponseBody
-  String createCache(@RequestParam String description,
+  public ResponseEntity createCache(@RequestBody Cache cache) {
-                     @RequestParam String name,
-                     @RequestParam String rankingPoints,
-                     @RequestParam(value = "rewardID", defaultValue = "-1") String rewardID,
-                     @RequestParam List<Station> stationen) throws IllegalParameterException {
 
-    if (description.length() == 0 || name.length() == 0 || rankingPoints.length() == 0 || stationen.size() == 0) {
+    // Stationen werden in die Datenbank eingetragen
-      throw new IllegalParameterException("Fields can´t be empty");
+    for (Station station : cache.getStationen()) {
-    }
+      ResponseEntity response = createStation(station);
-
+      if (response.getStatusCodeValue() == 400) {
-    for (Cache cache : cacheRepository.findAll()) {
+        deleteStationen(cache);
-      if (cache.getName().equals(name)) {
+        return response;
-        throw new IllegalParameterException("name is already taken");
       }
     }
 
-    int points;
+    // Caches werden in die Datenbank eingetragen
-
+    if (cache.getDescription().length() == 0 || cache.getName().length() == 0 || cache.getRankingPoints() == 0.0 || cache.getStationen().size() == 0) {
-    try {
+      deleteStationen(cache);
-      points = Integer.valueOf(rankingPoints);
+      return ResponseEntity.status(400).body("cache fields can´t be empty");
-      if (points < 0) {
-        throw new IllegalParameterException("Ranking points has to be a positive number");
-      }
-    } catch (NumberFormatException e) {
-      throw new NumberFormatException("Ranking points has to be an integer");
     }
 
-    Optional<Reward> rewardOptional = rewardRepository.findById(Integer.valueOf(rewardID));
+    for (Cache cache1 : cacheRepository.findAll()) {
-    Reward reward = rewardOptional.orElse(null);
+      if (cache1.getName().equals(cache.getName())) {
+        deleteStationen(cache);
+        return ResponseEntity.status(400).body("name is already taken");
+      }
+    }
 
-    Cache cache = new Cache();
+    if (cache.getRankingPoints() < 0) {
-    cache.setDescription(description);
+      deleteStationen(cache);
-    cache.setName(name);
+      return ResponseEntity.status(400).body("Ranking points has to be a positive number");
-    cache.setRankingPoints(Integer.valueOf(rankingPoints));
+    }
-    cache.setReward(reward);
-    cache.setStartStation(stationen.get(0));
-    cache.setStationen(stationen);
 
     cacheRepository.save(cache);
 
-    for (int i = 0; i + 1 < stationen.size(); i++) {
+    return ResponseEntity.status(200).body(new Gson().toJson(cache));
-      StationReihenfolge stationReihenfolge = new StationReihenfolge();
-      stationReihenfolge.setCache(cache);
-      stationReihenfolge.setStation(stationen.get(i));
-      stationReihenfolge.setNachfolgeStation(stationen.get(i + 1));
-      stationReihenfolgeRepository.save(stationReihenfolge);
   }
 
-    return new Gson().toJson(cache);
+  public ResponseEntity createStation(Station station) {
+
+    if (station.getDescription().length() == 0 || station.getLattitude() == 0.0 || station.getLongitude() == 0.0 || station.getSolution().length() == 0) {
+      return ResponseEntity.status(400).body("station fields can´t be empty");
+    }
+
+    if (station.getLattitude() < -90 || station.getLattitude() > 90) {
+      return ResponseEntity.status(400).body("Lattitude has to be between -90 and 90 Degree");
+    }
+
+    if (station.getLongitude() < -180 || station.getLongitude() > 180) {
+      return ResponseEntity.status(400).body("Longitude has to be in the range of -180 to 180 degrees");
+    }
+
+    Random r = new Random();
+    int low = 100000;
+    int high = 1000000;
+    int code = 0;
+    boolean unique = false;
+    while (!unique) {
+      code = r.nextInt(high - low) + low;
+      unique = true;
+      for (Station station1 : stationRepository.findAll()) {
+        if (station1.getCode() == code) {
+          unique = false;
+        }
+      }
+    }
+
+    station.setCode(code);
+
+    stationRepository.save(station);
+
+    return ResponseEntity.status(200).body(new Gson().toJson(station));
+  }
+
+  public void deleteStationen(Cache cache) {
+    for (Station station : cache.getStationen()) {
+      try {
+        stationRepository.delete(station);
+      } catch (IllegalArgumentException e) { // station is null
+        // do nothing
+      }
+    }
+  }
+
+
+  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
+  @RequestMapping("/api/checkAdmin")
+  @ResponseBody
+  public ResponseEntity checkAdmin(@RequestParam String token) {
+    User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
+    if (user == null) {
+      return ResponseEntity.status(404).body("User was not found");
+    }
+    for (Role role : user.getRoles()) {
+      if (role.getId() == 0) { // is admin
+        return ResponseEntity.status(200).body("User is Admin");
+      }
+    }
+    return ResponseEntity.status(401).body("User is no Admin");
+  }
+
+  //Bis hier
+  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
+  @RequestMapping("/api/getAllStations")
+  @ResponseBody
+  public ResponseEntity getAllStations() {
+    return ResponseEntity.status(200).body(new Gson().toJson(stationRepository.findAll()));
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/deleteCache")
   @ResponseBody
-  boolean deleteCache(@RequestParam String cacheID) throws IllegalParameterException {
+  public ResponseEntity deleteCache(@RequestParam String cacheID) {
     Optional<Cache> optionalCache = cacheRepository.findById(Integer.valueOf(cacheID));
     if (!optionalCache.isPresent()) {
-      throw new IllegalParameterException("There is no cache with the ID " + cacheID);
+      return ResponseEntity.status(404).body(new Gson().toJson("There is no cache with the ID " + cacheID));
     }
 
     Cache cache = optionalCache.get();
 
-    for (StationReihenfolge stationReihenfolge : stationReihenfolgeRepository.findAll()) {
-      if (stationReihenfolge.getCache().getId() == cache.getId()) {
-        stationReihenfolgeRepository.delete(stationReihenfolge);
-      }
-    }
-
     for (Bearbeitet bearbeitet : bearbeitetRepository.findAll()) {
       if (bearbeitet.getCache().getId() == cache.getId()) {
         bearbeitetRepository.delete(bearbeitet);
@@ -284,14 +267,16 @@ public class Controller {
 
     cacheRepository.delete(cache);
 
-    return true;
+    return ResponseEntity.status(200).body(new Gson().toJson(true));
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/getMyCaches")
   @ResponseBody
-  String getMyCaches(@RequestParam String token) {
+  public ResponseEntity getMyCaches(@RequestParam String token) {
+    try {
       User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
+      if (user != null) {
         ArrayList<Bearbeitet> bearbeitetList = new ArrayList<>();
 
         for (Bearbeitet bearbeitet : bearbeitetRepository.findAll()) {
@@ -299,14 +284,36 @@ public class Controller {
             bearbeitetList.add(bearbeitet);
           }
         }
-    return new Gson().toJson(bearbeitetList);
+        return ResponseEntity.status(200).body(new Gson().toJson(bearbeitetList));
+      } else {
+        return ResponseEntity.status(404).body("User was not found in the database");
+      }
+    } catch (StringIndexOutOfBoundsException e) {
+      return ResponseEntity.status(400).body("Invalid token");
+    }
   }
 
   @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
   @RequestMapping("/api/getRankingList")
   @ResponseBody
-  String getRankingList() {
+  public ResponseEntity getRankingList() {
-    return new Gson().toJson(userRepository.getRankingList());
+    return ResponseEntity.status(200).body(new Gson().toJson(userRepository.getRankingList()));
+  }
+
+  @CrossOrigin(origins = "http://localhost:8081") // only for dev purpose
+  @RequestMapping("/api/getUser")
+  @ResponseBody
+  public ResponseEntity getUser(@RequestParam String token) {
+    try {
+      User user = userRepository.findByUsername(token.substring(0, token.indexOf("$")));
+      if (user != null) {
+        return ResponseEntity.status(200).body(new Gson().toJson(user));
+      } else {
+        return ResponseEntity.status(404).body("User was not found in the database");
+      }
+    } catch (StringIndexOutOfBoundsException e) {
+      return ResponseEntity.status(400).body("Invalid token");
+    }
   }
 }
 

src/main/java/hhn/labsw/bugageocaching/entities/Cache.java

@@ -23,9 +23,6 @@ public class Cache {
   @ManyToOne
   private Reward reward;
 
-  @ManyToOne
-  private Station startStation;
-
   public Cache() {
   }
 
@@ -76,12 +73,4 @@ public class Cache {
   public void setReward(Reward reward) {
     this.reward = reward;
   }
-
-  public Station getStartStation() {
-    return startStation;
-  }
-
-  public void setStartStation(Station startStation) {
-    this.startStation = startStation;
-  }
 }

src/main/java/hhn/labsw/bugageocaching/entities/StationReihenfolge.java

@@ -1,53 +0,0 @@
-package hhn.labsw.bugageocaching.entities;
-
-import javax.persistence.*;
-
-@Entity
-@Table
-public class StationReihenfolge {
-
-  @Id
-  @GeneratedValue
-  private int id;
-
-  @OneToOne
-  private Cache cache;
-
-  @OneToOne
-  private Station station;
-
-  @OneToOne
-  private Station nachfolgeStation;
-
-  public int getId() {
-    return id;
-  }
-
-  public void setId(int id) {
-    this.id = id;
-  }
-
-  public Cache getCache() {
-    return cache;
-  }
-
-  public void setCache(Cache cache) {
-    this.cache = cache;
-  }
-
-  public Station getStation() {
-    return station;
-  }
-
-  public void setStation(Station station) {
-    this.station = station;
-  }
-
-  public Station getNachfolgeStation() {
-    return nachfolgeStation;
-  }
-
-  public void setNachfolgeStation(Station nachfolgeStation) {
-    this.nachfolgeStation = nachfolgeStation;
-  }
-}

src/main/java/hhn/labsw/bugageocaching/repositories/StationReihenfolgeRepository.java

@@ -1,7 +0,0 @@
-package hhn.labsw.bugageocaching.repositories;
-
-import hhn.labsw.bugageocaching.entities.StationReihenfolge;
-import org.springframework.data.repository.CrudRepository;
-
-public interface StationReihenfolgeRepository extends CrudRepository<StationReihenfolge, Integer> {
-}