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.

658 lines
28 KiB
Plaintext

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>正在加载请稍候...</title>
<link href="../Comm/fonts/font-icons.min.css" rel="stylesheet" />
<script src="../Scripts/jquery-1.11.0.min.js" type="text/javascript"></script>
<!--表单样式-->
<link href="../Admin/CSS/FoolFrmBody.css" rel="stylesheet" />
<!-- layui -->
<link href="../Scripts/layui/layui/css/layui.css" rel="stylesheet" />
<link href="../Scripts/layui/style/admin.css" rel="stylesheet" />
<link href="../Scripts/layui/layui/css/autocomplete.css" rel="stylesheet" />
<script src="../Scripts/layui/layui/layui.js" type="text/javascript"></script>
<script src="../Scripts/layui/LayuiDialog.js" type="text/javascript"></script>
<!--通用的JS-->
<script src="JS/jquery.mousewheel.min.js"></script>
<script src="../Scripts/config.js" type="text/javascript"></script>
<script src="../Comm/Gener.js" type="text/javascript"></script>
<script src="../Scripts/QueryString.js" type="text/javascript"></script>
<script src="./JS/tinymce/tinymce.min.js"></script>
<script src="ChapterFrmGener.js"></script>
<script src="./JS/jspdf.min.js"></script>
<script src="./JS/html2canvas.min.js"></script>
<script src="JS/FrmDBRemark.js" type="text/javascript"></script>
<script src="../../WF/CCForm/FrmEnd.js"></script>
<script src="../Comm/JScript.js"></script>
<script src="../../WF/Portal/layui/layui.js" type="text/javascript"></script>
<script src="FrmFool.js" type="text/javascript">></script>
<script language="javascript" type="text/javascript">
layui.use(['tree', 'dropdown', 'form', 'jquery'], function () {
var tree = layui.tree, $ = layui.jquery, dropdown = layui.dropdown;
var frmID = null;
var oid = null;
var name = null;
var apArr = [];
var group = [];
var ptype = null;
var form = layui.form;
var hideGroup;//存储隐藏的章节
var hideAttrs;//存储隐藏的字段
var groupFields = [];//章节分组.
var attrs = [];//字段.
var data = [];//表单所有信息ChapterFrm_Init获取
//页面启动函数.
$(function () {
frmID = GetQueryString("FrmID");
oid = GetQueryString("WorkID");
if (oid == null)
oid = GetQueryString("OID");
var handler = new HttpHandler("BP.WF.HttpHandler.WF_CCForm");
handler.AddPara("FrmID", frmID);
handler.AddPara("OID", oid);
data = handler.DoMethodReturnJSON("ChapterFrm_Init");
console.log(data);
groupFields = data["GroupFields"];//章节分组.
attrs = data["Sys_MapAttr"];//字段.
//获取显示状态信息
var en = new Entity(frmID, oid);
console.log("获取的表单设置信息:", en);
//存储显示状态
hideGroup = en.GetPara("HideGroup") || "";
if (hideGroup == "")
hideGroup = [];
else hideGroup = hideGroup.split(',');
hideAttrs = en.GetPara("HideAttrs") || "";
if (hideAttrs == "")
hideAttrs = [];
else hideAttrs = hideAttrs.split(',');
console.log("显示状态", hideGroup, hideAttrs);
//形成树形数据
groupFields.forEach((item) => {
if (item.ParentOID === "" || item.ParentOID == null) {
var child = {
id: item.OID.toString(),
title: item.Lab,
children: [],
...item,
};
if (hideGroup.indexOf(child.id) == -1) {//看设置是否隐藏
if (item.CtrlType === "Attr") {//Attr控件将其下的字段值放在attrChildren 中方便解析
child.attrChildren = getAttrChildren(item.OID.toString(), item.CtrlType);
} else {
child.children = [...getChildren(item.OID.toString()), ...getAttrChildren(item.OID.toString(), item.CtrlType)];
};
group.push(child);
};
}
});
console.log("树形数组", group);
var html = "";
html += setTree(group, 1);
$("#CCForm").html(html);//插入表单html
//渲染layui表单样式
form.render();
form.render('checkbox');
//占一行的元素标签靠左
var hang = $(".layui-col-sm12.layui-col-md12.layui-col-xm12.FoolFrmFieldLabel>.layui-form-label");
$.each(hang, function (index, item){
$(item).attr("style", "text-align:left");
})
//iframe高度自适应
var thisForm = $('#CCForm');
var iframes = $(thisForm).find("iframe");
for (var j = 0; j < iframes.length; j++) {
$(iframes[j]).load(function () {
var mainheight = $(this).contents().find("body").height();
$(this).height(mainheight);
});
}
loadData(group, 1);
return;
//解析Attr类型分组
function IniAttr(group) {
var handler = new HttpHandler("BP.WF.HttpHandler.WF_CCForm");
handler.AddPara("FK_MapData", frmID);
handler.AddPara("OID", GetQueryString("WorkID"));
var result = handler.DoMethodReturnString("ChapterFrm_AttrInit");
if (result.indexOf('err@') == -1) {
data.MainTable[0] = JSON.parse(result);
}
var attrhtm = "";
var thisAttrData = {//改造数据主要是Sys_MapAttr的字段显示与隐藏
...data,
Sys_MapAttr: Array.isArray(group.attrChildren) && group.attrChildren.length > 0 ? group.attrChildren : group.children,
}
attrhtm += '<div id="Group_' + group.OID + '">';
var tableCol = data.Sys_MapData[0].TableCol === 0 ? 4 : 6;
attrhtm += InitMapAttr(thisAttrData, tableCol, group.OID);
attrhtm += '</div>';
return attrhtm;
}
function LoadFrmData(group) {
var thisAttrData = {//改造数据主要是Sys_MapAttr的字段显示与隐藏
...data,
Sys_MapAttr: Array.isArray(group.attrChildren) && group.attrChildren.length > 0 ? group.attrChildren : group.children,
}
//装载表单数据与修改表单元素风格.
LoadFrmDataAndChangeEleStyle(thisAttrData, group.attrChildren);
//渲染表单
form.render();
form.render('checkbox');
//解析表单的扩展功能
AfterBindEn_DealMapExt(thisAttrData);
$.each($(".ccdate"), function (i, item) {
var format = $(item).attr("data-info");
var type = $(item).attr("data-type");
if (format.indexOf("HH") != -1) {
layui.laydate.render({
elem: '#' + item.id,
format: $(item).attr("data-info"), //可任意组合
type: type,
trigger: 'click',
ready: function (date) {
var now = new Date();
var mm = "";
if (now.getMinutes() < 10)
mm = "0" + now.getMinutes();
else
mm = now.getMinutes();
var ss = "";
if (now.getSeconds() < 10)
ss = "0" + now.getSeconds();
else
ss = now.getSeconds();
this.dateTime.hours = now.getHours();
this.dateTime.minutes = mm;
this.dateTime.seconds = ss;
},
change: function (value, date, endDate) {
$('.laydate-btns-confirm').click();
},
done: function (value, date, endDate) {
var data = $(this.elem).data();
$(this.elem).val(value);
if (data && data.ReqDay != null && data.ReqDay != undefined)
ReqDays(data.ReqDay);
}
});
} else {
layui.laydate.render({
elem: '#' + item.id,
format: $(item).attr("data-info"), //可任意组合
type: type,
done: function (value, date, endDate) {
var data = $(this.elem).data();
$(this.elem).val(value);
if (data && data.ReqDay != null && data.ReqDay != undefined)
ReqDays(data.ReqDay);
}
});
}
})
}
//遍历树形数组
function setTree(list, level) {
var htm = "";
for (var i = 0; i < list.length; i++) {
if (list[i].Lab != undefined) {//当前节点是一个目录
htm += findTitleLevel(level, list[i].title)
if (Array.isArray(list[i].children) && list[i].children.length > 0) {
var type = setTree(list[i].children, level + 1);
if (type == "MapAttr") {
list[i].children.forEach((attr) => {
var cdata = data['MainTable'][0][attr.KeyOfEn];
htm += '<div class="layui-form-item layui-form-text">';
htm += '<label class="layui-form-label" style="margin-left: 32px;text-align:left">' + attr.Name + '</label>';
htm += '<div class="layui-input-block" style="margin-left: 32px;">';
htm += `<div name="TB_${attr.KeyOfEn}" id="TB_${attr.KeyOfEn}" class="div-textarea" >${cdata}</div>`;
htm += '</div> </div>';
})
} else {//否则就是一个html字符串
htm += type;
}
} else if (list[i].CtrlType == "Attr" && Array.isArray(list[i].attrChildren) && list[i].attrChildren.length > 0) {
htm += '<div class="layui-fluid fluid">';
htm += '<div class="layui-row layui-col-space15" id="ContentDiv_' + list[i].OID + '">';
htm += '<div class="layui-col-md12">';
htm += '<div class="layui-card">';
htm += '<div class="layui-card-body">';
htm += '<form id="divCCForm_' + list[i].OID + '" class="layui-form">';
htm += IniAttr(list[i]);
htm += '</form>';
htm += '</div></div ></div ></div ></div >';
} else if (list[i].CtrlType == "Dtl") {
var url = Ele_Dtl_Chapter(list[i].CtrlID, 1);
htm += '<div class="layui-form">';
htm += '<iframe id="' + list[i].OID + '" src="' + url + '" frameborder="0" style="width: 100%;height:auto; overflow-y: scroll;" ></iframe>';
htm += '</div>';
} else if (list[i].CtrlType == "Ath") {
var url = basePath + "/WF/CCForm/Ath.htm?1=1&AthPK=" + list[i].CtrlID + "&OID=" + oid + "&FK_MapData=" + frmID + "&FK_Node=" + GetQueryString("FK_Node") + "&IsReadonly=1";
htm += '<div class="layui-form">';
htm += '<iframe id="' + list[i].OID + '" src="' + url + '" frameborder="0" style="width: 100%;height:auto;" scrolling="no" ></iframe>';
htm += '</div>';
} else if (list[i].CtrlType == "ChapterFrmLinkFrm") {
var url = basePath + "/WF/CCForm/Frm.htm?IsReadonly=1&FrmID=" + list[i].CtrlID + "&OID=" + oid + "&FK_MapData=" + list[i].CtrlID + "&FK_Node=" + GetQueryString("FK_Node");
htm += '<div class="layui-form">';
htm += '<iframe id="' + list[i].OID + '" src="' + url + '" frameborder="0" style="width: 100%;" scrolling="no"></iframe>';
htm += '</div>';
} else if (list[i].CtrlType == "ChapterFrmSelfUrl") {
var url = '';
if (list[i].CtrlID.indexOf('http') == 0)
if (list[i].CtrlID.indexOf('?') > -1) {
url = list[i].CtrlID + "&OID=" + oid + "&FK_MapData=" + frmID + "&FK_Node=" + GetQueryString("FK_Node");
} else {
url = list[i].CtrlID + "?" + "OID=" + oid + "&FK_MapData=" + frmID + "&FK_Node=" + GetQueryString("FK_Node");
}
else {
if (list[i].CtrlID.indexOf('?') > -1) {
url = basePath + "/" + list[i].CtrlID + "&OID=" + oid + "&FK_MapData=" + frmID + "&FK_Node=" + GetQueryString("FK_Node");
} else {
url = basePath + "/" + list[i].CtrlID + "?" + "OID=" + oid + "&FK_MapData=" + frmID + "&FK_Node=" + GetQueryString("FK_Node");
}
}
htm += '<div class="layui-form">';
htm += '<iframe id="' + list[i].OID + '" src="' + url + '" frameborder="0" style="width: 100%;" scrolling="no" ></iframe>';
htm += '</div>';
}
} else {//当前列表的节点没有CtrlType字段 说明是一个mapAttr的集合
console.log(list[i].Lab);
return "MapAttr";
}
}
return htm;
};
//遍历树形数组给AttrF分组赋值
function loadData(list, level) {
for (var i = 0; i < list.length; i++) {
if (list[i].Lab != undefined) {//当前节点是一个目录
if (Array.isArray(list[i].children) && list[i].children.length > 0) {
loadData(list[i].children, level + 1);
} else if (list[i].CtrlType == "Attr" && Array.isArray(list[i].attrChildren) && list[i].attrChildren.length > 0) {
LoadFrmData(list[i]);
}
}
}
};
});
//第几级标题
function findTitleLevel(level, name) {
var indent = 10*(level-1);
switch (level) {
case 1:
return "<h1 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h1>";
case 2:
return "<h2 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h2>";
case 3:
return "<h3 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h3>";
case 4:
return "<h4 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h4>";
case 5:
return "<h5 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h5>";
case 6:
return "<h6 style='margin:10px; margin-left:" + indent + "px'>" + name + "</h6>";
};
};
//递归构造章节树形结构获取parentId的孩子
function getChildren(parentId) {
var children = [];
groupFields.forEach((item) => {
if (item.ParentOID === parentId) {
var child = {
id: item.OID.toString(),
title: item.Lab,
children: [],
attrChildren: [],
...item,
};
if (hideGroup.indexOf(child.id) == -1) {//看设置是否显示
if (item.CtrlType === "Attr") {
child.attrChildren = getAttrChildren(item.OID.toString(), item.CtrlType);
} else {
child.children = [...getChildren(item.OID.toString()), ...getAttrChildren(item.OID.toString(), item.CtrlType)];
};
children.push(child);
};
}
});
return children;
}
//获取本章节下的attr字段groupId下的字段
function getAttrChildren(groupId, ctrlType) {
var attrList = [];
//非Attr型控件非默认控件不显示其下字段
if (ctrlType != "Attr" && ctrlType != "" && ctrlType != null)
return [];
for (var i = 0; i < attrs.length; i++) {
var attr = attrs[i];
if (attr.MyDataType != 1 && ctrlType == "")
continue;
if (attr.GroupID === groupId && attr.UIVisible === 1) {//只显示可见的字段
var attr = {
id: attr.KeyOfEn,
title: attr.Name,
...attr,
};
if (attr.UIContralType == 1) {//如果是下拉框,存储下拉列表值
if (attr.MyDataType == 2)//枚举下拉
attr.DDLlist = $.grep(data['Sys_Enum'], function (item, index) {
return item.EnumKey == attr.KeyOfEn;
});
else if (attr.MyDataType == 1)//下拉单选
attr.DDLlist = data[attr.KeyOfEn];
}
else if (attr.UIContralType == 3 && attr.MyDataType == 2) {//枚举单选 radio
attr.DDLlist = $.grep(data['Sys_Enum'], function (item, index) {
return item.EnumKey == attr.KeyOfEn;
});
}
if (hideAttrs.indexOf(attr.KeyOfEn) == -1) {//看是否设置显示
if ((ctrlType === "" || ctrlType == null) && attr.TextModel != 1) {//默认型控件,只显示文本字段
if (attr.MyDataType == 1 && attr.UIContralType == 0) {
attrList.push(attr);
};
} else if (ctrlType === "Attr") {//Attr控件所有类型的字段都显示
attrList.push(attr);
};
};
};
};
return attrList;
}
function showType(group, Tree_set) {
let n = 0;
group.forEach((item, index) => {
if (item.ShowType == 2) {
n = n + 1;
const Id = item.OID;
console.log($(`#Pnode${Id}`))
$(`#Pnode${Id}`).hide()
}
})
if (n == group.length) {
$("#menuShow").hide()
}
}
function ChapterFrmShow(attrKey) {
InitPara();
if (attrKey == null || attrKey == "") {
alert("字段值为空.");
return;
}
var handler = new HttpHandler("BP.WF.HttpHandler.WF_CCForm");
handler.AddPara("FrmID", frmID);
handler.AddPara("OID", oid);
handler.AddPara("KeyOfEn", attrKey);
var data = handler.DoMethodReturnString("ChapterFrm_InitOneField");
AddNoDuplicateElements(attrKey, data);
}
//添加title名
function addtitle(key) {
group.forEach((item, index) => {
if (item.children.length > 0) {
item.children.forEach(ite => {
if (ite.id == key) {
name = ite.Name;
$("#Title").html(name)
}
})
}
});
}
//append html
function AddNoDuplicateElements(ele, data) {
if (ptype != 'print') {
var aphtml = `<div class="itemlist" id="ele_${ele}"><div id="title_${ele}"></div><div><h4 id="n_${ele}"></h4><p>${data}</p></div></div>`
var arr = []
arr.push(ele)
for (var i = 0; i < arr.length; i++) {
if (apArr.indexOf(arr[i]) === -1) {
apArr.push(arr[i]);
$("#docs").append(aphtml);
}
}
$("#docs .itemlist").hide();
$("#ele_" + ele).show();
addtitle(ele)
} else {
var aphtml = `<div class="itemlist"><div id="tit_${ele}"></div><div><h4 id="nt_${ele}"></h4><p>${data}</p></div></div>`
$("#print").append(aphtml);
addtitle(ele)
}
}
})
</script>
<style type="text/css">
.div-textarea {
border-width: 1px;
border-style: solid;
background-color: #fff;
border-radius: 2px;
border-color: #eee;
box-sizing: border-box;
min-height:100px;
padding:10px;
}
.border_1 {
border: 1px solid #ccc;
height: 96vh;
}
.padding-5 {
padding: 10px;
}
.layui-right {
width: 120px;
height: 100%;
text-align: center;
position: absolute;
right: 10px;
top: 0;
}
.layui-right a {
display: block;
height: 100%;
width: 100%;
}
.layui-left {
width: 60px;
height: 100%;
text-align: center;
position: absolute;
left: 20px;
top: 0;
}
.layui-left a {
display: block;
height: 100%;
width: 100%;
}
.tree-txt-active {
background: #dcdcdc;
}
.layui-card-body {
height: 80vh;
overflow: hidden
}
.layui-tree-entry .layui-tree-txt {
font-weight: 600;
}
.layui-tree-pack .layui-tree-txt {
font-weight: 300;
}
.layui-tab-title {
text-align: center
}
#toIframe {
display: none;
width: 100%;
border: none;
height: 96vh !important;
}
.layui-tab-content {
padding: 0;
}
.layui-tab {
margin: 0;
}
.h-100 {
height: 96vh;
overflow: auto;
}
.site-dropdown-demo,
.site-dropdown-demo .layui-menu {
background-color: #000;
border: none;
}
.site-dropdown-demo .layui-menu li {
color: #fff;
}
.site-dropdown-demo .layui-menu li:hover {
background-color: #333;
}
#docs {
height: 96vh;
overflow: auto;
}
.layui-card {
height: auto;
}
.layui-card-body {
height: auto
}
#print .itemlist {
margin-bottom: 10px;
}
#print .itemlist h3 {
margin-bottom: 10px;
text-align: center
}
.labelTitle {
height: 40px;
text-align: center;
padding-right: 28px;
line-height: 40px;
background: #fff;
font-size: 18px;
font-weight: bold;
width: 90%;
}
.layui-card-header {
display: block ruby;
}
::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px #999;
background-color: #999;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px #ddd;
border-radius: 10px;
background-color: #F5F5F5;
}
::-webkit-scrollbar {
width: 4px;
height: 0px;
background-color: #F5F5F5;
}
.rate {
margin: 5px;
}
.layui-form-label {
width: calc(100% - 48px);
float:none;
}
.mustInput{
float:right;
}
</style>
</head>
<body id="content" style="overflow:scroll;display:flex;justify-content:center;width:100%">
<!--startprint1-->
<form class="layui-form" style="width: 80%">
<div class="layui-row" style="width: 100%">
<div class="layui-col-sm9 layui-col-md9 layui-col-xs9" style=" width: 100%">
<div class="layui-card">
<div class="layui-card-body" id="CCForm">
</div>
</div>
</div>
</div>
</form>
<!--endprint1-->
</body>
</html>