1140 lines
74 KiB
PHP
Executable File
1140 lines
74 KiB
PHP
Executable File
<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="cantidad_comprarPromo,confirmarCompra,denegarCompra,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">
|
|
<x-icon-arrow-right/>
|
|
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="mb-4">
|
|
<label for="utilidad"
|
|
class="block text-gray-700 text-sm font-bold mb-2">Valor de compra:</label>
|
|
<input name="utilidad" wire:model="utilidad" type="number" min="0"
|
|
placeholder="$0"
|
|
class="w-full 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 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)
|
|
@if($tarifa->servicio?->estado == 'activo')
|
|
<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>
|
|
@endif
|
|
@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" name="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 block">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>No tiene fondo suficientes para esta compra, recargue su cuenta.</p>
|
|
@if (auth()->user()->rol->nombre != 'editor' && auth()->user()->rol->nombre != 'administrador')
|
|
<a href="{{ route('recarga') }}"><button class="bg-green-600 text-white rounded px-2 py-1">Recargar</button></a>
|
|
@endif
|
|
</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" wire:loading.attr="disabled" 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 justify-between">
|
|
<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>
|