From f8ceec492d720ced359da9001088bf691cb8c28f Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Sun, 7 Mar 2021 13:21:43 +0100
Subject: [PATCH 1/7] =?UTF-8?q?=E2=9C=A8=20Profile=20-=20basic=20parsing?=
 =?UTF-8?q?=20for=20hash=20based=20query=20params?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ref #10
---
 src/components/Profile.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index 0f883f1..9af3209 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -175,7 +175,7 @@
 </template>
 
 <script setup>
-import { computed, ref, reactive, watch } from "vue";
+import { computed, ref, reactive, watch, defineProps } from "vue";
 import axios from "redaxios";
 import isEmail from 'validator/es/lib/isEmail';
 import isMobilePhone from 'validator/es/lib/isMobilePhone';
@@ -183,4 +183,6 @@ import isPostalCode from 'validator/es/lib/isPostalCode';
 import { useToast } from "vue-toastification";
 // 
 let activetab = ref("profile");
+const token = location.hash.substr(1).split('&')[0].split('=')[1];
+console.log(token);
 </script>
\ No newline at end of file
-- 
2.47.2


From ac9f1ba2aca43d38d67604a4f6e77c5b29a670af Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Sun, 7 Mar 2021 13:30:05 +0100
Subject: [PATCH 2/7] routing import fix

ref #10
---
 src/main.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/main.js b/src/main.js
