@extends('layouts.master')

@section('styles')
    <link rel="stylesheet" href="{{ asset('build/assets/libs/glightbox/css/glightbox.min.css') }}">
@endsection

@section('content')
    <!-- Page Header -->
    @php
        $breadcrumbs = [
            ['label' => 'Dashboard', 'url' => route('admin.dashboard')],
            ['label' => 'Users', 'url' => '#', 'active' => true],
            ['label' => '', 'url' => '#', 'active' => true],
        ];
    @endphp
    <meta name="csrf-token" content="{{ csrf_token() }}" />
    <!-- Start:: row-1 -->
    <div class="row">
        <div class="col-xl-12 mt-4">
            <div class="card-body">
                <div class="row">
                    <div class="col-xl-3 col-md-4">
                        <x-ui.card>
                            <div class="card-body border-bottom border-block-end-dashed">
                                <div class="text-center">
                                    @php
                                        $profile = "https://www.gravatar.com/avatar/00000000000000000000000000000000?d=mp&f=y";
                                        if ($user->profile != null) {
                                            if (str_contains($user->profile, 'http')) {
                                                $profile = $user->profile;
                                            } else {
                                                $profile = asset('uploads/user/' . $user->profile);
                                            }
                                        }
                                    @endphp
                                    <span class="avatar avatar-xxl avatar-rounded online mb-3">
                                        <img src="{{ $profile }}" alt="">
                                    </span>
                                    <h5 class="fw-semibold mb-1">{{ $user->name }}</h5>
                                    <span class="d-block fw-medium text-muted mb-2">{{ $user->email }}</span>
                                    <p class="fs-12 mb-0 text-muted"> 
                                        <span class="me-3">
                                             @if($user->active_subscription==1)
                                                <span class="badge fw-semibold badge-pill bg-primary-transparent text-primary fs-11">Premium VIP User</span>
                                                @else 
                                                <span class="badge fw-semibold badge-pill bg-info-transparent text-info fs-11">Free Plan User</span>
                                                @endif
                                            </span>    
                                        </p>
                                    <p class="fs-12 mb-0 mt-1 text-muted"> <span class="me-3">UID: {{ $user->uid }}</span>
                                        <span><i class="ri-map-pin-line me-1 align-middle"></i>
                                            @if ($country)
                                                {{ $country->name }}
                                            @endif
                                        </span> </p>
                                </div>
                            </div>

                            <div class="card-body border-bottom border-block-end-dashed p-0">
                                <ul class="list-group list-group-flush">
                                    <li class="list-group-item pt-2 border-0 ">
                                        <div><span class="fw-medium text-muted me-2">Balance :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ round($user->wallet->balance, 2) }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2 border-0">
                                        <div><span class="fw-medium text-muted me-2">Diamonds :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ round($user->wallet->diamonds, 2) }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2  text-muted border-0">
                                        <div><span class="fw-medium me-2">LifeTime Earnings :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ round($user->wallet->lifetime_earn, 2) }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2  text-muted border-0">
                                        <div><span class="fw-medium me-2">Total Referrals :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ round($user->referral->ref_count, 2) }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2  text-muted border-0">
                                        <div><span class="fw-medium me-2">User IP :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ $user->device->ip }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2  text-muted border-0">
                                        <div><span class="fw-medium me-2">Device :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ $user->device->device_os }} {{ $user->device->device_model }}</span>
                                        </div>
                                    </li>
                                    <li class="list-group-item pt-1  text-muted  border-0">
                                        <div><span class="fw-medium me-2">App Version:</span><span
                                                class="badge bg-light text-dark m-1 border">{{ $user->device->app_version }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2  text-muted border-0">
                                        <div><span class="fw-medium me-2">Last Seen :</span><span
                                                class="badge bg-light text-dark m-1 border">{{ \Carbon\Carbon::parse($user->last_seen_at)->format('d M Y, h:i A') }}</span></div>
                                    </li>
                                    <li class="list-group-item pt-2 border-0">
                                        <div><span class="fw-medium me-2 text-muted">User Status :</span><span
                                                class="text-muted">
                                            @if($user->status==1)
                                            <span class="badge fw-semibold badge-pill bg-success-transparent text-success fs-11">Active</span>
                                            @elseif($user->status==0)
                                            <span class="badge fw-semibold badge-pill bg-dark-transparent text-dark fs-11">InActive Last Time No Login</span>
                                            @else 
                                            <span class="badge fw-semibold badge-pill bg-danger-transparent text-danger fs-11">Banned</span>
                                            @endif</span></div>
                                    </li>
                                    
                                </ul>
                            </div>
                            <div class="p-3 pb-1 d-flex flex-wrap">
                                <button class="modal-effect btn btn-sm btn-primary-light btn-wave waves-effect waves-light" id="add_coin" >Add Coin/Diamond</button>
                                <button class="modal-effect btn btn-sm btn-info-light btn-wave waves-effect waves-light ms-3 " id="send_noti">Send Notification</button>
                                <button class="modal-effect btn btn-sm btn-danger-light btn-wave waves-effect waves-light ms-3 " id="ban_user">Ban User</button>
                                <button class="modal-effect btn btn-sm btn-warning-light btn-wave waves-effect waves-light ms-3 mt-2" id="delete_trans" >Delete All Transaction</button>
                                <button class="modal-effect btn btn-sm btn-danger-light btn-wave waves-effect waves-light ms-3 mt-2" id="delete_user">Delete Account</button>
                            </div>
                          
                        </x-ui.card>
                    </div>
                    <div class="col-xl-9 col-md-8">
                        <x-ui.card>
                            <ul class="nav nav-tabs tab-style-6 mb-3 p-0" id="myTab" role="tablist">
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start active" id="transaction-tab"
                                        data-bs-toggle="tab" data-bs-target="#transaction-tab-pane" type="button"
                                        role="tab" aria-controls="transaction-tab-pane"
                                        aria-selected="false">Transactions</button>
                                </li>

                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start" id="redeem-tab" data-bs-toggle="tab"
                                        data-bs-target="#redeem-tab-pane" type="button" role="tab"
                                        aria-controls="redeem-tab-pane" aria-selected="false">Redeem History</button>
                                </li>

                              
                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start" id="edit-profile-tab" data-bs-toggle="tab"
                                        data-bs-target="#edit-profile-tab-pane" type="button" role="tab"
                                        aria-controls="edit-profile-tab-pane" aria-selected="true">User Profile</button>
                                </li>

                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start " id="subscription-activity-tab"
                                        data-bs-toggle="tab" data-bs-target="#subscription-activity-tab-pane" type="button"
                                        role="tab" aria-controls="subscription-activity-tab-pane"
                                        aria-selected="true">Subscription Activity</button>
                                </li>

                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start " id="ads-activity-tab"
                                        data-bs-toggle="tab" data-bs-target="#ads-activity-tab-pane" type="button"
                                        role="tab" aria-controls="ads-activity-tab-pane"
                                        aria-selected="true">Ads Activity</button>
                                </li>

                                <li class="nav-item" role="presentation">
                                    <button class="nav-link w-100 text-start" id="friends-tab" data-bs-toggle="tab"
                                        data-bs-target="#friends-tab-pane" type="button" role="tab"
                                        aria-controls="friends-tab-pane" aria-selected="false">Friends</button>
                                </li>
                            </ul>
                            <div class="tab-content" id="profile-tabs">
                                <div class="tab-pane show active p-0 border-0" id="transaction-tab-pane" role="tabpanel"
                                    aria-labelledby="transaction-tab" tabindex="0">
                                    <x-ui.card :cardClass="'overflow-hidden shadow-none border'" :hr_line="false" title="">
                                        <x-slot name="header">
                                            <div class="card-title d-flex gap-2">
                                                <div>
                                                    <input class="form-control" type="text" id="search"
                                                        placeholder="Search Here" aria-label=".form-control-sm example">
                                                </div>
                                            </div>
                                        </x-slot>
                                        @php
                                            $columns = [
                                                ['label' => 'Task'],
                                                ['label' => 'Amount'],
                                                ['label' => 'Offer ID'],
                                                ['label' => 'IP'],
                                                ['label' => 'Store Transaction'],
                                                ['label' => 'Date'],
                                            ];
                                        @endphp

                                        <x-ui.table id="mytable" :columns="$columns"></x-ui.table>
                                    </x-ui.card>
                                </div>

                                 {{-- redeem history Tab --}}
                                <div class="tab-pane p-0 border-0" id="redeem-tab-pane" role="tabpanel"
                                    aria-labelledby="redeem-tab" tabindex="0">
                                    <x-ui.card :cardClass="'overflow-hidden shadow-none border'" :hr_line="false" title="">
                                        <x-slot name="header">
                                            <div class="card-title d-flex gap-2">
                                                <div>
                                                    <input class="form-control" type="text" id="search"
                                                        placeholder="Search Here" aria-label=".form-control-sm example">
                                                </div>
                                            </div>
                                        </x-slot>
                                        @php
                                            $columns = [
                                                ['label' => 'ID'],
                                                ['label' => 'Payout Method'],
                                                ['label' => 'Request To'],
                                                ['label' => 'Coins'],
                                                ['label' => 'GiftCode'],
                                                ['label' => 'IP'],
                                                ['label' => 'Status'],
                                                ['label' => 'Remark'],
                                                ['label' => 'Request Date'],
                                                ['label' => 'Update Date'],
                                            ];
                                        @endphp

                                        <x-ui.table id="redeemtable" :columns="$columns"></x-ui.table>
                                    </x-ui.card>
                                </div>

                                
                                {{-- Profile Tab --}}
                                <div class="tab-pane p-0 border-0" id="edit-profile-tab-pane" role="tabpanel"
                                    aria-labelledby="edit-profile-tab" tabindex="0">

                                    <div class="row gy-3">
                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-xl-12">
                                                    <ul class="list-group list-group-flush border rounded-3">
                                                        <li class="list-group-item p-3">
                                                            <span class="fw-medium fs-15 d-block mb-3 text-primary">😎 Personal Info :</span>
                                                            <div class="row gy-3 align-items-center">
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">User ID :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->uid }}" readonly>
                                                                </div>
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">User Name :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->name }}" readonly>
                                                                </div>
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Email:</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->email }}" readonly>
                                                                </div>

                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">ReferID:</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->referral->ref_id }}" readonly>
                                                                </div>

                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Subscription Type:</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    @if($user->active_subscription==1)
                                                                    <span class="badge fw-semibold badge-pill bg-primary-transparent text-primary fs-11">Premium VIP User</span>
                                                                    @else 
                                                                    <span class="badge fw-semibold badge-pill bg-info-transparent text-info fs-11">Free Plan User</span>
                                                                    @endif
                                                                </div>


                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Country:</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value=" @if ($country) {{ $country->name }}   @endif" readonly>
                                                                </div>


                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">IP:</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->device->ip }}" readonly>
                                                                </div>

                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Account Type :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ $user->account_type }}">
                                                                </div>
                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>

                                                <div class="col-xl-12 mt-3">
                                                    <ul class="list-group list-group-flush border rounded-3">
                                                        <li class="list-group-item p-3">
                                                            <span class="fw-medium fs-15 d-block mb-3 text-danger">🪪 Activity Info :</span>
                                                            <div class="row gy-3 align-items-center">
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Registered AT :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ \Carbon\Carbon::parse($user->created_at)->format('d M Y, h:i A') }}" readonly>
                                                                </div>
                                                                 <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Last Seen :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ \Carbon\Carbon::parse($user->last_seen_at)->format('d M Y, h:i A') }}" readonly>
                                                                </div>
                                                             
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Last Active Date :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" placeholder="Placeholder"
                                                                        value="{{ \Carbon\Carbon::parse($user->updated_at)->format('d M Y, h:i A') }}" readonly>
                                                                </div>
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Users Satus :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    @if($user->status==1)
                                                                    <span class="badge fw-semibold badge-pill bg-success-transparent text-success fs-11">Active</span>
                                                                    @elseif($user->status==0)
                                                                    <span class="badge fw-semibold badge-pill bg-dark-transparent text-dark fs-11">InActive Last Time No Login</span>
                                                                    @else 
                                                                    <span class="badge fw-semibold badge-pill bg-danger-transparent text-info fs-11">Banned</span>
                                                                    @endif
                                                                </div>
                                                                <div class="col-xl-3">
                                                                    <div class="lh-1">
                                                                        <span class="fw-medium text-muted">Ban Reason :</span>
                                                                    </div>
                                                                </div>
                                                                <div class="col-xl-9">
                                                                    <input type="text" class="form-control" 
                                                                        value="{{ $user->device->ban_reason }}">
                                                                </div>
                                                            </div>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>

                                        <div class="col-xl-6">
                                            <div class="row">
                                                <div class="col-xl-12">
                                                    <ul class="list-group list-group-flush border rounded-3">
                                                    <li class="list-group-item p-3">
                                                    <span class="fw-medium fs-15 d-block mb-3 text-success">💰 Wallets Info :</span>
                                                    <div class="row gy-3 align-items-center">
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Wallet Balance :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="email" class="form-control" placeholder="Placeholder"
                                                                value="{{ $user->wallet->balance }}" readonly>
                                                        </div>
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Diamond Balance :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="{{ $user->wallet->diamond }}" readonly>
                                                        </div>
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Lifetime Earning :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="{{$user->wallet->lifetime_earn}}" readonly>
                                                        </div>
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Refer Earning :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="{{ $user->wallet->ref_earn }}">
                                                        </div>
                                                    </div>
                                                </li>
                                                    </ul>
                                                </div>

                                                <div class="col-xl-12 mt-3">
                                                    <ul class="list-group list-group-flush border rounded-3">
                                                        <li class="list-group-item p-3">
                                                    <span class="fw-medium fs-15 d-block mb-3 text-danger">📳 Device Info :</span>
                                                    <div class="row gy-3 align-items-center">
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Device :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="{{ $user->device->device_os }} {{ $user->device->device_model }}" readonly>
                                                        </div>
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">Is Device Emulator? :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="@if($user->device->emu==1)  Yes @else No @endif">
                                                        </div>
                                                        <div class="col-xl-3">
                                                            <div class="lh-1">
                                                                <span class="fw-medium text-muted">App Version Using :</span>
                                                            </div>
                                                        </div>
                                                        <div class="col-xl-9">
                                                            <input type="text" class="form-control" placeholder="Placeholder"
                                                                value="{{ $user->device->app_version }}">
                                                        </div>
                                                      
                                                    </div>
                                                </li>
                                                    </ul>
                                                </div>
                                            </div>
                                        </div>

                                    </div>
                                    
                                </div>


                                {{-- subscription Tab  --}}
                                <div class="tab-pane p-0 border-0" id="subscription-activity-tab-pane" role="tabpanel"
                                    aria-labelledby="subscription-activity" tabindex="0">
                                    <x-ui.card :cardClass="'overflow-hidden shadow-none border'" :hr_line="false" title="">
                                        <x-slot name="header">
                                            <div class="card-title d-flex gap-2">
                                                <div>
                                                    <input class="form-control" type="text" id="search"
                                                        placeholder="Search Here" aria-label=".form-control-sm example">
                                                </div>
                                            </div>
                                        </x-slot>
                                        @php
                                            $columns = [
                                                ['label' => 'ID'],
                                                ['label' => 'Package | Benefit'],
                                                ['label' => 'Amount'],
                                                ['label' => 'Payment Method'],
                                                ['label' => 'Status'],
                                                ['label' => 'Purchased AT'],
                                                ['label' => 'Expired AT'],
                                            ];
                                        @endphp

                                        <x-ui.table id="subtable" :columns="$columns"></x-ui.table>
                                    </x-ui.card>
                                </div>

                                
                                {{-- ad Tab  --}}
                                <div class="tab-pane p-0 border-0" id="ads-activity-tab-pane" role="tabpanel"
                                    aria-labelledby="ads-activity" tabindex="0">
                                    <x-ui.card :cardClass="'overflow-hidden shadow-none border'" :hr_line="false" title="">
                                        <x-slot name="header">
                                            {{-- <div class="card-title d-flex gap-2">
                                                <div>
                                                    <input class="form-control" type="text" id="search"
                                                        placeholder="Search Here" aria-label=".form-control-sm example">
                                                </div>
                                            </div> --}}
                                        </x-slot>
                                        @php
                                            $columns = [
                                                ['label' => 'ID'],
                                                ['label' => 'Title'],
                                                ['label' => 'Media'],
                                                ['label' => 'Ad Type'],
                                                ['label' => 'Completed/Target'],
                                                ['label' => 'Status'],
                                                ['label' => 'Started AT'],
                                                ['label' => 'Updated AT'],
                                            ];
                                        @endphp

                                        <x-ui.table id="adtable" :columns="$columns"></x-ui.table>
                                    </x-ui.card>
                                </div>


                                {{-- friends Tab --}}
                                <div class="tab-pane p-0 border-0" id="friends-tab-pane" role="tabpanel"
                                    aria-labelledby="friends-tab" tabindex="0">
                                    <div class="">

                                    </div>
                                </div>
                            </div>
                        </x-ui.card>

                    </div>
                </div>
            </div>
        </div>
    </div>

