feat(update-center): 添加加载状态处理及UI优化

为更新中心添加加载状态管理,包括:
- 在打开和刷新操作时显示加载状态
- 禁用刷新按钮防止重复操作
- 添加加载中的动画效果和提示文本
- 优化加载时的UI显示
This commit is contained in:
2026-04-16 14:00:33 +08:00
parent e72553d570
commit 42046caf2c
6 changed files with 122 additions and 19 deletions
@@ -63,6 +63,7 @@ const createStore = (
return {
isOpen: ref(true),
loading: ref(false),
showCloseConfirm: ref(true),
showMigrationConfirm: ref(false),
searchQuery: ref(""),
@@ -220,4 +221,52 @@ describe("UpdateCenterModal", () => {
expect(store.requestClose).toHaveBeenCalledTimes(1);
});
it("shows loading panel when loading with no items", () => {
const store = createStore({
items: [],
tasks: [],
warnings: [],
hasRunningTasks: false,
});
store.loading.value = true;
render(UpdateCenterModal, {
props: {
show: true,
store,
},
});
expect(screen.getByText("正在检查更新…")).toBeTruthy();
});
it("shows refresh hint while loading with existing items", () => {
const store = createStore({ hasRunningTasks: false });
store.loading.value = true;
render(UpdateCenterModal, {
props: {
show: true,
store,
},
});
expect(screen.getByText("Spark Weather")).toBeTruthy();
expect(screen.getByText("正在刷新更新列表…")).toBeTruthy();
});
it("disables refresh button while loading", () => {
const store = createStore({ hasRunningTasks: false });
store.loading.value = true;
render(UpdateCenterModal, {
props: {
show: true,
store,
},
});
expect(screen.getByRole("button", { name: /刷新/ })).toBeDisabled();
});
});