@oj-module/cli 0.2.6 → 0.2.14

package/templates/web/src/notification/pages/center/index.tsx

@@ -0,0 +1,131 @@
+import type { NoticeCategory } from "@oj-module/runtime/notify";
+
+import { CheckOutlined, ClearOutlined } from "@ant-design/icons";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { App, Avatar, Button, Empty, List, Popconfirm, Segmented, Tag, Tooltip } from "antd";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+import {
+	notificationNotificationsClearPost,
+	notificationNotificationsGet,
+	notificationNotificationsReadAllPost,
+	notificationNotificationsReadPost,
+} from "../../__client/api";
+
+type Item = Awaited<ReturnType<typeof notificationNotificationsGet>>[number];
+type CatFilter = "all" | NoticeCategory;
+
+const CAT_COLOR: Record<NoticeCategory, string> = {
+	notice: "blue",
+	pm: "magenta",
+	mention: "orange",
+};
+
+/**
+ * 通知中心（N3 落地）：全量消息页，铃铛弹层「查看全部」跳转至此。
+ * 按类型（notice/pm/mention）Tab 过滤；单条点击标记已读并跳深链；
+ * 全部已读/清空与铃铛弹层同一数据路径（/api/notification/*）。
+ */
+export default function NotificationCenter() {
+	const { t } = useTranslation("notification");
+	const { message } = App.useApp();
+	const queryClient = useQueryClient();
+	const [cat, setCat] = useState<CatFilter>("all");
+
+	const { data, isPending } = useQuery({
+		queryKey: ["notification-center"],
+		queryFn: notificationNotificationsGet,
+	});
+
+	const invalidate = () => queryClient.invalidateQueries({ queryKey: ["notification-center"] });
+
+	const readMut = useMutation({
+		mutationFn: (id: string) => notificationNotificationsReadPost({ id }),
+		onSettled: invalidate,
+		onError: e => message.error(String(e)),
+	});
+	const readAllMut = useMutation({
+		mutationFn: notificationNotificationsReadAllPost,
+		onSettled: invalidate,
+		onError: e => message.error(String(e)),
+	});
+	const clearMut = useMutation({
+		mutationFn: notificationNotificationsClearPost,
+		onSettled: invalidate,
+		onError: e => message.error(String(e)),
+	});
+
+	const items = (data ?? []).filter(x => cat === "all" || x.category === cat);
+
+	const handleClick = (item: Item) => {
+		if (!item.isRead)
+			readMut.mutate(item.id);
+		// 深链与铃铛弹层同约定：标记已读后新标签打开
+		if (item.link)
+			window.open(item.link, "_blank", "noopener");
+	};
+
+	const hasUnread = (data ?? []).some(x => !x.isRead);
+
+	return (
+		<div className="max-w-2xl mx-auto p-4">
+			<div className="flex items-center justify-between mb-3">
+				<Segmented
+					value={cat}
+					onChange={v => setCat(v as CatFilter)}
+					options={[
+						{ label: t("center.tabAll"), value: "all" },
+						{ label: t("center.category.notice"), value: "notice" },
+						{ label: t("center.category.pm"), value: "pm" },
+						{ label: t("center.category.mention"), value: "mention" },
+					]}
+				/>
+				<div className="flex items-center gap-2">
+					<Tooltip title={hasUnread ? t("center.markAllRead") : null}>
+						<Button
+							disabled={!hasUnread || readAllMut.isPending}
+							icon={<CheckOutlined />}
+							onClick={() => readAllMut.mutate()}
+						>
+							{t("center.markAllRead")}
+						</Button>
+					</Tooltip>
+					<Popconfirm title={t("center.clearConfirm")} onConfirm={() => clearMut.mutate()}>
+						<Button danger disabled={!(data ?? []).length || clearMut.isPending} icon={<ClearOutlined />}>
+							{t("center.clear")}
+						</Button>
+					</Popconfirm>
+				</div>
+			</div>
+			<List
+				loading={isPending}
+				itemLayout="horizontal"
+				locale={{ emptyText: <Empty description={t("center.empty")} /> }}
+				dataSource={items}
+				renderItem={item => (
+					<List.Item className="cursor-pointer hover:bg-gray-100" onClick={() => handleClick(item)}>
+						<List.Item.Meta
+							avatar={<Avatar src={item.avatar || undefined}>{item.title.slice(0, 1)}</Avatar>}
+							title={(
+								<span className="flex items-center gap-2">
+									{!item.isRead && <span className="w-2 h-2 rounded bg-blue-600 inline-block shrink-0" />}
+									<span className="font-semibold">{item.title}</span>
+									<Tag color={CAT_COLOR[item.category ?? "notice"]}>
+										{t(`center.category.${item.category ?? "notice"}`)}
+									</Tag>
+								</span>
+							)}
+							description={(
+								<div className="flex flex-col gap-1">
+									<span>{item.message}</span>
+									<span className="text-xs text-muted-foreground">{item.date}</span>
+								</div>
+							)}
+						/>
+					</List.Item>
+				)}
+			/>
+		</div>
+	);
+}

