Paswan ai
<!DOCTYPE html>
<html>
<head>
<title>Dynamic Chatbot</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f4f4f9;
margin: 0;
padding: 0;
}
.chat-container {
width: 100%;
max-width: 500px;
margin: 50px auto;
background: white;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
border-radius: 10px;
overflow: hidden;
}
.chat-header {
background: #007bff;
color: white;
padding: 10px 15px;
text-align: center;
font-size: 18px;
}
.chat-messages {
padding: 15px;
height: 300px;
overflow-y: scroll;
border-bottom: 1px solid #ddd;
}
.chat-input {
display: flex;
padding: 10px;
}
.chat-input input {
flex: 1;
padding: 10px;
font-size: 16px;
border: 1px solid #ddd;
border-radius: 5px;
}
.chat-input button {
padding: 10px 15px;
background: #007bff;
color: white;
border: none;
border-radius: 5px;
margin-left: 5px;
cursor: pointer;
}
.chat-input button:hover {
background: #0056b3;
}
.message {
margin-bottom: 15px;
}
.message.user {
text-align: right;
}
.message.user .text {
background: #007bff;
color: white;
display: inline-block;
padding: 10px;
border-radius: 10px;
}
.message.bot .text {
background: #f4f4f9;
display: inline-block;
padding: 10px;
border-radius: 10px;
border: 1px solid #ddd;
}
</style>
</head>
<body>
<div class="chat-container">
<div class="chat-header">Dynamic Chatbot</div>
<div class="chat-messages" id="chat-messages"></div>
<div class="chat-input">
<input type="text" id="user-input" placeholder="Type your message...">
<button onclick="sendMessage()">Send</button>
</div>
</div>
<script>
// Initialize dynamic data (updateable questions and answers)
let data = [
{ question: "sumit kaun hai", answer: "Sumit Mahabir Namaste! As working MIS and developer hai." },
{ question: "attendance app kisne banaya hai", answer: "Sumit Paswan." },
{ question: "mis dashboard kisne banaya hai", answer: "Sumit Paswan." },
{ question: "payment follow kon dekhta hai", answer: "Deeksha and Bhanu." },
{ question: "purchase kon dekhta hai", answer: "Gayatri." },
{ question: "dealer data update kon kar raha hai", answer: "Neha." },
{ question: "ims stock in-out kon karta hai", answer: "Vinita and Anju/Ritu. All IMS handle karte hain packing material send ya receive karte hain." },
{ question: "amazon ke kaam kon karte hain", answer: "Tarang, Jyoti, and in dono handle ya help Bhanu karte hain. Issues ko Nancy resolve karte hain." }
];
// Function to find the best match for the user's query
function findAnswer(userQuery) {
userQuery = userQuery.toLowerCase();
let bestMatch = null;
data.forEach(item => {
// If user query contains any part of the question, return its answer
if (userQuery.includes(item.question) || item.question.includes(userQuery)) {
bestMatch = item.answer;
}
});
return bestMatch || "Maaf kijiye, eska jawab mere paas nahi hai par main bahot jaldi hi apke har question ke answer duga avi main seekh rha hu";
}
// Function to send a message
function sendMessage() {
const userInput = document.getElementById('user-input').value.trim();
if (userInput === '') return;
const chatMessages = document.getElementById('chat-messages');
// Display user message
chatMessages.innerHTML += `<div class="message user"><div class="text">${userInput}</div></div>`;
document.getElementById('user-input').value = '';
// Get the bot's response
const botResponse = findAnswer(userInput);
// Display bot response with a slight delay
setTimeout(() => {
chatMessages.innerHTML += `<div class="message bot"><div class="text">${botResponse}</div></div>`;
chatMessages.scrollTop = chatMessages.scrollHeight;
}, 500);
}
// Function to dynamically add a new question-answer pair
function addQA(question, answer) {
data.push({ question: question.toLowerCase(), answer: answer });
}
// Example: Adding new data dynamically
addQA("new question example", "This is a dynamically added answer.");
</script>
</body>
</html>