fix(settings): 关于页补回微信群二维码并纳入仓库

This commit is contained in:
logan committed 2026-10-15 14:33:23 +08:00
1 parent 9c2b623ce4
commit f0d42db359
2 files changed
+79 -10

No files matched your search

+79 -10
View File
@@ -20,6 +20,7 @@ import { DriverManager } from "./DriverManager";
import appPackage from "../package.json";
import { useWorkspaceStore } from "./store";
import { openExternal } from "./openExternal";
import wechatGroupQr from "./assets/wechat-group-qr.png";
const IS_MAC = typeof navigator !== "undefined" && /Mac/i.test(navigator.platform);
const MOD = IS_MAC ? "⌘" : "Ctrl";
@@ -109,6 +110,57 @@ function AboutLink({ label, description, onClick }: { label: string; description
);
}
function WechatGroupBlock() {
const [imgOk, setImgOk] = useState(true);
return (
<div className="space-y-2 rounded-lg border p-3" style={{ borderColor: "var(--ops-border-soft)" }}>
<div className="flex flex-col items-center gap-2">
{imgOk ? (
<img
src={wechatGroupQr}
alt="微信交流群二维码"
width={132}
height={132}
className="rounded-lg object-cover"
style={{
width: 132,
height: 132,
border: "1px solid var(--ops-border-soft)",
borderRadius: 8,
}}
onError={() => setImgOk(false)}
/>
) : (
<div
className="grid place-items-center text-center text-[11px]"
style={{
width: 132,
height: 132,
borderRadius: 8,
border: "1px dashed var(--ops-border)",
color: "var(--ops-muted)",
background: "var(--ops-surface-2)",
}}
>
二维码暂缺
<br />
请点下方链接加入
</div>
)}
<p className="text-center text-[11px]" style={{ color: "var(--ops-muted)" }}>
扫码加入交流群
</p>
</div>
<AboutLink
label="微信群"
description="扫码加入交流群"
onClick={() => void openExternal(WECHAT_GROUP_URL)}
/>
</div>
);
}
/** 设置弹框:左分类导航 + 右面板(对标 opsxshell / DBeaver Preferences) */
export function SettingsModal({ onClose }: { onClose: () => void }) {
const [tab, setTab] = useState<TabId>("general");
@@ -312,18 +364,35 @@ export function SettingsModal({ onClose }: { onClose: () => void }) {
{active === "about" && (
<div className="max-w-xl space-y-5 text-[12px]" style={{ color: "var(--ops-text)" }}>
<p className="px-1 text-[11px]" style={{ color: "var(--ops-muted)" }}>
<span className="font-mono">OpsxDB {appPackage.version}</span>
<span aria-hidden="true"> · </span>
桌面客户端
<span aria-hidden="true"> · </span>
本机服务 {version || "未连接"}
</p>
<div className="space-y-2 px-1">
<div className="flex justify-between gap-4">
<span style={{ color: "var(--ops-muted)" }}>应用版本</span>
<span className="font-mono">{appPackage.version}</span>
</div>
<div className="flex justify-between gap-4">
<span style={{ color: "var(--ops-muted)" }}>本机服务版本</span>
<span>{version || "服务未连接"}</span>
</div>
<div className="flex justify-between gap-4">
<span style={{ color: "var(--ops-muted)" }}>形态</span>
<span>桌面客户端(Tauri 2)</span>
</div>
<div className="flex justify-between gap-4">
<span style={{ color: "var(--ops-muted)" }}>驱动目录</span>
<span className="truncate font-mono" title="~/.opsxdb/drivers">~/.opsxdb/drivers</span>
</div>
</div>
<div>
<div className="mb-2 px-1 text-[11px] font-medium" style={{ color: "var(--ops-muted)" }}>资源</div>
<div className="divide-y divide-[color:var(--ops-border-soft)] overflow-hidden rounded-lg border" style={{ borderColor: "var(--ops-border-soft)" }}>
<AboutLink label="交流群" description="问题反馈与版本动态" onClick={() => void openExternal(WECHAT_GROUP_URL)} />
<AboutLink label="驱动商店" description="查看可用驱动与安装说明" onClick={() => void openExternal(DRIVER_STORE_URL)} />
<div className="space-y-2">
<WechatGroupBlock />
<div className="overflow-hidden rounded-lg border" style={{ borderColor: "var(--ops-border-soft)" }}>
<AboutLink
label="驱动商店"
description="gitee.com/attacker/opsxdb-driver"
onClick={() => void openExternal(DRIVER_STORE_URL)}
/>
</div>
</div>
</div>
</div>
Binary file not shown.

After

Width:  |  Height:  |  Size: 191 KiB