uptada BaiDuYun

f/web-kboss/src/views/customer/unsubscribe/BaiduNetdisk.vue/index.vue

@@ -1,81 +1,62 @@
 <template>
   <div class="box">
     <div v-if="loading">正在加载...</div>
-    <iframe v-else-if="url" :src="url" frameborder="0" class="baidu-style" ref="baiduIframe">
+    <iframe v-else-if="url" :src="url" frameborder="0" class="baidu-style">
     </iframe>
     <div v-else>
-      <p>无法加载内容，请检查配置。</p>
+      <p>请先登录百度云账号</p>
       <button @click="getToken">重试</button>
     </div>
   </div>
 </template>
 
 <script>
-
+import { baiducloudAPI, cancelCallbackAPI } from '@/api/BaiDuTokenapi'
 
 export default {
-  name: 'BaiduProductShow',
+  name: 'baiduProductShow',
   data() {
     return {
       userToken: '',
       url: '',
       loading: true,
-      // 模拟 session storage 中的 userId
-      userid: 'USER_001'
-    };
+    }
   },
   async created() {
-    // 模拟从 sessionStorage 获取 userId
-    // this.userid = sessionStorage.getItem('userId') || 'DEFAULT_USER';
     await this.getToken();
   },
-  mounted() {
+  mounted(){
     window.addEventListener('message', this.receiveMessage, false);
   },
-  beforeDestroy() { // Vue 2 中使用 beforeDestroy
+  destroyed() {
     window.removeEventListener('message', this.receiveMessage, false);
   },
   methods: {
-    // 获取模拟的百度云token
+    // 点击退订返回个信息 拿着信息请求 百度回调
+    // 获取百度云token
     async getToken() {
       try {
         this.loading = true;
-        const response = await mockBaiducloudAPI();
+        const response = await baiducloudAPI();
         this.userToken = response.data;
-        console.log('获取到模拟Token:', this.userToken);
-
+        let resultUrlLast = 'https://console.vcp.baidu.com/api/loginvcp/login/securitytoken?'
         if (this.userToken) {
-          // 使用一个公开的、安全的测试 iframe URL 作为示例
-          const baseUrl = 'https://example.com'; // 请替换为你的实际百度云页面URL
-          const redirectUrl = encodeURIComponent(`${baseUrl}/billing/#/refund/list`);
-          const token = encodeURIComponent(this.userToken);
-
-          // 构建最终的 URL (请根据实际百度云要求调整参数)
-          this.url = `${baseUrl}/api/loginvcp/login/securitytoken?redirectUrl=${redirectUrl}&signinSecurityToken=${token}`;
-          console.log('构建的 iframe URL:', this.url);
+          // 构建最终的 URL
+          resultUrlLast = resultUrlLast + '&redirectUrl=' + encodeURIComponent('https://console.vcp.baidu.com/billing/#/refund/list') + '&signinSecurityToken=' + encodeURIComponent(this.userToken)
+          this.url = resultUrlLast
         } else {
           console.error('未能从API响应中获取到token:', response);
-          this.url = ''; // 确保 url 为空，以便显示错误信息
         }
       } catch (error) {
-        console.error('获取Token失败:', error);
-        this.url = ''; // 出错时也清空 URL
+        console.error('获取百度云Token失败:', error);
       } finally {
-        // 注意：这里我们不立即设置 loading = false，
-        // 因为 iframe 加载完成还需要时间。
-        // 可以通过监听 iframe 的 load 事件来更精确地控制。
-        // 为简化，我们稍后用 setTimeout 模拟加载完成。
-        setTimeout(() => {
         this.loading = false;
-        }, 1500); // 模拟加载时间
       }
     },
     receiveMessage(event) {
-      //   if (event.origin !== "https://example.com") {
-      //     // 确保消息来自预期的源
-      //     return;
-      //   }
-      // console.log("iframe中的event是", event);
+      console.log('接收到消息:', event);
+
+      this.userid = sessionStorage.getItem('userId')
       const data = event.data;
       if (data && data.orderInfo && data.orderInfo.orderId) {
         // 检查接收到的数据是否包含 orderId 或者 orderIdList
@@ -87,63 +68,23 @@ export default {
           order_id: orderId,
           userid: this.userid
         }
-        reqBaiduJudgePrice(ploay).then((res) => {
-          console.log("二级接口是", res)
-          if (res.status) {
-            // let lastPloay = {
-            //   orderid: res.orderid,
-            //   product_url: this.$route.params.listUrl ? this.$route.params.listUrl : localStorage.getItem('userRescourseUrl')
-            // }
-            this.$router.push({
-              name: 'userResource',
-              params: {
-                listUrl: this.$route.params.listUrl,
-                url: this.$route.params.url
       }
+      cancelCallbackAPI(ploay).then((res) => {
+        console.log(res);
       })
-            this.$message.success('购买成功')
-            // reqBaiduOrderCost(lastPloay).then(res => {
-            //   if (res.status) {
-            //     this.loading = false
-            //     this.$message.success('购买成功')
-            //     this.$router.push({
-            //       name: 'userResource',
-            //       params: {
-            //         listUrl: this.$route.params.listUrl,
-            //         url: this.$route.params.url
-            //       }
-            //     })
-            //   }
-            //
-            // })
-          } else {
-            this.loading = false
-            this.$message.error(res.msg)
     }
-        })
-        // 在这里处理接收到的订单ID
-        const orderLog = data
-
   }
-
-    },
-  }
-};
+}
 </script>
 
 <style lang="less" scoped>
 .box {
   padding: 10px;
   height: 100%;
-  border: 1px solid #ccc; // 为了可视化容器
 }
 
 .baidu-style {
   width: 100%;
   height: calc(100vh - 100px);
-  border: 2px dashed #007bff; // 虚线边框表示 iframe 区域
 }
 </style>
-
-
-