純前端開發案例：用 SpreadJS 搭建資訊系統軟體開發平臺

一. 企業背景 福建華閩通達資訊科技有限公司成立於 2007 年，是一家致力於工程專案管理、電子政務、電子商務及企業 ERP 實現的 SAAS、PAAS 服務提供商，整合工程管理各環節的資源，構建行業健康生態鏈。

二. 專案概況 R 平臺採用了面向業務人員的開發模式，結合現代工業“流水線裝配”的生產理念，提供大量構件助力客戶專案快速搭建。SpreadJS 表單控制元件主要用於平臺 Excel 表格和基於單元格的報表的定製。

三. 選擇葡萄城控制元件產品的主要原因 選擇葡萄城控制元件最重要的原因是其強大的無編碼模板設計器功能。

無編碼模板設計器：R 平臺的 B/S 模組需要實現非專業程式設計師線上設計 Excel 報表模板或匯入現成的 Excel 模板加以修改，將製作完成的模板列印或者匯出成 Excel 儲存至伺服器，葡萄城的 SpreadJS 是一個基於 HTML5 技術的純 JavaScript 控制元件，控制元件效能流暢，有類似 Excel 的 SpreadJS 線上表格編輯器，適合非專業程式設計師設計 Excel 報表模板，很符合 R 平臺（B/S 部分）無編碼開發的理念。

四. 實際使用情況 （一） 用於 R 平臺 C/S 部分的生成報表模板在 B/S 模組中展示 SpreadJS 支援 Excel 格式，通過將 C/S 端生成的報表模板儲存成 Excel 檔案，利用 SpreadJS ExcelIO 匯入匯出元件，將例項匯入 SpreadJS 並在瀏覽器中展現。

模版執行例項在 SpreadJS 中的展現如圖：

（二）、用於 R 平臺 B/S 部分的報表表單定義模組

R 平臺用 SpreadJS 實現了一個基於 B/S 架構的表單報表定義工具。因為 SpreadJS 是類 Excel 功能的控制元件產品，很適合業務人員進行報表表單模版的定義，基本會 Excel 就會定義報表，大大減少了培訓成本，並且很契合公司 R 平臺無編碼和由業務人員定義軟體的目標和宗旨。如下圖所示，使用者可以線上進行編輯報表模板，並且編輯風格基本與 Excel 一致，業務人員只要會用 Excel，無需再次學習，節省了培訓的時間和成本。

通過呼叫 SpreadJS 各種功能 API 並將其進行組合，滿足了一些 Excel 沒有但是專案中需要用到的定製功能，如下圖所示，使用者可以填寫報表工具中區域的各項屬性。

在資料儲存時進行各項設定。

報表列印時進行列印設定，只需在下拉選項中進行選擇，即可完成不同樣式的報表列印。

五. 葡萄城控制元件產品對於專案的價值 SpreadJS 控制元件主要用於本專案中的報表設計，展示，列印等功能。參與設計報表的人員完全不需要懂程式碼知識，只要會用 Excel 就可以參與設計報表，很符合 R 平臺線上設計無編碼開發的理念，並且類 Excel 的操作模式很符合設計人員的使用習慣，大大的加快了工作效率，是日常工作的好幫手。

Spread 表格開發系列，各平臺輕鬆整合和操作 Excel！

SpreadJS 和 Spread Studio 都已於近日釋出 V11.1 版本，敬請訪問官網，瞭解更多。

訪問 SpreadJS 官網：www.grapecity.com.cn/developer/s… 訪問 Spread Studio 官網：www.grapecity.com.cn/developer/s…