今天，教大家如何用AXURE做一個管理后臺頁面框架。

本文以員工信息為案例，展示中繼器增、刪、改、查+導入+導出+排序的真實效果。包括直接在中繼器修改和彈出頁面修改兩種模式，只需要導入數據，就可以直接使用。

在線演示地址：http://90ymyy.axshare.cn/#g=1&p=案例員工信息（同一頁面維護）

一、效果介紹

兩種模式均有模板，使用非常簡單。

用了模板之后，只需要填寫中繼器內容，刪除不需要的搜索/篩選框，修改文本框提示文字即可使用。

篩選條件不用自己寫，系統能自動根據中繼器內容自動添加（由于模板篩選的中繼器較多，所以加載大約需要10秒時間，請耐心等待，刪除不需要的篩選條件后反應很迅速，如案例）。

模板如下：

1. 查詢：包括模糊搜索和篩選，輸入或選擇后，點擊查詢按鈕即可查詢

1）模糊查詢

能對中繼器列表每一列進行模糊搜索，不需要的搜索框直接刪除即可。

2）篩選

根據列表自動生成篩選內容，不會重復添加，不需要的篩選框直接刪除即可。選擇后需點擊查詢按鈕。

3）重置

點擊后清空搜索框和篩選條件。

2. 添加：添加完成后會更新到中繼器列表

1）直接在列表添加

2）彈出窗口添加

3. 編輯：和新增一樣，可以直接在頁面修改，也可以在彈窗修改，修改完后會更新到中繼器

點擊編輯按鈕或雙擊所在行即可進入編輯。

1）接在列表編輯

2）彈出窗口編輯

4. 刪除：可以單獨刪除，或者多選后批量刪除

5. 導入：可以模擬選擇文件

6. 導出：可以真實下載excel文件模板

7. 排序：可以升降序切換，模板提供每一列的升降效果，可根據具體情況使用

8. 頁數和條數：會根據添加和刪除自動更新，能選擇每頁顯示條數

二、制作方法

1. 材料準備

輸入框，下拉多選框，按鈕，上下箭頭。

2. 邏輯思路

將中部每一列的內容，傳到每個多選框內，選中多選框。然后其他的就是中繼器的增刪改查的內容了。

3. 具體交互

1）查詢

2）新增

3）編輯

4）刪除

5）導入

6）導出

7）排序

8）翻頁

該原型非常實用，但制作相對復雜，新手不容易完成。

制作完成后，以后使用方便，僅需簡單填寫樹中繼器的內容，即可擁有完美的效果，所以強烈推薦給各位使用。

本文由 @梓賢Vigo 原創發布于人人都是產品經理。未經許可，禁止轉載

題圖來自Unsplash，基于CC0協議