You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

491 lines
20 KiB
Plaintext

11 months ago
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>多表头</title>
<script type="text/javascript" src="../../Scripts/bootstrap/js/jquery.min.js"></script>
<script src="../../Scripts/QueryString.js" type="text/javascript"></script>
<link href="../../../DataUser/Style/ccbpm.css" rel="stylesheet" type="text/css" />
<!-- 引用通用的js文件. -->
<script type="text/javascript" src="../../Scripts/config.js"></script>
<script type="text/javascript" src="../../Comm/Gener.js"></script>
<script src="../../Admin.js"></script>
<script type="text/javascript" language="javascript">
//执行类型.
var doType = GetQueryString("DoType"); //执行类型.
var multiTitle = null; //表头
var multiTitle1 = null; //表头1
var mapAttrs = null;
var enEntity = null; //存储数据的实体。
var ensName = GetQueryString("EnsName");
//页面启动函数.
$(function () {
//获得配置信息.
var ensName = GetQueryString("EnsName");
//执行类型.
doType = GetQueryString("DoType");
if (doType == null) doType = "Search";
//根据不同的类型获取-全局配置.
if (doType == "Search") {
enEntity = new Entity("BP.Sys.EnCfg", ensName);
//生成属性集合.
mapAttrs = enEntity.DoMethodReturnJSON("GenerAttrs");
}
if (doType == "Dtl") {
enEntity = new Entity("BP.Sys.MapDtl", ensName);
//获得字段集合.
mapAttrs = new Entities("BP.Sys.MapAttrs")
mapAttrs.Retrieve("FK_MapData", ensName, "Idx");
}
if (doType == "Bill") {
enEntity = new Entity("BP.Sys.MapData", ensName);
//获得字段集合.
mapAttrs = new Entities("BP.Sys.MapAttrs")
mapAttrs.Retrieve("FK_MapData", ensName, "Idx");
}
//获得表头.
multiTitle = enEntity.GetPara("MultiTitle");
multiTitle1 = enEntity.GetPara("MultiTitle1");
//是否是三级表头
var isThrMulti = false;
if (multiTitle1 == null || multiTitle1 == undefined || multiTitle1 == "" && multiTitle1 == "undefined")
multiTitle1 = "";
if (multiTitle1 != "")
isThrMulti = true;
//是否是二级表头
var isSecMulti = false;
if (multiTitle == null || multiTitle == undefined || multiTitle == "" || multiTitle == "undefined")
multiTitle = "";
if (isThrMulti == false && multiTitle != "")
isSecMulti = true;
var _html = "<table style='width:90%;'>";
_html += "<caption><img style='margin-top:5px;'; src='../../Img/Event.png' />多表头</caption>";
//一级表头
if (isThrMulti == false && isSecMulti == false)
_html = showTable(mapAttrs);
//二级表头
if (isSecMulti == true)
_html = showSecTable(mapAttrs, multiTitle);
//三级表头
if (isThrMulti == true)
_html = showThrTable(mapAttrs, multiTitle, multiTitle1);
for (var idx = 0; idx < 3; idx++) {
_html += "<tr>";
for (var i = 0; i < mapAttrs.length; i++) {
var attr = mapAttrs[i];
if (attr.UIVisible == 0)
continue;
_html += "<td> &nbsp;&nbsp;</td>";
}
_html += "</tr>";
}
_html += "</table>";
$("#Table").html(_html);
});
/**
* 只有一级表头的解析
* @param mapAttrs
*/
function showTable(mapAttrs) {
var _html = "<tr>";
var idx1 = 0;
for (var idx = 0; idx < mapAttrs.length; idx++) {
var attr = mapAttrs[idx];
if (attr.UIVisible == 0)
continue;
idx1++;
_html += "<th><label><input name='oneclo' id='" + attr.KeyOfEn + "' value='" + idx1 + "' type='checkbox'/>" + attr.Name + "</label></th>";
}
_html += "</tr>";
return _html;
}
/**
* 二级表头的解析
* @param mapAttrs
* @param multiTitle
*/
function showSecTable(mapAttrs, multiTitle) {
var _html = "<tr>";
var _secHtml = "";
var currentGroup = "";
var idx1 = 0;
var idx = 0;
for (var i = 0; i < mapAttrs.length; i++) {
var attr = mapAttrs[i];
if (attr.UIVisible == 0)
continue;
idx++;
//判断该字段是否隶属于二级表头的分组
if (multiTitle.indexOf("," + attr.KeyOfEn + ",") == -1)
_html += "<th rowspan=2><label><input name='oneclo' id='" + attr.KeyOfEn + "' value='" + idx + "' type='checkbox'/>" + attr.Name + "</label></th>";
else {
var fields = getMutliFile(attr.KeyOfEn, multiTitle);
if (fields != "" && (currentGroup == "" || currentGroup != fields[0])) {
_html += "<th colspan=" + (fields.length - 1) + " style='text-align:center'><label><input name='twoclo' id='" + fields[0] + "' value='" + idx1 + "' type='checkbox'/>" + fields[0] + "</label>&nbsp;<button id='Btn_Delete' onclick=DeleteSpecTitle('" + fields[0] + "',0)> 删除</button></th>";
currentGroup = fields[0];
idx1++;
}
_secHtml += "<th>" + attr.Name + "</th>";
}
}
_html += "</tr>";
_html += "<tr>" + _secHtml + "</tr>";
return _html;
}
/**
* 三级表头的解析
* @param mapAttrs
* @param multiTitle
* @param multiTitle1
*/
function showThrTable(mapAttrs, multiTitle, multiTitle1) {
var _html = "<tr>";
var _secHtml = "";
var _thrHtml = "";
var curSecGroup = "";
var curThrGroup = "";
var idx1 = 0;
var thrcolspan = 0;
var isSecChange = false;
for (var idx = 0; idx < mapAttrs.length; idx++) {
var attr = mapAttrs[idx];
if (attr.UIVisible == 0)
continue;
idx1++;
//判断这个字段是隶属于那个什么
var keyIdx = 1;
if (multiTitle.indexOf("," + attr.KeyOfEn + ",") != -1)
keyIdx = 1;
else if (multiTitle1.indexOf("," + attr.KeyOfEn + ",") != -1)
keyIdx = 2;
else
keyIdx = 3;
if (keyIdx == 3) {
if (thrcolspan != 0) {
_html += "<th colspan=" + thrcolspan + " style='text-align:center'>" + curThrGroup + "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button id='Btn_Delete' onclick=DeleteSpecTitle('" + curThrGroup + "',1)> 删除</button></th>";
thrcolspan = 0;
curThrGroup = "";
}
_html += "<th rowspan=3><label><input name='oneclo' id='" + attr.KeyOfEn + "' value='" + idx1 + "' type='checkbox'/>" + attr.Name + "</label></th>";
continue;
}
//属于三级分组下面的字段
if (keyIdx == 2) {
var fields = getMutliFile(attr.KeyOfEn, multiTitle1);
if (fields != "" && (curThrGroup == "" || curThrGroup != fields[0])) {
if (curThrGroup != "" && curThrGroup != fields[0]) {
_html += "<th colspan=" + thrcolspan + " style='text-align:center'>" + curThrGroup + "&nbsp;<button id='Btn_Delete' onclick=DeleteSpecTitle('" + curThrGroup + "',1)> 删除</button></th>";
thrcolspan = 0;
}
thrcolspan += 1;
curThrGroup = fields[0];
} else {
thrcolspan += 1;
}
_secHtml += "<th rowspan=2>" + attr.Name + "</th>";
continue;
}
//属于二级分组下的字段
if (keyIdx == 1) {
//增加字段
_thrHtml += "<th><label>" + attr.Name + "</label></th>";
var secfields = getMutliFile(attr.KeyOfEn, multiTitle);
//判断是否在三级分组列表下
if (multiTitle1.indexOf("," + secfields[0] + ",") != -1) {
if (secfields != "" && (curSecGroup == "" || curSecGroup != secfields[0])) {
_secHtml += "<th rowspan=1 colspan=" + (secfields.length - 1) + " style='text-align:center' >" + secfields[0] + "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button id='Btn_Delete' onclick=DeleteSpecTitle('" + secfields[0] + "',0)> 删除</button></th>";
curSecGroup = secfields[0];
isSecChange = true;
idx1++;
} else {
isSecChange = false;
}
var thrfields = getMutliFile(secfields[0], multiTitle1);
if (thrfields != "" && (curThrGroup == "" || curThrGroup != thrfields[0])) {
thrcolspan += secfields.length - 1;
curThrGroup = thrfields[0];
if (curThrGroup != "" && curThrGroup != thrfields[0]) {
_html += "<th colspan=" + thrcolspan + " style='text-align:center'>" + thrfields[0] + "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button id='Btn_Delete' onclick=DeleteSpecTitle('" + thrfields[0] + "',1)> 删除</button></th>";
thrcolspan = 0;
}
} else {
if (isSecChange == true)
thrcolspan += parseInt(secfields.length - 1);
}
//一级标题占两行
} else {
if (thrcolspan != 0) {
_html += "<th colspan=" + thrcolspan + " style='text-align:center'>" + curThrGroup + "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button id='Btn_Delete' onclick=DeleteSpecTitle('" + curThrGroup + "',1)> 删除</button></th>";
thrcolspan = 0;
}
curThrGroup = "";
thrIdx = 0;
if (secfields != "" && (curSecGroup == "" || curSecGroup != secfields[0])) {
_html += "<th rowspan=2 colspan=" + (secfields.length - 1) + " style='text-align:center' ><input id='" + secfields[0] + "' value='" + secfields[0] + "' type='checkbox'/> " + secfields[0] + "&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp<button id='Btn_Delete' onclick=DeleteSpecTitle('" + secfields[0] + "',0)> 删除</button></th>";
curSecGroup = secfields[0];
idx1++;
}
}
}
}
_html += "</tr>";
_html += "<tr>" + _secHtml + "</tr>";
_html += "<tr>" + _thrHtml + "</tr>";
return _html;
}
function DeleteSpecTitle(title, multiType) {
if (window.confirm('您确定要删除【' + title + '】吗?') == false)
return;
//按照;分开.
var strs = [];
if (multiType == 0)
strs = multiTitle.split(';');
else
strs = multiTitle1.split(';');
var newTitle = ""; //创建新的strs.
for (var i = 0; i < strs.length; i++) {
var str = strs[i];
if (str.indexOf(title + ',') == 0)
continue;
newTitle += str + ";"; //重新组合newtitle.
}
newTitle = newTitle.substr(0, newTitle.length - 1);
if (multiType == 0)
enEntity.SetPara("MultiTitle", newTitle);
else
enEntity.SetPara("MultiTitle1", newTitle);
enEntity.Update();
Reload();
// window.Reload();
// SetHref( window.location;
}
function getMutliFile(keyOfEn, multi) {
var fields = multi.split(";");
for (var i = 0; i < fields.length; i++) {
var str = fields[i];
if (str == "")
continue;
if (str.indexOf("," + keyOfEn + ",") == -1)
continue;
var strs = str.substring(0, str.length - 1).split(",");
return strs;
}
return "";
}
function AddGroup() {
//检查设置的完整性.
//求出来选择的字段.
var filds = "";
var inputArray = $("input[name='oneclo']:checked"); //取到所有的input 并且放到一个数组中
for (var i = 0; i < inputArray.length; i++) {
var input = inputArray[i];
filds += input.id + ",";//获得选中的input的id拼接成字符串
}
// 1. 选择的数量小于等于1 是错误的.
var fls = filds.split(',');
if (fls.length - 1 <= 1) {
alert("所选的分组不可少于一列");
return;
}
// 2. 选择的没有按照连续选择,也是错误的.
for (var i = 0; i < inputArray.length; i++) {
//比较次数在inputArray.length之内
if (i + 1 < inputArray.length) {
//根据value的值判断是否是连续的列
if (parseInt(inputArray[i].value) + 1 != inputArray[i + 1].value) {
alert("所选的列不连续!");
return;
}
}
}
// 3. 选择的字段,在历史的选择中出现也是错误的.
if (multiTitle != undefined) {
for (var i = 0; i < fls.length; i++) {
if (multiTitle != "" && multiTitle.indexOf(","+fls[i]+",") > 0) {
alert("错误:该列已经选择过.");
return;
}
}
}
//获取分组名称;
var name = prompt("输入一级表头名称", "");
if (name == null)
return;
//检查名称是否重复
if (multiTitle != undefined && multiTitle.indexOf(name+",") > 0) {
alert("错误:名称已经存在.");
return;
}
//拼接目标数据.
multiTitle += name + "," + filds + ";";
//赋值
enEntity.SetPara("MultiTitle", multiTitle);
enEntity.Update();
Reload();
}
function AddGroup2() {
//检查设置的完整性.
//求出来选择的字段.
var filds = "";
var inputArray = $("input[type='checkbox']:checked"); //取到所有的input 并且放到一个数组中
for (var i = 0; i < inputArray.length; i++) {
var input = inputArray[i];
filds += input.id + ",";//获得选中的input的id拼接成字符串
}
// 1. 选择的数量小于等于1 是错误的.
var fls = filds.split(',');
if (fls.length - 1 <= 1) {
alert("所选的分组不可少于一列");
return;
}
// 2. 选择的没有按照连续选择,也是错误的.
var curIdx = 0;
for (var idx = 0; idx < mapAttrs.length; idx++) {
var attr = mapAttrs[idx];
if (attr.UIVisible == 0) {
if (curIdx != 0) curIdx++;
continue;
}
if (filds.indexOf(mapAttrs[idx].KeyOfEn + ",") != -1) {
if (curIdx != 0 && (curIdx + 1) != idx) {
alert("所选的列不连续!");
return;
}
curIdx = idx;
} else {
var secFile = getMutliFile(mapAttrs[idx].KeyOfEn, multiTitle)
if (secFile != "" && filds.indexOf(secFile[0] + ",") != -1) {
if (multiTitle.indexOf(mapAttrs[idx].KeyOfEn + ",") != -1) {
if (curIdx != 0 && (curIdx + 1) != idx) {
alert("所选的列不连续!");
return;
}
curIdx = idx;
}
}
}
}
// 3. 选择的字段,在历史的选择中出现也是错误的.
if (multiTitle1 != undefined) {
for (var i = 0; i < fls.length; i++) {
if (multiTitle1 != "" && multiTitle1.indexOf(","+fls[i]+",") > 0) {
alert("错误:该列已经选择过.");
return;
}
}
}
//获取分组名称;
var name = prompt("输入二级表头名称", "");
if (name == null)
return;
//检查名称是否重复
if (multiTitle1 != undefined && multiTitle1.indexOf(name+",") > 0) {
alert("错误:名称已经存在.");
return;
}
//拼接目标数据.
multiTitle1 += name + "," + filds + ";";
//赋值
enEntity.SetPara("MultiTitle1", multiTitle1);
enEntity.Update();
Reload();
}
/*
function Help() {
var url = "../Sys/Img/MuLtiTitLe.gif";
window.open(url);
}
*/
function ClearAll() {
enEntity.SetPara("MultiTitle", "");
enEntity.SetPara("MultiTitle1", "");
enEntity.Update();
Reload();
}
</script>
</head>
<body>
<h5>多表头设置</h5>
<table style="position:relative;width:100%;" id="Table">
</table>
<div style="right:30px; position:absolute; z-index:100; ">
</div>
<button id="Btn_Add" onclick="AddGroup()"> 增加一级表头</button>
<button id="Btn_Add" onclick="AddGroup2()"> 增加二级表头</button>
<button id="Btn_Clear" onclick="ClearAll()"> 清除全部设置</button>
<!--<button id="Btn_Help" onclick="Help()"> 动画演示</button>-->
<br />
<fieldset>
<legend>设置帮助 </legend>
<ul>
<li> 规则:多个列合并为一级表头,多个一级表头合并为二级表头,最高支持二级表头</li>
<li>
<fieldset>
<legend>示例</legend>
<img alt="" src="../Sys/Img/MuLtiTitLe1.png" onclick="WinOpen('../Sys/Img/MuLtiTitLe1.png')" style="width: 500px;" />
</fieldset>
</li>
<li> 我们没有解决不按照规则操作带来的错误。</li>
<li> 如果设置的格式混乱,请使用【清除全部设置】重新设置。</li>
</ul>
</fieldset>
</body>
</html>