反馈已提交

网络繁忙

JS实现记录填报操作

  • 文档创建者:星踪
  • 编辑次数:12次
  • 最近更新:Leo.Tsai 于 2022-06-29
  • 1. 概述

    1.1 问题描述

    想要对用户在填报时操作过的数据进行记录,比如修改和删除了哪几行数据,是谁在什么时间操作的,该如何实现呢?

    1.2 实现思路

    修改操作可以通过控件的编辑后事件,将操作时间和操作用户赋值给同行某个单元格,最后提交到数据库。

    删除操作可以通过在删除行按钮中设置提交事件,让其在删除行的同时,将数据提交到记录表里。

    接口说明可以参考:API接口汇总

    注:不支持移动端。

    2. 示例

    2.1 设计模板

    如图制作模板:

    E2 单元格记录操作人,F2 单元格记录操作时间,G2 单元格为按钮控件。制作完成后可以将 E 列和F列隐藏。

    2.2 设置删除按钮

    1)将 G2 的按钮控件设置为普通按钮,添加点击事件,选择提交入库。

    注:必须是「普通」类型按钮,「删除行」类型按钮会有逻辑冲突问题。


    2)添加 2 个提交事件,一个将改动记录信息提交到日志表,另一个将该行数据从原表删除。

    日志记录:选择智能提交,按下图所示设置,将操作人:=$fine_username,操作时间:=format(now(),'yyyy-MM-dd HH:mm:ss') 和状态:删除绑定对应字段。操作人和时间需要勾选为主键。

    原表删除:选择删除提交,设置对应主键字段即可。

    3)设置回调函数,用于弹出删除结果提示,以及执行删除行的操作。

    JavaScript 代码如下:

    if (fr_submitinfo.success) {
    _g().deleteReportRC(this.options.location);
    //删除当前行
    FR.Msg.toast('删除成功');
    } else {
    FR.Msg.toast('删除失败,错误信息为:' + fr_submitinfo.failinfo);
    }

    2.3 设置控件编辑后事件

    给需要编辑的单元格控件添加编辑后事件,比如本示例中 C2 和 D2 单元格的文本框控件。

    JavaScript 代码如下:

    注:使用 FR.remoteEvaluate 接口存在一定安全风险,用户可根据实际情况使用,详情可查看:全局接口-FR

    var username=FR.remoteEvaluate("$fine_username");
    //获取当前用户名
    var time=FR.remoteEvaluate("format(now(),'yyyy-MM-dd HH:mm:ss')");
    //获取当前时间
    var cell=this.options.location;
    //获取当前控件所在单元格的编号
    var cr=FR.cellStr2ColumnRow(cell);
    //获取当前单元格的行列号
    _g().setCellValue(0,4,cr.row,username);
    //给当前行的E列单元格赋值用户名
    _g().setCellValue(0,5,cr.row,time);
    //给当前行的F列单元格赋值时间

    2.4 设置填报属性

    模板>报表填报属性中添加 2 个内置 SQL ,分别对应日志记录和数据提交。

    1)按下图所示设置日志记录的填报属性。绑定操作人为E2单元格,时间为F2单元格,状态为修改。同时,需要设置提交条件来过滤掉 E2 和 F2 为空的数据,也就是过滤掉用户未修改的那部分数据。提交条件的公式为:len(E2)!=0&&len(F2)!=0

    2)按下图所示设置数据提交的填报属性。

    2.5 效果预览

    保存模板,点击填报预览。任意修改和删除数据,可以看到修改和删除的数据信息都提交到了日志表里。

    1.gif


    3. 模板下载

    已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\JS\填报预览JS实例\记录填报操作.cpt

    点击下载模板:记录填报操作.cpt


    4. 注意事项

    1)本方案中的修改状态包括了更新和插入 2 种状态,由于这两种状态的区分需要和数据库交互后才能知道,所以暂不支持。

    2)如果希望删除行前有确认步骤,可以通过 2 个按钮来实现。其中一个设置提交事件,最后隐藏,另一个设置删除行前确认的功能,通过的话则模拟点击设置提交事件的按钮。如下图所示:

    删除确认按钮的JavaScript 代码如下:

    var cell = this.options.location;
    //获取当前控件所在单元格的编号
    var cr = FR.cellStr2ColumnRow(cell);
    //获取当前单元格的行列号
    var delcell = FR.columnRow2CellStr({
    col: cr.col + 1,
    row: cr.row
    })
    //获取当前单元格后一列的单元格编号
    FR.Msg.confirm("警告", "确定要删除吗?", function(value) {
    if (value) {
    _g().getWidgetByCell(delcell).fireEvent("click");
    //模拟点击按钮
    }
    })

    模板下载:记录填报操作(带删除确认功能).cpt

    附件列表


    主题: 填报应用
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    在线QQ:800049425

    热线电话:400-811-8890转2

    总裁办24H投诉

    热线电话:173-1278-1526

    文 档反 馈

    鼠标选中内容,快速反馈问题

    鼠标选中存在疑惑的内容,即可快速反馈问题,我们将会跟进处理。

    不再提示

    10s后关闭