kevisual/cnb-center
1
0
Fork 0
generated from kevisual/vite-react-template
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 更新页面语言为中文并添加评论功能的 HTML 模板

Browse Source
This commit is contained in:
熊潇
2026-02-20 04:02:53 +08:00
parent 6750a8858d
commit a934a7620d
5 changed files with 128 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
public/comments.html Normal file
View File

@@ -0,0 +1,25 @@
<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="icon" type="image/png" href="https://kevisual.xiongxiao.me/root/center/panda.jpg" />
<title>Comments</title>
</head>
<body>
<script
src="https://commit.cool/client.js"
repo="kevisual/kevisual"
issue-term="custom"
issue-id="comments"
theme="light"
layout="classic"
crossorigin="anonymous"
async
></script>
</body>
</html>

2
public/demo.html
View File

@@ -1,5 +1,5 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="zh-CN">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />

118
src/app/config/page.tsx
View File

@@ -4,6 +4,8 @@ import { Input } from '@/components/ui/input';
import { Label } from '@/components/ui/label'; import { Label } from '@/components/ui/label';
import { Button } from '@/components/ui/button'; import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox'; import { Checkbox } from '@/components/ui/checkbox';
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
import { Info } from 'lucide-react';
import { configSchema } from './store/schema'; import { configSchema } from './store/schema';
import { toast } from 'sonner'; import { toast } from 'sonner';
@@ -28,37 +30,78 @@ export const ConfigPage = () => {
}; };
return ( return (
<div className="container mx-auto max-w-2xl py-8"> <TooltipProvider>
<Card> <div className="container mx-auto max-w-2xl py-8">
<CardHeader> <Card>
<CardTitle>CNB 配置</CardTitle> <CardHeader>
<CardDescription> <CardTitle>CNB 配置</CardTitle>
配置您的 CNB API 设置。这些设置会保存在浏览器的本地存储中。 <CardDescription>
</CardDescription> 配置您的 CNB API 设置。这些设置会保存在浏览器的本地存储中。
</CardHeader> </CardDescription>
<CardContent> </CardHeader>
<form onSubmit={handleSubmit} className="space-y-6"> <CardContent>
<div className="space-y-2"> <form onSubmit={handleSubmit} className="space-y-6">
<Label htmlFor="api-key">API 密钥</Label> <div className="space-y-2">
<Input <div className="flex items-center gap-2">
id="api-key" <Label htmlFor="api-key">API 密钥</Label>
type="text" <Tooltip>
value={config.CNB_API_KEY} <TooltipTrigger>
onChange={(e) => handleChange('CNB_API_KEY', e.target.value)} <Info className="h-4 w-4 text-muted-foreground cursor-help" />
placeholder="请输入您的 CNB API 密钥" </TooltipTrigger>
/> <TooltipContent>
</div> <p>
用于访问 CNB API 的密钥。
<a
href="https://cnb.cool/profile/token"
target="_blank"
rel="noopener noreferrer"
className="underline ml-1 hover:text-blue-400"
>
点击获取
</a>
</p>
</TooltipContent>
</Tooltip>
</div>
<Input
id="api-key"
type="text"
value={config.CNB_API_KEY}
onChange={(e) => handleChange('CNB_API_KEY', e.target.value)}
placeholder="请输入您的 CNB API 密钥"
/>
</div>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="cookie">Cookie</Label> <div className="flex items-center gap-2">
<Input <Label htmlFor="cookie">Cookie</Label>
id="cookie" <Tooltip>
type="text" <TooltipTrigger>
value={config.CNB_COOKIE} <Info className="h-4 w-4 text-muted-foreground cursor-help" />
onChange={(e) => handleChange('CNB_COOKIE', e.target.value)} </TooltipTrigger>
placeholder="请输入您的 CNB Cookie" <TooltipContent>
/> <p>
</div> 用于身份验证的 Cookie 信息。
<a
href="https://cnb.cool/kevisual/cnb-live-extension"
target="_blank"
rel="noopener noreferrer"
className="underline ml-1 hover:text-blue-400"
>
前往获取
</a>
</p>
</TooltipContent>
</Tooltip>
</div>
<Input
id="cookie"
type="text"
value={config.CNB_COOKIE}
onChange={(e) => handleChange('CNB_COOKIE', e.target.value)}
placeholder="请输入您的 CNB Cookie"
/>
</div>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="cors-url">跨域地址</Label> <Label htmlFor="cors-url">跨域地址</Label>
@@ -105,7 +148,19 @@ export const ConfigPage = () => {
</div> </div>
<div className="space-y-2"> <div className="space-y-2">
<Label htmlFor="ai-api-key">AI 密钥</Label> <div className="flex items-center gap-2">
<Label htmlFor="ai-api-key">AI 密钥</Label>
<Tooltip>
<TooltipTrigger>
<Info className="h-4 w-4 text-muted-foreground cursor-help" />
</TooltipTrigger>
<TooltipContent>
<p>
如果使用 CNB 的 AI，密钥和 API 密钥一样即可
</p>
</TooltipContent>
</Tooltip>
</div>
<Input <Input
id="ai-api-key" id="ai-api-key"
type="password" type="password"
@@ -125,6 +180,7 @@ export const ConfigPage = () => {
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
</TooltipProvider>
); );
}; };

