場景:

前端需要展示一個列表（如：首頁的輪播圖），後臺需要能夠控制列表資料的排序。

需求：

自動規則 + 運營幹預，干預包括：降低排名，提升排名，設定位置和新增item

實現：

在Web後臺管理系統中，列表形式的資料排序功能是很常見的需求。要實現這類功能，給資料表增加一個排序欄位order，越大排名越靠前，數字相同時按照自動規則（如：id）排序，這樣，就可以實現了：

實際的排序顯示為：

jack
tom
bob

既然是後臺，那麼主要的使用者是公司的運營人員，本著提高使用效率的原則，在草稿紙上畫了個原型讓運營對比，然後來得出哪個更符合他的使用習慣，再做確定，結果溝通下來運營理想中操作是想要在後臺直接拖動排序。

現在問題來了，應該怎麼設計這個運營幹預的功能：

• 方案1：填寫數字
• 方案2：上移、下移
• 方案3：手動控制加分or減分（+1/-1 +10/-10）
• 方案4：如運運營所想，提供拖動排序功能

方案1的技術實現最簡單，對開發來說最方便，但對運營來說卻比較麻煩。

方案2的技術實現其實較複雜，比如上移一位，需要先查詢當前項的前一項的order, 然後讓當前項的order+1並儲存, 對運營來說操作較簡單。

方案3的技術實現比較簡單，比如點選-10，只需更新當前項的order-10並儲存，但有可能在order-10後當前項的順序還沒有變（如：前一項：12，當前項11，後一項：0），對運營來說操作比較簡單。

方案4的技術實現比較複雜，需要使用js實現拖拽資料項的效果等，在拖動結束或點選儲存後判斷當前的所有資料順序並儲存，對運營來說操作簡單。

綜合比較

技術實現複雜度：方案1<方案3<方案2<方案4

操作便捷性：方案4<方案3<方案2<方案1

分析一下大多數的場景，看到列表的資料是有限的，一般都是5條、10條、20條左右，由於我所在的是創業公司，開發資源有限，選擇方案3在當前情況下是合適的實現方式。

經過了一番溝通，在許諾了下午茶後，說服了產品、運營接收這中方案。

圖中就是我用方案3實現的一個介面，單個箭頭的是+1 -1，倆個箭頭的分別是+10 -10