背景
FineReport报表制作中，经常需要将某些单元格内容以彩色标签显示，其中根据不同对象内容进行不同展示，效果如下图所示：
实现效果为：
1、“年龄”列内容根据年龄段不同显示为不同颜色且带边框效果；
2、“性别”列性别为“男”显示为蓝色，性别为“女”显示为红色，性别为“未知”显示为灰色；
3、“参考科目”在表中内容较多时以顿号区分开且随机显示为不同颜色。
实现方法：
1.1、新建cpt文件，在模板数据集中新建内置数据集，并将表数据插入内置数据集中
1.2、设计表框架并将数据集字段拖入表头下方数据展示列
1.3、预览报表效果
2.1、打开设计器-模板-模板Web属性-引用CSS-导入css文件
2.2、选中年龄数据单元格，点击单元格属性、点击形态修改为“公式形态”，点击FX进入公式编辑栏
2.3、输入编辑脚本
公式：
if($$$<15,
"<span class='el-tag el-tag--success el-tag--plain is-round'><span class='el-tag__content'>"+$$$+"</span></span>",
if($$$<30,
"<span class='el-tag el-tag--warning el-tag--plain is-round'><span class='el-tag__content'>"+$$$+"</span></span>",
"<span class='el-tag el-tag--danger el-tag--plain is-round'><span class='el-tag__content'>"+$$$+"</span></span>"))
注释：
这里使用了一个if函数嵌套，
el-tag--plain 表示tag标签样式属于无颜色填充，
is-round 表示该标签为圆角标签
el-tag--success 表示标签颜色为绿色
el-tag--warning 表示标签颜色的橘黄色
el-tag--danger 表示标签颜色为红色
单元格属性-其他-显示内容为：用HTML显示内容
效果如下：
2.4、选中性别数据单元格，点击单元格属性、点击形态修改为“公式形态”，点击FX进入公式编辑栏输入公式脚本，单元格属性-其他-显示内容为：用HTML显示内容
公式：
switch($$$,"男",
"<span class='el-tag el-tag--dark'><span class='el-tag__content'>男</span></span>",
"女",
"<span class='el-tag el-tag--dark el-tag--danger'><span class='el-tag__content'>女</span></span>",
"未知",
"<span class='el-tag el-tag--dark el-tag--info'><span class='el-tag__content'>未知</span></span>")
注释：
使用switch函数，switch(表达式，值1，结果1，值2，结果2，....)
若表达式的结果是值1，则返回结果1
若表达式的结果是值2，则返回结果2
.....
el-tag--dark 表示tag标签样式属于有颜色填充，默认蓝色
el-tag--danger 表示填充颜色为红色
el-tag--info 表示填充颜色为灰色
颜色自定义在element-tag.css文件中预先定义好，需要修改的话可以在css文件中进行色值修改
效果如下：
2.5、选中参考科目数据单元格，点击单元格属性、点击形态修改为“公式形态”，点击FX进入公式编辑栏输入公式脚本，单元格属性-其他-显示内容为：用HTML显示内容
公式：
JOINARRAY(
MAPARRAY(
split($$$,"、"),
"<span class='el-tag el-tag--"
+SWITCH(
RANDBETWEEN(0,4.1),
1,"success",
2,"info",
3,"warning",
4,"danger")
+" el-tag--light'><span class='el-tag__content'>"
+item+"</span></span>"),"、")
注释：
RANDBETWEEN(0,4.1)表示从1-4之间随机取数
SWITCH()函数搭配RANDBETWEEN()表示从['success','info','warning','danger']四个颜色中随机取
split($$$,"、")表示将当前单元格的值根据"、"进行切片
MAPARRAY()函数搭配split($$$,"、")可以将参考科目值全部用html标签分别包裹住
JOINARRAY()函数可以将所有html标签合并成一个字符串
效果如下：
PS：决策报表引入CSS文件
决策报表实现此功能与普通报表有所区别，只需要新增一步操作即可：
1、新增决策报表，拖入报表框，将普通报表内容复制粘贴
2、选中body-点击事件-选择初始化后-加入脚本
$('<link rel="stylesheet" type="text/css" href="/webroot/help/css/element-tag.css"/>').appendTo('head');
其中"/webroot/help/css/element-tag.css"表示该样式文件所在路径，就是在决策报表中引用css文件
效果如下：
