diff --git a/ruoyi-admin/src/main/resources/templates/customer/service/index.html b/ruoyi-admin/src/main/resources/templates/customer/service/index.html index e95bf716..f0d10d16 100644 --- a/ruoyi-admin/src/main/resources/templates/customer/service/index.html +++ b/ruoyi-admin/src/main/resources/templates/customer/service/index.html @@ -200,6 +200,26 @@ font-size: 11px; } + /* 闪烁动画样式 */ + @keyframes blink { + 0% { background-color: inherit; } + 50% { background-color: #ff4d4f; } + 100% { background-color: inherit; } + } + + .blink-notification { + animation: blink 1s ease-in-out infinite; + } + + .manual-service-panel.blink-notification { + animation: blink 1s ease-in-out 5; + } + + .panel-header.blink-notification { + animation: blink 1s ease-in-out 5; + color: #fff !important; + } + /* 会话分隔符样式 */ .session-separator { margin: 20px 0; @@ -540,6 +560,8 @@ console.log('[SUCCESS] 收到转人工请求通知:', message); console.log('[DEBUG] 开始刷新转人工请求列表...'); loadManualRequests(); + // 添加闪烁动画效果 + triggerManualRequestBlink(); // 显示通知 console.log('[DEBUG] 显示转人工请求通知...'); if (typeof $.modal !== 'undefined') { @@ -955,6 +977,9 @@ // 接受转人工请求 function acceptManualRequest(requestId) { + // 停止闪烁动画 + stopManualRequestBlink(); + $.post('/customer/service/manual-requests/' + requestId + '/accept', function(data) { if (data.code === 0) { layer.msg('已接受转人工请求'); @@ -1003,6 +1028,9 @@ // 拒绝转人工请求 function rejectManualRequest(requestId) { + // 停止闪烁动画 + stopManualRequestBlink(); + $.post('/customer/service/manual-requests/' + requestId + '/reject', function(data) { if (data.code === 0) { layer.msg('已拒绝转人工请求'); @@ -1075,6 +1103,41 @@ input.setSelectionRange(start + emoji.length, start + emoji.length); } + // 触发转人工请求闪烁动画 + function triggerManualRequestBlink() { + console.log('[DEBUG] 触发转人工请求闪烁动画'); + + // 为转人工请求面板添加闪烁类 + $('.manual-service-panel').addClass('blink-notification'); + $('.panel-header').addClass('blink-notification'); + + // 5秒后自动移除闪烁效果 + setTimeout(function() { + $('.manual-service-panel').removeClass('blink-notification'); + $('.panel-header').removeClass('blink-notification'); + console.log('[DEBUG] 转人工请求闪烁动画已停止'); + }, 5000); + } + + // 停止转人工请求闪烁动画 + function stopManualRequestBlink() { + $('.manual-service-panel').removeClass('blink-notification'); + $('.panel-header').removeClass('blink-notification'); + console.log('[DEBUG] 手动停止转人工请求闪烁动画'); + } + + // 为转人工请求面板添加点击事件,点击时停止闪烁 + $(document).ready(function() { + $('.manual-service-panel').on('click', function() { + stopManualRequestBlink(); + }); + + // 为转人工请求项添加点击事件,处理请求时停止闪烁 + $(document).on('click', '.manual-request-item', function() { + stopManualRequestBlink(); + }); + }); + // 文件上传 function uploadFile() { layer.msg('文件上传功能开发中...');