UserAvatar_wev8.js 7.82 KB
if(typeof(MEC_NS) == 'undefined'){
	MEC_NS = {};
}

MEC_NS.UserAvatar = 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.UserAvatar.prototype.getID = function(){
	return this.id;
};

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

/*页面上显示控件完成后调用此方法,主要用于一些必须要使用js对页面进行后置操作时,无需要此方法可至空。 不必需的方法,有此方法系统自动调用*/
MEC_NS.UserAvatar.prototype.afterDesignHtmlBuild = function(){
	var theId = this.id;
	var p = this.mecJson;
	var userType = p["userType"];
	var userStyle = p["userStyle"];
	var userParam = Mec_FiexdUndefinedVal(p["userParam"]);
	
	require("utils").api("designer/plugin", {
		action: "getUserAvatar",
		data: { 
			userType: userType,
			userParam: userParam
		}
	}, function (result) {
		var $userAvatar = $("#NMEC_" + theId);
		var data = result.data;
		var headPicMes = data.avatar;
		var headFormat = data.avatar.headFormat;
		//1:显示姓名首字  2:显示固定图片  3:显示姓名后两字
		if("1" === headFormat || "3" === headFormat){
			//以css形式显示
			var bgColor = headPicMes.background;
			var fontColor = headPicMes.fontColor;
			var shortname = headPicMes.shortname;
			var paddingleft = userStyle == "1" ? "padding-left:0; " : "";
			var htm = "<div class='resourceimage' style='background:"+ bgColor +"; color:"+ fontColor +";"+ paddingleft +" '>" + shortname + "</div>";
			$("img", $userAvatar).hide();
			$(".wev-avatar-container", $userAvatar).prepend(htm);
		}  else {
			//以图片的形式显示
			$("img", $userAvatar).attr("src", headPicMes.messagerUrls);
		}
		$(".wev-avatar-username", $userAvatar).html(data["userName"]);
		$(".wev-avatar-dept", $userAvatar).html(data["deptName"]);
		$(".wev-avatar-jobtitle", $userAvatar).html(data["jobTitlesName"]);
	});
};

/*获取构建属性编辑窗体的html,添加和单击控件后会调用此方法,由此方法去构建属性编辑窗体。 必需的方法*/
MEC_NS.UserAvatar.prototype.getAttrDlgHtml = function(){
	var styleL = "_style" + _userLanguage;
	var theId = this.id;
	
	var htm = "<div id=\"MADUA_"+theId+"\">";
	htm += "<div class=\"title\">"+SystemEnv.getHtmlNoteName(4650)+"</div>";  
	htm += "<div class=\"form-group\">" +
				"<div class=\"row\">"
					+ "<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(4366)+"</span>"  //用户来源:
					+ "<div class=\"col-m-8 multi-checkbox\">"
						+ "<span class=\"cbboxEntry\">"
							+ "<input type=\"checkbox\" name=\"userType_"+theId+"\" value=\"1\" onclick=\"MADUA_ChangeUserType(this, '"+theId+"');\"/>"
							+ "<span class=\"cbboxLabel\">"+SystemEnv.getHtmlNoteName(4367)+"</span>" //当前用户
						+ "</span>"	
						+ "<span class=\"cbboxEntry\">"
							+ "<input type=\"checkbox\" name=\"userType_"+theId+"\" value=\"2\" onclick=\"MADUA_ChangeUserType(this, '"+theId+"');\"/>"
							+ "<span class=\"cbboxLabel\">"+SystemEnv.getHtmlNoteName(4281)+"</span>" //获取参数
						+ "</span>"	
					+ "</div>"
				+ "</div>" 
				+ "<div class=\"row\" style=\"display:none;\">"
					+ "<span class=\"col-2 span-control\">"+SystemEnv.getHtmlNoteName(4211)+"</span>"  //参数名称
					+ "<div class=\"col-m-8\"><input type=\"text\" data-autobind='userParam' id=\"userParam_"+theId+"\" class=\"form-control\" placeholder=\""+SystemEnv.getHtmlNoteName(4593)+"\"/></div>"  //参数名称,如:userid
				+ "</div>"
				+ "<div class=\"row\">"
					+ "<span class=\"col\">"+SystemEnv.getHtmlNoteName(4369)+"</span>"  //样式:
				+ "</div>" 
				+"<div class=\"row pd-7\">"
					+"<div class=\"fl user-control userAvatarContainers\" onclick=\"MADUA_ChangeUserStyle('"+theId+"',1);\">"
						+"<img src=\"/mobilemode/images/template/userAvatar1_wev8.png\">"
						+"<div class=\"selected-style\"></div>"
					+"</div>"
					
					+"<div class=\"fl user-control userAvatarContainers userAvatarContainers2\" style=\"width:160px;margin-left:10px;\" onclick=\"MADUA_ChangeUserStyle('"+theId+"',2);\">"
						+"<img src=\"/mobilemode/images/template/userAvatar2_wev8.png\">"
						+"<div class=\"selected-style\"></div>"
					+"</div>"
					+"<input type=\"hidden\" id=\"userStyle_"+theId+"\" value=\"\" />"
				+ "</div>"
			+"</div>";
	htm += "<div class=\"bottom\"><div class=\"save-btn\" onclick=\"refreshMecDesign('"+theId+"');\">"+SystemEnv.getHtmlNoteName(3451)+"</div></div>";  //确定
	htm += "</div>";
	
	htm += "<div class=\"MAD_Alert\">"+SystemEnv.getHtmlNoteName(4115)+"</div>";  //已生成到布局
	return htm;
};

