跳转商城修复ticket失效问题

src/views/modules/volunteer/mall/category.vue

@@ -0,0 +1,78 @@
+<template>
+  <div>
+    <!-- 隐藏 iframe，等子页面加载完成并修改后再显示 -->
+    <iframe
+      id="childIframe"
+      ref="childIframe"
+      :src="iframeSrc"
+      width="100%"
+      height="1000px"
+      frameborder="0"
+      style="display: none;"
+      @load="onIframeLoad"
+    ></iframe>
+  </div>
+</template>
+
+<script>
+import http from "@/utils/request";
+export default {
+  data() {
+    return {
+      // 嵌入的网页地址
+      iframeSrc: '', // 初始时 iframeSrc 为空，等接口获取到地址后再赋值
+    };
+  },
+  created() {
+    // 此处请求后端,获取一个ticket票据
+    http.get("/auth/sso/getTicket")
+      .then(({ data: res }) => {
+        let ticket = res.data;
+        console.log('ticket:', ticket);
+        this.iframeSrc = "../../../epmet-voluntary-mall-admin/pms/productCategory?ticket=" + ticket;
+      });
+  },
+  methods: {
+    // 监听 iframe 加载完成事件
+    onIframeLoad() {
+
+      if(this.iframeSrc==''){
+        return;
+      }
+      
+      const iframe = this.$refs.childIframe;
+
+      if (this.iframeSrc.indexOf("ticket")!== -1) {
+        // 将 iframeSrc 设置为新的 URL（去掉了 ticket 参数）
+        this.iframeSrc = "../../../epmet-voluntary-mall-admin/pms/productCategory";
+      }else{
+        const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+
+        if (iframeDocument) {
+          const styleElement = iframeDocument.createElement('style');
+          styleElement.type = 'text/css';
+
+          const newStyles = `
+            #app .main-container {
+              margin-left: 0px !important;
+            }
+            #app .sidebar-container {
+                display: none !important;
+            }
+            .navbar {
+                display: none !important;
+            }
+          `;
+
+          styleElement.appendChild(iframeDocument.createTextNode(newStyles));
+          iframeDocument.head.appendChild(styleElement);
+
+          // 显示 iframe
+          iframe.style.display = 'block';
+        }
+      }
+      
+    }
+  }
+};
+</script>

src/views/modules/volunteer/mall/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <div>
+    <!-- 隐藏 iframe，等子页面加载完成并修改后再显示 -->
+    <iframe
+      id="childIframe"
+      ref="childIframe"
+      :src="iframeSrc"
+      width="100%"
+      height="1000px"
+      frameborder="0"
+      style="display: none;"
+      @load="onIframeLoad"
+    ></iframe>
+  </div>
+</template>
+
+<script>
+import http from "@/utils/request";
+export default {
+  data() {
+    return {
+      // 嵌入的网页地址
+      iframeSrc: '', // 初始时 iframeSrc 为空，等接口获取到地址后再赋值
+    };
+  },
+  created() {
+    // 此处请求后端,获取一个ticket票据
+    http.get("/auth/sso/getTicket")
+      .then(({ data: res }) => {
+        let ticket = res.data;
+        console.log('ticket:', ticket);
+        this.iframeSrc = "../../../epmet-voluntary-mall-admin/pms/product?ticket=" + ticket;
+      });
+  },
+  methods: {
+    // 监听 iframe 加载完成事件
+    onIframeLoad() {
+
+      if(this.iframeSrc==''){
+        return;
+      }
+      
+      const iframe = this.$refs.childIframe;
+
+      if (this.iframeSrc.indexOf("ticket")!== -1) {
+        // 将 iframeSrc 设置为新的 URL（去掉了 ticket 参数）
+        this.iframeSrc = "../../../epmet-voluntary-mall-admin/pms/product";
+      }else{
+        const iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
+
+        if (iframeDocument) {
+          const styleElement = iframeDocument.createElement('style');
+          styleElement.type = 'text/css';
+
+          const newStyles = `
+            #app .main-container {
+              margin-left: 0px !important;
+            }
+            #app .sidebar-container {
+                display: none !important;
+            }
+            .navbar {
+                display: none !important;
+            }
+          `;
+
+          styleElement.appendChild(iframeDocument.createTextNode(newStyles));
+          iframeDocument.head.appendChild(styleElement);
+
+          // 显示 iframe
+          iframe.style.display = 'block';
+        }
+      }
+      
+    }
+  }
+};
+</script>