@extends('layouts.app')
@section('title', 'Clientele')
@section('content')
<div class="container page-content">
	<div class="row justify-content-center align-items-center page-col">
        <div class="col-lg-6 col-12 mb-lg-0 mb-3">
            <h1 class="font-weight-bold typography-4 mb-0">{{ $clientele->name }} Summary</h1>
        </div>
        <div class="col-lg-6 col-12 mb-lg-0 mb-3 text-start text-lg-end">
        	<a class="btn btn-black btn-custom me-2" href="{{ route('clientele-index') }}">Back</a>
			@if (Auth::user()->hasPermissionTo('manage clientele'))
			<a class="btn btn-purple btn-custom" href="{{ route('clientele-edit', ['clientele_id'=>$clientele->id]) }}">
				Edit
			</a>
			@endif
        </div>
    </div><!-- Header -->
	<div class="row justify-content-xl-center page-col pb-4">
		<div class="col-12">
			<div class="card">
				<div class="card-body">
					<div class="row justify-content-center align-items-center">
						<div class="col-12 col-lg-4"></div>
						<div class="col-12 col-lg-4 text-center order-1">
							<h4 class="mb-0 font-weight-bold">
								{{ $clientele->name }}
							</h4>
						</div>
						<div class="col-12 col-lg-4 text-center text-lg-end mb-2 order-2">
							<span class="badge {{ $clientele->active ? 'bg-success' : 'bg-danger' }}">
								{{ $clientele->active ? 'Active' : 'Inactive' }}
							</span>
						</div>
					</div>
					<div class="row justify-content-center align-items-center">
						<div class="col-12 col-lg-8 mb-2 text-center text-lg-start order-4 order-lg-3">
							@foreach( $tags as $key => $tag )
								<span class="badge bg-secondary {{ $loop->last ? '' : 'me-1' }}">
									<i class="fas fa-tag"></i> {{ $tag->name }}
								</span>
							@endforeach
						</div>
						<div class="col-12 col-lg-4 text-center text-lg-end order-3 order-lg-4">
							<p class="mb-0 text-success"><b>RM {{ number_format($total_worth_value, 2) }}</b></p>
						</div>
					</div>
					<div class="row justify-content-center align-items-center">
						@if( $clientele->remarks )
							<div class="col-12 mb-2">
								<p class="mb-0">{{ $clientele->remarks }}</p>
							</div>
						@endif
					</div>
					<div class="row row-cols-auto justify-content-center justify-content-lg-start d-block d-lg-flex">
						<div class="col-12">
							<p class="me-2 {{ $clientele->getClientLinks()->isEmpty() ? 'mb-0' : 'mb-1' }}"><b>Links:</b></p>
						</div>
						@if($clientele->getClientLinks()->isEmpty())
							<p class="mb-0">N/A</p>
						@else
							@foreach($clientele->getClientLinks() as $index => $link)
								<div class="col pb-2">
									<a href="{{ $link->url }}" target="_blank" class="badge badge-btn-theme" title="{{ $link->type }} - {{ $link->url }}">
										{{-- <i class="fas fa-link me-2"></i> --}}{{ $link->name }}
									</a>
								</div>
							@endforeach
						@endif
					</div>
				</div>
			</div>
		</div>
	</div><!-- Clientele -->
	<div class="row justify-content-xl-center page-col pb-4">
		<div class="col-12">
			<div class="card">
				<div class="card-header">
					<h4 class="font-weight-bold mb-0">Works</h4>
				</div>
				<div class="card-body">
					@if( $works->isEmpty() )
						<h4 class="typography-2 font-weight-semibold text-grey text-center mb-0">- N/A -</h4>
					@else
						@foreach( $works as $key => $work )
							<div class="clientele-card {{ $loop->last ? '' : 'mb-3' }}">
								<a class="text-theme text-decoration-none p-0" href="{{ route('clientele-work-edit', ['clientele_work_id'=>$work->id]) }}" title="{{ Auth::user()->hasPermissionTo('manage clientele') ? 'Edit' : 'View' }} Work {{ $work->name }}">
									<div class="row">
										<div class="col-12 col-lg-4 mb-2 order-4 order-lg-1">
											@foreach( $work->clienteleWorkTags as $clientele_work_tag )
												<span class="badge bg-secondary me-3">
													<i class="fas fa-tag"></i> {{ $clientele_work_tag->clienteleTag->name }}
												</span>
											@endforeach
										</div><!-- Work Tag -->
										<div class="col-12 col-lg-4 text-start text-lg-center mb-2 order-1 order-lg-2">
											<h5 class="mb-0 font-weight-bold">
												{{ $work->name }} 
											</h5>
										</div><!-- Work Name -->
										<div class="col-12 col-lg-4 text-start text-lg-end mb-2 order-3 order-lg-3">
											<p class="mb-0">{{ \Carbon\Carbon::create($work->start_date)->format('d/m/Y') }} - {{ $work->end_date ? \Carbon\Carbon::create($work->start_date)->format('d/m/Y') : $work->getStatus() }}</p>
										</div><!-- Work Duration -->
									</div>
									<div class="row">
										<div class="col-12 col-lg-6 order-5 order-lg-4">
											<p class="mb-2"><b>Total Man Days:</b> {{ $work->total_man_days }}</p>
										</div><!-- Total Man Days -->
										<div class="col-12 col-lg-6 text-start text-lg-end order-2 order-lg-5">
											<p class="mb-2 text-success"><b>RM {{ number_format($work->worth_value, 2) }}</b></p>
										</div><!-- Worth Value -->
									</div>
								</a>
									<div class="row">
										<div class="col-12 d-block d-lg-flex align-items-center mb-2">
											<div class="internal-team d-block d-lg-flex align-items-center">
												<span class=""><b>Internal:</b> </span>
												@if( $work->getUsersWithTrashed()->isEmpty() )
													<p class="mb-0 ms-2">-</p>
												@else
													@foreach($work->getUsersWithTrashed() as $index => $user)
														<button type="button" class="btn btn-link text-main ms-2" data-bs-toggle="modal" data-bs-target="#internal_contacts_modal" title="Click to view Internal Contacts">
															{{ $user->getName() }} ({{ optional(optional($user->details)->job)->department->name }})
														</button>
											            {{ $loop->last ? '' : ',' }}
														@if ($index == 1 && $loop->remaining > 0)
														    <span>...</span>
														    @break
														@endif
													@endforeach
												@endif
											</div>
											<div class="external-team ms-3 d-none d-lg-inline-flex align-items-center">
												<span class=""><b>External:</b> </span>
												@if( $work->getClienteleContactsWithTrashed()->isEmpty() )
													<p class="mb-0 ms-2">-</p>
												@else
													@foreach($work->getClienteleContactsWithTrashed() as $index => $external_contact)
														<button type="button" class="btn btn-link ms-2" data-bs-toggle="modal" data-bs-target="#external_contacts_modal" title="Click to view External Contacts">
															{{ $external_contact->name }} ({{ $external_contact->clienteleContactDepartment->name }})
														</button>
														{{ $loop->last ? '' : ',' }}
														@if ($index == 1 && $loop->remaining > 0)
														    <span>...</span>
														    @break
														@endif
													@endforeach
												@endif
											</div>
										</div><!-- Intrnal & External Team -->
										<div class="col-12 mb-2 d-block d-lg-none">
											<span class=""><b>External:</b> </span>
											@if( $work->clienteleContacts->isEmpty() )
												<p class="mb-0 ms-2">-</p>
											@else
												@foreach($work->clienteleContacts as $index => $external_contact)
													<button type="button" class="btn btn-link ms-2" data-bs-toggle="modal" data-bs-target="#external_contacts_modal">
														{{ $external_contact->name }} ({{ $external_contact->clienteleContactDepartment->name }})
													</button>
													{{ $loop->last ? '' : ',' }}
													@if ($index == 1 && $loop->remaining > 0)
													    <span>...</span>
													    @break
													@endif
												@endforeach
											@endif
										</div><!-- External Team (Mobile View) -->
									</div>
								<a class="text-theme text-decoration-none p-0" href="{{ route('clientele-work-edit', ['clientele_work_id'=>$work->id]) }}" title="{{ Auth::user()->hasPermissionTo('manage clientele') ? 'Edit' : 'View' }} Work {{ $work->name }}">
									<div class="row">
										<div class="col-12 mb-2">
											<p class="mb-0"><span class="me-2"><b>Remarks:</b></span></p>
											<p class="mb-0">{{ $work->remarks ?: 'N/A' }}</p>
										</div><!-- Remarks -->
										<div class="col-12">
											<p class="{{ $work->clienteleLinks->isEmpty() ? 'mb-0' : 'mb-1' }}"><b>Links:</b></p>
										</div>
									</div>
									<div class="row row-cols-auto justify-content-center justify-content-lg-start d-block d-lg-flex">
										
										@if($work->clienteleLinks->isEmpty())
											<p class="mb-0">N/A</p>
										@else
											@foreach($work->clienteleLinks as $index => $link)
												<div class="col pb-2">
													<a href="{{ $link->url }}" target="_blank" class="badge badge-btn-theme" title="{{ $link->type }} - {{ $link->url }}">
														{{-- <i class="fas fa-link me-2"></i> --}}{{ $link->name }}
													</a>
												</div>
											@endforeach
										@endif
									</div>
								</a>
							</div>
						@endforeach
					@endif
				</div>
			</div>
		</div>
	</div><!-- Clientele Works -->
