@extends('layouts.nifty')

@section('content')
<link rel="stylesheet" type="text/css" href="{{ asset('mylib/selectmultiple/choices.min.css') }}">
<script src="{{ asset('mylib/selectmultiple/choices.min.js') }}"></script>

<style>
.footerbutton {
   position: fixed;
   left: 0;
   bottom: 0;
   width: 100%;
   height: 8%;
   margin-bottom: 6px;
   background-color: #fff;
   color: white;
   text-align: center;
}

.table-responsive,
.dataTables_scrollBody {
    overflow: visible !important;
}
 
.table-responsive-disabled .dataTables_scrollBody {
    overflow: hidden !important;
}

/* Datatables Buttons */

   .btn-sm-menu {
      width: 50px;
      height: 30px;
      /*border: 1px solid #474747;*/
   }
   .btn-sm-menu2 {
      width: 120px;
      height: 30px;
      border-radius: 10px;
      border: .5px solid #474747;
   }  
/* End Datatables Buttons */   
/* modal position */
.modal {
  float: left;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
/* end modal position */
.mt-100{margin-top: 100px}body{background: #00B4DB;background: -webkit-linear-gradient(to right, #0083B0, #00B4DB);background: linear-gradient(to right, #0083B0, #00B4DB);color: #514B64;min-height: 100vh}
</style>
    
        <section id="content" class="content">
            <div class="content__header content__boxed overlapping">
                <div class="content__wrap">

                    <!-- Breadcrumb -->
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0">
                            <li class="breadcrumb-item"><a href="{{ route('home') }}"><i class="demo-pli-home"></i></a></li>
                            <li class="breadcrumb-item" aria-current="page">My Account</li>
                        </ol>
                    </nav>
                    <!-- END : Breadcrumb -->

                    <h1 class="page-title mb-0 mt-2">My Account</h1>
                    
                    <p>Click Update Account to Save your Changes</p>
                    

                </div>

            </div>

            <div class="content__boxed">
                <div class="content__wrap">

                    <section>
                      <form method="post" action="{{ route('admin.myaccounts.update', [$users->id]) }}" enctype="multipart/form-data" onsubmit="return validateForm()">
                      @csrf
                      @method('PUT')  

                        <div class="row">
                          <div class="col-md-6">
                            <div class="card card-info">

                          
                                <div class="card-body">
                                  <h5 class="card-title">PERSONAL INFORMATION</h5>
                            
                                  <div class="row">
                                    <div class="col-sm-4">
                                      <div class="form-group mb-3">
                                        <label>Emp No</label>
                                        <input type="text" class="form-control"  id= "empno" name="empno"  value = "{{ $users->empno ?? '' }}" readonly>
                                      </div>
                                    </div>
                                    <div class="col-sm-8">
                                      <div class="form-group mb-3">
                                        <label>Name</label>
                                        <input type="text" class="form-control"  id= "name" name="name"  value = "{{ $users->name ?? '' }}" readonly>
                                      </div>
                                    </div>
                                  
                                  </div>
                                  <h5 class="card-title">ACCOUNT SECURITY</h5>
                                  <div class="row">
                                    <div class="col-sm-12">
                                      <div class="form-group mb-3">
                                        <label>Email Address</label>
                                        <input type="email" class="form-control" placeholder="Email Address" id= "email" name="email"  value = "{{ $users->email ?? '' }}" required>
                                      </div>
                                    </div>

                                  </div>
                                  <div class="row">
                                    <div class="col-sm-6">
                                      <div class="form-group mb-3">
                                        <label>Branch</label>
                                        <select class="form-select form-select-sm" id="branchid" name="branchid" style="width: 100%;" required>
                                            <option value = "{{ $branchname->branchid ?? '' }}">{{ $branchname->branch ?? 'Select Branch' }}</option>
                                            @foreach($branches as $branches)
                                              <option value="{{ $branches->branchid }}">{{ $branches->branch }}</option>
                                            @endforeach
                                        </select>
                                      </div>
                                    </div>
                                    <div class="col-sm-6">
                                      <div class="form-group mb-3">
                                        <label>Photo</label>
                                        <input type="file" class="form-control" id="user_photo" name="user_photo" style="height:35px" accept=".jpg, .png, .gif">
                                      </div>
                                    </div>                                        

                                  </div>     


                                </div>
                                <div class="card-footer" style="text-align: center;">
                                  <button type="button" class="btn btn-sm btn-info" onclick="window.location.href='{{ route('home') }}'"><i class="fa fa-home"></i> Home</button>
                                  <button  class="btn btn-sm btn-primary"><i class="fas fa-paper-plane"></i> Update Account</button>
                                </div> 

                    
                            </div>


                          </div>
                          <!--/.col (right) -->     



                        </div>



                      </form>
                    </section>


                </div>
            </div>
            <!-- FOOTER -->
            @include('partials.footer')
            <!-- END - FOOTER -->

        </section>


<script type="text/javascript" language="javascript" src="{{ asset('mylib/js/jquery-3.5.1.js') }}"></script>

<script>
function validateForm() {
  

  if(document.getElementById('email').value == ""){
      alert("Please Enter Email Address to Continue!");
       return false;
  }

  if(document.getElementById('branchid').value == ""){
      alert("Please Select Branch to Continue!");
       return false;
  }


  var ok = confirm("Are you sure you want to Update your Account?");
  if(ok){  
    return true; 
  } else {  
    return false; 
  }
}
</script>



@endsection