Skip to content

A
aozhiYX
Commit 51c3887d by suyuchen
Options

feat(tickets): 重构工单管理界面并添加沟通功能

- 将服务管理重命名为收费管理 - 添加通信历史记录功能及样式 - 重置表格列结构，更新工单列表显示字段 - 添加服务订单号输入和显示功能 - 实现工单沟通弹窗和消息发送功能 - 添加工单删除确认功能 - 创建工单新增页面
parent 99f0dd86
Showing with 38 additions and 156 deletions
aside.html
......@@ -18,9 +18,9 @@
</svg>
</div>
<div class="nav-submenu">
<a href="客户信息.html" class="nav-subitem ">
<!--<a href="客户信息.html" class="nav-subitem ">
客户信息
</a>
</a>-->
<a href="客户公司管理1.html" class="nav-subitem ">
客户公司管理
</a>
......@@ -127,7 +127,7 @@
我的黄页
</a>
</div>
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<!--<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path d="M4 4h12a2 2 0 012 2v8a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2z"/>
......@@ -143,7 +143,7 @@
<a href="账户档案.html" class="nav-subitem ">
账户档案
</a>
</div>
</div>-->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
......
category-management.html
......@@ -1343,6 +1343,7 @@
</div>
</div>
</div>
<script src="./js.js"></script>
<script>
let currentTab = 'issue';
......@@ -1842,7 +1843,6 @@
}
</script>
</body>
<script src="./js.js"></script>
</html>
escalation-rules.html
......@@ -1099,130 +1099,8 @@
</head>
<body>
<!-- 左侧导航栏 -->
<aside class="sidebar">
<div class="sidebar-logo">
<div class="logo-icon">S</div>
<div class="logo-text">售后系统</div>
</div>
<nav class="sidebar-nav">
<!-- 设备管理 -->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path d="M4 4h12a2 2 0 012 2v8a2 2 0 01-2 2H4a2 2 0 01-2-2V6a2 2 0 012-2z"/>
<path d="M7 9h6M7 12h4"/>
</svg>
<span>设备管理</span>
</div>
<svg class="nav-arrow nav-icon" viewBox="0 0 20 20">
<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
</svg>
</div>
<div class="nav-submenu">
<a href="二维码列表页.html" class="nav-subitem">
设备编码管理
</a>
</div>
<!-- 工单管理 -->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path d="M9 2a1 1 0 000 2h2a1 1 0 100-2H9z"/>
<path fill-rule="evenodd" d="M4 5a2 2 0 012-2 3 3 0 003 3h2a3 3 0 003-3 2 2 0 012 2v11a2 2 0 01-2 2H6a2 2 0 01-2-2V5zm3 4a1 1 0 000 2h.01a1 1 0 100-2H7zm3 0a1 1 0 000 2h3a1 1 0 100-2h-3zm-3 4a1 1 0 100 2h.01a1 1 0 100-2H7zm3 0a1 1 0 100 2h3a1 1 0 100-2h-3z" clip-rule="evenodd"/>
</svg>
<span>工单管理</span>
</div>
<svg class="nav-arrow nav-icon" viewBox="0 0 20 20">
<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
</svg>
</div>
<div class="nav-submenu">
<a href="ticket-list.html" class="nav-subitem">
工单池
</a>
<a href="ticket-handle.html" class="nav-subitem">
我的工单
</a>
<a href="sla-monitor.html" class="nav-subitem">
SLA自动监控
</a>
<a href="escalation-records.html" class="nav-subitem">
升级记录列表
</a>
<a href="kpi-report.html" class="nav-subitem">
KPI报表
</a>
<!-- <a href="售后看板.html" class="nav-subitem ">
售后看板
</a> -->
</div>
<!-- 基本设置 -->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path fill-rule="evenodd" d="M11.49 3.17c-.38-1.56-2.6-1.56-2.98 0a1.532 1.532 0 01-2.286.948c-1.372-.836-2.942.734-2.106 2.106.54.886.061 2.042-.947 2.287-1.561.379-1.561 2.6 0 2.978a1.532 1.532 0 01.947 2.287c-.836 1.372.734 2.942 2.106 2.106a1.532 1.532 0 012.287.947c.379 1.561 2.6 1.561 2.978 0a1.533 1.533 0 012.287-.947c1.372.836 2.942-.734 2.106-2.106a1.533 1.533 0 01.947-2.287c1.561-.379 1.561-2.6 0-2.978a1.532 1.532 0 01-.947-2.287c.836-1.372-.734-2.942-2.106-2.106a1.532 1.532 0 01-2.287-.947zM10 13a3 3 0 100-6 3 3 0 000 6z" clip-rule="evenodd"/>
</svg>
<span>基本设置</span>
</div>
<svg class="nav-arrow nav-icon" viewBox="0 0 20 20">
<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
</svg>
</div>
<div class="nav-submenu">
<a href="category-management.html" class="nav-subitem">
工单分类
</a>
<a href="escalation-rules.html" class="nav-subitem active">
升级规则配置
</a>
</div>
<div id="sidebar-container"></div>
<!-- 客户账号管理 -->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path d="M10 2a4 4 0 110 8 4 4 0 010-8z"/>
<path d="M4 16a6 6 0 1112 0H4z"/>
</svg>
<span>客户账号管理</span>
</div>
<svg class="nav-arrow nav-icon" viewBox="0 0 20 20">
<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
</svg>
</div>
<div class="nav-submenu">
<a href="用户管理.html" class="nav-subitem">
客户用户管理
</a>
</div>
<!-- 信息门户 -->
<div class="nav-item has-submenu expanded" onclick="toggleSubmenu(this)">
<div style="display: flex; align-items: center; gap: 12px;">
<svg class="nav-icon" viewBox="0 0 20 20">
<path d="M3 4a1 1 0 011-1h12a1 1 0 011 1v2a1 1 0 01-1 1H4a1 1 0 01-1-1V4zM3 10a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H4a1 1 0 01-1-1v-6zM14 9a1 1 0 00-1 1v6a1 1 0 001 1h2a1 1 0 001-1v-6a1 1 0 00-1-1h-2z"/>
</svg>
<span>信息门户</span>
</div>
<svg class="nav-arrow nav-icon" viewBox="0 0 20 20">
<path d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"/>
</svg>
</div>
<div class="nav-submenu">
<a href="门户网站.html" class="nav-subitem">
门户网站
</a>
<a href="价格汇率.html" class="nav-subitem">
价格汇率
</a>
<a href="邮件.html" class="nav-subitem">
邮件管理
</a>
</div>
</nav>
</aside>
<!-- 顶部工具栏 -->
<header class="top-header">
......@@ -1370,9 +1248,9 @@
<div class="form-group">
<label class="form-label">升级路径</label>
<select class="form-select">
<option>自动分配给高级团队</option>
<option>通知上级主管</option>
<option>创建紧急工单</option>
<!-- <option>自动分配给高级团队</option>-->
<!-- <option>通知上级主管</option>-->
<!-- <option>创建紧急工单</option>-->
<option>发送邮件通知</option>
</select>
</div>
......@@ -1494,9 +1372,9 @@
<div class="form-group">
<label class="form-label">升级路径</label>
<select class="form-select">
<option>通知上级主管</option>
<option>自动分配给高级团队</option>
<option>创建紧急工单</option>
<!-- <option>通知上级主管</option>-->
<!-- <option>自动分配给高级团队</option>-->
<!-- <option>创建紧急工单</option>-->
<option>发送邮件通知</option>
</select>
</div>
......@@ -2006,9 +1884,7 @@
<div class="form-group">
<label class="form-label">升级路径</label>
<select class="form-select" onchange="updateRuleEscalationPath(${rule.id}, this.value)">
<option value="自动分配给高级团队" ${rule.escalationPath === '自动分配给高级团队' ? 'selected' : ''}>自动分配给高级团队</option>
<option value="通知上级主管" ${rule.escalationPath === '通知上级主管' ? 'selected' : ''}>通知上级主管</option>
<option value="创建紧急工单" ${rule.escalationPath === '创建紧急工单' ? 'selected' : ''}>创建紧急工单</option>
<option value="发送邮件通知" ${rule.escalationPath === '发送邮件通知' ? 'selected' : ''}>发送邮件通知</option>
</select>
</div>
......@@ -2018,7 +1894,10 @@
</div>
`;
}).join('');
/* <option value="通知上级主管"
${rule.escalationPath === '通知上级主管' ? 'selected' : ''}>通知上级主管</option>
<option value="创建紧急工单"
${rule.escalationPath === '创建紧急工单' ? 'selected' : ''}>创建紧急工单</option>*/
// 初始化多选下拉框的值
pageRules.forEach(rule => {
const selectId = `notify-rule-${rule.id}`;
......@@ -2647,5 +2526,6 @@
});
</script>
</body>
<script src="./js.js"></script>
</html>
ticket-handle.html
......@@ -1562,7 +1562,7 @@
<span class="filter-tag active">全部</span>
<span class="filter-tag">待响应</span>
<span class="filter-tag">处理中</span>
<span class="filter-tag">待客户</span>
<!-- <span class="filter-tag">待客户</span>-->
<span class="filter-tag">已关闭</span>
<span class="filter-tag">SLA 预警</span>
<span class="filter-tag">已逾期</span>
......@@ -1599,7 +1599,7 @@
<th>创建时间</th>
<th>提交人员</th>
<th>更新时间</th>
<th>价格</th>
<!-- <th>价格</th>-->
<th>SLA计时</th>
<th>客户名称</th>
<th>服务订单号</th>
......@@ -1623,7 +1623,7 @@
<td>2024-01-15<br><span style="color: var(--text-tertiary); font-size: 12px;">10:30:25</span></td>
<td>系统</td>
<td>2024-01-15<br><span style="color: var(--text-tertiary); font-size: 12px;">14:20:10</span></td>
<td>100 元</td>
<!-- <td>100 元</td>-->
<td>2小时45分钟</td>
<td>ABC 公司</td>
<td>SO-2024-001</td>
......@@ -1632,7 +1632,7 @@
<td>中国</td>
<td>
<div class="action-btns">
<button class="action-btn" onclick="openEditModal('TK-2024-001')">编辑</button>
<!-- <button class="action-btn" onclick="openEditModal('TK-2024-001')">编辑</button>-->
<button class="action-btn" onclick="openDetailModal('TK-2024-001')">查看</button>
<button class="action-btn" onclick="openCommunicationModal('TK-2024-001')">沟通</button>
<button class="action-btn" onclick="deleteTicket('TK-2024-001')">删除</button>
......@@ -1651,7 +1651,7 @@
<td>2024-01-15<br><span style="color: var(--text-tertiary); font-size: 12px;">09:15:30</span></td>
<td>王五</td>
<td>2024-01-15<br><span style="color: var(--text-tertiary); font-size: 12px;">09:15:30</span></td>
<td>50 元</td>
<!-- <td>50 元</td>-->
<td>3小时10分钟</td>
<td>XYZ 有限公司</td>
<td>SO-2024-002</td>
......@@ -1660,7 +1660,8 @@
<td>中国</td>
<td>
<div class="action-btns">
<button class="action-btn" onclick="openEditModal('TK-2024-002')">编辑</button>
<!-- <button class="action-btn" onclick="openEditModal('TK-2024-002')">编辑</button>-->
<button class="action-btn" onclick="openDetailModal('TK-2024-002')">查看</button>
<button class="action-btn" onclick="openCommunicationModal('TK-2024-002')">沟通</button>
<button class="action-btn" onclick="deleteTicket('TK-2024-002')">删除</button>
......@@ -1679,8 +1680,8 @@
<td>2024-01-14<br><span style="color: var(--text-tertiary); font-size: 12px;">16:45:20</span></td>
<td>陈七</td>
<td>2024-01-14<br><span style="color: var(--text-tertiary); font-size: 12px;">18:30:15</span></td>
<td>80 元</td>
<td>22小时15分钟</td>
<!-- <td>80 元</td>-->
<td>-2小时15分钟</td>
<td>DEF 集团</td>
<td>SO-2024-003</td>
<td>路由器-RTR001</td>
......@@ -1688,7 +1689,7 @@
<td>美国</td>
<td>
<div class="action-btns">
<button class="action-btn" onclick="openEditModal('TK-2024-003')">编辑</button>
<!-- <button class="action-btn" onclick="openEditModal('TK-2024-003')">编辑</button>-->
<button class="action-btn" onclick="openDetailModal('TK-2024-003')">查看</button>
<button class="action-btn" onclick="openCommunicationModal('TK-2024-003')">沟通</button>
<button class="action-btn" onclick="deleteTicket('TK-2024-003')">删除</button>
......@@ -1709,7 +1710,7 @@
<td>周九</td>
<td>2024-01-14<br><span style="color: var(--text-tertiary); font-size: 12px;">15:45:30</span></td>
<td>-</td>
<td>-</td>
<!-- <td>-</td>-->
<td>GHI 企业</td>
<td>SO-2024-004</td>
<td>激光打印机-LP001</td>
......@@ -1717,10 +1718,11 @@
<td>日本</td>
<td>
<div class="action-btns">
<button class="action-btn" onclick="openEditModal('TK-2024-004')">编辑</button>
<!-- <button class="action-btn" onclick="openEditModal('TK-2024-004')">编辑</button>-->
<button class="action-btn" onclick="openDetailModal('TK-2024-004')">查看</button>
<button class="action-btn" onclick="openCommunicationModal('TK-2024-004')">沟通</button>
<button class="action-btn" onclick="deleteTicket('TK-2024-004')">删除</button>
<button class="action-btn" >关闭工单</button>
</div>
</td>
</tr>
......@@ -2062,7 +2064,7 @@
<option value="">请选择工单状态</option>
<option value="待响应">待响应</option>
<option value="处理中">处理中</option>
<option value="待客户">待客户</option>
<!-- <option value="待客户">待客户</option>-->
<option value="已关闭">已关闭</option>
</select>
</div>
......@@ -2782,7 +2784,7 @@
const s = t.status || '';
if (s.includes('待响应')) stats.waiting++;
if (s.includes('处理中')) stats.processing++;
if (s.includes('待客户')) stats.customer++;
// if (s.includes('待客户')) stats.customer++;
if (s.includes('已关闭')) stats.closed++;
if (s.includes('预警')) stats.warn++;
if (s.includes('逾期')) stats.overdue++;
......@@ -2791,7 +2793,7 @@
{ label:'全部工单', value:stats.total, icon:`<circle cx="10" cy="10" r="7"></circle><path d="M10 5v5h4"></path>` },
{ label:'待响应', value:stats.waiting, icon:`<path d="M10 3v6l4 2"></path>` },
{ label:'处理中', value:stats.processing, icon:`<path d="M4 10h12M10 4v12"></path>` },
{ label:'待客户', value:stats.customer, icon:`<path d="M6 8l4 4 4-4"></path>` },
// { label:'待客户', value:stats.customer, icon:`<path d="M6 8l4 4 4-4"></path>` },
{ label:'已关闭', value:stats.closed, icon:`<path d="M6 6l8 8M14 6l-8 8"></path>` },
{ label:'SLA 预警', value:stats.warn, icon:`<path d="M10 4l6 10H4L10 4z"></path><path d="M10 8v3m0 2h.01"></path>` },
{ label:'已逾期', value:stats.overdue, icon:`<circle cx="10" cy="10" r="7"></circle><path d="M10 6v4l2.5 2.5"></path>` }
......@@ -2851,7 +2853,7 @@
'全部': '',
'待响应': '待响应',
'处理中': '处理中',
'待客户': '待客户',
// '待客户': '待客户',
'已关闭': '已关闭',
'SLA 预警': '预警',
'已逾期': '逾期'
......@@ -2886,8 +2888,8 @@
// 打开新增工单弹窗
function openNewTicketModal() {
window.location.href = '工单新增.html'
// document.getElementById('newTicketModal').classList.add('active');
// window.location.href = '工单新增.html'
document.getElementById('newTicketModal').classList.add('active');
}
......@@ -3339,7 +3341,7 @@
let statusClass = 'status-processing';
if (status === '待响应') statusClass = 'status-pending';
else if (status === '处理中') statusClass = 'status-processing';
else if (status === '待客户') statusClass = 'status-waiting';
// else if (status === '待客户') statusClass = 'status-waiting';
else if (status === '已关闭') statusClass = 'status-closed';
cells[8].innerHTML = `<span class="status-badge ${statusClass}">${status}</span>`;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment