From f6dd2828e270ad363b870de3ca191159f6f4ec4d Mon Sep 17 00:00:00 2001
From: Hangzhi Yu <hangzhi@protonmail.com>
Date: Tue, 4 Jul 2023 00:36:25 +0200
Subject: [PATCH] Fix double loading of legacy pages when navigated from
another legacy page
---
CHANGELOG.rst | 1 +
.../components/LegacyBaseTemplate.vue | 34 +++++++++++++++----
2 files changed, 29 insertions(+), 6 deletions(-)
diff --git a/CHANGELOG.rst b/CHANGELOG.rst
index 7bfad512c..e9c9c0c9f 100644
--- a/CHANGELOG.rst
+++ b/CHANGELOG.rst
@@ -13,6 +13,7 @@ Fixed
~~~~~
* Notifications were not properly shown in the frontend.
+* When navigating from legacy to legacy page, the latter would reload once for no reason.
`3.1.1` - 2023-07-01
--------------------
diff --git a/aleksis/core/frontend/components/LegacyBaseTemplate.vue b/aleksis/core/frontend/components/LegacyBaseTemplate.vue
index 0105952fd..a0521f07a 100644
--- a/aleksis/core/frontend/components/LegacyBaseTemplate.vue
+++ b/aleksis/core/frontend/components/LegacyBaseTemplate.vue
@@ -21,7 +21,7 @@
</message-box>
<iframe
v-else
- :src="'/django' + $route.path + queryString"
+ :src="iFrameSrc"
:height="iFrameHeight + 'px'"
class="iframe-fullsize"
@load="load"
@@ -41,6 +41,7 @@ export default {
data: function () {
return {
iFrameHeight: 0,
+ iFrameSrc: undefined,
};
},
computed: {
@@ -53,13 +54,16 @@ export default {
},
},
methods: {
+ getIFrameURL() {
+ const location = this.$refs.contentIFrame.contentWindow.location;
+ const url = new URL(location);
+ return url;
+ },
/** Handle iframe data after inner page loaded */
load() {
// Write new location of iframe back to Vue Router
- const location = this.$refs.contentIFrame.contentWindow.location;
- const url = new URL(location);
- const path = url.pathname.replace(/^\/django/, "");
- const pathWithQueryString = path + encodeURI(url.search);
+ const path = this.getIFrameURL().pathname.replace(/^\/django/, "");
+ const pathWithQueryString = path + encodeURI(this.getIFrameURL().search);
const routePath =
path.charAt(path.length - 1) === "/" &&
this.$route.path.charAt(path.length - 1) !== "/"
@@ -103,15 +107,33 @@ export default {
},
},
watch: {
- $route() {
+ $route(newRoute) {
// Show loading animation once route changes
this.$root.contentLoading = true;
+ // Only reload iFrame content when navigation comes from outsite the iFrame
+ const path = this.getIFrameURL().pathname.replace(/^\/django/, "");
+ const routePath =
+ path.charAt(path.length - 1) === "/" &&
+ newRoute.path.charAt(path.length - 1) !== "/"
+ ? newRoute.path + "/"
+ : newRoute.path;
+
+ if (path !== routePath) {
+ this.$refs.contentIFrame.contentWindow.location =
+ "/django" + this.$route.path + this.queryString;
+ } else {
+ this.$root.contentLoading = false;
+ }
+
// Scroll to top only when route changes to not affect form submits etc.
// A small duration to avoid flashing of the UI
this.$vuetify.goTo(0, { duration: 10 });
},
},
+ mounted() {
+ this.iFrameSrc = "/django" + this.$route.path + this.queryString;
+ },
name: "LegacyBaseTemplate",
};
</script>
--
GitLab