@extends('layouts.app')

@section('content')
<div class="container">
    <div class="d-flex justify-content-between align-items-center mb-1">
        <div>
            <h1 class="mb-0 fw-bolder">Reseller #{{ $reseller->id }}</h1>
        </div>
        <div>
            <a href="{{ route('resellers.index') }}" class="btn btn-light shadow">
                <i class="fa fa-fw fa-arrow-left"></i> Back To Lists
            </a>
        </div>
    </div>
    <div class="card shadow">
        <div class="card-body">
            <div class="row">
                <div class="col-md-5">
                    <h4 class="fw-bolder">Reseller Profile</h4>
                    <dl class="row">
                        <dt class="col-sm-3">Type</dt>
                        <dd class="col-sm-9">{{ $reseller->type ?? '-' }}</dd>
                      
                        <dt class="col-sm-3">NIK</dt>
                        <dd class="col-sm-9">{{ $reseller->nik ?? '-' }}</dd>
                      
                        <dt class="col-sm-3">NPWP</dt>
                        <dd class="col-sm-9">{{ $reseller->npwp ?? '-' }}</dd>
                      
                        <dt class="col-sm-3">Legal Name</dt>
                        <dd class="col-sm-9">{{ $reseller->legal_name ?? '-' }}</dd>

                        <dt class="col-sm-3">Brand Name</dt>
                        <dd class="col-sm-9">{{ $reseller->brand_name ?? '-' }}</dd>

                        <dt class="col-sm-3">Email</dt>
                        <dd class="col-sm-9">{{ $reseller->email ?? '-' }}</dd>

                        <dt class="col-sm-3">Phone</dt>
                        <dd class="col-sm-9">{{ $reseller->phone ?? '-' }}</dd>
    
                        <dt class="col-sm-3">Address</dt>
                        <dd class="col-sm-9">{{ $full_address ?? '-' }}</dd>
                    
                        @if (isset($reseller->social_media))
                            @foreach ($reseller->social_media as $name => $url)
                            <dt class="col-sm-3">{{ str($name)->ucfirst() }}</dt>
                            <dd class="col-sm-9">
                                <a href="{{ url($url ?? '') }}" target="_blank">{{ $url ?? '-' }}</a>
                            </dd>
                            @endforeach
                        @endif
                    </dl>
                    <div id="map" class="w-100" style="height:300px;"></div>
                </div>
                <div class="col-md-7">
                    <h4 class="fw-bolder">PIC</h4>
                    <dl class="row">
                        @if (isset($reseller->pic))
                            @foreach ($reseller->pic as $key => $value)
                                <dt class="col-sm-3">{{ str($key)->ucfirst() }}</dt>
                                <dd class="col-sm-9">
                                    @if ($key == 'photo')
                                    <img src="{{ asset('storage/' . $value) }}" class="img-fluid img-thumbnail" style="max-width:200px;" />
                                    @else
                                    {{ $value ?? '-' }}
                                    @endif
                                </dd>
                            @endforeach
                        @endif
                    </dl>
                    <h4 class="fw-bolder">Malicious</h4>
                    <table class="table">
                        <thead>
                            <tr>
                                <th>ID</th>
                                <th>Title</th>
                                @role('Admin')
                                <th>ISP</th>
                                @endrole
                            </tr>
                        </thead>
                        <tbody>
                        @foreach ($reseller->maliciouses as $malicious)
                            <tr>
                                <td>{{ $malicious->id }}</td>
                                <td>
                                    <a class="m-0 lh-1" href="{{ route('maliciouses.show', $malicious) }}">
                                        <strong>{{ $malicious->title }}</strong>
                                    </a>
                                </td>
                                @role('Admin')
                                <td>
                                    <p class="m-0 lh-1">
                                        <strong>{{ $malicious->isp->brand_name }}</strong><br/>
                                        <small class="text-muted">{{ $malicious->isp->legal_name }}</small>
                                    </p>
                                </td>
                                @endrole
                            </tr>
                        @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('css')
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
@endpush

@push('js')
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<script>
    var map = L.map('map').setView([{{ $reseller->map->lat ?? null }},{{ $reseller->map->long ?? null }}], 15);
    L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
        maxZoom: 25,
        attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
    }).addTo(map);
    var marker = L.marker([{{ $reseller->map->lat ?? null }},{{ $reseller->map->long ?? null }}]).addTo(map);
</script>
@endpush