Web報表工具的設計------實現思路_PHP

設計

--------------------------------------------------------------------------------



簡介

本文介紹了一種WEB報表設計工具的實現思路和解決辦法，該工具可以同資料庫連接，讓使用者自己設計報表，報表的資料從資料庫中擷取，使用者修改後的資料可以存回到資料庫中。該工具可以實現任意形式（規整、不規整）的報表設計；不僅可以作為最終產品提交給使用者使用，對於開發人員來說，也可以作為報表和資料庫的設計工具來開發自己的產品。一個目的：讓開發人員（至少是本人）不再做“報表苦力”。

前言與問題的提出

本人在C/S結構和B/S結構的軟體開發過程中，碰到大量的設計報表的工作。使用者有大量各式各樣的報表需要實現，並且在系統驗收後使用者還會有一些報表需要實現。在開發C/S結構報表時使用PB，EXCEL，FORMULA ONE等工具埋頭畫表，在開發B/S機構的報表時使用ASP，XML/XSL等一個格一個格產生表；好半天完成了報表的樣式設計，以為可以歇口氣了，但還不行，還需要設計資料庫，設計產生報表的方法函數，還要設計修改報告的介面、儲存資料的函數；每一張報表都得開發人員親自完成；好不容易提交使用者測試了，使用者又說：某某表的格式不對、某某表的公式不對、某某表的大小不對、幫忙增加幾份新表……搞得人昏頭漲腦，剛剛才有的一點成就感、一絲輕鬆又被歎氣、唉聲給沖跑了……要是能讓使用者自己去做這些汙七八糟的事就好了！

正好接到一個金融系統的WEB辦公系統項目，要實現的報表就有厚厚的一大摞，這還只是初步的需求，乾脆，就設計一個“報表設計工具”，希望能解放以後的報表工作；當然，是在WEB上實現。

做報表設計工具，我以前做C/S結構的系統時就做過，也實現了（用PB6），使用者用的也挺好。但是有缺點：一是不好移植在WEB上使用，二是只能顯示報表，不能修改報告中的資料，當然更不能增加資料了。在WEB上又該如何?呢？

實現的方式

要做WEB報表設計工具，必須先要知道報表什麼東西？是如何產生和實現的？先理一理思路。

報表是什嗎？這個好說，就是把一些資料放在固定格式的固定位置上的表格。既然是表格，那麼就有“表”有“格”，先要一個“格”一個 “格” 地“拼”出一“行”或一“列”來，再要一“行（列）”一“行（列）”地“拼”出一個“表”來。

雖然同樣是由格子“拼”出來的，但有的表就好畫，有的不好畫，如1和圖2所示：



圖1



圖2

明顯地圖1所示的報表比圖2所示的報表要好“畫”，我們將圖1類型的表稱作“規整報表”，而將圖2類型的報表稱作“不規整報表”。

說了半天廢話，那麼報表到底是如何產生和實現的呢？本人認為不外乎兩種方式：“畫”和“填”。

“畫表”就是產生一格的同時也將資料按格式放在格子內，就是格式資料同時產生，這樣整個表格畫完了，表中的資料也有了，報表就產生了。這種方式適合於用來產生規整的報表，這樣才可以逐行或逐列的畫出該報表。這種方式的優點是產生報錶快（成批處理資料）、處理常式簡單（一個迴圈語句就可以了）。

“填表”與“畫表”完全不同，他是必須先有表格格式，然後將指定的資料填在指定的表格位置中就可以了。這種方式既適合於用來產生不規整的報表，也適用於產生規整報表。這種方式的優點當然就是適用範圍廣，但缺點也有，就是速度慢，因為它要先擷取表樣，然後一個一個地取出資料,再一個一個地填在格中。

那麼應該採取哪種實現方式呢？有兩種解決方案：

1．分開處理：讓使用者在設計報表時確定報表是否規整（這是很簡單的事），如果規整就讓該報表採用“畫表”方式產生，否則採用“填表”方式產生。

