Files
sirpremiumv2/resources/views/livewire/show-recarga.blade.php
T
2024-03-08 16:28:07 -05:00

143 lines
6.8 KiB
PHP
Executable File

<div x-data="{ nequi: @entangle('nequi'), valor_recarga: @entangle('valor_recarga'),valor_recarga_format: @entangle('valor_recarga_format') }">
<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">
<x-icon-arrow-right />
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" id="valor_recarga" wire:model="valor_recarga" class="hidden">
<input
type="text"
id="valor_recarga_format"
name="recharge_format"
wire:model="valor_recarga_format"
placeholder="$20.000"
required
class="border-2 w-1/2 md:w-auto mb-2 border-neutral-200 rounded-[0.8rem] shadow appearance-none focus:border-neutral-300 focus:ring-0 py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
oninput="formatInput(this)"
>
@if ($valor_recarga)
<div class="flex text-sm justify-center">Tu valor a pagar seria: $<p class="font-semibold">
{{ number_format($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]">${{ 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>
<script>
function formatInput(input) {
let unformattedValue = input.value.replace(/\D/g, '');
let formattedValue = unformattedValue.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
input.value = formattedValue;
}
</script>
</div>