Files
sirpremiumv2/resources/views/livewire/show-usuarios.blade.php
T
Juan Felipe Duarte 85d18dc4ff Tarifas y promos por usuario (falta el editar en la vista de tarifas)
Introduces the subvendedor_id field to the tarifa_promos table and updates the TarifaPromo model accordingly. Refactors tarifas and promociones management in ShowTarifas and ShowUsuarios Livewire components, including utility calculation, validation, and UI improvements for managing both regular and promo tarifas.
2025-06-25 16:36:32 -07:00

892 lines
63 KiB
PHP
Executable File

<div x-data="{
add: @entangle('add'),
editar: @entangle('editar'),
modalSaldo: @entangle('modalSaldo'),
gestion: @entangle('gestion'),
gestionPromo: @entangle('gestionPromo'),
modalPassword: @entangle('modalPassword'),
modTarifas: @entangle('modTarifas'),
modalSaldoDesc: @entangle('modalSaldoDesc'),
editarTarifaRol: @entangle('editarTarifaRol')
}" class="h-full w-full md:my-2">
<div class="absolute backdrop-blur-sm bg-white/70 left-0 bottom-0 top-0 right-0 h-full z-40" wire:loading wire:target="gestionarPromociones,quitarSubvendedor,ponerSubvendedor,actualizarTarifaRol,addpromos,eliminarUsuarioPromo,gestionar,eliminarUsuarioTarifa,addtarifas,crear,actualizar,editar,eliminar,limpiarInputAdd,limpiarInputEdit,editarPassword,limpiarContra,confirmarNewPassword,saldo,addSaldo">
<div class="grid h-full place-items-center ">
<div class="max-w-xs">
<img src="./img/loading.gif" alt="" class="w-full text-center">
<p class="text-gray-500 text-center">Cargando</p>
</div>
</div>
</div>
<div class="bg-[#f5f5f5] md:w-full m-auto p-2 md:p-5 rounded-2xl relative mb-4">
<div class="grid grid-cols-1 text-center sm:flex justify-between my-2 items-center text-sm">
<div class="grid grid-cols-1 sm:flex items-center gap-4">
<div class="flex text-sm">
<x-icon-arrow-right />
Usuario
</div>
<div class="flex gap-4">
@if (auth()->user()->subvendedor || auth()->user()->rol->nombre === 'administrador' || auth()->user()->rol->nombre === 'editor' || auth()->user()->rol->nombre === 'super')
<a x-on:click="add = !add" class="justify-center flex px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8] mb-3 md:mb-0">Añadir
usuario
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="Capa_1" x="0px" y="0px" viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve" class="w-[0.87rem] ml-2">
<path d="M480,224H288V32c0-17.673-14.327-32-32-32s-32,14.327-32,32v192H32c-17.673,0-32,14.327-32,32s14.327,32,32,32h192v192 c0,17.673,14.327,32,32,32s32-14.327,32-32V288h192c17.673,0,32-14.327,32-32S497.673,224,480,224z" fill="#ffffff" />
</svg>
</a>
@endif
@if (auth()->user()->rol->nombre === 'super' || auth()->user()->rol->nombre === 'administrador')
<a x-on:click="modTarifas = true" class="justify-center flex px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8]">Mod.
tarifas promos
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" class="w-4 ml-2" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
<polygon points="14.604 5.687 0 20.29 0 24 3.71 24 18.313 9.396 14.604 5.687" fill="#ffffff" data-original="#000000" />
<path d="M23.232.768a2.624,2.624,0,0,0-3.71,0l-3.5,3.505,3.709,3.709,3.5-3.5A2.624,2.624,0,0,0,23.232.768Z" fill="#ffffff" data-original="#000000" />
</svg>
</a>
@endif
</div>
</div>
<div class="flex relative text-sm mx-auto w-64 md:w-auto my-2">
<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">
<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>
<div class="flex items-center">
<input id="verPreciosPersonalizados" type="checkbox" wire:model="verPreciosPersonalizados" class="h-4 w-4 text-[#B221FD] border-gray-300 rounded">
<label for="verPreciosPersonalizados" class="ml-2 block text-sm text-gray-900">
Precios personalizados
</label>
</div>
</div>
</div>
<x-ver-entrada />
{{-- -Tabla usuarios - --}}
<x-primary-table>
<x-slot name="thead">
<tr class="text-left">
<th class="rounded-l-lg font-normal">Nombre</th>
<th class="font-normal">Email</th>
<th class="font-normal">Rol</th>
<th class="font-normal">Ventas</th>
<th class="font-normal">Saldo</th>
<th class="font-normal">Precios personalizados</th>
@if (auth()->user()->rol->nombre == 'super')
<th class="font-normal"></th>
<th class="rounded-r-lg font-normal"></th>
@elseif (Auth::user()->subvendedor)
<th class="rounded-r-lg font-normal"></th>
@else
@endif
</tr>
</x-slot>
<x-slot name="tbody">
@foreach ($usuarios as $usuario)
<tr class="border-gray-200 text-left" x-data="{ openOption: false }">
<td>{{ $usuario->name ?? '' }}</td>
<td>{{ $usuario->email ?? '' }}</td>
<td>{{ $usuario->rol->nombre ?? '' }}</td>
<td>{{ $usuario->historiales_venta_count ?? '' }}</td>
@if (!empty($usuario->saldo->valor))
<td>{{ number_format($usuario->saldo->valor) ?? '' }}</td>
@else
<td></td>
@endif
<td>
<p>
<span>Tarifas: <span class="font-bold">{{ $usuario->countActiveTarifas() ?? 0 }}</span></span>,
<span>Promos: <span class="font-bold">{{ $usuario->countActivePromos() ?? 0 }}</span> </span>
</p>
</td>
@if (auth()->user()->rol->nombre == 'super')
<td>
<button wire:click="saldo({{ $usuario->id }})" class="justify-center text-sm flex px-2 py-1 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8] mb-0 md:mb-0">Recargar</button>
</td>
<td>
<button x-on:click="openOption=!openOption">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 cursor-pointer">
<path stroke-linecap="round" stroke-linejoin="round" d="M6.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM12.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM18.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0z" />
</svg>
</button>
<div x-cloak x-show="openOption" @click.away="openOption = false" class="sm:absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg right-10">
<button x-on:click="openOption=false" wire:click="editar({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Editar</button>
<button x-on:click="openOption=!openOption" wire:click="editarPassword({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Editar password</button>
<button x-on:click="openOption=false" wire:click="saldo({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Agregar saldo</button>
<button x-on:click="openOption=false" wire:click="saldodesc({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Descontar saldo</button>
<button x-on:click="openOption=false,gestion=true" wire:click="gestionar({{ $usuario->id }},'{{ $usuario->rol_id }}','{{ $usuario->name }}')" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Precio servicio</button>
<button x-on:click="openOption=false,gestionPromo=true" wire:click="gestionarPromociones({{ $usuario->id }},'{{ $usuario->name }}')" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Precio promocion</button>
<button x-on:click="openOption=false" wire:click="eliminar({{ $usuario->id }})" class="text-white w-full py-1 bg-red-400 rounded-b-[1rem] hover:bg-red-600 hover:rounded-b-[1rem]">Eliminar</button>
</div>
</td>
@elseif (Auth::user()->subvendedor)
<td>
<button x-on:click="openOption=!openOption">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6 cursor-pointer">
<path stroke-linecap="round" stroke-linejoin="round" d="M6.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM12.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0zM18.75 12a.75.75 0 11-1.5 0 .75.75 0 011.5 0z" />
</svg>
</button>
<div x-cloak x-show="openOption" @click.away="openOption = false" class="sm:absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg right-10">
<button x-on:click="openOption=false" wire:click="editar({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Editar</button>
<button x-on:click="openOption=!openOption" wire:click="editarPassword({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Editar password</button>
@if ($usuario->subvendedor)
<button x-on:click="openOption=!openOption" wire:click="quitarSubvendedor({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Quitar subvendedor</button>
@else
<button x-on:click="openOption=!openOption" wire:click="ponerSubvendedor({{ $usuario->id }})" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Habilitar subvendedor</button>
@endif
<button x-on:click="openOption=false,gestion=true" wire:click="gestionar({{ $usuario->id }},'{{ $usuario->rol_id }}','{{ $usuario->name }}')" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Precio servicio</button>
<button x-on:click="openOption=false,gestionPromo=true" wire:click="gestionarPromociones({{ $usuario->id }},'{{ $usuario->name }}')" class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300">Precio promocion</button>
<button x-on:click="openOption=false" wire:click="eliminar({{ $usuario->id }})" class="text-white w-full py-1 bg-red-400 rounded-b-[1rem] hover:bg-red-600 hover:rounded-b-[1rem]">Eliminar</button>
</div>
</td>
@else
@endif
</tr>
@endforeach
</x-slot>
<x-slot name="tlink">
{{ $usuarios->links() }}
</x-slot>
</x-primary-table>
{{-- Gestionar precios --}}
<div x-cloak x-show="gestion" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center ">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<p class="text-gray-500 mb-2"> Personalización de precios para {{ $usuario_nombre }} </p>
<div class="flex mb-4">
<input id="buscar_servicio" type="search" wire:model="buscar_servicio"
placeholder="Buscar servicio"
class="w-full md:w-auto shadow-md border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 rounded-[0.8rem] px-4 py-1 m-auto focus:border-neutral-300 focus:outline-none focus:shadow-outline">
</div>
<div>
<div class=" flex gap-4">
<div class="">
<select name="tarifas" id="tarifas" wire:model.debounce.500ms="tarifasGestion"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option value="" selected>Tarifas</option>
@if (!empty($consulta_tarifas))
@foreach ($consulta_tarifas as $consulta_tarifa)
@if ($consulta_tarifa->servicio && $consulta_tarifa->servicio->por_tiempo)
<option value="{{ $consulta_tarifa->id }}">
{{ $consulta_tarifa->servicio->nombre ?? '' }}: {{ $consulta_tarifa->dias ?? '' }} {{ $consulta_tarifa->dias == 1 ? 'día' : 'días' }}
</option>
@elseif ($consulta_tarifa->servicio)
<option value="{{ $consulta_tarifa->id }}">
{{ $consulta_tarifa->servicio->nombre ?? '' }}: {{ $consulta_tarifa->pantallas ?? '' }} {{ $consulta_tarifa->pantallas == 1 ? 'pantalla' : 'pantallas' }} - {{ $consulta_tarifa->dias ?? '' }} {{ $consulta_tarifa->dias == 1 ? 'día' : 'días' }}
</option>
@endif
@endforeach
@endif
</select>
</div>
<div class="w-[7rem]">
<input placeholder="$25000" type="number" id="precioTarifasGestion"
wire:model.debounce.500ms="precioTarifasGestion" min="0"
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="w-[5rem] self-center justify-self-center mx-auto">
<label class="text-gray-500 text-base">Ocultar</label>
<input type="checkbox" wire:model="estadoTarifa" checked
class="mx-auto p-2 rounded-full text-black">
</div>
</div>
{{ $estadoTarifa == 1 ? 'Ocultar' : 'Mostrar' }}
</div>
<div class="mb-3 mt-3 flex gap-4 justify-end items-center">
<p class="font-semibold text-gray-500">
Utilidad
</p>
@if (auth()->user()->rol->nombre === 'super' || auth()->user()->rol->nombre === 'administrador')
<input placeholder="$12000" type="number" id="utilidad" wire:model="utilidad" min="0" class="w-1/2 border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@else
<input disabled placeholder="$12000" type="number" id="utilidad" wire:model="utilidad" min="0" class="w-1/2 border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@endif
<span>
<button wire:click="addtarifas" type="button"
class="inline-flex justify-center w-full md:w-auto rounded-md border border-transparent px-4 py-1 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Añadir</button>
</span>
</div>
<table
class="w-full sm-w-[20rem] text-center mt-4 border-separate border-spacing-y-2 bg-white shadow-md rounded-lg mb-2">
<thead class="font-normal text-gray-500 h-9">
<tr class="text-left">
<th class="rounded-l-lg font-normal pl-[2rem]">Servicio</th>
<th class="font-normal pl-[2rem]">Plan</th>
<th class="font-normal pl-[2rem]">Oculto</th>
<th class="font-normal pl-[2rem]">Tarifa</th>
<th class="font-normal pl-[2rem]">Utilidad</th>
<th class="font-normal rounded-r-l pr-[2rem]"></th>
</tr>
</thead>
<tbody class="text-gray-400 select-none">
@if (!empty($consulta_usuarioTarifas))
@foreach ($consulta_usuarioTarifas as $usuarioTarifa)
<tr class="border-gray-200 text-left w-full pl-4">
<td class="pl-[2rem]">{{ $usuarioTarifa->tarifa->servicio->nombre ?? '' }}
</td>
<td class="pl-[2rem]">
@if ($usuarioTarifa->tarifa)
@if ($usuarioTarifa->tarifa->servicio && $usuarioTarifa->tarifa->servicio->por_tiempo)
{{ $usuarioTarifa->tarifa->dias ?? '' }}
{{ $usuarioTarifa->tarifa->dias == 1 ? 'día' : 'días' }}
@else
{{ $usuarioTarifa->tarifa->pantallas ?? '' }}
{{ $usuarioTarifa->tarifa->pantallas == 1 ? 'pantalla' : 'pantallas' }}
- {{ $usuarioTarifa->tarifa->dias ?? '' }}
{{ $usuarioTarifa->tarifa->dias == 1 ? 'día' : 'días' }}
@endif
@else
{{ 'Tarifa no disponible' }}
@endif
</td>
@if ($usuarioTarifa->visible !== 'true')
<td class="pl-[2rem] flex"><input type="checkbox" disabled readonly
checked class="mx-auto p-2 rounded-full text-black"></td>
@else
<td class="pl-[2rem] flex"><input type="checkbox" disabled readonly
class="mx-auto p-2 rounded-full text-black"></td>
@endif
<td class="pl-[2rem]">${{ $usuarioTarifa->precio ?? '' }}</td>
<td class="pl-[2rem]">${{ $usuarioTarifa->utilidad ?? '' }}</td>
<td class="pl-[1rem] pr-[1rem]">
<svg wire:click="eliminarUsuarioTarifa({{ $usuarioTarifa->id }})"
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-6 cursor-pointer" x="0"
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
xml:space="preserve">
<g>
<g id="Flat_Color" data-name="Flat Color">
<circle cx="12" cy="12" fill="#e63946" r="10"
data-original="#e63946" class="">
</circle>
<path
d="m13.41 12 2.3-2.29a1 1 0 0 0 -1.42-1.42l-2.29 2.3-2.29-2.3a1 1 0 0 0 -1.42 1.42l2.3 2.29-2.3 2.29a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l2.29-2.3 2.29 2.3a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42z"
fill="#edebea" data-original="#edebea" class="">
</path>
</g>
</g>
</svg>
</td>
</tr>
@endforeach
@endif
</tbody>
</table>
<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 wire:click="" type="button" x-on:click="gestion=false"
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>
</div>
</div>
{{-- Gestionar promocion --}}
<div x-cloak x-show="gestionPromo" 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 backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full z-20">
<div class="grid h-full place-items-center ">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<p class="text-gray-500 mb-2"> Personalización de precios para {{ $usuario_nombre }} </p>
<div class="flex mb-4">
<input id="buscar_promo" type="search" wire:model="buscar_promo"
placeholder="Buscar promocion"
class="w-full md:w-auto shadow-md border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 rounded-[0.8rem] px-4 py-1 m-auto focus:border-neutral-300 focus:outline-none focus:shadow-outline">
</div>
<div>
<div class=" flex gap-4">
<div class="">
<select name="promociones" id="promociones" wire:model.debounce.500ms="promoGestion"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option value="" selected>Promociones</option>
@if (!empty($consulta_promo))
@foreach ($consulta_promo as $promocion)
@if (!empty($promocion->nombre))
<option value="{{ $promocion->id }}">{{ $promocion->nombre ?? '' }}
</option>
@endif
@endforeach
@endif
</select>
</div>
<div class="w-[7rem]">
<input placeholder="$25000" type="number" id="precioPromoGestion"
wire:model="precioPromoGestion" min="0"
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="w-[5rem] self-center justify-self-center mx-auto">
<label class="text-gray-500 text-base">Ocultar</label>
<input type="checkbox" wire:model="estadoPromo" checked
class="mx-auto p-2 rounded-full text-black">
</div>
</div>
</div>
<div class="mb-3 mt-3 flex gap-4 justify-end items-center">
<p class="font-semibold text-gray-500">
Utilidad
</p>
@if (auth()->user()->rol->nombre === 'super' || auth()->user()->rol->nombre === 'administrador')
<input placeholder="$12000" type="number" id="utilidad" wire:model="utilidad" min="0" class="w-1/2 border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@else
<input disabled placeholder="$12000" type="number" id="utilidad" wire:model="utilidad" min="0" class="w-1/2 border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@endif
<span>
<button wire:click="addpromos" type="button"
class="inline-flex justify-center w-full md:w-auto rounded-md border border-transparent px-4 py-1 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Añadir</button>
</span>
</div>
<table
class="w-full sm-w-[20rem] text-center mt-4 border-separate border-spacing-y-2 bg-white shadow-md rounded-lg mb-2">
<thead class="font-normal text-gray-500 h-9">
<tr class="text-left">
<th class="rounded-l-lg font-normal pl-[2rem]">Promocion</th>
<th class="font-normal pl-[2rem]">Oculto</th>
<th class="font-normal pl-[2rem]">Precio</th>
<th class="font-normal pl-[2rem]">Utilidad</th>
<th class="font-normal rounded-r-l pr-[2rem]"></th>
</tr>
</thead>
<tbody class="text-gray-400 select-none">
@if (!empty($consulta_usuarioPromo))
@foreach ($consulta_usuarioPromo as $usuarioPromo)
<tr class="border-gray-200 text-left w-full pl-4">
<td class="pl-[2rem]">{{ $usuarioPromo->promocion->nombre ?? '' }}</td>
@if ($usuarioPromo->visible != 'true')
<td class="pl-[2rem] flex"><input type="checkbox" disabled readonly
checked class="mx-auto p-2 rounded-full text-black"></td>
@else
<td class="pl-[2rem] flex"><input type="checkbox" disabled readonly
class="mx-auto p-2 rounded-full text-black"></td>
@endif
<td class="pl-[2rem]">${{ $usuarioPromo->precio ?? '' }}</td>
<td class="pl-[2rem]">${{ $usuarioPromo->utilidad ?? '' }}</td>
<td class="pl-[1rem] pr-[1rem]">
<svg wire:click="eliminarUsuarioPromo({{ $usuarioPromo->id }})"
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-6 cursor-pointer" x="0"
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
xml:space="preserve">
<g>
<g id="Flat_Color" data-name="Flat Color">
<circle cx="12" cy="12" fill="#e63946" r="10"
data-original="#e63946" class="">
</circle>
<path
d="m13.41 12 2.3-2.29a1 1 0 0 0 -1.42-1.42l-2.29 2.3-2.29-2.3a1 1 0 0 0 -1.42 1.42l2.3 2.29-2.3 2.29a1 1 0 0 0 0 1.42 1 1 0 0 0 1.42 0l2.29-2.3 2.29 2.3a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.42z"
fill="#edebea" data-original="#edebea" class="">
</path>
</g>
</g>
</svg>
</td>
</tr>
@endforeach
@endif
</tbody>
</table>
<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 wire:click="" type="button" x-on:click="gestionPromo=false"
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>
</div>
</div>
{{-- Añadir usuario --}}
<div x-cloak x-show="add" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center ">
<form>
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="mb-4">
<label for="nombre" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
<input type="text" id="nombre" wire:model="nombre"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('nombre')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<div class="mb-4">
<label for="email" class="block text-gray-700 text-sm font-bold mb-2">Email:</label>
<input type="text" id="email" wire:model="email"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('email')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<div class="mb-4">
<label for="password"
class="block text-gray-700 text-sm font-bold mb-2">Contraseña:</label>
<input type="text" id="password" wire:model="password"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('password')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<div class="mb-4">
<label class="select-none text-gray-700 text-sm font-bold mb-2">Selecciona rol:</label>
<select name="estado_promocion" id="estado_promocion" wire:model="rol" class="w-full border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none ring-0 focus:ring-0 focus:border-neutral-300 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option selected>Rol</option>
@foreach ($roles as $rol)
<option value="{{ $rol->id }}">{{ $rol->nombre }}</option>
@endforeach
</select>
@error('rol')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<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 wire:click="crear" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Guardar</button>
</span>
<span>
<button wire:click="limpiarInputAdd" 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>
</form>
</div>
</div>
{{-- editar usuario --}}
<div x-cloak x-show="editar" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center ">
<form>
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="mb-4">
<label for="nombre_edit"
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
<input type="text" id="nombre_edit" wire:model="nombre_edit"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('nombre_edit')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<div class="mb-4">
<label for="email_edit" class="block text-gray-700 text-sm font-bold mb-2">Email:</label>
<input type="text" id="email_edit" wire:model="email_edit"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('email_edit')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<div class="mb-4">
<label class="select-none text-gray-700 text-sm font-bold mb-2">Selecciona rol:</label>
<select name="rol_edit" id="rol_edit" wire:model="rol_edit"
class="w-full border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none ring-0 focus:ring-0 focus:border-neutral-300 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option selected>Rol</option>
@foreach ($roles as $rol)
<option value="{{ $rol->id }}">{{ $rol->nombre }}</option>
@endforeach
</select>
@error('rol_edit')
<span class="text-red-400 text-sm ">Requerido*</span>
@enderror
</div>
<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 wire:click="actualizar" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Guardar</button>
</span>
<span>
<button wire:click="limpiarInputEdit" 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>
</form>
</div>
</div>
{{-- Modal contraseña --}}
<div x-cloak x-show="modalPassword" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="text-center bg-[#000029] text-white text-lg font-semibold rounded-lg py-2 mb-4">
Cambiar Contraseña
</div>
<div class="mb-4 mt-4">
<label for="newPassword" class="block text-gray-700 text-sm font-bold mb-2">Nueva
contraseña:</label>
<input type="text" id="newPassword" wire:model="newPassword"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:ring-0 focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
@error('newPassword')
<span class="error text-red-400">{{ 'Diligencie correctamente*' }}</span>
@enderror
</div>
<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 wire:click="confirmarNewPassword" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Guardar</button>
</span>
<span>
<button wire:click="limpiarContra" 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] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
</div>
</div>
{{-- Modal add saldo --}}
<div x-cloak x-show="modalSaldo" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="text-center bg-[#000029] text-white text-lg font-semibold rounded-lg py-2 mb-4">
Recargar saldo
</div>
<div class="text-center">
<div class="flex justify-center mb-4">
Saldo actual: $<p class="font-semibold">{{ number_format($saldo_actual) }}</p>
</div>
<div class="mt-2">
Monto a recargar
</div>
<div>
<input type="text" min="0" name="monto" wire:model="valor_recargar"
placeholder="$100.000" required
class="border-2 w-1/2 md:w-auto mb-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
oninput="formatInput(this)">
<div class="flex text-sm justify-center">Tu valor total seria: $<p>
@php
$valor_recargar = str_replace([',', '.'], '', $valor_recargar);
@endphp
@if (!empty($valor_recargar))
{{ number_format((int) $saldo_actual + (int) $valor_recargar) }}
@else
{{ number_format((int) $saldo_actual) }}
@endif
</p>
</div>
</div>
<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 wire:click="addSaldo" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Guardar</button>
</span>
<span>
<button wire:click="limpiarSaldo" x-on:click="modalSaldo=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] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
</div>
</div>
</div>
{{-- Modal quitar saldo --}}
<div x-cloak x-show="modalSaldoDesc" 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="absolute backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full">
<div class="grid h-full place-items-center">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="text-center bg-[#000029] text-white text-lg font-semibold rounded-lg py-2 mb-4">
Descontar saldo
</div>
<div class="text-center">
<div class="flex justify-center mb-4">
Saldo actual: $<p class="font-semibold">{{ number_format($saldo_actual) }}</p>
</div>
<div class="mt-2">
Monto a descontar
</div>
<div>
<input type="number" min="0" name="monto" wire:model="valor_recargar"
placeholder="$100.000" required
class="border-2 w-1/2 md:w-auto mb-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<div class="flex text-sm justify-center">Tu valor total seria: $<p>
{{ number_format((int) $saldo_actual - (int) $valor_recargar) }}
</p>
</div>
</div>
<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 wire:click="descontar" type="button"
class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Guardar</button>
</span>
<span>
<button wire:click="limpiarSaldo" x-on:click="modalSaldo=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] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
</div>
</div>
</div>
{{-- Modal tarifas --}}
<div x-cloak x-show="modTarifas" 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 backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full z-20">
<div class="grid h-full place-items-center">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
<div class="mb-4">
<select name="servicio" id="servicio" wire:model.debounce.500ms="servicio_modTarifas"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-[72%] sm:w-60 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option value="" selected>Promociones</option>
@foreach ($promo as $servicio)
<option value="{{ $servicio->id }}">{{ $servicio->nombre ?? '' }}</option>
@endforeach
</select>
</div>
<div class="grid grid-cols-3 gap-2 text-left">
<div class="w-full">
<label class="text-gray-500 text-sm">Rol</label>
<select name="roles" id="roles" wire:model.debounce.500ms="roles_modTarifas"
class="w-full border-2 border-neutral-200 rounded-lg focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option value="" selected>Roles</option>
@foreach ($roles as $rol)
<option value="{{ $rol->id }}">{{ $rol->nombre ?? '' }}</option>
@endforeach
</select>
</div>
<div class="w-full">
<label class="text-gray-500 text-sm">Precio</label>
<input type="number" id="precio_modTarifas" wire:model="precio_modTarifas"
min="0"
class="w-full border-2 border-neutral-200 rounded-lg focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="w-full">
<label class="text-gray-500 text-sm">Utilidad</label>
<input type="text" type="number" id="utilidad" wire:model="utilidad"
min="0"
class="w-full border-2 border-neutral-200 rounded-lg focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
</div>
<div class="mb-3 mt-3 flex gap-4 justify-end items-center">
<div class="flex m-auto items-center">
<label class="text-gray-500 text-sm mr-2">Activa</label>
<input type="checkbox" id="estadoTarifa" wire:model="estadoTarifa" checked
class="border-2 border-neutral-200 focus:ring-0 shadow apperance-none focus:border-neutral-300 text-[#B221FD] leading-tight focus:outline-none focus:shadow-outline">
</div>
<span>
<button wire:click="updateTarifas" type="button"
class="inline-flex justify-center w-full md:w-auto rounded-md border border-transparent px-4 py-1 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Añadir</button>
</span>
</div>
<div class="overflow-y-auto max-h-48">
<table class="w-full sm-w-[20rem] text-center mt-4 border-separate border-spacing-y-2 mb-4">
<thead class="font-normal bg-[#000029] text-white h-9">
<tr class="text-left">
<th class="rounded-l-lg font-normal pl-[1rem]">Estado</th>
<th class="font-normal pl-[1rem]">Rol</th>
<th class="font-normal pl-[1rem]">Valor</th>
<th class="font-normal pl-[1rem]">Utilidad</th>
<th class="font-normal pl-[1rem]"></th>
<th class="rounded-r-lg font-normal w-[1rem]"></th>
</tr>
</thead>
<tbody class="text-gray-500 select-none">
@if (!empty($tarifas))
@foreach ($tarifas as $tarifa)
<tr class="border-gray-200 text-left w-full pl-4">
<td class="pl-[1rem]">
@if ($tarifa->visible == 'activo')
<div class="bg-green-500 rounded-full w-3 h-3"></div>
@else
<div class="bg-red-500 rounded-full w-3 h-3"></div>
@endif
</td>
<td class="pl-[1rem]">{{ $tarifa->rol->nombre ?? '' }}</td>
<td class="pl-[1rem]">{{ number_format($tarifa->precio) ?? 0 }}</td>
<td class="pl-[1rem]">{{ number_format($tarifa->utilidad) ?? 0 }}</td>
<td class="pl-[1rem]">
<button wire:click="editarTarifa({{ $tarifa }})"
class="justify-center flex px-3 py-2 rounded-lg text-xs cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8]">Editar</button>
</td>
</tr>
@endforeach
@endif
</tbody>
</table>
</div>
<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="modTarifas=false" wire:click="" 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] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
</div>
</div>
<div x-cloak x-show="editarTarifaRol" 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 backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full z-20">
<div class="grid h-full place-items-center">
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
@if ($informacionTarifaRol)
<div>
<label class="block text-gray-700 text-sm font-bold mb-2">Pantallas:</label>
<div class="grid grid-cols-3 gap-2 text-left mb-4">
<div class="w-[6rem]">
<label class="text-gray-500 text-sm">Rol</label>
<select name="roles" id="roles"
wire:model.debounce.500ms="roles_modTarifas"
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
<option value="" selected>Roles</option>
@foreach ($roles as $rol)
<option value="{{ $rol->id }}">{{ $rol->nombre ?? '' }}</option>
@endforeach
</select>
</div>
<div class="w-[6rem]">
<label class="text-gray-500 text-sm">Precio</label>
<input type="number" id="precio_modTarifas" wire:model="precio_modTarifas"
min="0"
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="w-[6rem]">
<label class="text-gray-500 text-sm">Utilidad</label>
<input type="number" id="utilidad" wire:model="utilidad" min="0"
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 pl-2 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
</div>
</div>
<div class="mb-4 grid grid-cols-2">
<div class="flex m-auto items-center">
<label class="text-gray-500 text-sm mr-2">Activa</label>
<input type="checkbox" id="estadoTarifa" wire:model="estadoTarifa"
class="border-2 border-neutral-200 focus:ring-0 shadow apperance-none focus:border-neutral-300 text-[#B221FD] leading-tight focus:outline-none focus:shadow-outline">
</div>
<div class="mb-3 mt-3 flex justify-end">
<span>
<button wire:click="actualizarTarifaRol('{{ $informacionTarifaRol['id'] }}')"
type="button"
class="inline-flex justify-center w-full md:w-auto rounded-md border border-transparent px-4 py-1 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Actualizar</button>
</span>
</div>
</div>
</div>
@endif
<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="editarTarifaRol=false" wire:click="" 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] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
</span>
</div>
</div>
</div>
</div>
</div>
<script>
function formatInput(input) {
let unformattedValue = input.value.replace(/\D/g, '');
let formattedValue = unformattedValue.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
input.value = formattedValue;
}
</script>
</div>