@extends('web.layouts.layout')

@section('content')

    <main id="profile-page">
        <!-- ---------- profile-pg ----------- -->
        <section class="profile-pg">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3">
                        <div class="sidemenu">
                            <form id="uploadForm" enctype="multipart/form-data" method="POST">
                                @csrf
                                <div class="user_img">
                                    <div class="avatar-upload">
                                        @if($userRole == 'seller')
                                            <div class="avatar-edit">
                                                <input type='file' name="photo" id="imageUpload"
                                                       accept=".png, .jpg, .jpeg"/>
                                                <label for="imageUpload"></label>
                                            </div>
                                        @endif
                                        <div class="avatar-preview">
                                            <div id="imagePreview"
                                                 style="background-image: url({{ getImage($user->photo ?? "") }});"></div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                            <div class="user-info">
                                <h6> {{ $user->name ?? $user->username ?? "" }} </h6>
                            </div>
                            <div class="accordion links-accordion" id="accordionExample">
                                <div class="accordion-item">
                                    <h2 class="accordion-header">
                                        <button
                                            class="accordion-button {{ getTabsClasses(['info', 'update_password', 'national_id_image'], $tab)['is_collapsed'] }}"
                                            type="button" data-bs-toggle="collapse"
                                            data-bs-target="#collapseOne" aria-expanded="true"
                                            aria-controls="collapseOne">
                                            {{ __('users::users.account_details') }}
                                        </button>
                                    </h2>
                                    <div id="collapseOne"
                                         class="accordion-collapse collapse {{ getTabsClasses(['info', 'update_password', 'national_id_image'], $tab)['nav'] }}"
                                         data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <ul class="sublinks">
                                                <li>
                                                    <a href="#0"
                                                       class="tab-link {{ getTabsClasses('info', $tab)['link'] }}"
                                                       data-tab="profile-tab">
                                                        {{ __('users::users.profile_personly') }}
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="{{ route('web.users.verifyOldContactInfo', ['field_key' => 'phone']) }}"
                                                       class="link" data-tab="">
                                                        {{ __('users::users.update_phone') }}
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="{{ route('web.users.verifyOldContactInfo', ['field_key' => 'email']) }}"
                                                       class="link" data-tab="email-tab">
                                                        {{ __('users::users.update_email') }}
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="#0"
                                                       class="tab-link {{ getTabsClasses('update_password', $tab)['link'] }}"
                                                       data-tab="password-tab">
                                                        {{ __('users::users.update_password') }}
                                                    </a>
                                                </li>
                                                @if($userRole == 'seller')
                                                    <li>
                                                        <a href="#0"
                                                           class="tab-link {{ getTabsClasses('national_id_image', $tab)['link'] }}"
                                                           data-tab="id-tab">
                                                            {{ __('users::users.update_national_id_image') }}
                                                        </a>
                                                    </li>
                                                @endif
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                @if($userRole == 'seller')
                                    <div class="accordion-item">
                                        <h2 class="accordion-header">
                                            <button
                                                class="accordion-button {{ getTabsClasses(['accounts', 'upgrade', 'manage_account'], $tab)['is_collapsed'] }}"
                                                type="button"
                                                data-bs-toggle="collapse" data-bs-target="#collapseSeven"
                                                aria-expanded="false" aria-controls="collapseSeven">
                                                {{ __('products::products.accounts') }}
                                            </button>
                                        </h2>
                                        <div id="collapseSeven"
                                             class="accordion-collapse collapse {{ getTabsClasses(['accounts', 'upgrade', 'manage_account'], $tab)['nav'] }}"
                                             data-bs-parent="#accordionExample">
                                            <div class="accordion-body">
                                                <ul class="sublinks">
                                                    <li>
                                                        <a href="#0"
                                                           class="tab-link {{ getTabsClasses('accounts', $tab)['link'] }}"
                                                           data-tab="accounts-tab">
                                                            {{ __('products::products.view_accounts') }}
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="#0"
                                                           class="tab-link {{ getTabsClasses('manage_account', $tab)['link'] }}"
                                                           data-tab="manage-account-tab">
                                                            {{ __('products::products.add_new_account') }}
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="#0"
                                                           class="tab-link {{ getTabsClasses('upgrade', $tab)['link'] }}"
                                                           data-tab="upgrade-tab">
                                                            {{ __('subscriptions::subscriptions.upgrade_requests') }}
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                @endif
                                <div class="accordion-item">
                                    <h2 class="accordion-header">
                                        <button
                                            class="accordion-button {{ getTabsClasses(['balance', 'transactions'], $tab)['is_collapsed'] }}"
                                            type="button"
                                            data-bs-toggle="collapse"
                                            data-bs-target="#collapseTwo" aria-expanded="false"
                                            aria-controls="collapseTwo">
                                            {{ __('users::users.payments') }}
                                        </button>
                                    </h2>
                                    <div id="collapseTwo"
                                         class="accordion-collapse collapse {{ getTabsClasses(['balance', 'transactions'], $tab)['nav'] }}"
                                         data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <ul class="sublinks">
                                                <li>
                                                    <a href="#0"
                                                       class="tab-link {{ getTabsClasses('balance', $tab)['link'] }}"
                                                       data-tab="balance-tab">
                                                        {{ __('users::users.my_balance') }}
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="#0"
                                                       class="tab-link {{ getTabsClasses('transactions', $tab)['link'] }}"
                                                       data-tab="transactions-tab">
                                                        {{ __('users::users.transactions') }}
                                                    </a>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header">
                                        <button
                                            class="accordion-button {{ getTabsClasses(['user_orders', 'seller_orders'], $tab)['is_collapsed'] }}"
                                            type="button"
                                            data-bs-toggle="collapse"
                                            data-bs-target="#collapseThree" aria-expanded="false"
                                            aria-controls="collapseThree">
                                            {{ __('users::users.orders') }}
                                        </button>
                                    </h2>
                                    <div id="collapseThree"
                                         class="accordion-collapse collapse {{ getTabsClasses(['user_orders', 'seller_orders'], $tab)['nav'] }}"
                                         data-bs-parent="#accordionExample">
                                        <div class="accordion-body">
                                            <ul class="sublinks">
                                                <li>
                                                    <a href="#0"
                                                       class="tab-link {{ getTabsClasses('user_orders', $tab)['link'] }}"
                                                       data-tab="orders-tab">
                                                        {{ __('users::users.user_orders') }}
                                                    </a>
                                                </li>
                                                @if($userRole == 'seller')
                                                    <li>
                                                        <a href="#0"
                                                           class="tab-link {{ getTabsClasses('seller_orders', $tab)['link'] }}"
                                                           data-tab="seller-orders-tab">
                                                            {{ __('users::users.orders_as_seller') }}
                                                        </a>
                                                    </li>
                                                @endif
                                            </ul>
                                        </div>
                                    </div>
                                </div>
                                <div class="accordion-item">
                                    <h2 class="accordion-header">
                                        <button
                                            class="accordion-button {{ getTabsClasses('chats', $tab)['is_collapsed'] }} single-link"
                                            type="button"
                                            data-bs-toggle="collapse"
                                            data-bs-target="#collapseFour" aria-expanded="false"
                                            aria-controls="collapseFour">
                                            <a href="#0" class="tab-link {{ getTabsClasses('chats', $tab)['link'] }}"
                                               data-tab="chat-tab">
                                                {{ __('users::users.chats') }}
                                            </a>
                                        </button>
                                    </h2>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-9">
                        <div class="tab-content" id="profile-tabContent">
                            <div class="tab-pane fade {{ getTabsClasses('info', $tab)['tab'] }}" id="profile-tab">
                                @include('web.users::_profile_tab')
                            </div>
                            <div class="tab-pane fade {{ getTabsClasses('balance', $tab)['tab'] }}" id="balance-tab">
                                @include('web.users::_balance_tab')
                            </div>
                            <div class="tab-pane fade {{ getTabsClasses('transactions', $tab)['tab'] }}"
                                 id="transactions-tab">
                                @include('web.users::_transactions_tab')
                            </div>
                            <div class="tab-pane fade {{ getTabsClasses('user_orders', $tab)['tab'] }}" id="orders-tab">
                                @include('web.users::_orders_tab')
                            </div>
                            @if($userRole == 'seller')
                                <div class="tab-pane fade {{ getTabsClasses('seller_orders', $tab)['tab'] }}"
                                     id="seller-orders-tab">
                                    @include('web.users::seller._seller_orders_tab')
                                </div>
                            @endif
                            <div class="tab-pane fade {{ getTabsClasses('chats', $tab)['tab'] }}" id="chat-tab">
                                @include('web.chats::_chat_tab')
                            </div>
                            <div class="tab-pane fade {{ getTabsClasses('update_password', $tab)['tab'] }}"
                                 id="password-tab">
                                @include('web.users::_password_tab')
                            </div>
                            @if($userRole == 'seller')
                                <div class="tab-pane fade {{ getTabsClasses('national_id_image', $tab)['tab'] }}"
                                     id="id-tab">
                                    @include('web.users::seller._national_id_image_tab')
                                </div>
                                <div class="tab-pane fade {{ getTabsClasses('accounts', $tab)['tab'] }}"
                                     id="accounts-tab">
                                    @include('web.users::seller._accounts_tab')
                                </div>
                                <div class="tab-pane fade {{ getTabsClasses('upgrade', $tab)['tab'] }}"
                                     id="upgrade-tab">
                                    @include('web.users::seller._upgrade_tab')
                                </div>
                                <div class="tab-pane fade {{ getTabsClasses('manage_account', $tab)['tab'] }}"
                                     id="manage-account-tab">
                                    @include('web.users::seller._manage_account_tab')
                                </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </main>

    <!-- Modal -->
    <div class="modal fade modal-edit-info" id="modal-edit-info" tabindex="-1" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <form action="{{ route('web.users.update_profile', $user->id) }}"
                      method="post" enctype="multipart/form-data" class="edit-profile add-asterisk ajax-form">
                    @method('PUT')
                    @csrf
                    <div class="modal-body">
                        <h5 class="main-title"> {{ __('users::users.update_personal_data') }} </h5>
                        <div class="form form-box">
                            <div class="row">
                                @if(in_array('name', $moduleFields))
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6 class="required"> {{ __('users::users.name') }} </h6>
                                            <input type="text"
                                                   name="name"
                                                   value='{{ old("name", $user->name ?? "") }}'
                                                   class="form-control {{ $errors->has('name') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('users::users.name') }}"/> <!-- required -->
                                        </div>
                                    </div>
                                @endif
                                @if(in_array('username', $moduleFields))
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6 class="required"> {{ __('users::users.username') }} </h6>
                                            <input type="text"
                                                   name="username"
                                                   value='{{ old("username", $user->username ?? "") }}'
                                                   class="form-control real-time-validation {{ $errors->has('username') ? 'is-invalid' : '' }}"
                                                   data-role="{{ $userRole ?? '' }}"
                                                   data-user-id="{{ $user->id ?? '' }}"
                                                   placeholder="{{ __('users::users.username') }}"/> <!-- required -->
                                        </div>
                                    </div>
                                @endif
                                <div class="col-lg-6">
                                    <div class="form-group mb-4">
                                        <h6 class="required"> {{ __('users::members.first_name') }} </h6>
                                        <input type="text"
                                               name="first_name"
                                               value='{{ old("first_name", $user->first_name ?? "") }}'
                                               class="form-control {{ $errors->has('first_name') ? 'is-invalid' : '' }}"
                                               placeholder="{{ __('users::members.first_name') }}"/> <!-- required -->
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group mb-4">
                                        <h6 class="required"> {{ __('users::members.last_name') }} </h6>
                                        <input type="text"
                                               name="last_name"
                                               value='{{ old("last_name", $user->last_name ?? "") }}'
                                               class="form-control {{ $errors->has('last_name') ? 'is-invalid' : '' }}"
                                               placeholder="{{ __('users::members.last_name') }}"/> <!-- required -->
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group mb-4">
                                        <h6 class="@if($userRole == 'seller') required @endif"> {{ __('users::users.address') }} </h6>
                                        <input type="text"
                                               name="address"
                                               value='{{ old("address", $user->address ?? "") }}'
                                               class="form-control {{ $errors->has('address') ? 'is-invalid' : '' }}"
                                               placeholder="{{ __('users::users.address') }}"/>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group mb-4">
                                        <h6 class="@if($userRole == 'seller') required @endif"> {{ __('users::members.birth_date') }} </h6>
                                        <input type="date"
                                               name="birth_date"
                                               value='{{ old("birth_date", $user->birth_date ?? "") }}'
                                               class="form-control {{ $errors->has('birth_date') ? 'is-invalid' : '' }}"
                                               placeholder="{{ __('users::members.birth_date') }}"/>
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="form-group mb-4">
                                        <h6 class="required"> {{ __('users::members.country_id') }} </h6>
                                        <select name="country_id"
                                                class="form-control {{ $errors->has('country_id') ? 'is-invalid' : '' }}">
                                            <!-- required -->
                                            <option
                                                value="">{{ __('general.choose').' '.__("members.country_id") }}</option>
                                            @foreach($countries as $country)
                                                <option
                                                    @selected(old('country_id', $user->country_id ?? "") == $country->id) value="{{ $country->id }}">
                                                    {{ $country->title ?? "" }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                @if($userRole == 'seller')
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <h6 class="required">{{ __('sellers.account_type') }}</h6>
                                            <div class="boxes-check">
                                                @foreach(config('general.users.seller_account_types') as $accountType)
                                                    <div
                                                        class="form-check form-check-inline {{ $loop->index == 0 ? 'ms-0' : '' }}">
                                                        <input class="form-check-input exclude-required"
                                                               type="radio"
                                                               value="{{ $accountType }}"
                                                               id="account_{{ $accountType }}"
                                                               name="account_type"
                                                        @if(old('account_type', $user->account_type ?? ""))
                                                            @checked(old('account_type', $user->account_type ?? "") == $accountType)
                                                            @else
                                                            @checked($loop->first)
                                                            @endif /> <!-- required -->
                                                        <label class="form-check-label"
                                                               for="account_{{ $accountType }}">
                                                            <div
                                                                class="text">{{ __("sellers.account_type_$accountType") }}</div>
                                                        </label>
                                                    </div>
                                                @endforeach
                                            </div>
                                        </div>
                                    </div> <!-- end of col -->
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <h6>
                                                {{ __('sellers.sale_platform_link') }}:
                                                <small class="text-warning ms-2 opacity-50">
                                                    ({{ __('general.optional') }})
                                                </small>
                                            </h6>
                                            <input type="url"
                                                   name="sale_platform_link"
                                                   value="{{ old('sale_platform_link', $user->sale_platform_link ?? "") }}"
                                                   class="form-control {{ $errors->has('sale_platform_link') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('sellers.sale_platform_link') }}"/>
                                        </div>
                                    </div> <!-- end of col -->
                                    <div class="col-lg-6">
                                        <div class="form-group">
                                            <h6 class="required">{{ __('sellers.id_number') }}</h6>
                                            <input type="text"
                                                   name="id_number"
                                                   value="{{ old('id_number', $user->id_number ?? "") }}"
                                                   class="form-control {{ $errors->has('id_number') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('sellers.id_number') }}"/> <!-- required -->
                                        </div>
                                    </div> <!-- end of col -->
                                @endif
                            </div>
                        </div>
                        <div class="btns mt-5">
                            <button type="submit" class="bttn me-2">
                                <i class="fal fa-save me-2"></i>
                                {{ __('general.save_data') }}
                            </button>
                            <a href="#" class="bttn bg-danger text-white" data-bs-dismiss="modal" aria-label="Close"> <i
                                    class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade modal-delete-account" id="modal-delete-account" tabindex="-1"
         aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <form action="{{ route("web.users.deleteAccount", $user->id) }}" method="post">
                    @csrf
                    <div class="modal-body">
                        <h3 class="text-center"> {{ __('users::users.sure_to_delete_account') }} </h3>
                        <div class="btns text-center mt-5">
                            <button type="submit" class="bttn me-2 bg-danger text-white">
                                <i class="fal fa-trash me-2"></i>
                                {{ __('users::users.delete_account') }}
                            </button>
                            <a href="#" class="bttn" data-bs-dismiss="modal" aria-label="Close"> <i
                                    class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- Modal -->
    <div class="modal fade modal-recharge" id="modal-recharge" tabindex="-1" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <form action="{{ route('web.users.recharge.balance') }}" method="post">
                    @csrf
                    <div class="modal-body">
                        <h3 class="text-center mb-5"> {{ __('users::users.recharge_balance') }} </h3>
                        <div class="form form-box">
                            <div class="col-lg-12">
                                <div class="form-group mb-4">
                                    <h6> {{ __('users::users.recharge_value') }} </h6>
                                    <input type="number"
                                           min="0"
                                           name="amount"
                                           value="{{ old('amount') }}"
                                           required
                                           class="form-control {{ $errors->has('amount') ? 'is-invalid' : '' }}"
                                           placeholder="{{ __('users::users.min_max_charge', ['min' => $minRecharge, 'max' => $maxRecharge]) }}"/>
                                </div>
                            </div>
                        </div>
                        <div class="btns text-center mt-5">
                            <button type="submit" class="bttn me-2 custom-submit-btn"><i
                                    class="fal fa-plus me-2"></i> {{ __('users::users.recharge_balance2') }} </button>
                            <a href="#" class="bttn bg-danger text-white" data-bs-dismiss="modal" aria-label="Close"> <i
                                    class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!------------------ sellers modals ------------------->
    <!-- Modal refund -->
    <div class="modal fade modal-refund" id="modal-refund" tabindex="-1" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <form method="post" action="{{ route('web.users.send.financial.request') }}">
                    @csrf
                    <div class="modal-body">
                        <h5 class="main-title"> {{ __('users::users.refund_request') }} </h5>
                        <div class="form form-box">
                            <div class="form-group mb-4">
                                <small class="text-warning mt-2">
                                    {{ __('users::users.send_refund_request2', ['value' => $user->user_balance_by_country['amount_currency'] ?? ""]) }}
                                </small>
                            </div>
                        </div>
                        <div class="btns mt-5">
                            <button type="submit" class="bttn me-2 custom-submit-btn">
                                <i class="fal fa-dollar-sign me-2"></i>
                                {{ __('users::users.refund') }}
                            </button>
                            <a href="#" class="bttn bg-danger text-white" data-bs-dismiss="modal" aria-label="Close"> <i
                                    class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- Modal method choose -->
    <div class="modal fade modal-method-choose" id="modal-method-choose" tabindex="-1"
         aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-xl">
            <div class="modal-content">
                <form action="{{ route('web.users.update.payment.data') }}" method="post">
                    @csrf
                    @method('PUT')
                    <div class="modal-body">
                        <h5 class="main-title"> {{ __('general.choose_payment_method2') }} </h5>
                        <div class="payment boxes-check">
                            <div class="row">
                                @if($paymentMethods->isNotEmpty())
                                    @foreach($paymentMethods as $paymentMethod)
                                        @continue(!in_array($paymentMethod->type, ['bank_transfer', 'paypal', 'western_union', 'usdt']))
                                        <div class="col-lg-6">
                                            <div class="form-check mb-4">
                                                <input class="form-check-input"
                                                       type="radio"
                                                       value="{{ $paymentMethod->id }}"
                                                       id="payment-choose-{{ $paymentMethod->id }}"
                                                       name="payment_method_id"
                                                    @checked(old('payment_method_id', $user->payment_method_id ?? "") == $paymentMethod->id)/>
                                                <label class="form-check-label w-100 px-5 text-start py-4"
                                                       for="payment-choose-{{ $paymentMethod->id }}">
                                                    <div class="row justify-content-between align-items-center">
                                                        <div class="col-lg-6">
                                                            <div class="icon">
                                                                <img
                                                                    src="{{asset('assets/web/images/icons/exchange.svg')}}"
                                                                    alt="">
                                                            </div>
                                                            <div
                                                                class="text">{{ $paymentMethod->currentDescription->title ?? "" }}</div>
                                                        </div>
                                                        <div class="col-lg-4">
                                                            <div
                                                                class="text">{{ __('users::users.redemption_fee', ['value' => $paymentMethod->fees]) }}</div>
                                                        </div>
                                                    </div>
                                                </label>
                                            </div>
                                        </div>
                                    @endforeach
                                @endif
                            </div>
                        </div>
                        <div class="method-form">
                            <div class="form form-box payment-methods payment-method-8">
                                <div class="row">
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.beneficiary_name') }} </h6>
                                            <input type="text"
                                                   name="bank_account_holder_name"
                                                   value='{{ old("bank_account_holder_name", $user->bank_account_holder_name ?? "") }}'
                                                   class="form-control {{ $errors->has('bank_account_holder_name') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('orders::orders.beneficiary_name') }}"/>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.bank_account_number') }} </h6>
                                            <input type="text"
                                                   name="bank_account"
                                                   value='{{ old("bank_account", $user->bank_account ?? "") }}'
                                                   class="form-control {{ $errors->has('bank_account') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('orders::orders.bank_account_number') }}"/>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.country_id') }} </h6>
                                            <select name="country_id"
                                                    class="form-control form-select {{ $errors->has('country_id') ? 'is-invalid' : '' }}">
                                                <option
                                                    value="">{{ __('general.choose').' '.__("members.country_id") }}</option>
                                                @foreach($countries as $country)
                                                    <option
                                                        @selected(old('country_id', $user->country_id ?? "") == $country->id) value="{{ $country->id }}">
                                                        {{ $country->title ?? "" }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="col-lg-6">
                                        <div class="form-group mb-4">
                                            <h6> {{ __('orders::orders.account_code') }} </h6>
                                            <input type="text"
                                                   name="iban"
                                                   value='{{ old("iban", $user->iban ?? "") }}'
                                                   class="form-control {{ $errors->has('iban') ? 'is-invalid' : '' }}"
                                                   placeholder="{{ __('orders::orders.account_code') }}"/>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="btns mt-5">
                                <button type="submit" class="bttn me-2 custom-submit-btn">
                                    <i class="fal fa-save me-2"></i>
                                    {{ __('general.save_data') }}
                                </button>
                                <a href="#" class="bttn bg-danger text-white" data-bs-dismiss="modal"
                                   aria-label="Close"> <i
                                        class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!-- modal pricing table -->
    <div class="modal fade modal-pricing-table" id="modal-pricing-table" tabindex="-1"
         aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <div class="modal-body">
                    <form action="{{ route('web.subscriptions.store') }}" method="post"
                          class="ajax-form subscription-form">
                        @csrf
                        <h5 class="main-title"> {{ __('subscriptions::subscriptions.choose_appropriate_package') }} </h5>
                        <div class="pricing-table">
                            <div class="pricing boxes-check">
                                @if($packages->isNotEmpty())
                                    @foreach($packages as $package)
                                        <div class="form-check form-check-inline">
                                            <input class="form-check-input" type="radio" value="{{ $package->id }}"
                                                   id="pricing{{ $package->id }}"
                                                   data-days="{{ $package->package_days }}"
                                                   name="package_id"
                                            @if(old('package_id'))
                                                @checked(old('package_id') == $package->id)
                                                @else
                                                @checked($loop->first)
                                                @endif/>
                                            <label class="form-check-label" for="pricing{{ $package->id }}">
                                                <div class="icon fs-2 mb-4">
                                                    <i class="fad fa-check-circle"></i>
                                                </div>
                                                <div class="item">
                                                    <h6> {{ $package->package_name }} </h6>
                                                    <h5 class="mt-4"> {{ $package->amount }} </h5>
                                                </div>
                                            </label>
                                        </div>
                                    @endforeach
                                @endif
                            </div>
                        </div>
                        <h5 class="main-title mt-5 choose-days-title">
                            {{ __('subscriptions::subscriptions.choose_days') }}
                        </h5>
                        <div class="boxes-check parent-dates">
                            <div class="dayes-slider">
                                <div class="swiper-wrapper">
                                    @foreach(getDaysFromStart() as $day)
                                        <div class="swiper-slide">
                                            <div class="form-check form-check-inline">
                                                <input class="form-check-input"
                                                       type="checkbox"
                                                       value="{{ $day['date'] }}"
                                                       id="day{{ $day['date'] }}"
                                                       name="dates[]"
                                                @if(old('dates') && is_array(old('dates')))
                                                    @checked(in_array($day['date'], old('dates')))
                                                    @endif/>
                                                <label class="form-check-label" for="day{{ $day['date'] }}">
                                                    <small> {{ $day['translated_date'] }} </small>
                                                </label>
                                            </div>
                                        </div>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                        <h5 class="main-title mt-5"> {{ __('general.choose_payment_method') }} </h5>
                        <div class="pricing boxes-check pb-5">
                            @if($paymentMethods->isNotEmpty())
                                @foreach($paymentMethods as $paymentMethod)
                                    @continue(!in_array($paymentMethod->type, ['online', 'wallet']))
                                    <div class="form-check form-check-inline">
                                        <input class="form-check-input"
                                               type="radio"
                                               value="{{ $paymentMethod->id }}"
                                               id="payment-choose{{ $paymentMethod->id }}"
                                               name="payment_method_id"
                                        @if(old('payment_method_id'))
                                            @checked(old('payment_method_id') == $paymentMethod->id)
                                            @else
                                            @checked($loop->first)
                                            @endif/>
                                        <label class="form-check-label" for="payment-choose{{ $paymentMethod->id }}">
                                            <h6> {{ $paymentMethod->currentDescription->title ?? "" }} </h6>
                                        </label>
                                    </div>
                                @endforeach
                            @endif
                        </div>
                        <div class="btns mt-4 pt-4 border-top">
                            <input type="hidden" name="product_id" value=""/>
                            <button type="submit" class="bttn me-2 custom-submit-btn" disabled>
                                <i class="fal fa-save me-2"></i>
                                {{ __('general.save_data') }}
                            </button>
                            <a href="#" class="bttn bg-danger text-white" data-bs-dismiss="modal" aria-label="Close"> <i
                                    class="fal fa-times me-2"></i> {{ __('general.cancel') }} </a>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- rate order modal -->
    <div class="modal rateModal fade" id="rateModal" tabindex="-1" aria-labelledby="exampleModalLabel"
         aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered modal-lg">
            <div class="modal-content">
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                <div class="modal-body">
                    <div class="content text-center mt-4">
                        <h4 class="fs-4 title"><b> {{ __('main.leave_impact_when_review') }} </b></h4>
                        <!-- <p class="det fs-6 text-center my-4">text</p> -->

                        <div class="form-wrapper">

                        </div>

                        <div class="d-flex justify-content-center align-items-center justify-content-center mt-4 ">
                            <button type="button"
                                    class="butn butn-orange mx-1"
                                    data-bs-dismiss="modal">
                                {{ __('general.cancel') }}
                            </button>
                            <button type="submit" form="add-review-form" class="butn primary_butn mx-1">
                                <i class="fal fa-floppy-disk me-2"></i>
                                {{ __('main.save') }}
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@include('web.users::_script')

@push('stack_scripts')
    <script>
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    let imagePreview = $('#imagePreview');
                    imagePreview.css('background-image', 'url(' + e.target.result + ')');
                    imagePreview.hide();
                    imagePreview.fadeIn(650);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }

        $("#imageUpload").change(function () {
            readURL(this);

            let formData = new FormData($('#uploadForm')[0]);
            $.ajax({
                url: '{{ route("web.users.updatePhoto", $user->id) }}',
                type: 'POST',
                data: formData,
                contentType: false,  // Important for file uploads
                processData: false,  // Important for file uploads
                success: function (response) {
                    if (response?.message) {
                        toasterSuccess(response.message);
                    }
                    if (response?.success) {
                        $("img.user-photo").attr("src", response.data.photo);
                    }
                },
                error: function (xhr, status, error) {
                    //console.log(xhr, status, error);
                    if (xhr.status === 422) {
                        let errors = xhr.responseJSON.errors;
                        let firstError = xhr.responseJSON.message;

                        toasterError(firstError);
                    } else {
                        toasterError("{{ __('general.operation_failed') }}");
                    }
                }
            });
        });
    </script>

    <script>
        const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
        const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))
    </script>

    {{--seller scripts--}}
    <script>
        // -------------file-selection-with-image-and-name------------
        $(document).ready(function () {
            $(document).on('change', '.file-upload input[type="file"]', function () {
                var filename = $(this).val();
                if (/^\s*$/.test(filename)) {
                    $(this).parents(".file-upload").removeClass('active');
                    $(this).parents(".file-upload").find(".file-select-name").text("No file chosen...");
                } else {
                    $(this).parents(".file-upload").addClass('active');
                    $(this).parents(".file-upload").find(".file-select-name").text(filename.substring(filename.lastIndexOf("\\") + 1, filename.length));
                }
                var uploadFile = $(this);
                var files = !!this.files ? this.files : [];
                if (!files.length || !window.FileReader) return; // no file selected, or no FileReader support

                if (/^image/.test(files[0].type)) { // only image file
                    var reader = new FileReader(); // instance of the FileReader
                    reader.readAsDataURL(files[0]); // read the local file

                    reader.onloadend = function () { // set image data as background of div
                        uploadFile.closest(".file-upload").find('.imagePreview').css({
                            "background-image": "url(" + this.result + ")",
                            "z-index": "2"
                        });
                    }

                    //added
                    $(this).parent('.file-product-box').find('input[name="old_images[]"]').remove();
                }
            });
        });
    </script>

    <script>
        $("#upload_label").click(function () {
            $(".upload_img_box").append('<div class="file-upload"><div class="file-select file-select-box"><div class="imagePreview"></div><button class="file-upload-custom-btn"><i class="fa fa-image"></i></button><input type="file" name="files[]" class="profileimg"></div><span class="cls"> <i class="fas fa-times-circle"></i> </span></div>');
        })
    </script>

    <script>
        $(".upload_img_box").on("click", ".cls", function () {
            $(this).parent(".file-upload").remove();
        })
    </script>

    <!-- ----------- daterange ------------ -->
    <script>
        $(function () {
            $('input[name="daterange"]').daterangepicker({
                opens: 'left',
            }, function (start, end, label) {
                console.log("A new date selection was made: " + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD'));
            });
        });
    </script>

    <script>
        $(document).ready(function () {
            /*$('#add-link').on('click', function () {
                $('#images-inputs').append('<input type="url" class="form-control mt-2" placeholder="{{ __('products::products.image_link') }}">');
            });*/
        });
    </script>

    <script>
        $('.upgrade-btn').on('click', function () {
            $('#modal-pricing-table [name=product_id]').val($(this).data('id'));
        });

        $(document).ready(function () {
            $('#modal-method-choose input[name="payment_method_id"]').on('change', function () {
                $('.payment-methods').hide();
                $('.payment-method-' + $(this).val()).show();
            });
            $('#modal-method-choose input[name="payment_method_id"]:checked').trigger("change");
        });
    </script>

    <script>
        $(document).on('change', '.subscription-form input[name="package_id"]', function (event) {
            let selectedPackageId = $(this).val();
            let packageDays = $(this).data('days');
            let checkedCount = $('.subscription-form input[name="dates[]"]:checked').length;

            $('.subscription-form .progress-days').remove();
            $('.subscription-form .choose-days-title').append(`<span class="progress-days"><span class="current-days badge bg-primary">${checkedCount}</span> / <span class="total-days badge bg-secondary">${packageDays}</span></span>`);

            updateSubscriptionButtonState(packageDays);
        });
        $('.subscription-form input[name="package_id"]:checked').trigger('change');

        $(document).on('change', '.subscription-form input[name="dates[]"]', function (event) {
            let checkedCount = $('.subscription-form input[name="dates[]"]:checked').length;

            $('.subscription-form .progress-days .current-days').text(checkedCount);

            let selectedPackageDays = $('.subscription-form input[name="package_id"]:checked').data('days');
            updateSubscriptionButtonState(selectedPackageDays);
        });

        function updateSubscriptionButtonState(packageDays) {
            let checkedCount = $('.subscription-form input[name="dates[]"]:checked').length;

            if (checkedCount === packageDays) {
                // Enable the submit button if days match
                $('.subscription-form button[type="submit"]').prop('disabled', false);
            } else {
                // Disable the submit button if days don't match
                $('.subscription-form button[type="submit"]').prop('disabled', true);
            }
        }
    </script>

    <script>
        $(document).ready(function () {
            $(document).on('click', '.add-review', function (event) {
                let orderId = $(this).data('id');

                $.ajax({
                    url: '{{ route('web.ratings.modal.show') }}',
                    type: 'GET',
                    data: {
                        orderId,
                    },
                    beforeSend: function () {
                    },
                    complete: function () {
                    },
                    success: function (response) {
                        $('#rateModal .form-wrapper').html(response.html);
                        $('#rateModal').modal('show');
                    },
                    error: function (xhr, status, error) {
                        displayAjaxError(xhr);
                    }
                });
            });

            $(document).on('submit', '#add-review-form', function (e) {
                e.preventDefault();
                const form = $(this);
                const url = form.attr('action');
                const method = form.attr('method');
                const data = form.serialize();

                // Find the submit button
                const submitButton = form.find(':submit').length ? form.find(':submit') : $('button[form="add-review-form"]');
                const originalContent = submitButton.html(); // Save original content

                $.ajax({
                    type: method,
                    url: url,
                    data: data,
                    beforeSend: function () {
                        // Replace button content with loader
                        submitButton.prop('disabled', true).html('<span class="spinner-border spinner-border-sm"></span>');
                    },
                    success: function (response) {
                        $('#rateModal').modal('hide');
                        if (response.message) {
                            toasterSuccess(response.message);
                        }
                        if (response.remove_add_review_btn) {
                            $('.add-review[data-id="' + response.order_id + '"]').remove();
                        }
                        //form.trigger('reset'); // Reset form
                    },
                    error: function (xhr) {
                        displayAjaxError(xhr);
                    },
                    complete: function () {
                        // Restore button content
                        submitButton.prop('disabled', false).html(originalContent);
                    }
                });
            });
        });
    </script>
@endpush