筆者有OA系統的設計經驗，本系列將分篇章總結OA中最核心的功能，希望能儘可能全面地記錄筆者的經驗，和感興趣的讀者交流分享。
這次我們探討OA系統裡另一個重要的功能模塊——表單。表單包括行政類單據，如請假單、設備申請單、用車申請單等；統計調查類單據，如人員信息統計表、團建活動報名表、調查問卷等。
線下一般有相應的紙質單據，填寫人完成填寫後可能經由多級領導審批，最終歸口到某部門或某負責人。每種表單會關聯一套流程，流程之間可能各不相同。所以表單模塊要和流程模塊緊密合作才能提供完整的線上服務，這也是為什麼我會在上一篇的流程模塊之後緊接著寫表單模塊。
下面具體探討一下表單模塊的設計。
一、表單設計頁面
表單設計頁面一般包括控制項庫、設計區、屬性面板。如下圖所示。
宜搭的表單設計頁面
操作方式一般是用滑鼠拖拽控制項，在設計區合理地擺放控制項，在屬性面板設置控制項和頁面的屬性。
二、表單樣式
1. 網際網路式
這種表單樣式是我們在網際網路上最常見到的，直接看個例子：
用宜搭創建的表單
對於大部分企業而言這種表單形式是極好的選擇。它的特點包括繪製簡單，只需要把表單控制項有序地向下堆疊即可；表單長度可以隨意延展，多少欄位都能放的下；界面簡潔明了，填寫體驗好。
但如果是面向政府單位的政務系統，這種表單不一定被客戶接受，下面的第二種表單樣式更被青睞。
2. 線下表單復刻式
這種表單樣式完全複製線下紙質表單的樣式，常常被用於政府單位，原因包括以下兩個方面：
有些政府單位有留檔的需求，線上表單走完流程之後需要列印出來並歸檔，所以線上表單樣式要和線下的儘量保持一致；政府單位的信息化水平不及長期接觸網際網路的大眾用戶，所以政府單位更保守，更願意沿用以往的工作模式。而且政府單位的領導往往年紀較大，他們已經習慣了紙質表單的樣式，使用線下表單的樣式可以照顧領導的使用體驗。我們來看下面的例子，來自於致遠政務系統的官網。
致遠-複製線下樣式的線上表單
這種表單的繪製方式有兩種：
（1) 基於XML代碼
在word中繪製好表單，複製表單並解析成XML代碼，在OA系統中根據XML代碼渲染出來。然後需要布置單選框、文本框等控制項，新增控制項其實只是增加了一段XML代碼。
當然，這些實現原理是開發團隊的業務範疇。
在微調表單的時候這種方式並不方便，而且根據調整操作來修改XML代碼的代碼邏輯比較複雜，有時甚至需要實施人員手動修改XML代碼。
所以產品設計層面需要提供手動修改XML代碼的功能，現場實施人員可以通過修改XML代碼調整表格的樣式。
（2) 基於圖片
在word中繪製好表單，導出成圖片，把圖片導入到OA系統中作為底圖。然後把表單控制項擺放到合適的單元格內。
這種方式的好處在於快捷，操作難度低。但問題也很明顯。
大小不一的表單控制項需要被完整地放入單元格線框內，繪製過程並不愉快。項目實施人員要極為專注地調整輸入框的大小，像素級精準地調整輸入框的位置，效率之低可以想像，更可怕的是一個項目中可能要繪製上百個不同的表單。
在布置控制項的時候如果可以自動調整控制項大小並吸附到單元格內，上面的問題就迎刃而解了。技術上是可實現的，親測使用體驗很爽。
三、表單控制項
常見表單控制項的種類和關鍵屬性包括：
1. 布局類
柵格：適用於網際網路式的表單，用於設置一行有幾列以及每列的寬度；分隔線：把表單縱向劃分成若干區域。可設置分隔線的名稱。
2. 文本類
單行文本框：可提供校驗規則，比如格式是郵箱、手機號、正則表達式、字符長度等；多行文本框：同上；數字框：可校驗是整數、小數、正數、負數等；標籤：可以用作表單欄位的名稱，如「姓名」，或備註說明。
3. 選擇類
單選框：可自定義選項，調整選項順序，選項縱向排列或橫向排列；多選框：同上；下拉框：可自定義選項，調整選項順序，單選或多選；人員選擇：用於選擇單位內的用戶。可設置單選或多選；部門選擇：用於選擇部門。可設置單選或多選；日期：可設置日期的格式（年月日時分秒的組合），可選範圍；日期區間：同上；地區：可設置格式，如省市區、省市、省等；國家：可設置單選或多選；評分：可設置分值範圍，是否允許半分。
4. 其他
上傳圖片：可設置最多上傳數量，圖片解析度限制；上傳附件；可設置最多上傳數量，附件大小限制；添加超連結：讓用戶可以添加超連結，比如部門團建活動建議收集表要求部門成員提交自己的想法，可以附上關於活動場所介紹的網頁連結。可設置最多添加數量；圖片：放置在表單中的圖片。可從本地上傳，或指向某個連結地址；超連結：用戶點擊後打開對應的網頁。可以設置連結地址和顯示的文案，比如「這是一個連結」。幾乎適用於所有控制項的通用屬性包括提示文案、默認值。
關於控制項是否必填、只讀、可編輯、隱藏等設置，在上一篇文章提過，最好在與表單相關聯的流程裡配置，因為不同流程節點的要求不同。
#相關文章#
OA系統設計（1）：流程
本文由 @Twincus靚 原創發布於人人都是產品經理。未經許可，禁止轉載。
題圖來自於Pexels，基於Pexels License