usite-sas-bic/sirpremiumv2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor navigation layout and improve UI styles

Browse Source 
Reworked the sidebar navigation in navigation.blade.php to use a modern aside element with improved styling, transitions, and responsive menu items. Updated app.blade.php to simplify layout structure and move Alpine.js script. Adjusted font sizes in ver-entrada.blade.php for better responsiveness. Minor whitespace and formatting improvements in nav.blade.php.
This commit is contained in:
Juan Felipe Duarte
2025-09-22 13:23:49 -05:00
parent 75bffed0bb
commit 2a5c655d1e
6 changed files with 488 additions and 306 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/views/livewire/show-clientes.blade.php
+172 -93
View File
@@ -1,4 +1,4 @@
<div x-data="{ verCliente: @entangle('verCliente'), vencidosHoy: @entangle('vencidosHoy') }" class="h-full w-full md:my-2">
<div x-data="{ verCliente: @entangle('verCliente'), vencidosHoy: @entangle('vencidosHoy') }" class="h-full w-full lg:my-2">
<div class=" fixed backdrop-blur-sm bg-white/70 left-0 bottom-0 top-0 right-0 h-full z-40" wire:loading
wire:target="verCliente,enviarNotificacion,renovar">
<div class="grid h-full place-items-center">
@@ -11,15 +11,21 @@
{{-- Buscador --}}
<div
class="bg-[#f5f5f5] m-auto p-2 md:p-5 w-auto x-auto grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 xl:mx-10 mb-8 ">
<div class="md:flex justify-center my-2 items-center text-center ">
<div class="flex text-sm">
<x-icon-arrow-right />
Clientes
class="bg-[#f5f5f5] m-auto p-2 lg:p-5 w-auto x-auto grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 xl:mx-10 mb-8 ">
<div class="lg:flex justify-center my-2 items-center text-center ">
<div class="flex text-sm justify-between">
<div class="flex flex-1 lg:flex-auto">
<x-icon-arrow-right />
Clientes
</div>
<div class="text-sm mr-auto lg:hidden">
<label for="cbox2">Vencidos Hoy</label>
<input type="checkbox" name="" id="cbox2" wire:model="venceHoy">
</div>
</div>
<div class="flex relative text-sm mx-auto w-64 md:w-auto my-2">
<div class="relative text-sm mx-auto w-64 lg:w-auto my-2 hidden lg:flex">
<input id="buscar" type="search" wire:model="buscar" placeholder="Buscar"
class=" shadow-sm border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 w-64 md:w-auto rounded-md pr-7 py-1 m-auto focus:border-neutral-300 focus:outline-none focus:shadow-outline">
class=" shadow-sm border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 w-64 lg:w-auto rounded-md pr-7 py-1 m-auto focus:border-neutral-300 focus:outline-none focus:shadow-outline">
<svg class="w-5 absolute top-2 right-3" xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" class="w-4 absolute"
x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512;rotate: 90deg;"
@@ -33,25 +39,38 @@
</g>
</svg>
</div>
<div class="text-sm mr-auto ">
<div class="text-sm mr-auto hidden lg:block">
<label for="cbox2">Vencidos Hoy</label>
<input type="checkbox" name="" id="cbox2" wire:model="venceHoy">
</div>
</div>
<x-ver-entrada />
<div class="flex justify-between">
<x-ver-entrada />
<div class="relative text-sm max-w-[200px] lg:w-auto my-2 flex lg:hidden">
<input id="buscar" type="search" wire:model="buscar" placeholder="Buscar"
class=" shadow-sm border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 max-w-[200px] lg:w-auto rounded-md pr-7 py-1 m-auto focus:border-neutral-300 focus:outline-none focus:shadow-outline">
<svg class="w-5 absolute top-2 right-3" xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" class="w-4 absolute"
x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512;rotate: 90deg;"
xml:space="preserve" class="">
<g id="Layer_31" data-name="Layer 31">
<path
d="m21.71 20.29-5.4-5.39a7.92 7.92 0 0 0 1.69-4.9 8 8 0 1 0 -8 8 7.92 7.92 0 0 0 4.9-1.69l5.39 5.4a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42zm-17.71-10.29a6 6 0 1 1 6 6 6 6 0 0 1 -6-6z"
fill="#b221fd" data-original="#000000" class=""></path>
</g>
</svg>
</div>
</div>
{{-- tabla clientes --}}
<x-primary-table>
<x-slot name="thead">
<tr class="table-row md:hidden text-left">
<th class="rounded-l-lg font-normal">Nombre</th>
<th class="font-normal">Usuario</th>
<th class="font-normal">Contraseña</th>
<th class="rounded-r-lg font-normal">Estado</th>
<tr class="table-row lg:hidden text-left">
<th class="rounded-l-lg font-normal">Usuario</th>
</tr>
<tr class="hidden md:table-row text-left">
<tr class="hidden lg:table-row text-left">
<th class="rounded-l-lg font-normal">Nombre</th>
<th class="font-normal">Usuario</th>
<th class="font-normal">Contraseña</th>
@@ -64,26 +83,82 @@
</x-slot>
<x-slot name="tbody">
@foreach ($clientes as $cliente)
<tr class="table-row md:hidden border-gray-200 text-left" x-data="{ extraInfo: false, openOption: false, isOpen1: false, isOpen2: false }">
<td @click="extraInfo = true">{{ $cliente->nombre_cliente ?? $cliente->cliente->name ?? '' }}</td>
<tr class="table-row lg:hidden border-gray-200 text-left" x-data="{ extraInfo: false, openOption: false, isOpen1: false, isOpen2: false }">
<td @click="extraInfo = true" class="relative">
@if (!empty($cliente->cuentas_obsoletas->unique()))
@foreach ($cliente->cuentas_obsoletas->unique() as $cuenta)
{{ $cuenta->correo }} <br>
@endforeach
@endif
@if (!empty($cliente->cuentas->unique()))
@foreach ($cliente->cuentas->unique() as $cuenta1)
{{ $cuenta1->correo }} <br>
@endforeach
@endif
<div class="flex justify-end">
<div
class="flex justify-center w-8 gap-2 items-center bg-[#B221FD] text-white fill-white px-2 py-1 rounded-md cursor-pointer">
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" viewBox="0 -960 960 960">
<path
d="M440-440H240q-17 0-28.5-11.5T200-480q0-17 11.5-28.5T240-520h200v-200q0-17 11.5-28.5T480-760q17 0 28.5 11.5T520-720v200h200q17 0 28.5 11.5T760-480q0 17-11.5 28.5T720-440H520v200q0 17-11.5 28.5T480-200q-17 0-28.5-11.5T440-240v-200Z" />
</svg>
<div class="flex justify-between items-start gap-2">
<div>
<p class="font-semibold">
{{ $cliente->nombre_cliente ?? ($cliente->cliente->name ?? '') }}
</p>
<p>
@if (!empty($cliente->cuentas_obsoletas->unique()))
@foreach ($cliente->cuentas_obsoletas->unique() as $cuenta)
{{ $cuenta->correo }} <br>
@endforeach
@endif
@if (!empty($cliente->cuentas->unique()))
@foreach ($cliente->cuentas->unique() as $cuenta1)
{{ $cuenta1->correo }} <br>
@endforeach
@endif
</p>
<p>
@if (!empty($cliente->tarifa->servicio))
<span class="font-semibold">{{ $cliente->tarifa->servicio->nombre }}</span>
/
@if ($cliente->tarifa->servicio->nombre != 'Spotify Premium' && $cliente->tarifa->servicio->nombre != 'Youtube Premium')
{{ $cliente->tarifa->pantallas }} Pantallas
@endif
@endif
@if (!empty($cliente->promocion_id))
{{ $cliente->promocion->nombre }}
@endif
</p>
</div>
<div class="flex justify-between gap-2">
<div>
<p class="font-semibold capitalize">
{{ $cliente->estado ?? '' }}
</p>
<p>
@php
$date1 = new DateTime(strtr(strval($fechaActual), '/', '-'));
$date2 = new DateTime(strtr(strval($cliente->fecha_final), '/', '-'));
@endphp
@if ($date1 < $date2)
@php
$diff = $date1->diff($date2);
echo $diff->days . ' dias';
@endphp
<span class="block">
restantes
</span>
@endif
@if ($date1 > $date2)
@php
echo 'Vencido';
@endphp
@endif
@if ($date1 == $date2)
@php
echo 'Vence hoy!!';
@endphp
@endif
</p>
</div>
<div class="flex justify-end items-start">
<div class="flex justify-center w-8 h-8 gap-2 items-center bg-[#B221FD] text-white fill-white px-2 py-1 rounded-full cursor-pointer">
<svg class="w-4" xmlns="http://www.w3.org/2000/svg"
viewBox="0 -960 960 960">
<path
d="M440-440H240q-17 0-28.5-11.5T200-480q0-17 11.5-28.5T240-520h200v-200q0-17 11.5-28.5T480-760q17 0 28.5 11.5T520-720v200h200q17 0 28.5 11.5T760-480q0 17-11.5 28.5T720-440H520v200q0 17-11.5 28.5T480-200q-17 0-28.5-11.5T440-240v-200Z" />
</svg>
</div>
</div>
</div>
</div>
<div x-cloak x-show="extraInfo" class="mt-2 mx-2 p-2 bg-gray-200 rounded-md shadow-md"
@@ -116,7 +191,7 @@
</p>
</div>
<div class="mb-2">
<p class="text-center font-semibold mb-1">Restante</p>
<p class="text-center font-semibold mb-1 capitalize">Restante</p>
<p
class="rounded-md font-medium text-center @if ($cliente->estado == 'activo') bg-green-500 text-white @endif @if ($cliente->estado == 'pendiente') bg-yellow-500 @endif">
@php
@@ -178,7 +253,8 @@
{{-- renovar --}}
@if (Auth::user()->saldo->valor >= $cliente->tarifa->valor)
<p class="hover:bg-gray-200"
wire:click="renovar({{ $cliente->id }})">Renovar</p>
wire:click="renovar({{ $cliente->id }})">
Renovar</p>
@else
<p
class="active:bg-red-500 active:text-white cursor-not-allowed">
@@ -209,25 +285,25 @@
d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm640-480L501-453q-5 3-10.5 4.5T480-447q-5 0-10.5-1.5T459-453L160-640v400h640v-400ZM480-520l320-200H160l320 200ZM160-640v10-59 1-32 32-.5 58.5-10 400-400Z" />
</svg>
</p>
@if(!empty($cliente->tarifa->servicio))
<p class="hover:bg-[#00be00] hover:text-white">
<a x-on:click="openOption=!openOption" target="_blank"
href="https://wa.me/57{{ $cliente->cliente->celular ?? '' }}?text=Hola *{{ $cliente->cliente->name ?? '' }}* tu servicio de *{{ $cliente->tarifa->servicio->nombre }} de {{ $cliente->tarifa->pantallas }} pantallas * vence el *{{ $cliente->fecha_final }}*"
class="flex justify-center items-center gap-2 w-full hover:fill-white fill-gray-500">Notificar
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:svgjs="http://svgjs.com/svgjs" class="w-4" x="0"
y="0" viewBox="0 0 682 682.66669"
style="enable-background:new 0 0 512 512"
xml:space="preserve">
<path
d="m544.386719 93.007812c-59.875-59.945312-139.503907-92.9726558-224.335938-93.007812-174.804687 0-317.070312 142.261719-317.140625 317.113281-.023437 55.894531 14.578125 110.457031 42.332032 158.550781l-44.992188 164.335938 168.121094-44.101562c46.324218 25.269531 98.476562 38.585937 151.550781 38.601562h.132813c174.785156 0 317.066406-142.273438 317.132812-317.132812.035156-84.742188-32.921875-164.417969-92.800781-224.359376zm-224.335938 487.933594h-.109375c-47.296875-.019531-93.683594-12.730468-134.160156-36.742187l-9.621094-5.714844-99.765625 26.171875 26.628907-97.269531-6.269532-9.972657c-26.386718-41.96875-40.320312-90.476562-40.296875-140.28125.054688-145.332031 118.304688-263.570312 263.699219-263.570312 70.40625.023438 136.589844 27.476562 186.355469 77.300781s77.15625 116.050781 77.132812 186.484375c-.0625 145.34375-118.304687 263.59375-263.59375 263.59375zm144.585938-197.417968c-7.921875-3.96875-46.882813-23.132813-54.148438-25.78125-7.257812-2.644532-12.546875-3.960938-17.824219 3.96875-5.285156 7.929687-20.46875 25.78125-25.09375 31.066406-4.625 5.289062-9.242187 5.953125-17.167968 1.984375-7.925782-3.964844-33.457032-12.335938-63.726563-39.332031-23.554687-21.011719-39.457031-46.960938-44.082031-54.890626-4.617188-7.9375-.039062-11.8125 3.476562-16.171874 8.578126-10.652344 17.167969-21.820313 19.808594-27.105469 2.644532-5.289063 1.320313-9.917969-.664062-13.882813-1.976563-3.964844-17.824219-42.96875-24.425782-58.839844-6.4375-15.445312-12.964843-13.359374-17.832031-13.601562-4.617187-.230469-9.902343-.277344-15.1875-.277344-5.28125 0-13.867187 1.980469-21.132812 9.917969-7.261719 7.933594-27.730469 27.101563-27.730469 66.105469s28.394531 76.683594 32.355469 81.972656c3.960937 5.289062 55.878906 85.328125 135.367187 119.648438 18.90625 8.171874 33.664063 13.042968 45.175782 16.695312 18.984374 6.03125 36.253906 5.179688 49.910156 3.140625 15.226562-2.277344 46.878906-19.171875 53.488281-37.679687 6.601563-18.511719 6.601563-34.375 4.617187-37.683594-1.976562-3.304688-7.261718-5.285156-15.183593-9.253906zm0 0"
fill-rule="evenodd" data-original="#000000"
class="">
</path>
</svg>
</a>
</p>
@if (!empty($cliente->tarifa->servicio))
<p class="hover:bg-[#00be00] hover:text-white">
<a x-on:click="openOption=!openOption" target="_blank"
href="https://wa.me/57{{ $cliente->cliente->celular ?? '' }}?text=Hola *{{ $cliente->cliente->name ?? '' }}* tu servicio de *{{ $cliente->tarifa->servicio->nombre }} de {{ $cliente->tarifa->pantallas }} pantallas * vence el *{{ $cliente->fecha_final }}*"
class="flex justify-center items-center gap-2 w-full hover:fill-white fill-gray-500">Notificar
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:svgjs="http://svgjs.com/svgjs" class="w-4"
x="0" y="0" viewBox="0 0 682 682.66669"
style="enable-background:new 0 0 512 512"
xml:space="preserve">
<path
d="m544.386719 93.007812c-59.875-59.945312-139.503907-92.9726558-224.335938-93.007812-174.804687 0-317.070312 142.261719-317.140625 317.113281-.023437 55.894531 14.578125 110.457031 42.332032 158.550781l-44.992188 164.335938 168.121094-44.101562c46.324218 25.269531 98.476562 38.585937 151.550781 38.601562h.132813c174.785156 0 317.066406-142.273438 317.132812-317.132812.035156-84.742188-32.921875-164.417969-92.800781-224.359376zm-224.335938 487.933594h-.109375c-47.296875-.019531-93.683594-12.730468-134.160156-36.742187l-9.621094-5.714844-99.765625 26.171875 26.628907-97.269531-6.269532-9.972657c-26.386718-41.96875-40.320312-90.476562-40.296875-140.28125.054688-145.332031 118.304688-263.570312 263.699219-263.570312 70.40625.023438 136.589844 27.476562 186.355469 77.300781s77.15625 116.050781 77.132812 186.484375c-.0625 145.34375-118.304687 263.59375-263.59375 263.59375zm144.585938-197.417968c-7.921875-3.96875-46.882813-23.132813-54.148438-25.78125-7.257812-2.644532-12.546875-3.960938-17.824219 3.96875-5.285156 7.929687-20.46875 25.78125-25.09375 31.066406-4.625 5.289062-9.242187 5.953125-17.167968 1.984375-7.925782-3.964844-33.457032-12.335938-63.726563-39.332031-23.554687-21.011719-39.457031-46.960938-44.082031-54.890626-4.617188-7.9375-.039062-11.8125 3.476562-16.171874 8.578126-10.652344 17.167969-21.820313 19.808594-27.105469 2.644532-5.289063 1.320313-9.917969-.664062-13.882813-1.976563-3.964844-17.824219-42.96875-24.425782-58.839844-6.4375-15.445312-12.964843-13.359374-17.832031-13.601562-4.617187-.230469-9.902343-.277344-15.1875-.277344-5.28125 0-13.867187 1.980469-21.132812 9.917969-7.261719 7.933594-27.730469 27.101563-27.730469 66.105469s28.394531 76.683594 32.355469 81.972656c3.960937 5.289062 55.878906 85.328125 135.367187 119.648438 18.90625 8.171874 33.664063 13.042968 45.175782 16.695312 18.984374 6.03125 36.253906 5.179688 49.910156 3.140625 15.226562-2.277344 46.878906-19.171875 53.488281-37.679687 6.601563-18.511719 6.601563-34.375 4.617187-37.683594-1.976562-3.304688-7.261718-5.285156-15.183593-9.253906zm0 0"
fill-rule="evenodd" data-original="#000000"
class="">
</path>
</svg>
</a>
</p>
@endif
<p class="hover:bg-gray-200 fill-gray-500 flex justify-center items-center gap-2"
wire:click="notSMS({{ $cliente->id }})">
@@ -264,7 +340,8 @@
{{-- renovar --}}
@if (Auth::user()->saldo->valor >= $cliente->tarifa->valor)
<p class="hover:bg-gray-200"
wire:click="renovar({{ $cliente->id }})">Renovar</p>
wire:click="renovar({{ $cliente->id }})">
Renovar</p>
@else
<p
class="active:bg-red-500 active:text-white cursor-not-allowed">
@@ -329,16 +406,11 @@
</div>
</div>
</td>
<td @click="extraInfo = true">{{ $this->consultaPassword($cliente->id) }}</td>
<td @click="extraInfo = true">
<p class="rounded-md font-medium text-center @if ($cliente->estado == 'activo') bg-green-500 text-white @endif @if ($cliente->estado == 'pendiente') bg-yellow-500 @endif">
{{ $cliente->estado ?? '' }}
</p>
</td>
{{-- <td @click="extraInfo = true">{{ $this->consultaPassword($cliente->id) }}</td> --}}
</tr>
<tr class="hidden md:table-row border-gray-200 text-left w-full" x-data="{ openOption: false, isOpen1: false, isOpen2: false }">
<td>{{ $cliente->nombre_cliente ?? $cliente->cliente->name ?? '' }}</td>
<tr class="hidden lg:table-row border-gray-200 text-left w-full" x-data="{ openOption: false, isOpen1: false, isOpen2: false }">
<td>{{ $cliente->nombre_cliente ?? ($cliente->cliente->name ?? '') }}</td>
<td>
@if (!empty($cliente->cuentas_obsoletas->unique()))
@@ -460,23 +532,25 @@
d="M160-160q-33 0-56.5-23.5T80-240v-480q0-33 23.5-56.5T160-800h640q33 0 56.5 23.5T880-720v480q0 33-23.5 56.5T800-160H160Zm640-480L501-453q-5 3-10.5 4.5T480-447q-5 0-10.5-1.5T459-453L160-640v400h640v-400ZM480-520l320-200H160l320 200ZM160-640v10-59 1-32 32-.5 58.5-10 400-400Z" />
</svg>
</p>
@if(!empty($cliente->tarifa->servicio))
<p class="hover:bg-[#00be00] hover:text-white">
<a x-on:click="openOption=!openOption" target="_blank"
href="https://wa.me/57{{ $cliente->cliente->celular ?? '' }}?text=Hola *{{ $cliente->cliente->name ?? '' }}* tu servicio de *{{ $cliente->tarifa->servicio->nombre }} de {{ $cliente->tarifa->pantallas }} pantallas * vence el *{{ $cliente->fecha_final }}*"
class="flex justify-center items-center gap-2 w-full hover:fill-white fill-gray-500">Notificar
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:svgjs="http://svgjs.com/svgjs" class="w-4" x="0" y="0"
viewBox="0 0 682 682.66669"
style="enable-background:new 0 0 512 512" xml:space="preserve">
<path
d="m544.386719 93.007812c-59.875-59.945312-139.503907-92.9726558-224.335938-93.007812-174.804687 0-317.070312 142.261719-317.140625 317.113281-.023437 55.894531 14.578125 110.457031 42.332032 158.550781l-44.992188 164.335938 168.121094-44.101562c46.324218 25.269531 98.476562 38.585937 151.550781 38.601562h.132813c174.785156 0 317.066406-142.273438 317.132812-317.132812.035156-84.742188-32.921875-164.417969-92.800781-224.359376zm-224.335938 487.933594h-.109375c-47.296875-.019531-93.683594-12.730468-134.160156-36.742187l-9.621094-5.714844-99.765625 26.171875 26.628907-97.269531-6.269532-9.972657c-26.386718-41.96875-40.320312-90.476562-40.296875-140.28125.054688-145.332031 118.304688-263.570312 263.699219-263.570312 70.40625.023438 136.589844 27.476562 186.355469 77.300781s77.15625 116.050781 77.132812 186.484375c-.0625 145.34375-118.304687 263.59375-263.59375 263.59375zm144.585938-197.417968c-7.921875-3.96875-46.882813-23.132813-54.148438-25.78125-7.257812-2.644532-12.546875-3.960938-17.824219 3.96875-5.285156 7.929687-20.46875 25.78125-25.09375 31.066406-4.625 5.289062-9.242187 5.953125-17.167968 1.984375-7.925782-3.964844-33.457032-12.335938-63.726563-39.332031-23.554687-21.011719-39.457031-46.960938-44.082031-54.890626-4.617188-7.9375-.039062-11.8125 3.476562-16.171874 8.578126-10.652344 17.167969-21.820313 19.808594-27.105469 2.644532-5.289063 1.320313-9.917969-.664062-13.882813-1.976563-3.964844-17.824219-42.96875-24.425782-58.839844-6.4375-15.445312-12.964843-13.359374-17.832031-13.601562-4.617187-.230469-9.902343-.277344-15.1875-.277344-5.28125 0-13.867187 1.980469-21.132812 9.917969-7.261719 7.933594-27.730469 27.101563-27.730469 66.105469s28.394531 76.683594 32.355469 81.972656c3.960937 5.289062 55.878906 85.328125 135.367187 119.648438 18.90625 8.171874 33.664063 13.042968 45.175782 16.695312 18.984374 6.03125 36.253906 5.179688 49.910156 3.140625 15.226562-2.277344 46.878906-19.171875 53.488281-37.679687 6.601563-18.511719 6.601563-34.375 4.617187-37.683594-1.976562-3.304688-7.261718-5.285156-15.183593-9.253906zm0 0"
fill-rule="evenodd" data-original="#000000" class="">
</path>
</svg>
</a>
</p>
@if (!empty($cliente->tarifa->servicio))
<p class="hover:bg-[#00be00] hover:text-white">
<a x-on:click="openOption=!openOption" target="_blank"
href="https://wa.me/57{{ $cliente->cliente->celular ?? '' }}?text=Hola *{{ $cliente->cliente->name ?? '' }}* tu servicio de *{{ $cliente->tarifa->servicio->nombre }} de {{ $cliente->tarifa->pantallas }} pantallas * vence el *{{ $cliente->fecha_final }}*"
class="flex justify-center items-center gap-2 w-full hover:fill-white fill-gray-500">Notificar
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:svgjs="http://svgjs.com/svgjs" class="w-4" x="0"
y="0" viewBox="0 0 682 682.66669"
style="enable-background:new 0 0 512 512"
xml:space="preserve">
<path
d="m544.386719 93.007812c-59.875-59.945312-139.503907-92.9726558-224.335938-93.007812-174.804687 0-317.070312 142.261719-317.140625 317.113281-.023437 55.894531 14.578125 110.457031 42.332032 158.550781l-44.992188 164.335938 168.121094-44.101562c46.324218 25.269531 98.476562 38.585937 151.550781 38.601562h.132813c174.785156 0 317.066406-142.273438 317.132812-317.132812.035156-84.742188-32.921875-164.417969-92.800781-224.359376zm-224.335938 487.933594h-.109375c-47.296875-.019531-93.683594-12.730468-134.160156-36.742187l-9.621094-5.714844-99.765625 26.171875 26.628907-97.269531-6.269532-9.972657c-26.386718-41.96875-40.320312-90.476562-40.296875-140.28125.054688-145.332031 118.304688-263.570312 263.699219-263.570312 70.40625.023438 136.589844 27.476562 186.355469 77.300781s77.15625 116.050781 77.132812 186.484375c-.0625 145.34375-118.304687 263.59375-263.59375 263.59375zm144.585938-197.417968c-7.921875-3.96875-46.882813-23.132813-54.148438-25.78125-7.257812-2.644532-12.546875-3.960938-17.824219 3.96875-5.285156 7.929687-20.46875 25.78125-25.09375 31.066406-4.625 5.289062-9.242187 5.953125-17.167968 1.984375-7.925782-3.964844-33.457032-12.335938-63.726563-39.332031-23.554687-21.011719-39.457031-46.960938-44.082031-54.890626-4.617188-7.9375-.039062-11.8125 3.476562-16.171874 8.578126-10.652344 17.167969-21.820313 19.808594-27.105469 2.644532-5.289063 1.320313-9.917969-.664062-13.882813-1.976563-3.964844-17.824219-42.96875-24.425782-58.839844-6.4375-15.445312-12.964843-13.359374-17.832031-13.601562-4.617187-.230469-9.902343-.277344-15.1875-.277344-5.28125 0-13.867187 1.980469-21.132812 9.917969-7.261719 7.933594-27.730469 27.101563-27.730469 66.105469s28.394531 76.683594 32.355469 81.972656c3.960937 5.289062 55.878906 85.328125 135.367187 119.648438 18.90625 8.171874 33.664063 13.042968 45.175782 16.695312 18.984374 6.03125 36.253906 5.179688 49.910156 3.140625 15.226562-2.277344 46.878906-19.171875 53.488281-37.679687 6.601563-18.511719 6.601563-34.375 4.617187-37.683594-1.976562-3.304688-7.261718-5.285156-15.183593-9.253906zm0 0"
fill-rule="evenodd" data-original="#000000"
class="">
</path>
</svg>
</a>
</p>
@endif
<p class="hover:bg-gray-200 fill-gray-500 flex justify-center items-center gap-2"
wire:click="notSMS({{ $cliente->id }})">
@@ -585,8 +659,7 @@
<div x-cloak x-show="verCliente" x-transition:enter="transition duration-350"
x-transition:enter-start="opacity-0 scale-100" x-transition:enter-end="opacity-100 scale-100"
x-transition:leave="transition duration-350" x-transition:leave-start="opacity-100 scale-100"
x-transition:leave-end="opacity-0 scale-100"
class="fixed inset-0 z-50 backdrop-blur-sm bg-black/20">
x-transition:leave-end="opacity-0 scale-100" class="fixed inset-0 z-50 backdrop-blur-sm bg-black/20">
<div class="grid h-full place-items-center ">
@if (!empty($consulta_historial))
@@ -683,7 +756,8 @@
</div>
<div class="mb-4">
<label for="ver_email" class="block text-gray-700 text-sm font-bold mb-2">Credenciales:</label>
<label for="ver_email"
class="block text-gray-700 text-sm font-bold mb-2">Credenciales:</label>
<p class="text-sm">
@foreach ($consulta_historial->cuentas->unique() as $cuenta)
<div class="py-2">
@@ -691,11 +765,14 @@
</div>
@foreach ($cuenta->perfil as $perfil)
@if ($consulta_historial->id == $perfil->historial_id)
- Perfil <span class="font-semibold text-gray-600">{{ $perfil->perfil }}</span>
- Perfil <span
class="font-semibold text-gray-600">{{ $perfil->perfil }}</span>
@endif
@endforeach
<div class="text-sm"><span class="font-semibold">Email: </span>{{ $cuenta->correo }}</div>
<div class="text-sm"><span class="font-semibold">Pass:</span> {{ $cuenta->password }}</div>
<div class="text-sm"><span class="font-semibold">Email:
</span>{{ $cuenta->correo }}</div>
<div class="text-sm"><span class="font-semibold">Pass:</span>
{{ $cuenta->password }}</div>
</div>
@endforeach
</p>
@@ -734,7 +811,8 @@
<div class="bg-white px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly gap-5 mt-4">
<span>
<button x-on:click="verCliente=false" type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 text-white bg-[#585858] hover:bg-[#3a3a3a] ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
<button x-on:click="verCliente=false" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 text-white bg-[#585858] hover:bg-[#3a3a3a] ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
@@ -761,7 +839,7 @@
<th class="rounded-l-lg font-normal w-1/3 pl-[1rem] sm:w-1/4 sm:pl-[1rem]">Nombre</th>
<th class="font-normal w-1/3 sm:w-1/4 pl-[1rem] sm:pl-[1rem] ">Fecha de Compra</th>
<th class="font-normal w-1/3 sm:w-1/4 pl-[1rem] sm:pl-[1rem]">Servicio</th>
<th class="font-normal pl-[1rem] sm:pl-[2rem] sm:w-1/4 hidden md:inline-table"></th>
<th class="font-normal pl-[1rem] sm:pl-[2rem] sm:w-1/4 hidden lg:inline-table"></th>
<th class="rounded-r-lg font-normal"></th>
</tr>
</thead>
@@ -789,7 +867,7 @@
@endif
@if (!empty($h->tarifa_id))
<td class="hidden md:inline-table w-[1rem]">
<td class="hidden lg:inline-table w-[1rem]">
<button
class="flex m-auto gap-2 items-center bg-[#B221FD] text-white px-4 py-1 rounded-lg"
wire:click="enviarNotificacion({{ $h->id }})">Notificar
@@ -807,8 +885,9 @@
</button>
</td>
@elseif(!empty($h->promocion_id))
<td class="hidden md:inline-table w-[1rem]">
<button class="hidden md:flex m-auto gap-2 items-center bg-[#B221FD] text-white px-4 py-1 rounded-lg"
<td class="hidden lg:inline-table w-[1rem]">
<button
class="hidden lg:flex m-auto gap-2 items-center bg-[#B221FD] text-white px-4 py-1 rounded-lg"
wire:click="enviarNotificacionPromo({{ $h->id }})">Notificar
<svg xmlns="http://www.w3.org/2000/svg" version="1.1"
xmlns:xlink="http://www.w3.org/1999/xlink"