@extends('backend.layouts.app')
@section('content')

<style>
.sl-wrapper { padding: 4px 0; }

.sl-page-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 20px; flex-wrap: wrap; gap: 10px;
}
.sl-page-header h1 { font-size: 20px; font-weight: 700; color: #1a202c; margin: 0; }
.sl-page-header h1 span {
    background: linear-gradient(135deg, #f05a7e, #f6845a);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

.sl-card {
    background: #fff; border-radius: 16px;
    box-shadow: 0 2px 16px rgba(0,0,0,0.07); border: none; overflow: hidden;
}
.sl-card-header {
    padding: 16px 20px; border-bottom: 1px solid #f0f0f0;
    display: flex; align-items: center; justify-content: space-between;
    flex-wrap: wrap; gap: 10px; background: #fff;
}
.sl-card-header h5 { font-size: 15px; font-weight: 700; color: #1a202c; margin: 0; }

.sl-search {
    border: 1.5px solid #e2e8f0 !important; border-radius: 50px !important;
    padding: 8px 16px !important; font-size: 13px !important;
    outline: none !important; transition: border-color .2s !important; min-width: 200px;
}
.sl-search:focus { border-color: #f05a7e !important; }

.sl-select {
    border: 1.5px solid #e2e8f0 !important; border-radius: 50px !important;
    padding: 7px 14px !important; font-size: 13px !important;
    outline: none !important; background: #fff; color: #2d3748;
}

/* Table */
.sl-table { width: 100%; border-collapse: collapse; }
.sl-table thead th {
    background: #f8fafc; padding: 11px 14px;
    font-size: 11px; font-weight: 700; color: #718096;
    text-transform: uppercase; letter-spacing: .6px;
    border-bottom: 1px solid #f0f0f0; white-space: nowrap;
}
.sl-table tbody tr { border-bottom: 1px solid #f7f7f7; transition: background .15s; }
.sl-table tbody tr:hover { background: #fef8f9; }
.sl-table tbody td { padding: 12px 14px; font-size: 13px; color: #2d3748; vertical-align: middle; }

/* Avatar */
.sl-avatar {
    width: 38px; height: 38px; border-radius: 10px;
    background: linear-gradient(135deg, #f05a7e, #f6845a);
    display: flex; align-items: center; justify-content: center;
    font-size: 14px; font-weight: 700; color: #fff; flex-shrink: 0;
    overflow: hidden;
}
.sl-avatar img { width: 100%; height: 100%; object-fit: cover; }

/* Badges */
.sl-badge {
    display: inline-block; padding: 3px 10px;
    border-radius: 50px; font-size: 11px; font-weight: 700;
}
.sl-badge-active   { background: #eaf3de; color: #3b6d11; }
.sl-badge-inactive { background: #fcebeb; color: #a32d2d; }
.sl-badge-package  { background: #ebf8ff; color: #2b6cb0; }
.sl-badge-emi      { background: #faeeda; color: #854f0b; }
.sl-badge-nopack   { background: #f1f5f9; color: #718096; }
.sl-badge-keyword  { background: #e8faf6; color: #0f6e56; }

/* Phone btn */
.sl-phone-btn {
    display: inline-flex; align-items: center; gap: 6px;
    background: #e8faf6; color: #0f6e56; border-radius: 50px;
    padding: 4px 10px; font-size: 12px; font-weight: 600;
    cursor: pointer; border: none; transition: background .15s;
}
.sl-phone-btn:hover { background: #9fe1cb; }

/* Action buttons */
.sl-action-btn {
    width: 30px; height: 30px; border-radius: 8px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 14px; border: none; cursor: pointer;
    transition: all .15s; margin: 1px; text-decoration: none;
}
.sl-action-primary { background: #ebf8ff; color: #2b6cb0; }
.sl-action-primary:hover { background: #bee3f8; color: #2b6cb0; }

/* Plan color badges */
.sl-plan-basic    { background: #e8faf6; color: #0f6e56; border: 1.5px solid #9fe1cb; }
.sl-plan-silver   { background: #f1f5f9; color: #475569; border: 1.5px solid #cbd5e1; }
.sl-plan-gold     { background: #fef9c3; color: #854d0e; border: 1.5px solid #fde047; }
.sl-plan-platinum { background: #ede9fe; color: #5b21b6; border: 1.5px solid #c4b5fd; }
.sl-plan-diamond  { background: #fce7f3; color: #9d174d; border: 1.5px solid #f9a8d4; }
.sl-plan-expiring { background: #fef2f2; color: #991b1b; border: 1.5px solid #fca5a5; }
.sl-plan-expired  { background: #f1f5f9; color: #94a3b8; border: 1.5px solid #e2e8f0; text-decoration: line-through; }

/* Stars rating */
.sl-stars { color: #f6ad55; font-size: 11px; letter-spacing: 1px; }
.sl-stars-empty { color: #e2e8f0; font-size: 11px; }

/* Responsive */
@media (max-width: 991px) {
    .sl-table thead { display: none; }
    .sl-table tbody tr {
        display: block; margin-bottom: 12px;
        border: 1px solid #e2e8f0; border-radius: 12px;
        padding: 12px; background: #fff;
    }
    .sl-table tbody td {
        display: flex; justify-content: space-between; align-items: center;
        padding: 7px 8px; border-bottom: 1px solid #f7f7f7; font-size: 13px;
    }
    .sl-table tbody td:last-child { border-bottom: none; }
    .sl-table tbody td::before {
        content: attr(data-label); font-weight: 700; font-size: 11px;
        color: #718096; text-transform: uppercase; letter-spacing: .5px;
        flex-shrink: 0; margin-right: 10px;
    }
    .sl-card-header { flex-direction: column; align-items: flex-start; }
}
</style>

<h3 class="mb-3 success_message text-center" style="color:green;"></h3>
<h3 class="mb-3 error_message text-center" style="color:red;"></h3>

<div class="sl-wrapper">
<div class="sl-page-header">
    <h1>All <span>Sellers</span></h1>
</div>

<div class="sl-card">
    <form id="sort_sellers" action="" method="GET">
        <div class="sl-card-header">
            <h5>{{ translate('Sellers') }}</h5>
            <div class="d-flex align-items-center gap-10 flex-wrap">
                @can('delete_seller')
                    <div class="dropdown">
                        <button class="btn border dropdown-toggle btn-sm" type="button" data-toggle="dropdown">
                            {{ translate('Bulk Action') }}
                        </button>
                        <div class="dropdown-menu dropdown-menu-right">
                            <a class="dropdown-item" href="#" onclick="bulk_delete()">{{ translate('Delete selection') }}</a>
                        </div>
                    </div>
                @endcan
            </div>
        </div>

        {{-- Filters Row --}}
        <div style="padding:12px 20px;border-bottom:1px solid #f0f0f0;background:#fafafa;display:flex;flex-wrap:wrap;gap:10px;align-items:center;">

            {{-- Filter by Seller Type --}}
            <select class="sl-select" name="search_seller" id="search_seller" onchange="sort_sellers()" style="min-width:160px;">
                <option value="">🏪 All Sellers</option>
                <option value="all" @isset($search_seller) @if($search_seller == 'all_seller') selected @endif @endisset>{{ translate('All Seller') }}</option>
                <option value="membership_seller" @isset($search_seller) @if($search_seller == 'membership_seller') selected @endif @endisset>{{ translate('Membership Seller') }}</option>
                <option value="without_membership_seller" @isset($search_seller) @if($search_seller == 'without_membership_seller') selected @endif @endisset>{{ translate('Without Membership') }}</option>
            </select>

            {{-- Filter by Approval --}}
            <select class="sl-select" name="approved_status" id="approved_status" onchange="sort_sellers()" style="min-width:160px;">
                <option value="">✅ All Approvals</option>
                <option value="1" @isset($approved) @if($approved == 'paid') selected @endif @endisset>{{ translate('Approved') }}</option>
                <option value="0" @isset($approved) @if($approved == 'unpaid') selected @endif @endisset>{{ translate('Non-Approved') }}</option>
            </select>

            {{-- Filter by Plan Status --}}
            <select class="sl-select" name="plan_status" id="plan_status" onchange="sort_sellers()" style="min-width:160px;">
                <option value="">📦 All Plans</option>
                <option value="active"   {{ ($plan_status ?? '') == 'active'   ? 'selected' : '' }}>✅ Active Plans</option>
                <option value="expiring" {{ ($plan_status ?? '') == 'expiring' ? 'selected' : '' }}>⚠️ Expiring (7 days)</option>
                <option value="expired"  {{ ($plan_status ?? '') == 'expired'  ? 'selected' : '' }}>⛔ Expired</option>
                <option value="no_plan"  {{ ($plan_status ?? '') == 'no_plan'  ? 'selected' : '' }}>❌ No Plan</option>
            </select>

            {{-- Search --}}
            <div style="position:relative;flex:1;min-width:200px;">
                <i class="las la-search" style="position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#a0aec0;font-size:14px;"></i>
                <input type="text" class="sl-search" style="padding-left:34px;width:100%;" id="search" name="search"
                    @isset($sort_search) value="{{ $sort_search }}" @endisset
                    placeholder="{{ translate('Type name or email & Enter') }}">
            </div>

            {{-- Clear filters --}}
            @if(request()->anyFilled(['search_seller','approved_status','plan_status','search']))
                <a href="{{ route('sellers.index') }}"
                   style="font-size:12px;color:#a0aec0;white-space:nowrap;text-decoration:none;border:1.5px solid #e2e8f0;border-radius:50px;padding:7px 14px;">
                    ✕ Clear
                </a>
            @endif
        </div>

        <div class="card-body p-0">
            <div class="table-responsive">
            <table class="sl-table">
                <thead>
                    <tr>
                        <th style="width:40px;">
                            @if(auth()->user()->can('delete_seller'))
                                <label class="aiz-checkbox mb-0">
                                    <input type="checkbox" class="check-all">
                                    <span class="aiz-square-check"></span>
                                </label>
                            @else
                                #
                            @endif
                        </th>
                        <th>{{ translate('Seller') }}</th>
                        <th>{{ translate('Contact') }}</th>
                        <th>{{ translate('Package / EMI') }}</th>
                        <th>{{ translate('Products') }}</th>
                        <th>{{ translate('Due') }}</th>
                        <th>{{ translate('Approval') }}</th>
                        <th>{{ translate('Verification') }}</th>
                        @if(empty($business_partner_id))
                            <th class="text-right">{{ translate('Options') }}</th>
                        @endif
                    </tr>
                </thead>
                <tbody>
                    @foreach($shops as $key => $shop)
                    @php
                        $initial = strtoupper(substr($shop->name ?? 'S', 0, 2));
                        $emiSub = \Illuminate\Support\Facades\DB::table('seller_emi_subscriptions')
                            ->where('user_id', $shop->user_id)
                            ->whereIn('subscription_status', ['active','created'])
                            ->first();

                        // Plan expiry — directly from shops.package_invalid_at
                        $expireDate = $shop->package_invalid_at
                            ? \Carbon\Carbon::parse($shop->package_invalid_at)
                            : null;
                        $daysLeft = $expireDate ? now()->diffInDays($expireDate, false) : null;

                        // Plan color based on name
                        $pkgName = strtolower($shop->seller_package->name ?? '');
                        if (str_contains($pkgName, 'diamond'))       $planClass = 'sl-plan-diamond';
                        elseif (str_contains($pkgName, 'platinum'))  $planClass = 'sl-plan-platinum';
                        elseif (str_contains($pkgName, 'gold'))      $planClass = 'sl-plan-gold';
                        elseif (str_contains($pkgName, 'silver'))    $planClass = 'sl-plan-silver';
                        else                                          $planClass = 'sl-plan-basic';

                        // Override if expiring/expired
                        if ($daysLeft !== null && $daysLeft <= 0)     $planClass = 'sl-plan-expired';
                        elseif ($daysLeft !== null && $daysLeft <= 7) $planClass = 'sl-plan-expiring';

                        // Rating
                        $rating     = $shop->rating ?? 0;
                        $fullStars  = floor($rating);
                        $emptyStars = 5 - $fullStars;
                    @endphp
                    <tr>
                        {{-- Checkbox --}}
                        <td data-label="#">
                            @if(auth()->user()->can('delete_seller'))
                                <label class="aiz-checkbox mb-0">
                                    <input type="checkbox" class="check-one" name="id[]" value="{{ $shop->id }}">
                                    <span class="aiz-square-check"></span>
                                </label>
                            @else
                                {{ ($key+1) + ($shops->currentPage() - 1)*$shops->perPage() }}
                            @endif
                        </td>

                        {{-- Seller Info --}}
                        <td data-label="Seller">
                            <div class="d-flex align-items-center gap-10">
                                <div class="sl-avatar">
                                    @if($shop->logo)
                                        <img src="{{ asset('storage/'.$shop->logo) }}"
                                             onerror="this.style.display='none';this.parentNode.innerHTML='{{ $initial }}'">
                                    @else
                                        {{ $initial }}
                                    @endif
                                </div>
                                <div style="min-width:0;">
                                    <div style="font-size:10px;color:#a0aec0;">#{{ $shop->user_id }}</div>
                                    <div style="font-weight:700;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px;">
                                        @if($shop->user->banned == 1)
                                            <i class="las la-ban text-danger" style="font-size:11px;"></i>
                                        @endif
                                        {{ $shop->name }}
                                        @if(isset($shop->sub_cat_ids) && !empty($shop->sub_cat_ids))
                                            <span class="sl-badge sl-badge-keyword ml-1" title="Keywords set">K</span>
                                        @endif
                                    </div>
                                    <div style="font-size:11px;color:#718096;">{{ $shop->user->name }}</div>
                                    <div style="font-size:11px;color:#a0aec0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:180px;">{{ $shop->user->email }}</div>
                                    @if($rating > 0)
                                        <div style="margin-top:2px;">
                                            <span class="sl-stars">{{ str_repeat('★', $fullStars) }}</span><span class="sl-stars-empty">{{ str_repeat('★', $emptyStars) }}</span>
                                            <span style="font-size:10px;color:#718096;">{{ number_format($rating,1) }}</span>
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </td>

                        {{-- Contact --}}
                        <td data-label="Contact">
                            <button class="sl-phone-btn click-to-call" data-phone="{{ $shop->user->phone }}" type="button">
                                <i class="las la-phone"></i>
                                {{ $shop->user->phone }}
                            </button>
                        </td>

                        {{-- Package / EMI --}}
                        <td data-label="Package / EMI">
                            @if($emiSub)
                                <span class="sl-badge sl-badge-emi">
                                    💳 EMI
                                </span>
                                @php
                                    $paid = $emiSub->paid_emi_count ?? 0;
                                    $total = $emiSub->total_emis > 0 ? $emiSub->total_emis : 1;
                                    $pct = round(($paid/$total)*100);
                                @endphp
                                <div style="margin-top:4px;">
                                    <div class="sl-progress">
                                        <div class="sl-progress-fill" style="width:{{ $pct }}%"></div>
                                    </div>
                                    <span style="font-size:10px;color:#a0aec0;">{{ $paid }}/{{ $emiSub->total_emis }} EMIs</span>
                                </div>
                                <a href="{{ route('admin.emi_subscriptions.index') }}" style="font-size:10px;color:#667eea;">View EMI →</a>
                            @elseif(isset($shop->seller_package->name))
                                <span class="sl-badge {{ $planClass }}" style="display:inline-block;padding:3px 10px;border-radius:50px;font-size:11px;font-weight:700;">
                                    {{ $shop->seller_package->name }}
                                    @if($daysLeft !== null && $daysLeft <= 0)
                                        ⛔
                                    @elseif($daysLeft !== null && $daysLeft <= 7)
                                        ⚠️
                                    @endif
                                </span>
                                @if($expireDate)
                                    <div style="margin-top:3px;">
                                        @if($daysLeft !== null && $daysLeft <= 0)
                                            <span style="font-size:10px;color:#a32d2d;font-weight:600;">Expired {{ $expireDate->diffForHumans() }}</span>
                                        @elseif($daysLeft !== null && $daysLeft <= 7)
                                            <span style="font-size:10px;color:#c2410c;font-weight:600;">Expires in {{ $daysLeft }} days</span>
                                        @else
                                            <span style="font-size:10px;color:#a0aec0;">Expires {{ $expireDate->format('d M Y') }}</span>
                                        @endif
                                    </div>
                                @endif
                            @else
                                <span class="sl-badge sl-badge-nopack">No Package</span>
                            @endif
                        </td>

                        {{-- Products --}}
                        <td data-label="Products">
                            <span style="font-weight:700;font-size:14px;color:#2d3748;">
                                {{ $shop->user->products->count() }}
                            </span>
                        </td>

                        {{-- Due --}}
                        <td data-label="Due">
                            @if($shop->admin_to_pay >= 0)
                                <span style="font-weight:600;color:#2b6cb0;font-size:13px;">
                                    {{ single_price($shop->admin_to_pay) }}
                                </span>
                            @else
                                <span style="font-weight:600;color:#a32d2d;font-size:13px;">
                                    {{ single_price(abs($shop->admin_to_pay)) }}
                                    <small style="font-size:10px;">(to Admin)</small>
                                </span>
                            @endif
                        </td>

                        {{-- Approval toggle --}}
                        <td data-label="Approval">
                            <label class="aiz-switch aiz-switch-success mb-0">
                                <input
                                    @can('approve_seller') onchange="update_approved(this)" @endcan
                                    value="{{ $shop->id }}"
                                    type="checkbox"
                                                                        @cannot('approve_seller') disabled @endcan
                                >
                                <span class="slider round"></span>
                            </label>
                        </td>

                        {{-- Verification --}}
                        <td data-label="Verification">
                            @if($shop->verification_info != null)
                                <a href="{{ route('sellers.show_verification_request', $shop->id) }}"
                                   class="sl-badge sl-badge-active" style="text-decoration:none;">
                                    <i class="las la-eye" style="font-size:11px;"></i> View
                                </a>
                            @else
                                <span style="color:#a0aec0;font-size:12px;">—</span>
                            @endif
                        </td>

                        {{-- Options --}}
                        @if(empty($business_partner_id))
                        <td data-label="Options" class="text-right">
                            <div class="dropdown d-inline-block">
                                <button type="button"
                                    class="sl-action-btn sl-action-primary dropdown-toggle"
                                    style="padding:0 10px;width:auto;border-radius:8px;"
                                    data-toggle="dropdown">
                                    <i class="las la-ellipsis-v"></i>
                                </button>
                                <div class="dropdown-menu dropdown-menu-right dropdown-menu-xs">
                                    @can('view_seller_profile')
                                        <a href="#" onclick="show_seller_profile('{{ $shop->id }}');" class="dropdown-item">
                                            <i class="las la-user mr-1"></i> {{ translate('Profile') }}
                                        </a>
                                    @endcan
                                    @can('login_as_seller')
                                        <a href="{{ route('sellers.login', encrypt($shop->id)) }}" class="dropdown-item">
                                            <i class="las la-sign-in-alt mr-1"></i> {{ translate('Log in as Seller') }}
                                        </a>
                                    @endcan
                                    @can('pay_to_seller')
                                        <a href="#" onclick="show_seller_payment_modal('{{ $shop->id }}');" class="dropdown-item">
                                            <i class="las la-money-bill mr-1"></i> {{ translate('Go to Payment') }}
                                        </a>
                                    @endcan
                                    @can('seller_payment_history')
                                        <a href="{{ route('sellers.payment_history', encrypt($shop->user_id)) }}" class="dropdown-item">
                                            <i class="las la-history mr-1"></i> {{ translate('Payment History') }}
                                        </a>
                                    @endcan
                                    @can('edit_seller')
                                        <a href="{{ route('sellers.edit', encrypt($shop->id)) }}" class="dropdown-item">
                                            <i class="las la-edit mr-1"></i> {{ translate('Edit') }}
                                        </a>
                                    @endcan
                                    @can('add_keyword')
                                        <a onclick="getSetShopInfo({{ $shop->id }});" class="dropdown-item" style="cursor:pointer;">
                                            <i class="las la-tags mr-1"></i> {{ translate('Add Keyword') }}
                                        </a>
                                    @endcan
                                    @can('ban_seller')
                                        @if($shop->user->banned != 1)
                                            <a href="#" onclick="confirm_ban('{{ route('sellers.ban', $shop->id) }}');" class="dropdown-item text-danger">
                                                <i class="las la-user-slash mr-1"></i> {{ translate('Ban Seller') }}
                                            </a>
                                        @else
                                            <a href="#" onclick="confirm_unban('{{ route('sellers.ban', $shop->id) }}');" class="dropdown-item text-success">
                                                <i class="las la-user-check mr-1"></i> {{ translate('Unban Seller') }}
                                            </a>
                                        @endif
                                    @endcan
                                    @can('delete_seller')
                                        <a href="#" class="dropdown-item text-danger confirm-delete"
                                           data-href="{{ route('sellers.destroy', $shop->id) }}">
                                            <i class="las la-trash mr-1"></i> {{ translate('Delete') }}
                                        </a>
                                    @endcan
                                </div>
                            </div>
                        </td>
                        @endif
                    </tr>
                    @endforeach
                </tbody>
            </table>
            </div>
            <div class="px-4 py-3">
                {{ $shops->appends(request()->input())->links() }}
            </div>
        </div>
    </form>
</div>
</div>

@endsection

@section('modal')
    @include('modals.delete_modal')

    <div class="modal fade" id="profile_modal">
        <div class="modal-dialog">
            <div class="modal-content" id="profile-modal-content"></div>
        </div>
    </div>

    <div class="modal fade" id="payment_modal">
        <div class="modal-dialog">
            <div class="modal-content" id="payment-modal-content"></div>
        </div>
    </div>

    <div class="modal fade" id="confirm-ban">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title h6">{{ translate('Confirmation') }}</h5>
                    <button type="button" class="close" data-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <p>{{ translate('Do you really want to ban this seller?') }}</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ translate('Cancel') }}</button>
                    <a class="btn btn-primary" id="confirmation">{{ translate('Proceed!') }}</a>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="confirm-unban">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title h6">{{ translate('Confirmation') }}</h5>
                    <button type="button" class="close" data-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <p>{{ translate('Do you really want to unban this seller?') }}</p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-dismiss="modal">{{ translate('Cancel') }}</button>
                    <a class="btn btn-primary" id="confirmationunban">{{ translate('Proceed!') }}</a>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="seller-keyword-modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title h6">{{ translate('Add Keyword') }}</h5>
                    <button type="button" class="close" data-dismiss="modal"></button>
                </div>
                <form action="{{ route('shop.updateKeyword') }}" method="POST">
                    <div class="modal-body">
                        <input type="hidden" name="shop_id" id="shop_id" value="">
                        @csrf
                        <div class="row">
                            <label class="col-md-2 col-form-label">{{ translate('Keywords') }}</label>
                            <div class="col-md-10 select-keyword">
                                <span class="sub_message"></span>
                                <select class="form-control" style="width:360px;" multiple="multiple"
                                    name="subcategory_id[]" id="subcategory_id">
                                    @foreach(App\Models\Category::where('parent_id', '!=', 0)->get() as $value)
                                        <option value="{{ $value->id }}">{{ $value->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-light" data-dismiss="modal">{{ translate('Cancel') }}</button>
                        <button type="submit" class="btn btn-primary">{{ translate('Save') }}</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection

@section('script')
<script type="text/javascript">
    $(document).ready(function() {
        $("#subcategory_id").select2({ placeholder: "Select a sub category" });
    });

    $(document).on("change", ".check-all", function() {
        $('.check-one:checkbox').prop('checked', this.checked);
    });

    function show_seller_payment_modal(id){
        $.post('{{ route('sellers.payment_modal') }}', {_token:'{{ @csrf_token() }}', id:id}, function(data){
            $('#payment_modal #payment-modal-content').html(data);
            $('#payment_modal').modal('show', {backdrop: 'static'});
            $('.demo-select2-placeholder').select2();
        });
    }

    function show_seller_profile(id){
        $.post('{{ route('sellers.profile_modal') }}', {_token:'{{ @csrf_token() }}', id:id}, function(data){
            $('#profile_modal #profile-modal-content').html(data);
            $('#profile_modal').modal('show', {backdrop: 'static'});
        });
    }

    function update_approved(el){
        var status = el.checked ? 1 : 0;
        $.post('{{ route('sellers.approved') }}', {_token:'{{ csrf_token() }}', id:el.value, status:status}, function(data){
            if(data == 1){
                AIZ.plugins.notify('success', '{{ translate('Approved sellers updated successfully') }}');
            } else {
                AIZ.plugins.notify('danger', '{{ translate('Something went wrong') }}');
            }
        });
    }

    function sort_sellers(){ $('#sort_sellers').submit(); }

    function confirm_ban(url){
        $('#confirm-ban').modal('show', {backdrop: 'static'});
        document.getElementById('confirmation').setAttribute('href', url);
    }

    function confirm_unban(url){
        $('#confirm-unban').modal('show', {backdrop: 'static'});
        document.getElementById('confirmationunban').setAttribute('href', url);
    }

    function getSetShopInfo(shopId){
        $('#shop_id').val(shopId);
        $.ajax({
            url: "{{ route('sellers.getAndUpdateShopInfo') }}",
            dataType: "json", type: "post",
            data: { "_token": "{{ csrf_token() }}", "shopId": shopId },
            success: function(result){
                $('#subcategory_id').val(result.subCategoryArray).trigger('change');
            }
        });
        $('#seller-keyword-modal').modal('show', {backdrop: 'static'});
    }

    function bulk_delete(){
        var data = new FormData($('#sort_sellers')[0]);
        $.ajax({
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            url: "{{ route('bulk-seller-delete') }}",
            type: 'POST', data: data,
            cache: false, contentType: false, processData: false,
            success: function(response){ if(response == 1) location.reload(); }
        });
    }

    function ClickToCallAdmin(phone){
        var formData = new FormData();
        formData.append('phone', phone);
        $.ajax({
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            url: "{{ route('clicktocall.admin') }}",
            type: 'POST', data: formData,
            cache: false, contentType: false, processData: false,
            success: function(response){
                if(response.data.code === 200){
                    $('.success_message').html('<b>' + response.message + '</b>').fadeIn().delay(4000).fadeOut();
                } else {
                    $('.error_message').html('<b>' + response.message + '</b>').fadeIn().delay(4000).fadeOut();
                }
            }
        });
    }

    $(document).on('click', '.click-to-call', function(){
        ClickToCallAdmin($(this).data('phone'));
    });
</script>
@endsection