177 lines
5.6 KiB
HTML
177 lines
5.6 KiB
HTML
<!doctype html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<title>白领一天业务测试页</title>
|
||
<style>
|
||
body {
|
||
margin: 0;
|
||
font-family: "Microsoft YaHei", Arial, sans-serif;
|
||
color: #1f2937;
|
||
background: #f6f8fb;
|
||
}
|
||
header {
|
||
padding: 20px 28px;
|
||
background: #0f766e;
|
||
color: white;
|
||
}
|
||
main {
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||
gap: 16px;
|
||
padding: 20px;
|
||
}
|
||
section {
|
||
min-height: 180px;
|
||
padding: 16px;
|
||
border: 1px solid #d8dee8;
|
||
border-radius: 8px;
|
||
background: white;
|
||
}
|
||
h1,
|
||
h2 {
|
||
margin: 0 0 12px;
|
||
}
|
||
label,
|
||
input,
|
||
select,
|
||
textarea,
|
||
button {
|
||
display: block;
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
margin: 8px 0;
|
||
font-size: 14px;
|
||
}
|
||
input,
|
||
select,
|
||
textarea {
|
||
padding: 8px;
|
||
border: 1px solid #cbd5e1;
|
||
border-radius: 6px;
|
||
}
|
||
button {
|
||
padding: 9px 12px;
|
||
border: 0;
|
||
border-radius: 6px;
|
||
color: white;
|
||
background: #2563eb;
|
||
cursor: pointer;
|
||
}
|
||
table {
|
||
width: 100%;
|
||
border-collapse: collapse;
|
||
font-size: 14px;
|
||
}
|
||
th,
|
||
td {
|
||
padding: 8px;
|
||
border-bottom: 1px solid #e5e7eb;
|
||
text-align: left;
|
||
}
|
||
.badge {
|
||
display: inline-block;
|
||
padding: 2px 8px;
|
||
border-radius: 999px;
|
||
background: #e0f2fe;
|
||
color: #0369a1;
|
||
}
|
||
.result {
|
||
min-height: 22px;
|
||
color: #166534;
|
||
font-weight: 600;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<h1>白领一天业务测试页</h1>
|
||
<p>用于验证数字员工通过 sgBrowser 完成网页采集、填写、比对和下载确认。</p>
|
||
</header>
|
||
<main>
|
||
<section id="company-contact">
|
||
<h2>供应商联系人</h2>
|
||
<p data-field="company">白银智维科技有限公司</p>
|
||
<p data-field="contact">联系人：李敏</p>
|
||
<p data-field="phone">电话：0931-6201888</p>
|
||
<p data-field="email">邮箱：limin@example.local</p>
|
||
</section>
|
||
|
||
<section id="industry-news">
|
||
<h2>行业动态</h2>
|
||
<ol>
|
||
<li data-score="96">内网终端安全巡检纳入月度闭环</li>
|
||
<li data-score="88">营销系统工单响应时限压缩至 2 小时</li>
|
||
<li data-score="81">国产化办公终端批量适配完成</li>
|
||
</ol>
|
||
</section>
|
||
|
||
<section id="customer-form">
|
||
<h2>客户回访登记</h2>
|
||
<label>客户名称<input id="customer-name" /></label>
|
||
<label>联系电话<input id="customer-phone" /></label>
|
||
<label>回访结论<select id="visit-result"><option>请选择</option><option>已解决</option><option>需跟进</option></select></label>
|
||
<textarea id="visit-note" rows="3" placeholder="回访备注"></textarea>
|
||
<button id="prepare-form" type="button">检查表单</button>
|
||
<p id="form-status" class="result"></p>
|
||
</section>
|
||
|
||
<section id="product-compare">
|
||
<h2>设备方案比对</h2>
|
||
<table>
|
||
<thead>
|
||
<tr><th>方案</th><th>价格</th><th>交付天数</th><th>风险</th></tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr><td>基础巡检包</td><td>68000</td><td>12</td><td>低</td></tr>
|
||
<tr><td>增强巡检包</td><td>82000</td><td>9</td><td>中</td></tr>
|
||
<tr><td>全量管控包</td><td>98000</td><td>7</td><td>中</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<section id="todo-login">
|
||
<h2>待办系统</h2>
|
||
<label>用户名<input id="login-user" /></label>
|
||
<label>口令<input id="login-pass" type="password" /></label>
|
||
<button id="login-button" type="button">登录</button>
|
||
<ul id="todo-list">
|
||
<li><span class="badge">紧急</span> 完成安全巡检日报</li>
|
||
<li><span class="badge">普通</span> 核对客户回访清单</li>
|
||
<li><span class="badge">普通</span> 整理明日会议材料</li>
|
||
</ul>
|
||
<p id="login-status" class="result"></p>
|
||
</section>
|
||
|
||
<section id="customer-list">
|
||
<h2>客户清单</h2>
|
||
<table>
|
||
<tbody>
|
||
<tr><td>兰州新区供电服务站</td><td>待回访</td><td>王磊</td></tr>
|
||
<tr><td>白银银光营业厅</td><td>已完成</td><td>张琴</td></tr>
|
||
<tr><td>景泰调度中心</td><td>需协同</td><td>马宁</td></tr>
|
||
</tbody>
|
||
</table>
|
||
</section>
|
||
|
||
<section id="download-center">
|
||
<h2>资料下载</h2>
|
||
<p>最新资料：2026 年 5 月内网终端巡检模板</p>
|
||
<a id="latest-download" href="daily-template-202605.xlsx" download>下载巡检模板</a>
|
||
</section>
|
||
</main>
|
||
<script>
|
||
document.getElementById("prepare-form").addEventListener("click", function () {
|
||
const name = document.getElementById("customer-name").value.trim();
|
||
const result = document.getElementById("visit-result").value;
|
||
document.getElementById("form-status").textContent =
|
||
name && result !== "请选择" ? "表单已检查，等待人工确认提交" : "表单信息不完整";
|
||
});
|
||
document.getElementById("login-button").addEventListener("click", function () {
|
||
document.getElementById("login-status").textContent = "已读取待办，不执行真实登录";
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|