Skip to content

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

fix:增加中间页

parent 92d124e1
Hide whitespace changes
Inline Side-by-side
Showing with 1710 additions and 0 deletions
index.html
View file @ ee36316a
This source diff could not be displayed because it is too large. You can view the blob instead.
middle.html 0 → 100644
View file @ ee36316a
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="https://cdn.jsdelivr.net/npm/xlsx-js-style/dist/xlsx.bundle.js"></script>
<script src="https://cdn.jsdelivr.net/npm/file-saver/dist/FileSaver.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jspdf@2.5.1/dist/jspdf.umd.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js"></script>
<title>账户信息查询 - 实时余额</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: \5b8b\4f53, arial, georgia, verdana, helvetica, sans-serif;
font-size: 14px;
}
body {
background-color: #ffffff;
padding: 0;
}
/* 顶部导航栏 */
.top-nav {
background-color: #ffffff;
border-bottom: 2px solid #1890ff;
display: flex;
align-items: center;
padding: 10px 20px;
gap: 40px;
}
.top-nav a {
color: #1890ff;
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;
}
/* 筛选与工具栏 */
.toolbar {
display: flex;
justify-content: space-between;
align-items: center;
height: 42px;
margin-top: 15px;
line-height: 42px;
padding-left: 10px;
padding-right: 11px;
}
.toolbar .left {
display: flex;
align-items: center;
gap: 5px;
margin-left: 15px;
}
.toolbar .right {
display: flex;
align-items: center;
}
.toolbar a {
color: #1890ff;
text-decoration: none;
display: flex;
align-items: center;
gap: 4px;
}
#rightTypes{
display: none;
width: 100%;
height: 42px;
margin-top: 15px;
line-height: 42px;
padding-right: 11px;
}
.right_box{
display: flex;
align-items: center;
justify-content: flex-end;
gap: 20px;
}
.icon5 {
padding-left: 16px;
background: url(https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/filter.png) left no-repeat;
}
.iBtn {
margin-right: 10px;
display: inline-block;
color: #0066b3;
cursor: pointer;
line-height: 24px;
vertical-align: middle;
}
a {
text-decoration: none;
outline: none;
}
.tableRBtn {
padding-left: 16px;
color: #1f93d5;
cursor: pointer;
}
.tableLBtn_box{
position: relative;
}
.tableLBtn_active{
padding: 10px 10px 10px 10px;
}
.tableLBtn_box:hover .tableLBtn_active{
position: relative;
border-left: 1px solid #d1d0d0;
border-top: 1px solid #d1d0d0;
border-right: 1px solid #d1d0d0;
background: #FFFFFF;
line-height: 14px;
z-index: 9999;
}
.tableLBtn_box:hover .downloadBox{
display: block;
}
.downloadBox{
display: none;
}
.downloadBox{
position: absolute;
top: 33px;
z-index: 999;
}
.downloadBox span {
display: block;
border-left: 1px solid #d1d0d0;
border-top: 1px solid #d1d0d0;
border-right: 1px solid #d1d0d0;
background: #FFFFFF;
padding: 10px 10px 0px 10px;
height: 24px;
}
.downloadBox span a {
float: none;
font-size: 1em;
padding-left: 16px;
margin-right: 0px;
background-color: #FFFFFF;
}
.underline {
text-decoration: underline;
}
.downloadBox .firstLi {
border-top: 1px solid #d9d9d9;
}
.downloadBox ul {
border: 1px solid #d9d9d9;
padding: 15px 10px 15px 10px;
background: #FFFFFF;
list-style: none;
}
.downloadBox ul li {
border-bottom: 1px solid #d9d9d9;
color: #0066bb;
line-height: 32px;
width: 94px;
cursor: pointer;
background: #FFFFFF;
}
.downloadBox ul li:hover {
font-weight: bold;
}
.download{
background: url(https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/tableDownload.png) no-repeat left center;
}
.print{
background: url(https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/tablePrint.png) no-repeat left center;
}
/* 筛选条件栏 */
.tableHide {
background: #F7FAFD;
width: 100%;
}
.tableHide tr td {
height: 42px;
padding-left: 10px;
}
.hideTitle {
width: 210px;
text-align: right;
padding-right: 5px;
}
.select {
height: 27px;
border: 1px solid #c5c5c5;
padding: 3px 2px 3px 2px;
vertical-align: middle;
font-size: 1em;
}
/* .select:focus {
border: 1px solid #62a7e3;
} */
/* 尝试覆盖系统高亮 */
.select:focus {
outline: none; /* 去掉聚焦时的蓝色外圈 */
border-color: #808080; /* 边框变灰 */
}
/* 针对 WebKit 浏览器的滚动条和选中项 */
.select::-webkit-scrollbar-thumb {
background-color: #808080;
}
.inTxt {
border: 1px solid #c5c5c5;
height: 27px;
line-height: 27px;
padding-left: 10px;
width: 220px;
vertical-align: middle;
font-size: 1em;
}
.slSty1 {
width: 232px;
}
/* 表格样式 */
.tableList {
background: #FFF;
text-align: center;
border: 1px solid #62a7e3;
width: 100%;
overflow: hidden;
}
table {
overflow: hidden;
border-collapse: collapse;
border-spacing: 0;
width: 100%;
margin: 0;
padding: 0;
}
th, td {
margin: 0;
padding: 0;
border: 0;
font-weight: normal;
text-align: left;
vertical-align: middle;
}
table th,
table td {
border: none !important; /* 使用 !important 确保覆盖原有的行内样式或高优先级样式 */
border-top: none;
border-bottom: none;
border-left: none;
border-right: none;
}
thead, tbody, tfoot, tr {
margin: 0;
padding: 0;
border: 0;
}
tr td .checkbox {
margin-left: 15px;
}
.tableList tr td {
overflow: hidden;
height: 35px;
padding: 0px 5px 0px 5px;
}
.tableList .tableListHead td {
background: #c8e0f5;
font-weight: bold;
text-align: center;
}
.table_center{
text-align: center;
}
th {
background-color: #e6f4ff;
color: #1890ff;
padding: 10px;
text-align: left;
border: 1px solid #e8e8e8;
font-weight: normal;
}
td {
padding: 10px;
border: 1px solid #e8e8e8;
}
.tableLink {
color: #1f93d5;
margin: 0 3px;
cursor: pointer;
}
.table-action-bar {
display: flex;
align-items: center;
justify-content: space-between;
height: 35px;
line-height: 35px;
background-color: #f6fbf4;
border: 1px solid #e8e8e8;
border-top: none;
border-bottom: none;
}
.table-action-bar a {
color: #1890ff;
text-decoration: none;
display: flex;
align-items: center;
gap: 4px;
}
.xj{
background-color: #f7fafd;
}
.tableListBody:hover {
background-color: #ebf4fb;
}
.lineLeft {
float: left;
margin-right: 20px;
color: #2C2C2C !important;
}
.lineRight{
float: right;
display: flex;
align-items: center;
}
/* 分页 */
.pagination {
display: flex;
justify-content: flex-end;
align-items: center;
gap: 10px;
padding: 0 10px 0 10px;
height: 35px;
line-height: 35px;
background-color: #f6fbf4;
border: 1px solid #e8e8e8;
border-top: none;
}
.pagination a {
color: #1890ff;
text-decoration: none;
}
.pagination input {
width: 30px;
text-align: center;
border: 1px solid #d9d9d9;
padding: 2px;
}
.curPageNum {
padding: 4px 4px;
border: 1px solid #DBDBDB;
margin-right: 8px;
line-height: normal;
}
/* 功能按钮组 */
.btn-group {
display: flex;
justify-content: center;
gap: 20px;
margin: 30px 0;
}
.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;
}
.btn-group button:hover {
background-color: #229EE6;
}
/* 温馨提示 */
.tips-section {
padding: 0 10px 10px 10px;
width: auto;
overflow: hidden;
border: 1px solid #f1f5f9;
background-color: #f7fafd;
margin-top: 50px;
}
.tips-title {
height: 42px;
color: #FF0000;
line-height: 42px;
font-weight: bold;
}
.tips-section p {
line-height: 24px;
}
.tips-section a {
font-weight: bolder;
color: #0066b3;
text-decoration: none;
}
#pdfArea {
position: absolute;
left: -9999px;
top: 0;
width: 1040px;
background: #fff;
}
.title {
padding: 30px 0 4px 0;
text-align: center;
font-weight: normal;
font-size: 14px;
}
.print-date {
float: right;
margin-right: 5px;
font-size: 14px;
}
.table_none {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
font-size: 14px;
/* ✅ 平分列宽 */
table-layout: fixed;
}
.ths, .tds {
color: #000 !important;
border: 1px solid #000 !important;
padding: 4px;
text-align: center;
font-weight: normal;
word-break: break-all;
}
.tds:nth-child(1), /* 账号 */
.tds:nth-child(5), /* 账面余额 */
.tds:nth-child(6), /* 可用余额 */
.tds:nth-child(11), /* 历史余额 */
.tds:nth-child(12) /* 时间 */
{
color: #000;
font-weight: 500 !important;
}
.ths {
background-color: #fff;
font-weight: normal;
}
</style>
</head>
<body>
<!-- 顶部导航栏 -->
<!-- <div class="top-nav">
<a href="#">账户信息查询 ∨</a>
<a href="#">批量账户查询</a>
<a href="#">电子回单查询</a>
<a href="#">集成资讯 ∨</a>
<a href="#">电子对账 ∨</a>
<a href="#">经营分析</a>
<a href="#">操作指南</a>
<a href="#">明细清单</a>
</div> -->
<!-- 面包屑导航 -->
<div class="breadcrumb" id="breadcrumb">
<!-- 当前位置：账户查询 > 账户信息查询 > <span class="breadcrumb_item">活期账户</span> -->
</div>
<table id="conditionTB" class="tableHide" cellpadding="0" cellspacing="0" border="0" width="100%" style="display: none;">
<tbody><tr>
<td class="hideTitle">账户查询：</td>
<td colspan="3">
<select class="select" size="1" name="conditionType" id="conditionType">
<option value="0">账户名称</option>
<option value="1">账号</option>
</select>
<input class="inTxt" name="conditionValue" type="text" size="20" maxlength="40" value="" style="width:135px">
</td>
</tr>
<tr>
<td class="hideTitle">币种：</td>
<td>
<select name="curType" id="curType" class="select slSty1" size="1">
<option value="">全部</option>
<option value="156">人民币元</option>
<option value="344">香港元</option>
<option value="446">澳门元</option>
<option value="901">新台币</option>
<option value="840">美元</option>
<option value="978">欧元</option>
<option value="826">英镑</option>
<option value="392">日元</option>
<option value="380">意大利里拉</option>
<option value="276">德国马克</option>
<option value="250">法国法郎</option>
<option value="000">多币种</option>
<option value="008">列克</option>
<option value="012">阿尔及利亚第纳尔</option>
<option value="020">安道尔比赛塔</option>
<option value="032">阿根廷比索</option>
<option value="036">澳大利亚元</option>
<option value="040">奥地利先令</option>
<option value="044">巴哈马元</option>
<option value="048">巴林第纳尔</option>
<option value="050">塔卡</option>
<option value="051">亚美尼亚达姆</option>
<option value="052">巴巴多斯元</option>
<option value="056">比利时法郎</option>
<option value="060">百慕大元</option>
<option value="064">努尔特鲁姆</option>
<option value="068">玻利瓦诺</option>
<option value="072">普拉</option>
<option value="084">伯利兹元</option>
<option value="090">所罗门群岛元</option>
<option value="096">文莱元</option>
<option value="104">缅元</option>
<option value="108">布隆迪法郎</option>
<option value="116">瑞尔</option>
<option value="124">加拿大元</option>
<option value="132">佛得角埃斯库多</option>
<option value="136">开曼群岛元</option>
<option value="144">斯里兰卡卢比</option>
<option value="152">智利比索</option>
<option value="170">哥伦比亚比索</option>
<option value="174">科摩罗法郎</option>
<option value="188">哥斯达黎加科郎</option>
<option value="191">克罗地亚库纳</option>
<option value="192">古巴比索</option>
<option value="196">塞浦路斯镑</option>
<option value="203">捷克克朗</option>
<option value="208">丹麦克朗</option>
<option value="214">多米尼加比索</option>
<option value="222">萨尔瓦多科郎</option>
<option value="230">埃塞俄比亚比尔</option>
<option value="232">纳克法</option>
<option value="233">克罗姆</option>
<option value="238">福克兰群岛镑</option>
<option value="242">斐济元</option>
<option value="246">芬兰马克</option>
<option value="262">吉布提法郎</option>
<option value="270">达拉西</option>
<option value="292">直布罗陀镑</option>
<option value="300">德拉克马</option>
<option value="320">格查尔</option>
<option value="324">几内亚法郎</option>
<option value="328">圭亚那元</option>
<option value="332">古德</option>
<option value="340">伦皮拉</option>
<option value="348">福林</option>
<option value="352">冰岛克朗</option>
<option value="356">印度卢比</option>
<option value="360">印度尼西亚卢比</option>
<option value="364">伊朗里亚尔</option>
<option value="368">伊拉克第纳尔</option>
<option value="372">爱尔兰镑</option>
<option value="376">新谢客尔</option>
<option value="388">牙买加元</option>
<option value="398">哈萨克斯坦坚戈</option>
<option value="400">约旦第纳尔</option>
<option value="404">肯尼亚先令</option>
<option value="408">北朝鲜圆</option>
<option value="410">韩元</option>
<option value="414">科威特第纳尔</option>
<option value="417">索姆</option>
<option value="418">基普</option>
<option value="422">黎巴嫩镑</option>
<option value="426">罗提</option>
<option value="428">拉脱维亚拉特</option>
<option value="430">利比里亚元</option>
<option value="434">利比亚第纳尔</option>
<option value="440">立陶宛</option>
<option value="442">卢森堡法郎</option>
<option value="454">克瓦查(马拉维)</option>
<option value="458">马来西亚林吉特</option>
<option value="462">卢菲亚</option>
<option value="470">马耳他里拉</option>
<option value="478">乌吉亚</option>
<option value="480">毛里求斯卢比</option>
<option value="484">墨西哥比索</option>
<option value="496">图格里克</option>
<option value="498">摩尔多瓦列伊</option>
<option value="504">摩洛哥迪拉姆</option>
<option value="512">阿曼里亚尔</option>
<option value="516">纳米比亚元</option>
<option value="524">尼泊尔卢比</option>
<option value="528">荷兰盾</option>
<option value="532">荷属安的列斯盾</option>
<option value="533">阿鲁巴盾</option>
<option value="548">瓦图</option>
<option value="554">新西兰元</option>
<option value="558">金科多巴</option>
<option value="566">奈拉</option>
<option value="578">挪威克朗</option>
<option value="586">巴基斯坦卢比</option>
<option value="590">巴波亚</option>
<option value="598">基那</option>
<option value="600">瓜拉尼</option>
<option value="604">索尔</option>
<option value="608">菲律宾比索</option>
<option value="620">葡萄牙埃斯库多</option>
<option value="624">几内亚比绍比索</option>
<option value="626">东帝汶埃斯库多</option>
<option value="634">卡塔尔里亚尔</option>
<option value="643">俄罗斯卢布</option>
<option value="646">卢旺达法郎</option>
<option value="654">圣赫勒拿镑</option>
<option value="678">多布拉</option>
<option value="682">沙特里亚尔</option>
<option value="690">塞舌尔卢比</option>
<option value="694">利昂</option>
<option value="702">新加坡元</option>
<option value="703">斯洛伐克克朗</option>
<option value="704">越南盾</option>
<option value="705">托拉尔</option>
<option value="706">索马里先令</option>
<option value="710">南非兰特</option>
<option value="724">西班牙比赛塔</option>
<option value="728">南苏丹磅</option>
<option value="748">里兰吉尼</option>
<option value="752">瑞典克朗</option>
<option value="756">瑞士法郎</option>
<option value="760">叙利亚镑</option>
<option value="764">泰国铢</option>
<option value="776">邦加</option>
<option value="780">特立尼达和多巴哥元</option>
<option value="784">UAE迪拉姆</option>
<option value="788">突尼斯第纳尔</option>
<option value="795">马纳特</option>
<option value="800">乌干达先令</option>
<option value="807">第纳尔</option>
<option value="818">埃及镑</option>
<option value="834">坦桑尼亚先令</option>
<option value="858">乌拉圭新比索</option>
<option value="860">乌兹别克斯坦苏姆</option>
<option value="882">塔拉</option>
<option value="886">也门里亚尔</option>
<option value="894">克瓦查(赞比亚)</option>
<option value="931">可兑换比索</option>
<option value="932">津巴布韦元</option>
<option value="933">白俄罗斯卢布</option>
<option value="934">土库曼斯坦马纳特</option>
<option value="936">塞地</option>
<option value="937">博利瓦</option>
<option value="938">苏丹磅</option>
<option value="940">乌拉圭比索</option>
<option value="941">塞尔维亚第纳尔</option>
<option value="943">麦梯卡尔</option>
<option value="944">新阿塞拜疆马纳特</option>
<option value="946">新列伊</option>
<option value="949">新土耳其里拉</option>
<option value="950">CFA法郎 BEAC</option>
<option value="951">东加勒比元</option>
<option value="952">CFA法郎BCEAO</option>
<option value="953">CFP法郎</option>
<option value="955">欧洲货币合成单位（EURCO)</option>
<option value="956">欧洲货币单位（E.M.U.-6)</option>
<option value="957">欧洲账户９单位（E.U.A.-9)</option>
<option value="958">欧洲账户１７单位（E.U.A.-17)</option>
<option value="959">黄金</option>
<option value="960">特别提款权</option>
<option value="961">银</option>
<option value="962">铂白金</option>
<option value="963">为测试特别保留的代码</option>
<option value="964">钯</option>
<option value="967">赞比亚克瓦查</option>
<option value="968">苏里南元</option>
<option value="969">马达加斯加阿里亚里</option>
<option value="970">哥伦比亚unidad de valor real</option>
<option value="971">阿富汗尼</option>
<option value="972">索莫尼</option>
<option value="973">宽扎</option>
<option value="974">白俄罗斯卢布</option>
<option value="975">保加利亚列弗</option>
<option value="976">刚果法郎</option>
<option value="977">可自由兑换标记</option>
<option value="979">墨西哥发展单位</option>
<option value="980">格里夫纳</option>
<option value="981">拉里</option>
<option value="984">Mvdol</option>
<option value="985">兹罗提</option>
<option value="986">巴西雷亚尔</option>
<option value="990">智利发展单位</option>
<option value="997">（次日）</option>
<option value="998">（同日）</option>
<option value="999">未包括的交易货币代码</option>
<option value="A01">本位币</option>
<option value="A02">清算瑞士法郎</option>
<option value="A03">原币</option>
<option value="A04">离岸人民币</option>
<option value="A05">百分之智利发展单位</option>
<option value="B01">布伦特原油品种一</option>
<option value="B02">布伦特原油品种二</option>
<option value="B03">布伦特原油品种三</option>
<option value="B04">布伦特原油品种四</option>
<option value="B05">布伦特原油品种五</option>
<option value="B06">布伦特原油品种六</option>
<option value="B07">布伦特原油品种七</option>
<option value="B08">布伦特原油品种八</option>
<option value="B09">布伦特原油品种九</option>
<option value="B10">布伦特原油品种十</option>
<option value="B11">布伦特原油品种十一</option>
<option value="B12">布伦特原油品种十二</option>
<option value="C01">铜期货品种一</option>
<option value="C02">铜期货品种二</option>
<option value="C03">铜期货品种三</option>
<option value="C04">铜期货品种四</option>
<option value="C05">铜期货品种五</option>
<option value="C06">铜期货品种六</option>
<option value="C07">铜期货品种七</option>
<option value="C08">铜期货品种八</option>
<option value="C09">铜期货品种九</option>
<option value="C10">铜期货品种十</option>
<option value="C11">铜期货品种十一</option>
<option value="C12">铜期货品种十二</option>
<option value="E01">外币折欧元</option>
<option value="Nil">UIC法郎</option>
<option value="R01">外币折人民币</option>
<option value="S01">大豆期货品种一</option>
<option value="S02">大豆期货品种二</option>
<option value="S03">大豆期货品种三</option>
<option value="S04">大豆期货品种四</option>
<option value="S05">大豆期货品种五</option>
<option value="S06">大豆期货品种六</option>
<option value="S07">大豆期货品种七</option>
<option value="S08">大豆期货品种八</option>
<option value="S09">大豆期货品种九</option>
<option value="S10">大豆期货品种十</option>
<option value="S11">大豆期货品种十一</option>
<option value="S12">大豆期货品种十二</option>
<option value="T01">本外币合计</option>
<option value="U01">外币折美元</option>
<option value="W01">WTI原油品种一</option>
<option value="W02">WTI原油品种二</option>
<option value="W03">WTI原油品种三</option>
<option value="W04">WTI原油品种四</option>
<option value="W05">WTI原油品种五</option>
<option value="W06">WTI原油品种六</option>
<option value="W07">WTI原油品种七</option>
<option value="W08">WTI原油品种八</option>
<option value="W09">WTI原油品种九</option>
<option value="W10">WTI原油品种十</option>
<option value="W11">WTI原油品种十一</option>
<option value="W12">WTI原油品种十二</option>
<option value="X01">黄金（人民币计价）</option>
<option value="X02">黄金（美元计价）</option>
<option value="X03">人民币黄金9995（AUA）</option>
<option value="X04">人民币黄金9999（AUB）</option>
<option value="X05">人民币银</option>
<option value="X06">人民币铂</option>
<option value="X07">中国市场钯金（克）</option>
<option value="X08">国际市场铑金（盎司）</option>
<option value="X09">中国市场铑金（克）</option>
<option value="929">乌吉亚</option>
</select>
</td>
<td class="hideTitle">签约类型：</td>
<td>
<select class="select slSty1" name="signType" id="signType" size="1">
<option value="2">全部</option>
<option value="0">签约账户</option>
<option value="1">授权账户</option>
</select>
</td>
</tr>
<tr>
<td class="hideTitle">账户分组：</td>
<td>
<select class="select slSty1" name="ACC_SORT" id="ACC_SORT" size="1">
<option value="">全部</option>
</select>
</td>
<td class="hideTitle">钞汇鉴别：</td>
<td>
<select class="select slSty1" name="CshExCd" id="CshExCd" size="1">
<option value="0">全部</option>
<option value="1">钞</option>
<option value="2">汇</option>
</select>
</td>
</tr>
<tr>
<td>&nbsp;</td>
<td colspan="3">
<a class="iBtn icon5" href="javascript:void(0);" onclick="searchOne(document.getElementById('filterCheckbox'));">过滤筛选</a>
</td>
</tr><tr>
</tr></tbody></table>
<div id="rightTypes">
<div class="right_box">
<div class="tableLBtn_box">
<div class="tableLBtn_active">
<a href="#" class="tableRBtn download">下载当前页</a>
</div>
<div class="downloadBox" style="left: 0;">
<ul>
<li onclick="submitSelect('0','1')" class="firstLi">Txt下载</li>
<li onclick="submitSelect('0','2')">Excel下载</li>
<li onclick="submitSelect('0','3')">Csv下载</li>
<li onclick="submitSelect('0','4')">PDF下载</li>
</ul>
</div>
</div>
<div class="tableLBtn_box">
<div class="tableLBtn_active">
<a href="#" class="tableRBtn download">下载全部</a>
</div>
<div class="downloadBox" style="left: 0;">
<ul>
<li onclick="submitSelect('0','1')" class="firstLi">Txt下载</li>
<li onclick="submitSelect('0','2')">Excel下载</li>
<li onclick="submitSelect('0','3')">Csv下载</li>
<li onclick="submitSelect('0','4')">PDF下载</li>
</ul>
</div>
</div>
<div class="tableLBtn_box">
<div class="tableLBtn_active">
<a href="#" class="tableRBtn print">打印</a>
</div>
<div class="downloadBox" style="right: 0; ">
<ul>
<li onclick="printPage('1')" class="firstLi">网页打印</li>
<li onclick="printPage('2')">PDF打印</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 账户列表表格 -->
<div style="overflow: hidden; width: 100%;">
<table class="tableList" cellpadding="0" cellspacing="0" border="0" width="100%" id="rsTable2" name="rsTable2">
<tbody>
<tr class="tableListHead">
<td nowrap=""><a id="td1" style="cursor: pointer;width: 164px;">账号<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td2" style="cursor: pointer;width: 137.94px;">账户名称<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td3" style="cursor: pointer;width: 80px;">币种<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td4" style="cursor: pointer;width: 108px;">行别<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td5" style="cursor: pointer;width: 79px;">账面余额<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td6" style="cursor: pointer;width: 79px;">冻结余额<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td7" style="cursor: pointer;width: 79px;">可用余额<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td8" style="cursor: pointer;width: 79px;">本日存入金额<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td9" style="cursor: pointer;width: 79px;">本日支取金额<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td10" style="cursor: pointer;width: 79px;">账户状态<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap=""><a id="td11" style="cursor: pointer;width: 79px;">账户控制状态<img class="sortImgClass" src="https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png" style="vertical-align:text-bottom;_vertical-align:middle;margin-left:3px;"></a></td>
<td nowrap="" style="width: 26.52px;"><a id="showOrHideTableBtn" onclick="setShowOrHideRsTable();parent.iFrameHeight();" class="tableLink">&gt;&gt;</a></td>
</tr>
<tr class="tableListBody">
<td nowrap=""></td>
</tr>
<tr class="tableListBody xj">
</tr>
<tr style="display:none" id="queryProcess" class=" tableListTr">
<td colspan="13" class="table_left">
<div id="queryProcessDiv">正在进行余额查询,请稍候<img src="/V6/STY3/CN/images6/NCCB_jd2.gif"></div>
</td>
</tr>
</tbody>
</table>
</div>
<!-- 表格下方的工具栏 -->
<div class="table-action-bar">
<div></div>
<!-- <a class="lineLeft"><div id="lable2" style="position: relative; left: 10px;"><input type="checkbox" id="all_1" onclick="selectAll(1);">全选</div></a> -->
<div class="lineRight">
<div class="tableLBtn_box">
<div class="tableLBtn_active">
<a href="#" class="tableRBtn download">下载全部</a>
</div>
<div class="downloadBox" style="left: 0;">
<ul>
<li class="firstLi">Txt下载</li>
<li>Excel下载</li>
<li>Csv下载</li>
<li>PDF下载</li>
</ul>
</div>
</div>
<div class="tableLBtn_box">
<div class="tableLBtn_active">
<a href="#" class="tableRBtn print">打印</a>
</div>
<div class="downloadBox" style="right: 0; ">
<ul>
<li class="firstLi">网页打印</li>
<li>PDF打印</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 功能按钮组 -->
<div class="btn-group">
<button onclick="onBack()">
返回
</button>
</div>
<div id="pdfArea">
<div class="title">活期账户列表信息</div>
<div class="table-header">
<div class="print-date" id="printDate"></div>
<table class="table_none">
<thead>
<tr>
<th class="ths">账号</th>
<th class="ths">账户名称</th>
<th class="ths">币种</th>
<th class="ths">行别</th>
<th class="ths">账面余额</th>
<th class="ths">冻结金额</th>
<th class="ths">可用余额</th>
<th class="ths">本日存入金额</th>
<th class="ths">本日支取金额</th>
<th class="ths">账户状态</th>
<th class="ths">账户控制状态</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tds">42050123704900001941</td>
<td class="tds">中科软盈(武汉)科技有限公司</td>
<td class="tds">人民币元</td>
<td class="tds">中国建设银行</td>
<td class="tds">773,541.62</td>
<td class="tds">0.00</td>
<td class="tds">773,541.62</td>
<td class="tds">0.00</td>
<td class="tds">1,801.00</td>
<td class="tds">正常</td>
<td class="tds">正常</td>
</tr>
<tr>
<td class="tds">小计</td>
<td class="tds"></td>
<td class="tds">人民币元</td>
<td class="tds"></td>
<td class="tds">773,541.62</td>
<td class="tds">0.00</td>
<td class="tds">773,541.62</td>
<td class="tds">0.00</td>
<td class="tds">1,801.00</td>
<td class="tds"></td>
<td class="tds"></td>
</tr>
</tbody>
</table>
</div>
</div>
</body>
</html>
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
<script>
// window.onload = function() {
// console.log("11111111")
// }
let menuName = localStorage.getItem("menuName");
console.log("menuName===========",menuName)
let list = menuName.join(",");
document.getElementById("breadcrumb").textContent =
`当前位置：$list[0] > $list[1] > <span class="breadcrumb_item">$list[2]</span>`;
function onBack(){
window.history.back();
}
function openFilter(element) {
var isChecked = element.checked;
var rightType = document.getElementById("rightType");
var rightTypes = document.getElementById("rightTypes");
var conditionTB = document.getElementById("conditionTB");
console.log("复选框当前状态:", isChecked);
if(isChecked) {
rightType.style.display = 'none';
rightTypes.style.display = 'inline-block';
conditionTB.style.display = 'inline-block';
}else{
rightType.style.display = 'inline-block';
rightTypes.style.display = 'none';
conditionTB.style.display = 'none';
}
}
function searchOne(checkboxElement) {
if (checkboxElement) {
checkboxElement.checked = false;
}
var rightType = document.getElementById("rightType");
var rightTypes = document.getElementById("rightTypes");
var conditionTB = document.getElementById("conditionTB");
rightType.style.display = 'inline-block';
rightTypes.style.display = 'none';
conditionTB.style.display = 'none';
}
// var showOrHideTableValue="1";
// function setShowOrHideRsTable(){
// var rsTable = document.getElementById("rsTable2");
// var tableRows = rsTable.rows;
// for(var i=0;i<tableRows.length-1;i++){
// var tableTr=tableRows[i].getElementsByTagName("td");
// if(tableTr.length == 0)tableTr=tableRows[i].getElementsByTagName("th");
// tableTr[0].style.width = "68px";
// var tableTd=tableTr[11];
// var tableTd2=tableTr[12];
// if(tableTd!=null){
// if(showOrHideTableValue=='1'){
// tableTd.style.display="";
// tableTd2.style.display="";
// }else{
// tableTd.style.display="none";
// tableTd2.style.display="none";
// }
// }
// }
// //修改全局变量并修改箭头
// if("1" == showOrHideTableValue){ //隐藏->显示
// showOrHideTableValue="0";
// document.getElementById("showOrHideTableBtn").innerHTML="&lt;&lt;";//<<
// } else if("0" == showOrHideTableValue){ //显示->隐藏
// showOrHideTableValue="1";
// document.getElementById("showOrHideTableBtn").innerHTML=" >>";
// }
// }
//点击某一行账户查询账户余额
function balanceQuery(strAccno) {
//checkedAccno = strAccno.split("@")[0];
checkedAccno = strAccno;
var balanceValue= document.getElementById('balance_'+strAccno).innerHTML;
if(balanceValue== '<FONT color=gray>点击查询</FONT>'||balanceValue== '<font color="gray">点击查询</font>'||balanceValue=='&nbsp;'){
// document.getElementById("queryProcess").style.display="";
// document.getElementById("queryProcessDiv").innerHTML='正在进行余额查询,请稍候<img src="/V6/STY3/CN/images6/NCCB_jd2.gif">';
document.getElementById('balance_'+checkedAccno).innerHTML='775342.62';
document.getElementById('bookBalance_'+checkedAccno).innerHTML='775342.62';
}
}
// 获取表头行元素
var headerRow = document.querySelector('.tableListHead');
var lastClickedTh = null;
// 点击表头进行切换
headerRow.addEventListener('click', function(event) {
var target = event.target;
while (target && target.nodeName !== 'A') {
target = target.parentNode;
}
if (!target || target.nodeName !== 'A') return;
var img = target.querySelector('.sortImgClass');
if (!img) return;
if (lastClickedTh && lastClickedTh !== target) {
var lastImg = lastClickedTh.querySelector('.sortImgClass');
if (lastImg) {
lastImg.src = "https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortNo.png";
}
}
var currentSrc = img.src;
if (currentSrc.includes('sortNo.png')) {
img.src = "https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortUp.png";
} else if (currentSrc.includes('sortUp.png')) {
img.src = "https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortDn.png";
} else if (currentSrc.includes('sortDn.png')) {
img.src = "https://xc.b2bstatic3.ccb.com/V6/STY6/CN/images7/sortUp.png";
}
lastClickedTh = target;
});
// 获取所有行 checkbox
function getRowCheckboxes() {
return document.querySelectorAll('.row-checkbox');
}
// 全选 / 取消全选
function selectAll(num) {
var isChecked;
if (num == 0) {
isChecked = document.getElementById('all_0').checked;
} else {
isChecked = document.getElementById('all_1').checked;
}
document.getElementById('all_0').checked = isChecked;
document.getElementById('all_1').checked = isChecked;
var checkboxes = getRowCheckboxes();
checkboxes.forEach(function(item) {
item.checked = isChecked;
});
}
// 反选
function invertSelection() {
var checkboxes = getRowCheckboxes();
checkboxes.forEach(function(item) {
item.checked = !item.checked;
});
updateSelectAllStatus();
}
// 单个点击时，联动“全选”
function updateSelectAllStatus() {
var checkboxes = getRowCheckboxes();
var allCheckbox = document.getElementById('all_0');
var allCheckboxs = document.getElementById('all_1');
var allChecked = true;
checkboxes.forEach(function(item) {
if (!item.checked) {
allChecked = false;
}
});
allCheckbox.checked = allChecked;
allCheckboxs.checked = allChecked;
}
// 给每个子 checkbox 绑定事件（页面加载后执行）
document.addEventListener('DOMContentLoaded', function() {
var checkboxes = getRowCheckboxes();
checkboxes.forEach(function(item) {
item.addEventListener('change', updateSelectAllStatus);
});
});
// 通用函数
function getTableData() {
var table = document.getElementById('rsTable2');
var rows = table.querySelectorAll('tr');
var data = [];
rows.forEach((tr, index) => {
if (tr.id === 'queryProcess') return;
var cells = tr.querySelectorAll('td');
if (index === 0) {
cells = tr.querySelectorAll('td');
}
var row = [];
cells.forEach((td, i) => {
row.push(td.innerText.trim());
});
data.push(row);
});
return data;
}
// 下载方法
function downloadFile(content, fileName, type) {
var blob = new Blob([content], { type: type });
var link = document.createElement('a');
link.href = URL.createObjectURL(blob);
link.download = fileName;
link.click();
URL.revokeObjectURL(link.href);
}
function submitSelect(scope, type) {
// scope: 0 当前页 / 1 全部（你可以扩展）
// type: 1 txt 2 excel 3 csv 4 pdf
var data = getTableData();
switch (type) {
case '1':
downloadTXT(data);
break;
case '2':
downloadExcel(data);
break;
case '3':
downloadCSV(data);
break;
case '4':
downloadPDF(data);
break;
}
}
function downloadTXT() {
var table = document.getElementById("rsTable2");
var rows = table.rows;
var result = [];
var colLength = [9, 9, 4, 5, 10, 10, 7, 5, 5, 12, 5, 7];
var colLengths = [28, 16, 3, 7, 1, 1, 3, 2, 2, 21, 11, 20];
function wrapHeader(str, len, index) {
str = (str || "").toString().trim();
if (index === 2) {
len += 2;
}
if (str.length > len) {
str = str.substring(0, len);
}
var space = " ".repeat(len - str.length);
return `"${str}"${space}`;
}
function wrapData(str, len, index) {
str = (str || "")
.toString()
.replace(/\u00A0/g, '')
.replace(/\s+/g, ' ')
.trim();
if (index === 2) {
len += 2;
}
if (str.length > len) {
str = str.substring(0, len);
}
var space = " ".repeat(len - str.length);
if (index === 0) {
return `"${space + str}"`;
}
return `"${str + space}"`;
}
var header = ["账号 ","账户名称 ","币种 ","行别 ","账面余额 ","冻结金额 ","可用余额 ","本日存入金额 ","本日支取金额 ","账户状态 ","账户控制状态","开户机构 ","透支金额 ","透支天数 ","普通业务冻结金额 ","存款司法冻结金额 ","在途业务冻结金额 "
];
var headerRow = header.map((item, i) => wrapHeader(item, colLength[i], i));
result.push(headerRow.join(','));
for (var i = 1; i < rows.length; i++) {
var cells = rows[i].cells;
if (!cells || cells.length < 11) continue;
var row = [];
row.push(cells[1].innerText);
row.push(cells[2].innerText);
row.push(cells[3].innerText);
row.push(cells[4].innerText);
var bookBalance = cells[5].innerText;
if (bookBalance.indexOf("点击查询") !== -1) bookBalance = "";
row.push(bookBalance);
var balance = cells[6].innerText;
if (balance.indexOf("点击查询") !== -1) balance = "";
row.push(balance);
row.push(cells[7].innerText);
row.push(cells[8].innerText);
row.push(cells[9].innerText);
row.push(cells[10].innerText);
var lastBalance = "";
if (cells[11]) {
lastBalance = cells[11].innerText
.replace(/FormatAmtRempty\(.+?\);?/g, '')
.trim();
}
row.push(lastBalance);
var lastTime = "";
if (cells[12]) {
lastTime = cells[12].innerHTML
.replace(/&nbsp;/gi, ' ')
.replace(/<br\s*\/?>/gi, ' ')
.replace(/\s+/g, ' ')
.trim();
lastTime = lastTime + " ";
}
row.push(lastTime);
var formatted = row.map((item, idx) => wrapData(item, colLengths[idx], idx));
result.push(formatted.join(','));
}
var content = result.join('\n');
downloadFile(content, '活期账户实时余额下载.txt', 'text/plain');
}
function downloadExcel(list) {
console.log(list,'list');
let arr = [
["中国建设银行"],
["账户实时余额查询结果下载"],
];
list[0].pop()
let data = [...arr,...list]
const ws = XLSX.utils.aoa_to_sheet(data);
ws["!merges"] = [
{ s: { r: 1, c: 0 }, e: { r: 1, c: 7 } }
];
const baseFont = {
name: "Arial",
sz: 10
};
ws["A1"].s = {
font: baseFont
};
ws["A2"].s = {
font: { ...baseFont, bold: true },
alignment: { horizontal: "center", vertical: "center" }
};
data[2].forEach((_, i) => {
const cell = XLSX.utils.encode_cell({ r: 2, c: i });
ws[cell].s = {
font: baseFont,
alignment: { horizontal: "center", vertical: "center" }
};
});
data[3].forEach((val, i) => {
const cellRef = XLSX.utils.encode_cell({ r: 3, c: i });
const isNumber = /^-?\d+(\.\d+)?$/.test(val);
ws[cellRef] = {
v: val,
t: "s", // ✅ 数字 or 字符串
s: {
font: baseFont,
alignment: { horizontal: "left", vertical: "center" }
}
};
});
data[4].forEach((val, i) => {
const cellRef = XLSX.utils.encode_cell({ r: 4, c: i });
const isNumber = /^-?\d+(\.\d+)?$/.test(val);
ws[cellRef] = {
v: val,
t: "s", // ✅ 数字 or 字符串
s: {
font: baseFont,
alignment: { horizontal: "left", vertical: "center" }
}
};
});
ws["!cols"] = [
{ wch: 24.29 }, { wch: 21.29 }, { wch: 12.29 }, { wch: 12.29 },
{ wch: 10.29 }, { wch: 10.29 }, { wch: 16.29 }, { wch: 15.29 },
{ wch: 16.29 }, { wch: 17.29 }, { wch: 18.29 }, { wch: 20.29 },
];
const wb = XLSX.utils.book_new();
XLSX.utils.book_append_sheet(wb, ws, "账户信息");
const wbout = XLSX.write(wb, {
bookType: "xlsx",
type: "array"
});
saveAs(new Blob([wbout]), "活期账户实时余额下载.xls");
}
function downloadCSV(data) {
var content = data.map(row => row.join(',')).join('\n');
downloadFile(content, '活期账户实时余额下载.csv', 'text/csv');
}
/* ✅ 打印日期 */
const now = new Date();
const year = now.getFullYear();
const month = now.getMonth() + 1; // ✅ 不补0
const day = now.getDate(); // ✅ 不补0
document.getElementById("printDate").innerText =
`打印日期：${year}年${month}月${day}日`;
/* ✅ PDF导出 */
async function downloadPDF() {
const { jsPDF } = window.jspdf;
const element = document.getElementById("pdfArea");
const canvas = await html2canvas(element, {
scale: 2,
useCORS: true
});
const imgData = canvas.toDataURL("image/png");
const pdf = new jsPDF({
orientation: "p",
unit: "mm",
format: [210, 297]
});
const pageWidth = 210;
const pageHeight = 297;
const margin = 5;
let imgWidth = pageWidth - margin * 2;
let imgHeight = canvas.height * imgWidth / canvas.width;
if (imgHeight > pageHeight - margin * 2) {
imgHeight = pageHeight - margin * 2;
imgWidth = canvas.width * imgHeight / canvas.height;
}
const x = (pageWidth - imgWidth) / 2;
const y = margin;
pdf.addImage(imgData, "PNG", x, y, imgWidth, imgHeight);
pdf.save("活期账户实时余额下载.pdf");
}
function printPage(type) {
var table = document.getElementById('rsTable2').outerHTML;
var now = new Date();
var timeStr = now.getFullYear() + '/' + (now.getMonth() + 1) + '/' + now.getDate()
+ ' ' + now.getHours() + ':' + now.getMinutes();
// 标题
var title = '账户信息查询 - 活期账户';
var win = window.open('', '_blank');
var html = `
<html>
<head>
<title>中国建设银行 企业网上银行</title>
<style>
body {
font-family: SimSun, Arial;
margin: 0;
}
.print-header {
display: flex;
justify-content: space-between;
font-size: 14px;
}
.print-title {
text-align: center;
font-size: 18px;
font-weight: bold;
}
table {
width: 100%;
border-collapse: collapse;
font-size: 12px;
border: 1px solid #62a7e3;
}
td {
padding: 6px;
text-align: center;
}
td:first-child {
display: none;
}
</style>
</head>
<body>
${table}
</body>
</html>
`;
win.document.write(html);
win.document.close();
// 等渲染完成再打印
win.onload = function () {
win.print();
win.close();
};
}
</script>
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