up
This commit is contained in:
Lizandro Guarnizo
@@ -9,7 +9,8 @@ import (
|
||||
|
||||
type ProyectoTicket struct {
|
||||
gorm.Model
|
||||
ProyectoID uint `json:"proyecto_id" gorm:"column:proyecto_id;index"`
|
||||
ProyectoID uint `json:"proyecto_id" gorm:"column:proyecto_id;index"`
|
||||
Proyecto Proyecto `json:"proyecto" gorm:"foreignKey:ProyectoID"`
|
||||
PortalUserID uint `json:"portal_user_id" gorm:"column:portal_user_id;index"`
|
||||
AutorNombre string `json:"autor_nombre" gorm:"column:autor_nombre"`
|
||||
Titulo string `json:"titulo" gorm:"column:titulo"`
|
||||
@@ -67,3 +68,13 @@ func GetTicketsByPortalUser(portalUserID uint) ([]ProyectoTicket, error) {
|
||||
Preload("Mensajes").Order("created_at DESC").Find(&items).Error
|
||||
return items, err
|
||||
}
|
||||
|
||||
func GetAllTickets(estado string) ([]ProyectoTicket, error) {
|
||||
var items []ProyectoTicket
|
||||
db := app.Http.Database.DB.Preload("Proyecto").Preload("Mensajes").Order("created_at DESC")
|
||||
if estado != "" && estado != "todos" {
|
||||
db = db.Where("estado = ?", estado)
|
||||
}
|
||||
err := db.Find(&items).Error
|
||||
return items, err
|
||||
}
|
||||
|
||||
@@ -0,0 +1,169 @@
|
||||
<div x-data="ticketsAdmin()" x-init="init()" class="p-6">
|
||||
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h1 class="text-xl font-bold text-slate-800">Tickets de soporte</h1>
|
||||
<p class="text-sm text-slate-500 mt-0.5">Todos los tickets abiertos por clientes del portal</p>
|
||||
</div>
|
||||
<!-- Filtro estado -->
|
||||
<div class="flex items-center gap-2">
|
||||
<template x-for="s in estados" :key="s.val">
|
||||
<button @click="filtro=s.val; load()"
|
||||
:class="filtro===s.val ? 'text-white' : 'bg-white text-slate-600 border border-slate-200 hover:bg-slate-50'"
|
||||
:style="filtro===s.val ? 'background:#8eb02f' : ''"
|
||||
class="px-3 py-1.5 rounded-lg text-xs font-medium transition-colors"
|
||||
x-text="s.label">
|
||||
</button>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Loading -->
|
||||
<div x-show="loading" class="text-center py-12 text-slate-400 text-sm">Cargando tickets...</div>
|
||||
|
||||
<!-- Empty -->
|
||||
<div x-show="!loading && tickets.length===0" class="text-center py-12 text-slate-400 text-sm">
|
||||
No hay tickets con este filtro.
|
||||
</div>
|
||||
|
||||
<!-- Lista -->
|
||||
<div x-show="!loading" class="space-y-3">
|
||||
<template x-for="t in tickets" :key="t.ID">
|
||||
<div class="bg-white border border-slate-200 rounded-xl overflow-hidden shadow-sm">
|
||||
<!-- Cabecera del ticket -->
|
||||
<div class="p-4 flex items-start gap-4 cursor-pointer" @click="t._open = !t._open">
|
||||
<!-- Indicador de estado -->
|
||||
<div class="mt-0.5 w-2.5 h-2.5 rounded-full flex-shrink-0" :class="dotClass(t.estado)"></div>
|
||||
<div class="flex-1 min-w-0">
|
||||
<div class="flex flex-wrap items-center gap-2 mb-1">
|
||||
<span class="badge" :class="ticketBadge(t.estado)" x-text="t.estado"></span>
|
||||
<span class="badge" :class="prioridadBadge(t.prioridad)" x-text="t.prioridad"></span>
|
||||
<span x-show="t.proyecto && t.proyecto.nombre" class="text-xs text-slate-400">
|
||||
📁 <span x-text="t.proyecto ? t.proyecto.nombre : ''"></span>
|
||||
</span>
|
||||
</div>
|
||||
<h3 class="font-semibold text-sm text-slate-800 truncate" x-text="t.titulo"></h3>
|
||||
<p class="text-xs text-slate-500 mt-0.5">
|
||||
Por: <span x-text="t.autor_nombre"></span> · <span x-text="formatDate(t.CreatedAt)"></span>
|
||||
<span x-show="t.mensajes && t.mensajes.length" class="ml-2 text-slate-400">
|
||||
💬 <span x-text="t.mensajes ? t.mensajes.length : 0"></span>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<!-- Cambiar estado -->
|
||||
<div class="flex items-center gap-2 flex-shrink-0" @click.stop>
|
||||
<select @change="cambiarEstado(t, $event.target.value)"
|
||||
class="text-xs border border-slate-200 rounded-lg px-2 py-1.5 outline-none bg-white text-slate-700">
|
||||
<option value="abierto" :selected="t.estado==='abierto'">Abierto</option>
|
||||
<option value="en_progreso" :selected="t.estado==='en_progreso'">En progreso</option>
|
||||
<option value="resuelto" :selected="t.estado==='resuelto'">Resuelto</option>
|
||||
<option value="cerrado" :selected="t.estado==='cerrado'">Cerrado</option>
|
||||
</select>
|
||||
<a :href="`/app/proyectos/${t.proyecto_id}/detalle`" title="Ver proyecto"
|
||||
class="text-slate-400 hover:text-slate-600 transition-colors" @click.stop>
|
||||
<svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
|
||||
</svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Detalle expandido -->
|
||||
<div x-show="t._open" class="border-t border-slate-100 px-4 pb-4">
|
||||
<p class="text-sm text-slate-600 py-3 border-b border-slate-100" x-text="t.descripcion"></p>
|
||||
|
||||
<!-- Mensajes -->
|
||||
<template x-if="t.mensajes && t.mensajes.length">
|
||||
<div class="space-y-2 mt-3">
|
||||
<template x-for="m in t.mensajes" :key="m.ID">
|
||||
<div class="flex gap-2" :class="m.es_admin ? 'justify-end' : ''">
|
||||
<div :class="m.es_admin ? 'bg-primary/10' : 'bg-slate-100'"
|
||||
class="rounded-xl px-3 py-2 text-sm max-w-sm text-slate-700">
|
||||
<div class="text-xs font-semibold mb-1"
|
||||
:style="m.es_admin ? 'color:#8eb02f' : 'color:#64748b'"
|
||||
x-text="m.autor_nombre"></div>
|
||||
<span x-text="m.contenido"></span>
|
||||
<div class="text-xs text-slate-400 mt-1" x-text="formatDate(m.CreatedAt)"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- Responder -->
|
||||
<div class="mt-3 flex gap-2">
|
||||
<input x-model="t._reply" type="text" placeholder="Escribir respuesta..."
|
||||
class="flex-1 border border-slate-200 rounded-xl px-3 py-2 text-sm outline-none"
|
||||
@keydown.enter.prevent="responder(t)"
|
||||
onfocus="this.style.borderColor='#8eb02f'" onblur="this.style.borderColor='#e2e8f0'">
|
||||
<button @click="responder(t)"
|
||||
class="px-4 py-2 rounded-xl text-white text-sm font-medium transition-colors"
|
||||
style="background:#8eb02f"
|
||||
onmouseover="this.style.background='#6d8c24'" onmouseout="this.style.background='#8eb02f'">
|
||||
Responder
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function ticketsAdmin() {
|
||||
return {
|
||||
tickets: [],
|
||||
loading: true,
|
||||
filtro: 'todos',
|
||||
estados: [
|
||||
{ val: 'todos', label: 'Todos' },
|
||||
{ val: 'abierto', label: 'Abiertos' },
|
||||
{ val: 'en_progreso',label: 'En progreso' },
|
||||
{ val: 'resuelto', label: 'Resueltos' },
|
||||
{ val: 'cerrado', label: 'Cerrados' },
|
||||
],
|
||||
|
||||
async init() { await this.load(); },
|
||||
|
||||
async load() {
|
||||
this.loading = true;
|
||||
try {
|
||||
const r = await axios.get(`/app/tickets/data?estado=${this.filtro}`);
|
||||
this.tickets = (r.data || []).map(t => ({ ...t, _open: false, _reply: '' }));
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
async cambiarEstado(t, estado) {
|
||||
await axios.put(`/app/tickets/${t.ID}/estado`, { estado });
|
||||
t.estado = estado;
|
||||
},
|
||||
|
||||
async responder(t) {
|
||||
const contenido = (t._reply || '').trim();
|
||||
if (!contenido) return;
|
||||
await axios.post(`/app/tickets/${t.ID}/mensaje`, { contenido });
|
||||
if (!t.mensajes) t.mensajes = [];
|
||||
t.mensajes.push({ ID: Date.now(), contenido, es_admin: true, autor_nombre: 'Admin', CreatedAt: new Date().toISOString() });
|
||||
t._reply = '';
|
||||
t._open = true;
|
||||
},
|
||||
|
||||
dotClass(e) {
|
||||
return { 'bg-yellow-400': e==='abierto', 'bg-blue-400': e==='en_progreso', 'bg-green-400': e==='resuelto', 'bg-slate-300': e==='cerrado' };
|
||||
},
|
||||
ticketBadge(e) {
|
||||
return { 'badge-warning': e==='abierto', 'badge-info': e==='en_progreso', 'badge-success': e==='resuelto', 'badge-default': e==='cerrado' };
|
||||
},
|
||||
prioridadBadge(p) {
|
||||
return { 'badge-danger': p==='urgente', 'badge-warning': p==='alta', 'badge-info': p==='media', 'badge-default': p==='baja' };
|
||||
},
|
||||
formatDate(d) {
|
||||
if (!d) return '';
|
||||
return new Date(d).toLocaleString('es-CO', { dateStyle: 'short', timeStyle: 'short' });
|
||||
},
|
||||
};
|
||||
}
|
||||
</script>
|
||||
@@ -500,3 +500,21 @@ func mimeFromHeader(fh *multipart.FileHeader) string {
|
||||
}
|
||||
return ct
|
||||
}
|
||||
|
||||
// ─── Tickets global (admin) ───────────────────────────────────────────────────
|
||||
|
||||
func TicketsAdminIndex(c *fiber.Ctx) error {
|
||||
return c.Render("tickets_admin", fiber.Map{
|
||||
"user": c.Locals("user"),
|
||||
"modules": c.Locals("userModules"),
|
||||
}, "layouts/main")
|
||||
}
|
||||
|
||||
func GetAllTicketsAdmin(c *fiber.Ctx) error {
|
||||
estado := c.Query("estado", "todos")
|
||||
items, err := models.GetAllTickets(estado)
|
||||
if err != nil {
|
||||
return c.Status(500).JSON(fiber.Map{"error": err.Error()})
|
||||
}
|
||||
return c.JSON(items)
|
||||
}
|
||||
|
||||
@@ -247,6 +247,12 @@ func UserRoutes(app fiber.Router) {
|
||||
protected.Put("/proyectos/:id/tickets/:ticketID/estado", controllers.UpdateTicketEstadoAdmin)
|
||||
protected.Post("/proyectos/:id/tickets/:ticketID/mensaje", controllers.AdminResponderTicket)
|
||||
|
||||
// Tickets global (todos los proyectos)
|
||||
protected.Get("/tickets", middlewares.MenuMiddleware, controllers.TicketsAdminIndex)
|
||||
protected.Get("/tickets/data", controllers.GetAllTicketsAdmin)
|
||||
protected.Put("/tickets/:ticketID/estado", controllers.UpdateTicketEstadoAdmin)
|
||||
protected.Post("/tickets/:ticketID/mensaje", controllers.AdminResponderTicket)
|
||||
|
||||
protected.Get("/portal-usuarios", middlewares.MenuMiddleware, controllers.PortalUsuariosIndex)
|
||||
protected.Get("/loadportalusuarios", controllers.LoadPortalUsuarios)
|
||||
protected.Post("/portal-usuarios", controllers.CreatePortalUsuario)
|
||||
|
||||
Reference in New Issue
Block a user