189 lines
6.3 KiB
PHP
189 lines
6.3 KiB
PHP
<footer class="text-center py-4 mt-auto text-muted bg-light">
|
|
<div class="container">
|
|
<p class="mb-0">© <?php echo date("Y"); ?> powered by LEA24. All Rights Reserved.</p>
|
|
</div>
|
|
</footer>
|
|
|
|
<?php
|
|
// Show chat only for non-admin users (clients)
|
|
$show_chat = isset($_SESSION['user_id']) && (!isset($_SESSION['user_role']) || $_SESSION['user_role'] !== 'admin');
|
|
|
|
if ($show_chat):
|
|
?>
|
|
<style>
|
|
.chat-widget-button {
|
|
position: fixed;
|
|
bottom: 20px;
|
|
right: 20px;
|
|
width: 60px;
|
|
height: 60px;
|
|
border-radius: 50%;
|
|
background-color: #0d6efd;
|
|
color: white;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
font-size: 24px;
|
|
cursor: pointer;
|
|
z-index: 1050;
|
|
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
|
|
}
|
|
.chat-widget-button:hover {
|
|
background-color: #0b5ed7;
|
|
}
|
|
.chat-modal .modal-body {
|
|
height: 400px;
|
|
overflow-y: auto;
|
|
}
|
|
.chat-message {
|
|
margin-bottom: 15px;
|
|
}
|
|
.chat-message.user .message-content {
|
|
background-color: #e9f5ff;
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
display: inline-block;
|
|
max-width: 80%;
|
|
}
|
|
.chat-message.assistant .message-content {
|
|
background-color: #f1f1f1;
|
|
padding: 10px;
|
|
border-radius: 10px;
|
|
display: inline-block;
|
|
max-width: 80%;
|
|
}
|
|
.chat-message.user {
|
|
text-align: right;
|
|
}
|
|
|
|
.thinking-indicator span {
|
|
display: inline-block;
|
|
width: 8px;
|
|
height: 8px;
|
|
border-radius: 50%;
|
|
background-color: #888;
|
|
margin: 0 2px;
|
|
animation: pulse 1.4s infinite ease-in-out both;
|
|
}
|
|
|
|
.thinking-indicator span:nth-child(1) {
|
|
animation-delay: -0.32s;
|
|
}
|
|
|
|
.thinking-indicator span:nth-child(2) {
|
|
animation-delay: -0.16s;
|
|
}
|
|
|
|
@keyframes pulse {
|
|
0%, 80%, 100% {
|
|
transform: scale(0);
|
|
}
|
|
40% {
|
|
transform: scale(1.0);
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="chat-widget-button" data-bs-toggle="modal" data-bs-target="#chatModal">
|
|
<i class="fa-solid fa-comments"></i>
|
|
</div>
|
|
|
|
<div class="modal fade chat-modal" id="chatModal" tabindex="-1" aria-labelledby="chatModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-end">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="chatModalLabel"><?php echo t('chat_with_assistant'); ?></h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body" id="chat-transcript">
|
|
<div class="chat-message assistant">
|
|
<div class="message-content">
|
|
<?php echo t('chat_hello'); ?>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<div class="input-group">
|
|
<input type="text" class="form-control" id="chat-input" placeholder="<?php echo t('chat_placeholder'); ?>">
|
|
<button class="btn btn-primary" id="chat-send"><?php echo t('chat_send_button'); ?></button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
const chatTranscript = document.getElementById('chat-transcript');
|
|
const chatInput = document.getElementById('chat-input');
|
|
const chatSend = document.getElementById('chat-send');
|
|
|
|
function addMessage(sender, message) {
|
|
const messageElement = document.createElement('div');
|
|
messageElement.classList.add('chat-message', sender);
|
|
const messageContent = document.createElement('div');
|
|
messageContent.classList.add('message-content');
|
|
messageContent.textContent = message;
|
|
messageElement.appendChild(messageContent);
|
|
chatTranscript.appendChild(messageElement);
|
|
chatTranscript.scrollTop = chatTranscript.scrollHeight;
|
|
}
|
|
|
|
function showThinkingIndicator() {
|
|
const thinkingElement = document.createElement('div');
|
|
thinkingElement.classList.add('chat-message', 'assistant', 'thinking-indicator');
|
|
const messageContent = document.createElement('div');
|
|
messageContent.classList.add('message-content');
|
|
messageContent.innerHTML = '<span></span><span></span><span></span>';
|
|
thinkingElement.appendChild(messageContent);
|
|
chatTranscript.appendChild(thinkingElement);
|
|
chatTranscript.scrollTop = chatTranscript.scrollHeight;
|
|
}
|
|
|
|
function hideThinkingIndicator() {
|
|
const thinkingElement = document.querySelector('.thinking-indicator');
|
|
if (thinkingElement) {
|
|
thinkingElement.remove();
|
|
}
|
|
}
|
|
|
|
function sendMessage() {
|
|
const message = chatInput.value.trim();
|
|
if (message === '') return;
|
|
|
|
addMessage('user', message);
|
|
chatInput.value = '';
|
|
showThinkingIndicator();
|
|
|
|
// AJAX call to backend
|
|
const xhr = new XMLHttpRequest();
|
|
xhr.open('POST', 'chat_send.php', true);
|
|
xhr.setRequestHeader('Content-Type', 'application/json');
|
|
xhr.onload = function () {
|
|
hideThinkingIndicator();
|
|
if (xhr.status === 200) {
|
|
const response = JSON.parse(xhr.responseText);
|
|
addMessage('assistant', response.reply);
|
|
} else {
|
|
addMessage('assistant', 'Sorry, something went wrong. Please try again later.');
|
|
}
|
|
};
|
|
xhr.onerror = function () {
|
|
hideThinkingIndicator();
|
|
addMessage('assistant', 'Sorry, something went wrong. Please try again later.');
|
|
};
|
|
xhr.send(JSON.stringify({ message: message }));
|
|
}
|
|
|
|
chatSend.addEventListener('click', sendMessage);
|
|
chatInput.addEventListener('keypress', function (e) {
|
|
if (e.key === 'Enter') {
|
|
sendMessage();
|
|
}
|
|
});
|
|
});
|
|
</script>
|
|
<?php endif; ?>
|
|
|
|
</body>
|
|
</html>
|