🚀 Release v1.4.1 - Enhanced Ticket Management Features

 New Features:
• Added admin filter by client/organization in internal frontend
• Enhanced attachments viewer with toggle button in client frontend
• Added attachment counter and improved UX in ticket conversation

🔧 Backend Improvements:
• New `/tickets/admin/all` endpoint for administrators
• Advanced filtering by tenant, status, and priority
• Rich response data with tenant and user information
• Proper admin permissions validation

🎨 Frontend Enhancements:
• Client filter dropdown in admin panel
• Enhanced ticket table with client/organization info
• Collapsible attachments section with visual indicator
• Improved API parameter handling (fixed undefined filters)
• Better responsive design and hover effects

🐛 Bug Fixes:
• Fixed undefined URL parameters in API calls
• Corrected parameter filtering in API utility
• Improved error handling for admin endpoints

📱 UI/UX:
• Added visual badges for attachment count
• Enhanced table columns with client/creator information
• Improved button styling and interaction feedback
• Better organization of ticket conversation layout
This commit is contained in:
2026-02-10 08:18:53 -07:00
parent c9dd024c7e
commit 94e9d91586
4 changed files with 248 additions and 53 deletions

View File

@@ -14,7 +14,8 @@
let closeResolution = '';
let fileInput: HTMLInputElement;
let isUploading = false;
let pollingInterval: any = null;
let pollingInterval: any = null;
let showAttachments = true; // Variable para controlar la visibilidad de attachments
async function loadComments() {
try {
@@ -257,42 +258,59 @@
{#if $tickets.attachments.length > 0}
<div class="card">
<div class="card-header">
<h3 class="text-lg font-semibold text-gray-900">Archivos Adjuntos</h3>
</div>
<div class="card-content">
<div class="space-y-3">
{#each $tickets.attachments as attachment}
<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg">
<div class="flex items-center space-x-3">
<div class="w-8 h-8 bg-gray-200 rounded flex items-center justify-center">
<svg class="w-4 h-4 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" />
</svg>
</div>
<div>
<p class="text-sm font-medium text-gray-900">
{attachment.original_filename}
</p>
<p class="text-xs text-gray-500">
{Math.round(attachment.size_bytes / 1024)} KB •
Subido por {attachment.uploaded_by_name}
{formatDate(attachment.uploaded_at)}
</p>
</div>
</div>
<a
href="/api/v1/tickets/{ticketId}/attachments/{attachment.id}/download"
class="btn-ghost p-2"
target="_blank"
>
<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 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg>
</a>
</div>
{/each}
<div class="flex items-center justify-between">
<h3 class="text-lg font-semibold text-gray-900 flex items-center space-x-2">
<span>Archivos Adjuntos</span>
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
{$tickets.attachments.length} archivo{$tickets.attachments.length !== 1 ? 's' : ''}
</span>
</h3>
<button
class="text-sm text-gray-500 hover:text-gray-700"
title="Ver/Ocultar archivos adjuntos"
on:click={() => showAttachments = !showAttachments}
>
{showAttachments ? 'Ocultar' : 'Ver'} archivos
</button>
</div>
</div>
{#if showAttachments}
<div class="card-content">
<div class="space-y-3">
{#each $tickets.attachments as attachment}
<div class="flex items-center justify-between p-3 bg-gray-50 rounded-lg hover:bg-gray-100 transition-colors">
<div class="flex items-center space-x-3">
<div class="w-8 h-8 bg-gray-200 rounded flex items-center justify-center">
<svg class="w-4 h-4 text-gray-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13" />
</svg>
</div>
<div>
<p class="text-sm font-medium text-gray-900">
{attachment.original_filename}
</p>
<p class="text-xs text-gray-500">
{Math.round(attachment.size_bytes / 1024)} KB •
Subido por {attachment.uploaded_by_name}
{formatDate(attachment.uploaded_at)}
</p>
</div>
</div>
<a
href="/api/v1/tickets/{ticketId}/attachments/{attachment.id}/download"
class="btn-ghost p-2 hover:bg-blue-100 rounded-md transition-colors"
target="_blank"
title="Descargar archivo"
>
<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 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg>
</a>
</div>
{/each}
</div>
</div>
{/if}
</div>
{/if}