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

1 評論 4955 瀏覽 18 收藏 6 分鐘

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

一、應(yīng)用場景:為何需要枚舉字典?

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

枚舉字典:

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

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

二、枚舉字典設(shè)計說明

1. 列表頁面展示

1)枚舉字典一級頁面

定義業(yè)務(wù)字典名等信息,每項字典下?lián)碛凶约核鶎俚淖值渲导?,例如用戶性別{男,女,未知}。

檢索條件支持字典名稱和狀態(tài)。

枚舉字典一級頁面

2)枚舉字典二級頁面

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

檢索條件支持字典標(biāo)簽和狀態(tài)。

枚舉字典二級頁面

2. 功能展示及說明

1)新增字典

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

字典標(biāo)簽用來定義具體的枚舉值,字典鍵值用數(shù)字來標(biāo)記字典標(biāo)簽,是一一對應(yīng)的關(guān)系,字典標(biāo)簽用來控制字典枚舉在列表上的展示順序。

字典新增提交默認(rèn)狀態(tài)為啟用狀態(tài),用來控制此條字典在系統(tǒng)中的可用性。

新增字典頁面

2)新增字典枚舉

設(shè)計定義的枚舉值字段如圖:字典標(biāo)簽、字典鍵值、字典排序、備注。

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

新增字典枚舉頁面

三、應(yīng)用說明

用來維護系統(tǒng)各種的下拉選擇框的枚舉值。

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

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

開發(fā)人員可以根據(jù)系統(tǒng)頁面設(shè)計需要,將枚舉處理成其他結(jié)構(gòu)的數(shù)據(jù)來使用。

四、擴展優(yōu)化思路說明

級聯(lián)樹狀枚舉字典

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

而級聯(lián)式的枚舉字典是這樣的:

設(shè)計級聯(lián)樹狀的枚舉字典能夠支持更復(fù)雜的業(yè)務(wù)邏輯需要。

五、小結(jié)

枚舉字典的設(shè)計也是為了能夠提高生產(chǎn)效率,便于數(shù)據(jù)的統(tǒng)一維護。

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

六、其他界面設(shè)計方案

界面設(shè)計方案之 (2)模型類頁面設(shè)計思路http://theventurebank.com/share/5918537.html

本文由 @猶豫就會敗北 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

題圖來自Unsplash,基于CC0協(xié)議

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 級聯(lián)的到底是字典,還是字典枚舉。沒有說清楚呀!

    來自廣東 回復(fù)