package/templates/web/src/oj-market/__tests__/CardGrid.test.tsx

@@ -73,6 +73,25 @@ describe("cardGrid 卡片网格（BDD）", () => {
 		expect(handlers.onRollback).toHaveBeenCalledWith(installed);
 	});
 
+	it("given canManage=false（非 superadmin）When 渲染 Then 安装/启停/回滚/卸载按钮禁用、详情/历史保持可用", () => {
+		renderWithProviders(
+			<CardGrid rows={[installed]} canManage={false} {...handlers} />,
+			new InMemoryMarketClient(),
+		);
+		const btn = (name: string) => screen.getByRole("button", { name }) as HTMLButtonElement;
+		// 写操作禁用
+		expect(btn("升级").disabled).toBe(true);
+		expect(btn("停用").disabled).toBe(true);
+		expect(btn("卸载").disabled).toBe(true);
+		expect((screen.getByTestId("card-rollback-alpha") as HTMLButtonElement).disabled).toBe(true);
+		// 只读操作不受影响
+		expect(btn("详情").disabled).toBe(false);
+		expect(btn("历史").disabled).toBe(false);
+		// 禁用时不应触发写回调
+		btn("卸载").click();
+		expect(handlers.onUninstall).not.toHaveBeenCalled();
+	});
+
 	it("given 空列表 When 渲染 Then 显示空态", () => {
 		renderWithProviders(<CardGrid rows={[]} {...handlers} />, new InMemoryMarketClient());
 		expect(screen.getByTestId("card-grid-empty")).toBeTruthy();

package/templates/web/src/oj-market/__tests__/InstallDialog.test.tsx

@@ -18,6 +18,7 @@ describe("installDialog 安装进度（BDD）", () => {
 			progress: 100,
 			message: "ok",
 			stages: [],
+			startedAt: 0,
 		};
 		const client = new InMemoryMarketClient({ taskRecord: done, installResult: { task_id: "t1" } });
 		renderWithProviders(<InstallDialog row={row} open onClose={() => {}} />, client);
@@ -37,6 +38,7 @@ describe("installDialog 安装进度（BDD）", () => {
 			message: "verify failed",
 			stages: [{ stage: "verifying", ok: false, message: "bad hash" }],
 			error: { reason: "包校验失败", retryable: false, hintKey: "lifecycle.stage.verifying.hint" },
+			startedAt: 0,
 		};
 		const client = new InMemoryMarketClient({ taskRecord: failed, installResult: { task_id: "t1" } });
 		renderWithProviders(<InstallDialog row={row} open onClose={() => {}} />, client);
@@ -54,6 +56,7 @@ describe("installDialog 安装进度（BDD）", () => {
 			progress: 100,
 			message: "ok",
 			stages: [],
+			startedAt: 0,
 		};
 		const client = new InMemoryMarketClient({ taskRecord: done, installResult: { task_id: "t1" } });
 		const rollbackRow: IndexRow = { name: "alpha", latest: "1.2.0", installed: "1.2.0", enabled: true, upgradable: false };

package/templates/web/src/oj-market/__tests__/RollbackDialog.test.tsx

@@ -4,6 +4,7 @@ import { describe, expect, it, vi } from "vitest";
 import { RollbackDialog } from "../components/RollbackDialog";
 import { InMemoryMarketClient } from "./marketClient.fake";
 import { renderWithProviders } from "./render";
+import "@testing-library/jest-dom/vitest";
 
 const row: IndexRow = { name: "alpha", latest: "1.2.0", installed: "1.2.0", enabled: true, upgradable: false };
 

package/templates/web/src/oj-market/__tests__/marketClient.fake.ts

@@ -45,6 +45,7 @@ export class InMemoryMarketClient implements MarketClient {
 			progress: 100,
 			message: "ok",
 			stages: [],
+			startedAt: 0,
 		} as TaskRecord);
 	}
 

package/templates/web/src/oj-market/api/client.ts

@@ -1,6 +1,9 @@
-// 市场 API 客户端（DIP）：定义与宿主 _platform 编排面 + market_history 端点的契约。
-// 实现与 ky 形态解耦——组件/hooks 注入 MarketClient，测试可注入内存 fake（见 __tests__）。
+// 市场 API 客户端契约（DIP  seams）：组件/hooks 依赖此接口，而非具体 http 实现；
+// 测试可注入内存 fake（见 __tests__/marketClient.fake.ts）。
 // 第一方专用调用面（R29）：仅市场应用消费 /api/_platform/market/*，第三方方案不得仿照。
+//
+// 实现见同目录 defaultClient.ts——统一委托给 ojm 从契约生成的 __client，消除手写
+// URL/信封解包与契约漂移（DEV 下生成 client 还会对响应做 zod 校验）。
 
 import type {
 	EnableInput,
@@ -11,27 +14,6 @@ import type {
 	UninstallImpact,
 } from "../types";
 
-/** ky 形态的最小请求子集（get/post 返回带 .json<T>() 的响应） */
-export interface HttpRequest {
-	get: <T = unknown>(
-		url: string,
-		// silentError：错误体由本客户端消化（未配置市场地址走空态），不弹全局 toast；
-		// retry: 0：503 是配置态而非抖动，默认重试 3 次只会刷出 4 条同样错误。
-		opts?: { searchParams?: Record<string, string>, silentError?: boolean, retry?: number },
-	) => Promise<{ json: <R = T>() => Promise<R> }>
-	post: <T = unknown>(
-		url: string,
-		opts?: { json?: unknown },
-	) => Promise<{ json: <R = T>() => Promise<R> }>
-}
-
-/** 与运行时/生成客户端一致的响应信封（DIP：服务端统一 {code,msg,data} 包裹） */
-interface OjEnvelope<T> {
-	code: number
-	msg?: string
-	data?: T
-}
-
 /** 市场客户端契约（组件/hooks 依赖此接口，而非具体 http 实现） */
 export interface MarketClient {
 	/** 登录即可：{ apiVersion }（peerPlatform 预检口径） */
@@ -51,85 +33,3 @@ export interface MarketClient {
 	/** 卸载（P1-15a 补齐后接通） */
 	uninstall: (name: string) => Promise<{ ok: boolean, message: string }>
 }
-
-// 第一方市场端点：相对前缀，由运行时 request 的 VITE_API_BASE_URL（/api）统一加前缀；
-// 此处若再写 /api 会与运行时前缀叠加成 /api/api/（R29 联调发现）。
-const PLATFORM = "/_platform/market";
-const HISTORY = "/_platform/market/history";
-
-/**
- * 503 = 服务端「未配置市场地址（framework.market_cdn_url）」，是**预期空态**而非故障
- * （PRD §5.3：卡片区显示「未配置市场地址」）。模板默认不配市场地址，新工程一进市场页
- * 就会撞它——在此归空数组，交由卡片空态文案承载；其它状态码照旧上抛。
- */
-function isUnconfigured(e: unknown): boolean {
-	return (e as { response?: { status?: number } } | null)?.response?.status === 503;
-}
-
-/** 默认 HTTP 实现：基于运行时 request（ky 形态） */
-export function createHttpMarketClient(request: HttpRequest): MarketClient {
-	return {
-		async meta() {
-			const r = await request.get<OjEnvelope<{ apiVersion: string }>>(`${PLATFORM}/meta`);
-			const env = await r.json();
-			return env.data!;
-		},
-		async index() {
-			try {
-				const r = await request.get<OjEnvelope<IndexRow[]>>(`${PLATFORM}/index`, {
-					silentError: true,
-					retry: 0,
-				});
-				const env = await r.json();
-				return env.data!;
-			}
-			catch (e) {
-				if (isUnconfigured(e))
-					return [];
-				throw e;
-			}
-		},
-		async install(input: InstallInput) {
-			const r = await request.post<OjEnvelope<{ task_id: string }>>(`${PLATFORM}/install`, {
-				json: {
-					name: input.name,
-					version: input.version ?? null,
-					source: input.source ?? "cdn",
-				},
-			});
-			const env = await r.json();
-			return env.data!;
-		},
-		async task(id: string) {
-			const r = await request.get<OjEnvelope<TaskRecord>>(`${PLATFORM}/task`, { searchParams: { id } });
-			const env = await r.json();
-			return env.data!;
-		},
-		async enable(input: EnableInput) {
-			const r = await request.post<OjEnvelope<{ ok: boolean, message: string }>>(`${PLATFORM}/enable`, {
-				json: { name: input.name, enabled: input.enabled },
-			});
-			const env = await r.json();
-			return env.data!;
-		},
-		async history() {
-			const r = await request.get<OjEnvelope<MarketHistory[]>>(HISTORY);
-			const env = await r.json();
-			return env.data!;
-		},
-		async uninstallImpact(name: string) {
-			const r = await request.get<OjEnvelope<UninstallImpact>>(`${PLATFORM}/uninstall-impact`, {
-				searchParams: { name },
-			});
-			const env = await r.json();
-			return env.data!;
-		},
-		async uninstall(name: string) {
-			const r = await request.post<OjEnvelope<{ ok: boolean, message: string }>>(`${PLATFORM}/uninstall`, {
-				json: { name },
-			});
-			const env = await r.json();
-			return env.data!;
-		},
-	};
-}

package/templates/web/src/oj-market/api/defaultClient.ts

@@ -1,7 +1,113 @@
-// 默认市场客户端单例：基于运行时 request（ky 形态）。
-// 组件经 MarketClientContext 消费，测试可注入内存 fake，避免依赖真实后端（DIP）。
+// 默认市场客户端单例：统一委托给 ojm 从契约生成的 __client（运行时校验 + 唯一真源
+// URL/信封）。组件经 MarketClientContext 消费，测试可注入内存 fake，避免依赖真实后端（DIP）。
+//
+// 统一收益：消除手写 URL 字符串、信封 {code,msg,data} 解包与契约漂移——DEV 下生成
+// client 还会对响应做 zod 校验，服务端形状一旦漂移立即在控制台报错。
+//
+// index 是唯一「预期空态（未配置市场地址 → 503）」端点，需 silentError 抑制全局 toast；
+// 生成 client 不暴露该选项，故 index 仍直接走运行时 request（见下方注释），其余方法统一委托。
+
+import type {
+	EnableInput,
+	IndexRow,
+	InstallInput,
+	MarketHistory,
+	TaskRecord,
+	UninstallImpact,
+} from "../types";
+import type { MarketClient } from "./client";
+
 import { request } from "@oj-module/runtime";
-import { createHttpMarketClient } from "./client";
+import {
+	bindRequest,
+	platformMarketEnablePost,
+	platformMarketHistoryGet,
+	platformMarketInstallPost,
+	platformMarketMetaGet,
+	platformMarketTaskGet,
+	platformMarketUninstallImpactGet,
+	platformMarketUninstallPost,
+} from "../../_platform/__client/api";
+
+// 绑定运行时 request 到生成 client 的模块级单槽（生成 client 是静态单例，必须由某处
+// bindRequest；此处兜底确保市场子应用无论挂载顺序都能拿到请求实例）。与 _platform 模块
+// entry 若再调用 create_platformClient(ctx) 幂等（绑定同实例）。
+bindRequest(request as Parameters<typeof bindRequest>[0]);
+
+/** ky 形态的最小请求子集（仅 index 直连 request 时用，get 返回带 .json<T>() 的响应） */
+interface HttpGetLike {
+	get: <T = unknown>(
+		url: string,
+		// silentError：错误体由本客户端消化（未配置市场地址走空态），不弹全局 toast；
+		// retry: 0：503 是配置态而非抖动，默认重试 3 次只会刷出 4 条同样错误。
+		opts?: { searchParams?: Record<string, string>, silentError?: boolean, retry?: number },
+	) => Promise<{ json: <R = T>() => Promise<R> }>
+}
+
+/** 与运行时/生成客户端一致的响应信封（DIP：服务端统一 {code,msg,data} 包裹） */
+interface OjEnvelope<T> {
+	code: number
+	msg?: string
+	data?: T
+}
+
+// 第一方市场端点：相对前缀（无前导 /），由运行时 request 的 VITE_API_BASE_URL（/api）统一加前缀；
+// 与生成 client（platformMarket* 用 `_platform/...`）保持一致，避免 /api 叠加成 /api/api/（R29）。
+const MARKET = "_platform/market";
+
+/**
+ * 503 = 服务端「未配置市场地址（framework.market_cdn_url）」，是**预期空态**而非故障
+ * （PRD §5.3：卡片区显示「未配置市场地址」）。模板默认不配市场地址，新工程一进市场页
+ * 就会撞它——在此归空数组，交由卡片空态文案承载；其它状态码照旧上抛。
+ */
+function isUnconfigured(e: unknown): boolean {
+	return (e as { response?: { status?: number } } | null)?.response?.status === 503;
+}
 
-/** 运行时 request 形态与 HttpRequest 兼容（ky get/post 返回带 .json<T>() 的响应） */
-export const httpMarketClient = createHttpMarketClient(request as unknown as Parameters<typeof createHttpMarketClient>[0]);
+export const httpMarketClient: MarketClient = {
+	async meta() {
+		// 生成 client 已解包信封 + DEV 校验；此处仅对齐领域类型。
+		return (await platformMarketMetaGet()) as { apiVersion: string };
+	},
+	async index() {
+		// 唯一需 silentError 的端点：直连 request 抑制「未配置市场地址」的全局 toast。
+		try {
+			const r = await (request as unknown as HttpGetLike)
+				.get<OjEnvelope<IndexRow[]>>(`${MARKET}/index`, { silentError: true, retry: 0 });
+			const env = await r.json();
+			return env.data!;
+		}
+		catch (e) {
+			if (isUnconfigured(e))
+				return [];
+			throw e;
+		}
+	},
+	async install(input: InstallInput) {
+		const data = await platformMarketInstallPost({
+			name: input.name,
+			version: input.version ?? null,
+			source: input.source ?? "cdn",
+		});
+		return data as { task_id: string };
+	},
+	async task(id: string) {
+		// 生成 Data 为空 schema（仅 DEV catchall 校验），经 unknown 桥接领域类型；
+		// 运行时形状由服务端真源 + DEV zod 校验保证，TS 侧以领域类型为准。
+		return (await platformMarketTaskGet({ id })) as unknown as TaskRecord;
+	},
+	async enable(input: EnableInput) {
+		const data = await platformMarketEnablePost({ name: input.name, enabled: input.enabled });
+		return data as { ok: boolean, message: string };
+	},
+	async history() {
+		return (await platformMarketHistoryGet()) as unknown as MarketHistory[];
+	},
+	async uninstallImpact(name: string) {
+		return (await platformMarketUninstallImpactGet({ name })) as unknown as UninstallImpact;
+	},
+	async uninstall(name: string) {
+		const data = await platformMarketUninstallPost({ name });
+		return data as { ok: boolean, message: string };
+	},
+};

package/templates/web/src/oj-market/components/CardGrid.tsx

@@ -11,6 +11,8 @@ export interface CardGridProps {
 	error?: string | null
 	rows: IndexRow[]
 	busyName?: string | null
+	/** 是否具备管理权限（superadmin）；透传给 CardItem 以禁用写操作。 */
+	canManage?: boolean
 	onInstall: (row: IndexRow) => void
 	onEnableToggle: (row: IndexRow) => void
 	onDetails: (row: IndexRow) => void
@@ -23,7 +25,7 @@ export interface CardGridProps {
 /** 卡片网格容器：三态（加载/空/错误）+ 正常网格，DRY 渲染交由 CardItem */
 export function CardGrid(props: CardGridProps) {
 	const { t } = useTranslation();
-	const { loading, error, rows, busyName, onInstall, onEnableToggle, onDetails, onHistory, onUninstall, onRollback, onRetry } = props;
+	const { loading, error, rows, busyName, canManage, onInstall, onEnableToggle, onDetails, onHistory, onUninstall, onRollback, onRetry } = props;
 
 	if (loading) {
 		return (
@@ -63,6 +65,7 @@ export function CardGrid(props: CardGridProps) {
 					key={row.name}
 					row={row}
 					busy={busyName === row.name}
+					canManage={canManage}
 					onInstall={onInstall}
 					onEnableToggle={onEnableToggle}
 					onDetails={onDetails}

package/templates/web/src/oj-market/components/CardItem.tsx

@@ -6,6 +6,8 @@ import { useTranslation } from "react-i18next";
 export interface CardItemProps {
 	row: IndexRow
 	busy?: boolean
+	/** 是否具备管理权限（superadmin）。false 时禁用一切写操作（安装/升级/启停/回滚/卸载），仅保留浏览。 */
+	canManage?: boolean
 	onInstall: (row: IndexRow) => void
 	onEnableToggle: (row: IndexRow) => void
 	onDetails: (row: IndexRow) => void
@@ -19,12 +21,14 @@ export interface CardItemProps {
  * 双版本展示（P1-15b）：已装且可升级时并列「已装 installed → 最新 latest」（upgradable 对比），
  * 否则单版本。已装方案提供回滚入口（RollbackDialog 选旧版降级安装）。
  */
-export function CardItem({ row, busy, onInstall, onEnableToggle, onDetails, onHistory, onUninstall, onRollback }: CardItemProps) {
+export function CardItem({ row, busy, canManage = true, onInstall, onEnableToggle, onDetails, onHistory, onUninstall, onRollback }: CardItemProps) {
 	const { t } = useTranslation();
 	const installed = row.installed != null;
 	const enabled = row.enabled === true;
 	const disabled = row.enabled === false;
 	const dualVersion = installed && row.upgradable && row.latest != null;
+	// 非 superadmin：所有写操作禁用并给出原因提示，只读（详情/历史）不受影响。
+	const manageTip = canManage ? undefined : t("oj-market:card:superOnly");
 
 	return (
 		<Card
@@ -72,21 +76,21 @@ export function CardItem({ row, busy, onInstall, onEnableToggle, onDetails, onHi
 						)}
 			</div>
 			<Space wrap>
-				<Button type="primary" size="small" loading={busy} onClick={() => onInstall(row)} disabled={busy}>
+				<Button type="primary" size="small" loading={busy} onClick={() => onInstall(row)} disabled={busy || !canManage} title={manageTip}>
 					{installed ? t("oj-market:card:upgrade") : t("oj-market:card:install")}
 				</Button>
 				{installed && (
-					<Button size="small" onClick={() => onEnableToggle(row)} disabled={busy}>
+					<Button size="small" onClick={() => onEnableToggle(row)} disabled={busy || !canManage} title={manageTip}>
 						{enabled ? t("oj-market:card:disable") : t("oj-market:card:enable")}
 					</Button>
 				)}
 				{installed && (
-					<Button size="small" onClick={() => onRollback(row)} disabled={busy} data-testid={`card-rollback-${row.name}`}>
+					<Button size="small" onClick={() => onRollback(row)} disabled={busy || !canManage} title={manageTip} data-testid={`card-rollback-${row.name}`}>
 						{t("oj-market:card:rollback")}
 					</Button>
 				)}
 				{installed && (
-					<Button size="small" danger onClick={() => onUninstall(row)} disabled={busy}>
+					<Button size="small" danger onClick={() => onUninstall(row)} disabled={busy || !canManage} title={manageTip}>
 						{t("oj-market:card:uninstall")}
 					</Button>
 				)}

package/templates/web/src/oj-market/components/DetailDrawer.tsx

@@ -7,14 +7,18 @@ export interface DetailDrawerProps {
 	row: IndexRow | null
 	open: boolean
 	onClose: () => void
+	/** 是否具备管理权限（superadmin）；false 时禁用安装/回滚按钮，历史（只读）不受影响。 */
+	canManage?: boolean
 	onInstall: (row: IndexRow) => void
 	onHistory: (row: IndexRow) => void
 	onRollback: (row: IndexRow) => void
 }
 
 /** 方案详情抽屉：只读展示卡片元信息（含双版本对比）+ 安装/回滚/历史入口 */
-export function DetailDrawer({ row, open, onClose, onInstall, onHistory, onRollback }: DetailDrawerProps) {
+export function DetailDrawer({ row, open, onClose, canManage = true, onInstall, onHistory, onRollback }: DetailDrawerProps) {
 	const { t } = useTranslation();
+	// 非 superadmin：写操作禁用并解释原因，历史（只读）保持可用。
+	const manageTip = canManage ? undefined : t("oj-market:card:superOnly");
 	return (
 		<Drawer
 			title={row ? row.name : t("oj-market:card:details")}
@@ -36,11 +40,11 @@ export function DetailDrawer({ row, open, onClose, onInstall, onHistory, onRollb
 						</Descriptions.Item>
 					</Descriptions>
 					<Space style={{ marginTop: 16 }}>
-						<Button type="primary" onClick={() => onInstall(row)}>
+						<Button type="primary" onClick={() => onInstall(row)} disabled={!canManage} title={manageTip}>
 							{row.installed ? t("oj-market:card:upgrade") : t("oj-market:card:install")}
 						</Button>
 						{row.installed != null && (
-							<Button onClick={() => onRollback(row)} data-testid="detail-rollback">
+							<Button onClick={() => onRollback(row)} data-testid="detail-rollback" disabled={!canManage} title={manageTip}>
 								{t("oj-market:card:rollback")}
 							</Button>
 						)}

package/templates/web/src/oj-market/components/InstallDialog.tsx

@@ -53,7 +53,7 @@ export function InstallDialog({ row, open, onClose, onDone, version, mode }: Ins
 	}, [open, row, started, client, targetVersion]);
 
 	useEffect(() => {
-		if (isTerminal(record) && done)
+		if (record && isTerminal(record) && done)
 			onDone?.(record);
 	}, [record, done, onDone]);
 

package/templates/web/src/oj-market/entry.ts

@@ -1,4 +1,5 @@
-import { defineModule } from "@oj-module/runtime";
+import { defineModule, OutsidePageIcon } from "@oj-module/runtime";
+import { createElement } from "react";
 import MarketApp from "./pages/MarketApp";
 
 // 方案市场前端模块（第一方专用，R29：消费 /api/_platform/market/* 编排面，第三方方案不得仿照此调用面）。
@@ -10,7 +11,12 @@ export default defineModule({
 	routes: [
 		{
 			path: "/oj-market",
-			handle: { layout: "container", order: 200, title: "oj-market:menu.main" },
+			handle: {
+				layout: "container",
+				order: 200,
+				title: "oj-market:menu.main",
+				icon: createElement(OutsidePageIcon),
+			},
 			children: [
 				{
 					index: true,

package/templates/web/src/oj-market/hooks/useMarket.ts

@@ -4,7 +4,9 @@ import { useMarketClient } from "../api/context";
 import { poll } from "../utils/poll";
 
 /** 加载态三态（空态/加载/错误）统一建模，便于组件 DRY 渲染 */
-export type LoadState<T> = { status: "loading" } | { status: "ok", data: T } | { status: "error", error: string };
+// 注：TS 6 收紧联合类型属性访问——属性须出现在所有成员上方可通过 .data 访问，
+// 故非 ok 变体也声明 data?: undefined（ok 变体 data: T，访问结果为 T | undefined）。
+export type LoadState<T> = { status: "loading", data?: undefined } | { status: "ok", data: T } | { status: "error", error: string, data?: undefined };
 
 /** 卡片索引加载（含重试）；消费 GET /_platform/market/index */
 export function useMarketIndex(): LoadState<IndexRow[]> & { retry: () => void } {
@@ -58,6 +60,7 @@ export function useInstallTask(taskId: string | null): {
 				progress: 0,
 				message: e instanceof Error ? e.message : String(e),
 				stages: [],
+				startedAt: 0,
 			}))
 			.finally(() => active && setDone(true));
 		return () => {

package/templates/web/src/oj-market/locales/en-US.json

@@ -37,7 +37,8 @@
 		"enable": "Enable",
 		"disable": "Disable",
 		"upgrade": "Upgrade",
-		"rollback": "Rollback"
+		"rollback": "Rollback",
+		"superOnly": "Only superadmins can install, upgrade, roll back, enable/disable or uninstall solutions; other users may browse only."
 	},
 	"task": {
 		"installing": "Installing",

package/templates/web/src/oj-market/locales/zh-CN.json

@@ -37,7 +37,8 @@
 		"enable": "启用",
 		"disable": "停用",
 		"upgrade": "升级",
-		"rollback": "回滚"
+		"rollback": "回滚",
+		"superOnly": "仅超级管理员可安装、升级、回滚、启停或卸载方案；其余用户仅可浏览。"
 	},
 	"task": {
 		"installing": "安装中",