@extends ('../welcome')
@section('content')
    <link rel="stylesheet" href="{{ asset('swiper/swiper.css') }}">

    <style>
        .clickable-row:hover {
            background-color: gray;
            color: white;
            cursor: pointer;
        }

        .fade:not(.show){
            opacity: 1 !important;
        }

        a:hover {
            cursor: pointer;

        }

        .tabcontent {
            display: none;
        }

        .tabcontent.active {
            display: block;
        }

        #upload-photo {
            display: none;
        }

        #upload-file {
            display: none;
        }

        .card {
            height: -webkit-fill-available;
        }

        #carouselExampleControls .btn {
            position: absolute;
            top: 0%;
            right: 0%;
            background-color: transparent;

            opacity: 0.5;
            color: white;
            border: none;
            cursor: pointer;
            border-radius: 5px;
            color: grey;


        }

        .w-100 {
            height: 400px !important
        }

        #carouselExampleControls .btn:hover {
            background-color: transparent;
            opacity: 3.0;
            color: white;
        }

        /* swiper ////////////////////////////////////*/
        .swiper {
            width: 240px;
            height: 320px;
        }

        .swiper .swiper-slide {
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 18px;
            font-size: 22px;
            font-weight: bold;
            color: #fff;
        }

        .swiper2 {
            width: 100%;
            padding-top: 50px;
            padding-bottom: 50px;
        }

        .swiper2 .swiper-slide {
            background-position: center;
            background-size: cover;
            width: 300px;
            height: 300px;
        }

        .swiper2 .swiper-slide img {
            display: block;
            width: 100%;
        }

        td {
            font-size: 20px;
        }
    </style>
    <div class="card">
        <div class="card-header">
            <div class="tab">
                <button id="autoClick" class="tablinks btn btn-outline-info" onclick="openCity(event, 'Data')">Data</button>
                <button class="tablinks btn btn-outline-success" onclick="openCity(event, 'Agents')">Agents</button>
                <button class="tablinks btn btn-outline-secondary" onclick="openCity(event, 'Analysis')">Analysis</button>
                <button class="tablinks btn btn-outline-warning" onclick="openCity(event, 'History')">History</button>
                <button class="tablinks btn btn-outline-dark" onclick="openCity(event, 'Activities')">Activities</button>
            </div>
        </div>
        <div class="card-body">
            <div id="Data" class="tabcontent active">
                <div class="row">
                    <div class="col-md-12">
                        <div class="card card-info card-outline">
                            <div class="card-header">
                                <div class="row">
                                    <form action="{{ route('BrokerfileUpload') }}" method="POST"
                                        enctype="multipart/form-data" class="col-10">
                                        @csrf
                                        <label for="upload-photo" class="btn btn-outline-success" title="upload image">
                                            <i class="fas fa-file-image"></i> &nbsp;
                                            <i class="fas fa-upload"></i>
                                        </label>
                                        <input type="file" name="images[]" id="upload-photo" multiple>
                                        <label for="upload-file" class="btn btn-outline-danger" title="attach files">
                                            <i class="fas fa-file-pdf"></i> &nbsp;
                                            <i class="fas fa-upload"></i>
                                        </label>
                                        <input type="file" name="files[]" id="upload-file" multiple>

                                        <input type="hidden" value="{{ $broker->id }}" name="broker_id">

                                        <button type="submit" title="upload" style="margin-bottom:10px;"
                                            class="btn btn-outline-info"><i class="fas fa-check"></i></button>
                                    </form>
                                    <a href="{{ route('brokers.edit', $broker->id) }}">
                                        <button class="btn btn-square btn-outline-info" title=" Edit Broker" type="button">
                                            <i class="fas fa-pen"></i>
                                        </button>
                                    </a>
                                    @if ($broker->status == 'pending')
                                        <form method="post" action="{{ route('brokerStatus') }}">
                                            @csrf
                                            <input type="hidden" value="accepted" name="status">
                                            <input type="hidden" value="{{$broker->id}}" name="broker_id">
                                            <button class="btn btn-square btn-outline-success" title="Confirm"
                                                type="submit">
                                                <i class="fas fa-check"></i>
                                            </button>
                                        </form>
                                        <form method="post" action="{{ route('brokerStatus') }}">
                                            @csrf
                                            <input type="hidden" value="{{$broker->id}}" name="broker_id">
                                            <input type="hidden" value="rejected" name="status">
                                            <button class="btn btn-square btn-outline-danger" title="Reject" type="submit">
                                                <i class="fas fa-ban"></i>
                                            </button>
                                        </form>
                                    @endif
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="row">
                                    <table class="col-7">
                                        <tbody>
                                            <tr>
                                                <th>Name :</th>
                                                <td>{{ $broker->name ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Email :</th>
                                                <td>{{ $broker->email ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Address :</th>
                                                <td>{{ $broker->address ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Sales Man :</th>
                                                <td>{{ $broker->salesMan?->name ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Type :</th>
                                                <td>{{ $broker->type ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Owner Name :</th>
                                                <td>{{ $broker->owner_name ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Sales Admin :</th>
                                                <td>{{ $broker->sales_admin ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Authorized Name :</th>
                                                <td>{{ $broker->authorized_name ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Sales Admin :</th>
                                                <td>{{ $broker->sales_admin ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Commercial Record :</th>
                                                <td>{{ $broker->commercial_record ?? '-' }}</td>
                                            </tr>
                                            <tr>
                                                <th>Description :</th>
                                                <td>{{ $broker->description ?? '-' }}</td>
                                            </tr>
                                            @if ($broker->has_contract == 1)
                                                <tr>
                                                    <th>has Contract :</th>
                                                    <td>yes</td>
                                                </tr>
                                                <tr>
                                                    <th>Commission :</th>
                                                    <td>{{ $broker->commission ?? '-' }}</td>
                                                </tr>
                                                <tr>
                                                    <th>Contract StartDate:</th>
                                                    <td>{{ $broker->contract_startDate ?? '-' }}</td>
                                                </tr>
                                                <tr>
                                                    <th>Contract End Date:</th>
                                                    <td>{{ $broker->contract_endDate ?? '-' }}</td>
                                                </tr>
                                            @endif
                                        </tbody>
                                    </table>
                                    <div class="col-5">
                                        @if (Auth::user()->type == 'admin' ||
                                                auth()->user()->role->hasPermission('brokers-PhoneNumber'))
                                            @if (Auth::user()->type == 'admin' ||
                                                    auth()->user()->role->hasPermission('brokers-create-PhoneNumber'))
                                                <button type="button" class="btn btn-" style="color:#dc3545"
                                                    title="add new number" data-toggle="modal" data-target="#storePhones">
                                                    <i class="fas fa-phone"></i>
                                                    <i class="fas fa-plus"></i>
                                                </button>
                                            @endif
                                            <div class="card card-danger card-outline">
                                                <div class="card-body table-responsive p-0">
                                                    <table class="table table-hover text-nowrap">
                                                        <tbody>
                                                            @forelse($broker->phone_numbers as $phone)
                                                                <tr>
                                                                    <td>
                                                                        <a href="https://wa.me/{{ $phone->country->phonecode }}{{ $phone->phone }}" target="_blank">
                                                                            {{ $phone->country->phonecode }}
                                                                            {{ $phone->phone }}
                                                                        </a>
                                                                    </td>
                                                                    <td>
                                                                        @if (Auth::user()->type == 'admin' ||
                                                                                auth()->user()->role->hasPermission('brokers-edit-PhoneNumber'))
                                                                            <a class="btn btn-light"
                                                                                href="{{ route('phones.edit', $phone->id) }}">
                                                                                <i class="fas fa-pen"
                                                                                    style="color:#17a2b8"></i>
                                                                            </a>
                                                                        @endif
                                                                        @if (Auth::user()->type == 'admin' ||
                                                                                auth()->user()->role->hasPermission('brokers-delete-PhoneNumber'))
                                                                            @if (count($broker->phone_numbers) > 1)
                                                                                <button onClick="clickDeletePhone(this)"
                                                                                    title="Delete" type="button"
                                                                                    style="height:38px;"
                                                                                    class="btn btn-light"
                                                                                    data-id="{{ $phone->id }}"
                                                                                    data-toggle="modal"
                                                                                    data-target="#phoneDelete">
                                                                                    <i class="fa fa-trash"
                                                                                        style="color:#dc3545"></i>
                                                                                </button>
                                                                            @endif
                                                                        @endif
                                                                    </td>
                                                                </tr>
                                                            @empty
                                                                <p>No Phone number Available for this Broker</p>
                                                            @endforelse
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>

                                            <div class="card card-info card-outline">
                                                <div class="card-body table-responsive p-0">
                                                    <table class="table table-hover text-nowrap">
                                                        <tbody>
                                                            <form action="{{route('brokerReAssign')}}" method="post">
                                                                <input type="hidden" name="broker_id" value="{{$broker->id}}">
                                                                @csrf
                                                                <tr>
                                                                    <th>Re-Assign</th>
                                                                    <td>
                                                                        <select name="user_id" id="user" class="select2 custom-select form-control-border">
                                                                            @foreach($users as $user)
                                                                            <option value="{{$user->id}}" {{$user->id == $broker->user_id ? 'selected' : ''}}>{{$user->name}}</option>
                                                                            @endforeach
                                                                        </select>
                                                                    </td>
                                                                    <td>
                                                                        <button type="submit" class="btn btn-outline-info">
                                                                            <i class="fas fa-check"></i>
                                                                        </button>
                                                                    </td>
                                                                </tr>
                                                            </form>
                                                        </tbody>
                                                    </table>
                                                </div>
                                            </div>
                                        @endif
                                        @if (count($broker->files) != 0)
                                            @if (auth()->user()->type == 'admin' ||
                                                    auth()->user()->role->hasPermission('brokers-files'))
                                                <div class="card collapsed-card">
                                                    <div class="card-header" data-card-widget="collapse">
                                                        <h3 class="card-title">
                                                            Files
                                                        </h3>
                                                    </div>
                                                    <div class="card-body">
                                                        <table class="table table-bordered">
                                                            @foreach ($broker->files as $file)
                                                                <tr>
                                                                    <td>
                                                                        <a
                                                                            href="{{ URL::to('/') }}/files/{{ $file->file }}">{{ $file->file }}-{{ $file->created_at }}</a>
                                                                    </td>
                                                                    <td>
                                                                        <form method="POST"
                                                                            action="{{ route('files.destroy', $file->id) }}">
                                                                            @csrf
                                                                            @method('DELETE')
                                                                            <button type="submit"
                                                                                class="btn btn-outline-danger">
                                                                                <i class="fas fa-trash"></i>
                                                                            </button>
                                                                        </form>
                                                                    </td>
                                                                </tr>
                                                            @endforeach
                                                        </table>
                                                    </div>
                                                </div>
                                            @endif
                                        @endif
                                        <!-- Swiper -->
                                        @if (count($broker->images) != 0)
                                            @if (auth()->user()->type == 'admin' ||
                                                    auth()->user()->role->hasPermission('brokers-images'))
                                            <div class="card collapsed-card">
                                                <div class="card-header" data-card-widget="collapse">
                                                    <h3 class="card-title">
                                                        Images
                                                    </h3>
                                                </div>
                                                <div class="card-body">
                                                    <div class="swiper mySwiper" id="mySwiper" data-toggle="modal"
                                                        data-target="#imageGallery">
                                                        <div class="swiper-wrapper">
                                                            @foreach ($broker->images as $key => $value)
                                                                <div class="swiper-slide">
                                                                    <img class="swiper-slide"
                                                                        src="{{ URL::to('/') }}/images/{{ $value->name }}"
                                                                        alt="{{ $value->name }}" />
                                                                </div>
                                                            @endforeach
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                            @endif
                                        @endif
                                        
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div id="Agents" class="tabcontent">
                <table id={{ auth()->user()->type == 'admin' ||   auth()->user()->role->hasPermission('agents-export') ? 'example1' : 'nonExport' }} 
                    class="table table-bordered" style="margin: unset">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Name</th>
                            <th>Email</th>
                            <th>Phone</th>
                            <th>Created Date</th>
                            <th>Created Time</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($broker->agents as $agent)