@extends('layouts.thema')

@section('content')
      
        <div class="col-md-3">
          <div class="card">
            <div class="card-body">
              <img src="{{asset('img/profile/'.$user->foto_profile)}}" alt="" class="rounded-circle img-fluid"><br><br>
              <h5 class="text-center">
                <button class="btn btn-outline-primary btn-sm" data-toggle="modal" data-target="#exampleModal">Upload Foto Profile</button> <br><br>
                <b>{{$user->name}}</b> <br> 
              Akses :
              @foreach($roles as $a)
              <span class="badge bg-primary rounded-3 fw-semibold mt-2"><small>{{$a->name}}</small></span> 
              @endforeach
              </h5>
            </div>
          </div>
        </div>

        <div class="col-md-9">
          <div class="card">
            <div class="card-body">
              <h5 class="card-title fw-semibold mb-4">
                <a href="{{url('profile')}}" class="btn btn-{{(request()->segment(1) == 'profile')? '':'outline-'}}primary">Profile</a> &nbsp;&nbsp;
                <a href="{{route('changePassword')}}" class="btn btn-outline-primary">Password</a>
              </h5>

              <form action="{{url('update_profile')}}" method="post">
                @csrf
                <div class="form-group mb-3 row">
                  <label for="name" class="col-sm-2 col-form-label">Nama Lengkap</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" id="name" name="name" value="{{$user->name}}">
                  </div>
                </div>

                <div class="form-group mb-3 row">
                  <label for="username" class="col-sm-2 col-form-label">Username</label>
                  <div class="col-sm-10">
                    <input type="text" class="form-control" id="username" name="username" value="{{$user->username}}" disabled>
                  </div>
                </div>

                <div class="form-group mb-3 row">
                  <label for="email" class="col-sm-2 col-form-label">E-Mail</label>
                  <div class="col-sm-10">
                    <input type="email" class="form-control" id="email" name="email" value="{{$user->email}}" required>
                  </div>
                </div>

                <div class="form-group mb-3 row">
                  <label for="no_hp" class="col-sm-2 col-form-label">No HP</label>
                  <div class="col-sm-10">
                    <input type="number" class="form-control" id="no_hp" name="no_hp" value="{{$user->no_hp}}" required>
                  </div>
                </div>

                @if($user->hasRole('Kepala Sekolah'))
                <div class="form-group mb-3 row">
                  <label for="school_id" class="col-sm-2 col-form-label">Sekolah</label>
                  <div class="col-sm-10">
                  <select id="school_id" name="school_id" class="form-control" disabled>
                    <option {{$user->school_id==NULL?'selected':''}}>-- Pilih --</option>
                    <option value="1" {{$user->school_id==1?'selected':''}}>TKIT Al Istiqomah</option>
                    <option value="2" {{$user->school_id==2?'selected':''}}>MI Al Istiqomah</option>
                    <option value="3" {{$user->school_id==3?'selected':''}}>SDIT Al Istiqomah 1</option>
                    <option value="4" {{$user->school_id==4?'selected':''}}>SDIT Al Istiqomah 2</option>
                  </select>
                  </div>
                </div>
                @endif

                <button type="submit" class="btn btn-outline-primary">Update</button>
              </form>

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

    <!-- Modal foto profile-->
    <div class="modal fade" id="exampleModal" aria-labelledby="exampleModalLabel" aria-hidden="true">
      <div class="modal-dialog">
        <div class="modal-content">
        <form action="{{url('upload_foto')}}" method="post" enctype="multipart/form-data">
        @csrf
          <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLabel">Upload Foto Profile</h5>
            <button type="button" class="close btn btn-dark btn-sm" data-dismiss="modal" aria-label="Close">x</button>
          </div>
          <div class="modal-body">

            <div class="form-group mb-3 row">
              <label for="foto_profile" class="col-sm-3 col-form-label">Foto Profile</label>
              <div class="col-sm-9">
                <input type="file" class="form-control" id="foto_profile" name="foto_profile" required>
              </div>
            </div>

          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            <button type="submit" class="btn btn-primary">Upload</button>
          </div>
        </form>
        </div>
      </div>
    </div>

@endsection