2．統一處理：全部採用“填表”方式產生。

本人覺得現在電腦的速度仍然在飛快的提高，硬體的“快”可以消除軟體的“慢”，但主要是為了簡化軟體的設計和處理，採用了第二種實現方式：填表。

決定了實現的方式，開始考慮一些細節和技術上的事情了：要實現這個WEB報表設計工具，需要考慮哪些方面的事情，需要解決一些什麼問題呢？

需要解決的問題

現在要考慮如何?了。剛開始，初略一想，不就解決這幾個問題嗎：

1．如何畫表即如何產生表樣？必須是在瀏覽器內實現喲！

——簡單：使用DHTML就行，結合使用XML/XSL。

2．如何儲存表樣？

——簡單：都存在資料庫的TEXT欄位中

3．如何與資料庫連接？

——簡單：專門定義一個屬性來與表示

4．如何顯示資料？

——簡單：使用DHTML技術、結合XML/XSL就可以實現

5．如何修改資料？

——簡單：檢測事件不就可以了嗎！

6．如何儲存資料？

——簡單：寫在資料庫中就行。

仔細一想，才發現這裡面問題多多：

7．怎麼畫表？用什麼畫？特別是必須在瀏覽器內實現。

8．如何設計表格樣式？如粗體、底線、斜體、小數字數、合并表格、刪除表格等等樣式設計操作。

9．表樣如何儲存？以什麼格式儲存？存在哪兒？

10．資料顯示的位置如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？又如何填資料？

11．單個資料顯示的格式如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？

12．報表如何與資料庫連接？如何擷取報表資料？擷取資料的條件如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？

13．使用者要新增一張報表，又沒有現成的資料庫表對應，該如何讓使用者來設計資料庫？資料庫又該如何設計？

14．使用者如何知道資料庫定義的含義？如何知道某個格應該取資料庫表中的哪個欄位、哪個記錄？

15．如何知道使用者修改（增加）了報表資料？該資料如何與資料庫表中的欄位對應？如何才知道哪些格中的資料合起來是資料庫表中的一條完整記錄？又怎樣才能知道使用者輸入的資料足夠組成一條完整記錄？怎樣儲存這些修改（增加）的資料呢？

16．有些根本不需要單獨建立資料庫表來儲存的資料，又該如何儲存？

17．報表的資料平衡關係設計？又如何定義？定義的結果如何儲存？存在哪兒？

18．自動計算公式如何?？又如何定義？定義的結果如何儲存？存在哪兒？

19．如何從其它報表中提取資料來產生新報表？如何定義？定義的結果如何儲存？存在哪兒？

20．如何定義報表的匯總（由分公司的資料產生總機構的資料）？定義的結果如何儲存？存在哪兒？

21．如何?資料的上報----即資料格式的轉換？轉換程式如何設計？如何儲存？存在哪兒？

……

越想問題越多，就越覺得麻煩，乾脆放棄算了——苦力就做苦力吧，象本人這種手腳慢的人，也許設計完這個工具的時間，一大堆報表早就做完了。

回頭看看為設計這個報表工具寫的筆記和收集的資料，心有不甘；再掂掂報表的份量，太重又太多——難道老做苦力嗎？不行！為自己的將來現在麻煩一點也值！可是這麼多的問題需要解決，千頭萬緒一團糟，該如何開頭呢？關鍵的問題是什嗎？

問題的關鍵

看看窗外的風景，等到靜下心來，再看看這些羅列的問題，一個問題一個問題逐個進行衡量和比較，才發現首先要解決的問題就是“表樣設計工具”該如何?。因為報表的設計、顯示、修改、儲存等全部操作都是在該工具環境中實現的，資料庫的串連、表樣的儲存等等工作都得圍繞該工具的表現形式和介面形式來實現和調整。

既然找到了工作的頭緒，那麼開始設計吧！不要忙，“工具”的設計方案還沒有定呢！

