Skip to content

B
buildbank-replica
Commit 5ffa96e1 authored by 秦垚玲's avatar 秦垚玲
Browse files
Options

fix:电子回单查询跳转页面

parent cceefc84
Show whitespace changes
Inline Side-by-side
Showing with 572 additions and 14 deletions
electronic_receipt.html
View file @ 5ffa96e1
...@@ -744,11 +744,9 @@ ...@@ -744,11 +744,9 @@
<div style="height: 90px"></div> <div style="height: 90px"></div>
<!-- 按钮组 --> <!-- 按钮组 -->
<button class="buttonx xx" onclick="onAccount(1)" type="submit"> <button class="buttonx xx" onclick="onHandle(1)" type="submit">确定</button>
确定 <button type="button" class="buttonx yy showForm1" id="amendBtn"
</button> onclick="onHandle(2)">更正回期查询</button>
<button type="button" class="buttonx yy showForm1">更正回期查询</button>
</form> </form>
</div> </div>
...@@ -774,6 +772,12 @@ ...@@ -774,6 +772,12 @@
// document.getElementById('wrapper').style.visibility = 'visible'; // 3秒后变为可见 // document.getElementById('wrapper').style.visibility = 'visible'; // 3秒后变为可见
// }, 1000); // 1000毫秒后执行 // }, 1000); // 1000毫秒后执行
// formn表单返回
// document.getElementById('amendBtn').addEventListener('click', function() {
// console.log("跳转1111111111111")
// window.location.href = "./electronic_receipt_amend.html";
// });
function sendHeight() { function sendHeight() {
const pageHeight = Math.ceil(Math.max( const pageHeight = Math.ceil(Math.max(
...@@ -959,7 +963,7 @@ document.getElementById('typeSelect').addEventListener('change', function(e) { ...@@ -959,7 +963,7 @@ document.getElementById('typeSelect').addEventListener('change', function(e) {
const form = document.getElementById("myForm"); const form = document.getElementById("myForm");
function onAccount(number) { function onHandle(number) {
if (number == 1) { if (number == 1) {
form.addEventListener("submit", async (e) => { form.addEventListener("submit", async (e) => {
e.preventDefault(); // 阻止页面刷新 e.preventDefault(); // 阻止页面刷新
...@@ -977,15 +981,12 @@ document.getElementById('typeSelect').addEventListener('change', function(e) { ...@@ -977,15 +981,12 @@ document.getElementById('typeSelect').addEventListener('change', function(e) {
// }, 500); // }, 500);
}); });
} }
if (number == 2) { if(number == 2) {
window.history.back(); console.log("onHandle==========跳转更正页")
return false; window.location.href = "./electronic_receipt_amend.html";
}
if (number == 3) {
console.log(33333);
window.location.href = "./account_detail-long.html";
return false;
} }
} }
</script> </script>
\ No newline at end of file
electronic_receipt_amend.html 0 → 100644
View file @ 5ffa96e1
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="calendar-plugin/calendar.css">
<title>更正回期查询</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Microsoft Yahei", sans-serif;
font-size: 14px;
}
body {
background-color: #ffffff;
padding: 0;
}
li, ul {
list-style: none;
}
/* 顶部导航栏 */
.top-nav {
background-color: #ffffff;
border-bottom: 2px solid #1f93d5;
display: flex;
align-items: center;
padding: 10px 20px;
gap: 40px;
}
.top-nav a {
color: #1f93d5;
text-decoration: none;
font-size: 16px;
}
/* 面包屑 */
.breadcrumb {
height: 42px;
background-color: #f4f5fb;
border: 1px solid #dfe1f2;
line-height: 40px;
padding-left: 10px;
margin: 15px 0;
font-size: 14px;
color: #2C2C2C;
}
.breadcrumb_item{
font-weight: bold;
}
.content{
display: flex;
align-items: center;
justify-content: center;
padding: 7px 0;
border: 1px solid #1f93d5;
}
/* 账户信息卡片 */
.account-card {
margin-top: 15px;
border-radius: 4px;
}
.account-card .account-number {
background: #fff;
position: relative;
}
.account-card .account-number::before {
content: '';
height: 2px;
background-color: #1f93d5;
position: absolute;
bottom: -2px;
left: 0;
width: 25px;
}
.account-card .account-number::after {
content: '';
height: 2px;
background-color: #1f93d5;
position: absolute;
bottom: -2px;
left: 141px;
right: 0
}
.account-number div {
display: inline-block;
border: 2px solid #1f93d5;
border-bottom: none;
color: #1f93d5;
padding: 4px 8px;
border-radius: 4px 4px 0 0;
margin-left:23px;
height: 40px;
width: 120px;
text-align: center;
line-height: 30px;
font-weight: bold;
}
.tabMenuBox{
background: url(./images/menuTabline.png) repeat-x bottom;
height: 40px;
padding-left: 23px;
margin: 15px 0px 5px 0px;
}
.tabMenuBox li {
display: inline;
line-height: 20px;
float: left;
}
.tabMenuBox .tabMenu {
display: inline;
line-height: 20px;
float: left;
}
.tabMenuBox .tabMenu span{
display: block;
height: 40px;
width: 5px;
float: left;
}
.tabMenuBox li span {
display: block;
height: 40px;
width: 5px;
float: left;
background: url(./images/menuTabDL.png) no-repeat top left;
}
#tabMenuCur span {
background: url(./images/menuTabL.png) no-repeat bottom left;
}
#tabMenuCur a {
background: url(./images/menuTabR.png) no-repeat bottom right;
height: 40px;
cursor: default;
font-weight: bold;
color: #1f93d5;
white-space: nowrap;
}
.tabMenuBox .tabMenu a {
display: block;
float: left;
padding-left: 10px;
padding-right: 15px;
height: 40px;
line-height: 40px;
background: url(./images/menuTabDR.png) no-repeat top right;
margin: 0px 5px 0px 0px;
text-decoration: none;
color: #2c2c2c;
text-align: center;
white-space: nowrap;
}
.tabMenuBox li a {
display: block;
float: left;
padding-left: 10px;
padding-right: 15px;
height: 40px;
line-height: 40px;
background: url(./images/menuTabDR.png) no-repeat top right;
margin: 0px 5px 0px 0px;
text-decoration: none;
color: #2c2c2c;
text-align: center;
white-space: nowrap;
_padding-top: 0px;
}
/* 查询表单 */
.form-container {
padding: 20px;
}
.form-title {
font-size: 16px;
font-weight: bold;
margin-bottom: 20px;
}
.form-row {
display: flex;
align-items: center;
margin-bottom: 15px;
/* gap: 10px; */
}
.form-label {
width: 120px;
text-align: right;
color: #333;
margin-right: 10px;
font-family: \5b8b\4f53, arial, georgia, verdana, helvetica, sans-serif !important;
}
.form-label .required {
color: red;
margin-right: 4px;
}
.form-input,
.form-select {
padding: 5px 8px 5px 10px;
border: 1px solid #d9d9d9;
width: 230px;
}
.select-down-icon {
height: 31px;
width: 32px;
display: flex;
align-items: center;
justify-content: center;
background-color: #f3f3f3;
border: 1px solid #d9d9d9;
border-left: none;
}
.down-arrow {
width: 0;
height: 0;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 8px solid #b0b0b0;
}
.form-select.hide {
appearance: none;
}
.form-input.small {
width: 111px;
}
.px-2 {
padding-left: 2px;
padding-right: 2px;
}
.form-input.x-small {
width: 84px;
}
.form-input.wide {
width: 234px;
}
.radio-group {
display: flex;
gap: 30px;
margin-left: 10px;
}
.radio-group label {
display: flex;
align-items: center;
font-family: \5b8b\4f53, arial, georgia, verdana, helvetica, sans-serif !important;
input {
margin-right: 5px;
}
}
.form-tip {
margin-left: 40px;
margin-right: 10px;
display: inline-block;
color: #0066b3;
cursor: pointer;
line-height: 24px;
vertical-align: middle;
padding-left: 22px;
background: url(./images/find.png) left no-repeat;
font-family: \5b8b\4f53, arial, georgia, verdana, helvetica, sans-serif !important;
}
/* .form-question {
position: relative;
cursor: pointer;
margin-left: 8px;
display: inline-block;
width: 16px;
height: 16px;
box-sizing: content-box;
line-height: 16px;
text-align: center;
border-radius: 50%;
background-color: #1f93d5;
color: #fff;
padding-left: 4px;
transition: all 0.2s;
} */
.form-question {
position: relative;
cursor: pointer;
margin-left: 8px;
display: inline-block;
width: 16px;
height: 16px;
line-height: 16px;
text-align: center;
border-radius: 50%;
background-color: #1f93d5;
color: #fff;
padding-left: 4px;
}
.question1 {
margin-left: 30px;
}
.question2 {
margin-left: 70px;
}
/* 气泡框 */
.bubble {
position: absolute;
bottom: calc(100% + 14px);
left: -25px;
width: 150px;
padding: 10px 5px;
text-align: left;
color: #000000;
border-radius: 4px;
border: 1px solid #62a7e3;
background-color: #eaf5fe;
visibility: hidden;
opacity: 0;
transition:
opacity 0.2s ease,
visibility 0.2s ease;
z-index: 100;
pointer-events: none;
}
/* 显示气泡 */
.form-question:hover .bubble {
visibility: visible;
opacity: 1;
}
.bubble::before {
content: "";
position: absolute;
bottom: -12px;
left: 23px;
border-width: 12px 4px 0 10px;
border-style: solid;
border-color: #62a7e3 transparent transparent transparent;
z-index: 1;
}
/* 背景三角（内层，盖住部分边框） */
.bubble::after {
content: "";
position: absolute;
bottom: -9px;
left: 24px;
border-width: 9px 4px 0 8px;
border-style: solid;
border-color: #eaf5fe transparent transparent transparent;
z-index: 2;
}
.question1 {
margin-left: 30px;
}
.question2 {
margin-left: 70px;
}
/* 按钮组 */
.btn-group {
display: flex;
gap: 20px;
margin: 30px 0;
padding-left: 200px;
}
.buttonx,
.btn-group button {
box-sizing: content-box;
height: 35px;
min-width: 60px;
padding-left: 20px;
padding-right: 20px;
text-align: center;
border: 0;
cursor: pointer;
color: #FFF;
margin-right: 15px;
font-weight: bold;
background-color: #1f93d5;
font-size: 1em;
vertical-align: middle;
border-radius: 5px;
display: flex;
align-items: center;
justify-content: center;
}
.buttonx {
/* position: absolute; */
}
.xx {
left: 120px;
bottom: 34px;
}
.yy {
left: 245px;
bottom: 34px;
}
.zz {
left: 370px;
bottom: 34px;
}
/* 温馨提示 */
.tips-section {
background-color: #f7fafd;
padding: 10px;
border: 1px solid #e8e8e8;
}
.tips-title {
color: red;
font-weight: bold;
margin-bottom: 10px;
}
.tips-section p {
line-height: 1.8;
color: #333;
font-family: \5b8b\4f53, arial, georgia, verdana, helvetica, sans-serif !important;
}
.mt-24 {
margin-top: 24px;
}
.mt-20 {
margin-top: 20px;
}
.date-picker {
width: 27px;
height: 27px;
position: relative;
}
.date-picker .date-input {
position: absolute;
top: 0;
left: 0;
width: 27px;
height: 27px;
opacity: 0;
z-index: 1;
}
.date-picker .dateimg {
width: 27px;
height: 27px;
}
#myForm {
position: relative;
}
</style>
</head>
<body>
<!-- 面包屑导航 -->
<div class="breadcrumb">
当前位置：账户查询 > <span class="breadcrumb_item">电子回单查询</span>
</div>
<div style="display: block;">
<div class="content">
您当前没有已更新的回单
</div>
<!-- <div style="height: 90px"></div> -->
<!-- 按钮组 -->
<div class="btn-group">
<button class="buttonx" type="button">
查看已更新回单
</button>
<button class="buttonx" onclick="onBack()" type="button">
返回
</button>
</div>
</div>
<!-- 温馨提示 -->
<!-- <div class="tips-section">
<div class="tips-title">温馨提示</div>
<p>电子回单可作为记账凭证，如您已通过银行柜台取得相应纸质回单，请注意核对，勿重复记账</p>
</div> -->
<script src="./calendar-plugin/calendar.js"></script>
</body>
</html>
<script>
function sendHeight() {
const pageHeight = Math.ceil(Math.max(
document.body.scrollHeight,
document.documentElement.scrollHeight
));
window.parent.postMessage({
type: 'STATUS_HEIGHT',
value: 220
}, '*');
}
window.addEventListener('load', sendHeight);
function onBack() {
window.history.back();
}
</script>
\ No newline at end of file
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