ui

Makefile

@@ -0,0 +1,31 @@
+# Makefile for running the Vet Clinic Chat Assistant locally with Ollama
+
+.PHONY: run ollama-start ollama-stop ollama-pull ollama-status
+
+# Start Ollama server (if not already running)
+ollama-start:
+	ollama serve &
+	@echo "Ollama server started."
+
+# Stop Ollama server
+ollama-stop:
+	pkill -f "ollama serve" || true
+	@echo "Ollama server stopped."
+
+# Pull a model (default: llama3)
+ollama-pull:
+	ollama pull qwen3:latest
+
+# Show Ollama status
+ollama-status:
+	ollama list
+
+# Run the Go server (assumes Ollama is running)
+run: ollama-pull
+	OPENAI_API_KEY=ollama OPENAI_BASE_URL=http://localhost:11434/v1 OPENAI_MODEL=llama3 go run .
+
+# Run tests
+.PHONY: test
+
+test:
+	go test ./...

ui.html

@@ -18,10 +18,14 @@
     const messages = document.getElementById('messages');
     const input = document.getElementById('input');
     const send = document.getElementById('send');
-    function appendMsg(text, who) {
+    function appendMsg(text, who, isHtml) {
       const div = document.createElement('div');
       div.className = who === 'user' ? 'text-gray-800 mb-2' : 'text-green-700 mb-2';
-      div.textContent = text;
+      if (isHtml) {
+        div.innerHTML = text;
+      } else {
+        div.textContent = text;
+      }
       messages.appendChild(div);
       messages.scrollTop = messages.scrollHeight;
     }
@@ -39,22 +43,25 @@
       const data = await resp.json();
       messages.lastChild.remove(); // remove 'Thinking...'
       if (data.match) {
-        let txt = '';
-        txt += `Match: ${data.match}\n`;
+        let html = '';
+        html += `<div class='font-bold'>Match: <span class='text-green-800'>${data.match}</span></div>`;
         if (data.notes) {
-          txt += `\nNotes: ${data.notes}\n`;
+          html += `<div class='my-2 p-2 bg-yellow-100 border-l-4 border-yellow-400 text-yellow-900'><b>Notes:</b> ${data.notes}</div>`;
         }
         if (data.procedures && data.procedures.length > 0) {
-          txt += `\nProcedures:\n`;
-          data.procedures.forEach(function(p, idx) {
-            txt += `  ${idx+1}. ${p.name}\n`;
-            txt += `     Cost: ${p.price} Ft\n`;
-            txt += `     Time: ${p.duration_minutes} min\n`;
-            if (p.note && p.note.trim()) txt += `     Note: ${p.note}\n`;
+          html += `<div class='mt-2 mb-1 font-semibold'>Procedures:</div>`;
+          html += `<ol class='list-decimal ml-6'>`;
+          data.procedures.forEach(function(p) {
+            html += `<li class='mb-2'><span class='font-bold'>${p.name}</span><br>`;
+            html += `<span class='block'>Cost: <span class='font-semibold'>${p.price} Ft</span></span>`;
+            html += `<span class='block'>Time: <span class='font-semibold'>${p.duration_minutes} min</span></span>`;
+            if (p.note && p.note.trim()) html += `<span class='block text-gray-600'>Note: ${p.note}</span>`;
+            html += `</li>`;
           });
-          txt += `\nTotal: ${data.total_price} Ft, ${data.total_duration} min\n`;
+          html += `</ol>`;
+          html += `<div class='mt-2 font-bold'>Total: <span class='text-green-800'>${data.total_price} Ft</span>, <span class='text-green-800'>${data.total_duration} min</span></div>`;
         }
-        appendMsg(txt, 'bot');
+        appendMsg(html, 'bot', true);
       } else {
         appendMsg(data.reply || 'No match found.', 'bot');
       }