@extends('frontend.layouts.main')

@section('main-container')



  <main id="main" class="main">

    

     <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>


      <h4>Profile</h4>

   

        <ol class="breadcrumb">

          <li class="breadcrumb-item"><a href="index.html">Home</a></li>

          <li class="breadcrumb-item">Users</li>

          <li class="breadcrumb-item active">Profile</li>

        </ol>    

      </nav>

           @if ($message = Session::get('success'))

            <div class="alert alert-success" id="alert">

             <p>{{ $message }}</p>

            </div>

           @endif

           @if ($message = Session::get('error'))

            <div class="alert alert-danger" id="alert">

             <p>{{ $message }}</p>

            </div>

           @endif

    </div><!-- End Page Title -->



    <section class="section profile">

      <div class="row">

        <div class="col-xl-4">



          <div class="card">

            <div class="card-body profile-card pt-4">

     

               <div>

                   <form action="{{route('update.profile')}}" method="POST" enctype="multipart/form-data">

                    @csrf
                    <input type="hidden" name="from" value="profile">

                    <div class="text-center">

                      @if(Auth::user()->profile==Null)

                       <div class="rounded-circle border d-flex justify-content-center  align-items-center"style="width:100px;height:100px" alt="Avatar">

                          <i class="bi bi-person-circle"></i>

                       </div>

                      @else

                        <img class="rounded-circle mb-3" name="profile" alt="avatar1" src="{{ url('public/Image/'.Auth::user()->profile) }}"  style="height:97px; width:95px;"/>   

                      @endif

                    </div>

                    <div class="form-group">

                      <input type="file" name="profile" class="form-control" accept="image/png, image/jpeg" required>

                    </div>

                    <div class="text-center">

                      <button type="submit" class="btns primary-btn btn-sm">Update</button>

                    </div>

                    </form>

                </div>

            </div>

          </div>



        </div>



        <div class="col-xl-8">



          <div class="card">

            <div class="card-body pt-3">

              <!-- Bordered Tabs -->

              <ul class="nav nav-tabs nav-tabs-bordered">



                <li class="nav-item">

                  <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#profile-overview">Overview</button>

                </li>

                @can('company.manage')

                <li class="nav-item">

                  <button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile-edit">Company Details</button>

                </li>

                @endcan

               <!--  <li class="nav-item">

                  <button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile-settings">Settings</button>

                </li> -->



                <li class="nav-item">

                  <button class="nav-link" data-bs-toggle="tab" data-bs-target="#profile-change-password">Change Password</button>

                </li>



              </ul>

              <div class="tab-content pt-2">



                <div class="tab-pane fade show active profile-overview" id="profile-overview">

                  <h5 class="card-title">Profile Details</h5>



                  <div class="row">

                    <div class="col-lg-3 col-md-4 label ">Full Name</div>

                    <div class="col-lg-9 col-md-8">{{ Auth::user()->name }}</div>

                  </div>



                  <div class="row">

                    <div class="col-lg-3 col-md-4 label">Email:</div>

                    <div class="col-lg-9 col-md-8">{{Auth::user()->email}}</div>

                  </div>



                  <div class="row">

                    <div class="col-lg-3 col-md-4 label">Mobile:</div>

                    <div class="col-lg-9 col-md-8">{{Auth::user()->mobile}}</div>

                  </div>



                  <div class="row">

                    <div class="col-lg-3 col-md-4 label">DOB:</div>

                    <div class="col-lg-9 col-md-8">{{Auth::user()->DOB}}</div>

                  </div>

                </div>

                @can('company.manage')

                <div class="tab-pane fade profile-edit pt-3" id="profile-edit">



                  <!-- Profile Edit Form -->

                  <form action="{{route('admin.update',$companies->id)}}" method="post" enctype="multipart/form-data">

                    {{ csrf_field() }}

                    @method('PUT')

                    <div class="row mb-3">

                      <label for="name" class="col-md-4 col-lg-3 col-form-label">Company:</label>

                      <div class="col-md-8 col-lg-9">   

                      <input type="text" name="name" class="form-control" id="yourName" value="{{$companies->name}}" required>

                      </div>

                    </div>

                    

                    <div class="row mb-3">

                      <label for="city" class="col-md-4 col-lg-3 col-form-label">City:</label>

                      <div class="col-md-8 col-lg-9">

                       <input type="text" name="city" class="form-control" value="{{$companies->city}}" required>

                      </div>

                    </div> 

                   <div class="row mb-3">

                      <label for="state" class="col-md-4 col-lg-3 col-form-label">State:</label>

                      <div class="col-md-8 col-lg-9">

                        <input name="state" type="text" class="form-control" value="{{$companies->state}}" required>

                      </div>

                    </div> 



                   <div class="row mb-3">

                      <label for="country" class="col-md-4 col-lg-3 col-form-label">Country:</label>

                      <div class="col-md-8 col-lg-9">

                        <input name="country" type="text" class="form-control" id="country" value="{{$companies->country}}" required>

                      </div>

                   </div>



                    <div class="row mb-3">

                      <label for="Address" class="col-md-4 col-lg-3 col-form-label">Address:</label>

                      <div class="col-md-8 col-lg-9">

                        <input name="address" type="text" class="form-control" id="Address" value="{{$companies->address}}">

                      </div>

                    </div> 



                    <div class="row mb-3">

                      <label for="gst" class="col-md-4 col-lg-3 col-form-label">GST:</label>

                      <div class="col-md-8 col-lg-9">

                        <input type="text" name="GST" class="form-control" value="{{$companies->GST}}" required>

                      </div>

                    </div>



                     <div class="row mb-3">

                      <label for="logo" class="col-md-4 col-lg-3 col-form-label">Company Logo:</label>             

                       <div class="col-md-8 col-lg-9">

                          <input id="avatar" type="file" name="logo" value="{{$companies->logo}}" accept="image/png, image/jpeg">

                         @if($companies->logo==Null)

                         <div></div>

                         @else

                           <img src="{{ url('public/Image/'.$companies->logo) }}" style="height: 50px; width: 100px; margin-top: 5px;">

                         @endif

                        </div>

                     </div>  

                    <div class="text-center">

                      <button type="submit" class="btns primary-btn btn-sm">Save Changes</button>

                    </div>

                  </form><!-- End Profile Edit Form -->

                </div>

                @endcan

                <div class="tab-pane fade pt-3" id="profile-settings">



                  <!-- Settings Form -->

                  <form>



                    <div class="row mb-3">

                      <label for="fullName" class="col-md-4 col-lg-3 col-form-label">Email Notifications</label>

                      <div class="col-md-8 col-lg-9">

                        <div class="form-check">

                          <input class="form-check-input" type="checkbox" id="changesMade" checked>

                          <label class="form-check-label" for="changesMade">

                            Changes made to your account

                          </label>

                        </div>

                        <div class="form-check">

                          <input class="form-check-input" type="checkbox" id="newProducts" checked>

                          <label class="form-check-label" for="newProducts">

                            Information on new products and services

                          </label>

                        </div>

                        <div class="form-check">

                          <input class="form-check-input" type="checkbox" id="proOffers">

                          <label class="form-check-label" for="proOffers">

                            Marketing and promo offers

                          </label>

                        </div>

                        <div class="form-check">

                          <input class="form-check-input" type="checkbox" id="securityNotify" checked disabled>

                          <label class="form-check-label" for="securityNotify">

                            Security alerts

                          </label>

                        </div>

                      </div>

                    </div>



                    <div class="text-center">

                      <button type="submit" class="btns primary-btn btn-sm">Save Changes</button>

                    </div>

                  </form><!-- End settings Form -->



                </div>



                <div class="tab-pane fade pt-3" id="profile-change-password">

                  <!-- Change Password Form -->

                  <form action="{{ route('update.profile') }}" method="post">

                    {{ csrf_field() }}

                    <div class="row mb-3">

                      <label for="currentPassword" class="col-md-5 col-lg-4 col-form-label">Current Password<span style="color:red;">*</span></label>

                      <div class="col-md-6 col-lg-7">

                        <input name="password" type="password" class="form-control" id="currentPassword" required>

                      </div>

                    </div>



                    <div class="row mb-3">

                      <label for="newPassword" class="col-md-5 col-lg-4 col-form-label">New Password<span style="color:red;">*</span></label>

                      <div class="col-md-6 col-lg-7">

                        <input name="newpassword" type="password" class="form-control" id="newPassword" required>

                      </div>

                    </div>



                    <div class="row mb-3">

                      <label for="renewPassword" class="col-md-5 col-lg-4 col-form-label">Re-enter Password<span style="color:red;">*</span></label>

                      <div class="col-md-6 col-lg-7">

                        <input name="renewpassword" type="password" class="form-control" id="renewPassword" required>

                      </div>

                    </div>



                    <div class="text-center">

                      <button type="submit" class="btns primary-btn btn-sm">Change Password</button>

                    </div>

                  </form><!-- End Change Password Form -->



                </div>



              </div><!-- End Bordered Tabs -->



            </div>

          </div>



        </div>

      </div>

    </section>

</main><!-- End #main -->

<script type="text/javascript">

       $("document").ready(function(){

        setTimeout(function()

        {

            $("div.alert").remove();



        }, 3000);



       });

</script>

@endsection