DataDetail_wev8.js 12.2 KB
if(typeof(MEC_NS) == 'undefined'){
	MEC_NS = {};
}

MEC_NS.DataDetail = function(type, id, mecJson){
	this.type = type;
	if(!id){
		id = new UUID().toString();
	}
	this.id = id;
	if(!mecJson){
		mecJson = this.getDefaultMecJson();
	}
	this.mecJson = mecJson;
};

/*获取id。 必需的方法*/
MEC_NS.DataDetail.prototype.getID = function(){
	return this.id;
};

/*加载数据*/
MEC_NS.DataDetail.loadData = function(callback) {
    var _u = require('utils');
    dataSetPanel = _u.use('dataSetPanel');

    dataSetPanel('loadDataSetItems', callback);
}
/*获取设计的html, 页面上怎么显示控件完全依赖于此方法。 必需的方法*/
MEC_NS.DataDetail.prototype.getDesignHtml = function(){
	return getDesignHtml(this);
};

MEC_NS.DataDetail.prototype.getDataDetail = function(){
	var dataDetails = this.mecJson['dataDetail_datas'];
	if(!dataDetails){
		this.mecJson['dataDetail_datas'] = [];
	}
	return dataDetails;
}

/*获取构建属性编辑窗体的html,添加和单击控件后会调用此方法,由此方法去构建属性编辑窗体。 必需的方法*/
MEC_NS.DataDetail.prototype.getAttrDlgHtml = function(){
    var theId = this.id;

    var dataDetails = this.getDataDetail();

    var htm = "<div id=\"MADDataDetail_"+theId+"\">"
		    + "<table id=\"MADDataDetail_Table_"+theId+"\" class=\"table MADDataDetail_Table\">"
		        + "<thead>"
		            + "<tr>"
                        + "<td style=\"width:20px;\"></td>"
                        + "<td style=\"width:90px;\">"+SystemEnv.getHtmlNoteName(4386)+"</td>"   //明细名称
		                + "<td style=\"width:*;\">"+SystemEnv.getHtmlNoteName(6123)+"</td>"   //明细内容
                        + "<td style=\"width:55px;\">"+SystemEnv.getHtmlNoteName(4178)+"</td>"   //单击脚本
		                + "<td style=\"width:30px;\">"+SystemEnv.getHtmlNoteName(6124)+ "</td>"   //换行
		            + "</tr>"
		        + "</thead>"
		        + "<tbody>";
    for(var i = 0; i < dataDetails.length; i++){
        htm += MADDataDetail_CreateRow(i, theId);
    }
	htm += "</tbody>"
		+ "</table></div>"
        + "<div class=\"col-12 tr\"><span class=\"add-before add-item\" data-scroll=\"bottom\" onclick=\"MADDataDetail_AddOne('"+theId+"');\">"+SystemEnv.getHtmlNoteName(3518)+"</span></div>"  //添加
	+ "</div>"
    + "<div class=\"tip-control DataDetail_empty_tip\" style=\"display: block;\">"+SystemEnv.getHtmlNoteName(4391)+"</div>";  //单击右上角的添加按钮以添加明细内容

    return htm;
};

/*构建属性编辑窗体完成后调用此方法,主要用于一些必须要使用js对页面进行后置操作时,无需要此方法可至空。 不必需的方法,有此方法系统自动调用*/
MEC_NS.DataDetail.prototype.afterAttrDlgBuild = function(){

	var theId = this.id;
	var mecHandler = MECHandlerPool.getHandler(theId);
	var dataDetail_datas = this.mecJson["dataDetail_datas"];
	if(dataDetail_datas.length > 0){
		$(".DataDetail_empty_tip", $('#MAD_'+theId)).hide();
	}
	for(var i = 0; i < dataDetail_datas.length; i++){
		var entryId = dataDetail_datas[i]['entryId'];
		var entryDSName = dataDetail_datas[i]['entryDSName'];
		var entryDSKey = dataDetail_datas[i]['entryDSKey'];
		var entryName = dataDetail_datas[i]['entryName'];
		var entryContent = dataDetail_datas[i]['entryContent'];
		var entryClickScript = dataDetail_datas[i]['entryClickScript'];
		var entryIsVerticalDisplay = dataDetail_datas[i]['entryIsVerticalDisplay'];

		$('#entryId_'+i+'_'+theId).val(entryId);
		$('#entryDsName_'+i+'_'+theId).val(entryDSName);
		$('#entryDsKey_'+i+'_'+theId).val(entryDSKey);
		MLanguage.setValue('#entryName_'+i+'_'+theId, entryName);
		$('#entryContent_'+i+'_'+theId).val(entryContent).siblings('pre.hidden-textarea').find('span').text(entryContent);
		if(entryIsVerticalDisplay == '1'){
			$('#entryIsVerticalDisplay_'+i+'_'+theId).attr('checked', 'checked');
		}
		$('#entryClickScript_'+i+'_'+theId).val(entryClickScript);
        $('#entryClickScript_'+i+'_'+theId).closest(".click-control").click(function(){
            var $this = $(this);
            var $clickScript = $("input", $this);
            SL_AddScriptToField($clickScript);
        });
        dataSetPanel('setDataSet', $('#entryContent_'+i+'_'+theId).parent(), {
        	dsName: entryDSName,
			dsKey: entryDSKey
		});
        SL_ChangeStyle($('#entryClickScript_'+i+'_'+theId).closest('.click-control'), entryClickScript);
	}

    $("#MADDataDetail_Table_"+theId+">tbody").find('td').css('vertical-align', 'top');
    $('.sbHolder textarea', $("#MADDataDetail_Table_"+theId)).on('input', function(){
        var $this = $(this);
        $this.siblings('pre.hidden-textarea').find('span').text($this.val());
    }).on('focus', function(){
    	$(this).siblings('pre.hidden-textarea').show();
	}).on('blur', function(){
        $(this).siblings('pre.hidden-textarea').hide();
        $(this).scrollTop(0);
    }).perfectScrollbar();

    $("#MADDataDetail_"+theId).checkbox({
        onClick: function () {
            mecHandler.autobind.update();
        }
    });
	$("#MADDataDetail_Table_" + theId + " > tbody").sortable({
		revert: false,
		axis: "y",
		items: "tr",
		handle: ".bemove",
		update: function(){
			mecHandler.autobind.update();
		}
	});
};