</div>
@endsection
@push('modal')
<div class="modal fade" id="internal_contacts_modal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="staticBackdropLabel">{{ $clientele->name }} Internal Team</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                	<div class="col-12">
                		@foreach( $group_internal_contacts as $department => $internal_contacts )
                		<div class="clientele-card mb-3">
                			<p class="font-weight-bold">{{ $department }}</p>
                			@foreach( $internal_contacts as $contact )
                				<div class="row justify-content-center align-items-center {{ $loop->last ? '' : 'mb-3' }}">
                					<div class="col-12">
                						<p class="mb-1 d-flex align-items-center">
                							<span class="badge {{ $contact->active ? 'bg-success' : 'bg-danger' }} me-2">
                								{{ $contact->active ? 'Active' : 'Inactive' }}
                							</span>
                							<b>{{ $contact->getName() }}</b>
                						</p>
                					</div>
                					<div class="col-12">
                						<p class="mb-0">{{ $contact->email }}</p>
                					</div>
                					<div class="col-12">
                						<p class="mb-0">{{ $contact->details->mobile_number }}</p>
                					</div>
                					<div class="col-12">                						
                						<p class='mb-0'>Duration: {{ \Carbon\Carbon::create($contact->pivot->start_date)->format('d/m/Y') }} - {{ $contact->pivot->end_date ? \Carbon\Carbon::create($contact->pivot->end_date)->format('d/m/Y') : 'In Progress' }}</p>
                					</div>
                				</div>
                			@endforeach
                		</div>
                		@endforeach
                	</div><!-- Internal Contacts -->
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-black" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
<div class="modal fade" id="external_contacts_modal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="staticBackdropLabel">{{ $clientele->name }} External Team</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div class="row">
                	<div class="col-12">
                		@foreach( $group_external_contacts as $department => $external_contacts )
                		<div class="clientele-card mb-3">
                			<p class="font-weight-bold">{{ $department }}</p>
                			@foreach( $external_contacts as $contact )
                				<div class="row justify-content-center align-items-center {{ $loop->last ? '' : 'mb-3' }}">
                					<div class="col-12 col-lg-6 order-2 order-lg-1">
                						<p class="mb-0">
                							<b>{{ $contact->name }}</b>
                						</p>
                					</div>
                					<div class="col-12 col-lg-6 order-1 order-lg-2 text-stat text-lg-end mb-1 mb-lg-0">
                						<span class="badge {{ $contact->active ? 'bg-success' : 'bg-danger' }}">
                							{{ $contact->active ? 'Active' : 'Inactive' }}
                						</span>
                					</div>
                					<div class="col-12 order-3">
                						<p class="mb-0">{{ $contact->email }}</p>
                					</div>
                					<div class="col-12 order-4">
                						<p class="mb-0">{{ $contact->mobile_number }}</p>
                					</div>
                					<div class="col-12 order-5">
                						<p class="mb-0">Remarks: {{ $contact->remarks ?: 'N/A' }}</p>
                					</div>
                				</div>
                			@endforeach
                		</div>
                		@endforeach
                	</div><!-- External Contacts -->
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-black" data-bs-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>
@endpush