diff --git a/ui/README.md b/ui/README.md
index e13c3d7..4aeb60e 100644
--- a/ui/README.md
+++ b/ui/README.md
@@ -28,7 +28,12 @@ python3 -m http.server 8000 --directory ui
## 页面清单
-登录页:单一入口(邮箱登录占位),不做公共版/企业版二选一。
+登录页:单一入口(邮箱登录占位),不做公共版/企业版二选一;登录页含 **点数机制说明(US-2)**(1 点 ≈ 1 元 · 消费可小数 · 每日赠送 1 点等),并提供「**游客浏览**」入口(US-1)。
+
+**游客模式(US-1)**:未登录可点击「先逛逛市场」免登录进入模型市场——
+- 游客可:浏览模型、搜索、厂商筛选、排序、查看点数价格;
+- 游客不可:使用/消费模型(提示「请先登录」)、访问钱包/共享/交易/设置/管理视图(导航仅显示「市场」,其余页面点击提示需登录);
+- 登录后退出游客模式恢复完整导航;登出回到登录页(含游客浏览入口)。
同一套界面(角色视图):
diff --git a/ui/css/style.css b/ui/css/style.css
index 19c6b6c..80f8037 100644
--- a/ui/css/style.css
+++ b/ui/css/style.css
@@ -310,6 +310,17 @@ select.input option { background: var(--bg-card); }
.login-foot a { color: var(--accent-text); text-decoration: none; }
.login-tip { margin-top: 14px; text-align: center; color: var(--text-mute); font-size: 11px; }
+/* 登录页点数机制说明(US-2) */
+.login-points {
+ margin-top: 18px; padding: 12px 14px;
+ background: rgba(78, 205, 196, 0.06);
+ border: 1px dashed var(--border);
+ border-radius: 10px;
+}
+.login-points h4 { font-size: 13px; margin-bottom: 8px; color: var(--text); }
+.login-points ul { margin: 0; padding-left: 16px; display: flex; flex-direction: column; gap: 5px; }
+.login-points li { font-size: 12px; color: var(--text-dim); line-height: 1.5; }
+
/* ---------- 应用布局 ---------- */
.app { display: flex; height: 100vh; overflow: hidden; }
diff --git a/ui/index.html b/ui/index.html
index 737ef3d..4711dfd 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -27,8 +27,21 @@
AITokenPool
+ 或
+
静态演示原型 · 数据为内嵌 mock,无真实后端 · 管理员与普通用户由账号角色决定登录后看到的界面
+
+
+
+
点数机制 Points
+
+ - 1 点 ≈ 1 元人民币 · 消费点数可为小数(如 -0.37 点)
+ - 每日赠送 1 点(当日有效)· 连送 10 天,防薅羊毛
+ - 分享收益 & 充值点数永久有效 · 分享收益扣 10% 平台分成
+ - 未登录可先浏览市场;使用 / 消费需登录
+
+
diff --git a/ui/js/app.js b/ui/js/app.js
index 20de225..909cf25 100644
--- a/ui/js/app.js
+++ b/ui/js/app.js
@@ -13,6 +13,7 @@
let activeView = "dashboard";
let txTab = "all";
+ let isGuest = false; // 游客模式(US-1:未登录可浏览市场)
// MRT 风格表格状态(页面级变量:切换页面不丢失排序/筛选/分页)
const txTable = { sort: [], filters: {}, page: 1, pageSize: 10 };
@@ -82,10 +83,18 @@
admin: "管理视图 Admin",
};
+ // 游客可见的页面(US-1:仅市场;其余需登录)
+ const GUEST_VIEWS = ["marketplace"];
+
function renderNav() {
const nav = $("#nav");
nav.innerHTML = "";
- NAV.forEach((group) => {
+ const groups = isGuest
+ ? [{ g: "游客浏览", items: [
+ { id: "marketplace", ico: "🛒", label: "模型市场 Marketplace" },
+ ]}]
+ : NAV;
+ groups.forEach((group) => {
const g = document.createElement("div");
g.className = "nav-group";
g.textContent = group.g;
@@ -105,10 +114,15 @@
nav.appendChild(b);
});
});
- $("#mode-label").textContent = "共享市场 · 角色视图";
+ $("#mode-label").textContent = isGuest ? "游客模式 · 仅浏览市场" : "共享市场 · 角色视图";
}
function switchView(id) {
+ // 游客限制(US-1):非市场页面 → 提示需登录
+ if (isGuest && !GUEST_VIEWS.includes(id)) {
+ toast("请先登录后再访问「" + (VIEW_TITLE[id] || id) + "」");
+ return;
+ }
activeView = id;
$$(".view").forEach((v) => v.classList.add("hidden"));
$("#view-" + id).classList.remove("hidden");
@@ -807,12 +821,37 @@
toast("已扣 " + D.fmt(cost) + " 点(模拟 0.19M tokens)");
}
+ /* ---------------- 游客模式(US-1:未登录浏览市场) ---------------- */
+
+ function enterGuest() {
+ isGuest = true;
+ activeView = "marketplace";
+ $("#login-view").classList.add("hidden");
+ $("#app").classList.remove("hidden");
+ document.querySelector(".user-chip").classList.add("hidden");
+ renderNav();
+ switchView("marketplace");
+ toast("游客模式:可浏览模型市场,使用 / 消费需登录");
+ }
+
+ function exitGuest() {
+ isGuest = false;
+ $("#app").classList.add("hidden");
+ document.querySelector(".user-chip").classList.remove("hidden");
+ $("#login-view").classList.remove("hidden");
+ }
+
/* ---------------- 事件 ---------------- */
function bindEvents() {
+ // 游客浏览(US-1:登录页入口 → 免登录进入市场)
+ $("#guest-browse-btn").addEventListener("click", enterGuest);
+
// 登录(单一入口,角色由账号决定)
$("#login-form").addEventListener("submit", (e) => {
e.preventDefault();
+ isGuest = false;
+ document.querySelector(".user-chip").classList.remove("hidden");
$("#login-view").classList.add("hidden");
$("#app").classList.remove("hidden");
switchView("dashboard");
@@ -820,8 +859,7 @@
});
$("#logout-btn").addEventListener("click", () => {
- $("#app").classList.add("hidden");
- $("#login-view").classList.remove("hidden");
+ exitGuest();
toast("已退出(静态演示)");
});
@@ -834,10 +872,11 @@
$("#mk-provider").dataset.init = "1";
}
- // 市场页:使用 / 消费(G4:聊天 Mock 扣小数点数并产生 consume 交易)
+ // 市场页:使用 / 消费(G4:聊天 Mock 扣小数点数并产生 consume 交易;游客需先登录 US-1)
$("#mk-body").addEventListener("click", (e) => {
const b = e.target.closest("[data-use-model]");
if (!b) return;
+ if (isGuest) { toast("请先登录后再使用 / 消费模型"); return; }
openChat(Number(b.dataset.useModel));
});
$("#chat-send").addEventListener("click", sendChat);