SekiDesu0
d4d395356b
modified: db/db.go modified: handlers/dashboard.go modified: main.go modified: services/openrouter.go modified: templates/dashboard.html
126 lines
6.2 KiB
HTML
126 lines
6.2 KiB
HTML
{{ define "dashboard.html" }}
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>SekiBot | Conversations</title>
|
|
<style>
|
|
/* DISCORD THEME COLORS */
|
|
:root { --blurple: #5865F2; --bg-sidebar: #2f3136; --bg-chat: #36393f; --bg-input: #40444b; --text: #dcddde; }
|
|
body { margin: 0; display: flex; height: 100vh; font-family: sans-serif; background: var(--bg-chat); color: var(--text); }
|
|
|
|
.sidebar { width: 240px; background: var(--bg-sidebar); display: flex; flex-direction: column; padding: 15px; }
|
|
.chat-list { flex-grow: 1; overflow-y: auto; }
|
|
.chat-item { padding: 10px; border-radius: 4px; cursor: pointer; margin-bottom: 5px; background: rgba(255,255,255,0.05); }
|
|
.chat-item:hover, .active { background: var(--bg-input); color: white; }
|
|
|
|
.chat-area { flex-grow: 1; display: flex; flex-direction: column; }
|
|
.messages { flex-grow: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 15px; }
|
|
.msg { max-width: 80%; padding: 10px 15px; border-radius: 8px; line-height: 1.4; }
|
|
.user { align-self: flex-end; background: var(--blurple); color: white; }
|
|
.assistant { align-self: flex-start; background: var(--bg-input); }
|
|
|
|
.input-container { padding: 20px; background: var(--bg-chat); }
|
|
#user-input { width: 100%; background: var(--bg-input); border: none; padding: 15px; border-radius: 8px; color: white; outline: none; }
|
|
|
|
button.new-chat { background: var(--blurple); color: white; border: none; padding: 10px; border-radius: 4px; cursor: pointer; margin-bottom: 20px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="sidebar">
|
|
<h2>SekiBot</h2>
|
|
<nav>
|
|
<div class="chat-item active" onclick="showPanel('chat-panel')" id="nav-chat"># conversations</div>
|
|
<div class="chat-item" onclick="showPanel('appt-panel')" id="nav-appt"># appointments-manager</div>
|
|
</nav>
|
|
<hr style="border: 0.5px solid #42454a; margin: 15px 0;">
|
|
<button class="new-chat" onclick="newChat()">+ New Chat</button>
|
|
<div class="chat-list">
|
|
{{range .Chats}}
|
|
<div class="chat-item" onclick="loadChat({{.ID}})"># chat-{{.ID}}</div>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
|
|
<!-- MAIN CHAT PANEL -->
|
|
<div class="main-content" id="chat-panel">
|
|
<div class="messages" id="message-pane" style="height: calc(100vh - 120px); overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 10px;">
|
|
<p style="text-align: center; color: var(--text-muted);">Select a chat to begin.</p>
|
|
</div>
|
|
<div class="input-container" style="padding: 20px; background: var(--bg-chat);">
|
|
<input type="text" id="user-input" placeholder="Type a message..." onkeypress="if(event.key==='Enter') sendMessage()" style="width: 100%; background: var(--bg-input); border: none; padding: 15px; border-radius: 8px; color: white;">
|
|
</div>
|
|
</div>
|
|
|
|
<!-- APPOINTMENTS CRUD PANEL -->
|
|
<div class="main-content" id="appt-panel" style="display: none; padding: 40px;">
|
|
<h1>Appointments Manager</h1>
|
|
<div style="background: var(--bg-sidebar); padding: 20px; border-radius: 8px; margin-bottom: 20px;">
|
|
<h3>Create Mock Appointment</h3>
|
|
<div style="display: grid; grid-template-columns: 1fr 1fr 100px; gap: 10px;">
|
|
<input type="text" id="m-phone" placeholder="Phone">
|
|
<input type="datetime-local" id="m-date">
|
|
<button onclick="createMockAppt()">Add</button>
|
|
</div>
|
|
</div>
|
|
<table>
|
|
<thead>
|
|
<tr><th>ID</th><th>Phone</th><th>Date</th><th>Status</th><th>Actions</th></tr>
|
|
</thead>
|
|
<tbody id="appt-table-body">
|
|
{{range .Appointments}}
|
|
<tr id="appt-{{.ID}}">
|
|
<td>#{{.ID}}</td>
|
|
<td><input type="text" value="{{.CustomerPhone}}" id="edit-phone-{{.ID}}" style="width: 120px; margin:0;"></td>
|
|
<td><input type="text" value="{{.Date}}" id="edit-date-{{.ID}}" style="width: 160px; margin:0;"></td>
|
|
<td><span class="status-pill">{{.Status}}</span></td>
|
|
<td>
|
|
<button style="background: var(--success);" onclick="updateAppt({{.ID}})">Save</button>
|
|
<button class="delete" onclick="deleteAppt({{.ID}})">Del</button>
|
|
</td>
|
|
</tr>
|
|
{{end}}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<script>
|
|
function showPanel(panelId) {
|
|
document.getElementById('chat-panel').style.display = panelId === 'chat-panel' ? 'flex' : 'none';
|
|
document.getElementById('appt-panel').style.display = panelId === 'appt-panel' ? 'block' : 'none';
|
|
document.querySelectorAll('nav .chat-item').forEach(el => el.classList.remove('active'));
|
|
document.getElementById(panelId === 'chat-panel' ? 'nav-chat' : 'nav-appt').classList.add('active');
|
|
}
|
|
|
|
async function createMockAppt() {
|
|
const phone = document.getElementById('m-phone').value;
|
|
const date = document.getElementById('m-date').value;
|
|
await fetch('/admin/appointment', {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify({phone, date})
|
|
});
|
|
location.reload();
|
|
}
|
|
|
|
async function updateAppt(id) {
|
|
const phone = document.getElementById(`edit-phone-${id}`).value;
|
|
const date = document.getElementById(`edit-date-${id}`).value;
|
|
await fetch(`/admin/appointment/${id}`, {
|
|
method: 'PUT',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify({phone, date})
|
|
});
|
|
alert("Updated, seki.");
|
|
}
|
|
|
|
async function deleteAppt(id) {
|
|
if(!confirm("Kill it?")) return;
|
|
await fetch(`/admin/appointment/${id}`, { method: 'DELETE' });
|
|
document.getElementById(`appt-${id}`).remove();
|
|
}
|
|
|
|
// ... (Keep your existing newChat, loadChat, and sendMessage scripts here) ...
|
|
</script>
|
|
</body>
|
|
</html>
|
|
{{ end }} |