index bd77f66..188d3ff 100644
--- a/src/main.js
+++ b/src/main.js
@@ -26,7 +26,7 @@ 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 Profile = import('./components/Profile.vue');
+const Profile = () => import('./components/Profile.vue');
 //
 let routes = [ { path: '/', component: EnvError } ];
 if (typeof config !== 'undefined') {
-- 
2.47.2


From 0929f2bbc7037106bc6c9a4c948f51c59148a10b Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Sun, 7 Mar 2021 13:30:23 +0100
Subject: [PATCH 3/7] Profile - fetch user profile data from api

ref #10
---
 src/components/Profile.vue | 26 ++++++++++++++++++++++++--
 1 file changed, 24 insertions(+), 2 deletions(-)

diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index 9af3209..9ee3205 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -80,6 +80,7 @@
                         class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
                         type="text"
                         :placeholder="[[$t('vorname')]]"
+                        v-model="state.firstname"
                       />
                     </div>
                     <div class="form-element">
@@ -89,6 +90,7 @@
                         class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
                         type="text"
                         :placeholder="[[$t('mittelname')]]"
+                        v-model="state.middlename"
                       />
                     </div>
                     <div class="form-element">
@@ -98,6 +100,7 @@
                         type="text"
                         class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
                         :placeholder="[[$t('nachname')]]"
+                        v-model="state.lastname"
                       />
                     </div>
                     <div class="form-element">
@@ -107,6 +110,7 @@
                         type="email"
                         class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
                         :placeholder="[[$t('e_mail_adress')]]"
+                        v-model="state.email"
                       />
                     </div>
                     <div class="form-element">
@@ -116,6 +120,7 @@
                         type="tel"
                         class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
                         :placeholder="[[$t('phone_number')]]"
+                        v-model="state.phone"
                       />
                     </div>
                   </div>
@@ -176,13 +181,30 @@
 
 <script setup>
 import { computed, ref, reactive, watch, defineProps } from "vue";
+import { useToast } from "vue-toastification";
 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 state = reactive({
+  phone: "",
+  email: "",
+  firstname: "",
+  middlename: "",
+  lastname: "",
+})
 let activetab = ref("profile");
+const toast = useToast();
 const token = location.hash.substr(1).split('&')[0].split('=')[1];
-console.log(token);
+axios.get(`${config.baseurl}api/runners/me/${token}`)
+  .then(({ data }) => {
+    state.phone = data.phone;
+    state.email = data.email;
+    state.firstname = data.firstname;
+    state.middlename = data.middlename;
+    state.lastname = data.lastname;
+  }).catch((error) => {
+    toast.error("An error occured while loading your profile data");
+  })
 </script>
\ No newline at end of file
-- 
2.47.2


From b30277b617c1329702cb538b7e98d98929ca2346 Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Sun, 7 Mar 2021 13:46:25 +0100
Subject: [PATCH 4/7] display user name in Profile title

ref #10
---
 src/components/Profile.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index 9ee3205..ccf280d 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -5,7 +5,10 @@
         <div
           class="flex flex-col md:pr-10 md:mb-0 mb-6 pr-0 w-full md:w-auto md:text-left text-center text-black dark:text-gray-200"
         >
-          <p class="text-3xl font-bold whitespace-nowrap">Max Mustermann</p>
+          <p
+            class="text-3xl font-bold whitespace-nowrap"
+            v-text="(state.firstname || '') + ' ' + (state.middlename || '') + ' ' + (state.lastname || '')"
+          ></p>
           <p class="text-md whitespace-nowrap">Musterfirma > PR</p>
         </div>
         <div class="inline-flex md:ml-auto md:mr-0 mx-auto items-center space-x-4">
-- 
2.47.2


From 8205c11bd9a38c49608b0641dd89df22f492efd0 Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Sun, 7 Mar 2021 13:49:56 +0100
Subject: [PATCH 5/7] Profile - remove form styling. data is not editable yet

ref #10
---
 src/components/Profile.vue | 63 +++++++++++++++-----------------------
 1 file changed, 24 insertions(+), 39 deletions(-)

diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index ccf280d..7d60dcf 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -77,53 +77,38 @@
                 <form class="form flex flex-wrap w-full">
                   <div class="w-full">
                     <div class="form-element">
-                      <div class="form-label">{{ $t('vorname') }}</div>
-                      <input
-                        name="first-name"
-                        class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
-                        type="text"
-                        :placeholder="[[$t('vorname')]]"
-                        v-model="state.firstname"
+                      <div class="text-lg">{{ $t('vorname') }}</div>
+                      <p
+                        class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
+                        v-text="state.firstname"
                       />
                     </div>
                     <div class="form-element">
-                      <div class="form-label">{{ $t('mittelname') }}</div>
-                      <input
-                        name="middle-name"
-                        class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
-                        type="text"
-                        :placeholder="[[$t('mittelname')]]"
-                        v-model="state.middlename"
+                      <div class="text-lg">{{ $t('mittelname') }}</div>
+                      <p
+                        class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
+                        v-text="state.middlename"
                       />
                     </div>
                     <div class="form-element">
-                      <div class="form-label">{{ $t('nachname') }}</div>
-                      <input
-                        name="last-name"
-                        type="text"
-                        class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
-                        :placeholder="[[$t('nachname')]]"
-                        v-model="state.lastname"
+                      <div class="text-lg">{{ $t('nachname') }}</div>
+                      <p
+                        class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
+                        v-text="state.lastname"
                       />
                     </div>
                     <div class="form-element">
-                      <div class="form-label">{{ $t('e_mail_adress') }}</div>
-                      <input
-                        name="email"
-                        type="email"
-                        class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
-                        :placeholder="[[$t('e_mail_adress')]]"
-                        v-model="state.email"
+                      <div class="text-lg">{{ $t('e_mail_adress') }}</div>
+                      <p
+                        class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
+                        v-text="state.email"
                       />
                     </div>
                     <div class="form-element">
-                      <div class="form-label">{{ $t('phone_number') }}</div>
-                      <input
-                        name="tel"
-                        type="tel"
-                        class="w-full dark:bg-gray-800 rounded border border-gray-700 focus:border-indigo-500 focus:ring-2 focus:ring-indigo-900 text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
-                        :placeholder="[[$t('phone_number')]]"
-                        v-model="state.phone"
+                      <div class="text-lg">{{ $t('phone_number') }}</div>
+                      <p
+                        class="w-full dark:bg-gray-800 rounded text-base outline-none dark:text-gray-100 text-gray-600 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
+                        v-text="state.phone"
                       />
                     </div>
                   </div>
@@ -183,12 +168,12 @@
 </template>
 
 <script setup>
-import { computed, ref, reactive, watch, defineProps } from "vue";
+import { ref, reactive } from "vue";
 import { useToast } from "vue-toastification";
 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 isEmail from 'validator/es/lib/isEmail';
+// import isMobilePhone from 'validator/es/lib/isMobilePhone';
+// import isPostalCode from 'validator/es/lib/isPostalCode';
 // 
 const state = reactive({
   phone: "",
-- 
2.47.2


From 641e7a0d8ff75ce5756d11f39b583f55731b821c Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Tue, 9 Mar 2021 17:27:48 +0100
Subject: [PATCH 6/7] Profile - display group

ref #10
---
 src/components/Profile.vue | 24 +++++++++++++-----------
 1 file changed, 13 insertions(+), 11 deletions(-)

diff --git a/src/components/Profile.vue b/src/components/Profile.vue
index 7d60dcf..2dc30c7 100644
--- a/src/components/Profile.vue
+++ b/src/components/Profile.vue
@@ -9,7 +9,7 @@
             class="text-3xl font-bold whitespace-nowrap"
             v-text="(state.firstname || '') + ' ' + (state.middlename || '') + ' ' + (state.lastname || '')"
           ></p>
-          <p class="text-md whitespace-nowrap">Musterfirma > PR</p>
+          <p class="text-md whitespace-nowrap">{{ state.group }}</p>
         </div>
         <div class="inline-flex md:ml-auto md:mr-0 mx-auto items-center space-x-4">
           <button
@@ -48,30 +48,30 @@
           <div class="flex lg:flex-wrap flex-row lg:space-x-2">
             <div class="flex-none">
               <button
-                @click="() => { activetab = 'profile' }"
-                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (activetab === 'profile') }"
+                @click="() => { state.activetab = 'profile' }"
+                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'profile') }"
                 class="tab tab-underline py-4 px-6 block"
                 type="button"
               >{{ $t('profile') }}</button>
             </div>
             <div class="flex-none">
               <button