<x-ui.modal id="wallet-modal" title="Update Coin/Diamond">
    <form action="{{ route('admin.users.update_wallet') }}" method="POST">
        @csrf
        <input type="hidden" name="id" value="{{ $user->id }}">
        <div class="modal-body">
            <x-form.select name="wallet_type"  col="col-xl-12" label="Select Wallet Type:"
                placeholder="Select Wallet" :required="true" :options="[
                    '' => 'Select Wallet Type',
                    'coin' => 'Coin Wallet',
                    'diamond' => 'Diamond Wallet',
                ]" />

            <x-form.select name="type"  col="col-xl-12 mt-3" label="Select Transaction Type:"
                placeholder="Select Transaction" :required="true" :options="[
                    '' => 'Select Transaction Type',
                    'credit' => 'Credit',
                    'debit' => 'Debit',
                ]" />

             <x-form.input label="Enter Amount:" name="amount"
                 col="mt-3" placeholder="Enter amount"
                            autofocus />   

               <x-form.input label="Transaction Remark:" name="remark"
                 col="mt-3" name="text" placeholder="Admin Bonus, etc"
                            autofocus />                  
        </div>    
    @slot('footer')
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary">Submit</button>
        </form>
    @endslot
</x-ui.modal> 

<x-ui.modal id="noti-modal" title="Send User Notification">
    <form action="{{ url('admin/notification/single-user-notification') }}" method="POST">
        @csrf
        <input type="text" name="uid" value="{{ $user->uid }}">
        <input type="text" name="user_pk_id" value="{{ $user->id }}">
        <input type="text" name="push_token" value="{{ $user->device->push_token }}">
        <div class="modal-body">

             <x-form.input label="Enter Title:" name="title"
                 col="" placeholder="Enter title"  autofocus />   

               <x-form.textarea label="Enter Message:" name="message"
                 class="mt-3" placeholder="Enter Message"  autofocus />                  
        </div>    
    @slot('footer')
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary">Send</button>
        </form>
    @endslot