幾種方案的比較

要在WEB上實現表樣的設計有很多種方案可供選擇：

1．使用XML/XSL/DHTML/HTML技術來實現

2．利用IE的WebBrowser ActiveX 控制項來實現

3．自己寫ActiveX控制項

4．自己寫Java Applet來實現

5．借用現成的第三方控制項實現

那麼哪種方案對本人來講是比較好的呢？

先來瞭解各個方案的特點，將結果清單如下：



如果能夠擷取免費的第三方軟體，無疑是第5種方案最好。找找看，有沒有。還真找到了，就是Microsoft Office Web Components 中的SheetSpace控制項,雖然不是免費的（必須要MS Office2000+支援），但使用者都有使用MS Office,不僅開發成本降了，使用者操作也習慣，就選他了——Microsoft Office Web Components中的SheetSpace控制項。

解決的辦法

既然關鍵的問題解決了，其它的就都好辦了，下面整理後列舉了相關問題的解決辦法：

1．如何畫表即如何產生表樣？必須是在瀏覽器內實現喲！

——在Microsoft Office Web Components中的SheetSpace控制項內設計表樣，或者在MS EXCEL內設計好表樣，再將其匯入到Microsoft Office Web Components中的SheetSpace控制項中顯示出來；設計一個匯入MS EXCEL的程式。資料顯示格式、分頁、固定表頭、字型大小、顏色等等都在設計在表樣中。

2．如何儲存表樣？以什麼格式儲存？存在哪兒？

——將Microsoft Office Web Components中的SheetSpace控制項的結果存在資料庫的TEXT欄位中。表樣的格式是 MS EXCEL 的HTML格式，由Microsoft Office Web Components中的SheetSpace控制項可以直接擷取。

3．如何與資料庫連接？

——專門定義一個欄位屬性來表示該報表對應的資料庫表(table)

4．如何顯示資料？

——將報表資料從資料庫中提取後以XML的格式儲存在用戶端，在Microsoft Office Web Components中的SheetSpace控制項內顯示，將擷取的報表資料填在指定的儲存格內。

5．如何知道使用者修改（增加）了報表資料？該資料如何與資料庫表中的欄位對應？如何才知道哪些格中的資料合起來是資料庫表中的一條完整記錄？又怎樣才能知道使用者輸入的資料足夠組成一條完整記錄？

——檢測Microsoft Office Web Components中的SheetSpace控制項的change事件,將目前儲存格的值與未經處理資料比較，不相同則修改未經處理資料，共置修改標誌。該資料與資料庫欄位的對應關係根據公式解釋得來。這樣也就可以知道哪些格中的資料合起來是資料庫表中的一條完整記錄。對於增加的資料，專門設計一個輸入工具，來提示使用者需要輸入哪些資料才是完整的。

6．如何儲存資料？

——對於XML中有修改（增加）標誌的資料向伺服器提交，伺服器處理該資料再修改資料庫中對應的資料。

7．如何設計表格樣式？如粗體、底線、斜體、小數字數、合并表格、刪除表格等等樣式設計操作。單個資料顯示的格式如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？

——Microsoft Office Web Components中的SheetSpace控制項提供了這些操作函數，將這些函數以菜單的形式表現在頁面上，提供使用者操作的手段。使用者操作產生的結果儲存在表樣中，在表樣儲存的時候一起儲存在資料庫中。

8．資料顯示的位置如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？又如何填資料？

——設計一個公式設計和解譯器，將要顯示的資料以公式的形式儲存在表樣中，該公式所在的位置就是資料要顯示的位置，該公式所在儲存格的格式就是資料的顯示格式（如字型、顏色等等）。該公式同表樣儲存在一起。在顯示資料的時候，根據公式來擷取資料，並將其填入儲存格中。

9．如何擷取報表資料？擷取資料的條件如何定義？怎樣定義？定義的結果如何儲存？存在哪兒？

