@extends('layouts.app')
@section('content')
    <div class="m-sm-5 m-1">
        <div class="fs-4 fw-bolder mb-3 text-p">تفاصيل المعلم</div>
        <div class="d-flex justify-content-between">
            <div class="d-flex gap-3">
                <div class="">
                    <img style="width: 100px;height:100px;" src="{{ $teacher->image }}" alt="" class="rounded-circle">
                </div>
                <div class="">
                    <div class="fs-6  text-p">{{ $teacher->name }}</div>
                    <div class="text-s">{{ $teacher->job_title ?? null }}</div>
                    <div class="mt-3">
                        <span class="text-p3 "><i class="fa-solid fa-phone"></i></span><span class="text-s ms-2">رقم الهاتف
                            : </span><span class="text-b">{{ $teacher->phone }}</span>

                    </div>
                    
                    <div class="mt-1">

                        <span class="text-p3 "><i class="fa-regular fa-envelope"></i></span><span class="text-s ms-2">
                            البريد الالكترونى : </span><span class="text-b">{{ $teacher->admin->email }}</span>
                    </div>

                </div>
            </div>
            <div class="d-flex gap-3">
                <a href="{{ route('teachers.edit', $teacher->id) }}" class="btn-p">تعديل</a>
            <a data-url="{{ route('teachers.active', $teacher->admin->id) }}" data-active="{{ $teacher->admin->active ? 0 : 1 }}"
                    href="javascript:;" class="btn-d  active-request">

                    @if ($teacher->admin->active)
                        حظر الحساب
                    @else
                        تفعيل الحساب
                    @endif
                </a>
            </div>
        </div>


        {{ $dataTable->table() }}





    </div>
@endsection
@section('js')
    {{ $dataTable->scripts(attributes: ['type' => 'module']) }}
@endsection