十九、mcg-helper业务系统单表业务模块自动化生成生成js文件

本节讲解js文件生成，这是《业务系统单表业务模块生成》示例中最后一节教程，若您是第一次接触，建议从《十二、mcg-helper业务系统单表业务模块自动化生成model类》开始，祝您能够有所收获，下面我们来看看js文件生成在《业务系统单表业务模块生成》示例在中所运用到的控件：

红色方框标记之前教程已讲解过的控件，绿色方框标记本节要讲解的控件，点击“生成”后，从控制台看看文本控件的参数：

{
	"htmlScript":{
		"htmlTableName":"mcgHelperUserTable",
		"htmlFileName":"mcgHelperUserList.html",
		"userData":{
			"record":[
				{
					"tableFieldType":"INT",
					"include":"java.lang.Integer",
					"tableField":"user_id",
					"autoincrement":true,
					"dataType":"Integer",
					"precision":0,
					"length":10,
					"show":false,
					"comment":"自增主键",
					"mandatory":true,
					"classField":"userId",
					"primary":true
				},
				{
					"tableFieldType":"VARCHAR",
					"include":"java.lang.String",
					"tableField":"user_name",
					"autoincrement":false,
					"dataType":"String",
					"precision":0,
					"length":50,
					"show":false,
					"comment":"用户名称",
					"mandatory":false,
					"classField":"userName",
					"primary":false
				},
				{
					"tableFieldType":"VARCHAR",
					"include":"java.lang.String",
					"tableField":"user_pwd",
					"autoincrement":false,
					"dataType":"String",
					"precision":0,
					"length":255,
					"show":false,
					"comment":"用户密码",
					"mandatory":false,
					"classField":"userPwd",
					"primary":false
				}
			],
			"property":{
				"dataDesc":"用户管理",
				"name":"读取用户表信息",
				"className":"McgHelperUser",
				"packageName":"com.mcghelper.model",
				"key":"userData",
				"tableName":"mcg_helper_user"
			}
		},
		"jsFileName":"mcgHelperUserList.js",
		"namespace":"mcgHelperUser",
		"primary":{
			"classField":"userId"
		}
	}
}

参数是由父级JS脚本控件数据处理后的运行值传递过来的，基于以上参数我们就来生成js文件，这个js文件内容是我假设的，每个公司研发框架中js文件应该都不一样，不过基本的方法和格式都有一定的规律，下面示例中直接贴上研发框架中某个已完成模块js代码，我们只需要替换有变动的数据，如table名称、表单名称、请求方法名、参数变量名等等。

文本控件需要使用freemaker模板语言，将上面的参数找到相应的位置进行替换即可，下面把文本控件“属性”和“源代码”截图：

切换到“源代码”选项卡

在上源代码中，通过${ } 这种都是在进行值替换，可以说毫无逻辑，结合“参数”我相信大家都能看懂，点击“生成”后在控制台生成的结果如下：

var init = function(){
	var grid = common.bootgrid("#mcgHelperUserTable", {
		isPaged: true,
		url : baseUrl+'mcgHelperUser/list.html',	
		statusMapping : [],
		filters : function(){
			var filter = {};
			var searchPhase = $("#searchPhase").val();			
			if(searchPhase != '')
				filter['searchPhase'] = searchPhase;
			return filter;
		},			
		formatters: {
			"commands": function(column, row) {
				return "<button type='button' class='btn btn-info command-edit' data-row-id='" + row.userId + "'><span class='zmdi zmdi-edit'></span> 编辑</button> " +
				"<button type='button' class='btn btn-info command-delete' data-row-id=" + row.userId + "><span class='zmdi zmdi-delete'></span> 删除</button> ";
			}, "status" : function(column, row) {
				return statusMap[row.status];
			}
			
		}
	}).on("loaded.rs.jquery.bootgrid", function(e) {
		grid.find(".command-edit").on("click", function(e)
		{
			common.showAjaxModal(baseUrl+"mcgHelperUser/edit.html", {"userId":$(this).data("row-id")});
		});
		grid.find(".command-delete").on("click", function (e) {
			var id = $(this).data("row-id");
			common.confirm({
				title: "确认删除吗?",
				text: "删除数据不可恢复",
				type: "warning",
				showCancelButton: true,
				confirmButtonColor: "#DD6B55",
				confirmButtonText: "确认",
				cancelButtonText: "取消",
				closeOnConfirm: true,
				closeOnCancel: true
			}, function () {
				common.ajax({
					url: baseUrl+"mcgHelperUser/delete.html",
					data: {"userId":id,
					success: function (resp) {
						common.alertOk("删除成功");
						$('#mcgHelperUserTable').bootgrid("reload");
					}
				});
			});
		});			
	});
};

$(function(){
	init();

	$('#addButton').click(function(){
		common.showAjaxModal(baseUrl+"mcgHelperUser/mcgHelperUserList.html", null);
	});		
	$('#searchBtn').click(function(){
		$('#mcgHelperUserTable').bootgrid("reload");
	});	
	$('#refreshBtn').click(function(){
		$('#mcgHelperUserTable').bootgrid("reload");
	});		
});

到此，整个“业务系统单表业务模块”生成结束了，通过一系列讲解教程，从控件的使用、控件间的值传递、生成想要的格式代码等等，mcg-helper您就玩转了，在其它示例中，还会有“gmybatis控件、json控件、model控件、java控件”等等，使用方法都是类似的，若您有兴趣可以看看之前的一些教程或资讯，如果您在使用mcg-helper后，能够运用mcg-helper生成想要的代码，觉得不错或有价值意义，请您分享给更多的朋友，若有任何问题或建议请随时反馈，感谢您的支持！

十九、mcg-helper业务系统单表业务模块自动化生成生成js文件

猜你喜欢