[FEATURE] - [UI] Certificate List - Certificate 上傳進度的進度條

[TzuHanLiang]

Summary

懸浮在 Certificate List 的右下角裡面的進度條

Tasks

Dependencies

Frontend Framework

Other Dependencies

No response

Additional Notes

No response

[TzuHanLiang]

以下是 Certificate 上傳進度條 中提供的具體功能，包括「暫停」和「刪除」功能：

上傳進度條功能

1. 暫停上傳功能（Pause Upload）

   • 描述：在上傳進度條的旁邊提供一個「暫停」按鈕，讓使用者可以暫停當前正在上傳的檔案。
   • 功能：
     • 使用者可以點擊暫停按鈕來暫停檔案上傳，進度條將停止更新並保持當前進度。
     • 當上傳被暫停時，暫停按鈕應更改為「繼續」按鈕，讓使用者可以重新開始上傳。
     • 觸發 onPause 回調函數，執行暫停邏輯。

2. 繼續上傳功能（Resume Upload）

   • 描述：當檔案上傳被暫停後，「暫停」按鈕應切換為「繼續」按鈕。
   • 功能：
     • 點擊「繼續」按鈕後，上傳將重新開始，進度條應繼續更新。
     • 觸發 onResume 回調函數，重新啟動上傳過程。

3. 刪除上傳功能（Delete/Remove Upload）

   • 描述：提供一個「刪除」按鈕，讓使用者取消並刪除正在上傳的檔案。
   • 功能：
     • 點擊「刪除」按鈕後，將取消當前檔案的上傳，並將該檔案從上傳列表中移除。
     • 當檔案被刪除後，進度條和相關信息應從界面上消失。
     • 觸發 onDelete 回調函數，執行刪除邏輯，並提示是否確認刪除操作（可選）。

其他相關功能：

• 實時更新進度條：進度條應隨著上傳進度的變化而動態更新（例如從 0% 到 100%），讓使用者清楚了解上傳的進程。
• 檔案名稱和大小顯示：在進度條旁邊顯示檔案名稱（如：preline-ui.xls）和檔案大小（如：7 KB），確保使用者能夠辨認當前上傳的檔案。

[TzuHanLiang]

took 2hrs
done