/*获取JSON*/
MEC_NS.DataDetail.prototype.getMecJson = function(){
	var theId = this.id;
	this.mecJson["id"] = theId;
	this.mecJson["mectype"]= this.type;
	
	var $tableContainer = $("#MADDataDetail_Table_" + theId);
	if($tableContainer.length > 0){
		var dataDetail_datas = [];
		$("tr[rowindex]", $tableContainer).each(function(){
			$tr = $(this);
			var rowIndex = $tr.attr('rowindex');
			var entryId = $('#entryId_'+rowIndex+'_'+theId).val();
			var entryName = MLanguage.getValue($('#entryName_'+rowIndex+'_'+theId)) || SystemEnv.getHtmlNoteName(4141); //名称
			var entryDSName = $("#entryDsName_"+rowIndex+'_'+theId).val();
			var entryDSKey = $("#entryDsKey_"+rowIndex+'_'+theId).val();
			var entryContent = $("#entryContent_"+rowIndex+'_'+theId).val();
			var entryClickScript = $("#entryClickScript_"+rowIndex+'_'+theId).val();
			var entryIsVerticalDisplay = $("#entryIsVerticalDisplay_"+rowIndex+'_'+theId).is(':checked') ? '1' : '0';
			
			dataDetail_datas.push({
				"entryId"      : entryId,
				"entryName"    : entryName,
				"entryDSName"  : entryDSName,
				"entryDSKey"   : entryDSKey,
				"entryContent" : entryContent,
				"entryClickScript" : entryClickScript,
				"entryIsVerticalDisplay" : entryIsVerticalDisplay
			});
		});
		this.mecJson["dataDetail_datas"] = dataDetail_datas;
	}
	

	return this.mecJson;
};

MEC_NS.DataDetail.prototype.getCopyMecJson = function (mecJson) {
	if (mecJson.dataDetail_datas) {
		mecJson.dataDetail_datas.forEach(function (data) {
			data.entryId = new UUID().toString();
		});
	}
};

MEC_NS.DataDetail.prototype.getDefaultMecJson = function(){
	var theId = this.id;
	var defMecJson = {};
	defMecJson["id"] = theId;
	defMecJson["mectype"] = this.type;
	var dataDetail_datas = [];
	defMecJson["dataDetail_datas"] = dataDetail_datas;
	return {
		id: this.id,
		mectype: this.type,
		dataDetail_datas: [{
			entryId: new UUID().toString(),
			entryName: SystemEnv.getHtmlNoteName(4141), // 名称
			entryContent: ""
		}, {
			entryId: new UUID().toString(),
			entryName: SystemEnv.getHtmlNoteName(4141) + "2", // 名称
			entryContent: ""
		}, {
			entryId: new UUID().toString(),
			entryName: SystemEnv.getHtmlNoteName(4141) + "3", // 名称
			entryContent: ""
		}]
	};
};

