@extends('crm.layouts.master')
@section('title','Lead Detail')
@section('page-css')
    <link rel="stylesheet" href="{{ asset('assets/styles/vendor/datatables.min.css') }}">
@endsection
@section('main-content')
    <div class="breadcrumb">
        <h3>{{$leads->fname}} detail</h3>
        <input type="hidden" value="{{$leads->id}}" id="lead_id">
    </div>
    <div class="separator-breadcrumb border-top"></div>
    <div class="row">
        <div class="col-md-7 mb-4">
            <div class="card text-left mb-3 p-4">
                <div class="d-flex justify-content-between align-items-start mb-3">
                    <div class="d-flex align-items-center">
                        {{--                        <img src="{{asset('assets/images/placeholder.png')}}" >--}}
                        <div class="rounded-circle text-white profile-name">
                            {{strtoupper(substr($leads->fname,0,1).''.substr($leads->lname,0,1)) }}
                        </div>
                        <div class="mx-2">
                            <h4 class="mb-0"> {{$leads->fname.' '.$leads->lname}}</h4>
                            <p class="mb-0"><i class="fa fa-envelope fs-5 text-yello me-1"></i> {{$leads->email}}</p>
                        </div>
                    </div>
                    <div class="d-flex gap-2">
                        @if($userAccess->can_delete_lead == 'Yes')
                            <button id="delete_lead_btn{{$leads->id}}" type="button" class="btn btn-light border-0 rounded-circle" onclick="deleteLead(`{{$leads->id}}`)" title="Delete lead"><i class="fa fs-3 fa-trash"></i></button>
                        @endif
                        @if($userAccess->can_call_lead == 'Yes')
                            <button type="button" class="btn btn-light border-0 rounded-circle" id="calltolead_btn{{$leads->id}}" onclick="calltolead(`{{$leads->id}}`)" title="Call to lead" ><i class="fa fs-3 fa-phone"></i></button>
                        @endif
                    </div>
                </div>
                <div class="row profile-card-info">
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Agent : </p>
                            <b>{{$leads->user->name ?? 'null'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Brand : </p>
                            <b>{{$leads->brand ?? 'null'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Registration Date : </p>
                            <b>{{$leads->create_date ?? 'null'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Total Transactions : </p>
                            <b>{{$transactions->sum('amount')}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Country : </p>
                            <b>{{$leads->country ?? 'null'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Status : </p>
                            <b>{{$leads->status ?? 'New'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Office : </p>
                            <b>{{$leads->office->name ?? 'null'}}</b>
                        </div>
                    </div>
                    <div class="col-md-6 mb-3">
                        <div class="form-input d-flex gap-1">
                            <p class="mb-0">Desk : </p>
                            <b>{{$leads->desk->name ?? 'null'}}</b>
                        </div>
                    </div>
                </div>
            </div>
            <div class="card text-left mb-3">
                <div class="card-body">
                    <div class=" d-flex justify-content-between mb-2">
                        <h3>Notes record</h3>
                        @if($userAccess->can_add_lead_notes == 'Yes')
                            <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#add_note_modal">
                                <i class="fa fa-plus fa-lg"></i> Add note
                            </button>
                        @endif
                    </div>
                    <div class="table-responsive">
                        <table class="display table table-bordered" id="notes_table" style="width:100%">
                            <thead>
                            <tr>
                                <th>ID#</th>
                                <th>User</th>
                                <th>Message</th>
                                <th>Create Date</th>
                                @if($userAccess->can_add_lead_notes == 'Yes')
                                    <th>Action</th>
                                @endif
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($notes as $note)
                                <tr>
                                    <td>{{$note->id}}</td>
                                    <td>{{$note->user->name ?? 'null'}}</td>
                                    <td>{{$note->message}}</td>
                                    <td>{{$note->create_date}}</td>
                                    @if($userAccess->can_add_lead_notes == 'Yes')
                                        <td class="text-center">
                                            <a class="fs-4"  id="delete_note_btn{{$note->id}}" onclick="deleteNote(`{{$note->id}}`)"><i class="fa fa-trash"></i></a>
                                        </td>
                                    @endif
                                </tr>
                            @endforeach
                            </tbody>

                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-5 mb-4">
            {{-- Client Portal Access --}}
            @if(Auth::user()->access_level === 'Admin' || Auth::user()->access_level === 'Office Manager' || Auth::user()->access_level === 'Desk Manager')
            <div class="card text-left mb-3">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h3 class="mb-0">Client Portal Access</h3>
                        <div class="d-flex gap-2">
                            <a href="{{ route('trading.portfolio', $leads->id) }}" class="btn btn-sm btn-primary">
                                <i class="fa fa-chart-line"></i> View Portfolio
                            </a>
                            <button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#portal_password_modal">
                                <i class="fa fa-key"></i> Set Portal Password
                            </button>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-3">
                            <div class="text-muted small">Client Status</div>
                            <span class="badge bg-{{ $leads->is_client ? 'success' : 'secondary' }} fs-6">
                                {{ $leads->is_client ? 'Client' : 'Lead' }}
                            </span>
                        </div>
                        <div class="col-md-3">
                            <div class="text-muted small">Portal Access</div>
                            <span class="badge bg-{{ $leads->portal_access ? 'success' : 'secondary' }} fs-6">
                                {{ $leads->portal_access ? 'Enabled' : 'Disabled' }}
                            </span>
                        </div>
                        <div class="col-md-3">
                            <div class="text-muted small">Password Set</div>
                            <span class="badge bg-{{ $leads->portal_password ? 'success' : 'warning' }} fs-6">
                                {{ $leads->portal_password ? 'Yes' : 'Not Set' }}
                            </span>
                        </div>
                        <div class="col-md-3">
                            <div class="text-muted small">Portal URL</div>
                            <code style="font-size:.82rem">{{ url('/portal/login') }}</code>
                        </div>
                    </div>
                    @if($leads->is_client || $leads->portal_access)
                    <div class="mt-3">
                        <form method="POST" action="{{ route('lead.toggle_portal_access', $leads->id) }}" class="d-inline">
                            @csrf
                            <button type="submit" class="btn btn-sm btn-{{ $leads->portal_access ? 'danger' : 'success' }}"
                                onclick="return confirm('{{ $leads->portal_access ? 'Disable' : 'Enable' }} portal access for this client?')">
                                <i class="fa fa-{{ $leads->portal_access ? 'ban' : 'check' }}"></i>
                                {{ $leads->portal_access ? 'Disable' : 'Enable' }} Portal Access
                            </button>
                        </form>
                    </div>
                    @endif
                </div>
            </div>
            @endif
            <div class="card text-left mb-3">
                <div class="card-body">
                    <div class=" d-flex justify-content-between mb-2">
                        <h3>Deposit record</h3>
                        @if($userAccess->can_add_lead_transaction == 'Yes')
                            <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#add_transaction_modal">
                                <i class="fa fa-plus fa-lg"></i> Add deposit
                            </button>
                        @endif
                    </div>
                    <div class="table-responsive">
                        <table class="display table table-bordered" id="deafult_ordering_table" style="width:100%">
                            <thead>
                            <tr>
                                <th>ID#</th>
                                <th>User</th>
                                <th>Amount</th>
                                <th>Status</th>
                                <th>Action Date</th>
                                <th>Create Date</th>
                                @if((Auth::user()->access_level == 'Admin' || Auth::user()->access_level == 'Office Manager'))
                                    <th>Action</th>
                                @endif
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($transactions as $tran)
                                <tr>
                                    <td>{{$tran->id}}</td>
                                    <td>{{$tran->user->name ?? 'null'}}</td>
                                    <td>{{$tran->amount}}</td>
                                    <td>
                                        @if($tran->status == 0)
                                            <span class="badge-pill badge bg-primary">Pending</span>
                                        @else
                                            <span class="badge-pill badge bg-success">Approved</span>
                                        @endif

                                    </td>
                                    <td>{{$tran->action_date}}</td>
                                    <td>{{$tran->create_date}}</td>

                                    @if((Auth::user()->access_level == 'Admin' || Auth::user()->access_level == 'Office Manager') && ($tran->status == 0) )
                                        <td>
                                            <div class="dropdown">
                                                <button class="btn btn-secondary dropdown-toggle border-0" type="button" id="dropdownMenuButton{{$tran->id}}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                    Actions
                                                </button>
                                                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton{{$tran->id}}">

                                                    @if((Auth::user()->access_level == 'Admin' || Auth::user()->access_level == 'Office Manager') && ($tran->status == 0) )
                                                        <a class="dropdown-item" title="Approve deposit" id="approve_transaction_btn{{$tran->id}}" onclick="approveTransaction(`{{$tran->id}}`)">Approve</a>
                                                    @endif
                                                    @if($userAccess->can_add_lead_transaction == 'Yes')
                                                        <a class="dropdown-item d-none"  title="Delete deposit" id="delete_transaction_btn{{$tran->id}}" onclick="deleteTransaction(`{{$tran->id}}`)">Delete</a>
                                                    @endif

                                                </div>
                                            </div>
                                        </td>
                                    @endif
                                </tr>
                            @endforeach
                            </tbody>

                        </table>
                    </div>
                </div>
            </div>
            @if( ((Auth::user()->access_level == 'Admin') || (Auth::user()->access_level == 'Office Manger') ) || ($userAccess->can_listen_recorded_calls == 'Yes'))
{{--                <div class="card text-left mb-3">--}}
{{--                    <div class="card-body">--}}
{{--                        <div class=" mb-2">--}}
{{--                            <h3>Recorded Calls</h3>--}}
{{--                        </div>--}}
{{--                        <div class="table-responsive">--}}
{{--                            <table class="display table table-bordered" id="logs_table" style="width:100%">--}}
{{--                                <thead>--}}
{{--                                <tr>--}}
{{--                                    <th>Time</th>--}}
{{--                                    <th>Date</th>--}}
{{--                                    <th>Duration</th>--}}
{{--                                    <th>Recording</th>--}}

{{--                                </tr>--}}
{{--                                </thead>--}}
{{--                                <tbody>--}}
{{--                                @foreach($recorded_calls as $calls)--}}
{{--                                    <tr>--}}
{{--                                        <td>{{$calls->time}}</td>--}}
{{--                                        <td>{{$calls->date}}</td>--}}
{{--                                        <td>{{$calls->duration}}</td>--}}
{{--                                        <td class="text-center">--}}

{{--                                            <audio controls>--}}
{{--                                                <source src="{{$calls->url}}" type="audio/wav">--}}
{{--                                                Your browser does not support the audio element.--}}
{{--                                            </audio>--}}
{{--                                        </td>--}}

{{--                                    </tr>--}}
{{--                                @endforeach--}}
{{--                                </tbody>--}}
{{--                            </table>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                </div>--}}
            @endif
            <div class="card text-left mb-3">
                <div class="card-body">
                    <div class=" mb-2">
                        <h3>Logs record</h3>
                    </div>
                    <div class="table-responsive">
                        <table class="display table table-bordered" id="logs_table" style="width:100%">
                            <thead>
                            <tr>
                                <th>ID#</th>
                                <th>User</th>
                                <th>Description</th>
                                <th>Create Date</th>
                                @if($userAccess->can_delete_lead_logs == 'Yes')
                                    <th>Action</th>
                                @endif
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($history as $his)

                                <tr>
                                    <td>{{$his->id}}</td>
                                    <td>{{$his->user->name ?? 'null'}}</td>
                                    <td>{{$his->description}}</td>
                                    <td>{{date('Y-m-d',strtotime($his->created_at))}}</td>
                                    @if($userAccess->can_delete_lead_logs == 'Yes')
                                        <td class="text-center">
                                            <a class="fs-4" id="delete_history_btn{{$his->id}}" onclick="deleteHistory(`{{$his->id}}`)"><i class="fa fa-trash"></i></a>
                                        </td>
                                    @endif
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- KYC Documents -->
    <div class="row">
        <div class="col-md-7 mb-4">
            <div class="card text-left">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <div class="d-flex align-items-center gap-2">
                            <h3 class="mb-0">KYC Documents</h3>
                            @php $kycStatus = $leads->kyc_status ?? 'not_submitted'; @endphp
                            <span class="badge bg-{{ $kycStatus === 'approved' ? 'success' : ($kycStatus === 'rejected' ? 'danger' : ($kycStatus === 'under_review' ? 'info' : ($kycStatus === 'pending' ? 'warning' : 'secondary'))) }}">
                                {{ ucwords(str_replace('_', ' ', $kycStatus)) }}
                            </span>
                        </div>
                        <button type="button" class="btn btn-primary btn-sm" data-toggle="modal" data-target="#upload_kyc_modal">
                            <i class="fa fa-upload"></i> Upload Document
                        </button>
                    </div>

                    @if($kycDocuments->isEmpty())
                        <p class="text-muted mb-0">No KYC documents uploaded yet.</p>
                    @else
                        <div class="table-responsive">
                            <table class="table table-bordered table-sm" id="kyc_docs_table">
                                <thead>
                                <tr>
                                    <th>Type</th>
                                    <th>File</th>
                                    <th>Status</th>
                                    <th>Reviewer</th>
                                    <th>Uploaded</th>
                                    @if(Auth::user()->access_level === 'Admin' || Auth::user()->access_level === 'Office Manager')
                                        <th>Action</th>
                                    @endif
                                </tr>
                                </thead>
                                <tbody>
                                @foreach($kycDocuments as $doc)
                                    <tr>
                                        <td>{{ ucwords(str_replace('_', ' ', $doc->document_type)) }}</td>
                                        <td>
                                            <a href="{{ \App\Services\KycService::fileUrl($doc->file_path) }}" target="_blank" class="btn btn-sm btn-outline-secondary">
                                                <i class="fa fa-eye"></i> View
                                            </a>
                                        </td>
                                        <td>
                                            <span class="badge bg-{{ $doc->status === 'approved' ? 'success' : ($doc->status === 'rejected' ? 'danger' : ($doc->status === 'under_review' ? 'info' : 'warning')) }}">
                                                {{ ucwords(str_replace('_', ' ', $doc->status)) }}
                                            </span>
                                            @if($doc->status === 'rejected' && $doc->rejection_reason)
                                                <br><small class="text-danger">{{ $doc->rejection_reason }}</small>
                                            @endif
                                        </td>
                                        <td>{{ $doc->reviewer->name ?? '-' }}</td>
                                        <td>{{ $doc->created_at->format('Y-m-d') }}</td>
                                        @if(Auth::user()->access_level === 'Admin' || Auth::user()->access_level === 'Office Manager')
                                            <td>
                                                <a href="{{ route('kyc.show', $doc->id) }}" class="btn btn-sm btn-primary">
                                                    <i class="fa fa-search"></i> Review
                                                </a>
                                            </td>
                                        @endif
                                    </tr>
                                @endforeach
                                </tbody>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        </div>

    </div>

    <!-- Set Portal Password Modal -->
    @if(Auth::user()->access_level === 'Admin' || Auth::user()->access_level === 'Office Manager' || Auth::user()->access_level === 'Desk Manager')
    <div class="modal" id="portal_password_modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Set Portal Password — {{ $leads->fname }} {{ $leads->lname }}</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <form method="POST" action="{{ route('lead.set_portal_password', $leads->id) }}">
                        @csrf
                        <div class="form-group mb-3">
                            <label class="form-label">New Password <span class="text-danger">*</span></label>
                            <input type="password" name="password" class="form-control" required minlength="8" placeholder="Min. 8 characters">
                        </div>
                        <div class="form-group mb-3">
                            <label class="form-label">Confirm Password <span class="text-danger">*</span></label>
                            <input type="password" name="password_confirmation" class="form-control" required minlength="8">
                        </div>
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="checkbox" name="enable_access" value="1" id="enable_access_check"
                                {{ $leads->portal_access ? 'checked' : '' }}>
                            <label class="form-check-label" for="enable_access_check">
                                Enable portal access after setting password
                            </label>
                        </div>
                        <button type="submit" class="btn btn-primary w-100">Save Password</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
    @endif

    <!-- Upload KYC Document Modal -->
    <div class="modal" id="upload_kyc_modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title">Upload KYC Document</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <div class="modal-body">
                    <form action="{{ route('kyc.upload') }}" method="POST" enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="lead_id" value="{{ $leads->id }}">
                        <div class="form-group mb-3">
                            <label class="form-label">Document Type <span class="text-danger">*</span></label>
                            <select name="document_type" class="form-control" required>
                                <option value="">-- Select type --</option>
                                <option value="passport">Passport</option>
                                <option value="id_card">ID Card</option>
                                <option value="drivers_license">Driver's License</option>
                                <option value="utility_bill">Utility Bill</option>
                                <option value="bank_statement">Bank Statement</option>
                                <option value="selfie">Selfie</option>
                            </select>
                        </div>
                        <div class="form-group mb-3">
                            <label class="form-label">File <span class="text-danger">*</span></label>
                            <input type="file" name="document_file" class="form-control" required accept=".jpg,.jpeg,.png,.pdf">
                            <small class="text-muted">Accepted: JPG, PNG, PDF. Max 10MB.</small>
                        </div>
                        <div class="text-center">
                            <button type="submit" class="btn btn-primary">Upload</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

    <!-- Add Transaction Modal -->
    <div class="modal" id="add_transaction_modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Add Deposit</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>

                <!-- Modal body -->
                <div class="modal-body">

                    <form class="" id="save_transaction">
                        <div class="form-group">
                            <label>Amount</label>
                            <input type="number" id="amount" required class="form-control" >
                        </div>
                        <div class="form-group">
                            <label>Action Date</label>
                            <input type="date" id="action_date" required class="form-control" >
                        </div>
                        <div class="text-center">
                            <button class="btn btn-primary" id="submit_transaction_btn" type="submit">Submit</button>
                        </div>
                    </form>

                </div>
            </div>
        </div>
    </div>
    <!-- Add Note Modal -->
    <div class="modal" id="add_note_modal">
        <div class="modal-dialog">
            <div class="modal-content">
                <!-- Modal Header -->
                <div class="modal-header">
                    <h4 class="modal-title">Add notes</h4>
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                </div>
                <!-- Modal body -->
                <div class="modal-body">
                    <form class="" id="save_note">
                        <div class="form-group">
                            <label>Message</label>
                            <textarea type="text" id="message" rows="5" placeholder="enter note message" required class="form-control" ></textarea>
                        </div>

                        <div class="text-center">
                            <button class="btn btn-primary" id="submit_note_btn" type="submit">Submit</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('page-js')
    <script src="{{ asset('assets/js/vendor/datatables.min.js') }}"></script>
    <script>
        $(document).ready(function () {
            // ordering or sorting
            $('#deafult_ordering_table').DataTable({
                "order": [
                    [0, "DESC"]
                ]
            });
            $('#logs_table').DataTable({
                "order": [
                    [0, "DESC"]
                ]
            });
            $('#notes_table').DataTable({
                "order": [
                    [0, "DESC"]
                ]
            });
        });
        function EditDesk(id,name,office_id){
            $("#desk_id").val(id);
            $("#edit_office_id").val(office_id);
            $("#edit_name").val(name);
            // $("#edit_desk_modal").show();
        }
    </script>
@endsection