refactor: 全局重构原生弹窗为自定义 Modal 并同步更新项目文档

- 替换所有不可用的 `alert`, `confirm`, `prompt` 调用为异步的自定义 `Modal` 组件以适配 Tauri WebView 的 API 限制。
- 优化与重构核心服务组件接口，增加模型有效性测试 (`test_model`) 以及依赖更新支持。
- 同步补齐 `README.md` 与 `CHANGELOG.md` 新增的系统特性说明（含仪表盘、日记、存储、重构页面调整）。

src/pages/about.js

@@ -3,21 +3,29 @@
  * 版本信息、项目链接、相关项目、系统环境
  */
 import { api } from '../lib/tauri-api.js'
+import { toast } from '../components/toast.js'
 
 export async function render() {
   const page = document.createElement('div')
   page.className = 'page'
 
   page.innerHTML = `
-    <div class="page-header">
-      <h1 class="page-title">关于</h1>
-      <p class="page-desc">ClawPanel — OpenClaw 可视化管理面板</p>
+    <div class="page-header" style="display:flex;align-items:center;gap:16px">
+      <img src="/images/logo.svg" alt="ClawPanel" style="width:48px;height:48px;border-radius:var(--radius-md)">
+      <div>
+        <h1 class="page-title" style="margin:0">ClawPanel</h1>
+        <p class="page-desc" style="margin:0">OpenClaw 可视化管理面板</p>
+      </div>
     </div>
     <div class="stat-cards" id="version-cards">
       <div class="stat-card loading-placeholder"></div>
       <div class="stat-card loading-placeholder"></div>
       <div class="stat-card loading-placeholder"></div>
     </div>
+    <div class="config-section">
+      <div class="config-section-title">社群交流</div>
+      <div id="community-section"></div>
+    </div>
     <div class="config-section">
       <div class="config-section-title">相关项目</div>
       <div id="projects-list"></div>
@@ -33,6 +41,7 @@ export async function render() {
   `
 
   loadData(page)
+  renderCommunity(page)
   renderProjects(page)
   renderLinks(page)
   return page
@@ -45,28 +54,88 @@ async function loadData(page) {
       api.getVersionInfo(),
       api.checkInstallation(),
     ])
+
+    // 尝试从 Tauri API 获取 ClawPanel 自身版本号，失败则 fallback
+    let panelVersion = '0.1.0'
+    try {
+      const { getVersion } = await import('@tauri-apps/api/app')
+      panelVersion = await getVersion()
+    } catch {
+      // 非 Tauri 环境或 API 不可用，使用 fallback
+    }
+
     cards.innerHTML = `
       <div class="stat-card">
         <div class="stat-card-header"><span class="stat-card-label">ClawPanel</span></div>
-        <div class="stat-card-value">0.1.0</div>
+        <div class="stat-card-value">${panelVersion}</div>
         <div class="stat-card-meta">Tauri v2 桌面应用</div>
       </div>
       <div class="stat-card">
         <div class="stat-card-header"><span class="stat-card-label">OpenClaw</span></div>
-        <div class="stat-card-value">${version.current || '未知'}</div>
-        <div class="stat-card-meta">${version.update_available ? '有新版本可用' : '已是最新'}</div>
+        <div class="stat-card-value">${version.current || '未安装'}</div>
+        <div class="stat-card-meta" style="display:flex;align-items:center;gap:8px">
+          ${version.update_available
+            ? `<span style="color:var(--accent)">新版本: ${version.latest}</span><button class="btn btn-primary btn-sm" id="btn-upgrade" style="padding:2px 8px;font-size:var(--font-size-xs)">升级</button>`
+            : version.current ? '<span style="color:var(--success)">已是最新</span>' : '<span style="color:var(--error)">未检测到</span>'}
+        </div>
       </div>
       <div class="stat-card">
         <div class="stat-card-header"><span class="stat-card-label">安装路径</span></div>
         <div class="stat-card-value" style="font-size:var(--font-size-sm);word-break:break-all">${install.path || '未知'}</div>
-        <div class="stat-card-meta">${install.installed ? '已安装' : '未安装'}</div>
+        <div class="stat-card-meta">${install.installed ? '配置文件存在' : '未找到配置文件'}</div>
       </div>
     `
+
+    // 绑定升级按钮
+    const upgradeBtn = cards.querySelector('#btn-upgrade')
+    if (upgradeBtn) {
+      upgradeBtn.onclick = async () => {
+        upgradeBtn.disabled = true
+        upgradeBtn.textContent = '升级中...'
+        try {
+          const msg = await api.upgradeOpenclaw()
+          upgradeBtn.textContent = '完成'
+          // 刷新版本信息
+          loadData(page)
+        } catch (e) {
+          upgradeBtn.disabled = false
+          upgradeBtn.textContent = '升级失败'
+          toast('升级失败: ' + e, 'error')
+        }
+      }
+    }
   } catch {
     cards.innerHTML = '<div class="stat-card"><div class="stat-card-label">加载失败</div></div>'
   }
 }
 
+function renderCommunity(page) {
+  const el = page.querySelector('#community-section')
+  el.innerHTML = `
+    <div style="display:flex;gap:24px;flex-wrap:wrap;align-items:flex-start">
+      <div style="text-align:center">
+        <img src="/images/OpenClaw-QQ.png" alt="QQ 交流群" style="width:140px;height:140px;border-radius:var(--radius-md);border:1px solid var(--border-primary)">
+        <div style="font-size:var(--font-size-sm);margin-top:8px;color:var(--text-secondary)">QQ 交流群</div>
+      </div>
+      <div style="text-align:center">
+        <img src="/images/OpenClawWx.png" alt="微信交流群" style="width:140px;height:140px;border-radius:var(--radius-md);border:1px solid var(--border-primary)">
+        <div style="font-size:var(--font-size-sm);margin-top:8px;color:var(--text-secondary)">微信交流群</div>
+      </div>
+      <div style="flex:1;min-width:200px;display:flex;flex-direction:column;gap:8px;padding-top:4px">
+        <div style="font-size:var(--font-size-sm);color:var(--text-secondary)">扫码或点击链接加入交流群，反馈问题、获取帮助</div>
+        <div style="display:flex;flex-wrap:wrap;gap:8px;margin-top:8px">
+          <a class="btn btn-primary btn-sm" href="https://qt.cool/c/OpenClaw" target="_blank" rel="noopener">加入 QQ 群</a>
+          <a class="btn btn-primary btn-sm" href="https://qt.cool/c/OpenClawWx" target="_blank" rel="noopener">加入微信群</a>
+          <a class="btn btn-secondary btn-sm" href="https://yb.tencent.com/gp/i/LsvIw7mdR7Lb" target="_blank" rel="noopener">元宝派社群</a>
+        </div>
+        <div style="font-size:var(--font-size-xs);color:var(--text-tertiary);margin-top:8px">
+          2000 人大群，满员自动切换 · 碰到问题可直接在群内反馈
+        </div>
+      </div>
+    </div>
+  `
+}
+
 const PROJECTS = [
   {
     name: 'OpenClaw',