WIP Reduce more weight

2022-08-21 18:28:17 +02:00
parent 40a2df44ad
commit f6d988c9f1
9 changed files with 26 additions and 39 deletions
@@ -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",
@@ -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"
@@ -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.',
@@ -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',
            ]),
@@ -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({
@@ -82,6 +82,7 @@
                })
                .finally(() => {
                    this.endLoading()
+                    this.$emit('loaded')
                })
        },
        methods: {
@@ -112,6 +113,7 @@
                    })
                    .finally(() => {
                        this.endLoading()
+                        this.$emit('loaded')
                    })
            },
            hasVisibleSelections (group) {
@@ -114,6 +114,7 @@
                })
                .finally(() => {
                    this.endLoading()
+                    this.$emit('loaded')
                })
        },
        methods: {
@@ -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: {
@@ -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>