反馈已提交

网络繁忙

当前为10.0版本文档,只有最新版本的文档支持在线编辑修改,如果想创建/编辑文档,请移步至 最新版帮助文档

排序添加动态箭头

  • 文档创建者:axing
  • 历史版本:7
  • 最近更新:Alicehyy 于 2021-03-16
  • 1. 概述

    1.1 预期效果

    点击标题可以动态排序的情况下,如果想要在标题上设置「箭头」以体现当前是哪一列排序,是升序还是降序。该如何实现呢?预期效果如下:

    1615788857221879.gif

    1.2 实现思路

    利用「条件属性」结合「HTML标签」来实现。

    2. 示例

    2.1 准备模板

    示例使用文档多列动态排序中已经制作好的模板进行讲解。

    打开模板:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\Primary\GroupReport\多列动态排序示例二.cpt

    2.2 添加条件属性

    需要给标题所在的每个单元格均添加三个条件属性,分别重命名为「无序」、「升序」和「降序」,属性选择「新值」,值选择「公式 F(x)」,公式条件选择「公式」,输入公式具体如下:

    注:添加时可同时选中 A2~D2 单元格,设置完后再分别修改即可。

    1)无序

    单元格
    新值公式
    公式条件
    A2"<font color='gray'>↑↓ </font>" + $$$$asc<>"A3"
    B2$asc<>"B3"
    C2$asc<>"C3"
    D2$asc<>"D3"

    2)升序

    单元格
    新值公式
    公式条件
    A2"↑<font color='gray'>↓ </font>" + $$$$asc="A3"&&$a=1
    B2$asc="B3"&&$a=1
    C2$asc="C3"&&$a=1
    D2$asc="D3"&&$a=1

    3)降序

    单元格
    新值公式
    公式条件
    A2"<font color='gray'>↑</font>↓ " + $$$$asc="A3"&&$a<>1
    B2$asc="B3"&&$a<>1
    C2$asc="C3"&&$a<>1
    D2$asc="D3"&&$a<>1

    步骤如下图所示:

    1615787953612022.png

    2.3 设置单元格用 HTML 显示内容

    选中 A2~D2 单元格,设置「单元格属性>其他>显示内容」为「用 HTML 显示内容」。如下图所示:

    1615788145916837.png

    2.4 效果预览

    2.4.1 PC 端

    保存报表,点击「分页预览」,效果与 1.1 节预期效果一致。

    2.4.2 移动端

    App 端和 HTML5 端均支持,效果如下图所示:

    4248DD2C-9219-4380-B572-8573AEF31222.GIF

    3. 模板下载

    已完成模板可参见:%FR_HOME%\webapps\webroot\WEB-INF\reportlets\doc\SpecialSubject\OrderReport\多列排序添加动态箭头.cpt

    点击下载模板:多列排序添加动态箭头 .cpt

    附件列表


    主题: 报表专题
    已经是第一篇
    已经是最后一篇
    • 有帮助
    • 没帮助
    • 只是浏览

    售前咨询电话

    400-811-8890转1

    在线技术支持

    请前往「服务平台」,选择「在线支持」

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

    总裁办24H投诉

    热线电话:173-1278-1526