Commit f813e614 authored by 秦垚玲's avatar 秦垚玲

fix:调整

parent 60370acb
......@@ -13,17 +13,20 @@
}
body {
background-color: #f5f7fa;
padding: 20px 0;
padding: 10px 0;
}
.container {
max-width: 1200px;
margin: 0 auto;
display: grid;
/* display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
gap: 10px; */
display: flex;
}
/* 顶部广告横幅 */
.banner {
.swiper-slide {
grid-column: 1 / -1;
height: 180px;
background: linear-gradient(90deg, #2f7df8, #66a3ff);
......@@ -33,22 +36,22 @@
position: relative;
overflow: hidden;
}
.banner h1 {
.swiper-slide h1 {
font-size: 38px;
font-weight: bold;
line-height: 1.3;
}
.banner h1 span:first-child {
.swiper-slide h1 span:first-child {
color: #ff4d4f;
}
.banner h1 span:last-child {
.swiper-slide h1 span:last-child {
color: #ff7a45;
}
.banner p {
.swiper-slide p {
font-size: 24px;
margin-top: 8px;
}
.banner .ad-tag {
.swiper-slide .ad-tag {
position: absolute;
right: 10px;
bottom: 10px;
......@@ -57,7 +60,7 @@
border-radius: 2px;
font-size: 12px;
}
.banner::after {
.swiper-slide::after {
content: "";
position: absolute;
right: 40px;
......@@ -74,31 +77,63 @@
.left-col {
display: flex;
flex-direction: column;
gap: 20px;
gap: 10px;
flex: 1;
}
/* 常用功能 */
.common-func {
background: #fff;
border-radius: 8px;
padding: 20px;
padding: 20px 20px 10px 20px;
position: relative;
}
.func-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.func-header h3 {
font-size: 16px;
color: #333;
}
.func-header .setting-btn {
color: #2f7df8;
/* color: #2f7df8;
font-size: 14px;
display: flex;
align-items: center;
gap: 4px;
justify-content: center;
gap: 4px; */
position: absolute;
width: 72px;
height: 29px;
top: 0;
right: 0;
opacity: 1;
border-radius: 0px 8px 0px 8px;
background: #F0FAFF;
border: 1px dashed #DFF1FF;
cursor: pointer
}
.func-header .setting-btn .set-icon{
width: 14px;
height: 14px;
background-image: url(./imagse/set_icon.png);
background-size: cover;
float: left;
margin-top: 7px;
margin-left: 5px;
}
.setting-btn .set-txt{
color: #1F93D5;
font-size: 14px;
line-height: 27px;
text-align: left;
margin-left: 5px;
}
.func-grid {
display: grid;
grid-template-columns: repeat(6, 1fr);
......@@ -130,6 +165,17 @@
.func-item:nth-child(4) .func-icon { color: #2f7df8; background: #e6f4ff; }
.func-item:nth-child(5) .func-icon { color: #36d399; background: #e6fffb; }
.func-item:nth-child(6) .func-icon { color: #9254de; background: #f9f0ff; }
.func-item .func-text{
color: #333333;
font-size: 14px;
padding: 2px;
text-align: center;
}
.func-item .func-text2{
color: #8E97B6;
font-size: 12px;
text-align: center;
}
/* 待办任务 */
.todo-section {
......@@ -161,13 +207,26 @@
margin-bottom: 10px;
opacity: 0.3;
}
.todo-empty .empty-text{
color: #909399;
margin-top: 16px;
}
.download-bar-box{
/* width: 634px; */
height: 100px;
margin-left: 5px;
margin-top: 25px;
text-align: left;
}
.download-bar {
background: #f5f7fa;
padding: 5px;
background-color: rgb(244, 248, 253);
height: 90px;
width: 457px;
margin-left: 65px;
display: flex;
align-items: center;
gap: 15px;
margin-top: 20px;
}
.download-bar .qrcode {
width: 80px;
......@@ -191,7 +250,11 @@
.right-col {
display: flex;
flex-direction: column;
gap: 20px;
gap: 10px;
margin-left: 10px;
width: 516px;
float: right;
position: relative;
}
/* 消息中心 */
.msg-center {
......@@ -200,10 +263,10 @@
padding: 15px 20px;
display: flex;
flex-direction: column;
justify-content: space-between;
/* align-items: center; */
>
/* justify-content: space-between;
align-items: center; */
width: 100%;
height: 90px;
font-size: 14px;
}
.msg-title-box{
......@@ -219,6 +282,9 @@
display: flex;
align-items: center;
gap: 6px;
color: #333;
font-size: 16px;
font-weight: bold;
}
.msg-title .dot {
width: 8px;
......@@ -238,12 +304,21 @@
.msg-center .view-all {
color: #2f7df8;
}
.msg-desc{
font-size: 14px;
line-height: 22px;
color: #666666;
text-indent: 65px;
}
/* 账户概览 */
.account-overview {
background: #fff;
border-radius: 8px;
padding: 20px;
position: relative;
}
.account-header {
display: flex;
......@@ -251,6 +326,14 @@
align-items: center;
margin-bottom: 15px;
}
.fresh-icon{
margin-left: 40px;
background-image: url(./imagse/fresh.png);
width: 12px;
height: 12px;
background-size: 100% 100%;
}
.account-header h3 {
font-size: 16px;
color: #333;
......@@ -262,38 +345,122 @@
color: #2f7df8;
font-size: 14px;
}
.account-overview .bgImg{
position: absolute;
right: 0px;
bottom: 0px;
width: 196px;
height: 134px;
background-image: url(https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images6/FN000F1/building.png);
background-size: cover;
}
.toggle-view {
color: #2f7df8;
/* color: #2f7df8;
font-size: 14px; */
position: absolute;
right: 0px;
top: 0px;
border-radius: 0px 8px;
background: rgb(240, 250, 255);
border: 1px dashed rgb(223, 241, 255);
width: 124px;
height: 27px;
cursor: pointer;
z-index: 999;
color: #1F93D5;
font-size: 14px;
margin-left: 5px;
line-height: 27px;
text-align: left;
}
.toggle-view .icon-trun{
width: 14px;
height: 14px;
background-image: url(https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images6/FN000F1/turn.png);
background-size: cover;
float: left;
margin-top: 7px;
margin-left: 5px;
}
.account-info {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 15px;
position: relative;
}
.query-btn{
position: absolute;
right: 0;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.search_icon{
background-image: url(./imagse/search.png);
width: 12px;
height: 12px;
background-size: 100% 100%;
margin-right: 5px;
}
.company-name {
font-size: 14px;
color: #333;
}
.company-id {
font-size: 14px;
color: #666;
margin-left: 8px;
margin-left:10px;
color: #666666;
font-size: 12px;
}
.balance-hide{
display: block;
}
.balance-wrap {
display: flex;
align-items: center;
gap: 8px;
line-height: 30px;
}
#balanceHide{
display: block;
}
#balanceShow{
display: none;
}
.balance-label {
font-size: 14px;
color: #666;
}
.view_open{
background: url(./imagse/view_open.png) no-repeat;
width: 16px;
height: 10px;
display: inline-block;
cursor: pointer;
display: none;
}
.view_close{
background: url(./imagse/view_close.png) no-repeat;
width: 16px;
height: 10px;
display: inline-block;
cursor: pointer;
display: block;
}
.balance-value {
font-size: 20px;
color: #ff4d4f;
color: #333333;
font-weight: bold;
font-size: 16px;
text-align: left;
float: left;
}
.info-icon{
background: url(./imagse/right.png) no-repeat;
width: 14px;
height: 14px;
float: left;
cursor: pointer;
}
/* 业务专区 */
......@@ -301,29 +468,85 @@
background: #fff;
border-radius: 8px;
overflow: hidden;
padding: 0 15px;
}
.biz-tabs {
display: flex;
border-bottom: 1px solid #eee;
}
.biz-tab {
.biz-tab-item{
width: 25%;
padding: 15px 20px;
font-size: 14px;
height: 50px;
cursor: pointer;
text-align: center;
line-height: 50px;
}
.biz-tab {
/* padding: 15px 20px; */
font-size: 16px;
color: #999;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
height: 50px;
/* padding-bottom: 10px; */
border-bottom: 1px solid #ffffff;
/* margin: 0 15px; */
color: #999;
}
.biz-tab.active {
color: #2f7df8;
border-bottom: 2px solid #2f7df8;
font-size: 16px;
color: #1F93D5;
font-weight: bold;
border-bottom: 1px solid #1F93D5;
}
#biz-tab-1-img{
background: url(./imagse/HY_logo_2.png) no-repeat;
font-size: 16px;
display: inline-block;
width: 17px;
height: 17px;
zoom: 1;
}
#biz-tab-img-1{
background: url(./imagse/HY_logo_2.png) no-repeat;
font-size: 16px;
display: inline-block;
width: 17px;
height: 17px;
zoom: 1;
}
#biz-tab-img-2{
background: url(./imagse/17@3x-1.png) no-repeat;
font-size: 16px;
display: inline-block;
width: 17px;
height: 17px;
zoom: 1;
}
#biz-tab-img-3{
background: url(./imagse/11@3x-1.png) no-repeat;
font-size: 16px;
display: inline-block;
width: 17px;
height: 17px;
zoom: 1;
}
#biz-tab-img-4{
background: url(./imagse/22@3x-1.png) no-repeat;
font-size: 16px;
display: inline-block;
width: 17px;
height: 17px;
zoom: 1;
}
.biz-sub-tabs {
display: flex;
padding: 10px 20px;
padding: 15px 0 10px 0;
gap: 10px;
}
.sub-tab {
......@@ -338,11 +561,13 @@
color: #2f7df8;
}
.cloud-archive {
padding: 20px;
/* padding: 20px;
background: linear-gradient(90deg, #e6f4ff, #f0f7ff);
display: flex;
justify-content: space-between;
align-items: center;
align-items: center; */
height: 143px;
width: 100%;
}
.archive-text h4 {
font-size: 20px;
......@@ -365,8 +590,9 @@
.bottom-ad {
grid-column: 1 / -1;
background: linear-gradient(90deg, #fce4ec, #f3e5f5);
border-radius: 8px;
padding: 15px 20px;
/* border-radius: 8px; */
/* padding: 15px 20px; */
height: 98px;
display: flex;
justify-content: space-between;
align-items: center;
......@@ -374,7 +600,12 @@
font-size: 22px;
font-weight: bold;
position: relative;
background-image: url("./imagse/102016Y011773626178417536.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
}
.bottom-ad
.bottom-ad .qrcode {
width: 80px;
height: 80px;
......@@ -400,44 +631,75 @@
<!-- 左侧列 -->
<div class="left-col">
<!-- 顶部广告横幅 -->
<div class="banner">
<div class="swiper-slide">
<h1><span>“零元汇”</span>火热来袭<br>
<span>线上跨境“惠”款好礼享不停</span>
</h1>
<div class="ad-tag">广告</div>
</div>
<!-- 常用功能 -->
<div class="common-func">
<div class="func-header">
<h3>常用功能</h3>
<div class="setting-btn">
<span>⚙️</span> 设置
<span class="set-icon"></span>
<span class="set-txt"> 设置</span>
</div>
</div>
<div class="func-grid">
<div class="func-item">
<div class="func-icon">💳</div>
<span>活期账户<br>账户查询</span>
<div class="func-icon">
<img src="./imagse/menu16_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">活期账户<br>
<span class="func-text2">账户查询</span>
</span>
</div>
<div class="func-item">
<div class="func-icon">👤</div>
<span>按笔审批<br>转账业务</span>
<div class="func-icon">
<img src="./imagse/menu13_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">按笔审批<br>
<span class="func-text2">转账业务</span>
</span>
</div>
<div class="func-item">
<div class="func-icon">📋</div>
<span>待办业务<br>服务管理</span>
<div class="func-icon">
<img src="./imagse/menu5_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">待办业务<br>
<span class="func-text2">服务管理</span>
</span>
</div>
<div class="func-item">
<div class="func-icon">🏠</div>
<span>通用流程<br>服务管理</span>
<div class="func-icon">
<img src="./imagse/menu1_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">通用流程<br>
<span class="func-text2">服务管理</span>
</span>
</div>
<div class="func-item">
<div class="func-icon">✏️</div>
<span>自定义流程<br>服务管理</span>
<div class="func-icon">
<img src="./imagse/menu14_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">自定义流程<br>
<span class="func-text2">服务管理</span>
</span>
</div>
<div class="func-item">
<div class="func-icon">📄</div>
<span>公用流程<br>服务管理</span>
<div class="func-icon">
<img src="./imagse/menu16_pic.png" alt="" style="width: 40px;height: 40px;">
</div>
<span class="func-text">公用流程<br>
<span class="func-text2">服务管理</span>
</span>
</div>
</div>
</div>
......@@ -450,12 +712,13 @@
<div class="todo-tab" id="todo-tab-3" onclick="showtodoTab(3)">提示信息 (1)</div>
</div>
<div class="todo-empty">
<div class="icon">🔍</div>
<p>暂无待办任务</p>
<img src="./imagse/empty_tips.png" alt="" style="width:40px;height: 49px;">
<p class="empty-text">暂无待办任务</p>
<div class="download-bar-box">
<div class="download-bar">
<div class="qrcode">
<!-- 这里可以放真实二维码,用背景代替 -->
<img src="./imagse/mob_drain_07.png" alt="">
</div>
<div class="download-text">
<h4>扫码下载</h4>
......@@ -466,6 +729,8 @@
</div>
</div>
</div>
</div>
<!-- 右侧列 -->
......@@ -481,59 +746,86 @@
</div>
<div class="view-list">
<span class="msg-tag">银行公告</span>
<span>关于系统升级影响部分服务的公告</span>
<span class="msg-desc">关于系统升级影响部分服务的公告</span>
</div>
</div>
<!-- 账户概览 -->
<div class="account-overview">
<div class="account-header">
<h3>账户概览 <span class="refresh-btn">⟳ 刷新</span></h3>
<div class="toggle-view">⇄ 切换收支情况</div>
<h3>账户概览 <span class="fresh-icon"></span>
<span class="refresh-btn">刷新</span>
</h3>
<div class="toggle-view">
<span class="icon-trun"></span>
切换收支情况</div>
</div>
<div class="bgImg"></div>
<div class="account-info">
<div>
<span class="company-name">中科软盈(武汉)科技有限公司</span>
<span class="company-id">42050123704500001941</span>
</div>
<div class="query-btn">
<span>Q 账户查询</span>
<div class="query-btn" onclick="onAccount()">
<span class="search_icon"></span>
<span style="color: #1F93D5;font-size: 12px;">账户查询</span>
</div>
</div>
<div class="balance-wrap">
<span class="balance-label">账面余额</span>
<span class="icon">👁️</span>
<!-- <span class="icon">👁️</span> -->
<span class="view_close" id="viewClose" onclick="view_switch(1)"></span>
<span class="view_open" id="viewOpen" onclick="view_switch(2)"></span>
</div>
<div style="height: 30px;max-width:210px;line-height: 41px;">
<div class="balance-hide" id="balanceHide" >
****
</div>
<div id="balanceShow">
<div class="balance-wrap">
<span class="balance-value">¥775,342.62</span>
<span class="info-icon"></span>
<span class="info-icon"></span>
</div>
</div>
</div>
</div>
<!-- 业务专区 -->
<div class="business-area">
<div class="biz-tabs">
<div class="biz-tab-item">
<div class="biz-tab active" id="biz-tab-1" onclick="showbizTab(1)">
<span>🏢</span> 业务专区
<span id="biz-tab-img-1"></span> 业务专区
</div>
</div>
<div class="biz-tab-item">
<div class="biz-tab" id="biz-tab-2" onclick="showbizTab(2)">
<span>💹</span> 理财推荐
<span id="biz-tab-img-2"></span> 理财推荐
</div>
</div>
<div class="biz-tab-item">
<div class="biz-tab" id="biz-tab-3" onclick="showbizTab(3)">
<span>🏦</span> 融资推荐
<span id="biz-tab-img-3"></span> 融资推荐
</div>
</div>
<div class="biz-tab-item">
<div class="biz-tab" id="biz-tab-4" onclick="showbizTab(4)">
<span>🛠️</span> 产品小助手
<span id="biz-tab-img-4"></span> 产品小助手
</div>
</div>
</div>
<div class="biz-sub-tabs">
<div class="sub-tab">外汇专区</div>
<div class="sub-tab">科技金融专区</div>
<div class="sub-tab active">云服务专区</div>
</div>
<div class="cloud-archive">
<!-- <div class="cloud-archive">
<div class="archive-text">
<h4>云档案</h4>
<p>实现对企业网银可下载文件的存储、分享<br>
......@@ -541,19 +833,21 @@
储管理及分享需求</p>
</div>
<div class="archive-icon">
<!-- 图标占位 -->
</div>
</div>
</div> -->
<img src="./imagse/ywzq_yun_01.png" alt="" class="cloud-archive">
<div class="learn-more">了解详情</div>
</div>
<!-- 底部广告 -->
<div class="bottom-ad">
<span>邀您体验移动端免盾对账</span>
<div class="qrcode">
<!-- 二维码占位 -->
<!-- <span>邀您体验移动端免盾对账</span> -->
<!-- <img src="./imagse/102016Y011773626178417536.jpg" alt="" class="bottom-img"> -->
<!-- <div class="qrcode">
</div>
<div class="ad-tag">广告</div>
<div class="ad-tag">广告</div> -->
</div>
</div>
......@@ -567,6 +861,18 @@
<script>
// 初始化轮播
var swiper = new Swiper(".mySwiper", {
// 自动轮播
autoplay: {
delay: 1000, // 间隔1秒
disableOnInteraction: false, // 手动切换后继续自动播放
},
loop: true, // 无缝循环
});
// 获取所有具有 '.tab' 类的DOM元素(标签)
var tabs = document.querySelectorAll('.todo-tab');
// 获取所有具有 '.tab-content' 类的DOM元素(内容区域)
......@@ -595,6 +901,7 @@
// var contents = document.querySelectorAll('.tab-content');
// 定义 showTab 函数,用于切换标签页
function showbizTab(tabNumber) {
console.log("tabNumber=======",tabNumber)
// 遍历所有标签,移除 'active-tab' 类以去除激活状态
tabs2.forEach(function(tab) {
tab.classList.remove('active');
......@@ -607,6 +914,115 @@
document.getElementById('biz-tab-' + tabNumber).classList.add('active');
// 为对应的内容区域添加 'active-content' 类以显示内容
// document.getElementById('content-' + tabNumber).classList.add('active-content');
if(tabNumber == 1){
document.getElementById('biz-tab-img-1').style.background = `url(./imagse/HY_logo_2.png) no-repeat`;//选中
document.getElementById('biz-tab-img-2').style.background = `url(./imagse/17@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-3').style.background = `url(./imagse/11@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-4').style.background = `url(./imagse/22@3x-1.png) no-repeat`;
}
if(tabNumber == 2){
document.getElementById('biz-tab-img-1').style.background = `url(./imagse/HY_logo_1.png) no-repeat`;
document.getElementById('biz-tab-img-2').style.background = `url(./imagse/17@3x.png) no-repeat`; //选中
document.getElementById('biz-tab-img-3').style.background = `url(./imagse/11@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-4').style.background = `url(./imagse/22@3x-1.png) no-repeat`;
}
if(tabNumber == 3){
document.getElementById('biz-tab-img-1').style.background = `url(./imagse/HY_logo_1.png) no-repeat`;
document.getElementById('biz-tab-img-2').style.background = `url(./imagse/17@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-3').style.background = `url(./imagse/11@3x.png) no-repeat`;//选中
document.getElementById('biz-tab-img-4').style.background = `url(./imagse/22@3x-1.png) no-repeat`;
}
if(tabNumber == 4){
document.getElementById('biz-tab-img-1').style.background = `url(./imagse/HY_logo_1.png) no-repeat`;
document.getElementById('biz-tab-img-2').style.background = `url(./imagse/17@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-3').style.background = `url(./imagse/11@3x-1.png) no-repeat`;
document.getElementById('biz-tab-img-4').style.background = `url(./imagse/22@3x.png) no-repeat`;//选中
}
}
function view_switch(type){
if(type == 1){
let viewClose = document.getElementById("viewClose");
viewClose.style.display = "none";
let viewOpen = document.getElementById("viewOpen");
viewOpen.style.display = "block";
let balanceHide = document.getElementById("balanceHide");
balanceHide.style.display = "none";
let balanceShow = document.getElementById("balanceShow");
balanceShow.style.display = "block";
}
if(type == 2){
let viewOpen = document.getElementById("viewOpen");
viewOpen.style.display = "none";
let viewClose = document.getElementById("viewClose");
viewClose.style.display = "block";
let balanceHide = document.getElementById("balanceHide");
balanceHide.style.display = "block";
let balanceShow = document.getElementById("balanceShow");
balanceShow.style.display = "none";
}
}
function showBalance() {
document.querySelectorAll('.balance-hide').forEach(element => {
element.style.display = 'none'; // 隐藏元素
});
document.querySelectorAll('.balance-wrap').forEach(element => {
element.style.display = 'block'; // 隐藏元素
});
}
function hideBalance() {
document.querySelectorAll('.balance-hide').forEach(element => {
element.style.display = 'block'; // 隐藏元素
});
document.querySelectorAll('.balance-wrap').forEach(element => {
element.style.display = 'none'; // 隐藏元素
});
}
function onAccount(){
// 2. 存到本地存储(页面B能拿到)
console.log("跳转账户===========")
// 主动调用父页面方法,把新值传过去(推荐,不用轮询)
// parent.getIframeVal('account');
// console.log("33333=========")
// let homeBox = document.getElementById("homeBox");
// console.log("444=========")
// homeBox.style.display = "none";
// let accountBox = document.getElementById("accountBox");
// console.log("accountBox=========",accountBox)
// accountBox.style.display = "block";
// window.parent.postMessage('account', "*");
window.parent.postMessage({ type: 'STATUS_CHANGE', value: true }, '*')
}
......@@ -614,3 +1030,5 @@
</script>
......@@ -1721,8 +1721,8 @@ function gotoTouSuZhiNan() {
</div>
</div>
<iframe src="home.html" id="homeBox" style="border:none; overflow:hidden; width:100%; height:740px;display: block;"></iframe>
<iframe src="account.html" id="accountBox" style="border:none; overflow:hidden; width:100%; height:740px; display: none;"></iframe>
<iframe src="home.html" id="homeBox" style="border:none; overflow:hidden; width:100%; height:790px;display: block;"></iframe>
<iframe src="account.html" id="accountBox" style="border:none; overflow:hidden; width:100%; height:581px; display: none;"></iframe>
<!-- <iframe src="account_detail.html" style="border:none; overflow:hidden; width:100%; height:850px;"></iframe> -->
<!-- <iframe src="account_list.html" style="border:none; overflow:hidden; width:100%; height:2050px;"></iframe> -->
......@@ -9728,6 +9728,43 @@ function whzqProcess(menuId){
</script>
<script type="text/javascript">
// 监听 storage 变化(别的页面改了数字,这里立刻收到)
// window.addEventListener("storage", function (e) {
// console.log("e========",e)
// // 只监听我们的 key
// if (e.key === "pageName") {
// let newValue = e.newValue;
// // ✅ 监听到变化后,自动跳转到目标页面!
// setTimeout(() => {
// // location.href = "target.html?num=" + newValue;
// let homeBox = document.getElementById("homeBox");
// homeBox.style.display = "none";
// let accountBox = document.getElementById("accountBox");
// accountBox.style.display = "block";
// }, 500);
// }
// });
// 父页面暴露一个接收方法给iframe
// window.postMessage = function(val){
// console.log("父组件拿到值===========",val)
// if (val.data == "account") {
// console.log("父组件拿到值===========",val.data)
// // ✅ 监听到变化后,自动跳转到目标页面!
// setTimeout(() => {
// let homeBox = document.getElementById("homeBox");
// homeBox.style.display = "none";
// let accountBox = document.getElementById("accountBox");
// accountBox.style.display = "block";
// }, 500);
// }
// };
// 展示首页信息
function showHome(){
let accountBox = document.getElementById("accountBox");
......@@ -9989,6 +10026,23 @@ $(function(){
try {
if(window.console){
console.log(e);
// 拿到子组件iframe方法
let value = e.data;
if (value.type == 'STATUS_CHANGE') {
// ✅ 监听到变化后,自动跳转到目标页面!
console.log("33333=========")
let homeBox = document.getElementById("homeBox");
homeBox.style.display = "none";
let accountBox = document.getElementById("accountBox");
accountBox.style.display = "block";
// 选中效果
var accountBtn = document.getElementById("0001");
// 主动触发点击事件
accountBtn.click();
}
}
var ori = e.origin;
var ipAddress = 'https://exp.ccb.com';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment