+
-
-
@@ -263,13 +271,10 @@ function openDetail(id){
document.getElementById('odStatus').innerHTML = statusPill(o.status);
const endKey = o.endKind === 'valid' ? 'kValid' : 'kDeadline';
+ // 摘要头已显套餐/金额/状态,明细只留细粒度字段,去重
const kv = ''
+ kvRow('kOrderNo', esc(o.id), true)
- + kvRow('kPlan', esc(planLabel(o.plan)), false)
- + kvRow('kAmount', esc(o.amount), false)
+ kvRow('kMethod', esc(methodLabel(o.method)), false)
- + '
' + esc(t('kStatus')) + ''
- + '' + statusPill(o.status) + '
'
+ kvRow('kCreated', esc(o.created), false)
+ kvRow(endKey, esc(o.ended), false)
+ kvRow('kTrade', esc(o.trade), o.trade !== '—');
diff --git a/design/prototype/screens/ui-desktop.html b/design/prototype/screens/ui-desktop.html
index 5fe1340..7c138fe 100644
--- a/design/prototype/screens/ui-desktop.html
+++ b/design/prototype/screens/ui-desktop.html
@@ -238,14 +238,21 @@
.orders-view{ padding:var(--space-5) var(--space-6) var(--space-8); max-width:600px; margin:0 auto; }
.od-screen{ display:none; }
.od-screen.is-active{ display:block; }
- .orders-view .od-summary{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-3); padding:var(--space-5); }
- .orders-view .od-plan{ font-family:var(--font-sans); font-size:var(--text-sm); font-weight:600; color:var(--fg2); }
+ /* 订单详情 = 一张「收据」卡:顶部渐变条 + 摘要头(金额左/状态右) + 虚线撕裂线 + 明细 */
+ .od-receipt{ position:relative; overflow:hidden; margin-bottom:var(--space-5); padding:0; }
+ .od-receipt::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px;
+ background:linear-gradient(90deg,var(--clay-500),var(--clay-800)); }
+ .orders-view .od-summary{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-4);
+ padding:calc(var(--space-5) + 3px) var(--space-5) var(--space-4); }
+ .orders-view .od-sum-main{ display:flex; flex-direction:column; gap:var(--space-2); min-width:0; }
+ .orders-view .od-plan{ font-family:var(--font-sans); font-size:var(--text-caption); font-weight:700; color:var(--fg3);
+ letter-spacing:var(--tracking-caps); text-transform:uppercase; }
.orders-view .od-amount{ font-family:var(--font-display); font-size:var(--text-h1); font-weight:700; color:var(--fg1);
letter-spacing:var(--tracking-tight); font-feature-settings:'tnum' 1; line-height:1; }
- .od-sumcard{ margin-bottom:var(--space-5); }
- .od-detail-sec{ margin-bottom:var(--space-5); }
- .od-sec{ font-size:var(--text-caption); color:var(--fg3); font-weight:700; letter-spacing:var(--tracking-caps);
- text-transform:uppercase; padding:0 var(--space-2) var(--space-2); }
+ .od-perf-line{ border-top:1.5px dashed var(--border-strong); margin:0 var(--space-5); }
+ .orders-view .od-kv{ padding:var(--space-3) var(--space-5) var(--space-5); }
+ .orders-view .od-kv .kv-row{ border-top:1px solid var(--border); }
+ .orders-view .od-kv .kv-row:first-child{ border-top:none; }
.orders-view .od-actions{ display:flex; flex-direction:column; gap:var(--space-3); }
.orders-view .setting-row .st-trail .pill{ padding:3px var(--space-2); font-size:11px; }
.orders-view .setting-row .st-trail > svg{ width:18px; height:18px; }
@@ -783,16 +790,16 @@
-
@@ -1441,12 +1448,10 @@ function openOrderDetail(id){
document.getElementById('odAmount').textContent=o.amount;
document.getElementById('odStatus').innerHTML=ordStatusPill(o.status);
var endKey = o.endKind==='valid' ? 'ord.kValid' : 'ord.kDeadline';
+ // 摘要头已显套餐/金额/状态,明细只留细粒度字段,去重
var kv=''
+ ordKvRow('ord.kOrderNo', ordEsc(o.id), true)
- + ordKvRow('ord.kPlan', ordEsc(ordPlanLabel(o.plan)), false)
- + ordKvRow('ord.kAmount', ordEsc(o.amount), false)
+ ordKvRow('ord.kMethod', ordEsc(ordMethodLabel(o.method)), false)
- + '
'+ordEsc(I18N['ord.kStatus'][S.lang])+''+ordStatusPill(o.status)+'
'
+ ordKvRow('ord.kCreated', ordEsc(o.created), false)
+ ordKvRow(endKey, ordEsc(o.ended), false)
+ ordKvRow('ord.kTrade', ordEsc(o.trade), o.trade!=='—');
diff --git a/design/prototype/screens/ui-mobile.html b/design/prototype/screens/ui-mobile.html
index f35584f..c5789c5 100644
--- a/design/prototype/screens/ui-mobile.html
+++ b/design/prototype/screens/ui-mobile.html
@@ -276,10 +276,21 @@
#ordersOverlay .setting-row .st-trail .pill{ padding:3px var(--space-2); font-size:11px; }
#ordersOverlay .setting-row .st-trail > svg{ width:18px; height:18px; }
#ordersOverlay .pill-accent .dot{ background:var(--fg-on-accent); }
- .ord-summary{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-3); padding:var(--space-5); }
- .ord-plan{ font-family:var(--font-sans); font-size:var(--text-sm); font-weight:600; color:var(--fg2); }
+ /* 订单详情 = 一张「收据」卡:顶部渐变条 + 摘要头(金额左/状态右) + 虚线撕裂线 + 明细 */
+ .ord-receipt{ position:relative; overflow:hidden; padding:0; }
+ .ord-receipt::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px;
+ background:linear-gradient(90deg,var(--clay-500),var(--clay-800)); }
+ .ord-summary{ display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-3);
+ padding:calc(var(--space-5) + 3px) var(--space-5) var(--space-4); }
+ .ord-sum-main{ display:flex; flex-direction:column; gap:var(--space-2); min-width:0; }
+ .ord-plan{ font-family:var(--font-sans); font-size:var(--text-caption); font-weight:700; color:var(--fg3);
+ letter-spacing:var(--tracking-caps); text-transform:uppercase; }
.ord-amount{ font-family:var(--font-display); font-size:var(--text-h1); font-weight:700; color:var(--fg1);
letter-spacing:var(--tracking-tight); font-feature-settings:'tnum' 1; line-height:1; }
+ .ord-perf-line{ border-top:1.5px dashed var(--border-strong); margin:0 var(--space-5); }
+ .ord-kv{ padding:var(--space-3) var(--space-5) var(--space-5); }
+ .ord-kv .kv-row{ border-top:1px solid var(--border); }
+ .ord-kv .kv-row:first-child{ border-top:none; }
.ord-sec{ font-size:var(--text-caption); color:var(--fg3); font-weight:700;
letter-spacing:var(--tracking-caps); text-transform:uppercase; padding:0 var(--space-2) var(--space-2); }
.ord-kv-status{ padding-top:2px; }
@@ -754,16 +765,16 @@
-
@@ -1551,12 +1562,10 @@ function ordOpenDetail(id){
$('#ordDetAmount').textContent=o.amount;
$('#ordDetStatus').innerHTML=ordStatusPill(o.status);
const endKey=o.endKind==='valid'?'kValid':'kDeadline';
+ // 摘要头已显套餐/金额/状态,明细只留细粒度字段,去重
const kv = ''
+ ordKvRow('kOrderNo', ordEsc(o.id), true)
- + ordKvRow('kPlan', ordEsc(ordPlanLabel(o.plan)), false)
- + ordKvRow('kAmount', ordEsc(o.amount), false)
+ ordKvRow('kMethod', ordEsc(ordMethodLabel(o.method)), false)
- + '
'+ordEsc(D().kStatus)+''+ordStatusPill(o.status)+'
'
+ ordKvRow('kCreated', ordEsc(o.created), false)
+ ordKvRow(endKey, ordEsc(o.ended), false)
+ ordKvRow('kTrade', ordEsc(o.trade), o.trade!=='—');