feat(license): Pro 授权机制 — 离线许可码 + 免费版功能闸门

免费版:日志查询/部署管理/采集/用户管理/LDAP/设置;Pro(¥199 个人单实例永久 / ¥499 团队多实例永久): 日志分析、日志告警、智能运维(AI)、审计日志。 - 后端:HMAC-SHA256 离线许可码(签发 CLI / license --plan --edition --seats --customer --days; 永久=days 0),GET /system/license + POST activate;RequirePro 闸门挂 metrics/ai/audit; 过期自动回落免费;测试覆盖签发-校验/篡改/免费拒签 - 前端:菜单 Pro 项带锁标;四个 Pro 页面免费版渲染升级引导卡(功能清单+定价+页内激活); 设置页新增授权区(版本/席位/到期/激活入口);license 词典中英 - domains 注册提升到 main.tsx 全局(修复 license 命名空间在未引 domains 的页面显示裸键)
2026-10-31 23:08:06 +08:00
1 parent c60b827262
commit 9641503007
@@ -0,0 +1,75 @@
+import { memo, useState } from 'react'
+import { useNavigate } from 'react-router'
+import { useTranslation } from 'react-i18next'
+import { Lock, Sparkles } from 'lucide-react'
+import { toast } from 'sonner'
+import { Button } from '@/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { Input } from '@/components/ui/input'
+import { licenseApi } from '@/api/license'
+import { useLicense } from '@/hooks/useLicense'
+
+/** Pro 功能升级引导卡:免费版进入 Pro 页面时整页替代展示 */
+export const ProGate = memo(function ProGate({ featureKey }: { featureKey: string }) {
+  const { t } = useTranslation('license')
+  const { reload } = useLicense()
+  const navigate = useNavigate()
+  const [key, setKey] = useState('')
+  const [activating, setActivating] = useState(false)
+
+  const activate = async () => {
+    if (!key.trim()) return
+    setActivating(true)
+    try {
+      await licenseApi.activate(key.trim())
+      toast.success(t('activated'))
+      reload()
+    } catch (err) {
+      toast.error(err instanceof Error ? err.message : t('activateFailed'))
+    } finally {
+      setActivating(false)
+    }
+  }
+
+  return (
+    <div className="mx-auto max-w-2xl space-y-4 pt-8">
+      <Card>
+        <CardHeader className="pb-3">
+          <CardTitle className="flex items-center gap-2 text-base">
+            <Lock className="size-4 text-warning" />
+            {t('gate.title', { feature: t(`features.${featureKey}`) })}
+          </CardTitle>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          <p className="text-sm text-muted-foreground">{t('gate.desc')}</p>
+          <ul className="space-y-1.5 text-sm">
+            {['log_analysis', 'log_alerts', 'ai_ops', 'audit_log'].map(f => (
+              <li key={f} className="flex items-center gap-2">
+                <Sparkles className="size-3.5 text-primary" />
+                {t(`features.${f}`)}
+              </li>
+            ))}
+          </ul>
+          <div className="grid gap-3 sm:grid-cols-2">
+            <div className="rounded-lg border p-4">
+              <p className="text-sm font-semibold">{t('pricing.personalTitle')}</p>
+              <p className="mt-1 text-2xl font-bold text-primary">¥199<span className="text-sm font-normal text-muted-foreground"> {t('pricing.permanent')}</span></p>
+              <p className="mt-1 text-xs text-muted-foreground">{t('pricing.personalDesc')}</p>
+            </div>
+            <div className="rounded-lg border border-primary/40 p-4">
+              <p className="text-sm font-semibold">{t('pricing.teamTitle')}</p>
+              <p className="mt-1 text-2xl font-bold text-primary">¥499<span className="text-sm font-normal text-muted-foreground"> {t('pricing.permanent')}</span></p>
+              <p className="mt-1 text-xs text-muted-foreground">{t('pricing.teamDesc')}</p>
+            </div>
+          </div>
+          <div className="flex gap-2">
+            <Input value={key} onChange={e => setKey(e.target.value)} placeholder={t('gate.keyPlaceholder')} className="font-mono text-sm" />
+            <Button onClick={() => void activate()} disabled={activating || !key.trim()}>{t('gate.activate')}</Button>
+            <Button variant="outline" onClick={() => navigate('/settings')}>{t('gate.toSettings')}</Button>
+          </div>
+          <p className="text-xs text-muted-foreground">{t('gate.freeHint')}</p>
+        </CardContent>
+      </Card>
+    </div>
+  )
+})