3
src/app/repo/store/index.ts
View File

@@ -262,7 +262,6 @@ export const useRepoStore = create<State>((set, get) => {
} }
const res = await checkOpen() const res = await checkOpen()
if (res.code === 300) { if (res.code === 300) {
toast.success(`新创建了一个工作区，sn: ${res.data?.sn}`)
if (params.open) { if (params.open) {
const loadingToastId = toast.loading('正在启动工作区...') const loadingToastId = toast.loading('正在启动工作区...')
const interval = setInterval(async () => { const interval = setInterval(async () => {
@@ -311,7 +310,7 @@ export const useRepoStore = create<State>((set, get) => {
toast.success('工作区已停止'); toast.success('工作区已停止');
// 停止成功后关闭弹窗 // 停止成功后关闭弹窗
set({ showWorkspaceDialog: false }); set({ showWorkspaceDialog: false });
get().getList(true) get().refresh({ showTips: false });
} else { } else {
toast.error(res.message || '停止失败'); toast.error(res.message || '停止失败');
} }

19
src/routes/__root.tsx
View File

@@ -3,6 +3,7 @@ import { TanStackRouterDevtools } from '@tanstack/react-router-devtools'
import { Toaster } from '@/components/ui/sonner' import { Toaster } from '@/components/ui/sonner'
import { useConfigStore } from '@/app/config/store' import { useConfigStore } from '@/app/config/store'
import { useEffect } from 'react' import { useEffect } from 'react'
import { Settings } from 'lucide-react'
export const Route = createRootRoute({ export const Route = createRootRoute({
component: RootComponent, component: RootComponent,
}) })
@@ -20,18 +21,26 @@ function RootComponent() {
return ( return (
<div className='h-full overflow-hidden'> <div className='h-full overflow-hidden'>
<div className="p-2 flex gap-2 text-lg"> <div className="p-2 flex gap-2 text-lg items-center">
<Link <Link
to="/" to="/"
activeProps={{ activeProps={{
className: 'font-bold', className: 'text-gray-800',
}}
inactiveProps={{
className: 'text-gray-500',
}} }}
activeOptions={{ exact: true }}
> >
仓库列表 仓库列表
</Link> </Link>
<Link to='/config'> <Link to='/config' activeProps={{
配置项 className: 'text-gray-800',
}}
inactiveProps={{
className: 'text-gray-500',
}}
>
<Settings className="h-5 w-5" />
</Link> </Link>
</div> </div>
<hr /> <hr />