@php use Carbon\Carbon; @endphp
@php use App\Models\Contract; @endphp
@extends('adminlte::page')

@section('title', 'IPRS | Onboarding')

@section('plugins.Select2', true)

@section('content_header')
    <div class="col-9 mx-auto d-flex justify-content-between align-items-center">
        <div class="row">
            <div class="col-sm-8">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a></li>
                    <li class="breadcrumb-item"><a href="{{ route('onboarding.index') }}">On-boarding</a></li>
                    <li class="breadcrumb-item active">{{ ucfirst($client->name_fl) ?? '' }}</li>
                </ol>
            </div>
            <div class="col-sm-12">
                <h1 class="m-0">{{ ucfirst($client->name_fl) ?? '' }}</h1>
            </div>
        </div>
    </div>
@stop

@section('content')
    <div class="col-9 mx-auto">
        <div class="card card-widget widget-user shadow mb-4">
            <div class="widget-user-header" style="background-color: #356eac; color: white;">
                <h3 class="widget-user-username">{{ $client->name_fl ?? '' }}</h3>
                <h5 class="widget-user-desc">{{ $client->address ?? '-' }}</h5>
            </div>
            <div class="widget-user-image">
                <img class="img-circle elevation-2" src="{{ asset('images/photo.webp') }}" alt="{{ $client->name_fl ?? '' }}">
            </div>
            <div class="card-footer">
                <div class="row">
                    <div class="col-sm-4 border-right">
                        <div class="description-block">
                            <span class="description-text">No. of Contracts</span>
                            <h5 class="description-header">{{ $contracts->count() }}</h5>
                        </div>

                    </div>

                    <div class="col-sm-4 border-right">
                        <div class="description-block">
                            <span class="description-text">Date Created</span>
                            <h5 class="description-header">{{ Carbon::parse($client->date_created)->format("d-m-Y H:i") }}</h5>
                        </div>

                    </div>

                    <div class="col-sm-4">
                        <div class="description-block">
                            <span class="description-text">Created By</span>
                            <h5 class="description-header">{{ $client->created_by }}</h5>
                        </div>

                    </div>
                </div>
            </div>
        </div>

        <x-adminlte-card>
            <ul class="nav nav-pills" id="custom-tabs-four-tab" role="tablist">
                <li class="nav-item">
                    <a class="nav-link active" id="client-tab" data-toggle="pill" href="#client" role="tab" aria-controls="client" aria-selected="false">
                        Client
                    </a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" id="contract-tab" data-toggle="pill" href="#contract" role="tab" aria-controls="contract" aria-selected="true">
                        Contracts
                    </a>
                </li>
            </ul>
        </x-adminlte-card>

        <div class="tab-content" id="custom-tabs-four-tabContent">
            <div class="tab-pane fade active show" id="client" role="tabpanel" aria-labelledby="client-tab">
                <x-adminlte-card>
                    <table class="table table-bordered table-hover" id="client-table">
                        <tr>
                            <td colspan="2" class="text-uppercase" style="background-color: #356eac; color: white;">Company Representative</td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Name:</p>
                                <p class="mb-0">{{ $client->boss_name ?? '-' }} {{ $client->boss_surn ?? '-' }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Other Name:</p>
                                <p class="mb-0">{{ $client->boss_othname ?? '-' }}</p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Post:</p>
                                <p class="mb-0">{{ $client->boss_post ?? '-' }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Phone Number:</p>
                                <p class="mb-0">{{ $client->boss_phone ?? '-' }}</p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Cell Number</p>
                                <p class="mb-0">{{ $client->boss_cell ?? '-' }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Email Address:</p>
                                <p class="mb-0">{{ $client->boss_email ?? '-' }}</p>
                            </td>
                        </tr>
                        <tr>
                            <td colspan="2" class="text-uppercase" style="background-color: #356eac; color: white;">Accountant Details</td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Name:</p>
                                <p class="mb-0">{{ $client->acc_name }} {{ $client->acc_surn }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Other Name:</p>
                                <p class="mb-0">{{ $client->acc_othname}}</p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Post:</p>
                                <p class="mb-0">{{ $client->acc_post }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Phone Number:</p>
                                <p class="mb-0">{{ $client->acc_phone }}</p>
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <p class="font-weight-bold">Cell Number</p>
                                <p class="mb-0">{{ $client->acc_cell }}</p>
                            </td>
                            <td>
                                <p class="font-weight-bold">Email Address:</p>
                                <p class="mb-0">{{ $client->acc_email }}</p>
                            </td>
                        </tr>
                    </table>
                </x-adminlte-card>
            </div>
            <div class="tab-pane fade" id="contract" role="tabpanel" aria-labelledby="contract-tab">
                <div class="accordion" id="contract-accordion">
                    @if($contracts->count() > 0)
                        @foreach($contracts as $contract)
                            <div class="card">
                                <div class="card-header bg-secondary" id="heading-{{ $contract->rid }}">
                                    <div class="d-flex justify-content-between align-content-between">
                                        <button class="btn btn-link text-left text-lg text-white" type="button" data-toggle="collapse" data-target="#collapse-{{ $contract->rid }}" aria-expanded="true" aria-controls="collapse-{{ $contract->rid }}">
                                            Contract No: #{{ $contract->rid }}
                                        </button>
                                        <a href="{{ route('contract.show', $contract->rid) }}" class="btn btn-primary text-lg text-right">
                                            View <i class="fas fa-fw fa-file-alt"></i>
                                        </a>
                                    </div>
                                </div>

                                <div id="collapse-{{ $contract->rid }}" class="@if($loop->index == 0) collapse show @endif" aria-labelledby="heading-{{ $contract->rid }}" data-parent="#contract-accordion">
                                    <div class="card-body">
                                        <div class="info-box">
                                            <span class="info-box-icon bg-success"><i class="far fa-user"></i></span>
                                            <div class="info-box-content">
                                                <span class="info-box-text">Users in Contract</span>
                                                <span class="info-box-number">{{ $contract->users->count() }}</span>
                                            </div>
                                        </div>

                                        {{-- Setup data for datatables --}}
                                        @php
                                            $headings = [
                                                'ID',
                                                'Name',
                                                'E-Mail',
                                                'Role',
                                                ['label' => 'Status'],
                                                ['label' => 'Actions', 'no-export' => true, 'width' => 2],
                                            ];
                                        @endphp

                                        <x-adminlte-card>
                                            {{-- Minimal example / fill data using the component slot --}}
                                            <x-adminlte-datatable id="clients-table" :heads="$headings" striped hoverable bordered>
                                                @if($contract->users->count())
                                                    @foreach($contract->users as $user)
                                                        <tr>
                                                            <td>{{ $user->id }}</td>
                                                            <td>{{ ucfirst($user->name) }}</td>
                                                            <td>{{ $user->email }}</td>
                                                            <td>
                                                                @foreach($user->getRoleNames() as $role)
                                                                    <span class="badge rounded-pill bg-info">{{ $role }}</span>
                                                                @endforeach
                                                            </td>
                                                            <td>
                                                                @if($user->status_l == 1)
                                                                    <div class="badge badge-success">Active</div>
                                                                @else
                                                                    <div class="badge badge-secondary">Locked</div>
                                                                @endif
                                                            </td>
                                                            <td>
                                                                <nobr>
                                                                    <a href="{{ route('user.show', $user->id) }}"
                                                                       class="btn btn-xs btn-default text-teal mx-1 shadow" title="Details">
                                                                        <i class="fa fa-lg fa-fw fa-eye"></i>
                                                                    </a>
                                                                </nobr>
                                                            </td>
                                                        </tr>
                                                    @endforeach
                                                @else
                                                    <tr>
                                                        <td colspan="6" class="text-center">
                                                            No users found under this contract!
                                                        </td>
                                                    </tr>
                                                @endif
                                            </x-adminlte-datatable>
                                        </x-adminlte-card>
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    @else
                        <div class="alert alert-secondary">No contracts available for this client.</div>
                    @endif
                </div>
            </div>
        </div>
    </div>
@stop
@section('plugins.Datatables', true)
