44e77dcb0e
**重构前**(旧编号 02-11): - docs/02-产品需求/ → 00 产品规划/PRD - docs/03-技术架构/ → 01-05 子目录散落 - docs/04-原型设计/ → 01-02 产品设计(HTML 原型) - docs/05-原型设计/ → screens/ - docs/06-测试素材/ → 02-E2E / 03-功能 / 04-版本测试 - docs/07-项目管理/ → 任务说明书/日报/计划 - docs/08-安全审计/ → 审计报告 - docs/09-堡垒运维/ → toolbox / deploy - docs/10-项目管理/ → 任务说明书(重复) - docs/11-历史归档/ → deploy-nas-archived **重构后**(新编号 00-07,语义化): - docs/00-产品开发流程与文档管理规范.md - docs/00-版本迭代总览.md - docs/01-产品文档/ (PRD/原型/认证/会话/AI 服务/坐席/集成) - docs/02-技术文档/ (技术方案/架构图/重构记录/前端改造/实现配置) - docs/03-测试文档/ (E2E/功能用例/版本报告/缺陷单) - docs/04-运维文档/ (部署运维/运维指南) - docs/05-运营文档/ (品牌推广/用户手册) - docs/06-安全审计/ (审计报告) - docs/07-项目管理/ (任务说明书/日报/计划/看板) **净收益**: - 目录编号与产品文档管理规范对齐(按文档阶段 01-07 编号) - 消除 02-产品需求 与 10-项目管理 的编号重叠 - 子目录按文档类型分组(如 01-产品文档/00-产品规划、01-产品文档/01-认证与登录) - 把运维/安全/项目管理从 0X 散落改为 04/06/07 合计 494 文件 + 78495 行 / - 14076 行
1017 lines
46 KiB
HTML
1017 lines
46 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>快速回复规则后台管理 - 原型图</title>
|
|
<style>
|
|
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
background: #f5f7fa;
|
|
padding: 20px;
|
|
color: #333;
|
|
}
|
|
.prototype-container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
}
|
|
h1 {
|
|
font-size: 24px;
|
|
margin-bottom: 8px;
|
|
color: #1a1a1a;
|
|
}
|
|
.subtitle {
|
|
color: #666;
|
|
margin-bottom: 24px;
|
|
font-size: 14px;
|
|
}
|
|
.page-section {
|
|
background: #fff;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
|
|
margin-bottom: 24px;
|
|
overflow: hidden;
|
|
}
|
|
.page-header {
|
|
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
|
|
color: white;
|
|
padding: 20px 24px;
|
|
}
|
|
.page-header h2 {
|
|
font-size: 18px;
|
|
margin-bottom: 4px;
|
|
}
|
|
.page-header .path {
|
|
font-size: 13px;
|
|
opacity: 0.9;
|
|
}
|
|
.page-content {
|
|
padding: 24px;
|
|
}
|
|
.feature-row {
|
|
display: flex;
|
|
gap: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.feature-card {
|
|
flex: 1;
|
|
background: #f8f9fc;
|
|
border: 1px solid #e8eaf0;
|
|
border-radius: 8px;
|
|
padding: 16px;
|
|
transition: all 0.2s;
|
|
}
|
|
.feature-card:hover {
|
|
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
|
|
transform: translateY(-2px);
|
|
}
|
|
.feature-card h3 {
|
|
font-size: 15px;
|
|
color: #1a1a1a;
|
|
margin-bottom: 8px;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
.feature-card .icon {
|
|
width: 28px;
|
|
height: 28px;
|
|
border-radius: 6px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 14px;
|
|
}
|
|
.feature-card .icon.greeting { background: #e8f5e9; color: #4caf50; }
|
|
.feature-card .icon.contact { background: #fff3e0; color: #ff9800; }
|
|
.feature-card .icon.routing { background: #e3f2fd; color: #2196f3; }
|
|
.feature-card .icon.target { background: #fce4ec; color: #e91e63; }
|
|
.feature-card p {
|
|
font-size: 13px;
|
|
color: #666;
|
|
line-height: 1.5;
|
|
}
|
|
.table-container {
|
|
border: 1px solid #e8eaf0;
|
|
border-radius: 8px;
|
|
overflow: hidden;
|
|
margin-top: 20px;
|
|
}
|
|
.table-header {
|
|
background: #f8f9fc;
|
|
padding: 12px 16px;
|
|
border-bottom: 1px solid #e8eaf0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.table-header h4 {
|
|
font-size: 14px;
|
|
color: #333;
|
|
}
|
|
.btn {
|
|
padding: 8px 16px;
|
|
border-radius: 6px;
|
|
font-size: 13px;
|
|
cursor: pointer;
|
|
border: none;
|
|
transition: all 0.2s;
|
|
}
|
|
.btn-primary {
|
|
background: #667eea;
|
|
color: white;
|
|
}
|
|
.btn-primary:hover {
|
|
background: #5a6fd6;
|
|
}
|
|
.btn-success {
|
|
background: #4caf50;
|
|
color: white;
|
|
}
|
|
.btn-danger {
|
|
background: #f44336;
|
|
color: white;
|
|
}
|
|
.btn-sm {
|
|
padding: 4px 12px;
|
|
font-size: 12px;
|
|
}
|
|
table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
}
|
|
th, td {
|
|
padding: 12px 16px;
|
|
text-align: left;
|
|
border-bottom: 1px solid #e8eaf0;
|
|
font-size: 13px;
|
|
}
|
|
th {
|
|
background: #fafbfc;
|
|
font-weight: 500;
|
|
color: #666;
|
|
}
|
|
tr:hover {
|
|
background: #f8f9fc;
|
|
}
|
|
.tag {
|
|
display: inline-block;
|
|
padding: 2px 8px;
|
|
border-radius: 4px;
|
|
font-size: 12px;
|
|
}
|
|
.tag-active {
|
|
background: #e8f5e9;
|
|
color: #2e7d32;
|
|
}
|
|
.tag-inactive {
|
|
background: #ffebee;
|
|
color: #c62828;
|
|
}
|
|
.actions {
|
|
display: flex;
|
|
gap: 8px;
|
|
}
|
|
.nav-tabs {
|
|
display: flex;
|
|
border-bottom: 2px solid #e8eaf0;
|
|
margin-bottom: 20px;
|
|
}
|
|
.nav-tab {
|
|
padding: 12px 20px;
|
|
cursor: pointer;
|
|
border-bottom: 2px solid transparent;
|
|
margin-bottom: -2px;
|
|
font-size: 14px;
|
|
color: #666;
|
|
transition: all 0.2s;
|
|
}
|
|
.nav-tab:hover {
|
|
color: #667eea;
|
|
}
|
|
.nav-tab.active {
|
|
color: #667eea;
|
|
border-bottom-color: #667eea;
|
|
font-weight: 500;
|
|
}
|
|
.form-row {
|
|
display: flex;
|
|
gap: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
.form-group {
|
|
flex: 1;
|
|
}
|
|
.form-group label {
|
|
display: block;
|
|
font-size: 13px;
|
|
color: #666;
|
|
margin-bottom: 6px;
|
|
}
|
|
.form-group input,
|
|
.form-group select,
|
|
.form-group textarea {
|
|
width: 100%;
|
|
padding: 8px 12px;
|
|
border: 1px solid #ddd;
|
|
border-radius: 6px;
|
|
font-size: 14px;
|
|
transition: border-color 0.2s;
|
|
}
|
|
.form-group input:focus,
|
|
.form-group select:focus,
|
|
.form-group textarea:focus {
|
|
outline: none;
|
|
border-color: #667eea;
|
|
}
|
|
.form-group textarea {
|
|
min-height: 80px;
|
|
resize: vertical;
|
|
}
|
|
.checkbox-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
.checkbox-wrapper input {
|
|
width: auto;
|
|
}
|
|
.modal-overlay {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(0,0,0,0.5);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
z-index: 1000;
|
|
}
|
|
.modal {
|
|
background: white;
|
|
border-radius: 12px;
|
|
width: 500px;
|
|
max-height: 80vh;
|
|
overflow: auto;
|
|
}
|
|
.modal-header {
|
|
padding: 16px 20px;
|
|
border-bottom: 1px solid #e8eaf0;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
.modal-header h3 {
|
|
font-size: 16px;
|
|
}
|
|
.modal-body {
|
|
padding: 20px;
|
|
}
|
|
.modal-footer {
|
|
padding: 16px 20px;
|
|
border-top: 1px solid #e8eaf0;
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
gap: 12px;
|
|
}
|
|
.info-box {
|
|
background: #f0f4ff;
|
|
border-left: 4px solid #667eea;
|
|
padding: 12px 16px;
|
|
margin-bottom: 20px;
|
|
border-radius: 0 6px 6px 0;
|
|
}
|
|
.info-box p {
|
|
font-size: 13px;
|
|
color: #333;
|
|
line-height: 1.6;
|
|
}
|
|
.empty-state {
|
|
text-align: center;
|
|
padding: 40px;
|
|
color: #999;
|
|
}
|
|
.empty-state p {
|
|
margin-top: 8px;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="prototype-container">
|
|
<h1>快速回复规则后台管理</h1>
|
|
<p class="subtitle">REQ-通用-002 · 快速回复规则后台管理 · v1.2</p>
|
|
<p class="subtitle">2026-07-28 v1.2:已删除顶部 3 张统计卡片,仅保留标签导航。</p>
|
|
|
|
<!-- 页面1: 主入口 - 规则列表 -->
|
|
<div class="page-section">
|
|
<div class="page-header">
|
|
<h2>页面1: 规则管理主页</h2>
|
|
<div class="path">路由: /quick-rules</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box">
|
|
<p><strong>功能说明:</strong>展示四种规则类型的概览卡片,点击可进入对应子页面进行管理。支持搜索过滤和快速操作。</p>
|
|
</div>
|
|
|
|
<div class="feature-row">
|
|
<div class="feature-card">
|
|
<h3><span class="icon greeting">👋</span> 打招呼配置</h3>
|
|
<p>管理用户首次问候时的自动回复关键词,支持多条配置</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<h3><span class="icon contact">👥</span> 业务联系人</h3>
|
|
<p>管理非IT业务部门联系人,支持启用/禁用</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<h3><span class="icon routing">🔀</span> 路由关键词</h3>
|
|
<p>管理业务路由预过滤关键词,控制路由触发时机</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<h3><span class="icon target">📋</span> 路由目标</h3>
|
|
<p>管理各类业务路由的目标配置(kfid客服窗口)</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<div class="table-header">
|
|
<h4>最近修改的规则</h4>
|
|
<div>
|
|
<button class="btn btn-default btn-sm" style="background:#67c23a;color:#fff">📥 导入</button>
|
|
<button class="btn btn-default btn-sm" style="background:#909399;color:#fff">📤 导出</button>
|
|
<button class="btn btn-default btn-sm" style="background:#e6a23c;color:#fff">📊 统计</button>
|
|
<button class="btn btn-primary btn-sm">刷新缓存</button>
|
|
</div>
|
|
</div>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>规则类型</th>
|
|
<th>关键词/名称</th>
|
|
<th>分类</th>
|
|
<th>优先级</th>
|
|
<th>状态</th>
|
|
<th>更新时间</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e8f5e9;color:#2e7d32">打招呼</span></td>
|
|
<td>你好</td>
|
|
<td>-</td>
|
|
<td>10</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-27 14:30</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#fff3e0;color:#e65100">联系人</span></td>
|
|
<td>谢聪利</td>
|
|
<td>云盘权限</td>
|
|
<td>-</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-26 10:00</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">路由</span></td>
|
|
<td>打印机</td>
|
|
<td>IT服务</td>
|
|
<td>5</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-25 16:20</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面2: 打招呼配置子页面 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #4caf50 0%, #2e7d32 100%);">
|
|
<h2>页面2: 打招呼配置</h2>
|
|
<div class="path">路由: /quick-rules/greeting</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box">
|
|
<p><strong>功能说明:</strong>管理打招呼规则。用户发送包含这些关键词的消息时,系统自动回复问候语。此类规则不增加AI回复计数。</p>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 16px;">
|
|
<button class="btn btn-primary">+ 新增打招呼关键词</button>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>关键词</th>
|
|
<th>优先级</th>
|
|
<th>状态</th>
|
|
<th>创建时间</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>你好</td>
|
|
<td>10</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-01</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>您好</td>
|
|
<td>9</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-01</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>hi</td>
|
|
<td>8</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-01</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>hello</td>
|
|
<td>7</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-01</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>在吗</td>
|
|
<td>6</td>
|
|
<td><span class="tag tag-inactive">禁用</span></td>
|
|
<td>2026-07-01</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面3: 业务联系人子页面 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #ff9800 0%, #e65100 100%);">
|
|
<h2>页面3: 业务联系人配置</h2>
|
|
<div class="path">路由: /quick-rules/contacts</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box">
|
|
<p><strong>功能说明:</strong>管理非IT业务部门联系人。当用户咨询相关业务时,可推荐对应联系人。</p>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 16px;">
|
|
<button class="btn btn-primary">+ 新增联系人</button>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>姓名</th>
|
|
<th>部门</th>
|
|
<th>业务类型</th>
|
|
<th>联系方式</th>
|
|
<th>状态</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>谢聪利</td>
|
|
<td>IT支持组</td>
|
|
<td>云盘权限</td>
|
|
<td>企微/电话</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>张财务</td>
|
|
<td>财务部</td>
|
|
<td>报销咨询</td>
|
|
<td>企微/电话</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面4: 路由关键词配置 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #2196f3 0%, #1565c0 100%);">
|
|
<h2>页面4: 业务路由关键词配置</h2>
|
|
<div class="path">路由: /quick-rules/routing</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box">
|
|
<p><strong>功能说明:</strong>管理业务路由预过滤关键词。用户消息命中这些关键词时,触发业务路由流程。不同分类对应不同业务部门。</p>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 16px;">
|
|
<button class="btn btn-primary">+ 新增路由关键词</button>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>关键词</th>
|
|
<th>业务分类</th>
|
|
<th>优先级</th>
|
|
<th>状态</th>
|
|
<th>更新时间</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>打印机</td>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">IT服务</span></td>
|
|
<td>10</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-20</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>复印机</td>
|
|
<td><span class="tag" style="background:#fff3e0;color:#e65100">行政</span></td>
|
|
<td>8</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-20</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>考勤</td>
|
|
<td><span class="tag" style="background:#fce4ec;color:#c2185b">人力资源</span></td>
|
|
<td>9</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-18</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>报销</td>
|
|
<td><span class="tag" style="background:#e8f5e9;color:#2e7d32">财务</span></td>
|
|
<td>10</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-18</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>合同</td>
|
|
<td><span class="tag" style="background:#f3e5f5;color:#7b1fa2">法务</span></td>
|
|
<td>10</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-15</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>空调</td>
|
|
<td><span class="tag" style="background:#fff8e1;color:#ff8f00">行政-物业</span></td>
|
|
<td>8</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>2026-07-15</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
<button class="btn btn-danger btn-sm">删除</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面5: 路由目标配置 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #e91e63 0%, #ad1457 100%);">
|
|
<h2>页面5: 路由目标配置</h2>
|
|
<div class="path">路由: /quick-rules/targets</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box">
|
|
<p><strong>功能说明:</strong>管理各类业务路由的目标配置。每个分类对应一个企微客服(kfid)窗口,用户点击名片卡片时可跳转。</p>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 16px;">
|
|
<button class="btn btn-primary">+ 新增路由目标</button>
|
|
</div>
|
|
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>业务分类</th>
|
|
<th>服务名称</th>
|
|
<th>服务描述</th>
|
|
<th>kfid链接</th>
|
|
<th>状态</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="tag" style="background:#fff3e0;color:#e65100">行政</span></td>
|
|
<td>机票酒店前台</td>
|
|
<td>受理和咨询机票、酒店、快递、访客、失物招领及行政办公相关事宜</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">https://work.weixin.qq.com/...</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#fce4ec;color:#c2185b">人力资源</span></td>
|
|
<td>人力资源共享服务咨询</td>
|
|
<td>咨询和处理人力资源相关问题(工牌/考勤/入离职/社保公积金等)</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">https://work.weixin.qq.com/...</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e8f5e9;color:#2e7d32">财务</span></td>
|
|
<td>总部报销服务台</td>
|
|
<td>咨询和处理总部报销系统相关问题</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">https://work.weixin.qq.com/...</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#f3e5f5;color:#7b1fa2">法务</span></td>
|
|
<td>行政法务团队</td>
|
|
<td>可咨询合同、合规、劳动争议、法律案件纠纷、外部检查、其他法律问题</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">https://work.weixin.qq.com/...</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#fff8e1;color:#ff8f00">行政-物业</span></td>
|
|
<td>物业服务</td>
|
|
<td>咨询和处理物业相关问题(空调/照明/门禁卡/车位/维修等)</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">https://work.weixin.qq.com/...</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">IT服务</span></td>
|
|
<td>IT人工坐席</td>
|
|
<td>IT支持组人工服务(打印机/电脑/网络/软件安装等)</td>
|
|
<td style="max-width:200px;overflow:hidden;text-overflow:ellipsis;">(特殊标记)</td>
|
|
<td><span class="tag tag-active">启用</span></td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">编辑</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面6: 编辑弹窗 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #9c27b0 0%, #6a1b9a 100%);">
|
|
<h2>页面6: 编辑/新增弹窗</h2>
|
|
<div class="path">通用组件</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="modal-overlay">
|
|
<div class="modal">
|
|
<div class="modal-header">
|
|
<h3>编辑规则</h3>
|
|
<span style="cursor:pointer;">✕</span>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>规则类型</label>
|
|
<select disabled>
|
|
<option>打招呼</option>
|
|
<option>联系人</option>
|
|
<option>路由关键词</option>
|
|
<option>路由目标</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>关键词 / 名称 *</label>
|
|
<input type="text" placeholder="请输入关键词">
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>业务分类</label>
|
|
<select>
|
|
<option value="">请选择</option>
|
|
<option>IT服务</option>
|
|
<option>行政</option>
|
|
<option>人力资源</option>
|
|
<option>财务</option>
|
|
<option>法务</option>
|
|
<option>行政-物业</option>
|
|
</select>
|
|
</div>
|
|
<div class="form-group">
|
|
<label>优先级</label>
|
|
<input type="number" value="0">
|
|
</div>
|
|
</div>
|
|
<div class="form-row" id="kfid-field" style="display:none;">
|
|
<div class="form-group">
|
|
<label>kfid客服链接</label>
|
|
<input type="text" placeholder="https://work.weixin.qq.com/...">
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<label>回复模板(可选)</label>
|
|
<textarea placeholder="自定义回复内容..."></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="form-row">
|
|
<div class="form-group">
|
|
<div class="checkbox-wrapper">
|
|
<input type="checkbox" id="is_active" checked>
|
|
<label for="is_active">启用此规则</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn" style="background:#f5f5f5;">取消</button>
|
|
<button class="btn btn-primary">保存</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 页面7: 智能体审计日志与统计 -->
|
|
<div class="page-section">
|
|
<div class="page-header" style="background: linear-gradient(135deg, #07C160 0%, #06A050 100%);">
|
|
<h2>页面7: 智能体审计日志与规则统计 (v2.0)</h2>
|
|
<div class="path">路由: /quick-rules/audit</div>
|
|
</div>
|
|
<div class="page-content">
|
|
<div class="info-box" style="background:#e6f7ec;border-left:4px solid #07C160;">
|
|
<p><strong>v2.0 新功能:</strong>支持智能体自动优化规则。所有规则修改都会记录审计日志,包括操作人(人工/智能体)、修改前后值、置信度等。</p>
|
|
</div>
|
|
|
|
<!-- 统计卡片 -->
|
|
<div class="feature-row">
|
|
<div class="feature-card" style="background:#f0f9ff;">
|
|
<h3 style="color:#185fa5">总规则数</h3>
|
|
<p style="font-size:32px;font-weight:500;color:#185fa5">45</p>
|
|
</div>
|
|
<div class="feature-card" style="background:#f0fdf4;">
|
|
<h3 style="color:#16a34a">命中率</h3>
|
|
<p style="font-size:32px;font-weight:500;color:#16a34a">78%</p>
|
|
</div>
|
|
<div class="feature-card" style="background:#fef2f2;">
|
|
<h3 style="color:#dc2626">误判率</h3>
|
|
<p style="font-size:32px;font-weight:500;color:#dc2626">5%</p>
|
|
</div>
|
|
<div class="feature-card" style="background:#fffbeb;">
|
|
<h3 style="color:#d97706">待审核</h3>
|
|
<p style="font-size:32px;font-weight:500;color:#d97706">3</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 按类型分布 -->
|
|
<h4 style="margin: 20px 0 12px;">按类型分布</h4>
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>规则类型</th>
|
|
<th>总数</th>
|
|
<th>启用</th>
|
|
<th>命中率</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e8f5e9;color:#2e7d32">打招呼</span></td>
|
|
<td>6</td>
|
|
<td>6</td>
|
|
<td>85%</td>
|
|
<td><button class="btn btn-primary btn-sm">详情</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">路由</span></td>
|
|
<td>25</td>
|
|
<td>22</td>
|
|
<td>72%</td>
|
|
<td><button class="btn btn-primary btn-sm">详情</button></td>
|
|
</tr>
|
|
<tr>
|
|
<td><span class="tag" style="background:#fce4ec;color:#c2185b">目标</span></td>
|
|
<td>14</td>
|
|
<td>14</td>
|
|
<td>--</td>
|
|
<td><button class="btn btn-primary btn-sm">详情</button></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- 待审核智能体建议 -->
|
|
<h4 style="margin: 20px 0 12px;">待审核智能体建议(置信度 0.5-0.85)</h4>
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>规则类型</th>
|
|
<th>关键词</th>
|
|
<th>分类</th>
|
|
<th>置信度</th>
|
|
<th>建议依据</th>
|
|
<th>提交时间</th>
|
|
<th>操作</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">路由</span></td>
|
|
<td>投影仪</td>
|
|
<td>IT服务</td>
|
|
<td><span class="tag" style="background:#fef3c7;color:#d97706">0.78</span></td>
|
|
<td>近30天5条相关消息被误判为闲聊</td>
|
|
<td>2026-07-27 10:00</td>
|
|
<td>
|
|
<div class="actions">
|
|
<button class="btn btn-success btn-sm">采纳</button>
|
|
<button class="btn btn-danger btn-sm">拒绝</button>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<!-- 审计日志 -->
|
|
<h4 style="margin: 20px 0 12px;">最近修改审计日志</h4>
|
|
<div class="table-container">
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th>时间</th>
|
|
<th>操作人</th>
|
|
<th>类型</th>
|
|
<th>规则</th>
|
|
<th>置信度</th>
|
|
<th>原因</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td>2026-07-27 14:30</td>
|
|
<td><span class="tag" style="background:#e6f7ec;color:#07C160">agent</span> rule_optimizer_v1</td>
|
|
<td><span class="tag" style="background:#e8f5e9;color:#2e7d32">创建</span></td>
|
|
<td>你好</td>
|
|
<td>0.95</td>
|
|
<td>高频问候模式</td>
|
|
</tr>
|
|
<tr>
|
|
<td>2026-07-27 13:15</td>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#185fa5">human</span> sxn</td>
|
|
<td><span class="tag" style="background:#e3f2fd;color:#1565c0">更新</span></td>
|
|
<td>报销</td>
|
|
<td>--</td>
|
|
<td>添加财务分类</td>
|
|
</tr>
|
|
<tr>
|
|
<td>2026-07-27 11:00</td>
|
|
<td><span class="tag" style="background:#e6f7ec;color:#07C160">agent</span> rule_optimizer_v1</td>
|
|
<td><span class="tag" style="background:#fff3e0;color:#e65100">批量</span></td>
|
|
<td>5条规则</td>
|
|
<td>0.88</td>
|
|
<td>月度优化建议</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
</html>
|