CNWei
259eb20411
- ServicePanel 新增 onOpenApi，链接点击接管为 navigate('/interface')；
按住 Ctrl/Cmd/Shift/Alt 仍保留新标签打开
- 前台内容区已有 route.kind === 'api' 分支，直接渲染接口一览
- 顺手删掉两个没人引用的旧组件：sidebar/Sidebar.tsx、sidebar/CategoryNav.tsx
84 lines
2.3 KiB
TypeScript
84 lines
2.3 KiB
TypeScript
import { Button, Card, Icon, Space, Tag, Text, Title } from '@stash/ui'
|
|
import type { Project } from '../../api'
|
|
|
|
/**
|
|
* 本地服务面板：连接状态、项目数、访问地址，以及两个操作入口。
|
|
* 只读展示 + 触发刷新，不负责导航。
|
|
*/
|
|
type ServicePanelProps = {
|
|
projects: Project[]
|
|
live: boolean
|
|
refreshing: boolean
|
|
onRefresh: () => void
|
|
/** 打开接口一览：走站内路由，不整页刷新 */
|
|
onOpenApi: () => void
|
|
}
|
|
|
|
export function ServicePanel({
|
|
projects,
|
|
live,
|
|
refreshing,
|
|
onRefresh,
|
|
onOpenApi,
|
|
}: ServicePanelProps) {
|
|
const host = typeof window === 'undefined' ? '-' : window.location.host
|
|
|
|
return (
|
|
<Card padding="none" className="service-panel">
|
|
<Space justify="between">
|
|
<Title level={4} as="h2" weight="semibold">
|
|
本地服务
|
|
</Title>
|
|
<Tag tone={live ? 'success' : 'neutral'} dot className="service-status">
|
|
{live ? '已连接' : '未连接'}
|
|
</Tag>
|
|
</Space>
|
|
|
|
<div className="service-stats">
|
|
<Space justify="between">
|
|
<Text size="xs" tone="sub">
|
|
项目数
|
|
</Text>
|
|
<Text size="xs" strong>{projects.length}</Text>
|
|
</Space>
|
|
<Space justify="between">
|
|
<Text size="xs" tone="sub">
|
|
访问地址
|
|
</Text>
|
|
<Text size="xs" truncate title={host} className="service-host">
|
|
{host}
|
|
</Text>
|
|
</Space>
|
|
</div>
|
|
|
|
<div className="service-actions">
|
|
<Button
|
|
size="sm"
|
|
variant="secondary"
|
|
className="service-action"
|
|
spinning={refreshing}
|
|
icon={<Icon name="refresh_3_line" />}
|
|
onClick={onRefresh}
|
|
title="重新扫描项目"
|
|
>
|
|
重新扫描
|
|
</Button>
|
|
|
|
<a
|
|
className="link-button"
|
|
href="/interface"
|
|
onClick={(event) => {
|
|
// 无修饰键时接管点击，走站内路由，只换右侧内容；按住修饰键仍可新标签打开
|
|
if (event.metaKey || event.ctrlKey || event.shiftKey || event.altKey) return
|
|
event.preventDefault()
|
|
onOpenApi()
|
|
}}
|
|
>
|
|
<Icon name="link_3_line" />
|
|
查看接口
|
|
</a>
|
|
</div>
|
|
</Card>
|
|
)
|
|
}
|