历史版本30 :[通用]目录 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 版本

报表服务器版本App 版本HTML5 移动端展现插件版本支持功能
11.011.0V11.0可关闭「目录搜索框」,详情见 2.3 节

1.2 应用场景

移动端默认显示九宫格目录样式,在一级目录比较少的情况下,目录界面会显的很空,平台提供横幅和模板设置,可在目录页中展示。

1.3 功能简介

管理员进入「数据决策系统」,选择「管理系统>移动平台>目录」,可对移动端目录结构进行设置。如下图所示:

2022-03-21_10-40-39.jpg

2. 操作步骤编辑

2.1 目录结构

平台默认移动端目录结构为「九宫格」,如下图所示:

2022-03-21_10-40-39.jpg

移动端效果如下图所示:

1)App

1573182280377499.jpg

2)HTML5

1573182352526279.jpg

注:用户若想设置其他样式的目录结构,请参考 目录结构插件

2.2 样式设置

2.2.1 九宫格样式设置

九宫格演示目录支持进行「一级目录」样式进行设置。

打开「修改九宫格默认设置」按钮,如下图所示:

2022-03-21_11-21-51.jpg

其中一级目录各设置项具体介绍如下表所示: 

移动设备作用范围列数(可选)图标大小目录字号字体颜色字体加粗

手机、

Pad

App、

HTML5

3可选:小、中、大

默认字号为

 12 ,用户可自定义选择

默认黑色,用户可自定义设置按钮默认关闭,可开启
4可选:小、中、大
5可选:小、中

2.2.2 分类导航目录树样式设置

注:下载「分类导航目录树」插件后,才可选择分类导航目录树结构,插件下载请参考 目录结构插件

分类导航目录树结构支持对「一级目录」样式、「二级目录」样式进行设置。

「目录结构」选择「分类导航目录树」,打开「修改分类导航目录树默认设置」按钮,如下图所示:

2022-03-21_11-25-38.jpg

其中一级目录、二级目录各设置项具体介绍如下表所示: 

移动设备
作用范围一级目录二级目录
手机、Pad

App、

HTML5

目录字号:默认为 16列数:选项为 3、4
字体颜色:默认为黑色,可自定义选择图标大小:选项为小、中、大
字体加粗:默认关闭,可开启目录字号:默认为12
显示图标:默认开启,图标大小随目录字号字体颜色:默认为黑色,可自定义选择
图标颜色:默认为主题蓝,可自定义颜色字体加粗:默认关闭,可以开启
显示分割线:默认开启,可关闭--

2.3 目录搜索框

目录搜索框默认是开启状态,点击关闭后,在移动端不显示搜索框。

注:关闭目录搜索框后,应用目录树插件以及多级目录页也都没有搜索框。


2022-03-21_15-36-46.jpg

以九宫格目录为例,关闭搜索框后效果如下图所示:

注:App 及 HTML5 效果一致。


1647848550125321.jpg

2.4 横幅

2.4.1 添加横幅

在「目录」Tab 页下开启横幅;

点击左上角的「1573025905263865.png」号,弹出编辑框,添加横幅,并点击「确定」。如下图所示:

2022-03-22_10-41-52.jpg

横幅编辑内容说明:

横幅编辑内容
说明
名称不能为空,且不能重复
手机

上传手机端横幅图片。

上传的图片会等比例缩放为 375*188,推荐图片格式为:PNG、JPG 

平板

上传 Pad 端横幅图片。

上传的图片会等比例缩放为 1024*188,推荐图片格式为:PNG、JPG

链接
  • 非必填,点击图片时跳转的超链,输入相对路径或 http/https 开头的绝对路径;

  • 跳转 CPT/FRM,模板上只有批注(翻页)按钮;

  • 导航栏标题为横幅标题;

  • 链接地址有问题时,提示相应的错误

示例图片点击下载:横幅图片.zip

注意事项:

1)允许上传的文件格式包括 PNG、JPG、GIF,如果上传图片格式错误,会提示「XXX 是禁止上传的文件类型」。

2)若要实现点击横幅跳转到一张模板的效果,以「段落明细表」为例,则相对路径:/decision/view/report?viewlet=demo/Phone/basic/段落明细表-phone.cpt

2.4.2 编辑横幅

当添加 2 个及以上横幅时,可设置横幅轮播间隔,默认为 5 秒,则每隔 5 s 自动轮播横幅。如下图所示:

2022-03-22_10-42-28.jpg

2.4.3 移动端效果

当添加了 2 个横幅,轮播间隔为 5 秒,并为横幅添加超链。横幅会自动滚动播放,点击横幅,即可跳转到对应链接内。如下图所示:

注:App & H5 效果一致,且支持滑动切换横幅。

2022-03-22_10-45-22.gif

2.5 模板

2.5.1 添加模板

在「目录」Tab 页下开启模板;

模板选择「目录首页.frm」(自定义选择模板),显示位置为「目录上方」。如下图所示:

2022-03-22_9-28-25.jpg

注1:若开启了模板功能但不选择模板,则模板功能不生效。

注2:显示位置默认为目录上方。

2.5.2 移动端效果

注1:效果中的目录图标为自定义的目录图标,可参考本文 2.5.2 章节。

注2:效果中所插入的模板请点击横幅模板 下载。

1)App

1576834536287399.jpg

2)HTML5

1576834552135427.jpg

2.6 目录图标

FineReport 设计器内置三套(扁平、缤纷、渐变)类型的图标,同时也可以自定义图标。如下图所示:

2022-03-22_9-31-27.jpg

2.6.1 内置目录图标

左侧为目录树,点击节点设置其图标,如下图所示:

1578494598740906.gif

2.6.2 自定义图标

1)上传图标

「自定义」Tab 页下,点击「1573183730417573.png」,上传图标,如下图所示:

1578494629991741.gif

2)设置图标

以「管理驾驶舱」目录设置自定义图标为例;

选中「管理驾驶舱」目录,点击刚刚上传好的自定义图标,步骤如下图所示:

2022-03-22_9-41-26.jpg

3)删除图标

点击右上角的「编辑」进入图标删除状态,点击需要删除的小图标上方叉,弹出「确定删除该元素?」,点击确定,图标删除完成,点击返回退出图标删除状态,如下图所示:

1578494674916056.gif