@extends('layouts.agent')
@section('page-title', 'Buses Schedules')

@section('main-container')
<div id="account-settings">
<div id="personal-details" class="">
    <div class="container-personal-d1">
        <img src='{{asset("media/others/user-img.png")}}'>
        <section>
        Account Status | @if($staff->status == 0) Active @else In-Active @endif
        </section>
    </div>
    <div class="container-personal-d2">
        <h2>Full Name</h2>
        <p>{{ $staff->name }}</p>
    </div>
    <div class="container-personal-d2">
        <h2>Address</h2>
        <p>{{ $staff->address }}</p>
    </div>
    <div class="container-personal-d2">
        <h2>Email</h2>
        <p>{{ $staff->email }}</p>
    </div>
    <div class="container-personal-d2">
        <h2>Phone Number</h2>
        <p>{{ $staff->phone }}</p>
    </div>
    <div class="container-personal-d2">
        <h2>Account status</h2>
        <p>
            @if($staff->status == 0)
            Active
            @else
            In-Active
            @endif
        </p>
    </div>
    <div class="container-personal-d2">
        <h2>Joined At</h2>
        <p>
           {{ $staff->created_at->format('M d, Y') }} </p>
    </div>
</div>

<div id="settings-container-changes">
    <div class="change-personal-details">
        <h2>Update personal details</h2>
        <form action="{{route('update-staff-details')}}" method="POST">
          @csrf
          <h4 class="required-fields">Staff Name</h4>
          <input type="text" name="name" class="form-control form-control-sm" id="chaemail" data-id="chaemail" value="{{ $staff->name}}" required>
          <h4 class="required-fields">Address</h4>
          <input type="text" name="address" class="form-control form-control-sm" id="chaemail" data-id="chaemail" value="{{ $staff->address}}" required>
          <h4 class="required-fields">Email Address</h4>
          <input type="email" name="email" class="form-control form-control-sm" id="chaemail" data-id="chaemail" value="{{ $staff->email}}" required>
          <input type="hidden" name="id" value="{{ $staff->id}}">
          <h4 class="required-fields">Phone Number</h4>
          <div class="input-group mb-3">
            <div class="input-group-prepend">
              <span class="input-group-text" id="basic-addon1">255</span>
            </div>
            <input type="text" class="form-control" placeholder="*********" name="phone" id="chaphone" data-id="chaphone" value="{{ substr($staff->phone,3)}}" pattern="[1-9]{1}[0-9]{8}" maxlength="9" minlength="9" required>
          </div>
          <button type="submit" class="btn bg-success text-white w-100">Update Details</button>
        </form>
    </div>

    <div class="change-personal-details">
        <h2>Reset password</h2>
        <form action="{{route('update-staff-password')}}" method="POST">
          @csrf
          <h4 class="required-fields">New password</h4>
          <input type="hidden" name="staffid" value="{{$staff->id}}">
          <input type="password" name="passworda" minlength="6" class="form-control form-control-sm" id="newppass" data-id="newppass" required>
          <h4 class="required-fields">Re-enter password</h4>
          <input type="password" name="passwordb" minlength="6" class="form-control form-control-sm" id="renewppass" data-id="renewppass" required>
          <input type="hidden" name="id" value="{{ $staff->id}}">
          <span class="error-password"></span>
          <br>
          <button type="submit" class="btn bg-success text-white w-100">Reset Password</button>
        </form>
    </div>
</div>
</div>


<div class="modal fade out" id="upload-modal" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content text-black">
        <div class="modal-header">
            <h5 class="modal-title" id="exampleModalLongTitle">Edit profile image</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close" onclick="$('.modal').hide()">
                <span aria-hidden="true">&times;</span>
            </button>
        </div>
        <div class="modal-body" id="bodymod">
        <form method="POST" id='uploadform-img' action="" enctype="multipart/form-data">
        @csrf
        <section class="view-col-full">
            <h5>Select Image</h5><input type="file" name="image" class="form-control" required>
        </section>
        <section class="view-col-full">
            <button type="submit" class="btn bg-success btnsuccess">Update Profile</button>
        </section>
        </form>
        </div>
    </div>
</div>
</div>


@endsection

<!-- js script -->
@push('scripts')

<script>


    $(function(){



    });
</script>
@endpush