|
本帖最后由 yonyouhmm 于 2024-3-7 20:44 编辑
一、说明
此案例我们实现列表页按照单据状态分类展示数据,案例中只考虑了开立、审批中、已审批三种情况,如果实际项目,驳回到制单的状态也要考虑。脚本逻辑只是自己简单测试了下,实际使用中如有bug自己调整吧
二、页面设计
1、初始构建的列表页中增加多页签和三个子页签
2、打开每个子页签的编辑器 修改如下两处 tabpane改为tabpage
3、三个子页签的编辑器修改后,再修改每个子页签右侧属性的多语容器名称
三、脚本开发
1、前端脚本
viewModel.on('afterMount', (args) => {
getAndSetCount();
});
//查询前根据当前活动页签 增加不同过滤条件
viewModel.on('beforeSearch', (args) => {
let activeKey = 'tabpane15ma';
let verifystate = 0;
//获取当前活动的页签
viewModel.execute('getLineTabsInfo', function (info) {
activeKey = info.activeKey;
});
if (activeKey == 'tabpane15ma') {
verifystate = 0;
} else if (activeKey == 'tabpane29gj') {
verifystate = 1;
} else if (activeKey == 'tabpane44sf') {
verifystate = 2;
}
args.isExtend = true;
args.params.condition.simpleVOs = [
{
field: 'verifystate',
op: 'eq',
value1: verifystate,
},
];
});
viewModel.on('afterTabActiveKeyChange', (args) => {
//每次页签发生变更就重新查询
viewModel.getCache('FilterViewModel').get('search').fireEvent('click');
getAndSetCount();
});
//获取每种状态的数据条数并更新页签
function getAndSetCount() {
cb.rest.invokeFunction('AT18EE15E23EB8000A.apiFunc.getCount', {}, function (err, res) {
const args = [
{ cGroupCode: 'tabpane15ma', caption: `开立态(${res.count0})` },
{ cGroupCode: 'tabpane29gj', caption: `审批中(${res.count1})` },
{ cGroupCode: 'tabpane44sf', caption: `已审批(${res.count2})` },
];
viewModel.execute('updateTabsCaption', args);
});
}
2、后端脚本
let AbstractAPIHandler = require('AbstractAPIHandler');
class MyAPIHandler extends AbstractAPIHandler {
execute(request) {
let sql0 = 'select count(1) as count0 from AT18EE15E23EB8000A.AT18EE15E23EB8000A.tableTabs where verifystate == 0';
let sql1 = 'select count(1) as count1 from AT18EE15E23EB8000A.AT18EE15E23EB8000A.tableTabs where verifystate == 1';
let sql2 = 'select count(1) as count2 from AT18EE15E23EB8000A.AT18EE15E23EB8000A.tableTabs where verifystate == 2';
var res0 = ObjectStore.queryByYonQL(sql0);
console.log(JSON.stringify(res0))
var res1 = ObjectStore.queryByYonQL(sql1);
var res2 = ObjectStore.queryByYonQL(sql2);
return { count0: res0[0].count0, count1: res1[0].count1, count2: res2[0].count2 };
}
}
exports({ entryPoint: MyAPIHandler });
四、效果演示
|
本帖子中包含更多资源,您需要 登录 才可以下载或查看,没有帐号?立即注册
X
|