feat: 添加 APM 应用管理功能并优化界面

- 新增 APM 应用管理功能,支持显示已安装应用及其依赖项
- 优化已安装应用列表界面,增加应用图标和名称显示
- 调整顶部操作栏布局,将设置和关于按钮移至搜索框旁
- 修复类型定义,增加 isDependency 字段和更多应用信息
- 改进暗色模式下的界面显示效果
This commit is contained in:
2026-03-24 20:47:55 +08:00
parent 480a7f3b77
commit 7ff079276e
13 changed files with 326 additions and 158 deletions

View File

@@ -97,9 +97,7 @@
: 'from-brand to-brand-dark'
"
@click="handleInstall"
:disabled="
installFeedback || isOtherVersionInstalled
"
:disabled="installFeedback || isOtherVersionInstalled"
>
<i
class="fas"
@@ -259,10 +257,7 @@
<script setup lang="ts">
import { computed, useAttrs, ref, watch } from "vue";
import axios from "axios";
import {
useInstallFeedback,
downloads,
} from "../global/downloadStatus";
import { useInstallFeedback, downloads } from "../global/downloadStatus";
import { APM_STORE_BASE_URL } from "../global/storeConfig";
import type { App } from "../global/typedefinition";
@@ -289,7 +284,7 @@ const appPkgname = computed(() => props.app?.pkgname);
const isIconLoaded = ref(false);
const viewingOrigin = ref<"spark" | "apm">("apm");
const viewingOrigin = ref<"spark" | "apm">("spark");
watch(
() => props.app,
@@ -297,9 +292,9 @@ watch(
isIconLoaded.value = false;
if (newApp) {
if (newApp.isMerged) {
// 若父组件已根据安装状态设置了优先展示的版本,则使用;否则默认 APM
// 若父组件已根据安装状态设置了优先展示的版本,则使用;否则默认 Spark
viewingOrigin.value =
newApp.viewingOrigin ?? (newApp.apmApp ? "apm" : "spark");
newApp.viewingOrigin ?? (newApp.sparkApp ? "spark" : "apm");
} else {
viewingOrigin.value = newApp.origin;
}
@@ -348,7 +343,9 @@ const installBtnText = computed(() => {
return "已安装";
}
if (isOtherVersionInstalled.value) {
return viewingOrigin.value === "spark" ? "已安装 APM 版" : "已安装 Spark 版";
return viewingOrigin.value === "spark"
? "已安装 APM 版"
: "已安装 Spark 版";
}
if (installFeedback.value) {
const status = activeDownload.value?.status;