feat(go-crm): industrial terminal-core UI redesign

Complete visual overhaul of the go-crm web interface:

- New shared layout system (internal/templates/ui.go) with dark zinc
  industrial theme, JetBrains Mono typography, grid/noise textures
- Redesigned all pages: Dashboard, Login/Signup, Clients, Customers,
  Services, Scheduling, Payments, Questions, Answers, Leads,
  Review Queue, Report, Keyword Mapping
- Tailwind CSS via CDN with custom color palette (amber/emerald/rose/sky)
- HTMX-powered interactions with CSS swap animations
- Status pills, KPI cards, data tables, empty states, inline forms
- Mobile-responsive sidebar with collapsible navigation
- All existing tests updated and passing
- Zero new build dependencies — works with existing go run/air workflow
This commit is contained in:
2026-05-23 18:00:32 -03:00
parent 744868caa1
commit 9c3bfd131d
16 changed files with 1901 additions and 791 deletions

View File

@@ -1,11 +1,13 @@
package handlers
import (
"fmt"
"net/http"
"strconv"
"time"
"go-crm/internal/db"
"go-crm/internal/templates"
"github.com/go-chi/chi/v5"
)
@@ -37,15 +39,75 @@ func (a *App) ListServices(w http.ResponseWriter, r *http.Request) {
var clientOptions string
for _, c := range clients {
clientOptions += `<option value="` + strconv.FormatInt(c.ClientID, 10) + `">` + c.Name + `</option>`
clientOptions += fmt.Sprintf(`<option value="%d">%s</option>`, c.ClientID, htmlEscape(c.Name))
}
buf := templates.BufRender()
actions := `<button type="button" onclick="document.getElementById('serviceForm').classList.toggle('hidden')" class="btn-primary"><svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/></svg> Add Service</button>`
fmt.Fprint(buf, templates.PageHeader("Services", "Your service catalog and pricing", actions))
fmt.Fprintf(buf, `
<div id="serviceForm" class="hidden mb-6 animate-slide-up">
<div class="card-industrial p-5">
<h3 class="text-sm font-semibold text-zinc-200 mb-4">New Service</h3>
<form hx-post="/services" hx-target="#serviceList" hx-swap="innerHTML" class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4">
<input type="text" name="name" placeholder="Service Name" required class="input-industrial">
<input type="number" name="price" placeholder="Price" step="0.01" class="input-industrial">
<input type="text" name="duration" placeholder="Duration" class="input-industrial">
<select name="client_id" required class="input-industrial"><option value="">Select Client</option>%s</select>
<textarea name="description" placeholder="Description" class="input-industrial sm:col-span-2 lg:col-span-3" rows="2"></textarea>
<div class="flex items-end"><button type="submit" class="btn-primary">Save</button></div>
</form>
</div>
</div>`, clientOptions)
if len(services) == 0 {
fmt.Fprint(buf, templates.EmptyState(`<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M10.325 4.317c.426-1.756 2.924-1.756 3.35 0a1.724 1.724 0 002.573 1.066c1.543-.94 3.31.826 2.37 2.37a1.724 1.724 0 001.065 2.572c1.756.426 1.756 2.924 0 3.35a1.724 1.724 0 00-1.066 2.573c.94 1.543-.826 3.31-2.37 2.37a1.724 1.724 0 00-2.572 1.065c-.426 1.756-2.924 1.756-3.35 0a1.724 1.724 0 00-2.573-1.066c-1.543.94-3.31-.826-2.37-2.37a1.724 1.724 0 00-1.065-2.572c-1.756-.426-1.756-2.924 0-3.35a1.724 1.724 0 001.066-2.573c-.94-1.543.826-3.31 2.37-2.37 1.608.536 3.135-.493 3.35-2.572zM15 12a3 3 0 11-6 0 3 3 0 016 0z"/>`, "No services yet. Add your first service to the catalog."))
} else {
fmt.Fprintf(buf, `<div class="card-industrial overflow-hidden animate-slide-up stagger-1"><div class="overflow-x-auto">`)
fmt.Fprint(buf, templates.TableStart([]string{"Name", "Price", "Duration", "Actions"}))
for _, s := range services {
fmt.Fprintf(buf, `<tr>
<td class="font-medium text-zinc-200">%s</td>
<td class="font-mono text-sm text-emerald-400">R$ %.2f</td>
<td class="text-xs text-zinc-400">%s</td>
<td>
<div class="flex items-center gap-2">
<a href="/services/%d" class="btn-ghost btn-sm">View</a>
<button type="button" onclick="document.getElementById('editServ%d').classList.toggle('hidden')" class="btn-ghost btn-sm">Edit</button>
<form hx-delete="/services/%d" hx-target="closest tr" hx-swap="outerHTML" style="display:inline">
<button type="submit" class="btn-danger btn-sm" onclick="return confirm('Delete?')">Delete</button>
</form>
</div>
</td>
</tr>`, htmlEscape(s.Name), s.Price, htmlEscape(s.Duration), s.ServiceID, s.ServiceID, s.ServiceID)
}
fmt.Fprint(buf, templates.TableEnd())
fmt.Fprintf(buf, `</div></div>`)
for _, s := range services {
fmt.Fprintf(buf, `
<div id="editServ%d" class="hidden mt-4 animate-slide-up">
<div class="card-industrial p-5 border-amber-400/10">
<h3 class="text-sm font-semibold text-zinc-200 mb-3">Edit %s</h3>
<form hx-put="/services/%d" hx-target="#serviceList" hx-swap="innerHTML" class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
<input type="text" name="name" value="%s" class="input-industrial text-xs">
<input type="number" name="price" value="%.2f" step="0.01" class="input-industrial text-xs">
<input type="text" name="duration" value="%s" class="input-industrial text-xs">
<select name="client_id" class="input-industrial text-xs"><option value="%d">%s</option>%s</select>
<textarea name="description" class="input-industrial text-xs sm:col-span-2 lg:col-span-3" rows="2">%s</textarea>
<div class="flex items-end gap-2">
<button type="submit" class="btn-primary btn-sm">Save</button>
<button type="button" onclick="document.getElementById('editServ%d').classList.add('hidden')" class="btn-ghost btn-sm">Cancel</button>
</div>
</form>
</div>
</div>`, s.ServiceID, htmlEscape(s.Name), s.ServiceID, htmlEscape(s.Name), s.Price, htmlEscape(s.Duration), s.ClientID, htmlEscape(s.Name), clientOptions, htmlEscape(s.Description), s.ServiceID)
}
}
w.Header().Set("Content-Type", "text/html; charset=utf-8")
w.Write([]byte(`<!DOCTYPE html><html><head><script src="https://unpkg.com/htmx.org@1.9.10"></script></head><body><h1>Services</h1><button class="btn" onclick="document.getElementById('serviceForm').style.display='block'">Add Service</button><div id="serviceForm" style="display:none; margin-top:1rem;"><form hx-post="/services" hx-target="#serviceList"><input type="text" name="name" placeholder="Service Name" required><input type="number" name="price" placeholder="Price" step="0.01"><textarea name="description" placeholder="Description"></textarea><input type="text" name="duration" placeholder="Duration"><select name="client_id" required><option value="">Select Client</option>` + clientOptions + `</select><button type="submit">Add</button></form></div><table><thead><tr><th>Name</th><th>Price</th><th>Duration</th><th>Actions</th></tr></thead><tbody id="serviceList">`))
for _, s := range services {
w.Write([]byte(`<tr><td>` + s.Name + `</td><td>` + strconv.FormatFloat(s.Price, 'f', 2, 64) + `</td><td>` + s.Duration + `</td><td><a href="/services/` + strconv.FormatInt(s.ServiceID, 10) + `">View</a><button type="button" onclick="document.getElementById('editServ` + strconv.FormatInt(s.ServiceID, 10) + `').style.display='table-row'">Edit</button><form method="DELETE" style="display:inline" hx-delete="/services/` + strconv.FormatInt(s.ServiceID, 10) + `" hx-target="closest tr"><button type="submit">Delete</button></form></td></tr><tr id="editServ` + strconv.FormatInt(s.ServiceID, 10) + `" style="display:none"><td colspan="4"><form hx-put="/services/` + strconv.FormatInt(s.ServiceID, 10) + `" hx-target="#serviceList" hx-swap="innerHTML"><input type="text" name="name" value="` + s.Name + `"><input type="number" name="price" value="` + strconv.FormatFloat(s.Price, 'f', 2, 64) + `"><textarea name="description">` + s.Description + `</textarea><input type="text" name="duration" value="` + s.Duration + `"><select name="client_id"><option value="` + strconv.FormatInt(s.ClientID, 10) + `">` + s.Name + `</option>` + clientOptions + `</select><button type="submit">Save</button></form></td></tr>`))
}
w.Write([]byte(`</tbody></table></body></html>`))
templates.WritePage(w, buf, "Services", "services")
}
func (a *App) CreateService(w http.ResponseWriter, r *http.Request) {
@@ -96,8 +158,33 @@ func (a *App) ViewService(w http.ResponseWriter, r *http.Request) {
return
}
buf := templates.BufRender()
fmt.Fprint(buf, templates.PageHeader(htmlEscape(s.Name), "Service details"))
fmt.Fprintf(buf, `
<div class="max-w-lg animate-slide-up">
<div class="card-industrial p-6">
<div class="space-y-4">
<div class="flex justify-between py-3 border-b border-white/[0.04]">
<span class="text-xs font-mono uppercase text-zinc-500">Price</span>
<span class="text-lg font-mono font-semibold text-emerald-400">R$ %.2f</span>
</div>
<div class="flex justify-between py-3 border-b border-white/[0.04]">
<span class="text-xs font-mono uppercase text-zinc-500">Duration</span>
<span class="text-sm text-zinc-300">%s</span>
</div>
<div class="flex justify-between py-3">
<span class="text-xs font-mono uppercase text-zinc-500">Description</span>
<span class="text-sm text-zinc-300 text-right max-w-xs">%s</span>
</div>
</div>
<div class="mt-6">
<a href="/services" class="btn-ghost btn-sm">Back</a>
</div>
</div>
</div>`, s.Price, htmlEscape(s.Duration), htmlEscape(s.Description))
w.Header().Set("Content-Type", "text/html; charset=utf-8")
w.Write([]byte(`<!DOCTYPE html><body><h1>` + s.Name + `</h1><p>Price: ` + strconv.FormatFloat(s.Price, 'f', 2, 64) + `</p><p>Description: ` + s.Description + `</p><p>Duration: ` + s.Duration + `</p><a href="/services">Back</a></body></html>`))
templates.WritePage(w, buf, s.Name, "services")
}
func (a *App) UpdateService(w http.ResponseWriter, r *http.Request) {
@@ -128,7 +215,7 @@ func (a *App) DeleteService(w http.ResponseWriter, r *http.Request) {
a.DB.Exec("DELETE FROM services WHERE service_id = ?", id)
}
// --- package-level shims kept for existing tests ---
// --- package-level shims ---
func ListServices(w http.ResponseWriter, r *http.Request) {
(&App{DB: DB, WAConnector: WAConnector}).ListServices(w, r)