From f6d988c9f10bea67d6c4d685cc0f6a3f45788345 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bj=C3=B6rn=20Fromme?= <fromme@dreipunktnull.com>
Date: Sun, 21 Aug 2022 18:28:17 +0200
Subject: [PATCH] WIP Reduce more weight

---
 package-lock.json                             | 27 -------------------
 package.json                                  |  1 -
 .../Private/Assets/js/myep/Address.vue        |  4 +++
 .../Resources/Private/Assets/js/myep/App.vue  | 14 ++++++----
 .../Private/Assets/js/myep/BookingEdit.vue    |  6 ++---
 .../Private/Assets/js/myep/CrmData.vue        |  2 ++
 .../Private/Assets/js/myep/Events.vue         |  1 +
 .../Private/Assets/js/myep/Login.vue          |  6 +++--
 .../Private/Assets/js/myep/Newsletter.vue     |  4 +++
 9 files changed, 26 insertions(+), 39 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 46ef06aa..f7851422 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -30,7 +30,6 @@
         "stimulus-use": "^0.25.4",
         "vue": "^2.6.14",
         "vue-router": "^3.5.2",
-        "vue-scrollto": "^2.20.0",
         "vue-session": "^1.0.0",
         "vuex": "^3.6.2",
         "whatwg-fetch": "^3.6.2"
@@ -2777,11 +2776,6 @@
       "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
       "dev": true
     },
-    "node_modules/bezier-easing": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/bezier-easing/-/bezier-easing-2.1.0.tgz",
-      "integrity": "sha512-gbIqZ/eslnUFC1tjEvtz0sgx+xTK20wDnYMIA27VA04R7w6xxXQPZDbibjA9DTWZRA2CXtwHykkVzlCaAJAZig=="
-    },
     "node_modules/big.js": {
       "version": "5.2.2",
       "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
@@ -8206,14 +8200,6 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.4.tgz",
       "integrity": "sha512-x+/DLAJZv2mcQ7glH2oV9ze8uPwcI+H+GgTgTmb5I55bCgY3+vXWIsqbYUzbBSZnwFHEJku4eoaH/x98veyymQ=="
     },
-    "node_modules/vue-scrollto": {
-      "version": "2.20.0",
-      "resolved": "https://registry.npmjs.org/vue-scrollto/-/vue-scrollto-2.20.0.tgz",
-      "integrity": "sha512-7i+AGKJTThZnMEkhIPgrZjyAX+fXV7/rGdg+CV283uZZwCxwiMXaBLTmIc5RTA4uwGnT+E6eJle3mXQfM2OD3A==",
-      "dependencies": {
-        "bezier-easing": "2.1.0"
-      }
-    },
     "node_modules/vue-session": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/vue-session/-/vue-session-1.0.0.tgz",
@@ -10808,11 +10794,6 @@
       "integrity": "sha512-x+VAiMRL6UPkx+kudNvxTl6hB2XNNCG2r+7wixVfIYwu/2HKRXimwQyaumLjMveWvT2Hkd/cAJw+QBMfJ/EKVw==",
       "dev": true
     },
-    "bezier-easing": {
-      "version": "2.1.0",
-      "resolved": "https://registry.npmjs.org/bezier-easing/-/bezier-easing-2.1.0.tgz",
-      "integrity": "sha512-gbIqZ/eslnUFC1tjEvtz0sgx+xTK20wDnYMIA27VA04R7w6xxXQPZDbibjA9DTWZRA2CXtwHykkVzlCaAJAZig=="
-    },
     "big.js": {
       "version": "5.2.2",
       "resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
@@ -14754,14 +14735,6 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.4.tgz",
       "integrity": "sha512-x+/DLAJZv2mcQ7glH2oV9ze8uPwcI+H+GgTgTmb5I55bCgY3+vXWIsqbYUzbBSZnwFHEJku4eoaH/x98veyymQ=="
     },
-    "vue-scrollto": {
-      "version": "2.20.0",
-      "resolved": "https://registry.npmjs.org/vue-scrollto/-/vue-scrollto-2.20.0.tgz",
-      "integrity": "sha512-7i+AGKJTThZnMEkhIPgrZjyAX+fXV7/rGdg+CV283uZZwCxwiMXaBLTmIc5RTA4uwGnT+E6eJle3mXQfM2OD3A==",
-      "requires": {
-        "bezier-easing": "2.1.0"
-      }
-    },
     "vue-session": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/vue-session/-/vue-session-1.0.0.tgz",
diff --git a/package.json b/package.json
index 991dbb7c..6e274b26 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,6 @@
     "stimulus-use": "^0.25.4",
     "vue": "^2.6.14",
     "vue-router": "^3.5.2",
