from fastapi import FastAPI
from fastapi.middleware.cors import CORSMiddleware
from openai import OpenAI
from pydantic import BaseModel

app = FastAPI()
app.add_middleware(CORSMiddleware, allow_origins=["*"],
    allow_methods=["*"], allow_headers=["*"])
client = OpenAI()

# Системный промпт с информацией о компании
SYSTEM_PROMPT = """
Ты — чат-бот компании «ТехноЛаб». 
Знаешь: адрес, часы работы, услуги, цены, контакты.
Отвечай вежливо и по делу.
Если вопрос не по теме — перенаправляй к менеджеру.
"""

class Message(BaseModel):
    text: str
    session_id: str = "default"

# Хранилище диалогов (в продакшене — Redis)
sessions = {}

@app.post("/api/chat")
async def chat(msg: Message):
    if msg.session_id not in sessions:
        sessions[msg.session_id] = [
            {"role":"system", "content":SYSTEM_PROMPT}
        ]
    sessions[msg.session_id].append(
        {"role":"user", "content":msg.text}
    )
    response = client.chat.completions.create(
        model="gpt-4o",
        messages=sessions[msg.session_id],
        max_tokens=300
    )
    answer = response.choices[0].message.content
    sessions[msg.session_id].append(
        {"role":"assistant", "content":answer}
    )
    return {"reply": answer}

// chatbot-widget.js — подключить на сайт одной строкой
(function() {
  const API = 'https://your-server.com/api/chat';
  const sessionId = 'user_' + Math.random().toString(36).slice(2);

  // Создаём кнопку
  const btn = document.createElement('div');
  btn.innerHTML = '💬';
  Object.assign(btn.style, {
    position:'fixed', bottom:'20px', right:'20px',
    width:'56px', height:'56px', borderRadius:'50%',
    background:'#3B82F6', color:'#fff', fontSize:'24px',
    display:'flex', alignItems:'center', justifyContent:'center',
    cursor:'pointer', zIndex:'9999', boxShadow:'0 4px 12px rgba(0,0,0,.3)'
  });

  // Создаём окно чата
  const box = document.createElement('div');
  Object.assign(box.style, {
    position:'fixed', bottom:'90px', right:'20px',
    width:'340px', height:'480px', background:'#fff',
    borderRadius:'12px', boxShadow:'0 8px 32px rgba(0,0,0,.15)',
    display:'none', flexDirection:'column', zIndex:'9998',
    overflow:'hidden', fontFamily:'system-ui,sans-serif'
  });
  box.innerHTML = `
    <div style="background:#3B82F6;color:#fff;padding:14px;font-weight:bold">
      🤖 Чат-бот ТехноЛаб
    </div>
    <div id="chat-messages" style="flex:1;overflow-y:auto;padding:12px"></div>
    <div style="padding:10px;border-top:1px solid #eee;display:flex">
      <input id="chat-input" placeholder="Задайте вопрос..." 
             style="flex:1;border:none;outline:none;font-size:14px">
      <button onclick="window._chatSend()" 
              style="background:#3B82F6;color:#fff;border:none;
                     padding:8px 14px;border-radius:6px;cursor:pointer">
        →
      </button>
    </div>
  `;

  // Отправка сообщения
  window._chatSend = async function() {
    const input = document.getElementById('chat-input');
    const text = input.value.trim();
    if (!text) return;
    input.value = '';
    // Показываем сообщение пользователя
    const msgs = document.getElementById('chat-messages');
    msgs.innerHTML += `<div style="text-align:right;margin:8px">
      <span style="background:#3B82F6;color:#fff;padding:8px 12px;
             border-radius:12px;display:inline-block">${text}</span>
    </div>`;
    // Запрос к AI
    const resp = await fetch(API, {
      method:'POST',
      headers:{'Content-Type':'application/json'},
      body:JSON.stringify({text, session_id:sessionId})
    });
    const {reply} = await resp.json();
    msgs.innerHTML += `<div style="margin:8px">
      <span style="background:#f0f0f0;padding:8px 12px;
             border-radius:12px;display:inline-block">${reply}</span>
    </div>`;
    msgs.scrollTop = msgs.scrollHeight;
  };

  btn.onclick = () => box.style.display =
    box.style.display === 'none' ? 'flex' : 'none';
  document.body.append(btn, box);
})();

<!-- Вставьте перед закрывающим </body> -->
<script src="https://your-server.com/chatbot-widget.js"></script>