界面設計方案之 (1) 枚舉字典如何設計

1 評論 4268 瀏覽 16 收藏 6 分鐘

下面這篇文章是筆者講述的關于在界面設計方案中,枚舉字典設計說明等的相關內容,想要了解的同學可以了解一下哦!

一、應用場景:為何需要枚舉字典?

所謂枚舉就是能夠明確列出有限個具體取值的東西,在具體場景中,例如事件緊急程度:高、較高、中、較低、低,性別:男、女、未知。

枚舉字典:

類似于excel中的枚舉。將業務中可以枚舉的項,定義成枚舉字典,供全局使用。

設計枚舉字典頁面的好處就是,前端的視圖頁面面向普通系統用戶,用戶或者非代碼專業人員可以自定義枚舉值,開放性維護;再者當同樣的枚舉在多處使用時,僅需定義一次,當枚舉值因業務需要發生增減或變更時,也只需要在枚舉頁面修改一次。

二、枚舉字典設計說明

1. 列表頁面展示

1)枚舉字典一級頁面

定義業務字典名等信息,每項字典下擁有自己所屬的字典值集,例如用戶性別{男,女,未知}。

檢索條件支持字典名稱和狀態。

枚舉字典一級頁面

2)枚舉字典二級頁面

點擊字典英文名藍字進入下鉆二級頁面,展示定義的字典的具體枚舉值,例如男,女,未知就是性別字典的具體枚舉值。

檢索條件支持字典標簽和狀態。

枚舉字典二級頁面

2. 功能展示及說明

1)新增字典

設計定義的字段如圖:字典的中文名、字典英文名、字典備注、字典枚舉定義(包括字典標簽、字典鍵值、字典排序、字典備注)。

字典標簽用來定義具體的枚舉值,字典鍵值用數字來標記字典標簽,是一一對應的關系,字典標簽用來控制字典枚舉在列表上的展示順序。

字典新增提交默認狀態為啟用狀態,用來控制此條字典在系統中的可用性。

新增字典頁面

2)新增字典枚舉

設計定義的枚舉值字段如圖:字典標簽、字典鍵值、字典排序、備注。

除了可以在一級頁面新增字典的同時定義字典的枚舉,還可以在二級頁面的新增功能里,單獨定義一條字典的枚舉。

新增字典枚舉頁面

三、應用說明

用來維護系統各種的下拉選擇框的枚舉值。

我們在設計和開發系統時,會有許多用到枚舉下拉框的地方,這些具體的枚舉變量混在在前后端代碼里面是一種很不規范的開發行為。

有了枚舉字典以后,就可以在前端顯式地維護枚舉值并入庫,開發人員可有根據自己的業務需要去綁定枚舉字典并取出字典的枚舉值。

開發人員可以根據系統頁面設計需要,將枚舉處理成其他結構的數據來使用。

四、擴展優化思路說明

級聯樹狀枚舉字典

上文給出的枚舉字典的例子是這樣的:

而級聯式的枚舉字典是這樣的:

設計級聯樹狀的枚舉字典能夠支持更復雜的業務邏輯需要。

五、小結

枚舉字典的設計也是為了能夠提高生產效率,便于數據的統一維護。

其次像這種典型的下鉆頁面也是一種很好的設計思路,讀者們可以自行在未來的實踐中嘗試這種方案。

六、其他界面設計方案

界面設計方案之 (2)模型類頁面設計思路http://www.aharts.cn/share/5918537.html

本文由 @猶豫就會敗北 原創發布于人人都是產品經理。未經許可,禁止轉載。

題圖來自Unsplash,基于CC0協議

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 級聯的到底是字典,還是字典枚舉。沒有說清楚呀!

    來自廣東 回復