lizandrogd/soft_usite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

up

Browse Source
This commit is contained in:
Lizandro Guarnizo
2026-05-16 13:44:32 -05:00
parent 85595e639e
commit 76a0c28b16
16 changed files with 225 additions and 725 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/layouts/portal.html
+4 -73
View File
@@ -20,84 +20,15 @@
<body class="min-h-screen flex flex-col">
<!-- Navbar -->
<header class="bg-white border-b border-slate-200 sticky top-0 z-30"
x-data="{
bellOpen: false,
notifs: [],
unread: 0,
async loadNotifs() {
try {
const r = await axios.get('/portal/mis-notifs?no_leidas=0');
this.notifs = r.data.items || [];
this.unread = r.data.unread || 0;
} catch {}
},
async markRead(id) {
await axios.put('/portal/mis-notifs/' + id + '/leida');
const n = this.notifs.find(x => x.ID === id);
if (n) { n.leida = true; this.unread = Math.max(0, this.unread - 1); }
},
async markAll() {
await axios.post('/portal/mis-notifs/marcar-todas');
this.notifs.forEach(n => n.leida = true);
this.unread = 0;
}
}"
x-init="loadNotifs(); setInterval(() => loadNotifs(), 30000)">
<header class="bg-white border-b border-slate-200 sticky top-0 z-30">
<div class="max-w-6xl mx-auto px-4 sm:px-6 h-16 flex items-center justify-between">
<!-- Logo -->
<a href="/portal/dashboard" class="flex items-center gap-2 font-bold text-slate-800 text-lg">
<span class="w-7 h-7 rounded-full flex items-center justify-content:center text-white text-xs font-bold flex items-center justify-center" style="background:#8eb02f">U</span>
<span class="w-7 h-7 rounded-full flex items-center justify-center text-white text-xs font-bold" style="background:#8eb02f">U</span>
<span>Portal de Clientes</span>
</a>
<!-- Right: bell + user -->
<div class="flex items-center gap-3">
<!-- 🔔 Bell -->
<div class="relative">
<button @click="bellOpen = !bellOpen; if(bellOpen) loadNotifs()"
class="relative p-2 rounded-xl hover:bg-slate-100 transition-colors focus:outline-none">
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 text-slate-500" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
<path stroke-linecap="round" stroke-linejoin="round" d="M14.857 17.082a23.848 23.848 0 005.454-1.31A8.967 8.967 0 0118 9.75v-.7V9A6 6 0 006 9v.75a8.967 8.967 0 01-2.312 6.022c1.733.64 3.56 1.085 5.455 1.31m5.714 0a24.255 24.255 0 01-5.714 0m5.714 0a3 3 0 11-5.714 0"/>
</svg>
<span x-show="unread > 0"
class="absolute -top-0.5 -right-0.5 h-4 w-4 flex items-center justify-center rounded-full text-white text-[10px] font-bold"
style="background:#8eb02f"
x-text="unread > 9 ? '9+' : unread">
</span>
</button>
<!-- Dropdown -->
<div x-show="bellOpen" @click.outside="bellOpen = false"
x-transition:enter="transition ease-out duration-150"
x-transition:enter-start="opacity-0 scale-95 -translate-y-1"
x-transition:enter-end="opacity-100 scale-100 translate-y-0"
x-transition:leave="transition ease-in duration-100"
x-transition:leave-start="opacity-100 scale-100 translate-y-0"
x-transition:leave-end="opacity-0 scale-95 -translate-y-1"
class="absolute right-0 top-12 w-72 bg-white rounded-xl shadow-lg border border-slate-200 overflow-hidden z-50">
<div class="px-4 py-3 border-b border-slate-100 flex items-center justify-between">
<span class="text-sm font-semibold text-slate-800">Notificaciones</span>
<button x-show="unread > 0" @click="markAll()" class="text-xs text-slate-400 hover:text-slate-600">Marcar todas leídas</button>
</div>
<div class="max-h-64 overflow-y-auto divide-y divide-slate-100">
<template x-if="notifs.length === 0">
<div class="px-4 py-6 text-center text-slate-400 text-sm">Sin notificaciones</div>
</template>
<template x-for="n in notifs" :key="n.ID">
<a :href="n.url || '#'" @click="if(!n.leida) markRead(n.ID)"
class="flex items-start gap-3 px-4 py-3 hover:bg-slate-50 transition-colors"
:class="!n.leida ? 'bg-emerald-50/50' : ''">
<span class="text-lg leading-none mt-0.5" x-text="n.icono || '🔔'"></span>
<div class="flex-1 min-w-0">
<p class="text-sm font-medium text-slate-800 truncate" x-text="n.titulo"></p>
<p class="text-xs text-slate-500 truncate mt-0.5" x-text="n.cuerpo"></p>
</div>
<div x-show="!n.leida" class="w-2 h-2 rounded-full flex-shrink-0 mt-1.5" style="background:#8eb02f"></div>
</a>
</template>
</div>
</div>
</div>
<!-- User name -->
<!-- User -->
<div class="flex items-center gap-4">
<span class="text-sm text-slate-600 hidden sm:block">
{{ if .portalUser }}{{ .portalUser.Nombre }}{{ end }}
</span>
resources/views/portal_usuarios.html
+13 -63
View File
@@ -1,6 +1,6 @@
<div x-data="portalUsuariosApp()" x-init="init()" class="p-6">
<div class="flex items-center justify-between mb-4">
<div class="flex items-center justify-between mb-6">
<div>
<h1 class="text-2xl font-bold text-slate-800">Usuarios del Portal</h1>
<p class="text-sm text-slate-500 mt-1">Accesos del portal de clientes</p>
@@ -11,15 +11,6 @@
</button>
</div>
<!-- Banner URL del portal -->
<div class="flex items-center gap-3 bg-blue-50 border border-blue-200 rounded-xl px-4 py-3 mb-6 text-sm">
<svg class="w-4 h-4 text-blue-500 shrink-0" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"/></svg>
<span class="text-blue-700">Los usuarios inician sesión en:</span>
<a href="/portal/login" target="_blank" class="font-semibold text-blue-600 hover:underline">/portal/login</a>
<button @click="navigator.clipboard.writeText(window.location.origin+'/portal/login').then(()=>alert('URL copiada'))"
class="ml-auto text-xs text-blue-500 hover:text-blue-700 border border-blue-300 rounded px-2 py-0.5">Copiar enlace</button>
</div>
<!-- Tabla -->
<div class="bg-white rounded-xl shadow-sm border border-slate-200 overflow-x-auto">
<table class="w-full text-sm">
@@ -42,13 +33,13 @@
<td class="px-4 py-3 font-medium text-slate-800" x-text="u.nombre"></td>
<td class="px-4 py-3 text-slate-600" x-text="u.email"></td>
<td class="px-4 py-3">
<span class="badge" :class="(u.role?.es_portal_partner || u.rol==='partner') ? 'badge-blue' : 'badge-green'" x-text="u.role?.name || u.rol"></span>
<span class="badge" :class="u.rol==='partner' ? 'badge-blue' : 'badge-green'" x-text="u.rol"></span>
</td>
<td class="px-4 py-3 text-slate-500 text-xs">
<template x-if="!(u.role?.es_portal_partner || u.rol==='partner') && u.cliente">
<template x-if="u.rol==='cliente' && u.cliente">
<span x-text="u.cliente?.empresa || u.cliente?.nombre"></span>
</template>
<template x-if="u.role?.es_portal_partner || u.rol==='partner'">
<template x-if="u.rol==='partner'">
<div class="flex flex-wrap gap-1">
<template x-for="acc in (u.portal_accesos||[])" :key="acc.ID">
<span class="bg-slate-100 px-2 py-0.5 rounded text-xs flex items-center gap-1">
@@ -67,9 +58,6 @@
<button @click="openEdit(u)" class="btn-icon text-yellow-500" title="Editar">
<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="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/></svg>
</button>
<button @click="openSendCredentials(u)" class="btn-icon text-blue-500" title="Enviar credenciales">
<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="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"/></svg>
</button>
<button @click="confirmDelete(u)" class="btn-icon text-red-500" title="Eliminar">
<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="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/></svg>
</button>
@@ -94,16 +82,12 @@
</div>
<div>
<label class="label">Rol</label>
<select x-model.number="form.role_id" class="input-field w-full">
<option value="">Sin rol asignado</option>
<template x-for="r in portalRoles" :key="r.ID">
<option :value="r.ID">
<span x-text="r.name + (r.es_portal_partner ? ' (Partner)' : ' (Cliente)')"></span>
</option>
</template>
<select x-model="form.rol" class="input-field w-full">
<option value="cliente">Cliente</option>
<option value="partner">Partner</option>
</select>
</div>
<div x-show="portalRoles.find(r => r.ID === form.role_id)?.es_portal_cliente">
<div x-show="form.rol==='cliente'">
<label class="label">Cliente asignado</label>
<select x-model.number="form.cliente_id" class="input-field w-full">
<option value="">Sin asignar</option>
@@ -157,34 +141,16 @@
</div>
</div>
<!-- Modal enviar credenciales -->
<div x-show="showCredModal" x-cloak class="fixed inset-0 z-50 flex items-center justify-center bg-black/40">
<div @click.outside="showCredModal=false" class="bg-white rounded-2xl shadow-2xl w-full max-w-sm mx-4 p-6">
<h2 class="text-lg font-bold mb-1">Enviar credenciales</h2>
<p class="text-slate-500 text-sm mb-4">Se enviará el correo con los datos de acceso al portal a <strong x-text="credEmail"></strong>.</p>
<div class="mb-4">
<label class="label">Contraseña (opcional — se muestra en el correo)</label>
<input x-model="credPassword" type="text" class="input-field w-full" placeholder="Dejar vacío para omitir la contraseña">
</div>
<p x-show="credMsg" x-text="credMsg" class="text-green-600 text-sm mb-3"></p>
<div class="flex justify-end gap-3">
<button @click="showCredModal=false" class="btn-secondary">Cancelar</button>
<button @click="doSendCredentials()" :disabled="saving" class="btn-primary" x-text="saving?'Enviando...':'Enviar correo'"></button>
</div>
</div>
</div>
</div>
<script>
function portalUsuariosApp() {
return {
items: [], clientes: [], portalRoles: [], loading: false, saving: false,
showModal: false, showDelete: false, showAccesoModal: false, showCredModal: false,
items: [], clientes: [], loading: false, saving: false,
showModal: false, showDelete: false, showAccesoModal: false,
editId: null, deleteId: null, error: '',
accesoUserId: null, accesoClienteId: '',
credUserId: null, credEmail: '', credPassword: '', credMsg: '',
form: { nombre:'', email:'', password:'', role_id:'', cliente_id:'', activo:true, notas:'' },
form: { nombre:'', email:'', password:'', rol:'cliente', cliente_id:'', activo:true, notas:'' },
async init() { await this.load(); },
@@ -194,25 +160,23 @@ function portalUsuariosApp() {
const r = await axios.get('/app/loadportalusuarios');
this.items = r.data.items || [];
this.clientes = r.data.clientes || [];
this.portalRoles = r.data.portalRoles || [];
} finally { this.loading = false; }
},
openCreate() {
this.editId=null; this.error='';
this.form={nombre:'',email:'',password:'',role_id:'',cliente_id:'',activo:true,notas:''};
this.form={nombre:'',email:'',password:'',rol:'cliente',cliente_id:'',activo:true,notas:''};
this.showModal=true;
},
openEdit(u) {
this.editId=u.ID; this.error='';
this.form={nombre:u.nombre,email:u.email,password:'',role_id:u.role_id||'',cliente_id:u.cliente_id||'',activo:u.activo,notas:u.notas||''};
this.form={nombre:u.nombre,email:u.email,password:'',rol:u.rol,cliente_id:u.cliente_id||'',activo:u.activo,notas:u.notas||''};
this.showModal=true;
},
async save() {
this.saving=true; this.error='';
const payload={...this.form};
if(payload.cliente_id==='') payload.cliente_id=null;
if(payload.role_id==='') payload.role_id=null;
try {
if(this.editId) await axios.put(`/app/portal-usuarios/${this.editId}`, payload);
else await axios.post('/app/portal-usuarios', payload);
@@ -237,20 +201,6 @@ function portalUsuariosApp() {
await axios.delete(`/app/portal-usuarios/${u.ID}/acceso/${clienteId}`);
await this.load();
},
openSendCredentials(u) {
this.credUserId=u.ID; this.credEmail=u.email; this.credPassword=''; this.credMsg='';
this.showCredModal=true;
},
async doSendCredentials() {
this.saving=true; this.credMsg='';
try {
const r = await axios.post(`/app/portal-usuarios/${this.credUserId}/send-credentials`, {password: this.credPassword});
this.credMsg = r.data.message || 'Correo enviado';
setTimeout(()=>{ this.showCredModal=false; }, 1800);
} catch(e) { this.credMsg = e.response?.data?.error || 'Error al enviar'; }
finally { this.saving=false; }
},
}
}
</script>
resources/views/proyecto_detalle.html
+2 -2
View File
@@ -8,10 +8,10 @@
<span class="w-4 h-4 rounded-full border" :style="`background:{{ .proyecto.Color }}`"></span>
<div>
<h1 class="text-xl font-bold text-slate-800">{{ .proyecto.Nombre }}</h1>
<p class="text-xs text-slate-400">{{ if .proyecto.Cliente }}{{ .proyecto.Cliente.RazonSocial }}{{ end }} &middot; slug: <code>{{ .proyecto.Slug }}</code></p>
<p class="text-xs text-slate-400">{{ if .proyecto.Cliente.Empresa }}{{ .proyecto.Cliente.Empresa }}{{ else if .proyecto.Cliente.Nombre }}{{ .proyecto.Cliente.Nombre }}{{ end }} &middot; slug: <code>{{ .proyecto.Slug }}</code></p>
</div>
<div class="ml-auto flex items-center gap-3">
<span class="badge" :class="`badge-${estadoColor('{{ .proyecto.Estado }}')}`">{{ .proyecto.Estado }}</span>
{{ if eq .proyecto.Estado "activo" }}<span class="badge badge-green">Activo</span>{{ else if eq .proyecto.Estado "pausado" }}<span class="badge badge-yellow">Pausado</span>{{ else if eq .proyecto.Estado "completado" }}<span class="badge badge-slate">Completado</span>{{ else }}<span class="badge badge-slate">{{ .proyecto.Estado }}</span>{{ end }}
<span class="text-sm text-slate-500">
<strong>{{ .proyecto.Progreso }}%</strong> completado
</span>