Sindbad~EG File Manager
<div>
<style>
.portfolio-hover2 {
height: auto;
background: #FFF;
overflow: hidden;
border-radius: 15px;
}
.portfolio-hover2 img {
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.4s;
}
.portfolio-hover2 img {
width: 70%;
height: auto;
object-fit: cover;
transition: transform 0.4s;
display: block;
margin: 0 auto;
}
.zoom:hover {
transform: scale(1.2);
}
body {
margin: 0;
background-color: #1a1a1a;
}
.main-header {
padding: 2rem;
text-align: center;
}
.search-bar {
max-width: 600px;
margin: 1rem auto;
}
.search-bar input {
width: 100%;
padding: 0.8rem;
border-radius: 25px;
border: none;
font-size: 1.1rem;
color: #009fd9;
background-color: #f2f2f2;
}
.search-bar input::placeholder {
color: #009fd9;
}
.info-banner {
position: fixed;
top: 50%;
right: 10%;
transform: translateY(-50%);
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 1rem;
padding: 1rem;
z-index: 1000;
}
.info-card {
background-color: #00b5f1;
padding: 8px 15px;
border-radius: 25px;
min-width: 150px;
text-align: center;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
overflow: hidden;
position: relative;
border: 3px solid white;
}
.info-card::after {
content: '';
position: absolute;
top: 0;
right: -100px;
bottom: 0;
width: 100px;
background-color: #00b5f1;
}
.info-card h1 {
color: #ffd700;
margin: 0;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}
.info-card h2 {
color: #ffd700;
margin: 2px 0;
font-size: 24px;
font-weight: bold;
}
.info-card:hover {
transform: translateY(-2px);
transition: transform 0.2s ease;
}
.products-grid {
display: grid;
background-color:rgb(255, 255, 255);
border-radius: 25px;
border:none;
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
gap: 2rem;
padding: 2rem;
max-width: 1200px;
margin: 0 auto;
}
.product-card {
background: white;
border-radius: 15px;
padding: 1rem;
text-align: center;
}
.points-badge {
background:rgba(94, 88, 88, 0.7);
color: white;
border-radius: 25px;
padding: 0.5rem 1rem;
display: inline-flex;
align-items: center;
gap: 0.5rem;
margin: 1rem 0;
}
.add-to-cart {
background:rgb(241, 240, 229);
color: #ffd700;
border: none;
border-radius: 25px;
padding: 0.8rem 1.5rem;
font-weight: bold;
cursor: pointer;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
}
.add-to-cart:hover {
background: #ffd700;
color:rgb(241, 240, 229);
}
</style>
@php
$totalmonedas = 0;
$totalmonedasusadas = 0;
@endphp
@foreach($monedas as $element)
@php
$totalmonedas += $element->monedas;
@endphp
@endforeach
@foreach($monedasusadas as $value)
@php
$totalmonedasusadas += $value->monedas;
@endphp
@endforeach
<div class="main-header">
<h1 style="font-size: 4rem; color: white; margin: 0;">CATÁLOGO DE RECOMPENSAS</h1>
<div class="search-bar">
<input wire:model="buscar" type="search" placeholder="BUSCAR" />
</div>
</div>
<div class="info-banner">
<div class="info-card">
<h1>DISPONIBLE</h1>
<h2>{{number_format($totalmonedas-$totalmonedasusadas, 0, '', '.')}}</h2>
</div>
<div class="info-card">
<h1>CARRITO</h1>
@php
$monedasdisponibles = $totalmonedas-$totalmonedasusadas;
$total = 0;
@endphp
@foreach (Cart::getContent() as $value)
@php
$total += $value->price * $value->quantity;
@endphp
<input type="hidden" name="producto_id[]" value="{{ $value->id }}" required>
<input type="hidden" name="monedass[]" value="{{ $value->price }}" required>
@endforeach
<h2>{{ number_format($total, 0, '', '.') }}</h2>
</div>
</div>
<form action="{{ route('enviarpedido') }}" method="POST" enctype="multipart/form-data">
@csrf
@php
$monedasdisponibles=$totalmonedas-$totalmonedasusadas;
$total=0;
@endphp
@foreach (Cart::getContent() as $value)
@php
$total+=$value->price*$value->quantity;
@endphp
<input type="hidden" name="producto_id[]" value="{{ $value->id }}" required>
<input type="hidden" name="monedass[]" value="{{ $value->price }}" required>
@endforeach
@if($total > $monedasdisponibles)
<script type="text/javascript">alert('No tienes monedas suficientes para solicitar todos los productos, porfavor elimina algunos artículos');</script>
@endif
<h2><input type="number" style="width: 1px !important;height: 1px !important;background-color: white;color: white;border: 0px solid white;" name="total[]" min="1" max="{{ $monedasdisponibles }}" value="{{ $total}}" required></h2>
{{ $producto_id }}
<button type="button" class="btn btn-success" data-toggle="modal" data-target=".carrito-modal">
<i class="fa fa-shopping-cart"></i> Ver Carrito
</button><hr>
<div class="modal fade carrito-modal" wire:ignore.self tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="exampleModalLabel">Carrito de pedidos</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<table class="table">
<thead>
<tr>
<th scope="col">Producto</th>
<th scope="col"><center>Cantidad</center></th>
<th scope="col"><center>Acciones</center></th>
</tr>
</thead>
<tbody>
@foreach(Cart::getContent() as $prod)
<tr>
<td>{{$prod->name}}</td>
<td align="center">
<button type="button" class="btn btn-sm btn-success" wire:click="menoscarrito({{$prod->id}})">
‹
</button>
{{$prod->quantity}}
<button type="button" class="btn btn-sm btn-success" wire:click="mascarrito({{$prod->id}})">
›
</button>
</td>
<td align="center">
<button type="button" class="btn btn-sm btn-danger" wire:click="deletecarrito({{$prod->id}})">
x
</button>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-success">Realizar pedido</button>
</div>
</div>
</div>
</div>
</form>
<div class="products-grid">
@foreach ($catalogos as $element)
<div class="product-card">
<div class="portfolio-hover2">
<a href="{{ asset('images/catalogo/'.$element->foto) }}" data-toggle="lightbox" data-title="{{ $element->nombre }}">
<!--<img src="{{ asset('images/catalogo/'.$element->foto) }}" class="zoom" alt="{{ $element->nombre }}" />-->
<img src="{{ asset('/imgsystem/mochila.png') }}" class="zoom" alt="{{ $element->nombre }}" />
</a>
</div>
<h1 style="color: #00b5f1 !important ; font-size: 2rem; margin: 0,5rem 0;">{{ $element->nombre }}</h1>
<div class="points-badge">
<img src="/imgsystem/moneda.png" width="30px" alt="moneda">
<span>{{number_format($element->moneda, 0, '', '.')}}</span>
</div>
@if (in_array($element->id, Cart::getContent()->pluck('id')->toArray()))
<button type="button" class="add-to-cart" style="background-color:rgb(175, 112, 76);" wire:click="deletecarrito({{ $element->id }})">
<i class="fa fa-check-circle-o"></i> ELIMINAR DEL CARRITO
</button>
@else
<button class="add-to-cart" wire:click="addcarrito({{ $element->id }})">
<i class="fa fa-shopping-cart"></i> AGREGAR AL CARRITO
</button>
@endif
</div>
@endforeach
</div>
<div class="col-md-12">
{{ $catalogos->links() }}
</div>
</div>
Sindbad File Manager Version 1.0, Coded By Sindbad EG ~ The Terrorists