? ? ? ? 上篇《報表/報告組件(一)-指標/屬性組件設計》介紹了組件核心指標/屬性設計，本文以實例介紹各個特性的實現和效果，實例是多個報告融合，顯示所有的特性。

設計

? ? ? ? 指標/屬性組件是報告/報表關鍵部分，上篇已介紹過，本節回顧一下

指標模型 指標可有多個測量字段，滿足專業和挑剔的顯示樣式，格式，數值精度和范圍需要

> 格式(format) 支持多個字段合并顯示的格式，例如，顏色指標RGB，錄入3個字段，顯示使用格式 R/G/B 或?R-G-B等，帶上樣式，R/G/B

> 單位

> 類型 TEXT/NUMBER/DATETIME, ... 可擴展

> 參考范圍, 精度

參考范圍 數值的合理值/正常值，分為基準參考和范圍參考

精度 測量的有效值，通常超過精度適用>xxx, <yyy展示，不使用原本值

> 驗證指標數值

> 樣式規范，底色/圖標資源/字體，設定與精度，范圍相關

> 圖片類型字段，圖表類型字段

> list類型字段，支持多行表格

> 圖表類型，生成圖表，導出圖片

本組件使用MVC模式，M 模型，數據和數據存儲；C 指輸出器，承上(模型)啟下(視圖)，一個數據可以輸出docx，pdf，xlsx。。。；V 視圖，如本文的示例，docx文檔模板

實現解釋

? ? ?本節以實例說明各特性，實例是真實客戶設備檢測報告，為了介紹所有特性融合了多個報告內容，因此實例數據內容可能不是很相關。

數據模型

?本節以單元測試解釋數據模型的實現

?回顧一下設計圖，數據模型分兩部分，左側紅圈部分指標/屬性數據，右側籃圈是指標/屬性定義，包括報告類型，報告類型關聯zhib/屬性，指標，指標屬性，下面以時間屬性介紹

1. 指標/屬性定義

> 指標組

下圖新建指標組

> 指標和指標字段?

下圖新建指標和指標字段

上圖構建指標，groupCode是上面的指標組，該指標有兩個字段，均為日期類型，用于合并顯示，組合出報告需要的日期格式?

2. 報告類型，關聯指標/屬性

報告分類

關聯指標

?3. 報告，指標/屬性數據

數據選擇需要屬于報告，也即需先新建報告，再寫入數據

下圖新建報告

報告對象也是三板斧，編碼，名稱，描述

報告數據分兩部分，記錄，對應指標，下圖新建記錄(Record),其中的reportId是上面新建的報告id

IndicatorCode對應的指標，實現記錄是指標負責構建

下圖是數據，指標報告時間（REPORT-DATETIME）的數據?

上面通過單元測試構建核心對象，解釋了各類對象的結構，下面詳細解釋不同類型的指標?

合并顯示

? ? ? 合并顯示是一個指標多個字段合成一個字段顯示，例如上面的RGB，錄入的時候3個數值，R/G/B，顯示是合為一個字段，RGB這是顏色的常用的顯示方式。

> 指標模板

上圖是報告模板， {{REPORT-DATETIME.報告日期}} 是替代符，REPORT-DATETIME是屬性/指標編碼，全局唯一，"報告日期"是屬性/指標下的item。

> 數據

該指標和數據在上面數據模型介紹過，這里不重復

> 導出效果

報告日期的格式通過合并顯示的format定義?

段落文本/表格文本

這兩類是最簡單的文本顯示，區別只是識別是段落，還是表格的段落

> 指標模板

> 數據

下圖對應的指標和數據

> 導出效果

樣式

樣式大致分兩類，一是顯示狀態，支持狀態文本域聯動；二是直接指定顏色

> 指標模板

下圖指標模板定義，看著都一樣，其實有三類的字段，翼根前面的葉片123是顯示狀態，顏色聯動，前緣粘接是指定顏色，備注是圖片類型

> 數據

1. 文本，文本與背景色聯動

下圖首先創建背景色感應器實現，BgAware，目前有兩個實現，TextValueBgAware，支持背景色與文本聯動；ConstBgAware，指定背景色

下圖構建指標和指標字段項，字段項使用TextValueBgAware實現文本與顏色聯動

下圖數值，數值也可以設置TextValueBgAware，數值設置的優先級高?

2. 指定背景色?

下圖構建指定背景色的數值

> 導出效果

測量數據

指標是設備的檢測數據，該數據是周期性的，如，一天一測，有著嚴謹的數值表示，樣式要求，例如，超限，超精度，要所見即所得

> 指標模板

?> 數據

下圖是測量指標字段項，可設置上下限，是否包括邊界；上精度，下精度

指標/屬性定義4個樣式，分別是超上限，超下限，超上精度，超下精度?

> 導出示例

圖片

圖片樣式那節已經展示過

上圖定義圖片類型字段項，PNG類型，還有寬和高

相應地，數據是PicValue類型，itemName對應的item名稱，value是地址，當然也可以支持minio，ftp等?

列表

列表數據支持用戶輸入不定行的表格行，實例的列表數據是設備檢測發現的損傷問題，不定行數，多少項填報多少項

>? 指標定義

其中，@@是特殊符號，生成序列號?

>? 數據

下圖列表行指標，行的列是字段項，listType設為true，標識此指標是列表指標

>? 導出效果

圖表

圖表也屬于計算指標/屬性，使用報告的其他指標/屬性，生成圖表，本節以柱狀圖為例

> 指標/屬性模板定義

圖表的指標/屬性的模板定義

> 數據

下圖構建圖表指標/屬性，本文的示例圖表都在一個指標下，一個字段對應一個圖表

下圖 柱狀圖圖表字段項，圖表有兩個序列，Fe，Cu，每個序列有兩個數據，本次和上次

圖表沒有數據寫入，使用的是報告內的數據，上面數據是引用"指標數據"?

>? 輸出效果

下一篇 導出器的實現解釋