3eb03da0da
- 添加HostWheelMessage类型定义和IFRAME_WHEEL消息常量 - 实现iframe轮播事件监听和消息发送功能 - 移除address.type.ts中的region和region_text字段 - 更新英文本地化文件中的completed状态为Approved - 添加订单状态通知相关的国际化文案 - 更新常量文件中的订单状态描述注释 - 在index.ts中添加HostWheelMessage和OrderStatusCode类型 - 修改record页面的订单状态处理逻辑 - 实现订单状态变更通知弹窗功能 - 优化地址簿获取地址文本的方法 - 修复地址列表API响应数据访问问题 - 添加playx.html测试页面和相关配置文件
106 lines
2.7 KiB
HTML
106 lines
2.7 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
|
|
>
|
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
<title>PlayX</title>
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
html, body {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
main {
|
|
display: flex;
|
|
height: calc(100% - 80px);
|
|
width: 100%;
|
|
}
|
|
|
|
header {
|
|
background-color: red;
|
|
height: 80px;
|
|
width: 100%;
|
|
}
|
|
|
|
aside {
|
|
background-color: blue;
|
|
height: 100%;
|
|
width: 200px;
|
|
}
|
|
|
|
section {
|
|
background-color: yellow;
|
|
height: 100%;
|
|
width: calc(100% - 200px);
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>header</header>
|
|
<main>
|
|
<aside>aside</aside>
|
|
<section id="host-scroll-region">
|
|
<div id="iframe-container" style="height: 100%">
|
|
<iframe
|
|
id="playx-frame"
|
|
src="https://playx-mall.cjdhr.top"
|
|
width="100%"
|
|
height="100%"
|
|
></iframe>
|
|
</div>
|
|
<footer style="height: 80px; background-color: green;">footer</footer>
|
|
</section>
|
|
</main>
|
|
|
|
<script>
|
|
const frame = document.getElementById('playx-frame')
|
|
const iframeContainer = document.getElementById('iframe-container')
|
|
const hostScrollRegion = document.getElementById('host-scroll-region')
|
|
|
|
frame.addEventListener('load', () => {
|
|
iframeContainer.style.height = '100%'
|
|
hostScrollRegion.scrollTop = 0
|
|
})
|
|
|
|
window.addEventListener('message', (event) => {
|
|
if (event.source !== frame.contentWindow) {
|
|
return
|
|
}
|
|
|
|
if (event.data?.type === 'IFRAME_HEIGHT') {
|
|
const height = Number(event.data?.payload?.height)
|
|
|
|
if (!Number.isFinite(height) || height <= 0) {
|
|
return
|
|
}
|
|
|
|
iframeContainer.style.height = `${height}px`
|
|
return
|
|
}
|
|
|
|
if (event.data?.type === 'IFRAME_WHEEL') {
|
|
const downTotalY = Number(event.data?.payload?.downTotalY)
|
|
|
|
if (!Number.isFinite(downTotalY)) {
|
|
return
|
|
}
|
|
|
|
const maxScrollTop = Math.max(hostScrollRegion.scrollHeight - hostScrollRegion.clientHeight, 0)
|
|
hostScrollRegion.scrollTop = Math.min(Math.max(downTotalY, 0), maxScrollTop)
|
|
}
|
|
})
|
|
</script>
|
|
</body>
|
|
</html>
|