/*构建属性编辑窗体完成后调用此方法,主要用于一些必须要使用js对页面进行后置操作时,无需要此方法可至空。 不必需的方法,有此方法系统自动调用*/
MEC_NS.UserAvatar.prototype.afterAttrDlgBuild = function(){
	var theId = this.id;
	var mecHandler = MECHandlerPool.getHandler(theId);
	
	var userTypeV = this.mecJson["userType"];
	var $userType = $("input[type='checkbox'][name='userType_"+theId+"'][value='"+userTypeV+"']");
	if($userType.length > 0){
		$userType.checked();
		$userType.triggerHandler("click");
	}
	var $userStyle = Mec_FiexdUndefinedVal(this.mecJson["userStyle"]);
	MADUA_ChangeUserStyle(theId,$userStyle);
	
	$("#userParam_"+theId).val(Mec_FiexdUndefinedVal(this.mecJson["userParam"]));
	
	$("#MADUA_"+theId).checkbox({
		onClick: function () { 
			mecHandler.autobind && mecHandler.autobind.update();
		}
	});
};

/*获取JSON*/
MEC_NS.UserAvatar.prototype.getMecJson = function(){
	var theId = this.id;
	
	this.mecJson["id"] = theId;
	this.mecJson["mectype"] = this.type;
	
	var $attrContainer = $("#MAD_"+theId);
	if($attrContainer.length > 0){
		this.mecJson["userType"] = $("input[type='checkbox'][name='userType_"+theId+"']:checked").val();
		this.mecJson["userParam"] = $("#userParam_"+theId).val();
		this.mecJson["userStyle"] = $("#userStyle_"+theId).val();
	}
	return this.mecJson;
};

MEC_NS.UserAvatar.prototype.getDefaultMecJson = function(){
	var theId = this.id;
	
	var defMecJson = {};
	
	defMecJson["id"] = theId;
	defMecJson["mectype"] = this.type;
	
	defMecJson["userType"] = "1";	//用户来源
	defMecJson["userStyle"] = "1";	//用户样式
	return defMecJson;
};

function MADUA_ChangeUserType(cbObj, mec_id){
	setTimeout(function(){	//checkbox用了插件,不延时checkbox的checked状态获取不准确
		var objV = cbObj.value;
		if(!cbObj.checked){
			changeCheckboxStatus(cbObj, true);
			return;
		}else{
			$("input[type='checkbox'][name='userType_"+mec_id+"']").each(function(){
				if(this.value != objV){
					changeCheckboxStatus(this, false);
				}
			});
		}
		if(objV == "2"){
			$("#userParam_" + mec_id).parent().parent().show();
		}else{
			$("#userParam_" + mec_id).parent().parent().hide();
		}
	},100);
}

function MADUA_ChangeUserStyle(mec_id,userStyleVal){
	var mecHandler = MECHandlerPool.getHandler(mec_id);

	if(userStyleVal == ""){
		userStyleVal = "1";
	}
	$("#userStyle_"+mec_id).val(userStyleVal);
	var $attrContainer = $("#MAD_"+mec_id);
	if(userStyleVal == "1"){
		$(".selected-style", $attrContainer).eq(0).removeClass("hide");
		$(".userAvatarContainers", $attrContainer).eq(0).addClass("user-selected");
		$(".selected-style", $attrContainer).eq(1).addClass("hide");
		$(".userAvatarContainers", $attrContainer).eq(1).removeClass("user-selected");
	}else{
		$(".selected-style", $attrContainer).eq(0).addClass("hide");
		$(".userAvatarContainers", $attrContainer).eq(0).removeClass("user-selected");
		$(".userAvatarContainers", $attrContainer).eq(1).addClass("user-selected");
		$(".selected-style", $attrContainer).eq(1).removeClass("hide");
	}
	mecHandler.autobind && mecHandler.autobind.update();
}