——每份報表都定義“查詢條件”屬性，由該屬性來擷取一份完整的報表資料內容。該查詢條件直接對應了資料庫的欄位；該屬性同報表表樣一起儲存在資料庫中。

10．使用者要新增一張報表，又沒有現成的資料庫表對應，該如何讓使用者來設計資料庫？資料庫又該如何設計？

——設計一個在WEB頁面上設計資料庫的工具，讓使用者根據自己的實際需要來設計資料庫結構。

11．使用者如何知道資料庫定義的含義？如何知道某個格應該取資料庫表中的哪個欄位、哪個記錄？

——由於提供了資料庫的設計工具，用該工具設計的資料庫結構要求必須填寫該欄位的標題，即對該欄位的含義說明；在使用者定義公式的時候，顯示的不是枯燥的英文欄位名稱，而是該欄位的標題，便於使用者理解。

12．有些根本不需要單獨建立資料庫表來儲存的資料，又該如何儲存？

——將不需要單獨建資料庫的報表我們區分開來，全部存放在一個公用的表(table)中，該表(table)中的資料既包含了報表樣式又包含了報表資料。

13．報表的資料平衡關係設計？又如何定義？定義的結果如何儲存？存在哪兒？

——報表的資料平衡關係完全用EXCEL的計算公式來實現。該公式同表樣儲存在一起。Microsoft Office Web Components中的SheetSpace控制項可以支援絕大部分的MS EXCEL的公式。公式的用法和文法同MS EXCEL完全相同。

14．自動計算公式如何?？又如何定義？定義的結果如何儲存？存在哪兒？

——使用MS EXCEL的計算公式來實現，如sum,avg等等，該公式同表樣儲存在一起。

15．如何從其它報表中提取資料來產生新報表？如何定義？定義的結果如何儲存？存在哪兒？

——報表具有一個屬性叫做“取數程式”，用來從其他的資料庫表(table)中提取資料插入本報表對應的資料庫表 (table) 中。

16．如何定義報表的匯總（由分公司的資料產生總機構的資料）？定義的結果如何儲存？存在哪兒？

——報表具有一個屬性叫做“匯總程式”，用來從下級機構的報表中摘要資料產生本機構的報表資料。

17．如何?資料的上報----即資料格式的轉換？轉換程式如何設計？如何儲存？存在哪兒？

——上報資料其實就是資料格式的轉換，通過使用XSL可以十分方便的設計出來。該XSL轉換程式以文字檔的形式儲存在一個指定的目錄中，檔案的名稱與報表一一對應。要產生上報資料的時候，將報表資料執行該轉換後產產生一個文字檔，儲存在用戶端機器的使用者指定位置上即可。

一份報表的完整定義儲存在資料中，該資料庫表的結構為：

　


表2：報表定義結構

為了操作的方便，又增加了批量處理的功能，讓使用者可以批量提取資料、摘要資料，簡化使用者的操作。

報表的全部處理流程就是這樣的：

1．設計資料庫定義

2．設計報表樣式

3．插入取數公式

4．設定查詢條件

5．設計匯總程式

6．設計取數程式

7．查詢報表

8．匯總報表

9．批量匯總報表

10．提取報表資料

11．批量提取報表資料

12．產生上報檔案

設計效果

好了，單槍匹馬苦戰一個多月，編碼工作終於全部完成了，設計資料庫的介面3所示，設計報表的介面4所示。



圖3：資料庫設計介面



圖4：報表設計介面

給使用者試用，效果還不錯，幾十份各式各樣的報表全部輕鬆解決。皇天不負“苦”心人。按照這種方式，本人又用一周的時間設計出了一個圖表設計工具，使用者反應也很好。圖表設計介面4所示。



圖4：圖表設計介面

總結

本文討論了一種行之有效WEB報表設計工具的實現思想，並將實現。對於需要大量設計報表的使用者，特別是報表格式和數量經常變化的使用者，使用將非常方便。對於開發人員，也可以減少大量的工作。

