Button 按鈕

2022-05-17, yii

# 標題 內容
1 Status 通用
2 Zeplin zpl.io/bJ8zmRD
3 Ant Design https://ant.design/components/button-cn/
4 Web #
5 App #

定義

按鈕用於開始一個即時操作。

何時使用

用於開啟一個閉環的操作任務,如「刪除」對象、「新增」商品等。

位置

位於卡片內、表單。

規則

主按鈕

整個頁面中優先級最高的使用操作。一個頁面內主按鈕使用數量建議 1-2 個。

次級按鈕

用於沒有主次之分操作。

連結按鈕

一般用於連結,點擊連至某位置。

動作按鈕

用於列表動作欄,依排序為 - (1)檢視 (2) 編輯 (3)複製 (4)下載檔案 (5) 列印 (6)作廢 (7)刪除

以下為按鈕上的文案與其含意。
名稱 用途與定義
儲存 主按鈕,用於新增、編輯、複製後一個完整的動作結束時的檔案儲存。
確定 主按鈕,用於某個事件中的事項確定,如:快速新增抽屜確定新增項目。
清除 主要按鈕
  1. 用於清除搜尋條件時使用。
  2. 用於清空已填寫的欄位,搭配警告popup 「確定要清除資料?」使用。
編輯 主按鈕,用於進行編輯修改使用。
+加入 主按鈕,用於在編輯頁中加入項目(選擇一個或選擇多項的抽屜)按鈕。
+新增 主按鈕,用於在模組列表中加入一個新項目的按鈕。
上一步 次級按鈕,有步驟條時使用,表示返回上一步。
下一步 主按鈕,有步驟條時使用,表示進入下一步。
返回 次級按鈕,表示返回至列表頁。
取消 次級按鈕,用於放棄已經編輯內容或正在執行中的動作。
匯入XXX 次級按鈕,用於在模組列表中,為進行匯入資料的動作。

類型

置底按鈕:主按鈕+數個次級按鈕
卡片:右上新增按鈕
表單:新增選項
搜尋:搜尋按鈕
彈窗:確定按鈕