学习笔记

学习笔记（有问题及时指正）

前端代码段：

卡片画面

数据初始化事件触发操作

使用afterLoadData进行代码的初始化

viewmodel.on('afterLoadData', function () {
	// TODO 
});

获取页面状态

页面分为新建、编辑、查看三种状态

通过var mode = viewmodel.getParams().mode;可以获取到这三种状态，mode值分别为add、edit、browse，这样就可以在afterLoadData触发后，根据这几种状态设置不同的属性了

获取表单属性

数据操作都是针对data，可以在debug状态，通过viewmodel._data()查看其属性（当前页面中的按钮和字段信息）

在卡片画面中的data，基本都是form表单中的属性，包括输入框和按钮
表单属性可以通过viewmodel.get("属性名")来获取，如：

viewmodel.get("btnEdit").setVisible(false);// 编辑按钮不显示

if (mode == 'add') {
	viewmodel.get("telephone").setValue("13888888888");
} else if (mode == 'edit') {
	viewmodel.get("telephone").setValue("13999999999");
	
	// 设置会计主体和电话不可修改
	viewmodel.get("accorg_name").setDisabled(true);
    viewmodel.get("telephone").setDisabled(true);
} else if (mode == 'browse') {
	viewmodel.get("telephone").setValue("15555555555");
}

上面代码中，既可以设置按钮的显示和隐藏，也可以给表单属性赋值（或设置不可编辑状态）。因为用的是afterLoadData触发，所以这里面的代码会覆盖掉回显时的值，如上面edit和browse虽然有默认回显值，但会被新值给覆盖掉

注：尝试了下，卡片画面直接可通过viewmodel获取beforeLoad（有params和data）和afterLoadData(只有data)的信息

表单提交

如果要在表单提交前做一些校验，可以在beforeSave事件中触发时写逻辑操作，如下面年龄验证（可能框架能实现通用逻辑）

viewmodel.on('beforeSave', function (args) {
	let age = viewmodel.get("age").getValue();
	if (isNaN(age)||age< 1||!(/^d+$/.test(age)) || age > 200) {
		cb.utils.alert("年龄有误，请重填", 'error');
		return false;
	}
	return true;
});

url请求（类似$.ajax）

下面是一个发送示例：

viewmodel.on('btnTestAll1', function (data) {// btnTestAll1为excel中bill_command的action值，除了点击按钮触发以外，也可以像上面提到的在`beforeSave`中触发该事件
	// 请求url地址
	var url = '/bill/testvouch'
	// 请求方式（POST/GET之类）的定义
	var proxy = cb.rest.DynamicProxy.create({
		ensure: {
			url: url,
			method: 'POST'
		}
	});

	// 请求参数，后端需要什么参数，就直接封装json数据就可以了
	var params = {
		billnum: viewmodel.getParams().billNo,   //"ca_realcolist",// viewmodel.getParams()有很多属性值
		data: "{acctype:0}"
	}

	proxy.ensure(params, function (err, result) {
		// 此处是请求之后的回调函数，可以做请求成功/失败的处理
		if (err) {
			cb.utils.alert(err.message, 'error');
			return;
		} else {
			cb.utils.alert('操作成功!','success');
			return;
		}
	});
});

后端接收参数：

• GET请求，使用@RequestParam Map<String, String> xxx来接收（对象的话还是用POST吧）
• POST请求，使用@RequestBody Map<String,Object> xxx来接收

后端数据返回：
成功返回：
renderJson(response,ResultMessage.data(ruleRes));
错误返回：
renderJson(response, ResultMessage.error(e.getMessage()));

前端回调函数中，通过if (err) {判断错误信息中有err字段，来提示错误信息

其它事件

• afterEdit也可以在页面数据回显后，触发该操作，有点类似afterLoadData，但应该没有afterLoadData灵活，事件的触发也在其之后

列表画面

一些事件

afterEdit 点击编辑触发

相对于编辑页面中的afterEdit，这个页面中的beforeEdit就是在点击编辑按钮之后所触发的操作，可以对选中的行数据进行赋值操作等

viewmodel.on('beforeEdit', function (args) {
	var gridData = viewmodel.getGridModel().getData();
	var schemeid = gridData[args.params.params.index].schemeid;
	args.carry.id = schemeid;
	return true;
});

beforeBatchdelete 点击删除触发

viewmodel.on("beforeBatchdelete",function(args){
	var currentRow = viewmodel.getGridModel().getRow(args.params.params.index);
	if( currentRow.amokind === 0 ){
		// alert(currentRow.amokind);
		cb.utils.alert('适用对象为 {材料费用} 的类别不能被停用和删除','warning');
		return false;
	}
});

beforeClose 点击停用触发

gridModel

从上面两个用法，可以看出：
可以通过
var gridModel = viewmodel.getGridModel();
.getData()[index] 可以获取到某条数据（或者.getRow(index)应该也行）

索引的获取可以通过事件的参数args获取到args.params.params.index，具体其它值可以debug测试下