yumoqing/kboss
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update loading

Browse Source
This commit is contained in:
ping 2025-09-25 14:55:50 +08:00
parent 95b04e9349
commit 70f2c06839
1 changed files with 25 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -1,11 +1,13 @@
<template> <template>
<div class="box"> <div class="box">
<!-- 添加全屏加载效果 -->
<iframe v-loading="loading" v-if="url" :src="url" frameborder="0" class="baidu-style"> <div v-loading="loading" class="loading-container">
</iframe> <iframe v-if="url" :src="url" frameborder="0" class="baidu-style">
<div v-else> </iframe>
<p>请先登录百度云账号</p> <div v-else class="login-prompt">
<button @click="getToken">重试</button> <p>请先登录百度云账号</p>
<button @click="getToken">重试</button>
</div>
</div> </div>
</div> </div>
</template> </template>
@ -22,7 +24,6 @@ export default {
url: '', url: '',
loading: true, loading: true,
userid: '', userid: '',
} }
}, },
async created() { async created() {
@ -62,24 +63,12 @@ export default {
console.log('接收到消息:', event); console.log('接收到消息:', event);
const data = event.data; const data = event.data;
console.log('接收到的 data 是:', data); console.log('接收到的 data 是:', data);
// 1. 检查数据结构和来源 (可选但推荐)
// const expectedOrigin = 'https://console.vcp.baidu.com';
// if (event.origin !== expectedOrigin) {
// console.warn('Received message from unexpected origin:', event.origin);
// return;
// }
// 2. 检查是否存在 refundInfo 和 uuidList // 2. 检查是否存在 refundInfo 和 uuidList
if (data && data.refundInfo && Array.isArray(data.refundInfo.uuidList) && data.refundInfo.uuidList.length > 0) { if (data && data.refundInfo && Array.isArray(data.refundInfo.uuidList) && data.refundInfo.uuidList.length > 0) {
const uuidListArray = data.refundInfo.uuidList; // 这是一个数组 const uuidListArray = data.refundInfo.uuidList; // 这是一个数组
// 3. 提取订单ID (这里假设取第一个，或者根据需要处理整个数组) console.log('提取到的订单ID:', uuidListArray);
// 如果只需要一个订单ID进行退订
const orderId = uuidListArray;
// 如果需要处理多个订单ID，可以用逗号连接
// const orderId = uuidListArray.join(',');
console.log('提取到的订单ID:', orderId);
// 4. 获取用户ID // 4. 获取用户ID
this.userid = sessionStorage.getItem('userId'); this.userid = sessionStorage.getItem('userId');
@ -91,7 +80,7 @@ export default {
// 5. 构造请求参数 // 5. 构造请求参数
const payload = { const payload = {
order_id: orderId, order_id: uuidListArray,
userid: this.userid userid: this.userid
}; };
@ -104,9 +93,9 @@ export default {
console.log("调用 reqBaiduJudgePrice 接口返回:", res); console.log("调用 reqBaiduJudgePrice 接口返回:", res);
if (res.status) { // 假设 status 为 true 表示成功 if (res.status) { // 假设 status 为 true 表示成功
this.$message.success('退订成功'); this.$message.success('退订成功');
// 跳转页面 // 修复页面跳转 - 使用 path 而不是 url
this.$router.push({ this.$router.push({
url: '/BaiduNetdisk', path: '/BaiduNetdisk',
}); });
} else { } else {
// 显示后端返回的错误信息 // 显示后端返回的错误信息
@ -124,7 +113,6 @@ export default {
}); });
} else { } else {
console.log('接收到的消息不包含有效的退款信息或 uuidList 为空'); console.log('接收到的消息不包含有效的退款信息或 uuidList 为空');
// 根据需要决定是否提示用户
} }
} }
} }
@ -137,11 +125,19 @@ export default {
height: 100%; height: 100%;
} }
.loading-container {
width: 100%;
height: 100%;
position: relative;
}
.login-prompt {
text-align: center;
padding: 50px;
}
.baidu-style { .baidu-style {
width: 100%; width: 100%;
height: calc(100vh - 100px); height: calc(100vh - 100px);
} }
</style> </style>