feat(prototype): redesign desktop procurement workspace
This commit is contained in:
QiuSW
+337
-61
@@ -4,7 +4,7 @@
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" href="data:,">
|
||||
<title>cmbuyer 桌面端原型 · 采购执行</title>
|
||||
<title>采购工具 · 采购执行原型</title>
|
||||
<style>
|
||||
:root {
|
||||
color-scheme: light dark;
|
||||
@@ -182,7 +182,7 @@
|
||||
.tool-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
|
||||
.status-strip {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(260px, .9fr);
|
||||
border: 1px solid var(--stroke);
|
||||
border-radius: var(--radius-card);
|
||||
background: var(--surface-raised);
|
||||
@@ -190,18 +190,25 @@
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
.health { display: grid; grid-template-columns: auto 1fr; gap: 4px 9px; padding: 12px 16px; border-right: 1px solid var(--divider); }
|
||||
.health:last-child { border-right: 0; }
|
||||
.health:nth-child(3) { border-right: 1px solid var(--divider); }
|
||||
.health-mark { width: 10px; height: 10px; border-radius: 50%; background: currentColor; margin-top: 5px; }
|
||||
.health strong { font-weight: 650; }
|
||||
.health span:last-child { grid-column: 2; color: var(--text-secondary); font-size: 12px; }
|
||||
.session-control { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 10px 12px; }
|
||||
.session-copy { min-width: 0; }
|
||||
.session-copy span { display: block; color: var(--text-secondary); font-size: 11px; }
|
||||
.session-copy strong { display: block; overflow-wrap: anywhere; }
|
||||
.session-control .primary { min-width: 112px; }
|
||||
.disabled-reason { grid-column: 1 / -1; color: var(--text-secondary); font-size: 11px; }
|
||||
.tone-success { color: var(--success); }
|
||||
.tone-info { color: var(--info); }
|
||||
.tone-caution { color: var(--caution); }
|
||||
.tone-critical { color: var(--critical); }
|
||||
.banner {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr;
|
||||
grid-template-columns: auto minmax(0, 1fr) auto;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
padding: 12px 14px;
|
||||
border: 1px solid currentColor;
|
||||
@@ -215,8 +222,9 @@
|
||||
.banner-symbol { font-weight: 800; }
|
||||
.banner strong { display: block; margin-bottom: 2px; }
|
||||
.banner p { margin: 0; color: var(--text-primary); }
|
||||
.workspace { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(320px, .7fr); gap: 12px; margin-top: 12px; }
|
||||
.stack { display: grid; gap: 12px; align-content: start; }
|
||||
.banner button[hidden] { display: none; }
|
||||
.workspace { display: grid; grid-template-columns: minmax(0, 1.85fr) minmax(320px, 1fr); gap: 12px; margin-top: 12px; align-items: stretch; }
|
||||
.stack { display: grid; grid-template-rows: auto minmax(240px, 1fr); gap: 12px; min-width: 0; }
|
||||
.card { border: 1px solid var(--stroke); border-radius: var(--radius-card); background: var(--surface-raised); box-shadow: 0 2px 8px rgba(0,0,0,.04); overflow: hidden; }
|
||||
.card-header { display: flex; align-items: start; justify-content: space-between; gap: 12px; padding: 14px 16px 10px; border-bottom: 1px solid var(--divider); }
|
||||
.card-header h1, .card-header h2 { margin: 0; font-size: 17px; line-height: 1.35; }
|
||||
@@ -227,6 +235,8 @@
|
||||
.badge[data-tone="caution"] { color: var(--caution); background: var(--caution-soft); }
|
||||
.badge[data-tone="critical"] { color: var(--critical); background: var(--critical-soft); }
|
||||
.card-body { padding: 14px 16px 16px; }
|
||||
.task-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(180px, 1fr); gap: 16px; align-items: start; }
|
||||
.task-copy { min-width: 0; }
|
||||
.task-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 20px; margin: 0; }
|
||||
.task-grid div { min-width: 0; }
|
||||
.task-grid dt { color: var(--text-secondary); font-size: 12px; }
|
||||
@@ -239,31 +249,79 @@
|
||||
.steps li.active { color: var(--text-primary); font-weight: 650; }
|
||||
.steps li.active .step-mark { border-color: var(--accent); box-shadow: inset 0 0 0 4px var(--accent-soft); }
|
||||
.steps small { color: var(--text-secondary); font-weight: 400; }
|
||||
.metric-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
|
||||
.metric { padding: 10px; border: 1px solid var(--divider); border-radius: 6px; background: var(--surface-muted); }
|
||||
.metric span { display: block; color: var(--text-secondary); font-size: 11px; }
|
||||
.metric strong { display: block; margin-top: 2px; font-size: 16px; font-variant-numeric: tabular-nums; }
|
||||
.log-list { list-style: none; padding: 0; margin: 0; max-height: 290px; overflow: auto; }
|
||||
.product-preview { margin: 0; min-width: 0; border: 1px solid var(--divider); border-radius: 6px; overflow: hidden; background: var(--surface-muted); }
|
||||
.preview-stage { aspect-ratio: 4 / 3; min-height: 148px; display: grid; place-items: center; padding: 12px; border-bottom: 1px solid var(--divider); }
|
||||
.preview-stage svg { width: 100%; height: 100%; max-height: 210px; }
|
||||
.preview-empty { color: var(--text-secondary); text-align: center; }
|
||||
.preview-empty strong { display: block; color: var(--text-primary); margin-bottom: 4px; }
|
||||
.product-preview figcaption { padding: 9px 10px; color: var(--text-secondary); font-size: 11px; }
|
||||
.product-preview figcaption span, .product-preview figcaption time { display: block; }
|
||||
.log-card { display: flex; min-height: 240px; flex-direction: column; }
|
||||
.log-tools { display: flex; align-items: center; justify-content: flex-end; gap: 10px; flex-wrap: wrap; }
|
||||
.inline-metrics { display: flex; gap: 10px; flex-wrap: wrap; }
|
||||
.inline-metrics span { color: var(--text-secondary); font-size: 11px; white-space: nowrap; }
|
||||
.inline-metrics strong { color: var(--text-primary); font-variant-numeric: tabular-nums; }
|
||||
.log-list { list-style: none; padding: 0; margin: 0; min-height: 210px; max-height: 360px; overflow: auto; }
|
||||
.log-list li { display: grid; grid-template-columns: 64px 78px 1fr; gap: 8px; padding: 8px 16px; border-bottom: 1px solid var(--divider); }
|
||||
.log-list li:last-child { border-bottom: 0; }
|
||||
.log-list time { color: var(--text-secondary); font-variant-numeric: tabular-nums; }
|
||||
.log-level { font-size: 12px; font-weight: 650; }
|
||||
.poll-bar { margin-top: 12px; padding: 12px 16px; display: grid; grid-template-columns: minmax(160px, auto) 1fr auto; gap: 16px; align-items: center; border: 1px solid var(--stroke); border-radius: var(--radius-card); background: var(--surface-raised); box-shadow: var(--shadow); }
|
||||
.poll-summary { display: flex; gap: 20px; flex-wrap: wrap; }
|
||||
.poll-summary span { color: var(--text-secondary); font-size: 12px; }
|
||||
.poll-summary strong { color: var(--text-primary); font-variant-numeric: tabular-nums; }
|
||||
.disabled-reason { color: var(--text-secondary); font-size: 12px; max-width: 320px; }
|
||||
dialog { width: min(560px, calc(100vw - 32px)); border: 1px solid var(--stroke); border-radius: 8px; padding: 0; color: var(--text-primary); background: var(--surface-raised); box-shadow: 0 24px 80px rgba(0,0,0,.3); }
|
||||
.record-card { min-width: 0; min-height: 0; display: flex; flex-direction: column; }
|
||||
.record-actions { display: flex; align-items: center; gap: 8px; }
|
||||
.table-wrap { min-height: 420px; max-height: 720px; overflow: auto; flex: 1; }
|
||||
.record-table { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
|
||||
.record-table th { position: sticky; top: 0; z-index: 1; padding: 9px 12px; color: var(--text-secondary); background: var(--surface-muted); border-bottom: 1px solid var(--stroke); text-align: left; font-size: 12px; }
|
||||
.record-table th:last-child { width: 112px; }
|
||||
.record-table td { padding: 10px 12px; border-bottom: 1px solid var(--divider); vertical-align: top; }
|
||||
.record-table tbody tr { cursor: default; }
|
||||
.record-table tbody tr:hover { background: var(--surface-muted); }
|
||||
.record-table tbody tr[aria-selected="true"] { background: var(--accent-soft); }
|
||||
.record-table tbody tr:focus-visible { position: relative; outline-offset: -3px; }
|
||||
.record-title { display: block; font-weight: 650; overflow-wrap: anywhere; }
|
||||
.record-meta { display: block; margin-top: 3px; color: var(--text-secondary); font-size: 11px; font-variant-numeric: tabular-nums; }
|
||||
.record-status { display: inline-flex; padding: 2px 7px; border: 1px solid currentColor; border-radius: 999px; font-size: 11px; font-weight: 650; }
|
||||
.record-status[data-tone="success"] { color: var(--success); }
|
||||
.record-status[data-tone="info"] { color: var(--info); }
|
||||
.record-status[data-tone="caution"] { color: var(--caution); }
|
||||
.record-status[data-tone="critical"] { color: var(--critical); }
|
||||
.table-empty { padding: 28px 16px; color: var(--text-secondary); text-align: center; }
|
||||
.table-help { margin: 0; padding: 9px 12px; color: var(--text-secondary); border-top: 1px solid var(--divider); font-size: 11px; }
|
||||
.context-menu { position: fixed; z-index: 20; min-width: 150px; padding: 4px; border: 1px solid var(--stroke); border-radius: 6px; background: var(--surface-raised); box-shadow: var(--shadow); }
|
||||
.context-menu[hidden] { display: none; }
|
||||
.context-menu button { width: 100%; justify-content: flex-start; border-color: transparent; }
|
||||
dialog { width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; border: 1px solid var(--stroke); border-radius: 8px; padding: 0; color: var(--text-primary); background: var(--surface-raised); box-shadow: 0 24px 80px rgba(0,0,0,.3); }
|
||||
dialog::backdrop { background: rgba(0,0,0,.42); }
|
||||
.dialog-body { padding: 20px; }
|
||||
.dialog-body h2 { margin: 0 0 8px; font-size: 18px; }
|
||||
.dialog-body p { margin: 0 0 10px; }
|
||||
.dialog-body code { overflow-wrap: anywhere; }
|
||||
.dialog-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 20px; border-top: 1px solid var(--divider); }
|
||||
.record-dialog { width: min(940px, calc(100vw - 32px)); }
|
||||
.record-dialog header { display: flex; justify-content: space-between; gap: 12px; padding: 16px 20px 12px; border-bottom: 1px solid var(--divider); }
|
||||
.record-dialog header h2 { margin: 0; font-size: 18px; }
|
||||
.record-dialog header p { margin: 3px 0 0; color: var(--text-secondary); font-size: 12px; }
|
||||
.record-dialog-grid { display: grid; grid-template-columns: minmax(0, 3fr) minmax(260px, 2fr); gap: 16px; padding: 16px 20px; }
|
||||
.detail-panel { min-width: 0; }
|
||||
.detail-panel h3, .record-result h3 { margin: 0 0 9px; font-size: 14px; }
|
||||
.detail-list { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 7px 12px; margin: 0; }
|
||||
.detail-list dt { color: var(--text-secondary); }
|
||||
.detail-list dd { margin: 0; overflow-wrap: anywhere; }
|
||||
.timeline { margin: 14px 0 0; padding-left: 20px; color: var(--text-secondary); }
|
||||
.timeline li + li { margin-top: 5px; }
|
||||
.evidence-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
|
||||
.evidence-card { margin: 0; border: 1px solid var(--divider); border-radius: 6px; overflow: hidden; background: var(--surface-muted); }
|
||||
.evidence-card:only-child { grid-column: 1 / -1; }
|
||||
.evidence-card svg { display: block; width: 100%; aspect-ratio: 4 / 3; }
|
||||
.evidence-card figcaption { padding: 8px 10px; color: var(--text-secondary); font-size: 11px; }
|
||||
.record-result { padding: 14px 20px 18px; border-top: 1px solid var(--divider); }
|
||||
.result-value { margin: 0; padding: 12px; border: 1px solid var(--divider); border-radius: 6px; background: var(--surface-muted); font-weight: 650; overflow-wrap: anywhere; }
|
||||
.result-note { margin: 8px 0 0; color: var(--text-secondary); font-size: 12px; }
|
||||
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
|
||||
|
||||
@media (max-width: 1007px) {
|
||||
.workspace { grid-template-columns: 1fr; }
|
||||
.stack { grid-template-rows: auto auto; }
|
||||
.record-card { min-height: 480px; }
|
||||
.log-list { max-height: 220px; }
|
||||
}
|
||||
@media (max-width: 640px) {
|
||||
@@ -275,21 +333,30 @@
|
||||
.prototype-tools { grid-template-columns: 1fr; }
|
||||
.status-strip { grid-template-columns: 1fr; }
|
||||
.health { border-right: 0; border-bottom: 1px solid var(--divider); }
|
||||
.health:last-child { border-bottom: 0; }
|
||||
.health:nth-child(3) { border-right: 0; }
|
||||
.session-control { grid-template-columns: 1fr; }
|
||||
.session-control .primary { width: 100%; min-height: 40px; }
|
||||
.banner { grid-template-columns: auto minmax(0, 1fr); }
|
||||
.banner button { grid-column: 1 / -1; width: 100%; }
|
||||
.task-layout { grid-template-columns: 1fr; }
|
||||
.task-grid { grid-template-columns: 1fr; }
|
||||
.task-grid .span-2 { grid-column: auto; }
|
||||
.metric-row { grid-template-columns: 1fr; }
|
||||
.preview-stage { aspect-ratio: 16 / 9; }
|
||||
.card-header { align-items: stretch; flex-direction: column; }
|
||||
.log-tools, .record-actions { justify-content: flex-start; }
|
||||
.log-list li { grid-template-columns: 58px 1fr; }
|
||||
.log-list li span:last-child { grid-column: 1 / -1; }
|
||||
.poll-bar { grid-template-columns: 1fr; gap: 8px; }
|
||||
.poll-bar button { width: 100%; min-height: 40px; }
|
||||
.record-dialog-grid { grid-template-columns: 1fr; }
|
||||
.evidence-grid { grid-template-columns: 1fr; }
|
||||
.detail-list { grid-template-columns: 1fr; gap: 2px; }
|
||||
.detail-list dd { margin-bottom: 7px; }
|
||||
}
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
*, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
|
||||
}
|
||||
@media (forced-colors: active) {
|
||||
.prototype-banner, .banner, .badge, .primary, .health-mark { forced-color-adjust: auto; }
|
||||
.card, .status-strip, .poll-bar, .prototype-tools { box-shadow: none; }
|
||||
.card, .status-strip, .prototype-tools { box-shadow: none; }
|
||||
.health-mark { border: 1px solid ButtonText; }
|
||||
}
|
||||
</style>
|
||||
@@ -297,10 +364,10 @@
|
||||
<body>
|
||||
<div class="prototype-banner" role="note">PROTOTYPE - 仅供枚举交互，非实现依据；全部是假数据，不连接 ADB、web 服务或拼多多</div>
|
||||
<header class="app-bar">
|
||||
<div class="brand">cmbuyer 执行器<small>Windows / PySide6 前置原型</small></div>
|
||||
<div class="brand">采购工具<small>Windows / PySide6 前置原型</small></div>
|
||||
<nav class="tabs" aria-label="主要页面">
|
||||
<a href="desk-execution.html" aria-current="page">采购执行</a>
|
||||
<a href="desk-device-settings.html">设备与参数</a>
|
||||
<a href="desk-device-settings.html">配置</a>
|
||||
</nav>
|
||||
<div class="app-actions">
|
||||
<label for="theme">主题</label>
|
||||
@@ -352,11 +419,18 @@
|
||||
<div class="health" id="version-health">
|
||||
<span class="health-mark" aria-hidden="true"></span><strong>拼多多版本</strong><span>实际 / 已取证：均待 T-103 真机取证</span>
|
||||
</div>
|
||||
<div class="session-control" aria-label="轮询会话控制">
|
||||
<div class="session-copy"><span>会话状态</span><strong id="session-state">未启动</strong></div>
|
||||
<button type="button" class="primary" id="primary-action">开始轮询</button>
|
||||
<div class="session-copy"><span>当前步骤</span><strong id="current-step">等待开始</strong></div>
|
||||
<div class="disabled-reason" id="action-reason">web、设备和已取证 App 版本均就绪后才能开始。</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="banner" id="state-banner" data-tone="success" aria-live="polite" aria-atomic="true">
|
||||
<span class="banner-symbol" aria-hidden="true">i</span>
|
||||
<div><strong id="banner-title">设备已就绪</strong><p id="banner-text">可以开始定时轮询。当前页面不会连接真实设备。</p></div>
|
||||
<button type="button" id="context-action" hidden>查看说明</button>
|
||||
</section>
|
||||
|
||||
<div class="workspace">
|
||||
@@ -367,43 +441,101 @@
|
||||
<span class="badge" id="leg-badge" data-tone="success">空闲</span>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<dl class="task-grid">
|
||||
<div><dt>任务编号</dt><dd id="task-id">—</dd></div>
|
||||
<div><dt>剩余租约</dt><dd id="lease">—</dd></div>
|
||||
<div class="span-2"><dt>商品</dt><dd id="product">暂无商品；轮询会在安全就绪后领取一条任务</dd></div>
|
||||
<div><dt>颜色分类</dt><dd id="color">—</dd></div>
|
||||
<div><dt>尺码 / 数量</dt><dd id="size-qty">—</dd></div>
|
||||
<div><dt>授权单价</dt><dd id="auth-price">—</dd></div>
|
||||
<div><dt>金额上限</dt><dd id="price-cap">—</dd></div>
|
||||
<div class="span-2"><dt>提交围栏</dt><dd id="submission">未建立</dd></div>
|
||||
</dl>
|
||||
<ol class="steps" id="steps" aria-label="执行步骤"></ol>
|
||||
<div class="task-layout">
|
||||
<div class="task-copy">
|
||||
<dl class="task-grid">
|
||||
<div><dt>任务编号</dt><dd id="task-id">—</dd></div>
|
||||
<div><dt>剩余租约</dt><dd id="lease">—</dd></div>
|
||||
<div class="span-2"><dt>商品</dt><dd id="product">暂无商品；轮询会在安全就绪后领取一条任务</dd></div>
|
||||
<div><dt>颜色分类</dt><dd id="color">—</dd></div>
|
||||
<div><dt>尺码 / 数量</dt><dd id="size-qty">—</dd></div>
|
||||
<div><dt>授权单价</dt><dd id="auth-price">—</dd></div>
|
||||
<div><dt>金额上限</dt><dd id="price-cap">—</dd></div>
|
||||
<div class="span-2"><dt>提交围栏</dt><dd id="submission">未建立</dd></div>
|
||||
</dl>
|
||||
<ol class="steps" id="steps" aria-label="执行步骤"></ol>
|
||||
</div>
|
||||
<figure class="product-preview" aria-labelledby="preview-caption">
|
||||
<div class="preview-stage">
|
||||
<div class="preview-empty" id="preview-empty"><strong>暂无商品预览</strong>只有取得可信图片证据后才展示</div>
|
||||
<svg id="product-preview-image" viewBox="0 0 320 240" role="img" aria-label="原型假商品预览，不是真实拼多多图片" hidden>
|
||||
<rect width="320" height="240" fill="#e7f3ff"/>
|
||||
<rect x="28" y="24" width="264" height="192" rx="12" fill="#ffffff" stroke="#9ac8ee" stroke-width="2"/>
|
||||
<path d="M114 72l30-18h32l30 18 33 12-18 43-23-10v61h-76v-61l-23 10-18-43 33-12z" fill="#f5f5f5" stroke="#65788a" stroke-width="3"/>
|
||||
<path d="M144 55c3 20 29 20 32 0" fill="none" stroke="#65788a" stroke-width="3"/>
|
||||
<text x="160" y="208" text-anchor="middle" fill="#3a5268" font-size="13" font-family="Segoe UI, sans-serif">内联假证据 · 不访问拼多多</text>
|
||||
</svg>
|
||||
</div>
|
||||
<figcaption id="preview-caption"><span id="preview-source">来源：尚无可信图片</span><time id="preview-time">采集时间：—</time></figcaption>
|
||||
</figure>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="card" aria-labelledby="run-title">
|
||||
<div class="card-header"><div><h2 id="run-title">会话概览</h2><p>只显示当前前台会话，不代表后台进程</p></div></div>
|
||||
<div class="card-body metric-row">
|
||||
<div class="metric"><span>下次轮询</span><strong id="countdown">—</strong></div>
|
||||
<div class="metric"><span>连续失败</span><strong id="failure-count">0 / 3</strong></div>
|
||||
<div class="metric"><span>本次完成</span><strong id="completed-count">0</strong></div>
|
||||
<section class="card log-card" aria-labelledby="log-title">
|
||||
<div class="card-header">
|
||||
<div><h2 id="log-title">滚动日志</h2><p>最新事件在上；不含凭据、地址、手机号或页面全文</p></div>
|
||||
<div class="log-tools">
|
||||
<div class="inline-metrics" aria-label="会话指标"><span>下次轮询 <strong id="countdown">—</strong></span><span>连续失败 <strong id="failure-count">0 / 3</strong></span><span>本次完成 <strong id="completed-count">0</strong></span></div>
|
||||
<button type="button" id="export-log">导出假诊断摘要</button>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="log-list" id="logs" aria-live="polite" aria-relevant="additions"></ul>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<section class="card" aria-labelledby="log-title">
|
||||
<div class="card-header"><div><h2 id="log-title">事件日志</h2><p>假日志；不含凭据、地址、手机号或页面全文</p></div><button type="button" id="export-log">导出假诊断摘要</button></div>
|
||||
<ul class="log-list" id="logs" aria-live="polite" aria-relevant="additions"></ul>
|
||||
<section class="card record-card" aria-labelledby="record-title">
|
||||
<div class="card-header">
|
||||
<div><h2 id="record-title">执行记录</h2><p><span id="record-count">0</span> 条假记录 · 按采集时间倒序</p></div>
|
||||
<div class="record-actions"><button type="button" id="view-record" disabled>查看所选记录</button></div>
|
||||
</div>
|
||||
<div class="table-wrap">
|
||||
<table class="record-table" aria-describedby="record-help">
|
||||
<thead><tr><th scope="col">标题</th><th scope="col">状态</th></tr></thead>
|
||||
<tbody id="record-rows"></tbody>
|
||||
</table>
|
||||
<div class="table-empty" id="record-empty" hidden>暂无执行记录。开始轮询并产生结果后会显示在这里。</div>
|
||||
</div>
|
||||
<p class="table-help" id="record-help">单击选择；双击行、按 Enter 或使用“查看所选记录”打开详情。右键也可查看。</p>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<section class="poll-bar" aria-label="轮询控制">
|
||||
<button type="button" class="primary" id="primary-action">开始轮询</button>
|
||||
<div class="poll-summary"><span>会话：<strong id="session-state">未启动</strong></span><span>当前步骤：<strong id="current-step">等待开始</strong></span></div>
|
||||
<div class="disabled-reason" id="action-reason">web、设备和已取证 App 版本均就绪后才能开始。</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<div class="context-menu" id="record-menu" role="menu" hidden>
|
||||
<button type="button" id="record-menu-open" role="menuitem">查看记录详情</button>
|
||||
</div>
|
||||
|
||||
<dialog class="record-dialog" id="record-dialog" aria-labelledby="record-dialog-title">
|
||||
<header>
|
||||
<div><h2 id="record-dialog-title">执行记录详情</h2><p id="record-dialog-meta"></p></div>
|
||||
<button type="button" id="record-dialog-close" aria-label="关闭执行记录详情">关闭</button>
|
||||
</header>
|
||||
<div class="record-dialog-grid">
|
||||
<section class="detail-panel" aria-labelledby="original-copy-title">
|
||||
<h3 id="original-copy-title">原始文字</h3>
|
||||
<dl class="detail-list">
|
||||
<dt>任务编号</dt><dd id="detail-task-id"></dd>
|
||||
<dt>商品标题</dt><dd id="detail-product"></dd>
|
||||
<dt>目标规格</dt><dd id="detail-spec"></dd>
|
||||
<dt>金额边界</dt><dd id="detail-cap"></dd>
|
||||
<dt>提交围栏</dt><dd id="detail-submission"></dd>
|
||||
<dt>原始说明</dt><dd id="detail-note"></dd>
|
||||
</dl>
|
||||
<ol class="timeline" id="detail-timeline" aria-label="执行时间线"></ol>
|
||||
</section>
|
||||
<section class="detail-panel" aria-labelledby="evidence-title">
|
||||
<h3 id="evidence-title">图片证据</h3>
|
||||
<div class="evidence-grid" id="detail-evidence"></div>
|
||||
</section>
|
||||
</div>
|
||||
<section class="record-result" aria-labelledby="result-title">
|
||||
<h3 id="result-title">采购结果</h3>
|
||||
<p class="result-value" id="detail-result"></p>
|
||||
<p class="result-note" id="detail-result-note"></p>
|
||||
</section>
|
||||
<div class="dialog-actions"><button type="button" class="primary" id="record-dialog-done">关闭详情</button></div>
|
||||
</dialog>
|
||||
|
||||
<dialog id="info-dialog" aria-labelledby="dialog-title">
|
||||
<div class="dialog-body">
|
||||
<h2 id="dialog-title">安全说明</h2>
|
||||
@@ -423,6 +555,44 @@
|
||||
product: '纯棉圆领短袖 T 恤（原型假数据）',
|
||||
color: '白色', sizeQty: 'XL / 2 件', authPrice: 'CNY 32.50', cap: 'CNY 80.00'
|
||||
};
|
||||
const records = [
|
||||
{
|
||||
id:'REC-DEMO-0042', taskId:'CB-20260803-0042', title:'纯棉圆领短袖 T 恤（原型假数据）', collectedAt:'2026-08-03T13:52:18+08:00',
|
||||
status:'RECONCILIATION_REQUIRED', spec:'白色 | XL | 2 件', cap:'CNY 80.00', submission:'SUB-DEMO-0042 · 结果不明确',
|
||||
note:'围栏后网络中断，订单可能已创建。只允许核查同一提交记录，不能重试。', evidence:['商品页截图裁剪（内联假证据）','规格面板截图（内联假证据）'],
|
||||
timeline:['13:51:04 重新选择同一规格','13:51:41 三道价格闸门通过（假数据）','13:51:58 围栏已建立','13:52:18 点击结果不明确，转人工核查'],
|
||||
result:'下单待核查：白色 | XL | CNY 32.50 | 2 件', resultNote:'订单可能已创建、支付未完成。系统不会再次提交，也不会付款。'
|
||||
},
|
||||
{
|
||||
id:'REC-DEMO-0041', taskId:'CB-20260803-0041', title:'办公室桌面收纳盒（原型假数据）', collectedAt:'2026-08-03T12:24:09+08:00',
|
||||
status:'WAITING_CONFIRMATION', spec:'透明 | L | 2 件', cap:'CNY 60.00', submission:'未建立',
|
||||
note:'第一趟试选完成，规格面板证据已回传，等待管理员确认。', evidence:['商品页截图裁剪（内联假证据）','规格面板截图（内联假证据）'],
|
||||
timeline:['12:22:31 打开商品','12:23:04 匹配透明 / L','12:23:38 读取规格面板单价','12:24:09 截图并退出商品页'],
|
||||
result:'试选：透明 | L | CNY 24.00 | 2 件', resultNote:'这只是试选结果，不代表已下单。'
|
||||
},
|
||||
{
|
||||
id:'REC-DEMO-0038', taskId:'CB-20260803-0038', title:'标签打印纸补货（原型假数据）', collectedAt:'2026-08-03T10:06:42+08:00',
|
||||
status:'WAITING_PAYMENT', spec:'白色 | 50×30 | 1 件', cap:'CNY 50.00', submission:'SUB-DEMO-0038 · SUBMITTED',
|
||||
note:'已明确创建待付款订单，自动化已停止，等待人核对后自行付款。', evidence:['订单确认页非敏感截图（内联假证据）'],
|
||||
timeline:['10:04:22 重新选择同一规格','10:05:10 价格与数量复核通过','10:05:36 获得唯一围栏许可','10:06:42 明确创建待付款订单'],
|
||||
result:'已创建待付款订单：白色 | 50×30 | CNY 46.00 | 1 件', resultNote:'系统只创建待付款订单，付款始终由人完成。'
|
||||
},
|
||||
{
|
||||
id:'REC-DEMO-0032', taskId:'CB-20260803-0032', title:'仓库打包胶带（原型假数据）', collectedAt:'2026-08-03T09:18:05+08:00',
|
||||
status:'NEEDS_MANUAL', spec:'透明 | 45mm | 4 件', cap:'CNY 55.00', submission:'未建立',
|
||||
note:'商品页面未取得可信图片，授权价与当前规格面板价格不一致，已转人工。', evidence:[],
|
||||
timeline:['09:16:40 打开商品','09:17:22 匹配透明 / 45mm','09:18:05 价格闸门二不通过，停止自动流程'],
|
||||
result:'未采购：授权价 CNY 12.00 | 当前价 CNY 13.50', resultNote:'没有创建订单，也没有付款。'
|
||||
}
|
||||
].sort((a, b) => b.collectedAt.localeCompare(a.collectedAt));
|
||||
const recordStatus = {
|
||||
RECONCILIATION_REQUIRED:{label:'结果待核查',tone:'critical'},
|
||||
WAITING_CONFIRMATION:{label:'等待确认',tone:'caution'},
|
||||
WAITING_PAYMENT:{label:'待付款',tone:'success'},
|
||||
NEEDS_MANUAL:{label:'转人工',tone:'caution'}
|
||||
};
|
||||
let currentRecordId = records[0]?.id || null;
|
||||
let recordFocusReturn = null;
|
||||
const baseSteps = {
|
||||
idle: [],
|
||||
trial: ['打开商品（待真机判据）', '精确匹配颜色分类与尺码', '从规格面板读取单价', '截图并退出商品页'],
|
||||
@@ -447,7 +617,27 @@
|
||||
security: { tone:'critical', title:'检测到安全校验，已停止', text:'保留现场并转人工；不尝试绕过验证码、风控、人脸或短信校验。若已围栏，只调和同一提交。', web:'ok', device:'ok', version:'ok', leg:'待人工 · 安全校验', legTone:'critical', action:'打开人工核查说明', enabled:true, safeAction:'review', reason:'只显示核查说明，不提供绕过或继续入口。', session:'已停止', step:'等待人工处理', kind:'order', active:5, countdown:'—', fail:'1 / 3', submission:'SUB-DEMO-0042 · RECONCILIATION_REQUIRED' },
|
||||
payment_handoff: { tone:'critical', title:'进入外部支付交接，已停止', text:'订单可能已创建、支付未完成。不会读取或输入支付凭据，也没有“继续付款”按钮。', web:'ok', device:'ok', version:'ok', leg:'待人工 · 外部支付', legTone:'critical', action:'打开人工核查说明', enabled:true, safeAction:'paymentInfo', reason:'只显示人工核查与付款边界。', session:'已停止', step:'人工核查同一提交', kind:'order', active:5, countdown:'—', fail:'0 / 3', submission:'SUB-DEMO-0042 · HANDED_OFF' },
|
||||
manual: { tone:'caution', title:'任务已转人工：授权价与现价不一致', text:'授权 CNY 32.50，规格面板现价 CNY 35.00。没有下单，也不会自动放弃；请联系管理员处理。', web:'ok', device:'ok', version:'ok', leg:'NEEDS_MANUAL', legTone:'caution', action:'导出假诊断摘要', enabled:true, safeAction:'export', reason:'导出仅生成本地假文本，不包含页面全文或敏感信息。', session:'继续轮询其他任务', step:'当前任务已移交', kind:'order', active:1, countdown:'00:11', fail:'0 / 3', submission:'未建立' },
|
||||
failed_stop: { tone:'critical', title:'连续失败达到阈值，轮询已停止', text:'最近三次均为服务连接失败。检查设置和网络；修复后重新开始普通轮询，不会重试任何提交点击。', web:'bad', device:'ok', version:'ok', leg:'自动停止', legTone:'critical', action:'前往设备与参数', enabled:true, safeAction:'settings', reason:'先修复连接；不会自动恢复轮询。', session:'已停止', step:'等待修复', kind:'idle', active:-1, countdown:'—', fail:'3 / 3', count:4 }
|
||||
failed_stop: { tone:'critical', title:'连续失败达到阈值，轮询已停止', text:'最近三次均为服务连接失败。检查设置和网络；修复后重新开始普通轮询，不会重试任何提交点击。', web:'bad', device:'ok', version:'ok', leg:'自动停止', legTone:'critical', action:'前往配置', enabled:true, safeAction:'settings', reason:'先修复连接；不会自动恢复轮询。', session:'已停止', step:'等待修复', kind:'idle', active:-1, countdown:'—', fail:'3 / 3', count:4 }
|
||||
};
|
||||
const sessionControls = {
|
||||
not_ready:{label:'开始轮询',enabled:false,reason:'web 服务未就绪，不能领取任务。'},
|
||||
version_mismatch:{label:'开始轮询',enabled:false,reason:'App 版本失配，必须先完成本项目真机取证。'},
|
||||
idle:{label:'开始轮询',enabled:true,reason:'只启动普通轮询，不会直接执行下单。'},
|
||||
polling:{label:'停止轮询',enabled:true,reason:'停止后不再领取新任务。'},
|
||||
trial:{label:'停止轮询',enabled:false,reason:'真机步骤执行中，禁止硬停止。'},
|
||||
trial_done:{label:'停止轮询',enabled:true,reason:'手机已退出商品页，可以安全停止轮询。'},
|
||||
dry_run:{label:'停止轮询',enabled:false,reason:'只读演练执行中，禁止硬停止。'},
|
||||
dry_run_ready:{label:'停止轮询',enabled:true,reason:'演练已退出确认页，可以安全停止轮询。'},
|
||||
order_prefence:{label:'停止轮询',enabled:false,reason:'真实第二趟校验中，禁止硬停止。'},
|
||||
fencing:{label:'停止轮询',enabled:false,reason:'围栏申请中，禁止关闭、取消或重复申请。'},
|
||||
fence_failed:{label:'开始轮询',enabled:false,reason:'先核查围栏状态；不能用重新轮询绕过不明确结果。'},
|
||||
fenced:{label:'停止轮询',enabled:false,reason:'已建立围栏，只能调和同一提交。'},
|
||||
waiting_payment:{label:'开始轮询',enabled:false,reason:'先由人核对待付款订单并完成收口。'},
|
||||
uncertain:{label:'开始轮询',enabled:false,reason:'订单结果不明确，只能核查同一提交。'},
|
||||
security:{label:'开始轮询',enabled:false,reason:'安全校验已转人工，不允许自动继续。'},
|
||||
payment_handoff:{label:'开始轮询',enabled:false,reason:'外部支付交接中，自动化保持停止。'},
|
||||
manual:{label:'停止轮询',enabled:true,reason:'当前任务已移交，仍可安全停止普通轮询。'},
|
||||
failed_stop:{label:'开始轮询',enabled:false,reason:'先到配置页修复连接；不会自动恢复轮询。'}
|
||||
};
|
||||
|
||||
function setHealth(id, state, detail) {
|
||||
@@ -476,8 +666,81 @@
|
||||
li.append(time, badge, text); $('logs').prepend(li);
|
||||
while ($('logs').children.length > 8) $('logs').lastElementChild.remove();
|
||||
}
|
||||
function formatRecordTime(value) {
|
||||
return value.slice(5, 16).replace('T', ' ');
|
||||
}
|
||||
function selectRecord(id, focus = false) {
|
||||
currentRecordId = id;
|
||||
for (const row of $('record-rows').rows) {
|
||||
const selected = row.dataset.recordId === id;
|
||||
row.setAttribute('aria-selected', String(selected));
|
||||
row.tabIndex = selected ? 0 : -1;
|
||||
if (selected && focus) row.focus();
|
||||
}
|
||||
$('view-record').disabled = !records.some((record) => record.id === id);
|
||||
}
|
||||
function renderRecords() {
|
||||
const rows = records.map((record) => {
|
||||
const status = recordStatus[record.status] || {label:record.status,tone:'info'};
|
||||
const row = document.createElement('tr');
|
||||
row.dataset.recordId = record.id;
|
||||
row.setAttribute('aria-selected', 'false');
|
||||
const titleCell = document.createElement('td');
|
||||
const title = document.createElement('span'); title.className = 'record-title'; title.textContent = record.title;
|
||||
const meta = document.createElement('span'); meta.className = 'record-meta'; meta.textContent = `${record.taskId} · ${formatRecordTime(record.collectedAt)}`;
|
||||
titleCell.append(title, meta);
|
||||
const statusCell = document.createElement('td');
|
||||
const badge = document.createElement('span'); badge.className = 'record-status'; badge.dataset.tone = status.tone; badge.textContent = status.label;
|
||||
statusCell.append(badge); row.append(titleCell, statusCell);
|
||||
row.addEventListener('click', () => selectRecord(record.id));
|
||||
row.addEventListener('dblclick', (event) => { if (event.target.closest('button,a,input,select')) return; selectRecord(record.id); openRecord(record.id, row); });
|
||||
row.addEventListener('keydown', (event) => {
|
||||
if (event.key === 'Enter') { event.preventDefault(); openRecord(record.id, row); return; }
|
||||
if (event.key === 'ArrowDown' || event.key === 'ArrowUp') {
|
||||
event.preventDefault();
|
||||
const rows = [...$('record-rows').rows]; const index = rows.indexOf(row); const delta = event.key === 'ArrowDown' ? 1 : -1;
|
||||
const next = rows[Math.max(0, Math.min(rows.length - 1, index + delta))]; if (next) selectRecord(next.dataset.recordId, true);
|
||||
}
|
||||
if (event.key === 'F10' && event.shiftKey) { event.preventDefault(); showRecordMenu(record.id, row.getBoundingClientRect().left + 16, row.getBoundingClientRect().top + 24); }
|
||||
});
|
||||
row.addEventListener('contextmenu', (event) => { event.preventDefault(); selectRecord(record.id); showRecordMenu(record.id, event.clientX, event.clientY); });
|
||||
return row;
|
||||
});
|
||||
$('record-rows').replaceChildren(...rows);
|
||||
$('record-count').textContent = String(records.length);
|
||||
$('record-empty').hidden = records.length > 0;
|
||||
if (records.length) selectRecord(records.some((record) => record.id === currentRecordId) ? currentRecordId : records[0].id);
|
||||
}
|
||||
function showRecordMenu(id, x, y) {
|
||||
currentRecordId = id;
|
||||
const menu = $('record-menu'); menu.hidden = false;
|
||||
menu.style.left = `${Math.min(x, innerWidth - 170)}px`; menu.style.top = `${Math.min(y, innerHeight - 54)}px`;
|
||||
$('record-menu-open').focus();
|
||||
}
|
||||
function hideRecordMenu() { $('record-menu').hidden = true; }
|
||||
function createEvidence(label) {
|
||||
const figure = document.createElement('figure'); figure.className = 'evidence-card';
|
||||
const svg = $('product-preview-image').cloneNode(true); svg.hidden = false; svg.removeAttribute('id'); svg.setAttribute('aria-label', `${label}，原型内联假证据`);
|
||||
const caption = document.createElement('figcaption'); caption.textContent = `${label} · 不访问真实拼多多`;
|
||||
figure.append(svg, caption); return figure;
|
||||
}
|
||||
function openRecord(id, source) {
|
||||
const record = records.find((item) => item.id === id); if (!record) return;
|
||||
hideRecordMenu(); currentRecordId = id; recordFocusReturn = source || [...$('record-rows').rows].find((row) => row.dataset.recordId === id) || $('view-record');
|
||||
const status = recordStatus[record.status] || {label:record.status};
|
||||
$('record-dialog-title').textContent = record.title;
|
||||
$('record-dialog-meta').textContent = `${record.taskId} · ${formatRecordTime(record.collectedAt)} · ${status.label}`;
|
||||
$('detail-task-id').textContent = record.taskId; $('detail-product').textContent = record.title; $('detail-spec').textContent = record.spec;
|
||||
$('detail-cap').textContent = record.cap; $('detail-submission').textContent = record.submission; $('detail-note').textContent = record.note;
|
||||
$('detail-timeline').replaceChildren(...record.timeline.map((value) => { const li = document.createElement('li'); li.textContent = value; return li; }));
|
||||
if (record.evidence.length) $('detail-evidence').replaceChildren(...record.evidence.map(createEvidence));
|
||||
else { const empty = document.createElement('div'); empty.className = 'preview-empty'; const strong = document.createElement('strong'); strong.textContent = '暂无可信图片'; empty.append(strong, '记录保留原始文字，不用其他图片凑合。'); $('detail-evidence').replaceChildren(empty); }
|
||||
$('detail-result').textContent = record.result; $('detail-result-note').textContent = record.resultNote;
|
||||
$('record-dialog').showModal();
|
||||
}
|
||||
function render(key, announce = true) {
|
||||
const s = scenarios[key];
|
||||
const sessionControl = sessionControls[key];
|
||||
$('state-banner').dataset.tone = s.tone;
|
||||
$('banner-title').textContent = s.title; $('banner-text').textContent = s.text;
|
||||
setHealth('web-health', s.web, s.web === 'bad' ? '不可达（模拟）· 已停止领取' : '已连接 · 假环境');
|
||||
@@ -491,35 +754,48 @@
|
||||
$('color').textContent = hasTask ? task.color : '—'; $('size-qty').textContent = hasTask ? task.sizeQty : '—';
|
||||
$('auth-price').textContent = hasTask && s.kind !== 'trial' ? task.authPrice : '—'; $('price-cap').textContent = hasTask ? task.cap : '—';
|
||||
$('submission').textContent = s.submission || '未建立';
|
||||
$('preview-empty').hidden = hasTask; $('product-preview-image').hidden = !hasTask;
|
||||
$('preview-source').textContent = hasTask ? '来源：商品页截图裁剪（内联假证据）' : '来源：尚无可信图片';
|
||||
$('preview-time').textContent = hasTask ? '采集时间：2026-08-03 13:51（假数据）' : '采集时间：—';
|
||||
renderSteps(s.kind, s.active);
|
||||
$('countdown').textContent = s.countdown; $('failure-count').textContent = s.fail; $('completed-count').textContent = String(s.count || 0);
|
||||
$('session-state').textContent = s.session; $('current-step').textContent = s.step;
|
||||
$('primary-action').textContent = s.action; $('primary-action').disabled = !s.enabled; $('primary-action').dataset.safeAction = s.safeAction || '';
|
||||
$('action-reason').textContent = s.reason;
|
||||
$('primary-action').textContent = sessionControl.label; $('primary-action').disabled = !sessionControl.enabled;
|
||||
$('action-reason').textContent = sessionControl.reason;
|
||||
$('context-action').hidden = !s.safeAction; $('context-action').textContent = s.safeAction ? s.action : '';
|
||||
$('context-action').dataset.safeAction = s.safeAction || '';
|
||||
if (announce) { $('announcer').textContent = `${s.title}。${s.text}`; appendLog(s.tone === 'critical' ? '停止' : s.tone === 'caution' ? '注意' : s.tone === 'success' ? '完成' : '状态', `切换原型状态：${s.title}`); }
|
||||
}
|
||||
function showDialog(title, text) {
|
||||
$('dialog-title').textContent = title; $('dialog-text').textContent = text; $('info-dialog').showModal();
|
||||
}
|
||||
function exportDemo() {
|
||||
const blob = new Blob(['cmbuyer 原型假诊断摘要\n无真实任务、无凭据、无页面全文。\n'], {type:'text/plain;charset=utf-8'});
|
||||
const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'cmbuyer-prototype-diagnostic.txt'; a.click(); URL.revokeObjectURL(url);
|
||||
const blob = new Blob(['采购工具原型假诊断摘要\n无真实任务、无凭据、无页面全文。\n'], {type:'text/plain;charset=utf-8'});
|
||||
const url = URL.createObjectURL(blob); const a = document.createElement('a'); a.href = url; a.download = 'purchase-tool-prototype-diagnostic.txt'; a.click(); URL.revokeObjectURL(url);
|
||||
appendLog('完成', '已生成本地假诊断摘要；没有外部网络请求。');
|
||||
}
|
||||
|
||||
$('scenario').addEventListener('change', (e) => render(e.target.value));
|
||||
$('theme').addEventListener('change', (e) => { document.documentElement.dataset.theme = e.target.value; $('announcer').textContent = `主题已切换为${e.target.options[e.target.selectedIndex].text}`; });
|
||||
$('reset').addEventListener('click', () => { $('scenario').value = 'idle'; $('logs').replaceChildren(); render('idle'); appendLog('状态', '假数据已复位。'); });
|
||||
$('reset').addEventListener('click', () => { $('scenario').value = 'idle'; $('logs').replaceChildren(); currentRecordId = records[0]?.id || null; renderRecords(); render('idle'); appendLog('状态', '假数据已复位。'); });
|
||||
$('primary-action').addEventListener('click', () => {
|
||||
const action = $('primary-action').dataset.safeAction;
|
||||
if (!action) {
|
||||
const next = $('scenario').value === 'idle' ? 'polling' : 'idle'; $('scenario').value = next; render(next); return;
|
||||
}
|
||||
const next = $('scenario').value === 'idle' ? 'polling' : 'idle'; $('scenario').value = next; render(next);
|
||||
});
|
||||
$('context-action').addEventListener('click', () => {
|
||||
const action = $('context-action').dataset.safeAction;
|
||||
if (action === 'settings') { location.href = 'desk-device-settings.html'; return; }
|
||||
if (action === 'export') { exportDemo(); return; }
|
||||
if (action === 'paymentInfo') { showDialog('人工付款边界', '自动化已经停止。本系统不会点击支付、免密支付、先用后付或任何扣款控件；订单状态需要人核查。'); return; }
|
||||
showDialog('只核查同一提交记录', '围栏后只能围绕 SUB-DEMO-0042 调和。这里没有重新领取、放弃授权、重新申请围栏或再次提交的动作。');
|
||||
});
|
||||
$('view-record').addEventListener('click', () => openRecord(currentRecordId, [...$('record-rows').rows].find((row) => row.dataset.recordId === currentRecordId)));
|
||||
$('record-menu-open').addEventListener('click', () => openRecord(currentRecordId, [...$('record-rows').rows].find((row) => row.dataset.recordId === currentRecordId)));
|
||||
$('record-dialog-close').addEventListener('click', () => $('record-dialog').close());
|
||||
$('record-dialog-done').addEventListener('click', () => $('record-dialog').close());
|
||||
$('record-dialog').addEventListener('close', () => { if (recordFocusReturn?.isConnected) recordFocusReturn.focus(); });
|
||||
document.addEventListener('pointerdown', (event) => { if (!$('record-menu').hidden && !$('record-menu').contains(event.target)) hideRecordMenu(); });
|
||||
document.addEventListener('keydown', (event) => { if (event.key === 'Escape' && !$('record-menu').hidden) hideRecordMenu(); });
|
||||
window.addEventListener('resize', hideRecordMenu);
|
||||
$('export-log').addEventListener('click', exportDemo);
|
||||
$('close-demo').addEventListener('click', () => {
|
||||
const unsafe = ['trial','dry_run','order_prefence','fencing','fenced'].includes($('scenario').value);
|
||||
@@ -527,7 +803,7 @@
|
||||
});
|
||||
$('dialog-close').addEventListener('click', () => $('info-dialog').close());
|
||||
$('info-dialog').addEventListener('click', (e) => { if (e.target === $('info-dialog')) $('info-dialog').close(); });
|
||||
render('idle', false); appendLog('状态', '原型已加载；未连接任何服务或设备。');
|
||||
renderRecords(); render('idle', false); appendLog('状态', '原型已加载；未连接任何服务或设备。');
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
Reference in New Issue
Block a user