xinglie / report-designer

⚡打印设计、可视化、标签打印、编辑器、设计器、数据分析、报表设计、组件化、表单设计、h5页面、调查问卷、pdf生成、流程图、试卷、SVG、图形元素、物联网、标签纸
https://xinglie.github.io/report-designer/
902 stars 232 forks source link

格式化函数 #80

Open xinglie opened 3 months ago

xinglie commented 3 months ago

对于拥有绑定数据的元素,通常会支持显示格式来进一步控制数据如何转换和显示

文本元素为例,当文本元素绑定数据后,我们可以通过显示格式来决定绑定的数据如何展示出来

image

有时候通过内置的格式无法完成想要的格式时,我们可以通过自定义函数来进行自由处理

如果在自定义函数内部也想再次调用内置的这些格式进行数据展示时该如何调用?

比如文本绑定的数据,假如返回的是-1,展示数据异常,如果是其它数字,则进行千分位保留一位小数进行展示。

自定义函数里我们可以这样写

/*
    data是當前綁定的字段取到的數據
    item是完整的單條數據對象
    可以把下面的console前的註釋去掉查看相應的數據
*/
function(data,item){
    if(data == -1){
        return '数据异常'; 
    }
    return $format('#,###.#',data);
}

通过$format方法来调用内置的格式化函数,第一个参数指定以哪种方式进行格式化,第二个参数为待格式化的数据

xinglie commented 3 months ago

格式化清单

以下是内置的格式化参数清单

数字

可以通过 #,###.##来控制千分位或万分位及小数位,整数与小数用.分割

示例

$format('#,####',data);//对data的整数部分进行万分位分割
$format('#,###',data);//对data的整数部分进行千分位分割
$format('.##‘,data);//对data保留2位小数
$format('#,###.##‘,data);//对data的整数部分进行千分位分割,同时保留2位小数

中文大小写

可以通过ss小写简称或tf大写全称来控制

示例

$format('ss',data);//对data以中文小写简称展示
$format('sf',data);//对data以中文小写全称展示
$format('ts',data);//对data以中文大写简称展示
$format('tf',data);//对data以中文大写全称展示

中文货币

可以通过s.f简称保留元或s.s简称省略元来控制

示例

$format('s.s',data);//对data以中文货币简称省略元展示
$format('s.f',data);//对data以中文货币简称保留元展示
$format('f.s',data);//对data以中文货币全称省元元展示
$format('f.f',data);//对data以中文货币全称保留元展示

月份

可以通过month.zhf中文全称month.ens英文简称来控制

示例

$format('month.zhs',data);//对data以中文月份简称展示
$format('month.zhf',data);//对data以中文月份全称展示
$format('month.ens',data);//对data以英文月份简称展示
$format('month.enf',data);//对data以英文月份全称展示

星期

可以通过week.zhf中文全称week.ens英文简称来控制

示例

$format('week.zhs',data);//对data以中文星期简称展示
$format('week.zhf',data);//对data以中文星期全称展示
$format('week.ens',data);//对data以英文星期简称展示
$format('week.enf',data);//对data以英文星期全称展示

日期时间

可以通过date.YYYY-MM hh:mm来控制

示例

$format('date.YYYY-MM hh:mm',data);//对data类似'2024-04 19:59'展示