65 lines
10 KiB
HTML
65 lines
10 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>App 任务结果 - 低保真原型</title>
|
|
<style>
|
|
:root{color-scheme:light;--ink:#17212b;--muted:#5d6973;--line:#cbd3d9;--surface:#fff;--bg:#eef1f3;--primary:#176b52;--warn:#8b5a08;--danger:#a13a32;--focus:#c57414}
|
|
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.45 system-ui,-apple-system,"Segoe UI","Microsoft YaHei",sans-serif;letter-spacing:0;padding-top:38px}
|
|
.prototype{position:fixed;z-index:30;top:0;left:0;right:0;height:38px;display:grid;place-items:center;background:#2d343a;color:#fff;font-size:12px;font-weight:700}.phone{width:min(100%,420px);min-height:calc(100vh - 38px);margin:auto;background:#f7f8f9;border-inline:1px solid var(--line)}
|
|
header{height:58px;display:flex;align-items:center;padding:0 18px;background:#fff;border-bottom:1px solid var(--line)}h1,h2,p{margin-top:0}h1{font-size:19px;margin-bottom:0}main{padding:16px}
|
|
.panel{padding:15px;margin-bottom:14px;background:#fff;border:1px solid var(--line);border-radius:6px}.panel h2{font-size:16px;margin-bottom:12px}
|
|
label{font-size:13px;font-weight:700}select,button,a{font:inherit}select{width:100%;min-height:44px;margin-top:6px;padding:8px;border:1px solid #89959e;border-radius:6px;background:#fff}
|
|
.result{padding:18px;margin-bottom:14px;border-left:5px solid var(--primary);background:#e9f3ef}.result.warn{border-color:var(--warn);background:#fff5df}.result.danger{border-color:var(--danger);background:#fff0ee}.result strong,.result span{display:block}.result strong{font-size:19px}.result span{margin-top:5px}.machine{font:12px ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--muted)}
|
|
dl{display:grid;grid-template-columns:98px 1fr;gap:10px;margin:0}dt{color:var(--muted)}dd{margin:0;font-weight:650}.steps{list-style:none;margin:0;padding:0}.steps li{padding:9px 0;border-top:1px solid #e4e8eb}.steps li:first-child{border-top:0}.steps strong,.steps span{display:block}.steps span{color:var(--muted);font-size:13px}
|
|
.actions{display:grid;gap:10px}.actions button,.actions a{min-height:50px;display:grid;place-items:center;border-radius:6px;text-decoration:none;font-weight:800}.primary{border:0;background:var(--primary);color:#fff}.secondary{border:1px solid #74818a;background:#fff;color:var(--ink)}.disabled-note{margin:0;color:var(--danger);font-size:13px;font-weight:700}
|
|
button:focus-visible,a:focus-visible,select:focus{outline:3px solid color-mix(in srgb,var(--focus) 45%,transparent);outline-offset:2px}@media(max-width:420px){.phone{border:0}}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="prototype">PROTOTYPE - 仅供确认布局和交互，不是生产实现</div>
|
|
<div class="phone">
|
|
<header><h1>任务结果</h1></header>
|
|
<main>
|
|
<section class="panel">
|
|
<label for="scenario">原型状态</label>
|
|
<select id="scenario">
|
|
<option value="success">验证成功 · 已同步</option>
|
|
<option value="rejected">人员拒绝候选</option>
|
|
<option value="none">确认无匹配</option>
|
|
<option value="manual">转人工处理</option>
|
|
<option value="pending">结果待同步</option>
|
|
<option value="failed">安全错误 · 已停止</option>
|
|
<option value="canceled">任务已取消</option>
|
|
</select>
|
|
</section>
|
|
<div class="result" id="result" role="status"><strong>验证完成，未提交订单</strong><span>人员已接受候选，结论已同步到后台。</span><p class="machine">SUCCEEDED · order_submitted=false</p></div>
|
|
<section class="panel" aria-labelledby="summaryTitle">
|
|
<h2 id="summaryTitle">处理摘要</h2>
|
|
<dl id="summary"><dt>停止状态</dt><dd>自动化已停止</dd><dt>最终步骤</dt><dd>人工确认候选</dd><dt>结果同步</dt><dd>服务端已确认接收</dd><dt>本地证据</dt><dd>可按保留策略清理</dd></dl>
|
|
</section>
|
|
<section class="panel" aria-labelledby="eventsTitle">
|
|
<h2 id="eventsTitle">关键记录</h2>
|
|
<ol class="steps" id="events"><li><strong>候选检查完成</strong><span>最多检查 5 个，本次发现 3 个</span></li><li><strong>人员作出结论</strong><span>接受候选</span></li><li><strong>结果同步完成</strong><span>后台已确认接收</span></li></ol>
|
|
</section>
|
|
<section class="panel actions" id="actions"><a class="primary" href="android-task-home.html">返回任务主页</a></section>
|
|
</main>
|
|
</div>
|
|
<script>
|
|
const scenario=document.querySelector("#scenario"),result=document.querySelector("#result"),summary=document.querySelector("#summary"),events=document.querySelector("#events"),actions=document.querySelector("#actions");
|
|
const states={
|
|
success:{kind:"",title:"验证完成，未提交订单",text:"人员已接受候选，结论已同步到后台。",code:"SUCCEEDED · order_submitted=false",summary:"<dt>停止状态</dt><dd>自动化已停止</dd><dt>最终步骤</dt><dd>人工确认候选</dd><dt>结果同步</dt><dd>服务端已确认接收</dd><dt>本地证据</dt><dd>可按保留策略清理</dd>",events:"<li><strong>候选检查完成</strong><span>最多检查 5 个，本次发现 3 个</span></li><li><strong>人员作出结论</strong><span>接受候选</span></li><li><strong>结果同步完成</strong><span>后台已确认接收</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a>'},
|
|
rejected:{kind:"warn",title:"候选已拒绝，未提交订单",text:"人员认为当前候选不符合采购要求，结论已同步。",code:"REJECTED · order_submitted=false",summary:"<dt>停止状态</dt><dd>自动化已停止</dd><dt>人员结论</dt><dd>拒绝候选</dd><dt>结果同步</dt><dd>服务端已确认接收</dd><dt>恢复规则</dt><dd>本任务不会自动继续</dd>",events:"<li><strong>候选检查完成</strong><span>候选证据已保留</span></li><li><strong>人员拒绝候选</strong><span>已记录非敏感原因</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a>'},
|
|
none:{kind:"warn",title:"确认无匹配，未提交订单",text:"本次有界检索没有可接受候选，结论已同步。",code:"NO_MATCH · order_submitted=false",summary:"<dt>停止状态</dt><dd>自动化已停止</dd><dt>人员结论</dt><dd>无匹配</dd><dt>结果同步</dt><dd>服务端已确认接收</dd><dt>恢复规则</dt><dd>需要管理员重新评估任务</dd>",events:"<li><strong>候选检查完成</strong><span>已达到最多 5 个的边界</span></li><li><strong>人员确认无匹配</strong><span>不会自动扩大检索</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a>'},
|
|
manual:{kind:"warn",title:"已转人工处理，未提交订单",text:"自动化保持停止，等待管理员安排后续人工处理。",code:"MANUAL_REVIEW · order_submitted=false",summary:"<dt>停止状态</dt><dd>自动化已停止</dd><dt>人员结论</dt><dd>需人工处理</dd><dt>结果同步</dt><dd>服务端已确认接收</dd><dt>恢复规则</dt><dd>不能从原步骤自动继续</dd>",events:"<li><strong>检测到不确定项</strong><span>关键属性无法可靠确认</span></li><li><strong>人员转人工处理</strong><span>自动化保持硬停止</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a>'},
|
|
pending:{kind:"warn",title:"结果待同步",text:"本地已受控保存结论和证据，尚未得到服务端确认。",code:"SYNC_PENDING · order_submitted=false",summary:"<dt>停止状态</dt><dd>自动化已停止</dd><dt>最终步骤</dt><dd>人工确认候选</dd><dt>结果同步</dt><dd>等待网络恢复</dd><dt>本地证据</dt><dd>受控保留，暂不清理</dd>",events:"<li><strong>人员作出结论</strong><span>结论已保存在本机</span></li><li><strong>上传超时</strong><span>最终状态尚未确认</span></li>",actions:'<button class="primary" id="sync" type="button">查询状态并重试同步</button><a class="secondary" href="android-task-home.html">稍后处理</a>'},
|
|
failed:{kind:"danger",title:"安全错误，任务已停止",text:"检测到验证码。不会自动重试或从原步骤继续。",code:"FAILED · SAFETY_CAPTCHA",summary:"<dt>停止状态</dt><dd>已安全停止</dd><dt>失败步骤</dt><dd>打开检索结果页</dd><dt>错误类别</dt><dd>SAFETY_CAPTCHA</dd><dt>建议操作</dt><dd>联系管理员检查后新建尝试</dd>",events:"<li><strong>检测到验证码</strong><span>自动化立即请求安全停止</span></li><li><strong>证据已保存</strong><span>等待服务端确认接收</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a><p class="disabled-note">安全错误不允许自动重试。</p>'},
|
|
canceled:{kind:"warn",title:"任务已取消",text:"执行已停止并完成清理，本任务不会自动恢复。",code:"CANCELED · order_submitted=false",summary:"<dt>停止状态</dt><dd>已安全停止</dd><dt>最终步骤</dt><dd>检查候选</dd><dt>结果同步</dt><dd>服务端已确认终态</dd><dt>恢复规则</dt><dd>不能原地继续</dd>",events:"<li><strong>采购人员请求停止</strong><span>等待当前动作到达安全边界</span></li><li><strong>任务已取消</strong><span>前台服务已清理</span></li>",actions:'<a class="primary" href="android-task-home.html">返回任务主页</a>'}
|
|
};
|
|
function render(){const s=states[scenario.value];result.className="result "+s.kind;result.innerHTML="<strong>"+s.title+"</strong><span>"+s.text+'</span><p class="machine">'+s.code+"</p>";summary.innerHTML=s.summary;events.innerHTML=s.events;actions.innerHTML=s.actions;const sync=document.querySelector("#sync");if(sync)sync.addEventListener("click",()=>{sync.disabled=true;sync.textContent="正在查询服务端状态…";setTimeout(()=>{scenario.value="success";render()},650)})}
|
|
scenario.addEventListener("change",render);if(location.hash==="#failed")scenario.value="failed";if(location.hash==="#canceled")scenario.value="canceled";render();
|
|
</script>
|
|
</body>
|
|
</html>
|