Initial commit
This commit is contained in:
@@ -0,0 +1,27 @@
|
||||
<div>
|
||||
<div class="text-center ">
|
||||
<div class="my-4 text-gray-400 font-semibold">
|
||||
Añadir cuentas por volumen
|
||||
</div>
|
||||
<form wire:submit.prevent="import">
|
||||
|
||||
<label for="archivo">Selecciona un archivo XLS:</label> <br>
|
||||
<input type="file" id="archivo" name="archivo" accept=".xlsx" wire:model="photo">
|
||||
<br>
|
||||
|
||||
@error('photo') <span class="error">{{ $message }}</span> @enderror
|
||||
|
||||
@if ($photo)
|
||||
|
||||
<img src="/img/xls.png" class="w-24 mx-auto">
|
||||
<p class="text-green-500">Archivo cargado</p>
|
||||
<button type="submit"class=" my-4 inline-flex justify-center 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">Importar datos</button>
|
||||
@endif
|
||||
|
||||
@if ($importado== 'true')
|
||||
<div class="text-green-600 fonto-semibold my-4">Cuentas importadas correctamente!!</div>
|
||||
@endif
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,39 @@
|
||||
<div>
|
||||
<div class=" text-center">
|
||||
<div class="flex w-11/12 align-middle">
|
||||
<input type="text" placeholder="Buscar" wire:model="buscar" class="mx-auto text-center rounded my-4">
|
||||
<label for="aprobado" class="my-1 align-middle px-1">Aprobados</label>
|
||||
<input type="checkbox" id="aprobado" wire:model="aprobado" class="my-1 align-middle px-1">
|
||||
</div>
|
||||
|
||||
|
||||
<table class="text-center w-11/12 mx-auto">
|
||||
<tr class="border text-left">
|
||||
<th>Compra</th>
|
||||
<th>Usuario</th>
|
||||
<th>Email</th>
|
||||
<th>Valor pagado</th>
|
||||
<th>Estado</th>
|
||||
<th>Saldo</th>
|
||||
</tr>
|
||||
@foreach($historial_recargas as $item)
|
||||
|
||||
<tr class="border hover:bg-gray-200 hover:ring-gray-500 text-left text-sm" >
|
||||
<td>{{\Carbon\Carbon::parse($item->created_at)->format('y/m/d h:i a')}}</td>
|
||||
<td>{{$item->usuario->name}}</td>
|
||||
<td>{{$item->usuario->email}}</td>
|
||||
<td>{{$item->monto}}</td>
|
||||
<td>{{$item->status}}</td>
|
||||
<td>{{$item->valor_recarga}}</td>
|
||||
|
||||
</tr>
|
||||
|
||||
@endforeach
|
||||
|
||||
</table>
|
||||
<div class="mx-10">
|
||||
{{ $historial_recargas->links( )}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,327 @@
|
||||
<div x-data="{
|
||||
newCategoria: @entangle('newCategoria'),
|
||||
newPromocion: @entangle('newPromocion'),
|
||||
modalComprarPromo: @entangle('modalComprarPromo'),
|
||||
verPromo: @entangle('verPromo'),
|
||||
editarPromo: @entangle('editarPromo'),
|
||||
credenciales : @entangle('credenciales'),
|
||||
copiar:''
|
||||
}" class="h-full w-full md:my-4">
|
||||
|
||||
<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="verPromocion,comprarPromo,editarPromo,editarPromoUpdate,comprar,pagar,create_newCategoria,add_tarifa,del_item,guardar,eliminar">
|
||||
<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-[95%] m-auto p-2 md:p-5 rounded-[1.2rem] border-b border-gray-200 shadow-md overflow-y-auto relative h-[95%] sm:h-[95%]">
|
||||
|
||||
<div class="flex justify-between my-2 items-center mb-8 scroll">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Promociones
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class=" gap-2 hidden sm:flex">
|
||||
<select name="categoria_id" id="categoria_id" wire:model.debounce.500ms="categoria_id"
|
||||
class="w-[8rem] 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 value="" selected>Categoria</option>
|
||||
@foreach ($categorias as $categoria)
|
||||
<option value="{{ $categoria->id }}">{{ $categoria->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div>
|
||||
<button x-on:click="newCategoria=true" x-transition.duration.300ms
|
||||
class="w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div>
|
||||
<div class="grid sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-4 py-2 px-4">
|
||||
|
||||
@foreach ($promociones as $promocion)
|
||||
<div class="select-none bg-white shadow-md transition hover:scale-[1.05] hover:shadow-xl cursor-pointer rounded-lg text-center relative object-cover "
|
||||
x-data="{ openOption: false }">
|
||||
<svg x-on:click="openOption=!openOption" 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 absolute right-2 cursor-pointer">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" class="text-white shadow"
|
||||
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>
|
||||
|
||||
<div wire:click="verPromocion({{$promocion->id}})" class="">
|
||||
<img src="{{ asset($promocion->img_publicidad) }}" alt="" class="w-full m-auto rounded-lg object-cover h-24 sm:h-44 object-center shadow">
|
||||
</div>
|
||||
|
||||
<div x-cloak x-show="openOption"
|
||||
class="absolute bg-white text-center w-[7rem] top-5 right-[-1rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
<button x-on:click="openOption=!openOption,ver=true" wire:click="comprarPromo({{ $promocion->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Comprar</button>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
{{-- Modal ver promno --}}
|
||||
<div x-cloak x-show="verPromo" 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 rounded-lg shadow-md sm:1/2 md:1/3 lg:1/3 xl:w-1/4">
|
||||
{{-- PHOTO --}}
|
||||
<div class="w-full text-left text-white px-4 bg-cover py-2 rounded-lg h-64 bg-[url({{asset($this->imagen)}})] ">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="text-left">
|
||||
|
||||
<div class="mx-8">
|
||||
<div class="mt-4 grid grid-cols-2 mb-4 items-center">
|
||||
<div>
|
||||
<h1 class="text-left font-bold text-lg">{{$nombrePromo}}</h1>
|
||||
</div>
|
||||
<div class="justify-self-end">
|
||||
<h1 class="flex gap-2 items-center font-bold"> <p> ${{number_format($precioAhora)}}</p></h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm text-gray-500">
|
||||
<p>{{$descripcionPromo}}</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-2 mb-3">
|
||||
<span>
|
||||
<button x-on:click ="modalComprarPromo=true,verPromo=false" 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 sm-text-sm sm-leading-5">Comprar</button>
|
||||
</span>
|
||||
<span>
|
||||
<button x-on:click="verPromo=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- Modal comprar promno --}}
|
||||
<div x-cloak x-show="modalComprarPromo" 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 rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
<div class="w-full Text-left text-white px-4 bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500 py-2 rounded-lg">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
{{$nombrePromo}}
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{$dias}} Dias
|
||||
</p>
|
||||
<p>
|
||||
${{number_format($precioAhora)}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<p>
|
||||
Información del cliente:
|
||||
</p>
|
||||
<p class="text-xs text-gray-400">
|
||||
Ingrese los datos del cliente final.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="mb-4">
|
||||
<label for="nombre_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_comprarPromo" wire:model="nombre_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('nombre_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="celular_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Celular:</label>
|
||||
<input type="text" id="celular_comprarPromo" wire:model="celular_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('celular_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="mb-4">
|
||||
<label for="email_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">E-mail:</label>
|
||||
<input type="email" id="email_comprarPromo" wire:model="email_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('email_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="cantidad_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Cantidad:</label>
|
||||
<input type="number" id="cantidad_comprarPromo" min="1" wire:model="cantidad_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-1/2 py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('cantidad_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<p class="text-xs text-gray-400">
|
||||
Este servicio vencerá el {{$fechaFinal}} en {{$dias_comprarPromo}} Dias
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<div class="border-2 flex text-gray-400 text-xs text-center justify-center gap-2 py-3 rounded-lg md:mx-3 2xl:mx-6">
|
||||
Pagara el valor de ${{number_format($total=((int)$precioAhora*(int)$cantidad_comprarPromo))}} <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 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z" fill="#9f9f9f" data-original="#000000"></path><path d="M12,5a1,1,0,0,0-1,1v8a1,1,0,0,0,2,0V6A1,1,0,0,0,12,5Z" fill="#9f9f9f" data-original="#000000"></path><rect x="11" y="17" width="2" height="2" rx="1" fill="#9f9f9f" data-original="#000000"></rect></g></svg>
|
||||
</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="pagar" 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 sm-text-sm sm-leading-5" >Comprar</button>
|
||||
</span>
|
||||
<span>
|
||||
<button x-on:click="modalComprarPromo=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal credenciales --}}
|
||||
<div x-cloak x-show="credenciales"
|
||||
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 rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
<div class="w-full Text-left text-white px-4 py-2 rounded-lg"
|
||||
style="background: rgb(0,0,0);
|
||||
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, , rgba(20,20,20,1) 100%);">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
{{$this->nombrePromo}}
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{$this->dias }} Dias
|
||||
</p>
|
||||
<p>
|
||||
${{number_format($this->precioAhora)}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<div>
|
||||
<p>
|
||||
Información de cuentas:
|
||||
</p>
|
||||
</div>
|
||||
<div class="text-xs text-gray-400">
|
||||
@php
|
||||
$n=0;
|
||||
@endphp
|
||||
|
||||
@if ($cuentas)
|
||||
@foreach ($cuentas->cuentas->unique() as $cuenta)
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
|
||||
<div class="shadow-md rounded-lg py-3 px-6 mx-8 flex " >
|
||||
<div>
|
||||
<div class="font-semibold text-gray-700">{{ $cuenta->servicio->nombre }} :</div>
|
||||
<h1 class="mt-4">
|
||||
Usuario: <p class="font-semibold text-gray-600">{{ $cuenta->correo }}</p>
|
||||
</h1>
|
||||
<h1 class="mt-4">
|
||||
Contraseña: <p class="font-semibold text-gray-600">{{ $cuenta->password }}
|
||||
</p>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<button class="" onclick="copiarAlPortapapeles({{$n}})"><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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="hidden" id="{{$n}}">{{ $cuenta->servicio->nombre }} - email: {{ $cuenta->correo }} - Pass: {{ $cuenta->password }}</p>
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
|
||||
<h1 class="flex mt-4 gap-1">
|
||||
Este servicio vencerá el <p class="font-semibold text-gray-600">
|
||||
{{ $cuentas->fecha_final ?? '' }}.</p>
|
||||
</h1>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
</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 x-on:click="credenciales=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
|
||||
function copiarAlPortapapeles(id_elemento) {
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", document.getElementById(id_elemento).innerHTML);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(aux);
|
||||
}
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,10 @@
|
||||
<div class="w-full bg-gray-100 ">
|
||||
<div>
|
||||
<!-- slider -->
|
||||
<div class="">
|
||||
@include('components.slider')
|
||||
</div>
|
||||
<!-- servicios -->
|
||||
<livewire:show-index />
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div>
|
||||
Admin
|
||||
</div>
|
||||
@@ -0,0 +1,175 @@
|
||||
<div x-data="{
|
||||
nuevaCategoria: @entangle('nuevaCategoria'),
|
||||
editarCategoria: @entangle('editarCategoria')
|
||||
}" class="h-full w-full md: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="create,delete,update,editar">
|
||||
<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-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
<div class="flex justify-between my-2 items-center">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z" fill="#b221fd" data-original="#000000"/></g></svg>
|
||||
Categorias
|
||||
</div>
|
||||
<a x-on:click="nuevaCategoria=true" class="flex px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8]"><p class="text-sm md:text-base">Nueva categoria</p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mt-2">
|
||||
<h1 class="text-center text-lg sm:mb-4">Categorias</h1>
|
||||
<div class="py-2">
|
||||
{{------Tabla de categorias -----}}
|
||||
<table class="text-center rounded-lg shadow-lg m-auto mt-4 mb-4 bg-white md:max-w-xl">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9 pr-4 sm:pr-2">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal w-1/3 sm:w-1/5 pl-[1rem] md:pl-[2rem]">Imagen</th>
|
||||
<th class="font-normal sm:w-1/5 sm:pl-[2rem]">Nombre</th>
|
||||
<th class="font-normal sm:w-1/5 sm:pl-[2rem]">Descripcion</th>
|
||||
<th class="rounded-r-lg font-normal pr-[1rem] pl-[1rem] sm:pr-[2rem] sm:pl-[2rem] w-1/3"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none pr-4 sm:pr-2">
|
||||
@foreach($categorias as $categoria)
|
||||
<tr class="border-gray-200 text-left w-full sm:pl-4 " x-data="{openOption:false}">
|
||||
<td class="sm:pl-[2rem] w-full py-2">
|
||||
<img src="{{asset($categoria->imagen)}}" class=" w-24 sm:w-28 m-auto rounded-lg object-cover h-12 sm:h-14 object-center shadow" alt="">
|
||||
</td>
|
||||
<td class="sm:pl-[2rem]">
|
||||
{{$categoria->nombre}}
|
||||
</td>
|
||||
<td class="sm:pl-[2rem] text-ellipsis">
|
||||
{{$categoria->descripcion}}
|
||||
</td>
|
||||
<td class="md:pl-[2rem] md:pr-[2rem]">
|
||||
<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="right-0 sm:right-auto absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
<button x-on:click="openOption=false,editarCategoria = true" wire:click="editar({{$categoria->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=false" wire:click="delete({{$categoria->id}})" class="text-white w-full py-1 bg-[#ff5050] rounded-b-[1rem] hover:bg-[#fd2828] hover:rounded-b-[1rem]">Eliminar</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal agregar categoria --}}
|
||||
<div x-cloak x-show="nuevaCategoria"
|
||||
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 ">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir img</label>
|
||||
<input type="file" id="imagen" wire:model="photo" class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt="" class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<div class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20"></div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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="descripcion" class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion" wire:model="descripcion" 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"></textarea>
|
||||
</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="create" 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 x-on:click="nuevaCategoria=false" wire:click="limpiarInputCategoria" 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 editar categoria --}}
|
||||
<div x-cloak x-show="editarCategoria"
|
||||
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 ">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir img</label>
|
||||
<input type="file" id="imagen" wire:model="photo" class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt="" class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<img src="{{$img}}" alt="" class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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="descripcion" class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion" wire:model="descripcion" 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"></textarea>
|
||||
</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="update" 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 x-on:click="editarCategoria=false" wire:click="limpiarInputCategoria" 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>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,574 @@
|
||||
<div x-data="{ verCliente: @entangle('verCliente'), vencidosHoy: @entangle('vencidosHoy') }" class="h-full w-full md: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">
|
||||
<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>
|
||||
|
||||
{{-- Buscador --}}
|
||||
<div
|
||||
class="bg-[#f5f5f5] m-auto p-2 md:p-5 rounded-[1.2rem] w-auto mb-4 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">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Clientes
|
||||
</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-md border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 w-64 md:w-auto rounded-[0.8rem] 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>
|
||||
<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>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="text-sm mr-auto ">
|
||||
<label for="cbox2">Vencidos (Hace 5 días)</label>
|
||||
<input type="checkbox" name="" id="cbox2" wire:model="venceHoy">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{{-- tabla clientes --}}
|
||||
<div class="overflow-y-auto max-h-full overflow-x-auto w-full mx-auto text-sm">
|
||||
<table class="w-full text-center mt-4 border-separate border-spacing-y-2">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal w-1/8 pl-2 sm:w-1/8 ">Nombre</th>
|
||||
<th class="font-normal w-1/8 sm:w-1/8 pl-2 ">Correo</th>
|
||||
<th class="font-normal w-1/8 sm:w-1/8 pl-2 ">Compra</th>
|
||||
<th class="font-normal w-1/8 sm:w-1/8 pl-2">Servicio</th>
|
||||
<th class="font-normal w-1/8 sm:w-1/8 pl-2 px-6">Vence</th>
|
||||
<th class="font-normal w-1/8 sm:w-1/8 pl-2">Restante</th>
|
||||
<th class="font-normal w-1/8 pl-2 sm:w-1/8 "></th>
|
||||
<th class="rounded-r-lg w-1/8 font-normal sm:w-1/8 "></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none ">
|
||||
@foreach ($clientes as $cliente)
|
||||
<tr class="border-gray-200 text-left w-full pl-4 hover:bg-gray-200 hover:ring-gray-500 "
|
||||
x-data="{ openOption: false }">
|
||||
|
||||
<td class="pl-2">{{ $cliente->nombre_cliente ?? $cliente->cliente->name }}</td>
|
||||
<td class="pl-2">{{ $cliente->cliente->email ?? '' }}</td>
|
||||
<td class="pl-2">
|
||||
{{ Carbon\Carbon::parse($cliente->created_at)->locale('co')->Format('d M Y, h:m a') ?? '' }}
|
||||
</td>
|
||||
|
||||
@if (!empty($cliente->tarifa_id))
|
||||
<td class="pl-2">{{ $cliente->tarifa->servicio->nombre }}
|
||||
|
||||
@if ($cliente->tarifa->servicio->nombre != 'Spotify Premium' && $cliente->tarifa->servicio->nombre != 'Youtube Premium')
|
||||
{{ $cliente->tarifa->pantallas }} Pantallas
|
||||
@endif
|
||||
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if (!empty($cliente->promocion_id))
|
||||
<td class="pl-2">{{ $cliente->promocion->nombre }}
|
||||
</td>
|
||||
@endif
|
||||
|
||||
<td class="pl-2 ">{{ Carbon\Carbon::parse($cliente->fecha_final)->format('M j') ?? '' }}
|
||||
</td>
|
||||
|
||||
@php
|
||||
|
||||
$date1 = new DateTime(strtr(strval($fechaActual), '/', '-'));
|
||||
$date2 = new DateTime(strtr(strval($cliente->fecha_final), '/', '-'));
|
||||
|
||||
@endphp
|
||||
|
||||
@if ($date1 < $date2)
|
||||
<td class="pl-2">
|
||||
@php
|
||||
$diff = $date1->diff($date2);
|
||||
echo $diff->days . ' dias';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if ($date1 > $date2)
|
||||
<td class="pl-2">
|
||||
@php
|
||||
echo 'Vencido';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if ($date1 == $date2)
|
||||
<td class="pl-2">
|
||||
@php
|
||||
echo 'Vence hoy!!';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if (!empty($cliente->tarifa_id))
|
||||
<td class=" w-[1rem]">
|
||||
<button
|
||||
class="flex m-auto gap-2 items-center bg-[#B221FD] text-white px-4 py-1 rounded-lg"
|
||||
wire:click="enviarNotificacion({{ $cliente->id }})">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 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
fill="#ffffff" data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
<td class="pl-2 w-[1rem]">
|
||||
<svg x-on:click="openOption=!openOption" 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>
|
||||
<div x-cloak x-show="openOption"
|
||||
class="sm:absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="verCliente({{ $cliente->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Ver</button>
|
||||
|
||||
@if (!empty($cliente->cuentas->first()->estado))
|
||||
@if ($cliente->cuentas->first()->estado == 'pendiente' && $cliente->tarifa->servicio->renovacion == true)
|
||||
{{-- renovar --}}
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="renovar({{ $cliente->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Renovar</button>
|
||||
@endif
|
||||
@endif
|
||||
{{-- whatsapp --}}
|
||||
<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="hover:fill-white fill-gray-500 flex justify-center items-center border-b gap-2 text-gray-500 w-full py-1 hover:bg-[#00be00] hover:text-white border-gray-300 ">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"
|
||||
class="">
|
||||
<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>
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="notSMS({{ $cliente->id }})"
|
||||
class="items-center gap-2 justify-center flex fill-gray-500 text-gray-500 w-full py-1 hover:bg-gray-200 border-b md:border-none border-gray-300 hover:md:rounded-b-[1rem]">SMS
|
||||
<svg xmlns="http://www.w3.org/2000/svg" id="Filled"
|
||||
viewBox="0 0 24 24" class="w-4">
|
||||
<path
|
||||
d="M20,0H4A4,4,0,0,0,0,4V16a4,4,0,0,0,4,4H6.9l4.451,3.763a1,1,0,0,0,1.292,0L17.1,20H20a4,4,0,0,0,4-4V4A4,4,0,0,0,20,0ZM7,5h5a1,1,0,0,1,0,2H7A1,1,0,0,1,7,5ZM17,15H7a1,1,0,0,1,0-2H17a1,1,0,0,1,0,2Zm0-4H7A1,1,0,0,1,7,9H17a1,1,0,0,1,0,2Z" />
|
||||
</svg></button>
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="enviarNotificacion({{ $cliente->id }})"
|
||||
class=" md:hidden hover:fill-white fill-gray-500 flex justify-center items-center gap-2 text-gray-500 w-full py-1 hover:bg-[#00be00] hover:text-white border-b border-gray-300 ">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 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</td>
|
||||
@elseif(!empty($cliente->promocion_id))
|
||||
<td class=" w-[1rem]">
|
||||
<button
|
||||
class=" md:flex m-auto gap-2 items-center bg-[#B221FD] text-white px-4 py-1 rounded-lg"
|
||||
wire:click="enviarNotificacionPromo({{ $cliente->id }})">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 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
fill="#ffffff" data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
<td class="pl-2 w-[1rem]">
|
||||
<svg x-on:click="openOption=!openOption" 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>
|
||||
<div x-cloak x-show="openOption"
|
||||
class="sm:absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="verCliente({{ $cliente->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Ver</button>
|
||||
{{-- whatsapp --}}
|
||||
<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->promocion->nombre }}* vence el *{{ $cliente->fecha_final }}*"
|
||||
class="hover:fill-white cursor-pointer fill-gray-500 flex justify-center border-b items-center gap-2 text-gray-500 w-full py-1 hover:bg-[#00be00] hover:text-white border-gray-300 ">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"
|
||||
class="">
|
||||
<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>
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="notSMSpromo({{ $cliente->id }})"
|
||||
class="items-center gap-2 justify-center flex fill-gray-500 text-gray-500 w-full py-1 hover:bg-gray-200 border-b md:border-none border-gray-300 hover:md:rounded-b-[1rem]">SMS
|
||||
<svg xmlns="http://www.w3.org/2000/svg" id="Filled"
|
||||
viewBox="0 0 24 24" class="w-4">
|
||||
<path
|
||||
d="M20,0H4A4,4,0,0,0,0,4V16a4,4,0,0,0,4,4H6.9l4.451,3.763a1,1,0,0,0,1.292,0L17.1,20H20a4,4,0,0,0,4-4V4A4,4,0,0,0,20,0ZM7,5h5a1,1,0,0,1,0,2H7A1,1,0,0,1,7,5ZM17,15H7a1,1,0,0,1,0-2H17a1,1,0,0,1,0,2Zm0-4H7A1,1,0,0,1,7,9H17a1,1,0,0,1,0,2Z" />
|
||||
</svg></button>
|
||||
<button x-on:click="openOption=!openOption"
|
||||
wire:click="enviarNotificacionPromo({{ $cliente->id }})"
|
||||
class=" md:hidden hover:fill-white fill-gray-500 flex justify-center items-center gap-2 text-gray-500 w-full py-1 hover:bg-[#B221FD] hover:text-white border-b border-gray-300 ">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 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
<!--button x-on:click="openOption=!openOption" class="text-gray-500 w-full py-1 hover:bg-gray-200 hover:rounded-b-[1rem]">Renovar</button-->
|
||||
</div>
|
||||
</td>
|
||||
@endif
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
{{ $clientes->links() }}
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Modal ver clientes --}}
|
||||
<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 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 ">
|
||||
|
||||
@if (!empty($consulta_historial))
|
||||
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
|
||||
|
||||
<div class="mb-4 max-w-lg">
|
||||
<label for="ver_paquete" class="block text-gray-700 text-sm font-bold mb-2">Paquete:</label>
|
||||
<div class="grid grid-cols-1 items-center">
|
||||
|
||||
@if (!empty($consulta_historial->tarifa_id))
|
||||
<div>
|
||||
<p class="text-sm">
|
||||
{{ $consulta_historial->tarifa->servicio->nombre . ' - ' . $consulta_historial->tarifa->pantallas . ' Pantalla' ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="justify-self-end">
|
||||
<p class="text-sm">${{ number_format($consulta_historial->tarifa->valor) }}</p>
|
||||
<p class="text-sm">{{ $consulta_historial->tarifa->dias }} Días</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<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">
|
||||
<div class="text-sm font-semibold"> {{ $cuenta->servicio->nombre }}
|
||||
</div>
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
- URL: <span
|
||||
class="font-semibold text-gray-600">{{ $cuenta->servicio->url }}</span>
|
||||
@else
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if ($consulta_historial->id == $perfil->historial_id)
|
||||
- Perfil <span
|
||||
class="font-semibold text-gray-600">{{ $perfil->perfil }}</span>
|
||||
|
||||
@if (!empty($cuenta->servicio->perfiles))
|
||||
@switch($perfil->perfil)
|
||||
@case(1)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_1 }}</span>
|
||||
@break
|
||||
|
||||
@case(2)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_2 }}</span>
|
||||
@break
|
||||
|
||||
@case(3)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_3 }}</span>
|
||||
@break
|
||||
|
||||
@case(4)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_4 }}</span>
|
||||
@break
|
||||
|
||||
@case(5)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_5 }}</span>
|
||||
@break
|
||||
|
||||
@case(6)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_6 }}</span>
|
||||
@break
|
||||
|
||||
@default
|
||||
@endswitch
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
@endif
|
||||
<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>
|
||||
</div>
|
||||
@endif
|
||||
@if (!empty($consulta_historial->promocion_id))
|
||||
<div>
|
||||
<p class="text-sm">{{ $consulta_historial->promocion->nombre ?? '' }} </p>
|
||||
</div>
|
||||
<div class="justify-self-end">
|
||||
<p class="text-sm">${{ number_format($consulta_historial->promocion->precio) }}
|
||||
</p>
|
||||
<p class="text-sm">{{ $consulta_historial->promocion->dias }} Días</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<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">
|
||||
<div class="text-sm font-semibold"> {{ $cuenta->servicio->nombre }}
|
||||
</div>
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if ($consulta_historial->id == $perfil->historial_id)
|
||||
- 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>
|
||||
@endforeach
|
||||
</p>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- <div class="mb-4">
|
||||
<label for="ver_paquete" class="block text-gray-700 text-sm font-bold mb-2">Credenciales:</label>
|
||||
<input type="text" readonly id="ver_paquete" wire:model="ver_paquete"
|
||||
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">
|
||||
</div> --}}
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="ver_email" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<p class="text-sm">
|
||||
{{ $consulta_historial->cliente->name ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="ver_email" class="block text-gray-700 text-sm font-bold mb-2">E-mail:</label>
|
||||
<p class="text-sm">
|
||||
{{ $consulta_historial->cliente->email ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="ver_email" class="block text-gray-700 text-sm font-bold mb-2">Inicio:</label>
|
||||
<p class="text-sm">
|
||||
{{ Carbon\Carbon::parse($consulta_historial->fecha_inicio)->format('Y/m/d') ?? '' }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="ver_email" class="block text-gray-700 text-sm font-bold mb-2">Vence:</label>
|
||||
<p class="text-sm">
|
||||
{{ Carbon\Carbon::parse($consulta_historial->fecha_final)->diffInDays() ?? '' }} días
|
||||
</p>
|
||||
</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="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>
|
||||
|
||||
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- Modal ver vencidos --}}
|
||||
<div x-cloak x-show="vencidosHoy" 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 overflow-y-auto">
|
||||
|
||||
<div class="grid h-full place-items-center ">
|
||||
|
||||
@if (!empty($vencidHoy))
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
|
||||
<div class="text-black text-center">Los siguientes servicios vencen hoy: </div>
|
||||
<table class="w-full sm-w-[20rem] text-center mt-4 border-separate border-spacing-y-2">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<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="rounded-r-lg font-normal"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
@foreach ($vencidHoy as $h)
|
||||
<tr>
|
||||
<td class="pl-[1rem] sm:pl-[1rem]">{{ $h->cliente->name ?? '' }}</td>
|
||||
<td class="pl-[1rem] sm:pl-[1rem]">
|
||||
{{ Carbon\Carbon::parse($h->created_at)->locale('co')->Format('d M Y, h:m a') ?? '' }}
|
||||
</td>
|
||||
|
||||
@if (!empty($h->tarifa_id))
|
||||
<td class="pl-[1rem] sm:pl-[1rem]">{{ $h->tarifa->servicio->nombre }}
|
||||
|
||||
@if ($h->tarifa->servicio->nombre != 'Spotify Premium' && $h->tarifa->servicio->nombre != 'Youtube Premium')
|
||||
{{ $h->tarifa->pantallas }} Pantallas
|
||||
@endif
|
||||
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if (!empty($h->promocion_id))
|
||||
<td class="pl-[1rem] sm:pl-[1rem]">{{ $h->promocion->nombre }}
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if (!empty($h->tarifa_id))
|
||||
<td class="hidden md: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
|
||||
<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 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
fill="#ffffff" data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</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"
|
||||
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"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" class="w-4"
|
||||
x="0" y="0" viewBox="0 0 511.996 511.996"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<path
|
||||
d="m511.996 127.512v-8.079c0-30.419-24.748-55.166-55.166-55.166h-401.664c-30.419 0-55.166 24.747-55.166 55.166v8.079.059 264.995c0 30.417 24.747 55.163 55.166 55.163h401.667c30.417 0 55.163-24.746 55.163-55.163v-264.995c0-.019 0-.039 0-.059zm-456.83-33.245h401.664c13.876 0 25.166 11.289 25.166 25.166v.007l-200.896 133.93c-13.372 8.915-36.83 8.914-50.2.001l-200.9-133.932v-.007c0-13.876 11.289-25.165 25.166-25.165zm401.667 323.462h-401.667c-13.877 0-25.166-11.288-25.166-25.163v-237.072l184.259 122.838c11.704 7.803 26.719 11.703 41.74 11.703 15.017 0 30.039-3.901 41.742-11.703l184.256-122.838v237.072c-.001 13.875-11.289 25.163-25.164 25.163z"
|
||||
fill="#ffffff" data-original="#000000" class="">
|
||||
</path>
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
@endif
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
|
||||
</table>
|
||||
<span class="text-center mx-auto ">
|
||||
<button wire:click="cerrar" type="button"
|
||||
class="mx-auto inline-flex justify-center w-full w-24 mx-auto 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>
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,572 @@
|
||||
<div class="h-full w-full md: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="guardar,guardarSlider,slider,cancelarSlider,deleteSlider,confirmed">>
|
||||
<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-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
<div class="flex justify-between my-2 items-center">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Configuracion
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- configuracion --}}
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-2 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
<div class="lg:border-r-2">
|
||||
<p class="text-left mb-4 lg:mb-0 font-bold text-lg">Información empresa</p>
|
||||
<div class="mb-4 grid lg:grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<p class="mb-4 lg:mb-0"><label for="imagen"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label></p>
|
||||
<input type="file" name="imagen" id="imagen" wire:model="photo" class="hidden">
|
||||
</div>
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-full border-2 border-neutral-200 shadow-md w-28 h-28">
|
||||
@else
|
||||
<img src="{{ asset($url_logo) }}" alt=""
|
||||
class="rounded-full border-2 border-neutral-200 shadow-md w-28 h-28">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div class="md:mx-8 xl:mx-10">
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 text-sm font-semibold mb-2 text-left">Nombre
|
||||
empresa</label>
|
||||
<input type="text" placeholder="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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 text-sm font-semibold mb-2 text-left">Slogan</label>
|
||||
<input type="text" placeholder="Slogan" wire:model="slogan"
|
||||
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">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="pl-4 md:mx-6 xl:mx-8">
|
||||
<div>
|
||||
<p class="text-left mb-4 lg:mb-0 font-bold text-lg">Colores del sitio</p>
|
||||
|
||||
<div class="mt-4 mb-4 flex justify-between">
|
||||
<label class="block text-gray-700 text-sm font-semibold mb-2 text-left">Color botones</label>
|
||||
<input type="color" name="" id="" wire:model="color_boton"
|
||||
class="border-neutral-200 w-1/2 shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
<div class="mb-4 flex justify-between">
|
||||
<label class="block text-gray-700 text-sm font-semibold mb-2 text-left">Color barra</label>
|
||||
<input type="color" name="" id="" wire:model="color_barra"
|
||||
class="border-neutral-200 w-1/2 shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
<div class="mb-4 flex justify-between">
|
||||
<label class="block text-gray-700 text-sm font-semibold mb-2 text-left">Color menu</label>
|
||||
<input type="color" name="" id="" wire:model="color_menu"
|
||||
class="border-neutral-200 w-1/2 shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<span class="mt-4 lg:col-span-2 mb-2">
|
||||
<button wire:click="guardar"
|
||||
class="inline-flex justify-center 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>
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Slider --}}
|
||||
<div class="bg-white grid grid-cols-1 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 my-8">
|
||||
|
||||
<div x-data="{ open: false }" class="text-center w-full">
|
||||
|
||||
<div class="flex items-center mb-2 ">
|
||||
<div class="text-left mb-4 lg:mb-0 font-bold text-lg">Gestión de Slider</div>
|
||||
<button
|
||||
class="inline-flex ml-5 rounded-md border border-transparent 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"
|
||||
x-on:click="open = true"><label class="px-4 py-2 cursor-pointer" for="img_slider"> Añadir </label>
|
||||
</button>
|
||||
<input type="file" name="img_slider" wire:model="slider" hidden id="img_slider">
|
||||
</div>
|
||||
|
||||
<div x-show="open" class="text-center ">
|
||||
<div class="md:flex items-center shadow-2xl rounded-lg py-4 px-2 mb-2 mx-auto max-w-lg ">
|
||||
<div class="ml-auto ">
|
||||
@if ($slider)
|
||||
<img class="w-64 shadow-lg rounded-lg" src="{{ $slider->temporaryUrl() }}">
|
||||
@else
|
||||
<div class="w-full md:w-64 h-32 shadow rounded-lg text-center bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500">
|
||||
|
||||
</div>
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<div class="text-left px-3 mr-auto py-2">
|
||||
<button
|
||||
class=" justify-center rounded-md border border-transparent px-2 py-1 mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5"
|
||||
wire:click="guardarSlider">Guardar</button>
|
||||
<br>
|
||||
<button x-on:click="open = false"
|
||||
class=" justify-center rounded-md border border-transparent px-2 py-1 text-white bg-[#ff5050] hover:bg-[#fd3434] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5"
|
||||
wire:click="cancelarSlider">Cancelar</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="grid sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4 lg:gap-8 text-center py-2">
|
||||
@foreach ($sliders as $slider)
|
||||
<div class="text-center">
|
||||
<div class="py-2 text-center mx-auto">
|
||||
<img class="w-full shadow-lg rounded-lg " src="{{ asset($slider->slider) }}">
|
||||
</div>
|
||||
<div class="mx-auto">
|
||||
<button
|
||||
class="block w-20 mx-auto justify-center rounded-md border border-transparent px-2 py-1 text-white bg-[#ff5050] hover:bg-[#fd3434] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5"
|
||||
wire:click="deleteSlider({{ $slider->id }})">Eliminar</button>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div >
|
||||
|
||||
{{-- distribuidor --}}
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-2 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="lg:col-span-2">
|
||||
<p class="text-left mb-4 font-bold text-lg">Distribuidor</p>
|
||||
|
||||
{{-- img distribuidor --}}
|
||||
<div class="text-center ">
|
||||
<div class="md:flex items-center shadow-2xl rounded-lg py-4 px-2 mb-2 mx-auto max-w-lg ">
|
||||
<div class="ml-auto ">
|
||||
|
||||
@if ($photo_top)
|
||||
<img class="w-full md:w-64 h-32 shadow-lg rounded-lg object-cover" src="{{ $photo_top->temporaryUrl() }}">
|
||||
@else
|
||||
<div class="w-full md:w-64 h-32 shadow rounded-lg text-center bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500 object-cover">
|
||||
<img src="{{asset($img_top) ?? ''}}" alt="" class="object-cover w-full h-full">
|
||||
</div>
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<div class="text-left px-3 mr-auto py-2">
|
||||
<label for="photo_top"
|
||||
class=" cursor-pointer justify-center rounded-md border border-transparent px-2 py-1 mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Subir
|
||||
img</label>
|
||||
<input type="file" name="imagen_distribuidor" id="photo_top" wire:model="photo_top"
|
||||
hidden>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
{{-- puestos --}}
|
||||
<div class="mb-4 flex justify-around py-2">
|
||||
|
||||
<div class="text-center">
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 1</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP1)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP1->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_1) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<label for="imgP1" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP1" id="imgP1" wire:model="imgP1" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_1"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 2</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP2)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP2->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_2) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP2" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP2" id="imgP2" wire:model="imgP2" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_2"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 3</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP3)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP3->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_3) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP3" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP3" id="imgP3" wire:model="imgP3" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_3"
|
||||
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">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="mb-4 flex justify-around py-2">
|
||||
|
||||
<div class="text-center">
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 4</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP4)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP4->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_4) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<label for="imgP4" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP4" id="imgP4" wire:model="imgP4" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_4"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 5</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP5)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP5->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_5) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP5" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP5" id="imgP5" wire:model="imgP5" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_5"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 6</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP6)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP6->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_6) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP6" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP6" id="imgP6" wire:model="imgP6" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_6"
|
||||
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">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="mb-4 flex justify-around py-2">
|
||||
|
||||
<div class="text-center">
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 7</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP7)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP7->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_7) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<label for="imgP7" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP7" id="imgP7" wire:model="imgP7" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_7"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 8</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP8)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP8->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_8) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP8" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP8" id="imgP8" wire:model="imgP8" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_8"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 9</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP9)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP9->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_9) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<label for="imgP9" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP9" id="imgP9" wire:model="imgP9" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_9"
|
||||
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">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="mb-4 flex justify-around py-2">
|
||||
|
||||
<div class="text-center">
|
||||
<label class="sm:block text-gray-700 text-sm font-semibold mb-2 text-center">Puesto 10</label>
|
||||
<div class="my-2 text-center">
|
||||
@if ($imgP10)
|
||||
<img class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover" src="{{ $imgP10->temporaryUrl() }}">
|
||||
@else
|
||||
|
||||
<img src="{{asset($top_10) ?? ''}}" alt="" class="w-12 h-12 shadow-lg rounded-lg mx-auto object-cover">
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
<label for="imgP10" class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-1 sm:px-3 py-1 rounded-md cursor-pointer">img</label>
|
||||
<input type="file" name="imgP10" id="imgP10" wire:model="imgP10" hidden>
|
||||
<input type="text" placeholder="Premio" wire:model="premio_10"
|
||||
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">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
{{-- mensaje --}}
|
||||
<div class="mb-4">
|
||||
<label for="mensaje" class="block text-gray-700 text-sm font-bold text-left mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje" wire:model="mensaje_top" 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"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="lg:col-span-2 mb-2">
|
||||
<button wire:click="guardarTop"
|
||||
class="inline-flex justify-center 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">Actualizar</button>
|
||||
</span>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Msj de compra--}}
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-2 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
<div class="lg:col-span-2 flex">
|
||||
<div class="mx-auto ">
|
||||
<p class="text-left mb-4 font-bold text-lg">Mensaje de compra html</p>
|
||||
|
||||
|
||||
{{-- mensaje --}}
|
||||
<div class="mb-4">
|
||||
<label for="mensaje" class="block text-gray-700 text-sm font-bold text-left mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje" rows="10" wire:model="mensaje_msj_compra" 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"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mx-auto ">
|
||||
<p class="text-left mb-4 font-bold text-lg">Mensaje de compra wp</p>
|
||||
|
||||
|
||||
{{-- mensaje --}}
|
||||
<div class="mb-4">
|
||||
<label for="mensaje" class="block text-gray-700 text-sm font-bold text-left mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje" rows="10" wire:model="mensaje_msj_wp" 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"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<span class="lg:col-span-2 mb-2">
|
||||
<button wire:click="guardarMsjCompra"
|
||||
class="inline-flex justify-center 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">Actualizar</button>
|
||||
</span>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-2 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
<div class="lg:col-span-2 flex">
|
||||
<div class="mx-auto ">
|
||||
<p class="text-left mb-4 font-bold text-lg">Claves perfil netflix</p>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 1</label>
|
||||
<input type="text" id="clave_1" wire:model="clave_1" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 2 </label>
|
||||
<input type="text" id="clave_1" wire:model="clave_2" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 3</label>
|
||||
<input type="text" id="clave_1" wire:model="clave_3" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 4</label>
|
||||
<input type="text" id="clave_1" wire:model="clave_4" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 5</label>
|
||||
<input type="text" id="clave_1" wire:model="clave_5" 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">
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="clave_1" class="block text-gray-700 text-sm font-bold text-left mb-2">Perfil 6</label>
|
||||
<input type="text" id="clave_1" wire:model="clave_6" 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">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<span class="lg:col-span-2 mb-2">
|
||||
<button wire:click="guardarclaves"
|
||||
class="inline-flex justify-center 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">Actualizar</button>
|
||||
</span>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-1 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
<div class="lg:col-span-1 ">
|
||||
<div class="mx-auto ">
|
||||
<p class="text-left mb-4 font-bold text-lg">URL IPTV</p>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="IPTV" class="block text-gray-700 text-sm font-bold text-left mb-2">URL</label>
|
||||
<input type="text" id="IPTV" wire:model="iptv" 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">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<span class="lg:col-span-2 mb-2">
|
||||
<button wire:click="guardariptv"
|
||||
class="inline-flex justify-center 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">Actualizar</button>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-1 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
<div class="lg:col-span-1 ">
|
||||
<div class="mx-auto ">
|
||||
<p class="text-left mb-4 font-bold text-lg">Área critica</p>
|
||||
|
||||
<button class="px-2 bg-red-500 text-white rounded py-1" wire:click="eliminarC">Eliminar cuentas</button>
|
||||
<button class="px-2 bg-red-500 text-white rounded py-1" wire:click="eliminarR">Desasociar cuentas</button>
|
||||
<button class="px-2 bg-red-500 text-white rounded py-1" wire:click="eliminarH">Eliminar historial</button>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="bg-white grid grid-cols-1 lg:grid-cols-1 text-center rounded-xl py-4 px-8 shadow-md xl:mx-10 mb-8">
|
||||
|
||||
|
||||
<div class="lg:col-span-1 ">
|
||||
<div class="mb-4">
|
||||
<label for="Notificacion" class="block text-gray-700 text-sm font-bold text-left mb-2">Hora de notificación</label>
|
||||
<input type="text" id="Notificacion" wire:model="notificacion" 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">
|
||||
</div>
|
||||
|
||||
<span class="lg:col-span-2 mb-2">
|
||||
<button wire:click="guardarnot"
|
||||
class="inline-flex justify-center 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">Actualizar</button>
|
||||
</span>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="lg:col-span-1 mb-4 text-center">
|
||||
|
||||
<button wire:click="eliminarCache"
|
||||
class=" mx-auto inline-flex justify-center rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-red-500 hover:bg-red-700 focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Eliminar cache</button>
|
||||
</span>
|
||||
|
||||
|
||||
</div>
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
@@ -0,0 +1,132 @@
|
||||
<div x-data="{ categorian: @entangle('categorian'),verPro: @entangle('verPro')}" class="h-full w-full md:my-2">
|
||||
<div class="text-right mx-12">
|
||||
<a href="/#planes">
|
||||
<button class="my-2 mx max-w-sm ml-auto rounded-lg border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Ver planes</button>
|
||||
</a>
|
||||
</div>
|
||||
<div class=" md:w-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
|
||||
<div class="mx-auto bg-white grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 shadow-md xl:mx-10 mb-8 ">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione una categoria:</h2>
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div class="slider scroll-smooth py-2 px-4 overflow-x-scroll w-full gap-4 " id="content">
|
||||
<table>
|
||||
@foreach ($categorias as $categoria1)
|
||||
<td>
|
||||
<div class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[250px] sm:w-[450px] sm:h-[450px] mx-4"
|
||||
x-on:click="categorian='{{ $categoria1->nombre }}'">
|
||||
|
||||
<img src="{{ asset($categoria1->imagen) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="imagen de {{ $categoria1->nombre }}">
|
||||
|
||||
</div>
|
||||
</td>
|
||||
@endforeach
|
||||
</table>
|
||||
</div>
|
||||
<button class="prev p-2 md:p-3 absolute left-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M17.921,1.505a1.5,1.5,0,0,1-.44,1.06L9.809,10.237a2.5,2.5,0,0,0,0,3.536l7.662,7.662a1.5,1.5,0,0,1-2.121,2.121L7.688,15.9a5.506,5.506,0,0,1,0-7.779L15.36.444a1.5,1.5,0,0,1,2.561,1.061Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
<button class="next p-2 md:p-3 absolute right-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M6.079,22.5a1.5,1.5,0,0,1,.44-1.06l7.672-7.672a2.5,2.5,0,0,0,0-3.536L6.529,2.565A1.5,1.5,0,0,1,8.65.444l7.662,7.661a5.506,5.506,0,0,1,0,7.779L8.64,23.556A1.5,1.5,0,0,1,6.079,22.5Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
</div>
|
||||
<button x-on:click="verPro=true" class="my-2 mx max-w-sm ml-auto rounded-lg border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Ver todos</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($categorian)
|
||||
<div class="bg-[#f8f8f8] shadow-md rounded-[1.2rem] mb-4 px-4 py-4">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione una promocion:</h2>
|
||||
</div>
|
||||
|
||||
<div id="promo" class="grid sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-4 py-2 px-4">
|
||||
|
||||
@foreach ($categorias->where('nombre', $categorian)->first()->promociones as $promocion)
|
||||
@if ($promocion->visible == 'true')
|
||||
|
||||
<div class="select-none bg-white shadow-md transition hover:scale-[1.05] hover:shadow-xl cursor-pointer rounded-lg text-center relative object-cover ">
|
||||
<a href="/promo?promo={{$promocion->id}}">
|
||||
<img src="{{ asset($promocion->img_publicidad) }}" alt="" class="w-full m-auto rounded-lg object-cover h-24 sm:h-44 object-center shadow">
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Modal ver promociones --}}
|
||||
<div x-cloak x-show="verPro" 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-10">
|
||||
<div class="overflow-auto h-full ">
|
||||
|
||||
<div class="grid sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 gap-3 py-2 px-4 ">
|
||||
|
||||
|
||||
@foreach ($categorias as $categoria1)
|
||||
|
||||
<div class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[250px] sm:w-[350px] sm:h-[350px] mx-4 my-2 mx-auto"
|
||||
x-on:click="categorian='{{ $categoria1->nombre }}',verPro=false">
|
||||
|
||||
<img src="{{ asset($categoria1->imagen) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="">
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
|
||||
<span class="absolute z-40 top-0 right-0 md:right-[48%]">
|
||||
<button type="button" x-on:click="verPro=false"
|
||||
class="inline-flex justify-center w-full rounded-l-md md:rounded-md rounded-b-md border border-transparent px-4 py-2 text-white bg-[#ff5050] hover:bg-[#fd3737] ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<script>
|
||||
const prev = document.querySelector('.prev')
|
||||
const next = document.querySelector('.next')
|
||||
const slider = document.querySelector('.slider')
|
||||
|
||||
prev.addEventListener('click', () => {
|
||||
slider.scrollLeft -= 600
|
||||
})
|
||||
|
||||
next.addEventListener('click', () => {
|
||||
slider.scrollLeft += 600
|
||||
})
|
||||
</script>
|
||||
</div>
|
||||
@@ -0,0 +1,122 @@
|
||||
<div>
|
||||
<div class=" bg-gray-100">
|
||||
|
||||
<div class="md:px-10 py-8 ">
|
||||
|
||||
<h1 class="ml-2 text-xl sm:text-2xl font-black my-2">
|
||||
{{$promo->nombre}}
|
||||
</h1>
|
||||
|
||||
|
||||
<div class="md:grid md:grid-cols-4 md:items-center ">
|
||||
|
||||
<div class="md:col-span-2 mb-4 md:mb-0 rounded-xl mx-2 md:w-[90%]">
|
||||
<img src="{{asset($promo->img_publicidad) }}" alt="" class="rounded-xl md:w-[100%] shadow-lg">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="px-8 mb-4 md:mb-0 md:border-r md:mr-6 max-w-xs">
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Cantidad</label>
|
||||
<input type="tel" wire:model="cantidad_comprarPromo" class="@error('cantidad_tarjetaPlan') border border-red-500 @enderror border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full md:w-[72%] py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('cantidad_tarjetaPlan') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1 ">Descripción</label>
|
||||
<p class="text-gray-500 leading-tight ">
|
||||
{{$promo->descripcion}}
|
||||
</p>
|
||||
<div class="my-2">
|
||||
@foreach ($promo->tarifas as $tarifa)
|
||||
<li class = " font-semibold text-gray-700 text-sm apperance-none focus:ring-0 w-full sm:w-60 py px-3 leading-tight focus:outline-none focus:shadow-outline"> {{$tarifa->pantallas}} P. de {{$tarifa->servicio->nombre}}</li>
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<label class="block text-gray-700 font-bold mb-1">Precio</label>
|
||||
<p class="font-bold text-lg"> ${{number_format($promo->precio ?? '')}}</p>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="px-8 mb-4 md:mb-0 md:mr-4 max-w-xs">
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Nombre</label>
|
||||
<input type="text" wire:model="nombre_comprarPromo" class="@error('nombre_comprarPromo') border border-red-500 @enderror 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_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Email</label>
|
||||
<input type="text" wire:model="email_comprarPromo" class="@error('email_comprarPromo') border border-red-500 @enderror 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_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Celular</label>
|
||||
<input type="text" wire:model="celular_comprarPromo" class="@error('celular_comprarPromo') border border-red-500 @enderror 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('celular_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-3 sm:px-6 sm:flex sm:justify-evenly">
|
||||
<span>
|
||||
<button wire:click="comprar" 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 sm-text-sm sm-leading-5">Pagar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="mb-10">
|
||||
<p class="text-gray-600 text-center text-lg my-8">Planes relacionados</p>
|
||||
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 justify-items-center gap-y-8">
|
||||
@php
|
||||
$n=1;
|
||||
@endphp
|
||||
@foreach($promociones as $plan)
|
||||
@if (!empty($plan->tarifas->first()->pantallas) && $n<=4)
|
||||
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
<a href="/promo?promo={{$plan->id}}" class="rounded-xl mb-2 bg-white shadow-lg mx-3">
|
||||
<div class=" mb-2">
|
||||
<img src="{{$plan->img_publicidad}}" class="mx-auto rounded-xl bg-white border-neutral-200 shadow-md w-auto w-full cursor-pointer transition hover:scale-[1.05]">
|
||||
<div class="px-4 py-2">
|
||||
<p class="font-black">{{$plan->nombre}}</p>
|
||||
<p class="text-sm"> {{$plan->descripcion}}</p>
|
||||
|
||||
<p class="font-bold text-base"> {{number_format($plan->precio)}}</p>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="bg-white px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly mb-2">
|
||||
|
||||
<button type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-1 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Comprar</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,152 @@
|
||||
<div class=" bg-gray-100">
|
||||
|
||||
<div class="md:px-10 py-8 ">
|
||||
|
||||
<h1 class="ml-2 text-xl sm:text-2xl font-black">
|
||||
{{$servicio->nombre}}
|
||||
</h1>
|
||||
|
||||
|
||||
<div class="md:grid md:grid-cols-4 md:items-center ">
|
||||
|
||||
<div class="md:col-span-2 mb-4 md:mb-0 rounded-xl mx-2 md:w-[90%]">
|
||||
<img src="{{asset($servicio->img_inicio) }}" alt="" class="rounded-xl md:w-[100%]">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="px-8 mb-4 md:mb-0 md:border-r md:mr-6 max-w-xs">
|
||||
<div class="mb-4">
|
||||
@if($servicio->nombre == 'Youtube Premium' || $servicio->nombre== 'Spotify Premium')
|
||||
<label class="block text-gray-700 font-bold mb-1">Dias</label>
|
||||
<select name="" id="" wire:model="tarifa_id" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full md:w-[72%] sm:w-60 py-2 px-3 text-gray-600 leading-tight focus:outline-none focus:shadow-outline">
|
||||
<option value="">Dias</option>
|
||||
@foreach ($servicio->tarifas as $tarifa)
|
||||
<option value="{{$tarifa->id}}">{{$tarifa->dias}} Dias.</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@else
|
||||
<label class="block text-gray-700 font-bold mb-1">Pantallas</label>
|
||||
<select name="" id="" wire:model="tarifa_id" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full md:w-[72%] sm:w-60 py-2 px-3 text-gray-600 leading-tight focus:outline-none focus:shadow-outline">
|
||||
<option value="">Pantallas</option>
|
||||
@foreach ($servicio->tarifas as $tarifa)
|
||||
<option value="{{$tarifa->id}}">{{$tarifa->pantallas}} P.</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@endif
|
||||
|
||||
|
||||
@if (!empty($disponibles))
|
||||
<p class="italic text-green-500">
|
||||
{{$disponibles ?? ''}} Cuentas disponibles.
|
||||
</p>
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Cantidad</label>
|
||||
<input type="tel" wire:model="cantidad_tarjetaPlan" class="@error('cantidad_tarjetaPlan') border border-red-500 @enderror border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 focus:ring-0 w-full md:w-[72%] py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('cantidad_tarjetaPlan') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Descripción</label>
|
||||
<p class="text-gray-500 ">
|
||||
{{$servicio->descripcion}}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@if (!empty($valor))
|
||||
<label class="block text-gray-700 font-bold mb-1">Precio</label>
|
||||
<p class="font-bold text-lg"> ${{number_format( $valor ?? '')}}</p>
|
||||
@else
|
||||
|
||||
|
||||
<label class="block text-gray-700 font-bold mb-1">Precio</label>
|
||||
@if ($servicio->tarifas_min_valor != $servicio->tarifas_max_valor)
|
||||
<p class="font-bold text-lg"> {{number_format($servicio->tarifas_min_valor)}} - {{number_format($servicio->tarifas_max_valor)}}</p>
|
||||
@else
|
||||
<p class="font-bold text-lg"> {{number_format($servicio->tarifas_min_valor)}}</p>
|
||||
@endif
|
||||
|
||||
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="px-8 mb-4 md:mb-0 md:mr-4 max-w-xs">
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Nombre</label>
|
||||
<input type="text" wire:model="nombre_tarjetaPlan" class="@error('nombre_tarjetaPlan') border border-red-500 @enderror 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_tarjetaPlan') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Email</label>
|
||||
<input type="text" wire:model="email_tarjetaPlan" class="@error('email_tarjetaPlan') border border-red-500 @enderror 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_tarjetaPlan') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label class="block text-gray-700 font-bold mb-1">Celular</label>
|
||||
<input type="text" wire:model="celular_tarjetaPlan" class="@error('celular_tarjetaPlan') border border-red-500 @enderror 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('celular_tarjetaPlan') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-3 sm:px-6 sm:flex sm:justify-evenly">
|
||||
<span>
|
||||
<button wire:click="comprar" @if ($cantidad_tarjetaPlan <= (int)$disponibles )
|
||||
|
||||
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 sm-text-sm sm-leading-5"
|
||||
|
||||
@else disabled
|
||||
|
||||
class="cursor-no-drop inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-gray-200 hover:bg-gray-200 focus:shadow-outline-green sm-text-sm sm-leading-5" @endif>Pagar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="mb-10">
|
||||
<p class="text-gray-600 text-center text-lg my-8">Planes relacionados</p>
|
||||
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 justify-items-center gap-y-8">
|
||||
@php
|
||||
$n=1;
|
||||
@endphp
|
||||
@foreach($planes as $plan)
|
||||
@if (!empty($plan->tarifas->first()->pantallas) && $n<=4)
|
||||
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
<a href="/single?servicio={{$plan->id}}" class="rounded-xl mb-2 bg-white shadow-lg">
|
||||
<div class=" w-36 sm:w-44 mb-2">
|
||||
<img src="{{$plan->img_inicio}}" class="rounded-xl bg-white border-neutral-200 shadow-md w-full h-36 sm:h-44 cursor-pointer transition hover:scale-[1.05]">
|
||||
<div class="px-4 py-2">
|
||||
<p class="font-black">{{$plan->nombre}}</p>
|
||||
<p class="text-sm"> {{$plan->descripcion}}</p>
|
||||
@if ($plan->tarifas_min_valor != $plan->tarifas_max_valor)
|
||||
<p class="font-bold text-base"> {{number_format($plan->tarifas_min_valor)}} - {{number_format($plan->tarifas_max_valor)}}</p>
|
||||
@else
|
||||
<p class="font-bold text-base"> {{number_format($plan->tarifas_min_valor)}}</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-white px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly mb-2">
|
||||
|
||||
<button type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-1 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Comprar</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
@@ -0,0 +1,53 @@
|
||||
<div x-data="{categoria : @entangle('categoria')}">
|
||||
<div class="mt-4 mb-4">
|
||||
<h1 class=" text-gray-600 text-center text-lg my-8">Mas vendidos</h1>
|
||||
<div class="mt-4 grid grid-cols-2 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 justify-items-center gap-y-8">
|
||||
@foreach ($promociones as $promocion)
|
||||
<div class="shadow rounded-lg mb-2">
|
||||
<a href="/promo?promo={{$promocion->id}}">
|
||||
<img src="{{ asset($promocion->img_publicidad) }}" class="rounded-xl border-2 border-neutral-200 shadow-md w-full h-24 sm:h-44 cursor-pointer transition hover:scale-[1.05]">
|
||||
</a >
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<div class=" px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly mb-2">
|
||||
<span>
|
||||
<a href="{{ route('categorias') }}" type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-1 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Ver promociones</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-10" id="planes">
|
||||
<h1 class="text-gray-600 text-center text-lg my-8">Planes</h1>
|
||||
<div class="mt-4 grid grid-cols-2 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-4 xl:grid-cols-5 justify-items-center gap-y-8">
|
||||
@foreach ($planes as $plan)
|
||||
@if (!empty($plan->tarifas->first()->pantallas))
|
||||
<a href="/single?servicio={{$plan->id}}" class="rounded-xl mb-2 bg-white shadow-lg">
|
||||
<div class="w-36 sm:w-44 ">
|
||||
<img src="{{ asset($plan->img_inicio) }}" class="rounded-xl bg-white border-neutral-200 shadow-md w-full h-36 sm:h-44 cursor-pointer transition hover:scale-[1.05]">
|
||||
<div class="px-4 py-2">
|
||||
<p class="font-black ">{{$plan->nombre}}</p>
|
||||
<p class="text-sm">{{$plan->descripcion}}</p>
|
||||
@if ($plan->tarifas_min_valor != $plan->tarifas_max_valor)
|
||||
|
||||
<p class="font-bold text-base"> {{number_format($plan->tarifas_min_valor) ?? ''}} - {{number_format($plan->tarifas_max_valor) ?? ''}}</p>
|
||||
@else
|
||||
<p class="font-bold text-base"> {{number_format($plan->tarifas_min_valor) ?? ''}}</p>
|
||||
@endif
|
||||
</div>
|
||||
<div class="bg-white px-4 py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly mb-2">
|
||||
|
||||
<button type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-1 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green ease-in-out sm-text-sm sm-leading-5">Ver tarifas</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
@@ -0,0 +1,4 @@
|
||||
<div class="text-center ">
|
||||
@include('components.slider')
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,52 @@
|
||||
<div class=" text-center">
|
||||
<input type="text" placeholder="Buscar" wire:model="buscar" class="mx-auto text-center rounded my-4">
|
||||
|
||||
<table class="text-center w-full mx-8">
|
||||
<tr class="border text-left">
|
||||
<th>Id</th>
|
||||
<th>Compra</th>
|
||||
<th>Fecha Inicio</th>
|
||||
<th>Fecha Final</th>
|
||||
<th>Valor</th>
|
||||
<th>Vendedor</th>
|
||||
<th>Correo</th>
|
||||
<th>Cliente</th>
|
||||
<th>Servicio</th>
|
||||
<th>cliente</th>
|
||||
<th>Credenciales</th>
|
||||
<th>Estado</th>
|
||||
</tr>
|
||||
@foreach($logs as $item)
|
||||
|
||||
<tr class="border hover:bg-gray-200 hover:ring-gray-500 text-left text-sm" >
|
||||
<td>{{$item->id}}</td>
|
||||
<td>{{\Carbon\Carbon::parse($item->created_at)->format('y/m/d h:i a')}}</td>
|
||||
<td>{{\Carbon\Carbon::parse($item->fecha_inicio)->format('d/m/Y') }}</td>
|
||||
<td>{{\Carbon\Carbon::parse($item->fecha_final)->format('d/m/Y') }}</td>
|
||||
<td>{{$item->valor}}</td>
|
||||
<td>{{$item->vendedor->name}}</td>
|
||||
<td>{{$item->vendedor->email}}</td>
|
||||
<td>{{$item->cliente->email}}</td>
|
||||
<td>@if(!empty($item->promocion_id)) {{$item->promocion->nombre}} @elseif(!empty($item->tarifa_id)) @if(empty($item->tarifa->servicio->por_tiempo)) {{$item->tarifa->pantallas}} P. de @endif {{$item->tarifa->servicio->nombre}} - {{$item->tarifa->dias}} d. @endif </td>
|
||||
<td>{{$item->nombre_cliente ?? $item->cliente->name}}</td>
|
||||
<td class="text-left">
|
||||
@if(!empty($item->cuentas_obsoletas->unique()))
|
||||
@foreach($item->cuentas_obsoletas->unique() as $cuenta) {{$cuenta->correo}} - {{$cuenta->password}} <br> @endforeach
|
||||
@endif
|
||||
@if(!empty($item->cuentas->unique()))
|
||||
@foreach($item->cuentas->unique() as $cuenta1) {{$cuenta1->correo}} - {{$cuenta1->password}} <br> @endforeach
|
||||
@endif
|
||||
</td>
|
||||
<td>
|
||||
{{$item->estado ?? ''}}
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
|
||||
@endforeach
|
||||
|
||||
</table>
|
||||
<div class="mx-10">
|
||||
{{ $logs->links( )}}
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,66 @@
|
||||
<div>
|
||||
<div class="py-12">
|
||||
@if ($estado == 'aprobado')
|
||||
<div class=" text-center rounded shadow bg-green-100 mx-auto p-12 max-w-sm ">
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 text-green-600 mx-auto">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75L11.25 15 15 9.75M21 12c0 1.268-.63 2.39-1.593 3.068a3.745 3.745 0 01-1.043 3.296 3.745 3.745 0 01-3.296 1.043A3.745 3.745 0 0112 21c-1.268 0-2.39-.63-3.068-1.593a3.746 3.746 0 01-3.296-1.043 3.745 3.745 0 01-1.043-3.296A3.745 3.745 0 013 12c0-1.268.63-2.39 1.593-3.068a3.745 3.745 0 011.043-3.296 3.746 3.746 0 013.296-1.043A3.746 3.746 0 0112 3c1.268 0 2.39.63 3.068 1.593a3.746 3.746 0 013.296 1.043 3.746 3.746 0 011.043 3.296A3.745 3.745 0 0121 12z" />
|
||||
</svg>
|
||||
|
||||
<div class="text-green-700 mt-4">
|
||||
Recarga exitosa
|
||||
</div>
|
||||
<a href="{{route('servicios')}}">
|
||||
<button class=" mt-12 inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 text-white bg-green-800 hover:bg-green-800 ease-in-out sm-text-sm sm-leading-5">
|
||||
Servicios
|
||||
</button>
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
@elseif($estado == 'pendiente')
|
||||
|
||||
<div class=" text-center rounded shadow bg-orange-100 mx-auto p-12 max-w-sm ">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 text-orange-700 mx-auto">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z" />
|
||||
</svg>
|
||||
|
||||
|
||||
|
||||
<div class="text-red-700">
|
||||
Recarga pendiente .
|
||||
</div>
|
||||
<a href="{{route('servicios')}}">
|
||||
<button class=" mt-12 inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 text-white bg-orange-800 hover:bg-orange-800 ease-in-out sm-text-sm sm-leading-5">
|
||||
Servicios
|
||||
</button>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
@else
|
||||
|
||||
<div class=" text-center rounded shadow bg-orange-100 mx-auto p-12 max-w-sm ">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-12 h-12 text-red-700 mx-auto">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M9.75 9.75l4.5 4.5m0-4.5l-4.5 4.5M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
|
||||
|
||||
<div class="text-red-700">
|
||||
Error en la recarga.
|
||||
</div>
|
||||
<a href="{{route('recarga')}}">
|
||||
<button class=" mt-12 inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 text-white bg-red-800 hover:bg-red-800 ease-in-out sm-text-sm sm-leading-5">
|
||||
Recargar nuevamente
|
||||
</button>
|
||||
</a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,100 @@
|
||||
<div x-data="{modalPassword : @entangle ('modalPassword')}">
|
||||
|
||||
<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="update,cambiar_password,confirmar,limpiarContra">
|
||||
<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-white sm:w-[25rem] p-5 rounded-[1rem] border-b border-gray-200 mx-auto shadow-md">
|
||||
|
||||
<div class="mb-4">
|
||||
<div class="flex justify-center gap-6 mb-2">
|
||||
<div class="rounded-full border-2 border-neutral-200 shadow-sm w-24 h-24 overflow-hidden">
|
||||
@if ($url_imagen)
|
||||
<img src="{{ $url_imagen->temporaryUrl() }}" alt="" class="w-24 h-24 object-contain">
|
||||
@elseif($url_imagen_d)
|
||||
<img src="{{ $url_imagen_d }}" alt="" class="w-24 h-24 object-contain">
|
||||
@else
|
||||
<img src="/" class="w-24 h-24 object-contain">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="text-center">
|
||||
<label for="subir_imagen" class="text-[#B221FD] hover:text-[#7a02b8] cursor-pointer">Cambiar foto</label>
|
||||
<input type="file" id="subir_imagen" wire:model="url_imagen" class="hidden border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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:ring-0 focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</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:ring-0 focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="celular" class="block text-gray-700 text-sm font-bold mb-2">Celular:</label>
|
||||
<input type="text" id="celular" wire:model="celular" 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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="cedula" class="block text-gray-700 text-sm font-bold mb-2">Cedula:</label>
|
||||
<input type="text" id="cedula" wire:model="cedula" 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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="rol" class="block text-gray-700 text-sm font-bold mb-2">Rol:</label>
|
||||
<input type="text" id="rol" readonly wire:model="rol" 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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<span>
|
||||
<button wire:click="cambiar_password" type="button" class="inline-flex justify-center w-full rounded-md border border-transparent px-4 py-[6px] 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">Cambiar password</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="bg-white py-3 sm:px-6 sm:flex sm:flex-row-reverse sm:justify-evenly">
|
||||
<span>
|
||||
<button wire:click="update" 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>
|
||||
</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="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="confirmar" 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>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,961 @@
|
||||
<div x-data="{
|
||||
observacionesm: @entangle('observacionesm'),
|
||||
observacionesm1: @entangle('observacionesm1'),
|
||||
newCuenta: @entangle('newCuenta'),
|
||||
modTarifas: @entangle('modTarifas'),
|
||||
serviciosModal: @entangle('serviciosModal'),
|
||||
ver: false,
|
||||
renovar: @entangle('renovar'),
|
||||
addUser:@entangle('addUser'),
|
||||
editarTarifaRol:@entangle('editarTarifaRol'),
|
||||
|
||||
}" class="h-full w-full md: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="ver,openRenovar,saveRenovar,createNewCuenta,createServicio,verObservacion,update,verObservacion1,update_observaciones1,delete_cuenta,updateTarifas">
|
||||
<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>
|
||||
|
||||
|
||||
{{-- Buscador --}}
|
||||
<div
|
||||
class="bg-[#f5f5f5] md:w-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] 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">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Planes
|
||||
</div>
|
||||
|
||||
<a x-on:click="newCuenta = true"
|
||||
class="justify-center flex px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8]">
|
||||
Nueva cuenta
|
||||
<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>
|
||||
@if ( auth()->user()->rol->nombre != "editor")
|
||||
<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]">
|
||||
Modificar tarifas
|
||||
<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 class="flex relative my-2">
|
||||
<input id="buscar" type="search" wire:model="buscar" placeholder="Buscar"
|
||||
class="w-full md:w-auto shadow-md border-2 active:border-neutral-200 focus:ring-0 border-neutral-200 rounded-[0.8rem] 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>
|
||||
<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>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="completa">Completas</label>
|
||||
<input type="checkbox" name="" id="completa" wire:model="completa">
|
||||
</div>
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="Pantallas">Pantallas</label>
|
||||
<input type="checkbox" name="" id="Pantallas" wire:model="pantallas">
|
||||
</div>
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="cbox2">Vencidos</label>
|
||||
<input type="checkbox" name="" id="cbox2" wire:model="venceHoy">
|
||||
|
||||
</div>
|
||||
<div class="my-1 md:my-0">
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="activos">Activos</label>
|
||||
<input type="checkbox" name="" id="activos" wire:model="activoHoy">
|
||||
</div>
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="Libres 100%">Libres 100%</label>
|
||||
<input type="checkbox" name="" id="Libres 100%" wire:model="libres">
|
||||
</div>
|
||||
<div class="my-1 md:my-0">
|
||||
<label for="Repetidas">Repetidas</label>
|
||||
<input type="checkbox" name="" id="Repetidas" wire:model="repetidas">
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@if (auth()->user()->rol->nombre != "editor")
|
||||
<div class="my-1 md:my-0">
|
||||
<button wire:click="eliminarCuentas" class="bg-red-400 text-white px-4 py-2 rounded">Eliminar</button>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
|
||||
|
||||
<div class="grid mt-4 sm:mt-0 sm:flex w-[8rem]">
|
||||
<select name="servicios" id="servicios" wire:model.debounce.500ms="servicios_id"
|
||||
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 value="" selected>Servicios</option>
|
||||
@foreach ($servicios as $servicio)
|
||||
<option value="{{ $servicio->id }}">{{ $servicio->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- tabla --}}
|
||||
<div class="overflow-y-auto max-h-full">
|
||||
<table class="w-full sm-w-[20rem] text-center mt-4 border-separate border-spacing-y-2">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[2rem]"></th>
|
||||
<th class="font-normal pl-[2rem]">id</th>
|
||||
<th class="font-normal pl-[2rem]">Servicio</th>
|
||||
<th class="font-normal pl-[2rem]">correo</th>
|
||||
<th class="font-normal pl-[2rem] hidden md:inline-table">Inicio - Final</th>
|
||||
<th class="font-normal pl-[2rem]">Restante</th>
|
||||
<th class="font-normal pl-[2rem]">Ocupado</th>
|
||||
<th class="font-normal pl-[2rem]"></th>
|
||||
<th class="font-normal pl-[2rem] hidden md:inline-table"></th>
|
||||
<th class="font-normal rounded-r-lg md:rounded-r-none"></th>
|
||||
<th class="rounded-r-lg font-normal hidden md:inline-table"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@php
|
||||
$n = 0;
|
||||
@endphp
|
||||
|
||||
@foreach ($cuentas as $cuenta)
|
||||
|
||||
@php
|
||||
$n++;
|
||||
$historiales=false;
|
||||
|
||||
if(now()->gt($cuenta->vencimiento)){
|
||||
$historiales = $cuenta->historiales()->where('fecha_final', '>=', now()->toDateString())->count();
|
||||
}
|
||||
|
||||
@endphp
|
||||
|
||||
@include('components/listado-planes')
|
||||
|
||||
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
{{ $cuentas->links() }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- Modal ver --}}
|
||||
<div x-cloak x-show="ver" 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="bg-[#000029] text-white text-center text-lg py-3 rounded-xl">
|
||||
{{ $nombre_servicios }}
|
||||
</div>
|
||||
|
||||
{{-- tabla usuarios --}}
|
||||
<div class="overflow-y-auto max-h-96">
|
||||
<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-[2rem]">Distribuidor</th>
|
||||
<th class="font-normal pl-[2rem]">Perfil</th>
|
||||
<th class="font-normal pl-[2rem]">Cliente</th>
|
||||
<th class="font-normal pl-[2rem]">Restante</th>
|
||||
<th class="font-normal pl-[2rem]">Inicio</th>
|
||||
<th class="font-normal pl-[2rem]">Final</th>
|
||||
<th class="font-normal"></th>
|
||||
<th class="rounded-r-lg font-normal w-[1rem]"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@if (!is_null($consulta_verUsuarios))
|
||||
@foreach ($consulta_verUsuarios->historiales->unique() as $verUsuarios)
|
||||
<tr class="border-gray-200 text-left w-full pl-4" x-data="{ openOption: false }">
|
||||
<td class="pl-[2rem]">{{ $verUsuarios->vendedor->name ?? '' }}</td>
|
||||
@if($consulta_verUsuarios->estado == 'activo')
|
||||
<td class="pl-[2rem]">
|
||||
@foreach ($consulta_verUsuarios->perfil as $perfil)
|
||||
|
||||
@if ($verUsuarios->id == $perfil->historial_id )
|
||||
-Perfil: {{ $perfil->perfil ?? '' }}
|
||||
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
|
||||
</td>
|
||||
@else
|
||||
<td class="pl-[2rem]"></td>
|
||||
@endif
|
||||
|
||||
<td class="pl-[2rem]">{{ $verUsuarios->cliente->name ?? '' }}</td>
|
||||
|
||||
@php
|
||||
|
||||
$date1 = new DateTime(strtr(strval($fechaActual), '/', '-'));
|
||||
$date2 = new DateTime(strtr(strval($verUsuarios->fecha_final), '/', '-'));
|
||||
|
||||
@endphp
|
||||
|
||||
@if ($date1 < $date2)
|
||||
<td class="pl-[2rem]">
|
||||
@php
|
||||
$diff = $date1->diff($date2);
|
||||
echo $diff->days . ' dias';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if ($date1 > $date2)
|
||||
<td class="pl-[2rem]">
|
||||
@php
|
||||
echo 'Vencido';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if ($date1 == $date2)
|
||||
<td class="pl-[2rem]">
|
||||
@php
|
||||
echo 'Vence hoy!!';
|
||||
@endphp
|
||||
</td>
|
||||
@endif
|
||||
|
||||
<td class="pl-[2rem]">{{ \Carbon\Carbon::parse($verUsuarios->fecha_inicio)->format('y/m/d' ) }}</td>
|
||||
<td class="pl-[2rem]">{{\Carbon\Carbon::parse( $verUsuarios->fecha_final)->format('y/m/d' ) }}</td>
|
||||
|
||||
@php
|
||||
$promocion = $verUsuarios->promocion_id;
|
||||
$observaciones = $verUsuarios->observaciones;
|
||||
@endphp
|
||||
|
||||
@if (!is_null($promocion))
|
||||
<td class="pl-2">
|
||||
<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-5 " x="0" y="0" viewBox="0 0 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<path
|
||||
d="M19.467,23.316,12,17.828,4.533,23.316,7.4,14.453-.063,9H9.151L12,.122,14.849,9h9.213L16.6,14.453Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</svg>
|
||||
</td>
|
||||
@else
|
||||
<td class="pl-2">
|
||||
|
||||
</td>
|
||||
@endif
|
||||
|
||||
@if (!is_null($observaciones))
|
||||
<td class="pl-2">
|
||||
<div class="cursor-pointer" wire:click="verObservacion({{ $verUsuarios->id }})"
|
||||
x-on:click="observacionesm=true" title="{{$observaciones}}" >
|
||||
<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 text-green-700">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M8.625 9.75a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0H8.25m4.125 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0H12m4.125 0a.375.375 0 11-.75 0 .375.375 0 01.75 0zm0 0h-.375m-13.5 3.01c0 1.6 1.123 2.994 2.707 3.227 1.087.16 2.185.283 3.293.369V21l4.184-4.183a1.14 1.14 0 01.778-.332 48.294 48.294 0 005.83-.498c1.585-.233 2.708-1.626 2.708-3.228V6.741c0-1.602-1.123-2.995-2.707-3.228A48.394 48.394 0 0012 3c-2.392 0-4.744.175-7.043.513C3.373 3.746 2.25 5.14 2.25 6.741v6.018z" />
|
||||
</svg>
|
||||
</div>
|
||||
</td>
|
||||
@else
|
||||
<td class="pl-2">
|
||||
<svg wire:click="verObservacion({{ $verUsuarios->id }})"
|
||||
x-on:click="observacionesm=true" class="w-7 cursor-pointer"
|
||||
xmlns="http://www.w3.org/2000/svg" version="1.1"
|
||||
xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" x="0"
|
||||
y="0" viewBox="0 0 32 32"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve"
|
||||
class="">
|
||||
<g>
|
||||
<g id="Layer_57" data-name="Layer 57">
|
||||
<path
|
||||
d="m23 28a3 3 0 0 0 3-3v-13.17a3 3 0 0 0 -.88-2.12l-4.83-4.83a3 3 0 0 0 -2.12-.88h-8.17a3 3 0 0 0 -3 3v18a3 3 0 0 0 3 3zm-.41-18h-1.59a1 1 0 0 1 -1-1v-1.59zm-13.59 15v-18a1 1 0 0 1 1-1h8v3a3 3 0 0 0 3 3h3v13a1 1 0 0 1 -1 1h-13a1 1 0 0 1 -1-1z"
|
||||
fill="#d3b637" data-original="#000000"
|
||||
class=""></path>
|
||||
<path
|
||||
d="m12.5 19.5h2.5v2.5a1 1 0 0 0 2 0v-2.5h2.5a1 1 0 0 0 0-2h-2.5v-2.5a1 1 0 0 0 -2 0v2.5h-2.5a1 1 0 0 0 0 2z"
|
||||
fill="#d3b637" data-original="#000000"
|
||||
class=""></path>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</td>
|
||||
@endif
|
||||
|
||||
</tr>
|
||||
@endforeach
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
<div><span class="font-semibold text-gray-700">Email:</span>
|
||||
{{ $consulta_verUsuarios->correo ?? '' }} </div>
|
||||
<div><span class="font-semibold text-gray-700">Password:</span>
|
||||
{{ $consulta_verUsuarios->password ?? '' }} </div>
|
||||
|
||||
|
||||
<div class="flex justify-end">
|
||||
<span class="mr-4">
|
||||
<button wire:click="openAdd" 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 ">Añadir usuario</button>
|
||||
</span>
|
||||
<span>
|
||||
<button wire:click="openRenovar" 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 ">Editar cuenta</button>
|
||||
</span>
|
||||
</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 x-on:click="ver=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>
|
||||
|
||||
{{-- Modal renovar --}}
|
||||
<div x-cloak x-show="renovar" 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">
|
||||
<label for="usuario_renovar" class="block text-gray-700 text-sm font-bold mb-2">Usuario:</label>
|
||||
<input type="email" id="usuario_nrenovar" wire:model="usuario_renovar"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="password_renovar"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Contraseña:</label>
|
||||
<input type="text" id="password_renovar" wire:model="password_renovar"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="disponible"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Disponibilidad:</label>
|
||||
<select name="" id="" wire:model="estado" 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="activo">Pantallas</option>
|
||||
<option value="pendiente">Cuenta completa</option>
|
||||
<option value="inactivo">Inactivo</option>
|
||||
</select>
|
||||
|
||||
|
||||
</div>
|
||||
<div date-rangepicker class="flex items-center gap-2 mb-4">
|
||||
<div class="relative">
|
||||
<label for="fecha_inicial_renovar" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
inicio:</label>
|
||||
<input name="fecha_inicial_renovar" wire:model.defer="fecha_inicial_renovar" type="date"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-blue-500 block w-full dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 datepicker-input">
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<label for="fecha_final_renovar" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
Final:</label>
|
||||
<input name="fecha_final_renovar" wire:model.defer="fecha_final_renovar" type="date"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-blue-500 block w-full dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 datepicker-input">
|
||||
</div>
|
||||
</div>
|
||||
{{ $fecha_final_renovar }}
|
||||
|
||||
<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="saveRenovar()" 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 x-on:click="renovar=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>
|
||||
|
||||
{{-- Modal add user --}}
|
||||
<div x-cloak x-show="addUser" 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-2">
|
||||
<label for="correo " class="block text-gray-700 text-sm font-bold mb-2">Correo:</label>
|
||||
<input wire:model="searchTerm" id="correo" type="text" placeholder="Escribir correo" 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" />
|
||||
|
||||
<select wire:model="selectedOption" 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">
|
||||
|
||||
@if($usuarios)
|
||||
@foreach ($usuarios as $option)
|
||||
<option value="{{ $option->email }}" selected>{{ $option->email }}</option>
|
||||
@endforeach
|
||||
@endif
|
||||
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@if(!empty($consulta_verUsuarios->servicio->perfiles))
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="Perfil " class="block text-gray-700 text-sm font-bold mb-2">Perfil:</label>
|
||||
<select name="" id="" wire:model="perfil" 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">
|
||||
@if($consulta_verUsuarios)
|
||||
<option value="" select>Seleccionar</option>
|
||||
@php
|
||||
$pantallas = $consulta_verUsuarios->servicio->pantallas;
|
||||
@endphp
|
||||
|
||||
@for($i = 1; $i <= $pantallas; $i++)
|
||||
<option value="{{$i}}">Perfil {{$i}}</option>
|
||||
@endfor
|
||||
@endif
|
||||
</select>
|
||||
</div>
|
||||
|
||||
@endif
|
||||
@if(!empty($consulta_verUsuarios->servicio->tarifas ))
|
||||
<label for="tarifa " class="block text-gray-700 text-sm font-bold mb-2">Tarifa:</label>
|
||||
<select name="" id="" wire:model="tarifa" 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="" select>Seleccionar</option>
|
||||
@foreach($consulta_verUsuarios->servicio->tarifas as $tarifaItem )
|
||||
@if($tarifaItem->pantallas == '1' && $tarifaItem->rol_id =='5')
|
||||
@if($tarifaItem->servicio->por_tiempo)
|
||||
<option value="{{$tarifaItem}}">{{ $tarifaItem->servicio->nombre }} - {{ $tarifaItem->dias }} {{ __($tarifaItem->dias == 1 ? 'día' : 'días') }}
|
||||
</option>
|
||||
@else
|
||||
<option value="{{$tarifaItem}}">{{ $tarifaItem->servicio->nombre }} - {{ $tarifaItem->pantallas }} {{ __($tarifaItem->pantallas == 1 ? 'pantalla' : 'pantallas') }} - {{ $tarifaItem->dias }} {{ __($tarifaItem->dias == 1 ? 'día' : 'días') }}
|
||||
</option>
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
</select>
|
||||
@error('tarifa') <p class="text-sm text-red-400">{{ 'Requerido*' }}</p> @enderror
|
||||
@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 wire:click="saveUser()" 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 x-on:click="addUser=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>
|
||||
|
||||
|
||||
{{-- Modal observaciones --}}
|
||||
<div x-cloak x-show="observacionesm" 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 hidden">
|
||||
<input type="number" id="id_observacion" wire:model="id_observacion"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4 mt-4">
|
||||
<label for="observaciones"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Observaciones:</label>
|
||||
<textarea type="text" id="observaciones" wire:model="observaciones"
|
||||
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 h-40 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"></textarea>
|
||||
</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="update" 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 x-on:click="observacionesm=false" wire:click="limpiarInputObservaciones"
|
||||
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 observaciones1 --}}
|
||||
<div x-cloak x-show="observacionesm1" 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 hidden">
|
||||
<input type="number" id="id_observacion1" wire:model="id_observacion1"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4 mt-4">
|
||||
<label for="observaciones1"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Observaciones:</label>
|
||||
<textarea type="text" id="observaciones1" wire:model="observaciones1"
|
||||
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 h-40 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"></textarea>
|
||||
</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="update_observaciones1" 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="limpiarInputObservaciones1" 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 newCuenta --}}
|
||||
|
||||
<div x-cloak x-show="newCuenta" 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="servicioNew" id="servicioNew" wire:model.debounce.500ms="servicio_newCuenta"
|
||||
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>Servicios</option>
|
||||
@foreach ($servicios as $servicio)
|
||||
<option value="{{ $servicio->id }}">{{ $servicio->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
@error('servicio_newCuenta') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
<button x-on:click.prevent="serviciosModal=!serviciosModal" x-transition.duration.300ms
|
||||
class="p-0 w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="usuario_newCuenta" class="block text-gray-700 text-sm font-bold mb-2">Usuario:</label>
|
||||
<input type="email" id="usuario_newCuenta" wire:model="usuario_newCuenta"
|
||||
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('usuario_newCuenta') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="password_newCuenta"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Contraseña:</label>
|
||||
<input type="text" id="password_newCuenta" wire:model="password_newCuenta"
|
||||
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_newCuenta') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="disponible"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Disponibilidad:</label>
|
||||
<select name="" id="" wire:model="estado" 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="activo">Pantallas</option>
|
||||
<option value="pendiente">Cuenta completa</option>
|
||||
<option value="inactivo">Inactivo</option>
|
||||
</select>
|
||||
@error('estado') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
|
||||
</div>
|
||||
|
||||
<div date-rangepicker class="flex items-center gap-2 mb-4">
|
||||
<div class="relative">
|
||||
<label for="fecha_inicial" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
inicio:</label>
|
||||
<input name="fecha_inicial" wire:model.defer="fecha_inicial" type="date"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block w-full dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 datepicker-input">
|
||||
@error('fecha_inicial') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<label for="fecha_final" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
Final:</label>
|
||||
<input name="fecha_final" wire:model.defer="fecha_final" type="date"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block w-full dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500 datepicker-input">
|
||||
@error('fecha_final') <div class="text-red-500 text-sm">{{ 'Requerido*' }}</div> @enderror
|
||||
</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="createNewCuenta" 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="limpiarInputNewCuenta" 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 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>Servicios</option>
|
||||
@foreach ($servicios as $servicio)
|
||||
<option value="{{ $servicio->id }}">{{ $servicio->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<button x-on:click.prevent="serviciosModal=!serviciosModal" x-transition.duration.300ms
|
||||
class="p-0 w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<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">Pantallas</label>
|
||||
<input type="number" id="pantallas_modTarifas" wire:model="pantallas_modTarifas" min="1"
|
||||
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">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>
|
||||
|
||||
<div class="mb-4 grid grid-cols-3">
|
||||
<div class="w-[7rem] flex items-center">
|
||||
<label class="text-gray-500 text-sm mr-2">Dias</label>
|
||||
<input type="number" min="30" id="diasTarifa" wire:model="diasTarifa"
|
||||
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<div class="mb-3 mt-3 flex justify-end">
|
||||
<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>
|
||||
</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]">Rol</th>
|
||||
<th class="font-normal pl-[1rem] whitespace-nowrap">Pantallas</th>
|
||||
<th class="font-normal pl-[1rem]">Valor</th>
|
||||
<th class="font-normal pl-[1rem]">Dias</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]">{{ $tarifa->rol->nombre ?? '' }}</td>
|
||||
<td class="pl-[1rem]">{{ $tarifa->pantallas ?? '' }}</td>
|
||||
<td class="pl-[1rem]">{{ $tarifa->valor ?? '' }}</td>
|
||||
<td class="pl-[1rem]">{{ $tarifa->dias ?? '' }}</td>
|
||||
<td class="pl-[1rem]"><button wire:click="editar({{$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>
|
||||
<!--td class="pl-[1rem]">
|
||||
<svg wire:click="eliminarModTarifa({{ $tarifa->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" class=""><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>
|
||||
|
||||
|
||||
|
||||
<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">Pantallas</label>
|
||||
<input type="number" id="pantallas_modTarifas" wire:model="pantallas_modTarifas" min="1"
|
||||
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">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>
|
||||
|
||||
<div class="mb-4 grid grid-cols-3">
|
||||
<div class="w-[7rem] flex items-center">
|
||||
<label class="text-gray-500 text-sm mr-2">Dias</label>
|
||||
<input type="number" min="30" id="diasTarifa" wire:model="diasTarifa"
|
||||
class="w-full border-2 border-neutral-200 rounded-[0.8rem] focus:ring-0 shadow apperance-none focus:border-neutral-300 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
|
||||
<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>
|
||||
<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>
|
||||
|
||||
{{-- Modal agregar servicios --}}
|
||||
<div x-cloak x-show="serviciosModal" 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 ">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
logo</label>
|
||||
<input type="file" name="imagen_servicios" id="imagen_servicios" wire:model="photo"
|
||||
class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<div
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20"></div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_inicio_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Img inicio
|
||||
</label>
|
||||
<input type="file" name="imagen_inicio_servicios" id="imagen_inicio_servicios" wire:model="photo_inicio"
|
||||
class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo_inicio)
|
||||
<img src="{{ $photo_inicio->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<div
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20"></div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="nombre_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_servicio" wire:model="nombre_servicio"
|
||||
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">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_servicio" wire:model="descripcion_servicio"
|
||||
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"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<select name="estado" id="estado" wire:model.debounce.500ms="estado_servicio"
|
||||
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>Estado</option>
|
||||
<option value="activo">Activo</option>
|
||||
<option value="inactivo">Inactivo</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center">
|
||||
<label for="color_servicio" class="text-gray-700 text-sm font-bold">Color fondo:</label>
|
||||
<input type="color" id="color_servicio" wire:model="color_servicio"
|
||||
class="border-neutral-200 w-full shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</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="createServicio" 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 x-on:click="serviciosModal=false" wire:click="limpiarInputServiciosModal"
|
||||
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>
|
||||
@include('layouts.footer')
|
||||
<script>
|
||||
function copiarAlPortapapeles(id_elemento) {
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", document.getElementById(id_elemento).innerHTML);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(aux);
|
||||
}
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,995 @@
|
||||
<div x-data="{
|
||||
newCategoria: @entangle('newCategoria'),
|
||||
newPromocion: @entangle('newPromocion'),
|
||||
modalComprarPromo: @entangle('modalComprarPromo'),
|
||||
verPromo: @entangle('verPromo'),
|
||||
categorian: @entangle('categorian'),
|
||||
editarPromo: @entangle('editarPromo'),
|
||||
credenciales : @entangle('credenciales'),
|
||||
verPro:false,
|
||||
copiar:''
|
||||
}" class="h-full w-full md: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="add_tarifa_list2,del_item_list2,photo,verPromocion,comprarPromo,editarPromo,editarPromoUpdate,comprar,pagar,create_newCategoria,add_tarifa,del_item,guardar,eliminar">
|
||||
<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-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
|
||||
<div class="flex justify-between my-2 items-center mb-8 scroll">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Promociones
|
||||
</div>
|
||||
@if (auth()->user()->rol->nombre == "super" || auth()->user()->rol->nombre == "administrador")
|
||||
<a x-on:click="newPromocion=true"
|
||||
class="flex text-sm sm:text-base px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8] leading-tight">Nueva
|
||||
promoción
|
||||
<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
|
||||
</div>
|
||||
{{--<div class=" gap-2 hidden sm:flex">
|
||||
<select name="categoria_id" id="categoria_id" wire:model.debounce.500ms="categoria_id"
|
||||
class="w-[8rem] 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 value="" selected>Categoria</option>
|
||||
@foreach ($categorias as $categoria)
|
||||
<option value="{{ $categoria->id }}">{{ $categoria->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div>
|
||||
@if (auth()->user()->rol->nombre == "super" || auth()->user()->rol->nombre == "administrador")
|
||||
<button x-on:click="newCategoria=true" x-transition.duration.300ms
|
||||
class="w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
@endif
|
||||
|
||||
</div>
|
||||
</div>--}}
|
||||
</div>
|
||||
|
||||
<div class="x-auto bg-white grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 shadow-md xl:mx-10 mb-8 ">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione una categoria:</h2>
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div class="slider2 scroll-smooth py-2 px-4 overflow-x-scroll w-full gap-4 " id="content">
|
||||
<table>
|
||||
@foreach ($categorias as $categoria1)
|
||||
<td>
|
||||
<div class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[250px] sm:w-[350px] sm:h-[350px] mx-4"
|
||||
x-on:click="categorian='{{ $categoria1->nombre }}'">
|
||||
|
||||
<img src="{{ asset($categoria1->imagen) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="imagen de {{ $categoria1->nombre}}">
|
||||
|
||||
</div>
|
||||
</td>
|
||||
@endforeach
|
||||
</table>
|
||||
</div>
|
||||
<button class="prev2 p-2 md:p-3 absolute left-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M17.921,1.505a1.5,1.5,0,0,1-.44,1.06L9.809,10.237a2.5,2.5,0,0,0,0,3.536l7.662,7.662a1.5,1.5,0,0,1-2.121,2.121L7.688,15.9a5.506,5.506,0,0,1,0-7.779L15.36.444a1.5,1.5,0,0,1,2.561,1.061Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
<button class="next2 p-2 md:p-3 absolute right-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M6.079,22.5a1.5,1.5,0,0,1,.44-1.06l7.672-7.672a2.5,2.5,0,0,0,0-3.536L6.529,2.565A1.5,1.5,0,0,1,8.65.444l7.662,7.661a5.506,5.506,0,0,1,0,7.779L8.64,23.556A1.5,1.5,0,0,1,6.079,22.5Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
</div>
|
||||
<button x-on:click="verPro=true" class="my-2 mx max-w-sm ml-auto rounded-lg border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Ver todos</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($categorian)
|
||||
<div class="bg-[#f8f8f8] shadow-md rounded-[1.2rem] mb-4 px-4 py-4 ">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione una promocion:</h2>
|
||||
</div>
|
||||
|
||||
<div id="promo" class="grid sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 gap-4 py-2 px-4">
|
||||
|
||||
@foreach ($categorias->where('nombre', $categorian)->first()->promociones as $promocion)
|
||||
@if ($promocion->visible == 'true')
|
||||
@if (empty($usuario=$promocion->usuario_promos->where('usuario_id', Auth::user()->id)->first()))
|
||||
<div class="select-none bg-white shadow-md transition hover:scale-[1.05] hover:shadow-xl cursor-pointer rounded-lg text-center relative object-cover "
|
||||
x-data="{ openOption: false }">
|
||||
<svg x-on:click="openOption=!openOption" 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 absolute right-2 cursor-pointer">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" class="text-white shadow"
|
||||
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>
|
||||
|
||||
<div wire:click="verPromocion({{$promocion->id}})" class="">
|
||||
<img src="{{ asset($promocion->img_publicidad) }}" alt="" class="w-full m-auto rounded-lg object-cover h-24 sm:h-36 object-center shadow">
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div x-cloak x-show="openOption"
|
||||
class="absolute bg-white text-center w-[7rem] top-5 right-[-1rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
@if ( auth()->user()->rol->nombre != "editor")
|
||||
<button x-on:click="openOption=!openOption,ver=true" wire:click="comprarPromo({{ $promocion->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Comprar</button>
|
||||
@endif
|
||||
@if (auth()->user()->rol->nombre == "super" || auth()->user()->rol->nombre == "administrador")
|
||||
<button wire:click="editarPromo({{ $promocion->id }})" x-on:click="openOption=!openOption"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 ">Modificar</button>
|
||||
<button x-on:click="openOption=!openOption" wire:click="eliminar({{ $promocion->id }})"
|
||||
class="text-white w-full py-1 bg-[#ff5050] rounded-b-[1rem] hover:bg-[#fd2828] hover:rounded-b-[1rem]">Eliminar</button>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@else
|
||||
|
||||
@if ($usuario->visible == 'true')
|
||||
|
||||
<div class="select-none bg-white shadow-md transition hover:scale-[1.05] hover:shadow-xl cursor-pointer rounded-lg text-center relative object-cover "
|
||||
x-data="{ openOption: false }">
|
||||
<svg x-on:click="openOption=!openOption" 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 absolute right-2 cursor-pointer">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" class="text-white shadow"
|
||||
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>
|
||||
|
||||
<div wire:click="verPromocion({{$promocion->id}})" class="">
|
||||
<img src="{{ asset($promocion->img_publicidad) }}" alt="" class="w-full m-auto rounded-lg object-cover h-24 sm:h-44 object-center shadow">
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div x-cloak x-show="openOption"
|
||||
class="absolute bg-white text-center w-[7rem] top-5 right-[-1rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
@if ( auth()->user()->rol->nombre != "editor")
|
||||
<button x-on:click="openOption=!openOption,ver=true" wire:click="comprarPromo({{ $promocion->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Comprar</button>
|
||||
@endif
|
||||
@if (auth()->user()->rol->nombre == "super" || auth()->user()->rol->nombre == "administrador")
|
||||
<button wire:click="editarPromo({{ $promocion->id }})" x-on:click="openOption=!openOption"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 ">Modificar</button>
|
||||
<button x-on:click="openOption=!openOption" wire:click="eliminar({{ $promocion->id }})"
|
||||
class="text-white w-full py-1 bg-[#ff5050] rounded-b-[1rem] hover:bg-[#fd2828] hover:rounded-b-[1rem]">Eliminar</button>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@endif
|
||||
|
||||
|
||||
@endif
|
||||
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
{{-- Modal agregar promocion--}}
|
||||
<div x-cloak x-show="newPromocion" 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 overflow-y-auto">
|
||||
<div class="bg-white px-4 pt-5 pb-4 sm:p-6 sm:pb-4 rounded-[1rem] shadow-md">
|
||||
<div class="mb-4 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_promocion"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label>
|
||||
<input type="file" accept="image" id="imagen_promocion" wire:model="photo"
|
||||
class="hidden border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@error('photo') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
@else
|
||||
<img src="" alt=""
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@error('photo') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="nombre_promocion" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_promocion" wire:model="nombre_promocion"
|
||||
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_promocion') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_promocion"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_promocion" wire:model="descripcion_promocion"
|
||||
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"></textarea>
|
||||
@error('descripcion_promocion') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="mensaje_servicio" class="block text-gray-700 text-sm font-bold mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje_servicio" wire:model.defer="mensaje_servicio" 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"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<div>
|
||||
<label for="valor_promocion" class="block text-gray-700 text-sm font-bold mb-2">Valor:</label>
|
||||
<input name="valor_promocion" wire:model="valor_promocion" type="number" min="0"
|
||||
placeholder="$0"
|
||||
class="w-[10rem] border-2 border-neutral-200 shadow rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block datepicker-input">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block select-none text-white text-sm font-bold mb-2">Estado:</label>
|
||||
<select name="estado_promocion" id="estado_promocion" wire:model="estado_promocion"
|
||||
class="w-[10rem] 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 value="true" selected>Estado</option>
|
||||
<option value="true">Activo</option>
|
||||
<option value="false">Inactivo</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<div class="relative">
|
||||
<label for="fecha_limite_promocion" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
limite:</label>
|
||||
<input name="fecha_limite_promocion" wire:model.defer="fecha_limite_promocion" type="date"
|
||||
class="border-2 border-neutral-200 shadow rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block w-full datepicker-input">
|
||||
@error('fecha_limite_promocion') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block select-none text-white text-sm font-bold mb-2">Categoria:</label>
|
||||
<select name="categoria_id_promocion" id="categoria_id_promocion"
|
||||
wire:model.debounce.500ms="categoria_id_promocion"
|
||||
class="w-[8rem] 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 value="" selected>Categoria</option>
|
||||
@foreach ($categorias as $categoria)
|
||||
<option value="{{ $categoria->id }}">{{ $categoria->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
|
||||
<button x-on:click.prevent="newCategoria=true" x-transition.duration.300ms
|
||||
class="w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="flex justify-between">
|
||||
<select name="tarifa_id_promocion" id="tarifa_id_promocion"
|
||||
wire:model.debounce.500ms="tarifa_id_promocion"
|
||||
class="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 value="" selected>Tarifas</option>
|
||||
@foreach ($tarifas as $tarifa)
|
||||
<option value="{{ $tarifa->id }}">{{ $tarifa->servicio->nombre ?? '' }} :
|
||||
@if( $tarifa->servicio->nombre == 'Youtube Premium' || $tarifa->servicio->nombre=='Spotify Premium')
|
||||
{{ $tarifa->dias ?? '' }} Dias
|
||||
@else
|
||||
{{ $tarifa->pantallas ?? '' }} pantallas
|
||||
@endif
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div class="mx-auto">
|
||||
<button wire:click="add_tarifa" 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">Añadir</button>
|
||||
</div>
|
||||
</div>
|
||||
@error('list') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
<div class="mb-4 h-16 overflow-y-auto flex sm:justify-evenly gap-5">
|
||||
<table class="w-full text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 ">
|
||||
@if (!empty($list))
|
||||
@php
|
||||
$n = 0;
|
||||
@endphp
|
||||
@foreach ($list as $tarifaServicios)
|
||||
<tr class="text-left mt-2 w-full border-white border-b-gray-300 border ">
|
||||
<td class="pl-[1rem] w-1/4 whitespace-nowrap ">
|
||||
{{ $tarifaServicios['nombre'] ?? '' }} -
|
||||
|
||||
@if( $tarifaServicios['nombre'] == 'Youtube Premium' || $tarifaServicios['nombre'] =='Spotify Premium')
|
||||
{{ $tarifaServicios['dias'] ?? '' }} Dias.
|
||||
@else
|
||||
{{ $tarifaServicios['cantidad'] ?? '' }} P.
|
||||
@endif
|
||||
</td>
|
||||
|
||||
<td class="pl-[1rem] w-1/4 whitespace-nowrap">
|
||||
<button wire:click="del_item({{ $id = $n }})"
|
||||
x-transition.duration.300ms
|
||||
class=" text-center text-white w-7 h-7 float-right bg-red-500 rounded-full hover:bg-red-600 active:shadow-lg mouse shadow transition ease-in duration-200 focus:outline-none">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none"
|
||||
viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
|
||||
class="w-4 inline-block">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
@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 wire:click="guardar" 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 x-on:click="newPromocion=false" wire:click="limpiarInputPromocion" 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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal agregar categoria --}}
|
||||
{{--<div x-cloak x-show="newCategoria" 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-30">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_categoria"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label>
|
||||
<input type="file" accept="image" id="imagen_categoria" wire:model="categoria_photo"
|
||||
class="hidden border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
<div>
|
||||
|
||||
@if ($categoria_photo)
|
||||
<img src="{{$categoria_photo->temporaryUrl()}}" alt="" class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@endif
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="nombre_categoria"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_categoria" wire:model="nombre_categoria"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_categoria"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_categoria" wire:model="descripcion_categoria"
|
||||
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"></textarea>
|
||||
</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="create_newCategoria" 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="limpiarInputPromocion" x-onclick="newCategoria=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>
|
||||
</form>
|
||||
</div>
|
||||
</div>--}}
|
||||
|
||||
{{-- Modal ver promno --}}
|
||||
<div x-cloak x-show="verPromo" 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=" backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full fixed z-20">
|
||||
<div class="grid h-full place-items-center">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/3 lg:1/3 xl:w-1/4">
|
||||
{{-- PHOTO --}}
|
||||
<div class="w-full text-left text-white px-4 bg-cover py-2 rounded-lg h-64 bg-[url({{asset($this->imagen)}})] ">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="text-left">
|
||||
|
||||
<div class="mx-8">
|
||||
<div class="mt-4 grid grid-cols-2 mb-4 items-center">
|
||||
<div>
|
||||
<h1 class="text-left font-bold text-lg">{{$nombrePromo}}</h1>
|
||||
</div>
|
||||
<div class="justify-self-end">
|
||||
<h1 class="flex gap-2 items-center font-bold"> <p> ${{number_format($precioAhora)}}</p></h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm text-gray-500">
|
||||
<p>{{$descripcionPromo}}</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-2 mb-3">
|
||||
<span>
|
||||
<button x-on:click ="modalComprarPromo=true,verPromo=false" wire:loading.attr="disabled" 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 sm-text-sm sm-leading-5">Comprar</button>
|
||||
</span>
|
||||
<span>
|
||||
<button x-on:click="verPromo=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal editar promo --}}
|
||||
<div x-cloak x-show="editarPromo" 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=" backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full fixed z-20 overflow-y-auto">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_promocion"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label>
|
||||
<input type="file" accept="image" id="imagen_promocion" wire:model="photo"
|
||||
class="hidden border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</div>
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<img src="{{ asset($img_ver)}}" alt=""
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex gap-2">
|
||||
|
||||
<div>
|
||||
<div class="mb-4">
|
||||
<label for="nombre_editarPromo" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_editarPromo" wire:model="nombre_editarPromo"
|
||||
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">
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_editarPromo"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_editarPromo" wire:model="descripcion_editarPromo"
|
||||
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"></textarea>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="mensaje_servicio" class="block text-gray-700 text-sm font-bold mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje_servicio" wire:model.defer="mensaje_servicio" 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"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<div>
|
||||
<label for="valor_editarPromo" class="block text-gray-700 text-sm font-bold mb-2">Valor:</label>
|
||||
<input name="valor_editarPromo" wire:model="valor_editarPromo" type="number" min="0"
|
||||
placeholder="$0"
|
||||
class="w-[10rem] border-2 border-neutral-200 shadow rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block datepicker-input">
|
||||
</div>
|
||||
<div>
|
||||
<label class="block select-none text-white text-sm font-bold mb-2">Estado:</label>
|
||||
<select name="estado_promocion" id="estado_promocion" wire:model="estado_editarPromo"
|
||||
class="w-[10rem] 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 value="true" selected>Estado</option>
|
||||
<option value="true">Activo</option>
|
||||
<option value="false">Inactivo</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 mb-4">
|
||||
<div class="relative">
|
||||
<label for="fecha_limite_promocion" class="block text-gray-700 text-sm font-bold mb-2">Fecha
|
||||
limite:</label>
|
||||
<input name="fecha_limite_promocion" wire:model.defer="fecha_editarPromo" type="date"
|
||||
class="border-2 border-neutral-200 shadow rounded-[0.8rem] px-4 py-2 text-gray-900 sm:text-sm focus:border-neutral-300 focus:outline-none focus:shadow-outline focus:ring-0 block w-full datepicker-input">
|
||||
<div hidden class="text-sm text-gray-400">
|
||||
{{$fecha_editarPromo}}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label class="block select-none text-white text-sm font-bold mb-2">Categoria:</label>
|
||||
<select name="categoria_id_promocion" id="categoria_id_promocion"
|
||||
wire:model.debounce.500ms="categoria_id_editarPromo"
|
||||
class="w-[8rem] 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 value="" selected>Categoria</option>
|
||||
@foreach ($categorias as $categoria)
|
||||
<option value="{{ $categoria->id }}">{{ $categoria->nombre ?? '' }}</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<button x-on:click.prevent="newCategoria=true" x-transition.duration.300ms
|
||||
class="w-10 h-10 float-right bg-[#B221FD] hover:bg-[#7a02b8] rounded-full active:shadow-lg mouse shadow ease-in focus:outline-none">
|
||||
<svg viewBox="0 0 20 20" enable-background="new 0 0 20 20" class="w-6 h-6 inline-block">
|
||||
<path fill="#FFFFFF"
|
||||
d="M16,10c0,0.553-0.048,1-0.601,1H11v4.399C11,15.951,10.553,16,10,16c-0.553,0-1-0.049-1-0.601V11H4.601
|
||||
C4.049,11,4,10.553,4,10c0-0.553,0.049-1,0.601-1H9V4.601C9,4.048,9.447,4,10,4c0.553,0,1,0.048,1,0.601V9h4.399
|
||||
C15.952,9,16,9.447,16,10z" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="flex justify-between mt-6">
|
||||
<select name="tarifa_id_promocion" id="tarifa_id_promocion"
|
||||
wire:model.debounce.500ms="tarifa_id_promocion"
|
||||
class="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 value="" selected>Tarifas</option>
|
||||
@foreach ($tarifas as $tarifa)
|
||||
<option value="{{ $tarifa->id }}">{{ $tarifa->servicio->nombre ?? '' }} :
|
||||
@if(!empty($tarifa->servicio->por_tiempo))
|
||||
{{ $tarifa->dias ?? '' }} {{ $tarifa->dias == 1 ? 'día' : 'días' }}
|
||||
|
||||
@else
|
||||
{{ $tarifa->pantallas ?? '' }} {{ $tarifa->pantallas == 1 ? 'pantalla' : 'pantallas' }} - {{ $tarifa->dias ?? '' }} {{ $tarifa->dias == 1 ? 'día' : 'días' }}
|
||||
|
||||
@endif
|
||||
</option>
|
||||
@endforeach
|
||||
</select>
|
||||
<div class="mx-auto">
|
||||
<button wire:click="add_tarifa_list2" 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">Añadir</button>
|
||||
</div>
|
||||
</div>
|
||||
@error('list') <span class="text-red-400 text-sm">Obligatorio*</span> @enderror
|
||||
<div class="mb-4 overflow-y-auto flex sm:justify-evenly gap-5">
|
||||
<table class="w-full text-center">
|
||||
<thead>
|
||||
<tr>
|
||||
<th></th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 ">
|
||||
@if (!empty($list2))
|
||||
@php
|
||||
$n = 0;
|
||||
@endphp
|
||||
@foreach ($list2 as $lista)
|
||||
<tr class="text-left mt-2 w-full border-white border-b-gray-300 border ">
|
||||
<td class="pl-[1rem] w-1/4 whitespace-nowrap ">
|
||||
{{ $lista['nombre'] ?? '' }} - {{ $lista['cantidad'] ?? '' }} P. - {{ $lista['dias'] ?? '' }} D.
|
||||
</td>
|
||||
|
||||
<td class="pl-[1rem] w-1/4 whitespace-nowrap">
|
||||
<button wire:click="del_item_list2({{$lista['identificador']}},'{{ $n }}')"
|
||||
x-transition.duration.300ms
|
||||
class=" text-center text-white w-7 h-7 float-right bg-red-500 rounded-full hover:bg-red-600 active:shadow-lg mouse shadow transition ease-in duration-200 focus:outline-none">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none"
|
||||
viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor"
|
||||
class="w-4 inline-block">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M6 18L18 6M6 6l12 12" />
|
||||
</svg>
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
@endforeach
|
||||
@endif
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</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="editarPromoUpdate" 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 x-on:click="editarPromo=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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal comprar promo --}}
|
||||
<div x-cloak x-show="modalComprarPromo" 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=" backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full fixed z-20">
|
||||
<div class="grid h-full place-items-center">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
<div class="w-full Text-left text-white px-4 bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500 py-2 rounded-lg">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
{{$nombrePromo}}
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{$dias}} Dias
|
||||
</p>
|
||||
<p>
|
||||
${{number_format($precioAhora)}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<p>
|
||||
Información del cliente:
|
||||
</p>
|
||||
<p class="text-xs text-gray-400">
|
||||
Ingrese los datos del cliente final.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="mb-4">
|
||||
<label for="nombre_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_comprarPromo" wire:model="nombre_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('nombre_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="celular_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Celular:</label>
|
||||
<input type="text" id="celular_comprarPromo" wire:model="celular_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('celular_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="mb-4">
|
||||
<label for="email_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">E-mail:</label>
|
||||
<input type="email" id="email_comprarPromo" wire:model="email_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('email_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="cantidad_comprarPromo" class="block text-gray-700 text-sm font-bold mb-2">Cantidad:</label>
|
||||
<input type="number" id="cantidad_comprarPromo" min="1" wire:model="cantidad_comprarPromo" class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-1/2 py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('cantidad_comprarPromo') <span class="text-red-400 text-sm ">Requerido*</span> @enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<p class="text-xs text-gray-400">
|
||||
Este servicio vencerá el {{$fechaFinal}} en {{$dias_comprarPromo}} Dias
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<div class="border-2 flex text-gray-400 text-xs text-center justify-center gap-2 py-3 rounded-lg md:mx-3 2xl:mx-6">
|
||||
El valor de ${{number_format($total=((int)$precioAhora*(int)$cantidad_comprarPromo))}} será descontado de su saldo. <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 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z" fill="#9f9f9f" data-original="#000000"></path><path d="M12,5a1,1,0,0,0-1,1v8a1,1,0,0,0,2,0V6A1,1,0,0,0,12,5Z" fill="#9f9f9f" data-original="#000000"></path><rect x="11" y="17" width="2" height="2" rx="1" fill="#9f9f9f" data-original="#000000"></rect></g></svg>
|
||||
</div>
|
||||
@if ($total > auth()->user()->saldo->valor)
|
||||
<div class=" flex text-red-400 text-xs text-center justify-center gap-2 py-2 rounded-lg md:mx-2 2xl:mx-6">
|
||||
<p class=""> No tiene fondo suficientes para esta compra, recargue su cuenta.</p> <a href="{{route('recarga')}}"><button class="bg-green-600 text-white rounded px-2 py-1">Recargar</button></a>
|
||||
</div>
|
||||
@endif
|
||||
</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="pagar" type="button" @if ( $total <= auth()->user()->saldo->valor) 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 sm-text-sm sm-leading-5" @else disabled class="cursor-no-drop inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-gray-200 hover:bg-gray-200 focus:shadow-outline-green sm-text-sm sm-leading-5" @endif >Comprar</button>
|
||||
</span>
|
||||
<span>
|
||||
<button x-on:click="modalComprarPromo=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- Modal credenciales --}}
|
||||
<div x-cloak x-show="credenciales"
|
||||
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=" backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full fixed z-20">
|
||||
<div class="grid h-full place-items-center overflow-y-auto">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
<div class="w-full Text-left text-white px-4 py-2 rounded-lg"
|
||||
style="background: rgb(0,0,0);
|
||||
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, , rgba(20,20,20,1) 100%);">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
{{$this->nombrePromo}}
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{$this->dias }} Dias
|
||||
</p>
|
||||
<p>
|
||||
${{number_format($this->precioAhora)}}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<div class="text-sm my-1">
|
||||
{!!$mensaje_servicio!!}
|
||||
<br>
|
||||
{!!$msj->msj_compra!!}
|
||||
</div>
|
||||
<div>
|
||||
<p>
|
||||
Información de cuentas:
|
||||
</p>
|
||||
</div>
|
||||
<div class="text-xs text-gray-400">
|
||||
@php
|
||||
$n=0;
|
||||
@endphp
|
||||
|
||||
@if ($cuentas)
|
||||
@foreach ($cuentas->cuentas->unique() as $cuenta)
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
|
||||
<div class="shadow-md rounded-lg py-3 px-6 mx-8 flex " >
|
||||
<div>
|
||||
<h1 class="mt-4">
|
||||
<div class="font-semibold text-gray-700">{{ $cuenta->servicio->nombre }} :</div>
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
- URL: <span class="font-semibold text-gray-600">{{ $cuenta->servicio->url}}</span>
|
||||
@else
|
||||
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if ($cuentas->id == $perfil->historial_id)
|
||||
- Perfil <span class="font-semibold text-gray-600">{{ $perfil->perfil }}</span>
|
||||
@if (!empty($cuenta->servicio->perfiles))
|
||||
@switch( $perfil->perfil)
|
||||
|
||||
@case(1)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_1 }}</span>
|
||||
@break
|
||||
@case(2)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_2 }}</span>
|
||||
@break
|
||||
@case(3)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_3 }}</span>
|
||||
@break
|
||||
@case(4)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_4 }}</span>
|
||||
@break
|
||||
@case(5)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_5 }}</span>
|
||||
@break
|
||||
@case(6)
|
||||
: <span class="font-semibold text-gray-600">{{ $msj->clave_6 }}</span>
|
||||
@break
|
||||
@default
|
||||
|
||||
@endswitch
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@endif
|
||||
|
||||
</h1>
|
||||
|
||||
<h1 class="mt-4">
|
||||
Usuario: <p class="font-semibold text-gray-600">{{ $cuenta->correo }}</p>
|
||||
</h1>
|
||||
<h1 class="mt-4">
|
||||
Contraseña: <p class="font-semibold text-gray-600">{{ $cuenta->password }}
|
||||
</p>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<button class="" onclick="copiarAlPortapapeles2({{$n}})"><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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="hidden" id="{{$n}}">{{ $cuenta->servicio->nombre }} - email: {{ $cuenta->correo }} - Pass: {{ $cuenta->password }}</p>
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
|
||||
<textarea id="d" class="hidden">
|
||||
{{$mensaje_servicio}}
|
||||
{{$msj->msj_wp}}
|
||||
@foreach ($cuentas->cuentas->unique() as $cuenta)
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
*URL:* {{ $cuenta->servicio->url }} @else
|
||||
*Servicio:* {{$cuenta->servicio->nombre}} @foreach ($cuenta->perfil as $perfil) @if ($cuentas->id == $perfil->historial_id && $cuenta->estado == 'activo') - Perfil {{ $perfil->perfil }} @if (!empty($cuenta->servicio->perfiles)) @switch( $perfil->perfil) @case(1) : {{ $msj->clave_1 }} @break @case(2) : {{ $msj->clave_2 }} @break @case(3) : {{ $msj->clave_3 }} @break @case(4) : {{ $msj->clave_4 }} @break @case(5) : {{ $msj->clave_5 }} @break @case(6) :{{ $msj->clave_6 }} @break @default @endswitch @endif @endif @endforeach
|
||||
*Usuario:* {{ $cuenta->correo }}
|
||||
*Contraseña:* {{ $cuenta->password }} @endif
|
||||
|
||||
@endforeach
|
||||
|
||||
|
||||
|
||||
</textarea>
|
||||
<div class="w-full text-center">
|
||||
<button class="text-center text-sm text-green-500 font-semibold border px-3 py-2 hover:bg-green-400 hover:text-white border-green-500 rounded mx-auto my-2" onclick="copyToClipboard2()">Copiar todo
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<h1 class="flex mt-4 gap-1">
|
||||
Este servicio vencerá el <p class="font-semibold text-gray-600">
|
||||
{{ Carbon\Carbon::parse($cuentas->fecha_final)->format('Y/m/d') ?? ''}}</p>
|
||||
</h1>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
</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 x-on:click="credenciales=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal ver promociones --}}
|
||||
<div x-cloak x-show="verPro" 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-10">
|
||||
<div class="overflow-auto h-full ">
|
||||
|
||||
<div class="grid sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 gap-3 py-2 px-4 ">
|
||||
|
||||
|
||||
@foreach ($categorias as $categoria1)
|
||||
|
||||
<div class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[250px] sm:w-[350px] sm:h-[350px] mx-4 my-2 mx-auto"
|
||||
x-on:click="categorian='{{ $categoria1->nombre }}',verPro=false">
|
||||
<a href="#promo">
|
||||
<img src="{{ asset($categoria1->imagen) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="">
|
||||
</a>
|
||||
|
||||
</div>
|
||||
|
||||
@endforeach
|
||||
|
||||
<span class="absolute z-40 top-0 right-0 md:right-[48%]">
|
||||
<button type="button" x-on:click="verPro=false"
|
||||
class="inline-flex justify-center w-full rounded-l-md md:rounded-md rounded-b-md border border-transparent px-4 py-2 text-white bg-[#ff5050] hover:bg-[#fd3737] ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
|
||||
function copiarAlPortapapeles2(id_elemento) {
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", document.getElementById(id_elemento).innerHTML);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(aux);
|
||||
}
|
||||
|
||||
|
||||
|
||||
const prev2 = document.querySelector('.prev2')
|
||||
const next2 = document.querySelector('.next2')
|
||||
const slider2 = document.querySelector('.slider2')
|
||||
|
||||
prev2.addEventListener('click', () => {
|
||||
slider2.scrollLeft -= 600
|
||||
})
|
||||
|
||||
next2.addEventListener('click', () => {
|
||||
slider2.scrollLeft += 600
|
||||
})
|
||||
|
||||
function copyToClipboard2() {
|
||||
var copyText = document.getElementById("d").value;
|
||||
navigator.clipboard.writeText(copyText).then(() => {
|
||||
// Alert the user that the action took place.
|
||||
// Nobody likes hidden stuff being done under the hood!
|
||||
//alert("Copied to clipboard");
|
||||
});
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,134 @@
|
||||
<div x-data="{nequi:@entangle('nequi') , valor_recarga: @entangle('valor_recarga') }">
|
||||
<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="verPromocion,comprarPromo,editarPromo,editarPromoUpdate,comprar,pagar,create_newCategoria,add_tarifa,del_item,guardar,eliminar">
|
||||
<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] mt-5 w-[90%] m-auto p-5 rounded-[1.2rem] border-b border-gray-200 shadow-md mb-4 relative">
|
||||
<div class="flex justify-start my-2 items-center mb-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</svg>
|
||||
Saldo
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2">
|
||||
<div class="bg-white w-full sm:w-[26rem] m-auto justify-center rounded-xl shadow-md">
|
||||
<div class="text-center bg-[#000029] text-white text-lg font-semibold rounded-lg py-2 mb-4">
|
||||
Recargar saldo
|
||||
</div>
|
||||
<form action="/recargas" method="post" class="text-center">
|
||||
@csrf
|
||||
<div class="flex justify-center mb-4">
|
||||
Saldo actual: <p class="font-semibold"> ${{ number_format($user->saldo->valor) }}</p>
|
||||
</div>
|
||||
<div class="mt-2">
|
||||
Monto a recargar
|
||||
</div>
|
||||
<div>
|
||||
<input type="tel" name="recharge" wire:model="valor_recarga" placeholder="$20.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">
|
||||
|
||||
@if($valor_recarga)
|
||||
<div class="flex text-sm justify-center">Tu valor a pagar seria: $<p>
|
||||
|
||||
{{$nuevo_valor = (((($valor_recarga)*0.03) + '700' )* 0.19)+ ((($valor_recarga)*0.03) + '700' ) + $valor_recarga}}
|
||||
|
||||
|
||||
</p>
|
||||
|
||||
</div>
|
||||
@endif
|
||||
<p class="text-sm text-green-600 py-2 ">Se sumara $700 COP+ IVA + 3% adicional al pago en Mercado Pago por costos de sistema.</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-white px-4 py-3 md:flex justify-center mt-4 mb-4">
|
||||
<span>
|
||||
<button type="submit"
|
||||
class="inline-flex justify-center w-full rounded-md border border-transparent px-8 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">Continuar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<!--div class="w-full text-center my-4">
|
||||
<p class="font-semibold">ó</p>
|
||||
<p class="mx-auto">Pagar con : </p>
|
||||
|
||||
<a href="{{url('wompi/'.((float)$valor_recarga+(float)$monto))}}" target="_blank" >
|
||||
<img class="w-80 p mx-auto " src="./img/wompi_1.png" alt="wompi">
|
||||
</a>
|
||||
|
||||
@if($cobrar)
|
||||
<p class="text-sm text-green-600 ">Se sumara $500 COP adicional al pago en Wompi por costos de sistema.</p>
|
||||
@endif
|
||||
|
||||
|
||||
</div-->
|
||||
|
||||
<!--div class="w-full text-center my-4">
|
||||
<p class="font-semibold">ó</p>
|
||||
<p class="mx-auto">Pagar con : </p>
|
||||
|
||||
<img x-on:click="nequi=!nequi" class="w-28 rounded-full shadow-lg mx-auto " src="./img/nequi.jpg" alt="nequi">
|
||||
</div-->
|
||||
|
||||
</div>
|
||||
|
||||
<div class="overflow-y-auto">
|
||||
<p class="text-center text-sm">Historial</p>
|
||||
<table class="text-center bg-white rounded-lg shadow-md m-auto mt-4 mb-4 border-separate border-spacing-y-2">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[2rem]">Fecha</th>
|
||||
<th class="font-normal pl-[2rem]">Valor</th>
|
||||
<th class="rounded-r-lg font-normal pl-[2rem] pr-[2rem]">Estado</th>
|
||||
</tr>
|
||||
</thead>
|
||||
@php
|
||||
$i = 0;
|
||||
@endphp
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@foreach ($historial_recargas as $historial_recarga)
|
||||
<tr class="border-gray-200 text-left w-full pl-4">
|
||||
{{-- <td class="pl-[2rem]">{{date("d/m/Y", strtotime($historial_recarga->created_at))}}</td> --}}
|
||||
<td class="pl-[2rem]">{{date("d/m/Y",strtotime($historial_recarga->created_at))}}</td>
|
||||
<td class="pl-[2rem]">${{ number_format($historial_recarga->monto) }}</td>
|
||||
<td class="pl-[2rem] pr-[2rem]">{{$historial_recarga->status}}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{--Modal nequi ---}}
|
||||
<div x-cloak x-show="nequi"
|
||||
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=" backdrop-blur-sm bg-black/20 left-0 bottom-0 top-0 right-0 h-full fixed z-20">
|
||||
<div class="grid h-full place-items-center overflow-y-auto">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,99 @@
|
||||
<div>
|
||||
<div class="bg-[#f5f5f5] mt-5 w-[90%] m-auto p-5 rounded-[1.2rem] border-b border-gray-200 shadow-md mb-4 relative">
|
||||
|
||||
<div class="flex justify-start my-2 items-center mb-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</svg>
|
||||
Saldo
|
||||
</div>
|
||||
</div>
|
||||
@php
|
||||
// SDK de Mercado Pago
|
||||
require base_path('vendor/autoload.php');
|
||||
// Agrega credenciales
|
||||
MercadoPago\SDK::setAccessToken(config('services.mercadopago.token'));
|
||||
|
||||
|
||||
// Crea un objeto de preferencia
|
||||
$preference = new MercadoPago\Preference();
|
||||
|
||||
//$payment_methods = MercadoPago::get("/v1/payment_methods");
|
||||
// Crea un ítem en la preferencia
|
||||
$item = new MercadoPago\Item();
|
||||
$item->title = 'Recarga SrPremium';
|
||||
$item->quantity = 1;
|
||||
$item->unit_price = $monto;
|
||||
$preference->external_reference = $referencia;
|
||||
$preference->back_urls = array(
|
||||
|
||||
"success" => url('/orders/'),
|
||||
"failure" => url('/orders/'),
|
||||
"pending" => url('/orders/')
|
||||
);
|
||||
$preference->auto_return = "approved";
|
||||
$preference->items = array($item);
|
||||
$preference->save();
|
||||
|
||||
|
||||
@endphp
|
||||
|
||||
<div class="grid grid-cols-1 mb-8">
|
||||
<div class="bg-white w-full sm:w-[26rem] m-auto justify-center rounded-xl 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 mb-6">
|
||||
Monto a recargar
|
||||
<p class="font-semibold">
|
||||
${{number_format($monto)}}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<a href="javascript:location.reload()">
|
||||
<img class="w-28 rounded-full shadow-lg" src="./img/mercadopago.jpg" alt="">
|
||||
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="bg-white px-4 py-3 md:flex justify-center mt-2 mb-4">
|
||||
<a href="javascript:location.reload()">
|
||||
<button class="inline-flex justify-center w-full rounded-md border border-transparent px-12 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">Continuar</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="cho-container">
|
||||
|
||||
</div>
|
||||
|
||||
<script src="https://sdk.mercadopago.com/js/v2"></script>
|
||||
|
||||
<script>
|
||||
const mp = new MercadoPago("{{config('services.mercadopago.key')}}", {
|
||||
locale: 'es-CO'
|
||||
});
|
||||
|
||||
mp.checkout({
|
||||
preference: {
|
||||
id: '{{$preference->id}}'
|
||||
},
|
||||
|
||||
autoOpen: true, // Habilita la apertura automática del Checkout Pro
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,110 @@
|
||||
<div class="bg-white overflow-y-auto md:w-[95%] m-auto p-2 md:p-5 rounded-[1.2rem] border-b border-gray-200 shadow-md relative h-[95%] ">
|
||||
<div class="flex justify-between my-2 items-center mb-4">
|
||||
<div class="flex items-center md:gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Reportes
|
||||
</div>
|
||||
</div>
|
||||
@if (auth()->user()->rol->nombre == "super" || auth()->user()->rol->nombre == "administrador")
|
||||
<select wire:model="usuario" name="usr" id="usr"
|
||||
class="lg:w-1/6 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 value="">Total</option>
|
||||
@foreach($roles->usuarios as $usuario)
|
||||
<option value="{{$usuario->id}}">{{$usuario->name}}</option>
|
||||
@endforeach
|
||||
|
||||
</select>
|
||||
|
||||
@endif
|
||||
<select wire:model="mes" name="mes" id="mes"
|
||||
class="lg:w-1/6 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 value="">MES</option>
|
||||
<option value="01">ENERO</option>
|
||||
<option value="02">FEBRERO</option>
|
||||
<option value="03">MARZO</option>
|
||||
<option value="04">ABRIL</option>
|
||||
<option value="05">MAYO</option>
|
||||
<option value="06">JUNIO</option>
|
||||
<option value="07">JULIO</option>
|
||||
<option value="08">AGOSTO</option>
|
||||
<option value="09">SEPTIEMBRE</option>
|
||||
<option value="10">OCTUBRE</option>
|
||||
<option value="11">NOVIEMBRE</option>
|
||||
<option value="12">DICIEMBRE</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="text-center py-2">
|
||||
Mis ventas
|
||||
</div>
|
||||
<div class="overflow-y-auto max-h-96">
|
||||
<div class="bg-white rounded-lg lg:w-[30rem] mx-auto">
|
||||
<div class="flex text-center text-4xl">
|
||||
<p class="w-1/2 border-r border-r-gray-300/30 self-center py-8">
|
||||
{{ $cantidad }}
|
||||
</p>
|
||||
<p class="w-1/2 text-xl self-center py-8">
|
||||
${{ number_format($suma) }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="flex text-center text-white bg-[#000029] rounded-lg">
|
||||
<p class="w-1/2 border-r border-r-gray-300/30 py-2 self-center">
|
||||
Compras Realizadas
|
||||
</p>
|
||||
<p class="w-1/2 py-2 self-center">
|
||||
Valor
|
||||
</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center pt-4 pb-2">
|
||||
Transacciones Paquetes
|
||||
</div>
|
||||
<table class="text-center rounded-lg shadow-lg m-auto mt-4 mb-4 bg-white ">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9 pr-4 sm:pr-2">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[1rem] md:pl-[2rem]">Fecha</th>
|
||||
<th class="font-normal sm:pl-[2rem] hidden sm:table-cell">Valor</th>
|
||||
<th class="font-normal sm:pl-[2rem] hidden sm:table-cell">Estado</th>
|
||||
|
||||
<th class="rounded-r-lg font-normal pr-[1rem] pl-[1rem] sm:pr-[2rem] sm:pl-[2rem] ">Detalle</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none pr-4 sm:pr-2">
|
||||
@foreach ($historiales as $historial)
|
||||
<tr class="border-gray-200 text-left w-full sm:pl-4 " x-data="{openOption:false}">
|
||||
|
||||
<td class="sm:pl-[2rem] hidden sm:table-cell">
|
||||
{{$historial->fecha_inicio}}
|
||||
</td>
|
||||
<td class="sm:pl-[2rem] hidden sm:table-cell">
|
||||
{{$historial->valor}}
|
||||
</td>
|
||||
<td class=" pl-[1rem] sm:pl-[2rem]">
|
||||
{{$historial->estado}}
|
||||
</td>
|
||||
<td class="md:pl-[2rem] md:pr-[2rem]">
|
||||
@if(!empty($historial->tarifa_id))
|
||||
{{$historial->tarifa->pantallas ?? ''}} {{ $historial->tarifa->servicio->nombre ?? ''}}
|
||||
@endif
|
||||
|
||||
@if(!empty($historial->promocion_id))
|
||||
{{ $historial->promocion->nombre ?? ''}}
|
||||
@endif
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
{{ $historiales->links() }}
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,156 @@
|
||||
<div x-data="{ add : @entangle('add'),
|
||||
editar : @entangle('editar'),
|
||||
}" 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="crear,actualizar,editar,eliminar,limpiarInputAdd,limpiarInputEdit">
|
||||
<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-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4 ">
|
||||
<div class="grid grid-cols-1 sm:flex justify-between my-2 items-center">
|
||||
<div class="grid grid-cols-1 sm:flex items-center gap-3 md:gap-8">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Roles
|
||||
</div>
|
||||
<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
|
||||
rol
|
||||
<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>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
{{-- -Tabla usuarios - --}}
|
||||
<div class=" max-h-full max-w-3xl mx-auto">
|
||||
<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 bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[2rem]">Nombre</th>
|
||||
<th class="font-normal pl-[2rem]">Usuarios</th>
|
||||
<th class="rounded-r-lg font-normal"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@foreach ($roles as $rol)
|
||||
<tr class="border-gray-200 text-left w-full pl-4 hover:bg-gray-200 hover:ring-gray-500" x-data="{ openOption: false }">
|
||||
<td class="pl-[2rem]">{{ $rol->nombre ?? '' }}</td>
|
||||
|
||||
<td class="pl-[2rem]">{{ $rol->usuarios_count ?? '' }}</td>
|
||||
|
||||
<td class="pl-2">
|
||||
<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">
|
||||
<button x-on:click="openOption=false" wire:click="editar({{$rol->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=false" wire:click="eliminar({{$rol->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>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
{{-- Añadir rol --}}
|
||||
<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">
|
||||
</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 rol --}}
|
||||
<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"
|
||||
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">
|
||||
</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="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>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,525 @@
|
||||
<div x-data="{
|
||||
serviciosModal: @entangle('serviciosModal'),
|
||||
serviciosEditar: @entangle('serviciosEditar'),
|
||||
tiempo: @entangle('tiempo'),
|
||||
ver_url: @entangle('ver_url')
|
||||
}" class="h-full w-full md: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="editar">
|
||||
<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=" fixed backdrop-blur-sm bg-white/70 left-0 bottom-0 top-0 right-0 h-full z-40" wire:loading
|
||||
wire:target="desactivar">
|
||||
<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">Desactivando servicio..</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="eliminar">
|
||||
<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">Eliminando servicio..</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="guardar">
|
||||
<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">Actulizando servicio..</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="createServicio">
|
||||
<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">Creando servicio..</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bg-[#f5f5f5] md:w-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
<div class="flex justify-between my-2 items-center">
|
||||
<div class="flex items-center gap-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Planes
|
||||
</div>
|
||||
<a x-on:click="serviciosModal = true"
|
||||
class="flex px-4 py-2 rounded-lg cursor-pointer text-white bg-[#B221FD] hover:bg-[#7a02b8]">
|
||||
<p class="text-sm md:text-base">Nuevo servicio </p>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mt-2">
|
||||
<h1 class="text-center text-lg sm:mb-4">Servicios</h1>
|
||||
<div class="py-2">
|
||||
<table class="text-center rounded-lg shadow-lg m-auto mt-4 mb-4 bg-white md:w-10/12">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9 pr-4 sm:pr-2">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal w-1/12 pr-[1rem] md:pl-[2rem]">Logo</th>
|
||||
<th class="font-normal w-1/12 sm:pr-[2rem] hidden sm:table-cell">ID</th>
|
||||
<th class="font-normal w-1/12 sm:pr-[2rem] hidden sm:table-cell">Nombre</th>
|
||||
<th class="font-normal w-1/12 sm:pr-[2rem] hidden sm:table-cell">Pantallas</th>
|
||||
<th class="font-normal w-1/12 sm:pr-[2rem] hidden sm:table-cell">Completas</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">Estado</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">Solo por tiempo</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">Mostrar perfiles</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">Contraseña de perfiles</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">URL</th>
|
||||
<th class="font-normal w-1/12 pl-[1rem] sm:pr-[2rem]">Renovación</th>
|
||||
<th class="rounded-r-lg font-normal pr-[1rem] pl-[1rem] sm:pr-[2rem] sm:pl-[2rem] w-1/11">
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none pr-4 sm:pr-2">
|
||||
@foreach ($servicios as $servicio)
|
||||
<tr class="border-gray-200 text-left w-full sm:pl-4 hover:bg-gray-200 hover:ring-gray-500"
|
||||
x-data="{ openOption: false }">
|
||||
<td class="sm:pl-[2rem] w-full py-2">
|
||||
<img src="{{ asset($servicio->img) }}"
|
||||
class=" w-24 sm:w-28 m-auto rounded-lg object-cover h-12 sm:h-14 object-center shadow"
|
||||
alt="">
|
||||
</td>
|
||||
<td class="sm:pr-[2rem] hidden sm:table-cell">
|
||||
{{ $servicio->id }}
|
||||
</td>
|
||||
<td class="sm:pr-[2rem] hidden sm:table-cell">
|
||||
{{ $servicio->nombre }}
|
||||
</td>
|
||||
<td class="sm:pr-[2rem] hidden sm:table-cell">
|
||||
{{ $servicio->pantallas }}
|
||||
</td>
|
||||
<td class="sm:pr-[2rem] hidden sm:table-cell">
|
||||
{{ $servicio->completa }}
|
||||
</td>
|
||||
<td class=" pr-[1rem] sm:pl-[2rem]">
|
||||
{{ $servicio->estado }}
|
||||
</td>
|
||||
<td class=" pl-[1rem] sm:pl-[2rem] text-center border-x">
|
||||
@if ($servicio->por_tiempo)
|
||||
<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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
@endif
|
||||
</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem] text-center border-x">
|
||||
@if ($servicio->ver_perfiles)
|
||||
<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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
@endif
|
||||
</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem] text-center border-x">
|
||||
@if ($servicio->perfiles)
|
||||
<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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
@endif
|
||||
</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem] text-center border-x">
|
||||
{{ $servicio->url ?? '' }}
|
||||
|
||||
</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem] text-center border-x">
|
||||
|
||||
@if ($servicio->renovacion)
|
||||
<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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M9 12.75L11.25 15 15 9.75M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
|
||||
</svg>
|
||||
@endif
|
||||
|
||||
</td>
|
||||
<td class="md:pl-[2rem] md:pr-[2rem]">
|
||||
<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="right-0 sm:right-auto absolute bg-white text-center w-[8rem] rounded-[1rem] border-b border-gray-200 shadow-lg">
|
||||
<button x-on:click="openOption=false,serviciosEditar=true"
|
||||
wire:click="editar({{ $servicio->id }})"
|
||||
class="text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 hover:rounded-t-[1rem]">Editar</button>
|
||||
@if ($servicio->estado != 'activo')
|
||||
<button x-on:click="openOption=false"
|
||||
wire:click="activar({{ $servicio->id }})"
|
||||
class="hover:fill-white fill-gray-500 flex justify-center items-center gap-2 text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 ">Activar</button>
|
||||
@else
|
||||
<button x-on:click="openOption=false"
|
||||
wire:click="desactivar({{ $servicio->id }})"
|
||||
class="hover:fill-white fill-gray-500 flex justify-center items-center gap-2 text-gray-500 w-full py-1 hover:bg-gray-200 border-b border-gray-300 ">Desactivar</button>
|
||||
@endif
|
||||
<button x-on:click="openOption=false"
|
||||
wire:click="eliminar({{ $servicio->id }})"
|
||||
class="text-white w-full py-1 bg-[#ff5050] rounded-b-[1rem] hover:bg-[#fd2828] hover:rounded-b-[1rem]">Eliminar</button>
|
||||
</div>
|
||||
</td>
|
||||
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
{{-- Modal agregar servicios --}}
|
||||
<div x-cloak x-show="serviciosModal" 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 overflow-y-auto ">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label>
|
||||
<input type="file" name="imagen_servicios" id="imagen_servicios" wire:model="photo"
|
||||
class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<div class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20"></div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_inicio_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Img
|
||||
inicio
|
||||
</label>
|
||||
<input type="file" name="imagen_inicio_servicios" id="imagen_inicio_servicios"
|
||||
wire:model="photo_inicio" class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo_inicio)
|
||||
<img src="{{ $photo_inicio->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<div class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20"></div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="nombre_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_servicio" wire:model="nombre_servicio"
|
||||
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_servicio')
|
||||
<span class="text-red-400 text-sm ">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="my-2 border-y">
|
||||
<label for="perfiles" class=" text-gray-700 text-sm font-bold mb-2 ">Mostrar perfiles</label>
|
||||
<input type="checkbox" name="perfiles" id="perfiles" wire:model="perfiles">
|
||||
<label for="password" class=" text-gray-700 text-sm font-bold mb-2 ">¿Contraseña?</label>
|
||||
<input type="checkbox" name="password" id="password" wire:model="password">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="my-2 border-y">
|
||||
<label for="solo_tiempo" class=" text-gray-700 text-sm font-bold mb-2 ">Solo por
|
||||
tiempo</label>
|
||||
<input type="checkbox" name="solo_tiempo" id="solo_tiempo" wire:model="tiempo">
|
||||
<label for="renovacion" class=" text-gray-700 text-sm font-bold mb-2 ">Renovación</label>
|
||||
<input type="checkbox" name="renovacion" id="renovacion" wire:model="renovacion">
|
||||
</div>
|
||||
|
||||
<div x-transition x-show="!tiempo">
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="pantallas"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Pantallas:</label>
|
||||
<input type="text" id="pantallas" wire:model="pantallas"
|
||||
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('pantallas')
|
||||
<span class="text-red-400 text-sm">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="pantallas"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Completa:</label>
|
||||
<input type="text" id="pantallas" wire:model="completa"
|
||||
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('completa')
|
||||
<span class="text-red-400 text-sm">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-2 border-y">
|
||||
<label for="ver_url" class=" text-gray-700 text-sm font-bold mb-2 ">URL</label>
|
||||
<input type="checkbox" name="ver_url" id="ver_url" wire:model="ver_url">
|
||||
<div x-transition x-show="ver_url">
|
||||
<input type="text" id="url" placeholder="url" wire:model="url"
|
||||
class="my-2 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">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_servicio" wire:model="descripcion_servicio"
|
||||
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"></textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<select name="estado" id="estado" wire:model.debounce.500ms="estado_servicio"
|
||||
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>Estado</option>
|
||||
<option value="activo">Activo</option>
|
||||
<option value="inactivo">Inactivo</option>
|
||||
</select>
|
||||
@error('estado_servicio')
|
||||
<div class="text-red-400 text-sm">Requerido*</div>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="mensaje_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje_servicio" wire:model.defer="mensaje_servicio"
|
||||
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"></textarea>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center">
|
||||
<label for="color_servicio" class="text-gray-700 text-sm font-bold">Color fondo:</label>
|
||||
<input type="color" id="color_servicio" wire:model="color_servicio"
|
||||
class="border-neutral-200 w-full shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</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="createServicio" 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 x-on:click="serviciosModal=false" wire:click="limpiarInputServiciosModal"
|
||||
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 editar servicios --}}
|
||||
<div x-cloak x-show="serviciosEditar" 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">
|
||||
<div class="grid h-full place-items-center overflow-y-auto ">
|
||||
<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 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Subir
|
||||
img</label>
|
||||
<input type="file" name="imagen_servicios" id="imagen_servicios" wire:model="photo"
|
||||
class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo)
|
||||
<img src="{{ $photo->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<img src="{{ $img }}" alt=""
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center justify-items-center">
|
||||
<div>
|
||||
<label for="imagen_inicio_servicios"
|
||||
class="text-white bg-[#B221FD] hover:bg-[#7a02b8] px-3 py-1 rounded-md cursor-pointer">Img
|
||||
inicio
|
||||
</label>
|
||||
<input type="file" name="imagen_inicio_servicios" id="imagen_inicio_servicios"
|
||||
wire:model="photo_inicio" class="hidden">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($photo_inicio)
|
||||
<img src="{{ $photo_inicio->temporaryUrl() }}" alt=""
|
||||
class="object-cover rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@else
|
||||
<img src="{{ $img_inicio }}" alt=""
|
||||
class="rounded-xl border-2 border-neutral-200 shadow-md w-28 h-20">
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="nombre_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_servicio" wire:model="nombre_servicio"
|
||||
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_servicio')
|
||||
<span class="text-red-400 text-sm">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="my-2 border-y">
|
||||
<label for="perfiles" class=" text-gray-700 text-sm font-bold mb-2 ">Mostrar perfiles</label>
|
||||
<input type="checkbox" name="perfiles" id="perfiles" wire:model="perfiles">
|
||||
<label for="password" class=" text-gray-700 text-sm font-bold mb-2 ">¿Contraseña?</label>
|
||||
<input type="checkbox" name="password" id="password" wire:model="password">
|
||||
</div>
|
||||
|
||||
<div class="my-2 border-y">
|
||||
<label for="solo_tiempo" class=" text-gray-700 text-sm font-bold mb-2 ">Solo por
|
||||
tiempo</label>
|
||||
<input type="checkbox" name="solo_tiempo" id="solo_tiempo" wire:model="tiempo">
|
||||
<label for="renovacion" class=" text-gray-700 text-sm font-bold mb-2 ">Renovación</label>
|
||||
<input type="checkbox" name="renovacion" id="renovacion" wire:model="renovacion">
|
||||
</div>
|
||||
|
||||
<div x-transition x-show="!tiempo">
|
||||
<div class="mb-4">
|
||||
<label for="pantallas"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Pantallas:</label>
|
||||
<input type="text" id="pantallas" wire:model="pantallas"
|
||||
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('pantallas')
|
||||
<span class="text-red-400 text-sm">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="completas"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">completas:</label>
|
||||
<input type="text" id="completas" wire:model="completa"
|
||||
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('completa')
|
||||
<span class="text-red-400 text-sm">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="my-2 border-y">
|
||||
<label for="ver_url" class=" text-gray-700 text-sm font-bold mb-2 ">URL</label>
|
||||
<input type="checkbox" name="ver_url" id="ver_url" wire:model="ver_url">
|
||||
<div x-transition x-show="ver_url">
|
||||
<input type="text" id="url" placeholder="url" wire:model="url"
|
||||
class="my-2 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">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="descripcion_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Descripción:</label>
|
||||
<textarea type="text" id="descripcion_servicio" wire:model="descripcion_servicio"
|
||||
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"></textarea>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="mb-4">
|
||||
<select name="estado" id="estado" wire:model.debounce.500ms="estado_servicio"
|
||||
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>Estado</option>
|
||||
<option value="activo">Activo</option>
|
||||
<option value="inactivo">Inactivo</option>
|
||||
</select>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="mb-4">
|
||||
<label for="mensaje_servicio"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Mensaje:</label>
|
||||
<textarea type="text" id="mensaje_servicio" wire:model.defer="mensaje_servicio"
|
||||
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"></textarea>
|
||||
</div>
|
||||
|
||||
@error('estado_servicio')
|
||||
<div class="text-red-400 text-sm">Requerido*</div>
|
||||
@enderror
|
||||
|
||||
<div class="mb-4 grid grid-cols-2 items-center">
|
||||
<label for="color_servicio" class="text-gray-700 text-sm font-bold">Color fondo:</label>
|
||||
<input type="color" id="color_servicio" wire:model="color_servicio"
|
||||
class="border-neutral-200 w-full shadow apperance-none focus:border-neutral-300 focus:ring-0 leading-tight focus:outline-none focus:shadow-outline">
|
||||
</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="guardar" 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 x-on:click="serviciosEditar=false" wire:click="limpiarInputServiciosModal"
|
||||
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>
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
@@ -0,0 +1,690 @@
|
||||
<div x-data="{ tarjetaPlan: @entangle('tarjetaPlan'), credenciales: @entangle('credenciales'), vista: true, servicio: @entangle('servicio'), verServ: @entangle('verServ') }" 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="comprar">
|
||||
<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">Adquiriendo paquetes</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="cargartarjetaPlan">
|
||||
<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="flex max-w-lg mx-auto">
|
||||
<button x-on:click="vista=true" :class="vista ? 'bg-[#7a02b8]' : 'bg-[#B221FD]'"
|
||||
class="mx inline-flex justify-center w-full border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Servicios</button>
|
||||
<button x-on:click="vista=false" :class="!vista ? 'bg-[#7a02b8]' : 'bg-[#B221FD]'"
|
||||
class="mx inline-flex justify-center w-full border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Promociones</button>
|
||||
|
||||
</div>
|
||||
|
||||
<div x-cloak x-show="vista" class="bg-[#f5f5f5] md:w-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4">
|
||||
<div class="flex justify-start my-2 items-center">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Servicios
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- tabla productos --}}
|
||||
<div
|
||||
class="x-auto bg-white grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 shadow-md xl:mx-10 mb-8 ">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione un servicio:</h2>
|
||||
</div>
|
||||
|
||||
<div class="relative">
|
||||
<div class="slider scroll-smooth py-2 px-4 overflow-x-scroll w-full gap-4 " id="content">
|
||||
<table>
|
||||
@foreach ($servicios as $servicio1)
|
||||
<td>
|
||||
<button
|
||||
class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[100px] sm:w-[350px] sm:h-[200px] mx-4"
|
||||
wire:click="consultaTarifa({{ $servicio1 }})">
|
||||
<img src="{{ asset($servicio1->img) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="">
|
||||
<!--p>{{ $servicio1->nombre }}</p-->
|
||||
</button>
|
||||
</td>
|
||||
@endforeach
|
||||
</table>
|
||||
</div>
|
||||
<button class="prev p-2 md:p-3 absolute left-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M17.921,1.505a1.5,1.5,0,0,1-.44,1.06L9.809,10.237a2.5,2.5,0,0,0,0,3.536l7.662,7.662a1.5,1.5,0,0,1-2.121,2.121L7.688,15.9a5.506,5.506,0,0,1,0-7.779L15.36.444a1.5,1.5,0,0,1,2.561,1.061Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
<button class="next p-2 md:p-3 absolute right-0 top-1/3 rounded-full bg-[#B221FD]"><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 md:w-7" x="0"
|
||||
y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512"
|
||||
xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M6.079,22.5a1.5,1.5,0,0,1,.44-1.06l7.672-7.672a2.5,2.5,0,0,0,0-3.536L6.529,2.565A1.5,1.5,0,0,1,8.65.444l7.662,7.661a5.506,5.506,0,0,1,0,7.779L8.64,23.556A1.5,1.5,0,0,1,6.079,22.5Z"
|
||||
fill="#ffffff" data-original="#000000" />
|
||||
</g>
|
||||
</svg></button>
|
||||
</div>
|
||||
<button x-on:click="verServ=true"
|
||||
class="my-2 mx max-w-sm ml-auto rounded-lg border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-[#B221FD] hover:bg-[#7a02b8] focus:shadow-outline-green sm-text-sm sm-leading-5">Ver
|
||||
todos</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
@if ($servicio)
|
||||
<div class="bg-[#f8f8f8] shadow-md rounded-[1.2rem] mb-4 px-4 py-4">
|
||||
<div class="mb-2">
|
||||
<h2>Seleccione un plan:</h2>
|
||||
</div>
|
||||
<div class="grid sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-4 lg:gap-8">
|
||||
|
||||
@foreach ($servicio['tarifas'] as $tarifa)
|
||||
@php
|
||||
$this->tarifa = $tarifa;
|
||||
@endphp
|
||||
@if ($tarifa['estado'] == 'activo')
|
||||
@if ($con = $tarifa['usuario_tarifas'])
|
||||
@if ($con[0]['visible'] == 'true')
|
||||
<button wire:click="cargartarjetaPlan({{ $tarifa['id'] }})"
|
||||
class="shadow-lg text-white py-4 px-3 rounded-lg bg-gradient-to-br from-black
|
||||
(via-[{{ $servicio['color_fondo'] }}],90%) to-[{{ $servicio['color_fondo'] }}]">
|
||||
|
||||
<p class="font-bold mb-2">
|
||||
@if ($servicio['por_tiempo'] == 1)
|
||||
{{ $servicio['nombre'] }}
|
||||
@else
|
||||
{{ $servicio['nombre'] }} - {{ $tarifa['pantallas'] }}
|
||||
{{ $tarifa['pantallas'] == 1 ? 'pantalla' : 'pantallas' }}
|
||||
@endif
|
||||
|
||||
</p>
|
||||
|
||||
<div class="flex items-center justify-around">
|
||||
<div>
|
||||
<p class="text-sm text-left">
|
||||
{{ $tarifa['dias'] }}
|
||||
{{ $tarifa['dias'] == 1 ? 'Día' : 'Días' }}
|
||||
|
||||
</p>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="border px-2 py-1 rounded">
|
||||
<p class="text-left text-lg sm:text-xl font-semibold ">
|
||||
|
||||
${{ number_format($con[0]['precio']) }}
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</button>
|
||||
@endif
|
||||
@else
|
||||
<button wire:click="cargartarjetaPlan({{ $tarifa['id'] }})"
|
||||
class="shadow-lg text-white py-4 px-3 rounded-lg bg-gradient-to-br from-black (via-[{{ $servicio['color_fondo'] }}],90%) to-[{{ $servicio['color_fondo'] }}]">
|
||||
|
||||
<p class="font-bold mb-2">
|
||||
@if ($servicio['por_tiempo'] == 1)
|
||||
{{ $servicio['nombre'] }}
|
||||
@else
|
||||
{{ $servicio['nombre'] }} - {{ $tarifa['pantallas'] }}
|
||||
{{ $tarifa['pantallas'] == 1 ? 'pantalla' : 'pantallas' }}
|
||||
@endif
|
||||
|
||||
</p>
|
||||
|
||||
<div class="flex items-center justify-around">
|
||||
<div>
|
||||
<p class="text-sm text-left">
|
||||
{{ $tarifa['dias'] }} {{ $tarifa['dias'] == 1 ? 'Día' : 'Días' }}
|
||||
|
||||
|
||||
</p>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="border px-2 py-1 rounded">
|
||||
<p class="text-left text-lg sm:text-xl font-semibold ">
|
||||
|
||||
${{ number_format($tarifa['valor']) }}
|
||||
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</button>
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
{{-- Modal agregar servicios --}}
|
||||
<div x-cloak x-show="tarjetaPlan" 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 z-10">
|
||||
<div class="grid h-full place-items-center">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4">
|
||||
<div class="w-full Text-left text-white px-4 py-2 rounded-lg"
|
||||
style="background: rgb(0,0,0);
|
||||
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, {{ $colorFondo_tarjetaPlan }} 0%, rgba(20,20,20,1) 100%);">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
@if ($tiempo_tarjetaPlan)
|
||||
{{ $servicio_tarjetaPlan }}
|
||||
@else
|
||||
{{ $servicio_tarjetaPlan }} - {{ $pantallas_tarjetaPlan }}
|
||||
{{ $pantallas_tarjetaPlan == 1 ? 'pantalla' : 'pantallas' }}
|
||||
@endif
|
||||
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{ $dias_tarjetaPlan }} {{ $dias_tarjetaPlan == 1 ? 'Día' : 'Días' }}
|
||||
|
||||
</p>
|
||||
<p>
|
||||
${{ number_format($valor_tarjetaPlan) }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<p>
|
||||
Información del cliente:
|
||||
</p>
|
||||
<p class="text-xs text-gray-400">
|
||||
Ingrese los datos del cliente final.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="mb-4">
|
||||
<label for="nombre_tarjetaPlan"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Nombre:</label>
|
||||
<input type="text" id="nombre_tarjetaPlan" wire:model="nombre_tarjetaPlan"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('nombre_tarjetaPlan')
|
||||
<span class="text-red-400 text-sm ">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="celular_tarjetaPlan"
|
||||
class="block text-gray-700 text-sm font-bold mb-2">Celular:</label>
|
||||
<input type="text" id="celular_tarjetaPlan" wire:model="celular_tarjetaPlan"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('celular_tarjetaPlan')
|
||||
<span class="text-red-400 text-sm ">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-between text-left gap-2">
|
||||
<div class="">
|
||||
<label for="email_tarjetaPlan"
|
||||
class="block text-gray-700 text-sm font-bold ">E-mail:</label>
|
||||
<input type="email" id="email_tarjetaPlan" wire:model="email_tarjetaPlan"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-full py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
@error('email_tarjetaPlan')
|
||||
<span class="text-red-400 text-sm ">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<label for="cantidad_tarjetaPlan"
|
||||
class="block text-gray-700 text-sm font-bold ">Cantidad:</label>
|
||||
<input type="number" id="cantidad_tarjetaPlan" min="1"
|
||||
wire:model="cantidad_tarjetaPlan"
|
||||
class="border-2 border-neutral-200 rounded-[0.8rem] shadow apperance-none focus:border-neutral-300 w-1/2 py-2 px-3 focus:ring-0 text-gray-700 leading-tight focus:outline-none focus:shadow-outline">
|
||||
|
||||
@error('cantidad_tarjetaPlan')
|
||||
<span class="text-red-400 text-sm ">Requerido*</span>
|
||||
@enderror
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-sm text-green-600 italic text-center mb-2">
|
||||
|
||||
{{ $disponibles < 0 ? 0 : (int) $disponibles }}
|
||||
{{ $disponibles == 1 ? 'plan disponible' : 'planes disponibles' }} para esta cantidad </div>
|
||||
<div class="mb-4">
|
||||
<p class="text-xs text-gray-400 text-center">
|
||||
|
||||
Este servicio vencerá el
|
||||
{{ $fechaFinal ? $fechaFinal->format('d/m/Y \a \l\a\s h:i A') : '' }} en
|
||||
{{ $dias_tarjetaPlan }} {{ $dias_tarjetaPlan == 1 ? 'día' : 'días' }}
|
||||
|
||||
</p>
|
||||
</div>
|
||||
<div class="mb-4">
|
||||
<div
|
||||
class="border-2 flex text-gray-400 text-xs text-center justify-center gap-2 py-3 rounded-lg md:mx-3 2xl:mx-6">
|
||||
El valor de
|
||||
${{ number_format($total = (int) $valor_tarjetaPlan * (int) $cantidad_tarjetaPlan) }} será
|
||||
descontado de su saldo. <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 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M12,0A12,12,0,1,0,24,12,12.013,12.013,0,0,0,12,0Zm0,22A10,10,0,1,1,22,12,10.011,10.011,0,0,1,12,22Z"
|
||||
fill="#9f9f9f" data-original="#000000"></path>
|
||||
<path d="M12,5a1,1,0,0,0-1,1v8a1,1,0,0,0,2,0V6A1,1,0,0,0,12,5Z" fill="#9f9f9f"
|
||||
data-original="#000000"></path>
|
||||
<rect x="11" y="17" width="2" height="2"
|
||||
rx="1" fill="#9f9f9f" data-original="#000000"></rect>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
@if ($total > auth()->user()->saldo->valor)
|
||||
<div
|
||||
class=" flex text-red-400 text-xs text-center justify-center gap-2 py-2 rounded-lg md:mx-2 2xl:mx-6">
|
||||
<p class=""> No tiene fondo suficientes para esta compra, recargue su cuenta.</p>
|
||||
<a href="{{ route('recarga') }}"><button
|
||||
class="bg-green-600 text-white rounded px-2 py-1">Recargar</button></a>
|
||||
</div>
|
||||
@endif
|
||||
</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">
|
||||
@if (auth()->user()->rol->nombre != 'editor')
|
||||
<span>
|
||||
<button wire:click="comprar" type="button" wire:loading.attr="disabled"
|
||||
@if ($cantidad_tarjetaPlan <= (int) $disponibles && $total <= auth()->user()->saldo->valor) 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 sm-text-sm sm-leading-5" @else disabled class="cursor-no-drop inline-flex justify-center w-full rounded-md border border-transparent px-4 py-2 sm:mb-[0] mb-2 text-white bg-gray-200 hover:bg-gray-200 focus:shadow-outline-green sm-text-sm sm-leading-5" @endif>
|
||||
Comprar
|
||||
</button>
|
||||
</span>
|
||||
@endif
|
||||
<span>
|
||||
<button x-on:click="tarjetaPlan=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal credenciales --}}
|
||||
<div x-cloak x-show="credenciales" 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-10">
|
||||
<div class="grid h-full place-items-center overflow-y-auto">
|
||||
<div class="bg-white rounded-lg shadow-md sm:1/2 md:1/2 lg:1/3 xl:w-1/4 overflow-y-auto">
|
||||
<div class="w-full Text-left text-white px-4 py-2 rounded-lg"
|
||||
style="background: rgb(0,0,0);
|
||||
background: linear-gradient(0deg, rgba(0,0,0,1) 0%, {{ $colorFondo_tarjetaPlan }} 0%, rgba(20,20,20,1) 100%);">
|
||||
<p class="font-bold text-lg mb-2">
|
||||
@if (!empty($servicio_t->por_tiempo))
|
||||
@if ($servicio_t->por_tiempo == true)
|
||||
{{ $servicio_tarjetaPlan }}
|
||||
@else
|
||||
{{ $servicio_tarjetaPlan }} - {{ $pantallas_tarjetaPlan }}
|
||||
{{ $pantallas_tarjetaPlan == 1 ? 'pantalla' : 'pantallas' }}
|
||||
@endif
|
||||
@endif
|
||||
</p>
|
||||
<div class="flex justify-between">
|
||||
<p>
|
||||
{{ $dias_tarjetaPlan }} Dias
|
||||
</p>
|
||||
<p>
|
||||
${{ number_format($valor_tarjetaPlan) }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="px-4 py-4">
|
||||
<div class="mb-4">
|
||||
<div class="text-sm my-1">
|
||||
{!! $mensaje !!}
|
||||
<br>
|
||||
{!! $msj->msj_compra !!}
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p>
|
||||
Información de cuentas:
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="text-xs text-gray-400 h-auto overflow-y-auto">
|
||||
|
||||
|
||||
@if ($cuentas)
|
||||
|
||||
@php
|
||||
$n = 0;
|
||||
@endphp
|
||||
|
||||
@foreach ($cuentas->cuentas->unique() as $cuenta)
|
||||
@php
|
||||
$n++;
|
||||
@endphp
|
||||
<div class="shadow-md rounded-lg py-3 px-6 mx-8 flex">
|
||||
<div>
|
||||
<h1 class="mt-4">
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
- URL: <span
|
||||
class="font-semibold text-gray-600">{{ $cuenta->servicio->url }}</span>
|
||||
@else
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if (!empty($cuenta->servicio->ver_perfiles))
|
||||
@if ($cuentas->id == $perfil->historial_id && $cuenta->estado == 'activo')
|
||||
- Perfil <span
|
||||
class="font-semibold text-gray-600">{{ $perfil->perfil }}</span>
|
||||
|
||||
@if (!empty($cuenta->servicio->perfiles))
|
||||
@switch($perfil->perfil)
|
||||
@case(1)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_1 }}</span>
|
||||
@break
|
||||
|
||||
@case(2)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_2 }}</span>
|
||||
@break
|
||||
|
||||
@case(3)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_3 }}</span>
|
||||
@break
|
||||
|
||||
@case(4)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_4 }}</span>
|
||||
@break
|
||||
|
||||
@case(5)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_5 }}</span>
|
||||
@break
|
||||
|
||||
@case(6)
|
||||
: <span
|
||||
class="font-semibold text-gray-600">{{ $msj->clave_6 }}</span>
|
||||
@break
|
||||
|
||||
@default
|
||||
@endswitch
|
||||
@endif
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
@endif
|
||||
</h1>
|
||||
<h1 class="mt-4">
|
||||
Usuario: <p class="font-semibold text-gray-600">{{ $cuenta->correo }}
|
||||
</p>
|
||||
</h1>
|
||||
<h1 class="mt-4">
|
||||
Contraseña: <p class="font-semibold text-gray-600">
|
||||
{{ $cuenta->password }}
|
||||
</p>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<button class=""
|
||||
onclick="copiarAlPortapapeles({{ $n }})"><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">
|
||||
<path stroke-linecap="round" stroke-linejoin="round"
|
||||
d="M15.75 17.25v3.375c0 .621-.504 1.125-1.125 1.125h-9.75a1.125 1.125 0 01-1.125-1.125V7.875c0-.621.504-1.125 1.125-1.125H6.75a9.06 9.06 0 011.5.124m7.5 10.376h3.375c.621 0 1.125-.504 1.125-1.125V11.25c0-4.46-3.243-8.161-7.5-8.876a9.06 9.06 0 00-1.5-.124H9.375c-.621 0-1.125.504-1.125 1.125v3.5m7.5 10.375H9.375a1.125 1.125 0 01-1.125-1.125v-9.25m12 6.625v-1.875a3.375 3.375 0 00-3.375-3.375h-1.5a1.125 1.125 0 01-1.125-1.125v-1.5a3.375 3.375 0 00-3.375-3.375H9.75" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<p class="hidden" id="{{ $n }}">{{ $cuenta->servicio->nombre }} :
|
||||
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
- URL: {{ $cuenta->servicio->url }}
|
||||
@else
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if (!empty($cuenta->servicio->ver_perfiles))
|
||||
@if ($cuentas->id == $perfil->historial_id && $cuenta->estado == 'activo')
|
||||
- Perfil {{ $perfil->perfil }}
|
||||
@if (!empty($cuenta->servicio->perfiles))
|
||||
@switch($perfil->perfil)
|
||||
@case(1)
|
||||
: {{ $msj->clave_1 }}
|
||||
@break
|
||||
|
||||
@case(2)
|
||||
: {{ $msj->clave_2 }}
|
||||
@break
|
||||
|
||||
@case(3)
|
||||
: {{ $msj->clave_3 }}
|
||||
@break
|
||||
|
||||
@case(4)
|
||||
: {{ $msj->clave_4 }}
|
||||
@break
|
||||
|
||||
@case(5)
|
||||
: {{ $msj->clave_5 }}
|
||||
@break
|
||||
|
||||
@case(6)
|
||||
: {{ $msj->clave_6 }}
|
||||
@break
|
||||
|
||||
@default
|
||||
@endswitch
|
||||
@endif
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
@endif - email: {{ $cuenta->correo }} - Pass:
|
||||
{{ $cuenta->password }}
|
||||
</p>
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
<textarea id="c" class="hidden">
|
||||
{{ $mensaje }}
|
||||
{{ $msj->msj_wp ?? '' }}
|
||||
@foreach ($cuentas->cuentas->unique() as $cuenta)
|
||||
@if (!empty($cuenta->servicio->ver_url))
|
||||
*URL:* {{ $cuenta->servicio->url }}
|
||||
@else
|
||||
@foreach ($cuenta->perfil as $perfil)
|
||||
@if (!empty($cuenta->servicio->ver_perfiles))
|
||||
@if ($cuentas->id == $perfil->historial_id && $cuenta->estado == 'activo')
|
||||
*Perfil {{ $perfil->perfil }}* @if (!empty($cuenta->servicio->perfiles))
|
||||
@switch($perfil->perfil)
|
||||
@case(1)
|
||||
: {{ $msj->clave_1 }}
|
||||
@break
|
||||
|
||||
@case(2)
|
||||
: {{ $msj->clave_2 }}
|
||||
@break
|
||||
|
||||
@case(3)
|
||||
: {{ $msj->clave_3 }}
|
||||
@break
|
||||
|
||||
@case(4)
|
||||
:{{ $msj->clave_4 }}
|
||||
@break
|
||||
|
||||
@case(5)
|
||||
: {{ $msj->clave_5 }}
|
||||
@break
|
||||
|
||||
@case(6)
|
||||
: {{ $msj->clave_6 }}
|
||||
@break
|
||||
|
||||
@default
|
||||
@endswitch
|
||||
@endif
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
@endif
|
||||
|
||||
*Usuario:* {{ trim($cuenta->correo) }}
|
||||
*Contraseña:* {{ trim($cuenta->password) }}
|
||||
@endforeach
|
||||
|
||||
</textarea>
|
||||
|
||||
|
||||
|
||||
<div class="text-center">
|
||||
<button
|
||||
class="text-center text-sm text-green-500 font-semibold border px-3 py-2 hover:bg-green-400 hover:text-white border-green-500 rounded mx-auto my-2"
|
||||
onclick="copyToClipboard()">Copiar todo
|
||||
</button>
|
||||
</div>
|
||||
|
||||
|
||||
<h1 class="flex mt-4 gap-1">
|
||||
Este servicio vencerá el <p class="font-semibold text-gray-600">
|
||||
|
||||
{{ Carbon\Carbon::parse($cuentas->fecha_final)->format('Y/m/d') ?? '' }}.</p>
|
||||
</h1>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
</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 x-on:click="credenciales=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 sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- Modal ver servicio --}}
|
||||
<div x-cloak x-show="verServ" 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-10">
|
||||
<div class="overflow-auto h-full ">
|
||||
|
||||
<table class="max-w-xl bg-white mx-auto relative">
|
||||
<tbody>
|
||||
|
||||
@foreach ($servicios as $servicio1)
|
||||
<tr>
|
||||
<td>
|
||||
<button
|
||||
class="cursor-pointer transition hover:scale-[1.05] w-[250px] h-[100px] sm:w-[350px] sm:h-[200px] mx-4"
|
||||
wire:click="consultaTarifa({{ $servicio1 }})">
|
||||
<img src="{{ asset($servicio1->img) }}"
|
||||
class="w-full m-auto rounded-lg object-cover h-full object-center shadow"
|
||||
alt="">
|
||||
<!--p>{{ $servicio1->nombre }}</p-->
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
<span class="absolute z-40 top-0 right-0 md:right-[48%]">
|
||||
<button wire:click="" type="button" x-on:click="verServ=false"
|
||||
class="inline-flex justify-center w-full rounded-l-md md:rounded-md rounded-b-md border border-transparent px-4 py-2 text-white bg-[#ff5050] hover:bg-[#fd3737] ease-in-out sm-text-sm sm-leading-5">Cerrar</button>
|
||||
</span>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
function copyToClipboard() {
|
||||
var copyText = document.getElementById("c").value;
|
||||
navigator.clipboard.writeText(copyText).then(() => {
|
||||
// Alert the user that the action took place.
|
||||
// Nobody likes hidden stuff being done under the hood!
|
||||
//alert("Copied to clipboard");
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<div x-cloak x-show="!vista">
|
||||
<livewire:show-promociones />
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
function copiarAlPortapapeles(id_elemento) {
|
||||
var aux = document.createElement("input");
|
||||
aux.setAttribute("value", document.getElementById(id_elemento).innerHTML);
|
||||
document.body.appendChild(aux);
|
||||
aux.select();
|
||||
document.execCommand("copy");
|
||||
document.body.removeChild(aux);
|
||||
}
|
||||
|
||||
const prev = document.querySelector('.prev')
|
||||
const next = document.querySelector('.next')
|
||||
const slider = document.querySelector('.slider')
|
||||
|
||||
prev.addEventListener('click', () => {
|
||||
slider.scrollLeft -= 600
|
||||
})
|
||||
|
||||
next.addEventListener('click', () => {
|
||||
slider.scrollLeft += 600
|
||||
})
|
||||
</script>
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,127 @@
|
||||
<div class="h-full w-full md:my-2">
|
||||
<div class="bg-[#f5f5f5] md:w-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-2">
|
||||
|
||||
<div class="flex justify-start my-2 items-center mb-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve"><g><path d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z" fill="#b221fd" data-original="#000000"/></g></svg>
|
||||
Distribuidores
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- tabla --}}
|
||||
<div class="mx-auto bg-white grid grid-cols-1 lg:grid-cols-1text-center rounded-xl py-4 px-2 ms:px-8 shadow-md xl:mx-10 mb-8 ">
|
||||
<p class="text-center font-semibold text-base sm:text-2xl">Mejores distribuidores del mes</p>
|
||||
|
||||
<div class=" text-center w-full " >
|
||||
<img src="{{asset($configuracion->img_top)}}" alt="" class="object-cover h-24 sm:h-48 w-full rounded-lg shadow my-3">
|
||||
<p class=" text-sm sm:text-base my-2 ">{{$configuracion->mensaje_top}}</p>
|
||||
</div>
|
||||
<table class="sm:text-base text-sm text-center rounded-lg shadow-lg m-auto sm:mt-4 mb-4 border-separate border-spacing-y-2 ">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[1rem] sm:pl-[2rem]"></th>
|
||||
<th class="font-normal pl-[1rem] sm:pl-[2rem]">Nombre</th>
|
||||
<th class="font-normal pl-[1rem] sm:pl-[2rem] hidden">Email</th>
|
||||
<th class="font-normal pl-[1rem] sm:pl-[2rem]">Ventas</th>
|
||||
<th class="font-normal pl-[1rem] sm:pl-[2rem]">Premio</th>
|
||||
<th class="rounded-r-lg font-normal sm:pr-[2rem] sm:pl-[2rem]"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
@php
|
||||
$i = 0;
|
||||
@endphp
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@foreach ($usuarios as $usuario)
|
||||
@if($usuario->name == 'usuarioEliminado')
|
||||
@else
|
||||
|
||||
@php
|
||||
$i++;
|
||||
@endphp
|
||||
<tr class="border-gray-200 text-left w-full pl-4">
|
||||
<td class="pl-[1rem] sm:pl-[2rem]">
|
||||
|
||||
<img src="{{asset('img/'.$i.'.png')}}" alt="" class="w-12">
|
||||
|
||||
|
||||
</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem]">{{ $usuario->name }}</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem] hidden">{{ $usuario->email }}</td>
|
||||
<td class="pl-[1rem] sm:pl-[2rem]">{{ $usuario->historiales_venta_count }}</td>
|
||||
|
||||
|
||||
|
||||
@if ($i == 1)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_1)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_1}}</span>
|
||||
</td>
|
||||
|
||||
|
||||
@elseif ($i == 2)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_2)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_2}}</span>
|
||||
</td>
|
||||
|
||||
|
||||
@elseif ($i == 3)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_3)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_3}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 4)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_4)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_4}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 5)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_5)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_5}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 6)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_6)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_6}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 7)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_7)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_7}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 8)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_8)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_8}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 9)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_9)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_9}}</span>
|
||||
</td>
|
||||
|
||||
@elseif ($i == 10)
|
||||
<td class="pl-[1rem] pr-[1rem] sm:pl-[2rem] flex">
|
||||
<img src="{{asset($configuracion->top_10)}}" alt="" class="h-4 w-4 sm:h-6 sm:w-6 object-cover">
|
||||
<span class="pl-1 ms:pl-3">{{$configuracion->premio_10}}</span>
|
||||
</td>
|
||||
|
||||
@endif
|
||||
|
||||
|
||||
</tr>
|
||||
@endif
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
@include('layouts.footer')
|
||||
</div>
|
||||
@@ -0,0 +1,618 @@
|
||||
<div x-data="{ add : @entangle('add'),
|
||||
editar : @entangle('editar'),
|
||||
modalSaldo : @entangle('modalSaldo'),
|
||||
gestion : @entangle('gestion'),
|
||||
gestionPromo : @entangle('gestionPromo'),
|
||||
modalPassword : @entangle('modalPassword'),
|
||||
modTarifas: @entangle('modTarifas'),
|
||||
}" 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,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-[100%] m-auto p-2 md:p-5 rounded-[1.2rem] relative mb-4 ">
|
||||
<div class="grid grid-cols-1 sm:flex justify-between my-2 items-center">
|
||||
<div class="grid grid-cols-1 sm:flex items-center gap-3 md:gap-8">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0"
|
||||
viewBox="0 0 24 24" style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<g>
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</g>
|
||||
</svg>
|
||||
Usuario
|
||||
</div>
|
||||
<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>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
{{-- Buscar --}}
|
||||
<div class="flex relative">
|
||||
<input id="buscar" type="search" wire:model="buscar" placeholder="Buscar" 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>
|
||||
|
||||
{{-- -Tabla usuarios - --}}
|
||||
<div class="py-2">
|
||||
<table class="text-center rounded-lg shadow-lg m-auto mt-4 mb-4 bg-white md:w-10/12">
|
||||
<thead class="font-normal bg-[#000029] text-white h-9">
|
||||
<tr class="text-left">
|
||||
<th class="rounded-l-lg font-normal pl-[2rem]">Nombre</th>
|
||||
<th class="font-normal pl-[2rem]">Email</th>
|
||||
<th class="font-normal pl-[2rem]">Rol</th>
|
||||
<th class="font-normal pl-[2rem]">Ventas</th>
|
||||
<th class="font-normal pl-[2rem]">Saldo</th>
|
||||
<th class="font-normal pl-[2rem]"></th>
|
||||
<th class="rounded-r-lg font-normal"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="text-gray-500 select-none">
|
||||
@foreach ($usuarios as $usuario)
|
||||
@if($usuario->name == 'usuarioEliminado')
|
||||
@else
|
||||
|
||||
<tr class="border-gray-200 text-left w-full pl-4 hover:bg-gray-200 hover:ring-gray-500" x-data="{ openOption: false }">
|
||||
<td class="pl-[2rem]">{{ $usuario->name ?? '' }}</td>
|
||||
|
||||
<td class="pl-[2rem]">{{ $usuario->email ?? '' }}</td>
|
||||
|
||||
<td class="pl-[2rem] ">{{ $usuario->rol->nombre ?? '' }}</td>
|
||||
|
||||
<td class="pl-[2rem]">{{ $usuario->historiales_venta_count ?? '' }}</td>
|
||||
|
||||
<td class="pl-[2rem]">{{ $usuario->saldo->valor ?? '' }}</td>
|
||||
<td class="pl-[2rem]"><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 class="md:pl-[2rem] md:pr-[2rem]">
|
||||
<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">
|
||||
<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,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>
|
||||
</tr>
|
||||
@endif
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
{{ $usuarios->links() }}
|
||||
</div>
|
||||
|
||||
{{-- 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->por_tiempo)
|
||||
<option value="{{ $consulta_tarifa->id }}">{{ $consulta_tarifa->servicio->nombre ?? '' }}: {{ $consulta_tarifa->dias ?? '' }} {{ $consulta_tarifa->dias == 1 ? 'día' : 'días' }}</option>
|
||||
@else
|
||||
<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="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>
|
||||
</div>
|
||||
|
||||
<div class="mb-3 mt-3 flex justify-end">
|
||||
<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 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->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
|
||||
</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-[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 justify-end">
|
||||
<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 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-[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="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> {{$saldo_actual + $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="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 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>
|
||||
|
||||
<div class="grid grid-cols-2 gap-2 text-left">
|
||||
<div class="w-[9rem]">
|
||||
<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-[8rem]">
|
||||
<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>
|
||||
</div>
|
||||
<div class="mb-3 mt-3 flex justify-end">
|
||||
<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]">Rol</th>
|
||||
<th class="font-normal pl-[1rem]">Valor</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]">{{ $tarifa->rol->nombre ?? '' }}</td>
|
||||
<td class="pl-[1rem]">{{ $tarifa->precio ?? '' }}</td>
|
||||
<td class="pl-[1rem]">
|
||||
<svg wire:click="eliminarModTarifa({{ $tarifa->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" class=""><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>
|
||||
|
||||
<div class="mb-4 grid grid-cols-2">
|
||||
|
||||
|
||||
</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>
|
||||
</div>
|
||||
@@ -0,0 +1,3 @@
|
||||
<div>
|
||||
{{-- Care about people's approval and you will be their prisoner. --}}
|
||||
</div>
|
||||
@@ -0,0 +1,35 @@
|
||||
<div>
|
||||
<div class="grid grid-cols-1 mb-8">
|
||||
<div class="bg-white w-full sm:w-[26rem] m-auto justify-center rounded-xl 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 mb-6">
|
||||
Monto a recargar
|
||||
<p class="font-semibold">
|
||||
${{number_format($monto)}}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center pb-4">
|
||||
<form>
|
||||
<script
|
||||
src="https://checkout.wompi.co/widget.js"
|
||||
data-render="button"
|
||||
data-public-key="pub_prod_fr8vGH8EfVKyKcaUWekN7VppG8brBxSf"
|
||||
data-currency="COP"
|
||||
data-amount-in-cents="{{$monto}}00"
|
||||
data-reference="{{$referencia}}"
|
||||
|
||||
>
|
||||
</script>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
@@ -0,0 +1,102 @@
|
||||
<div>
|
||||
|
||||
|
||||
<div class="bg-[#f5f5f5] mt-5 w-[90%] m-auto p-5 rounded-[1.2rem] border-b border-gray-200 shadow-md mb-4 relative">
|
||||
|
||||
<div class="flex justify-start my-2 items-center mb-4">
|
||||
<div class="flex text-sm">
|
||||
<svg class="w-4" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
|
||||
xmlns:svgjs="http://svgjs.com/svgjs" version="1.1" x="0" y="0" viewBox="0 0 24 24"
|
||||
style="enable-background:new 0 0 512 512" xml:space="preserve">
|
||||
<path
|
||||
d="M15.4,9.88,10.81,5.29a1,1,0,0,0-1.41,0,1,1,0,0,0,0,1.42L14,11.29a1,1,0,0,1,0,1.42L9.4,17.29a1,1,0,0,0,1.41,1.42l4.59-4.59A3,3,0,0,0,15.4,9.88Z"
|
||||
fill="#b221fd" data-original="#000000" />
|
||||
</svg>
|
||||
Saldo
|
||||
</div>
|
||||
</div>
|
||||
@php
|
||||
// SDK de Mercado Pago
|
||||
require base_path('vendor/autoload.php');
|
||||
// Agrega credenciales
|
||||
MercadoPago\SDK::setAccessToken(config('services.mercadopago.token'));
|
||||
|
||||
|
||||
// Crea un objeto de preferencia
|
||||
$preference = new MercadoPago\Preference();
|
||||
|
||||
//$payment_methods = MercadoPago::get("/v1/payment_methods");
|
||||
// Crea un ítem en la preferencia
|
||||
$item = new MercadoPago\Item();
|
||||
$item->id = $historial_id;
|
||||
$item->title = 'Compra SrPremium';
|
||||
$item->quantity = 1;
|
||||
$item->unit_price = $monto;
|
||||
$preference->back_urls = array(
|
||||
|
||||
"success" => url('/compras/'),
|
||||
"failure" => url('/compras/error'),
|
||||
"pending" => url('/compras/pendiente')
|
||||
);
|
||||
$preference->auto_return = "approved";
|
||||
$preference->items = array($item);
|
||||
$preference->save();
|
||||
|
||||
|
||||
@endphp
|
||||
|
||||
<div class="grid grid-cols-1 mb-8">
|
||||
<div class="bg-white w-full sm:w-[26rem] m-auto justify-center rounded-xl 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 mb-6">
|
||||
Monto a recargar
|
||||
<p class="font-semibold">
|
||||
${{number_format($monto)}}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<a href="javascript:location.reload()">
|
||||
<img class="w-28 rounded-full shadow-lg" src="./img/mercadopago.jpg" alt="">
|
||||
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="bg-white px-4 py-3 md:flex justify-center mt-2 mb-4">
|
||||
<a href="javascript:location.reload()">
|
||||
<button class="inline-flex justify-center w-full rounded-md border border-transparent px-12 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">Continuar</button>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="cho-container">
|
||||
|
||||
</div>
|
||||
|
||||
<script src="https://sdk.mercadopago.com/js/v2"></script>
|
||||
|
||||
<script>
|
||||
const mp = new MercadoPago("{{config('services.mercadopago.key')}}", {
|
||||
locale: 'es-CO'
|
||||
});
|
||||
|
||||
mp.checkout({
|
||||
preference: {
|
||||
id: '{{$preference->id}}'
|
||||
},
|
||||
|
||||
autoOpen: true, // Habilita la apertura automática del Checkout Pro
|
||||
});
|
||||
</script>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
Reference in New Issue
Block a user