Merge pull request 'feature/15_company_registration' (#16) from feature/15_company_registration into dev

Reviewed-on: #16
close #15

package.json

@@ -20,13 +20,13 @@
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^1.1.5",
-    "@vue/compiler-sfc": "^3.0.6",
+    "@vue/compiler-sfc": "^3.0.7",
-    "autoprefixer": "^10.2.4",
+    "autoprefixer": "^10.2.5",
-    "postcss": "^8.2.6",
+    "postcss": "^8.2.8",
-    "release-it": "^14.4.1",
+    "release-it": "^14.5.0",
-    "tailwindcss": "^2.0.3",
+    "tailwindcss": "^2.0.4",
-    "vite": "^2.0.3",
+    "vite": "^2.1.2",
-    "vite-plugin-windicss": "^0.5.4"
+    "vite-plugin-windicss": "^0.9.11"
   },
   "release-it": {
     "git": {

src/components/Login.vue

@@ -97,11 +97,8 @@ import Toastify from "toastify-js";
 let mail = ref("");
 let loading = ref(false);
 function login() {
-  console.log("ihi");
-  console.log(mail.value);
   loading.value = true;
   axios.get("").then((res) => {
-    console.log(res.data);
     loading.value = false;
     Toastify({
       text: "This is a toast",

src/components/LoginForm.vue

@@ -97,11 +97,8 @@ import Toastify from "toastify-js";
 let mail = ref("");
 let loading = ref(false);
 function login() {
-  console.log("ihi");
-  console.log(mail.value);
   loading.value = true;
   axios.get("").then((res) => {
-    console.log(res.data);
     loading.value = false;
     Toastify({
       text: "This is a toast",

src/components/Profile.vue

@@ -187,8 +187,11 @@ const state = reactive({
   activetab: "profile",
 })
 const toast = useToast();
-const token = location.hash.substr(1).split('&')[0].split('=')[1];
+const props = defineProps({
-axios.get(`${config.baseurl}api/runners/me/${token}`)
+  token: String
+})
+const accesstoken = atob(props.token);
+axios.get(`${config.baseurl}api/runners/me/${accesstoken}`)
   .then(({ data }) => {
     state.phone = data.phone;
     state.email = data.email;
@@ -199,7 +202,7 @@ axios.get(`${config.baseurl}api/runners/me/${token}`)
   }).catch((error) => {
     toast.error("An error occured while loading your profile data");
   })
-axios.get(`${config.baseurl}api/runners/me/${token}/scans`)
+axios.get(`${config.baseurl}api/runners/me/${accesstoken}/scans`)
   .then(({ data }) => {
     data.map(function(s) {
       s.lapTime = Math.floor(s.lapTime / 60) + 'min ' + (Math.floor(s.lapTime % 60) + "").padStart(2, "0") + "s"

src/components/Register.vue

@@ -6,6 +6,11 @@
         class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center"
       >Lauf für Kaya! - {{ $t('registrieren') }}</h1>
       <p class="mx-auto leading-relaxed text-base text-center">{{ $t('register.register_now') }}</p>
+      <p
+        v-if="state.org_name !== ''"
+        class="mx-auto leading-relaxed text-base text-center"
+      >Organization: {{ state.org_name }}</p>
+      <p v-else class="mx-auto leading-relaxed text-base text-center">Bürgerlauf</p>
       <div class="mt-4">
         <label for="first_name" class="block font-medium">
           {{ $t('vorname') }}
@@ -219,18 +224,33 @@
 </template>
 
 <script setup>
-import { computed, ref, reactive, watch } from "vue";
+import { computed, ref, reactive, defineProps } from "vue";
 import axios from "redaxios";
 import isEmail from 'validator/es/lib/isEmail';
 import isMobilePhone from 'validator/es/lib/isMobilePhone';
 import isPostalCode from 'validator/es/lib/isPostalCode';
 import { useToast } from "vue-toastification";
 
+const props = defineProps({
+  token: String
+})
+if (props.token) {
+  props.token = atob(props.token);
+  axios.get(`${config.baseurl}api/organizations/selfservice/${props.token}`)
+    .then(({ data }) => {
+      state.org_name = data.name;
+    })
+    .catch((error) => {
+      console.log(error);
+    });
+}
+
 let userdetails = ref({ firstname: "", lastname: "", middlename: "", mail: "", phone: "", address: { street: "", address2: "", city: "", zipcode: "" } });
 let provide_address = ref(false);
 let agb_accepted = ref(false);
 // 
 const state = reactive({
+  org_name: "",
   submit_enabled: computed(() => agb_accepted.value === true && (isMobilePhone(userdetails.value.phone) || !userdetails.value.phone.trim()) && isEmail(userdetails.value.mail)
     && userdetails.value.firstname
     && userdetails.value.lastname && (provide_address.value === false || provide_address.value === true && (userdetails.value.address.street.trim() && userdetails.value.address.city.trim() && isPostalCode(userdetails.value.address.zipcode, "DE"))))
@@ -260,13 +280,14 @@ function login() {
         }
       }
       toast("registration in progress...");
-      axios.post(`${config.baseurl}api/runners/register`, postdata)
+      let url = `${config.baseurl}api/runners/register`;
-        .then((response) => {
+      if (props.token) {
-          response = response.data;
+        url = `${config.baseurl}api/runners/register/${props.token}`
-          const token = response.token;
+      }
-          const userid = JSON.parse(atob(token.split(".")[1])).id;
+      axios.post(url, postdata)
-          console.log({ token });
+        .then(({ data }) => {
-          console.log({ userid });
+          const token = btoa(data.token);
+          location.replace("../profile/" + token)
           // 
           toast.success("You have been registered!");
         })

src/main.js

@@ -25,7 +25,7 @@ const EnvError = import('./components/EnvError.vue');
 const Home = import('./components/Home.vue');
 const Imprint = import('./components/Imprint.vue');
 const Privacy = import('./components/Privacy.vue');
-const Register = import('./components/Register.vue');
+const Register = () => import('./components/Register.vue');
 const Profile = () => import('./components/Profile.vue');
 //
 let routes = [ { path: '/:pathMatch(.*)*', component: EnvError } ];
@@ -36,7 +36,8 @@ if (typeof config !== 'undefined') {
 			{ path: '/imprint', component: Imprint },
 			{ path: '/privacy', component: Privacy },
 			{ path: '/register', component: Register },
-			{ path: '/profile', component: Profile }
+			{ path: '/register/:token', component: Register, props: true },
+			{ path: '/profile/:token', component: Profile, props: true }
 		];
 	}
 }