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.

261 lines
12 KiB
Plaintext

11 months ago
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script type="text/javascript" src="../internal.js"></script>
<script type="text/javascript" src="../../../jquery.js"></script>
<script type="text/javascript" src="../../../bootstrap/bootstrap.js"></script>
<link rel="stylesheet" href="../../../bootstrap/bootstrap.css">
<link rel="stylesheet" href="../../../bootstrap/bootstrap-responsive.css">
<style type="text/css">
*{color: #838383;margin: 0;padding: 0}
a {text-decoration: none;}
html,body {font-size: 12px;}
body {
padding-left: 20px;padding-right: 20px;
}
</style>
</head>
<body>
<div id="tblwrap">
<table class="table table-bordered table-striped" style="margin-top:18px;margin-bottom: 0;">
<tbody>
<tr>
<th> <span> 控件名称 </span><span class="label label-important">*</span> </th>
<th> <span> 数据来源 </span></th>
<th> <span> 数据选取方式 </span> </th>
</tr>
<tr>
<td>
<input id="itemName" placeholder="必填项" type="text" size="20" />
</td>
<td>
<select onchange="javascript:fnGetData(this.value);" style="width:115px;" id="datasrc">
<option value="">选择数据来源</option>
</select>
</td>
<td>
<label><input type="radio" name="dataType" id="dataType0" value="0" checked />弹出窗口选取</label>
<label><input type="radio" name="dataType" id="dataType1" value="1" />根据录入项自动关联</label>
</td>
</tr>
<tr>
<th colspan="3"> <span> 添加映射关系 </span> </th>
</tr>
<tr>
<td colspan="3">
<div id="hidden" style="display:none;">
<select id="datafield">
</select> <i class="icon-arrow-right"></i>
<input type="text" size="20" placeholder="映射字段名称" id="itemTitle" /> &nbsp;
<label style="display:inline;"> <input title="是否作为查询字段" id="isQuery" type="checkbox" />查</label> &nbsp;
<a href="javascript:;" onclick="fnAdd();" class="btn btn-large"><i class="icon-plus"></i></a>
</div>
</td>
</tr>
</tbody>
<tbody id="tbhidden" style="display:none;">
<tr>
<td>@a</td>
<td>@b</td>
<td>@c</td>
<td>@d</td>
<td> <a href="javascript:;" onclick="fnDel(this);" class="btn"><i class="icon-remove"></i></a></td>
</tr>
</tbody>
</table><br/>
<table class="table table-striped table-bordered table-condensed" style="margin-bottom:0;" id="tbl">
<thead>
<tr>
<th> <span>数据库字段</span> </th>
<th> <span>字段名称</span> </th>
<th> <span>映射控件名称</span> </th>
<th> <span>作为查询字段</span> </th>
<th> <span>操作</span> </th>
</tr>
</thead>
<tbody id="tbl1">
</tbody>
</table>
</div><!-- end tblwrap-->
<script type="text/javascript">
var oNode = null;
//-- 获取控件属性 --
var bEditFlag = 0;
var gDataSrc = "";
window.onload = function() {
//如果是编辑控件
if( UE.plugins['data_select'].editdom ) {
oNode = UE.plugins['data_select'].editdom;
bEditFlag = 1;
$G('itemName').value = oNode.getAttribute('title');
var sDataSrc = oNode.getAttribute('data_table');
gDataSrc = sDataSrc;
var sDataType = oNode.getAttribute('data_type');
if ( !sDataType ) {
sDataType = '0';
}
$G('dataType'+sDataType.toString()).setAttribute("checked",true);
var sDataField = oNode.getAttribute("data_field"),
sDataFieldName = oNode.getAttribute("data_fld_name"),
sDataControl = oNode.getAttribute("data_control");
var aDataField = sDataField.split("`"),
aDataFieldName = sDataFieldName.split("`"),
aDataControl = sDataControl.split("`");
var sDataQuery = oNode.getAttribute("data_query");
if( sDataQuery ) {
var aDataQuery = sDataQuery.split("`");
}
var sNode = '<tr>' + $G('tbhidden').rows[0].innerHTML + '</tr>'; //复制节点
for ( var i = 0; i < aDataField.length - 1; i++ ) {
if( aDataQuery ) {
var isQuery = aDataQuery[i]=='1' ? "是":"否";
} else {
var isQuery = "否";
}
var sTempNode = sNode;
var sTempNodeReplace = sTempNode.replace(/\@a/g,aDataField[i]);
sTempNodeReplace = sTempNodeReplace.replace(/\@b/g,aDataFieldName[i]);
sTempNodeReplace = sTempNodeReplace.replace(/\@c/g,aDataControl[i]);
sTempNodeReplace = sTempNodeReplace.replace(/\@d/g,isQuery);
$('#tbl1').append(sTempNodeReplace);
}
fnGetData( sDataSrc );
fnInitDataSrc( sDataSrc );
} else {
fnInitDataSrc ();
}
$G('itemName').focus();
}
/**
* 初始化数据来源
*/
function fnInitDataSrc( sVal ){
var d = new Date();
var sUrl = 'wf.php?mod=workflowsetup&do=formdesignaction&act=getconfig&op=data&timestamp='+ d.getTime();
ajax.request(sUrl, {timeout:60000,onsuccess:function (xhr) {
if( xhr!='' ) {
var oJson = jQuery.parseJSON(xhr.responseText);
var html = '';
$.each(oJson,function(i,j){
html += '<option value = "' + i + '">';
html += j.name + '</option>';
})
$('#datasrc').append(html);
if( sVal ) {
$G('datasrc').value = sVal;
}
}
},onerror:function() {
alert('Request DataSrc TimeOut');
}});
}
//获取选定数据来源的option更新到表格内所有的下拉列表
function fnGetData ( sVal ) {
if( sVal!='' ) {
var sUrl = 'wf.php?mod=workflowsetup&do=formdesignaction&act=getdata&op=data&datasrc=' + sVal;
ajax.request(sUrl, {timeout:60000,onsuccess:function (xhr) {
if( xhr!='' ) {
var sOption = '<option value="">请选择数据库字段</option>';
$('#datafield').html(sOption + xhr.responseText );
$('#hidden').show();
}
},onerror:function() {
alert('Request TimeOut');
}});
} else {
$('#datafield').html('');
$('#hidden').hide();
}
}
function fnAdd(){
var sDataSrc = $G('datasrc').value;
var field = $G('datafield').value;
if( gDataSrc != sDataSrc && gDataSrc!="") {
var sMsg = "数据来源只能选择一种,变更数据来源,您之前的映射项将被清除,是否继续?";
if( !window.confirm( sMsg ) ) {
return false;
} else {
$('#tbl1').empty();
}
}
if( field == "" ) {
alert("请选择数据库字段");
return;
}
if( $G('itemTitle').value == '' ) {
alert("请填写映射控件名称");
return;
}
for( var i = 1;i < $G('tbl').rows.length;i++ ) {
var sDataField = $G('tbl').rows[i].cells[0].innerHTML;
if( sDataField == field ) {
alert("已经添加!");
return false;
}
}
var bQueryFlag = $G("isQuery").checked == true ? "1" : "0";
var sQueryFlagDesc = bQueryFlag == "1" ? "是" : "否";
//add a row
var sNode = '<tr>' + $G('tbhidden').rows[0].innerHTML + '</tr>'; //复制节点
sNode = sNode.replace(/\@a/g,field);
sNode = sNode.replace(/\@b/g,$G('datafield').options[$G('datafield').selectedIndex].text);
sNode = sNode.replace(/\@c/g,$G('itemTitle').value);
sNode = sNode.replace(/\@d/g,sQueryFlagDesc);
$('#tbl1').append(sNode);
}
function fnDel(obj){
$(obj).parent().parent().remove();
}
dialog.oncancel = function () {
if( UE.plugins['data_select'].editdom ) {
delete UE.plugins['data_select'].editdom;
}
};
dialog.onok = function (){
if ( $G('itemName').value == '' ) {
alert('控件名称不能为空');
$G('itemName').focus();
return false;
}
var sDataSrc = $G('datasrc').value;
var sDataType = $G('dataType0').checked == true ? 0 : 1;
var sDataField = '',sDataFieldName = '',sDataControl = '',sDataQuery = '';
//遍历数据项
for( var i = 0;i < $G('tbl1').rows.length;i++ ) {
var row = $G('tbl1').rows[i];
sDataField += row.cells[0].innerHTML + "`" ;
sDataFieldName += row.cells[1].innerHTML + "`" ;
sDataControl += row.cells[2].innerHTML + "`" ;
if(row.cells[3].innerHTML=='是') {
var bQueryFlag = '1';
} else {
var bQueryFlag = '0';
}
sDataQuery += bQueryFlag + "`"; //查询字段
}
if( sDataType=="1" && sDataQuery.replace("`","").indexOf("1") < 0 ) {
alert("必须设置查询主键!");
return false;
}
var sHtml = '<button title="' + $G('itemName').value +
'" class="btn" data_table="' + sDataSrc + '" data_type="' + sDataType +
'" data_field="' + sDataField + '" data_fld_name="' + sDataFieldName +
'" data_control="' + sDataControl + '" data_query="' + sDataQuery + '">' + $G('itemName').value + '</button>';
if( bEditFlag == 1 ) {
domUtils.remove(oNode,false);
delete UE.plugins['data_select'].editdom; //使用后清空这个对象,变回新增模式
}
editor.execCommand('insertHtml',sHtml);
};
</script>
</body>
</html>