-                @click="() => { activetab = 'laptimes' }"
-                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (activetab === 'laptimes') }"
+                @click="() => { state.activetab = 'laptimes' }"
+                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'laptimes') }"
                 class="tab tab-underline py-4 px-6 block"
                 type="button"
               >{{ $t('lap_times') }}</button>
             </div>
             <div class="flex-none">
               <button
-                @click="() => { activetab = 'sponsorings' }"
-                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (activetab === 'sponsorings') }"
+                @click="() => { state.activetab = 'sponsorings' }"
+                :class="{ 'tab-active border-b-2 font-medium border-blue-500': (state.activetab === 'sponsorings') }"
                 class="tab tab-underline py-4 px-6 block"
                 type="button"
               >{{ $t('sponsoring') }}</button>
             </div>
           </div>
-          <div v-if="(activetab === 'profile')" class="tab-content block">
+          <div v-if="(state.activetab === 'profile')" class="tab-content block">
             <div class="py-4 w-full">
               <div class="flex flex-col">
                 <form class="form flex flex-wrap w-full">
@@ -116,7 +116,7 @@
               </div>
             </div>
           </div>
-          <div v-if="(activetab === 'laptimes')" class="tab-content block">
+          <div v-if="(state.activetab === 'laptimes')" class="tab-content block">
             <div class="py-4 w-full">
               <section class="text-gray-400 dark:bg-gray-900 body-font">
                 <div class="container mx-auto">
@@ -158,7 +158,7 @@
               </section>
             </div>
           </div>
-          <div v-if="(activetab === 'sponsorings')" class="tab-content block">
+          <div v-if="(state.activetab === 'sponsorings')" class="tab-content block">
             <div class="py-4 w-full">coming soon...</div>
           </div>
         </div>
@@ -181,8 +181,9 @@ const state = reactive({
   firstname: "",
   middlename: "",
   lastname: "",
+  group: "",
+  activetab: "profile",
 })
-let activetab = ref("profile");
 const toast = useToast();
 const token = location.hash.substr(1).split('&')[0].split('=')[1];
 axios.get(`${config.baseurl}api/runners/me/${token}`)
@@ -192,6 +193,7 @@ axios.get(`${config.baseurl}api/runners/me/${token}`)
     state.firstname = data.firstname;
     state.middlename = data.middlename;
     state.lastname = data.lastname;
+    state.group = data.group;
   }).catch((error) => {
     toast.error("An error occured while loading your profile data");
   })
-- 
2.47.2


From 56daa7c501e3f59e988f1912ed397e43d6311572 Mon Sep 17 00:00:00 2001
From: Philipp Dormann <philipp@philippdormann.de>
Date: Tue, 9 Mar 2021 17:39:20 +0100
Subject: [PATCH 7/7] fix fallback component routing for invalid env config

ref #10
---
 src/main.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/main.js b/src/main.js
index 188d3ff..0611093 100644
--- a/src/main.js
+++ b/src/main.js
@@ -28,7 +28,7 @@ const Privacy = import('./components/Privacy.vue');
 const Register = import('./components/Register.vue');
 const Profile = () => import('./components/Profile.vue');
 //
-let routes = [ { path: '/', component: EnvError } ];
+let routes = [ { path: '/:pathMatch(.*)*', component: EnvError } ];
 if (typeof config !== 'undefined') {
 	if (config.baseurl && config.documentserver_key) {
 		routes = [
-- 
2.47.2