零起點入門系列：如何把一張紙單變成在線表單？

簡介：【零起點入門系列教程】將會帶給你們從業務視角出發由淺入深地學習用宜搭實現應用搭建。即使是沒有任何代碼基礎的新手只要跟着系列課程，從0開始慢慢修煉，也能找到成功搭建應用的樂趣。今天第二講，介紹大部分人建立應用的廣泛需求——如何把一張紙單變成電子表單？

【零起點入門系列教程】將會帶給你們從業務視角出發由淺入深地學習用宜搭實現應用搭建。即使是沒有任何代碼基礎的新手只要跟着系列課程，從0開始慢慢修煉，也能找到成功搭建應用的樂趣。今天第二講，把一張紙單變成電子表單。

建立應用，大部分人的第一個需求廣泛是「如何把一張紙單變成電子表單？」。今天咱們就來解決這個問題。

須要理解一個概念，每一個頁面對應的就是一張傳統紙質審批單。一張紙單怎麼變爲電子表單？這裏有幾個對應關係：

<span> </span>	<span>傳統紙單</span>	<span>電子表單</span>
表單	表格裏手寫文字	用組件庫對應實現，按數據類型分類
審批	找審批人簽字	自動識別審批人，推送任務流
數據	對照紙單人工錄入統計	自動在線統計數據

接下來以具體的一張請假單、出差申請單，來看看紙單是如何變爲在線表單的。 ### 設計請假表單 在設計表單前，首先須要拆解一下紙質表單包含的要素。仔細看這份請假單，它其實分爲3個模塊。 * 第一塊是要申請人填寫的表單內容； * 第二塊是須要審批人簽署審批意見； * 第三塊是跟隨表單一塊兒遞交的附件； 而在線表單，不是簡單的將這張紙單原封不動的演繹成電子版。你會發現，任何一項審批工做都包含：填寫表單、審批流程、追蹤統計數據這三個步驟。 在本來的紙質世界裏，不具有數據統計和分析的能力，而經過宜搭實現業務在線化，這些事情均可以自動完成。 接下來，讓咱們來分析一下紙單文字變成電子表單過程當中會使用的對應組件，來完成對請假單的紙單轉化。

紙單文字	對應組件	用途
請假人	<span>成員組件</span>	爲用戶提供人員選擇的功能
部門	<span>部門組件</span>	開啓多選模式，能夠選擇多個部門
請假類型	<span>單選組件</span>	用於在有限的、互斥相關選項中選擇一個選項
請假時間	<span>日期組件</span>	各種的時間標準格式
請假事由	<span>單行文本</span>	能夠輸入255個字符內文本。多行文本不限
附件	<span>附件組件</span>	能夠上傳視頻、圖片等附件

### 分步操做 根據上一節課程的內容 【零起點入門教程①】1分鐘極簡操做，新手也能搭應用，初級階段啓動一個應用分爲6步，在左側的分組當中，能夠看到請假的業務模連接塊，點擊該分組，分組內有包含請假申請的一張流程表單，點擊該流程表單能夠看到關於流程表單的一個大體的預覽狀態，點擊右上角的編輯進入到修改狀態。 以下圖所示，對照電子的請假單，第一項能夠看到請假人的輸入項，因此在表單設計器內拖動相應的組件到畫布中，做爲請假人的一個輸入項，經過成員組建，做爲請假人的一個信息輸入字段。 拖動組件到表單當中以後，下圖所示，能夠看到關於組件的一些標題信息，還有一些基礎屬性信息，點擊標題來編輯它的一個標題，選擇狀態屬性，模板內還提供提交人組件的狀態，而且它配置了默認公式。 部門的字段，能夠看到表單設計器內並無包含部門的一個輸入項，因此在組件庫內拖動部門組件，來做爲這一張在線表單的一個部門字段的輸入項，能夠去把它的狀態勾選爲必填，用戶在提交這張表單時，必需要填完部門信息才能夠提交。 請假類型，在紙質的單裏面能夠看到其餘類型，是一個點選的模式，可是模板內提供的是一個下拉選擇的模式，因此須要修改它的組件類型，當前用的是下拉單選，能夠刪除此組件，而後拖動相應的單選組件到表單設計器的指定位置中，去修改它的標題爲請假類型，修改它的必填項，最後逐個去修改內部內置的選項，咱們的指示當中提供了請假事假的其餘類型，以及病假年假、婚嫁、產假、陪產假等。定義完類型以後，能夠看到單選主鍵，它與下拉單選主鍵的區別就是在於單選組件能夠把內部的選項平鋪在整個表單中。 請假時間，請假時間它是一個區間段，因此用了兩個日期組建做爲請假的開始和結束時間，直接拖動日期組建到指定的位置當中，在右側去編輯標題，還有用戶在選擇日期時的格式，能夠選擇到某一具體的某一天或者某一個小時以及某一分鐘，添加完時間日期組件以後，會涉及到自動計算時長的組件，以後會詳細展開講述。 請假事由，是採用了多行文本做爲它的一個輸入項，不用單行，由於單行文本它的輸入字符的長度是有限制的，目前只支持輸入255個字符，而多行文本是沒有字符上限的。 關於圖片，如請病假的時候，須要提交一些附件，一個病例本或者一些醫院證實，採用了一個圖片組件，同時你們也能夠採用附件組件，直接拖動圖片組件到設計器當中，拖動進的組件與模板內置的組件的圖片樣式不太相同，能夠點擊這個圖片組件在右側去修改它的一個上傳類型，來實現對整個圖片組件上傳的一個樣式修改。 這樣整個表單就設計完成了，能夠去點擊右上角的預覽，來大概預覽一下用戶訪問到的在線表單的樣子，確認無誤以後再切換回表單設計器，點擊右上角的保存，保存完畢以後，點擊左上角的應用名稱回到應用後臺管理頁。 因爲請假單還包含了流程審批的部分，因此須要在這個表單右側的流程設置模塊當中去定義它的審批人以及審批規則，以下圖所示，能夠看到點擊切換到流程模塊以後，流程審批人裏面會內置一個發起人的節點，刪除此節點，從新添加一個新節點。如主管是巴雷，就直接搜索巴雷，而後點擊添加一個審批節點，讓她做爲當前這一個流程的審批人，而後點擊保存，確認無誤以後，點擊右上角的保存併發布流程，此時它會有一個流程發佈成功的提示，點擊上線，上線完畢以後用戶就會正常的去提交數據，提交請假申請。 將一張傳統的紙單變爲在線表單，經過這個案例發現紙質的表單數據凌亂，分散在各個業務環節，且數據不可見，推動和彙總緩慢，在線的表單能夠把這件事拆解爲三個模塊，分別對應的是表單流程數據，發起人填寫的表單，各種數據整合爲一體，透明可見的審批流程，移動在線，再也不須要去辦公室門口等待領導簽字，自帶數據彙總和查詢，便於隨時追溯和統計分析。 \>>>>點擊收看 視頻版課程 歡迎釘釘掃碼關注「宜搭」服務窗，瞭解更多宜搭產品培訓、最新功能和客戶案例 > 本文內容由阿里雲實名註冊用戶自發貢獻，版權歸原做者全部，阿里雲開發者社區不擁有其著做權，亦不承擔相應法律責任。具體規則請查看《阿里雲開發者社區用戶服務協議》和《阿里雲開發者社區知識產權保護指引》。若是您發現本社區中有涉嫌抄襲的內容，填寫侵權投訴表單進行舉報，一經查實，本社區將馬上刪除涉嫌侵權內容。