zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 页面调整

Browse Source
This commit is contained in:
zoujing
2026-07-30 17:49:55 +08:00
parent a4e58a780a
commit 7081420384
29 changed files with 946 additions and 432 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.superpowers/brainstorm/22655-1785395892/state/server.pid Normal file
View File

@@ -0,0 +1 @@
22655

72
.superpowers/brainstorm/22705-1785395917/content/client-architecture.html Normal file
View File

@@ -0,0 +1,72 @@
<h2>设计第一部分：页面流与组件边界</h2>
<p class="subtitle">一个 uni-app 路由承载完整游客端，以页面状态切换保持连续体验；每个复杂页面拆成同目录子组件。</p>
<div class="mockup">
<div class="mockup-header">src/pages-service/tickets/index.vue · 页面壳层</div>
<div class="mockup-body" style="background:#f8fafc">
<div style="display:grid;grid-template-columns:1.15fr .85fr;gap:18px">
<div>
<div class="label">浏览与购买主链路</div>
<div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px">
<div style="padding:11px 13px;border-radius:12px;background:#064e3b;color:white;font-weight:800">首页<br><small style="font-weight:500;opacity:.75">分类联动列表</small></div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:white;border:1px solid #cbd5e1;font-weight:800">商品详情</div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:white;border:1px solid #cbd5e1;font-weight:800">预订选择</div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:white;border:1px solid #cbd5e1;font-weight:800">填写游客</div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:#f97316;color:white;font-weight:800">支付成功</div>
</div>
<div class="label" style="margin-top:24px">订单与售后支线</div>
<div style="display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:10px">
<div style="padding:11px 13px;border-radius:12px;background:#1e3a8a;color:white;font-weight:800">我的订单</div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:white;border:1px solid #cbd5e1;font-weight:800">订单详情</div>
<span>→</span>
<div style="padding:11px 13px;border-radius:12px;background:#ede9fe;color:#5b21b6;font-weight:800">我的凭证</div>
<span style="color:#94a3b8">或</span>
<div style="padding:11px 13px;border-radius:12px;background:#fff7ed;color:#c2410c;font-weight:800">申请退款 → 结果</div>
</div>
</div>
<div style="border-left:1px dashed #cbd5e1;padding-left:18px">
<div class="label">同目录模块</div>
<div style="display:grid;gap:8px;margin-top:10px;font-size:13px">
<div style="padding:10px 12px;background:white;border-radius:10px;border:1px solid #e2e8f0"><strong>components/</strong> 各页面视图与商品卡片</div>
<div style="padding:10px 12px;background:white;border-radius:10px;border:1px solid #e2e8f0"><strong>data.js</strong> 商品、分组、游客、订单默认结构</div>
<div style="padding:10px 12px;background:white;border-radius:10px;border:1px solid #e2e8f0"><strong>model.mjs</strong> 页面跳转、价格、订单与退款纯逻辑</div>
<div style="padding:10px 12px;background:white;border-radius:10px;border:1px solid #e2e8f0"><strong>index.vue</strong> 状态编排、返回规则和共享数据</div>
</div>
</div>
</div>
</div>
</div>
<div class="section" style="margin-top:22px">
<h3>交互约定</h3>
<ul>
<li>点击商品图片或标题进入详情；点击“选购”直接进入预订选择。</li>
<li>首页头图和左侧分类固定，右侧商品列表独立滚动；分类点击与滚动高亮双向联动。</li>
<li>页面内返回按来源状态回退；首页左上角使用 <code>uni.navigateBack</code>。</li>
<li>右上角用户按钮进入常用出行人，订单按钮进入我的订单。</li>
</ul>
</div>
<div class="options">
<div class="option" data-choice="architecture-approved" onclick="toggleSelect(this)">
<div class="letter">✓</div>
<div class="content">
<h3>确认此结构</h3>
<p>按上面的页面流、组件边界和返回规则继续。</p>
</div>
</div>
<div class="option" data-choice="architecture-adjust" onclick="toggleSelect(this)">
<div class="letter">✎</div>
<div class="content">
<h3>需要调整</h3>
<p>选中后在终端告诉我希望修改的页面或交互。</p>
</div>
</div>
</div>

67
.superpowers/brainstorm/22705-1785395917/content/client-scope.html Normal file
View File

