You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
135 lines
5.5 KiB
135 lines
5.5 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<!-- 通用 -->
|
|
{include file="common/head" /}
|
|
<!-- 当前 -->
|
|
<link rel="stylesheet" href="__TMPL__/static/css/rule.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- header start -->
|
|
{include file="common/header" /}
|
|
<!-- header end -->
|
|
<!-- banner start -->
|
|
<div class="bannerList">
|
|
<div class="img"><img src="__TMPL__/static/images/trade/tradeBanner.jpg" alt=""></div>
|
|
<div class="w1280">
|
|
<div class="bannerTitle">交易服务</div>
|
|
</div>
|
|
</div>
|
|
<!-- banner end -->
|
|
<div class="pageListNav">
|
|
<div class="w1280">
|
|
{hcTaglib:subcategory pid="9" item="vo" field="id,title" sort="sort asc"}
|
|
<a href="{:hcUrl('list/index',['id'=>$vo.id])}" class="{$current_cate['id']==$vo.id?'on':''}">{$vo.title}</a>
|
|
{/hcTaglib:subcategory}
|
|
</div>
|
|
</div>
|
|
<div class="commissionBlock">
|
|
<div class="w1280 table-content">
|
|
<div class="tradeTit">
|
|
<p>{$current_cate['title']}</p>
|
|
<div class="tradeSearch">
|
|
<input type="text" placeholder="请输入品种名称/交易代码/合约代码">
|
|
<div class="searchBtn">搜索</div>
|
|
</div>
|
|
</div>
|
|
<table lay-filter="tableFilter" class="layui-table" id="rulesTable">
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- footer start-->
|
|
{include file="common/footer"}
|
|
<!-- footer end -->
|
|
<!-- 通用 -->
|
|
{include file="common/foot"}
|
|
<!-- 当前 -->
|
|
<script src="__TMPL__/static/js/layui.js"></script>
|
|
<script>
|
|
var table = layui.table;
|
|
var tableIns = table.render({
|
|
elem: '#rulesTable'
|
|
, url: '/content/list'
|
|
, where: { category_id: 21, limit: 500, all: 1, sort: 'id asc' }
|
|
, method: 'get'
|
|
, cols: [
|
|
[
|
|
{ field: 'category_title', title: '交易所', width: 100, rowspan: "3" }
|
|
, { field: 'title', title: '品种', width: 150, rowspan: "3" }
|
|
, { field: 'sub_title', title: '代码', width: 70, rowspan: "3" }
|
|
, { field: 'description', title: '合约单位(吨/手)', width: 150, rowspan: "3" }
|
|
, { field: 'min_change', title: '最小变动价位(元/吨)', width: 180, rowspan: "3" }
|
|
, { field: 'chg', title: '保证金/涨跌限制(连续三板)', colspan: "6" }
|
|
, { field: 'unit', title: '交割单位/交割越限仓(手)', width: 180, rowspan: "3" }
|
|
, { field: 'limit_price', title: '限价/市价单笔最大下单(手)', width: 240, rowspan: "3" }
|
|
, { field: 'last_date', title: '最后交易日', width: 280, rowspan: "3" }],
|
|
[
|
|
{ field: 'normal', title: '正常', colspan: "2" }
|
|
, { field: 'first', title: '第一板结算起', colspan: "2" }
|
|
, { field: 'second', title: '第二板结算起', colspan: "2" }
|
|
],
|
|
[
|
|
{ field: 'chg', title: '涨跌幅', width: 100, }
|
|
, { field: 'margin', title: '保证金(交易所+公司上浮)', width: 220, }
|
|
, { field: 'first_chg', title: '涨跌幅', width: 100, }
|
|
, { field: 'first_margin', title: '保证金', width: 100, }
|
|
, { field: 'second_chg', title: '涨跌幅', width: 100, }
|
|
, { field: 'second_margin', title: '保证金', width: 100, }
|
|
]
|
|
]
|
|
, done: function (res) {
|
|
setTimeout(() => {
|
|
merge(res)
|
|
}, 200);
|
|
}
|
|
})
|
|
//实现行合并
|
|
function merge(res) {
|
|
var data = res.data;
|
|
var mergeIndex = 0;//定位需要添加合并属性的行数
|
|
var mark = 1; //这里涉及到简单的运算，mark是计算每次需要合并的格子数
|
|
var columsName = ['category_title','limit_price','last_date'];//需要合并的列名称
|
|
var columsIndex = [0,12,13];//需要合并的列索引值
|
|
|
|
for (var k = 0; k < columsName.length; k++) { //这里循环所有要合并的列
|
|
var trArr = $(".layui-table-body>.layui-table").find("tr");//所有行
|
|
for (var i = 1; i < res.data.length; i++) { //这里循环表格当前的数据
|
|
var tdCurArr = trArr.eq(i).find("td").eq(columsIndex[k]);//获取当前行的当前列
|
|
var tdPreArr = trArr.eq(mergeIndex).find("td").eq(columsIndex[k]);//获取相同列的第一列
|
|
if (data[i][columsName[k]] === data[i - 1][columsName[k]]) {
|
|
//后一行的值与前一行的值做比较，相同就需要合并
|
|
mark += 1;
|
|
tdPreArr.each(function () {
|
|
//相同列的第一列增加rowspan属性
|
|
$(this).attr("rowspan", mark);
|
|
});
|
|
tdCurArr.each(function () {
|
|
//当前行隐藏
|
|
$(this).css("display", "none");
|
|
});
|
|
} else {
|
|
mergeIndex = i;
|
|
mark = 1; //一旦前后两行的值不一样了，那么需要合并的格子数mark就需要重新计算
|
|
}
|
|
}
|
|
mergeIndex = 0;
|
|
mark = 1;
|
|
}
|
|
}
|
|
// 页内搜索
|
|
$('.tradeSearch .searchBtn').click(function () {
|
|
let searchInput = $('.tradeSearch input').val()
|
|
tableIns.reload({
|
|
where: { category_id: 21, limit: 500, all: 1, sort: 'id asc', title: searchInput }
|
|
})
|
|
})
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|