@extends('layouts.app')

@section('title', 'Family Details')

@section('content')
    <div class="d-flex gap-5 justify-content-between ">
        <div class="flex-fill">
            <div class="card">
                <div class="card-header">
                    <h4>Personal Infomation</h4>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col">Name</div>
                        <div class="col">{{ $family->full_name ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Gender</div>
                        <div class="col">{{ $family->gender_text ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">DOB[AD]</div>
                        <div class="col">{{ $family->dob_en ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">DOB[BS]</div>
                        <div class="col">{{ $family->dob_np ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Father's Name</div>
                        <div class="col">{{ $family->father_name ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">District_en</div>
                        <div class="col">{{ $family->district_en ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Ward No_en</div>
                        <div class="col">{{ $family->wardno_en ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Address_en</div>
                        <div class="col">{{ $family->address_en ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Citizenship No</div>
                        <div class="col">{{ $family->citizenship_no ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Martial Status</div>
                        <div class="col">{{ $family->martial_status_text ?? 'N/A' }}</div>
                    </div>
                </div>

                <div class="card-header">
                    <h4>Contact Information</h4>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col">Email</div>
                        <div class="col">{{ $family->email ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Phone No</div>
                        <div class="col">{{ $family->phone_no ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Mobile No</div>
                        <div class="col">{{ $family->mobile_no ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Ofice Name</div>
                        <div class="col">{{ $family->office_name ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Office Phone</div>
                        <div class="col">{{ $family->office_phone ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Office Email</div>
                        <div class="col">{{ $family->office_email ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Office Address</div>
                        <div class="col">{{ $family->office_address ?? 'N/A' }}</div>
                    </div>
                </div>
                <div class="card-header">
                    <h4>Educations, Trainings and Involvements</h4>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col">Complete Education Level</div>
                        <div class="col">{{ $family->educationLevel->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Complete Subject</div>
                        <div class="col">{{ $family->educationSubject->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Complete Institute</div>
                        <div class="col">{{ $family->compEducationInstitute->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Complete Year</div>
                        <div class="col">{{ $family->edu_comp_year ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Current Level</div>
                        <div class="col">{{ $family->currentEducationLevel->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Current Institute</div>
                        <div class="col">{{ $family->currentEducationInstitute->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Current Institute Address</div>
                        <div class="col">{{ $family->edu_current_inst_address ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Trainings</div>
                        <div class="col">{{ $family->trainings ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Involvements</div>
                        <div class="col">{{ $family->involvements ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">Profession</div>
                        <div class="col">{{ $family->professionRelation->title ?? 'N/A' }}</div>
                    </div>
                </div>
                <div class="card-header">
                    <h4>Health Information</h4>
                </div>
                <div class="card-body">
                    <div class="row">
                        <div class="col">
                            Blood Group
                        </div>
                        <div class="col">{{ $family->blood_group_text ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">
                            Health Problem 1
                        </div>
                        <div class="col">{{ $family->healthProblem1->title ?? 'N/A' }}</div>
                    </div>
                    <div class="row">
                        <div class="col">
                            Health Problem 2
                        </div>
                        <div class="col">{{ $family->healthProblem2->title ?? 'N/A' }}</div>
                    </div>
                </div>
            </div>
        </div>
        <div>
            <div class="d-flex justify-content-between gap-3">
                <div class="card flex-fill">
                    <div class="card-header">
                        <h4>Photo</h4>
                    </div>
                    <div class="card-body m-auto">
                        <img src="{{ $family->image_url ?? asset('img/avatar/avatar-1.png') }}" alt=""
                            width="100%" height="130" style="object-fit: contain;">
                    </div>
                </div>

                <div class="card">
                    <div class="card-header">
                        <h4>Status</h4>
                    </div>
                    <div class="card-body">
                        {{-- <div class="row">
                            <div class="col">Last Modified By:</div>
                            <div class="col">Rohan Bajracharya</div>
                        </div> --}}
                        <div class="row">
                            <div class="col">Last Modified Date:</div>
                            <div class="col">{{ $family->updated_at->format('Y-m-d') ?? 'N/A' }}</div>
                        </div>
                        <div class="row">
                            <div class="col">Created Date:</div>
                            <div class="col">{{ $family->created_at->format('Y-m-d') ?? 'N/A' }}</div>
                        </div>
                        <div class="row">
                            <div class="col">Status:</div>
                            <div class="col">{{ $family->status_text ?? 'N/A' }}</div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card">
                <div class="card-header">
                    <h4>Family Members</h4>
                </div>
                <div class="card-body">
                    @foreach ($members as $member)
                        <div class="d-flex flex-fill justify-content-between mx-2 my-1">
                            <div>
                                <img src="{{ $member->image_url ?? asset('img/avatar/avatar-1.png') }}" alt=""
                                    height="60" width="60">
                            </div>
                            <div class="d-flex flex-column ">
                                <div class="d-flex gap-2">
                                    <div>Tamrakar-ID:</div>
                                    <div>{{ $member->tamrakar_id ?? 'M/A' }}</div>
                                </div>
                                <div class="d-flex gap-2">
                                    <div>Name: </div>
                                    <div>{{ $member->full_name ?? 'N/A' }}</div>
                                </div>
                                <div class="d-flex gap-2">
                                    <div>Father's Name:</div>
                                    <div>{{ $member->father_name ?? 'N/A' }}</div>
                                </div>
                            </div>
                            <div>
                                <a href="{{ route('admin.families.show', ['family' => $member->id]) }}"
                                    data-bs-toggle="tooltip" title="view" data-bs-placement="top"
                                    class="btn btn-sm btn-primary"><i class="fa fa-eye"></i></a>
                            </div>
                        </div>
                        <hr>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
@endsection