16c9ff3cee
- Updated interaction models and relations for handling of user-deal interactions. - Added frontend interactivity with `interaction.js` for toggling like buttons.
93 lines
4.2 KiB
PHP
93 lines
4.2 KiB
PHP
@php
|
|
$categories = [0 => ['name' => 'All Categories', 'value' => '0']];
|
|
@endphp
|
|
<x-layout title="Deals">
|
|
<x-dashboard.page-heading
|
|
title="Explore Deals"
|
|
description="Discover trusted recommendation"
|
|
>
|
|
<x-slot:end>
|
|
<div class="flex items-center">
|
|
<div class="relative group">
|
|
<x-ui.button icon="user-circle" class="cursor-pointer" onclick="showMenu(this)"></x-ui.button>
|
|
<ul class="menu invisible group-hover:visible w-48 absolute right-0 bg-white border border-gray-300 rounded-md shadow-xl py-2 text-accent-600">
|
|
<li class="py-2 px-4 hover:bg-gray-100 hover:text-gray-900 hover:cursor-pointer hover:font-bold">
|
|
<a href="{{$profileLink}}" class="flex space-x-4">
|
|
<div class="p-1 bg-gray-200 rounded-xl text-gray-900">
|
|
<x-heroicon-o-user class="w-4"/>
|
|
</div>
|
|
<p>Profile</p>
|
|
</a>
|
|
</li>
|
|
|
|
@if(auth()->user()->role === \App\Enums\UserTypes::Broker->value)
|
|
<li class="py-2 px-4 hover:bg-gray-100 hover:text-gray-900 hover:cursor-pointer hover:font-bold">
|
|
<a href="{{route('broker.dashboard')}}" class="flex space-x-4">
|
|
<div class="p-1 bg-gray-200 rounded-xl text-gray-900">
|
|
<x-heroicon-o-adjustments-horizontal class="w-4"/>
|
|
</div>
|
|
<p>Control Panel</p>
|
|
</a>
|
|
</li>
|
|
@endif
|
|
|
|
</ul>
|
|
</div>
|
|
<form method="post" action="{{route('logout')}}">
|
|
@csrf
|
|
@method('delete')
|
|
<x-ui.button class="flex space-x-3 hover:bg-gray-100 hover:border-gray-300 hover:border">
|
|
<x-heroicon-o-arrow-right-start-on-rectangle class="w-4 stroke-2 mr-2"/>
|
|
<p class="hidden sm:block">Logout</p>
|
|
</x-ui.button>
|
|
</form>
|
|
</div>
|
|
</x-slot:end>
|
|
</x-dashboard.page-heading>
|
|
<section class="flex flex-col space-y-8 bg-[#F9FAFB] wrapper mt-2 pb-6">
|
|
|
|
<div>
|
|
@session('success')
|
|
<x-ui.alert variant="success">{{$value}}</x-ui.alert>
|
|
@endsession
|
|
|
|
@session('error')
|
|
<x-ui.alert variant="error">{{$value}}</x-ui.alert>
|
|
@endsession
|
|
</div>
|
|
|
|
<x-dashboard.card>
|
|
<div class="flex gap-4 flex-col sm:flex-row">
|
|
<x-ui.input class="flex-1" name="search" placeholder="Search deals, services, places"/>
|
|
<x-ui.select name="category" :options="$categories" value-key="value" label-key="name"/>
|
|
</div>
|
|
</x-dashboard.card>
|
|
|
|
<x-ui.toggle-button-group>
|
|
<x-ui.toggle-button active>
|
|
<a href="" class="flex items-center px-2 py-1 space-x-2">
|
|
<x-heroicon-o-clock class="w-4 stroke-2"/>
|
|
<p class="font-bold text-xs sm:text-sm md:text-md">All Deals</p>
|
|
</a>
|
|
</x-ui.toggle-button>
|
|
|
|
<x-ui.toggle-button>
|
|
<a href="" class="flex items-center px-2 py-1 space-x-2">
|
|
<x-heroicon-o-arrow-trending-up class="w-4 stroke-2"/>
|
|
<p class="font-bold text-xs sm:text-sm md:text-md">Most Liked</p>
|
|
</a>
|
|
</x-ui.toggle-button>
|
|
|
|
<x-ui.toggle-button>
|
|
<a href="" class="flex items-center px-2 py-1 space-x-2">
|
|
<x-heroicon-o-star class="w-4 stroke-2"/>
|
|
<p class="font-bold text-xs sm:text-sm md:text-md">Most Clicked</p>
|
|
</a>
|
|
</x-ui.toggle-button>
|
|
</x-ui.toggle-button-group>
|
|
|
|
<x-dashboard.user.listing :deals="$deals"/>
|
|
</section>
|
|
@vite(['resources/js/menu.js', 'resources/js/interaction.js'])
|
|
</x-layout>
|