-    "vue-scrollto": "^2.20.0",
     "vue-session": "^1.0.0",
     "vuex": "^3.6.2",
     "whatwg-fetch": "^3.6.2"
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
index 60de1b17..f210fb0a 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Address.vue
@@ -81,6 +81,7 @@
             this.loadAddress()
                 .then(() => {
                     this.picker.setDate(new Date(this.userData.dateOfBirth), true);
+                    this.$emit('loaded')
                 })
         },
         mounted () {
@@ -101,6 +102,9 @@
             save () {
                 this.formErrors = {}
                 this.saveAddress(this.userData)
+                    .then(() => {
+                        this.$emit('loaded')
+                    })
                     .catch(error => {
                         this.alert({
                             message: 'Bitte überprüfe deine Eingaben.',
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/App.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/App.vue
index d0d3ab09..e2a001c4 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/App.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/App.vue
@@ -1,8 +1,9 @@
 <template>
-    <div id="myep" class="relative mb-16">
-        <nav class="w-full bg-zinc-50 flex items-center justify-between mb-8 relative" v-if="isLoggedIn">
-            <span class="block text-2xl px-4">My E&P</span>
-            <div class="absolute z-50 top-100 left-0 w-full bg-zinc-50 shadow lg:relative lg:top-auto lg:left-auto lg:w-auto lg:shadow-none lg:flex lg:space-x-4"
+    <div class="relative mb-16">
+        <a ref="container" class="block w-0 h-0 pt-24 -mt-24"></a>
+        <nav class="w-full bg-zinc-50 flex items-center mb-8 relative" v-if="isLoggedIn">
+            <div class="flex-1 block text-2xl px-4">My E&P</div>
+            <div class="bg-zinc-50 shadow w-full lg:w-auto absolute lg:relative z-10 lg:z-auto top-full lg:top-auto bg-white left-0 lg:relative lg:shadow-none lg:flex lg:space-x-4"
                 :class="{ 'hidden': !navVisible }">
               <div class="lg:flex lg:items-center m-0">
                 <router-link @click.native="navVisible = false" :to="{ name: 'address' }" class="block p-4 text-black hover:bg-zinc-400 hover:text-zinc-800" active-class="bg-zinc-400 text-zinc-800">Adressdaten</router-link>
@@ -19,7 +20,7 @@
         </nav>
         <div class="p-4 mb-8 text-white" :class="{'bg-emerald-600': alert.success, 'bg-red-600': !alert.success}" v-if="alert.message" v-html="alert.message"></div>
         <div class="relative">
-            <router-view></router-view>
+            <router-view @loaded="scrollTop()"></router-view>
             <div class="absolute top-0 left-0 inset-0 bg-overlay-white" v-show="loading">
                 <div class="absolute top-1/2 left-1/2 transform -translate-xy-1/2 flex items-center space-x-2 h-8">
                     <img :src="config.loaderUrl" alt="" class="block w-4 h-4">
@@ -45,6 +46,9 @@
                         this.$router.replace({ name: 'login' })
                     }).catch(error => {});
             },
+            scrollTop() {
+                this.$refs.container.scrollIntoView({behavior: 'smooth', block: 'start'})
+            },
             ...mapMutations([
                 'initConfig',
             ]),
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
index 33ba0e6c..30eb77c1 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/BookingEdit.vue
@@ -158,7 +158,6 @@
 
 <script>
     import Vue from 'vue'
-    import VueScrollTo from 'vue-scrollto'
     import AccommodationSelect from './components/AccommodationSelect'
     import ContingentsOverview from './components/ContingentsOverview'
     import MutableFields from './components/MutableFields'
@@ -174,8 +173,6 @@
     import { mapGetters, mapMutations, mapState } from 'vuex'
     import { checkStatus, defaultOptions } from './api'
 
-    Vue.use(VueScrollTo)
-
     export default {
         name: 'BookingEdit',
         components: {
@@ -430,7 +427,6 @@
                 return messages
             },
             storeBookingData() {
-                this.$scrollTo('#myep')
                 let messages = this.validateInput();
                 if (false === this.dataValid) {
                     this.alert({
@@ -469,6 +465,7 @@
                     })
                     .finally(() => {
                         this.endLoading()
+                        this.$emit('loaded')
                     })
             }
         },
@@ -532,6 +529,7 @@
                 .then(() => this.loadServices())
                 .then(() => {
                     this.initialized = true;
+                    this.$emit('loaded')
                 })
                 .catch(error => {
                     this.alert({
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
index 7ee867fc..9b2d4675 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/CrmData.vue
@@ -82,6 +82,7 @@
                 })
                 .finally(() => {
                     this.endLoading()
+                    this.$emit('loaded')
                 })
         },
         methods: {
@@ -112,6 +113,7 @@
                     })
                     .finally(() => {
                         this.endLoading()
+                        this.$emit('loaded')
                     })
             },
             hasVisibleSelections (group) {
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
index 0060bf52..a7a99865 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Events.vue
@@ -114,6 +114,7 @@
                 })
                 .finally(() => {
                     this.endLoading()
+                    this.$emit('loaded')
                 })
         },
         methods: {
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
index 6fc2d982..3f4a00e8 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Login.vue
@@ -97,7 +97,7 @@
                             this.$router.replace({ name: 'address' })
                         })
                 }).catch(error => {
-                });
+                })
             },
             resetPassword () {
                 this.formErrors = {};
@@ -134,7 +134,9 @@
                             this.$set(this.formErrors, violation.property_path, violation.message);
                         }
                     }
-                });
+                }).finally(() => {
+                    this.$emit('loaded')
+                })
             }
         },
         computed: {
diff --git a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
index 99662943..e9e622d7 100644
--- a/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
+++ b/public/typo3conf/ext/ep_theme/Resources/Private/Assets/js/myep/Newsletter.vue
@@ -51,6 +51,7 @@
                     })
                     .finally(() => {
                         this.endLoading()
+                        this.$emit('loaded')
                     })
             }
         },
@@ -62,6 +63,9 @@
                 message += 'zum Newsletter angemeldet.';
                 return message;
             }
+        },
+        created() {
+            this.$emit('loaded')
         }
     }
 </script>