function MADDataDetail_CreateRow(currRowIndex, mec_id){
    var htm =
        "<tr rowIndex=\""+currRowIndex+"\">"
            + "<td class=\"bemove\" width=\"20px\" style=\"padding-top: 12px;\">"
                + "<input id=\"entryId_"+currRowIndex+"_"+mec_id+"\" type=\"hidden\" />"
                + "<input id=\"entryDsName_"+currRowIndex+"_"+mec_id+"\" type=\"hidden\" />"
                + "<input id=\"entryDsKey_"+currRowIndex+"_"+mec_id+"\" type=\"hidden\" />"
            + "</td>"
            + "<td width=\"90px\"><input data-autobind id=\"entryName_"+currRowIndex+"_"+mec_id+"\" type=\"text\"  placeholder='"+SystemEnv.getHtmlNoteName(4141)+"' class=\"form-control\" "+MLanguage.ATTR+"/></td>"//名称
            + "<td width=\"*\">"
                + "<div class=\"sbHolder expandingArea\" style=\"width: 170px;\">"
		        + "<div onclick=\"javascript:showDataSetPanel('#entryContent_"+currRowIndex+"_"+mec_id+"');\" class=\"sbToggle sbToggle-btc\"></div>"
                    + "<pre class=\"hidden-textarea\" style=\"display: none; min-height: 48px;max-height: 120px; width: 100%;\"><span></span><br></pre>"//可变textarea占位元素
                    + "<textarea id=\"entryContent_"+currRowIndex+"_"+mec_id+"\" onchange=\"MADDataDetail_DataSetChange(this, "+currRowIndex+", '"+mec_id+"')\" placeholder='"+SystemEnv.getHtmlNoteName(5077)+"' class=\"area-control\" style=\"border: none; width: 100%; overflow-y: auto; line-height: 20px;\"></textarea>"
                + "</div>"
            + "</td>"
            + "<td width=\"55px\" >"
                + "<div class='click-control'>"
                    + "<input id=\"entryClickScript_"+currRowIndex+"_"+mec_id+"\" type=\"hidden\" name=\"script\"/>"
                    + SystemEnv.getHtmlNoteName(4634)  //脚本
                + "</div>"
            + "</td>"
            + "<td width=\"30px\" style=\"position: relative;padding-left: 5px; padding-top: 12px;\"><input type=\"checkbox\" id=\"entryIsVerticalDisplay_"+currRowIndex+"_"+mec_id+"\" />"
                + "<div class='del-after delFlag' onclick=\"MADDataDetail_DeleteDataDetailEntry("+currRowIndex+",'"+mec_id+"');\"></div>"
            + "</td>"
        + "</tr>";

    return htm;
}

function MADDataDetail_DataSetChange(ele, currRowIndex, mec_id){
    var mecHandler = MECHandlerPool.getHandler(mec_id);
	var $ele = $(ele).parent();
	var ds = $ele.data('ds');
	var dsName = ds && ds.dsName || '';
	var dsKey = ds && ds.dsKey || '';
	var $entryName = $('#entryName_' + currRowIndex + '_' + mec_id);
	$(ele).siblings('pre.hidden-textarea').find('span').text($(ele).val());
	$('#entryDsName_' + currRowIndex + '_' + mec_id).val(dsName);
	$('#entryDsKey_' + currRowIndex + '_' + mec_id).val(dsKey);
    ds && ds.entryName && MLanguage.setValue($entryName, ds.entryName);
    mecHandler.autobind.update();
}

function MADDataDetail_AddOne(mec_id){
    var maxRowIndex = 0;
    $("#MADDataDetail_Table_"+mec_id + " > tbody > tr").each(function(i){
        var rowIndex = parseInt($(this).attr("rowindex"));
        if(rowIndex > maxRowIndex){
            maxRowIndex = rowIndex;
        }
    });
    var currRowIndex = maxRowIndex + 1;

    var htm = MADDataDetail_CreateRow(currRowIndex, mec_id);
    var $newRow = $(htm);
    $newRow.find('td').css('vertical-align', 'top');
    $('.sbHolder textarea', $newRow).on('input', function(){
        var $this = $(this);
        $this.siblings('pre.hidden-textarea').find('span').text($this.val());
    }).on('focus', function(){
    	$(this).siblings('pre.hidden-textarea').show();
	}).on('blur', function(){
		$(this).siblings('pre.hidden-textarea').hide();
		$(this).scrollTop(0);
	}).perfectScrollbar();
    $("#MADDataDetail_Table_"+mec_id + " > tbody").append($newRow);
    $(".DataDetail_empty_tip", $('#MAD_'+mec_id)).hide();
    $(".click-control", $newRow).click(function(){
        var $this = $(this);
        var $clickScript = $("input", $this);
        SL_AddScriptToField($clickScript);
    });

    var _entryId = new UUID().toString();
    $("#entryId_"+currRowIndex+'_'+mec_id).val(_entryId);

    var mecHandler = MECHandlerPool.getHandler(mec_id);
    $newRow.checkbox({
        onClick: function () {
            mecHandler.autobind.update();
        }
    }).MLanguage();
    MLanguage.setValue($("#entryName_"+currRowIndex+'_'+mec_id), SystemEnv.getHtmlNoteName(4141)); //名称
    mecHandler.autobind.update();
}

function MADDataDetail_DeleteDataDetailEntry(rowIndex, mec_id){
	var entryName = $('#entryName_'+rowIndex+'_'+mec_id).val();
	var msg = SystemEnv.getHtmlNoteName(6077) + '"'+entryName+'"' + '?';  //确定删除
	var mecHandler = MECHandlerPool.getHandler(mec_id);
	
	confirm(msg, function() {
        $("#MADDataDetail_Table_" + mec_id + " > tbody > tr[rowIndex='"+rowIndex+"']").remove();
		if($("#MADDataDetail_Table_" + mec_id + " > tbody > tr").length == 0){
			$(".DataDetail_empty_tip", $("#MAD_" + mec_id)).show();
		}
		mecHandler.autobind.update();
	});
}