35 lines
2.8 KiB
HTML
35 lines
2.8 KiB
HTML
<!doctype html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<title>RPA Studio 本地订单夹具</title>
|
|
<style>
|
|
*{box-sizing:border-box}body{margin:0;background:#f3f6f9;color:#172033;font-family:"Microsoft YaHei UI",sans-serif}main{width:min(760px,calc(100% - 40px));margin:48px auto;background:#fff;border:1px solid #e1e7ee;border-radius:14px;padding:28px;box-shadow:0 10px 35px rgba(23,32,51,.08)}h1{font-size:22px;margin:0 0 6px}p{color:#788494;font-size:13px;margin:0 0 24px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:600}input{height:40px;border:1px solid #dbe3eb;border-radius:8px;padding:0 11px;font:inherit}button,a{height:40px;border:0;border-radius:8px;padding:0 16px;display:inline-flex;align-items:center;justify-content:center;font:inherit;text-decoration:none;cursor:pointer}button{background:#2264e5;color:#fff}.actions{margin-top:18px;display:flex;gap:9px}.secondary{background:#f2f5f8;color:#4e5a6b}.result{margin-top:22px;padding:14px;border-radius:9px;background:#f5f7fa;min-height:48px;color:#4e5a6b}.result.success{background:#e9f7ee;color:#067647}table{width:100%;margin-top:20px;border-collapse:collapse;font-size:12px}th,td{padding:10px;border-bottom:1px solid #edf1f5;text-align:left}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<main>
|
|
<h1>本地订单录入</h1>
|
|
<p>该页面由 RPA Studio 在本机提供，不访问互联网，用于验证输入、点击、读取和下载。</p>
|
|
<div class="grid">
|
|
<label>客户名称<input id="name" placeholder="请输入客户名称"></label>
|
|
<label>订单金额<input id="amount" type="number" placeholder="请输入金额"></label>
|
|
</div>
|
|
<div class="actions"><button id="submit" type="button">创建订单</button><a class="secondary" id="download" href="/download.csv">下载示例 CSV</a></div>
|
|
<div class="result" id="result">等待提交</div>
|
|
<table><thead><tr><th>客户</th><th>金额</th><th>状态</th></tr></thead><tbody id="rows"></tbody></table>
|
|
</main>
|
|
<script>
|
|
document.querySelector('#submit').addEventListener('click',()=>{
|
|
const name=document.querySelector('#name').value.trim();
|
|
const amount=document.querySelector('#amount').value.trim();
|
|
const result=document.querySelector('#result');
|
|
if(!name||!amount){result.className='result';result.textContent='请完整填写客户名称和订单金额';return;}
|
|
result.className='result success';result.textContent=`订单创建成功：${name}，金额 ${amount}`;
|
|
const row=document.createElement('tr');row.innerHTML=`<td>${name}</td><td>${amount}</td><td>已创建</td>`;document.querySelector('#rows').appendChild(row);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|