@@ -0,0 +1,67 @@
<h2>游客端迁移范围确认</h2>
<p class="subtitle">原型中的游客端不只有截图首页，还串联了商品、预订、订单、退款和凭证。请选择这次要落地的交互深度。</p>
<div class="cards">
<div class="card" data-choice="full-client-flow" onclick="toggleSelect(this)">
<div class="card-image" style="padding:18px;background:linear-gradient(145deg,#052e2b,#0f766e);color:white">
<div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;font-weight:700">
<span style="padding:8px 12px;background:#fff;color:#064e3b;border-radius:999px">景区首页</span>
<span>→</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">商品详情</span>
<span>→</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">预订选择</span>
<span>→</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">填写游客</span>
<span>→</span>
<span style="padding:8px 12px;background:#fb923c;border-radius:999px">支付结果</span>
</div>
<div style="height:18px;border-left:2px dashed #ffffff80;margin-left:30px"></div>
<div style="display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;font-weight:700">
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">我的订单</span>
<span>→</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">订单详情</span>
<span>→</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">我的凭证</span>
<span style="opacity:.65">／</span>
<span style="padding:8px 12px;background:#ffffff20;border-radius:999px">申请退款</span>
</div>
</div>
<div class="card-body">
<h3>A · 完整游客端链路（推荐）</h3>
<p>迁移所有游客可点击进入的状态页，用本地默认数据模拟下单、支付、订单、退款与凭证。</p>
</div>
</div>
<div class="card" data-choice="purchase-flow" onclick="toggleSelect(this)">
<div class="card-image" style="padding:18px;background:#eff6ff">
<div style="display:grid;grid-template-columns:repeat(5,1fr);gap:8px;text-align:center;font-size:12px;color:#1e3a8a">
<div style="padding:14px 6px;background:#fff;border-radius:12px">首页</div>
<div style="padding:14px 6px;background:#fff;border-radius:12px">详情</div>
<div style="padding:14px 6px;background:#fff;border-radius:12px">日期</div>
<div style="padding:14px 6px;background:#fff;border-radius:12px">游客</div>
<div style="padding:14px 6px;background:#dbeafe;border-radius:12px">支付</div>
</div>
</div>
<div class="card-body">
<h3>B · 仅购买链路</h3>
<p>做到支付完成；不实现我的订单、订单详情、退款和凭证页面。</p>
</div>
</div>
<div class="card" data-choice="browse-only" onclick="toggleSelect(this)">
<div class="card-image" style="padding:18px;background:#fff7ed">
<div style="display:flex;gap:12px;align-items:stretch">
<img src="https://one-feel-bucket.oss-cn-guangzhou.aliyuncs.com/oneFeel/2082673896938569729.jpg" style="width:42%;height:112px;object-fit:cover;border-radius:14px">
<div style="flex:1;background:white;border-radius:14px;padding:14px">
<div style="font-weight:800;color:#172033">成人门票＋观光车</div>
<div style="margin-top:12px;color:#2563eb;font-size:12px">官方　可订明日　随时退</div>
<div style="margin-top:18px;color:#ea580c;font-size:22px;font-weight:900">¥160</div>
</div>
</div>
</div>
<div class="card-body">
<h3>C · 仅浏览展示</h3>
<p>只迁移截图首页和商品详情，选购按钮不继续进入预订流程。</p>
</div>
</div>
</div>

3
.superpowers/brainstorm/22705-1785395917/content/waiting-data-design.html Normal file
View File

@@ -0,0 +1,3 @@
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
<p class="subtitle">页面结构已确认，继续在终端确认数据、校验与验收设计…</p>
</div>

3
.superpowers/brainstorm/22705-1785395917/content/waiting-implementation-structure.html Normal file
View File

@@ -0,0 +1,3 @@
<div style="display:flex;align-items:center;justify-content:center;min-height:60vh">
<p class="subtitle">已确认完整游客端链路，继续在终端讨论实现结构…</p>
</div>

1
.superpowers/brainstorm/22705-1785395917/state/server-stopped Normal file
View File

@@ -0,0 +1 @@
{"reason":"idle timeout","timestamp":1785398377405}

1
.superpowers/brainstorm/22705-1785395917/state/server.pid Normal file
View File

@@ -0,0 +1 @@
22705