</x-ui.modal> 

@php 
 $btitle=($user->status==1) ? 'Ban' : 'Unban';
@endphp

<x-ui.modal id="ban-modal"  title="{{ $btitle }} User Account">
    <form action="{{ route('admin.users.update_ban_status') }}" method="POST">
        @csrf
        <input type="hidden" name="uid" value="{{ $user->id }}">
        <div class="modal-body">
               <x-form.textarea label="{{ $btitle }} Reason:"
                 name="remark" placeholder="type reason"  :required="true"/>                  
        </div>    
    @slot('footer')
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-primary">Update</button>
        </form>
    @endslot
</x-ui.modal> 

@endsection

@section('scripts')
    @include('layouts.components.common-script')

    <!-- Gallery JS -->
    <script src="{{ asset('build/assets/libs/glightbox/js/glightbox.min.js') }}"></script>

    <!-- Internal Profile JS -->
    @vite('resources/assets/js/profile.js')

    {{-- load transaction data --}}
    <script>
        $(document).ready(function() {
            const table = new DataTableUtility('mytable', "{{ route('admin.users.activity.data') }}", {
                'user_id': "{{ $user->id }}"
            }, [{
                    data: 'task'
                },
                {
                    data: 'amount',
                    render: function(data, type, row) {
                        return (row.type == "credit") ?
                            `<span class=" fw-semibold  text-success fs-13">+${data}</span>` :
                            `<span class="fw-semibold text-danger fs-13">-${data}</span>`;
                    }
                },
                {
                    data: 'offer_id'
                },
                {
                    data: 'ip'
                },
                {
                    data: 'diamond',
                    render: function(data, type, row) {
                        return (data == 1) ? `Yes` : `No`;
                    }
                },
                {
                    data: 'created_at',
                        render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                }
            ]);
            table.initialize();
        });
 
          const table1 = new DataTableUtility('redeemtable',
                    "{{ route('admin.users.activity.redeem_data') }}", {
                        'user_id': "{{ $user->uid }}"
                    }, [{
                    data: 'id'
                },
                {
                    data: 'type',
                    render:function(data,type,row){
                         return `<div class="d-flex">
                                <span class="avatar avatar-md border">
                                    <img src="{{asset('uploads/')}}/`+row.img+`" alt="">
                                </span>
                                <div class="ms-2">
                                    <p class="fw-medium fs-14 mt-2 d-flex align-items-center">`+data+`</p>
                                </div>
                            </div>`;
                    }
                },
                {
                    data: 'request_to',
                    render: function(data, type, row) {
                        return `<span class="badge fw-medium badge-pill bg-info-transparent text-info fs-11">${data}</span>`
                    }
                },
                {
                    data: 'coin',
                },
                {
                    data: 'giftcode', render: function(data, type, row) {
                        if(data!=null){
                            return data;
                        }
                        return '-';
                    }
                }, {
                    data: 'ip'
                },
                {
                    data: 'status',
                    render: function(data, type, row) {
                        if (data == "Pending") {
                            return `<span class="fw-medium text-warning fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Pending</span>`
                        } else if (data == "Proceed") {
                            return `<span class="fw-medium text-primary fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Proceed</span>`
                        } else if (data == "Completed") {
                             return `<span class="fw-medium text-success fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Completed</span>`
                        } else {
                            return `<span class="fw-medium text-danger fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Rejected</span>`
                        }
                    }
                }, {
                    data: 'remark'
                },
                {
                    data: 'created_at',
                     render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                },{
                    data: 'updated_at',
                     render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                }
            ]);
            table1.initialize();

        
            // 
            
          const table2 = new DataTableUtility('subtable',
                    "{{ route('admin.users.activity.subcription_data') }}", {
                        'user_id': "{{ $user->id }}"
                    }, [{
                    data: 'id'
                },
                {
                    data: 'title'
                }, 
                {
                    data: 'amount',
                    render: function(data, type, row) {
                        if(row.coin_paid>0){
                            return `<p class="text-success fs-14 mt-2 d-flex align-items-center">`+row.currency+` `+row.coin_paid+` </p>`;
                        } else {
                            return `<p class="text-success fs-14 mt-2 d-flex align-items-center">`+row.currency+` `+row.amount+`</p>`;
                        }
                    }
                },
                {
                    data: 'gateway'
                },
                {
                    data: 'status',
                    render: function(data, type, row) {
                        if(data=='active'){
                            return `<span class="badge fw-medium badge-pill bg-success-transparent text-success fs-11">Active</span>`;
                        } else if(data=='expired'){
                            return `<span class="badge fw-medium badge-pill bg-warning-transparent text-danger fs-11 ">Expired</span>`;
                        } else {
                            return `<span class="badge fw-medium badge-pill bg-danger-transparent text-info fs-11">Cancelled</span>`;
                        }
                    }
                },
                {
                    data: 'purchase_at',
                    render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                },
                {
                    data: 'expiry_at',
                    render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                },
            ]);
            table2.initialize();

            // ads table
            $(document).ready(function() {
                const tablead = new DataTableUtility('adtable', "{{ route('admin.users.activity.ads_data') }}", {
                    'user_id': "{{ $user->id }}"
                }, [{
                    data: 'id',render:function(data,type,row){
                        return row.ad_id;
                                        }
                },
                {data: 'title',render:function(data,type,row){
                       if(row.logo!=null){
                         return `<div class="d-flex">
                                <span class="avatar avatar-md border p-1 bg-light">
                                    <img src="{{asset('uploads/ads/')}}/`+row.thumb+`" alt="">
                                </span>
                                <div class="ms-2">
                                    <p class="fw-medium fs-14 mt-2 d-flex align-items-center">`+data+`</p>
                                </div>
                            </div>`;
                       }else{
                        return data;
                       }
                    }},
                    
                {
                    data: 'media',
                    render: function(data, type, row) {
                        if(row.task_format!=null){
                            if(row.task_format=="yt_video"){
                                 return `<div class="d-flex">
                                    <span class="avatar avatar-xxl border p-1 bg-light">
                                        <img src="https://img.youtube.com/vi/` + row.media + `/mqdefault.jpg/" alt="" style="width:150px;">
                                    </span>
                                </div>`;
                            }
                            else if(row.task_format=="website"){
                                let url=(data.includes('http')) ?  ''+data : "{{ asset('uploads/task/web/')}}/"+data ; 
                                    return `<img src="${url}" alt="" style="height:100px; width:150px; border-radius:10px;">`;
                            }
                            else if(row.task_format=="insta"){
                                return `<img src="{{ asset('uploads/task/video/') }}/` + row.media + `" alt="" style="height:100px; width:150px; border-radius:10px;">`;
                            }

                        }else{
                            return `<div class="d-flex">
                                <span class="avatar avatar-xxl border p-1 bg-light">
                                    <img src="{{ asset('uploads/ads') }}/` + row.media + `" alt="" style="width:150px;">
                                </span>
                            </div>`;
                        }
                    }
                },
                {
                    data: 'ad_format',
                    render: function(data, type, row) {
                        if (data == 'BNR') {
                            return `<span class="badge bg-danger-transparent">BANNER</span>`;
                        } else if (data == 'INT') {
                            return `<span class="badge bg-info-transparent">INTERSTITIAL</span>`;
                        } else if (data=='VID') {
                            return `<span class="badge bg-primary-transparent">VideoAd</span>`;
                        }else if (row.task_format=='yt_video') {
                            return `<span class="badge bg-primary-transparent">YT VideoAD</span>`;
                        }else if (row.task_format=='insta') {
                            return `<span class="badge bg-primary-transparent">Insta Reel AD</span>`;
                        }else if (row.task_format=='website') {
                            return `<span class="badge bg-primary-transparent">Website Ad</span>`;
                        }
                    }
                },
                {
                    data: 'target_impression',
                    render: function(data, type, row) {
                        return row.total_impression + ' / ' + row.target_impression;
                    }
                },
                {
                    data: 'status',
                    render: function(data, type, row) {
                        if (data == 0) {
                            return `<span class="fw-medium text-warning fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Pending</span>`
                        } else if (data == 1) {
                            return `<span class="fw-medium text-success fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Active</span>`
                        } else if (data == 2) {
                            return `<span class="fw-medium text-info fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Hold</span>`
                        } else if (data == 3) {
                            return `<span class="fw-medium text-primary fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Completed</span>`
                        } else if (data == 4) {
                            return `<span class="fw-medium text-danger fs-12"><i class="ri-circle-line fw-semibold fs-7 me-2 lh-1 align-middle"></i>Rejected</span>`
                        }
                    }
                },
                {
                    data: 'started_at',
                    render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                },
                {
                    data: 'updated_at',
                    render: function (data, type, row) {
                        if (!data) return '';
                        const d = new Date(data);
                        return d.toLocaleDateString('en-GB', {  // you can change locale
                            year: 'numeric',
                            month: 'short',
                            day: '2-digit',
                            hour: '2-digit',
                            minute: '2-digit'
                        });
                    }
                }
                ]);
                tablead.initialize();
            });
            

            $("#add_coin").on('click',function(){
                $('#wallet-modal').modal('show');
            })
             
            $("#send_noti").on('click',function(){
                $('#noti-modal').modal('show');
            })
             
            $("#ban_user").on('click',function(){
                $('#ban-modal').modal('show');
            })

            $('#delete_trans').on('click',function(){
                  AlertDialog.show({
                    type: "delete",
                    title:"Delete Item",
                    message: "Are you sure you want to delete this item? This action cannot be undone.",
                    onConfirm: () => {
                        console.log("Delete confirmed");
                        var id ="{{ $user->uid }}";

                        const url = `{{ route('admin.users.activity.delete_user_transaction', ['id' => '__ID__']) }}`.replace('__ID__', id);
                        AjaxUtil.get(url, function(response) {
                                if(response.status==201){
                                    AjaxUtil.showToast('Deleted Successfully.', 'success');
                                    location.reload();
                                }else{
                                    AjaxUtil.showToast(response.message, 'error');
                                }   
                            
                            }, function(xhr, status, error) {
                                console.error('Error:', error);
                                AjaxUtil.showToast('Error loading data.', 'error');
                            });
                    }
                });
            })

            $('#delete_user').on('click',function(){
                  AlertDialog.show({
                    type: "delete",
                    title:"Delete User",
                    message: "Are you sure you want to delete this item? This action cannot be undone.",
                    onConfirm: () => {
                        console.log("Delete confirmed");
                        var id ="{{ $user->uid }}";

                        const url = `{{ route('admin.users.delete_user', ['id' => '__ID__']) }}`.replace('__ID__', id);
                        AjaxUtil.get(url, function(response) {
                                if(response.status==201){
                                    AjaxUtil.showToast('Deleted Successfully.', 'success');
                                    location.href="/admin/users/all";
                                }else{
                                    AjaxUtil.showToast(response.message, 'error');
                                }   
                            
                            }, function(xhr, status, error) {
                                console.error('Error:', error);
                                AjaxUtil.showToast('Error loading data.', 'error');
                            });
                    }
                });
            })

    </script>
@endsection