fix(settings): 关于页补回微信群二维码并纳入仓库
This commit is contained in:
1 parent
9c2b623ce4
commit
f0d42db359
2 files changed
+79
-10
No files matched your search
+79
-10
@@ -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 |
Reference in new issue
Block a user