@extends('user.layouts.master')
@section('title', 'Home')
@section('content')
<div class="container-fluid">
   <div class="breadcrumb-header justify-content-between">
      <div class="my-auto">
         <div class="d-flex">
            <h4 class="content-title mb-0 my-auto">My Account</h4>
            <span class="text-muted mt-1 tx-13 ml-2 mb-0">/ Profile</span>
         </div>
      </div>
   </div>
   <div class="row row-sm">
      <div class="col-lg-4">
         <div class="card mg-b-20">
            <div class="card-body">
               <div class="pl-0">
                  <div class="main-profile-overview">
                     <div class="main-img-user profile-user"><img alt="" src="{{ asset('user_assets/img/faces/5.jpg') }}"><a href="JavaScript:void(0);" class="fas fa-camera profile-edit"></a></div>
                     <div class="d-flex justify-content-between mg-b-20">
                        <div>
                           <h5 class="main-profile-name">{{ $authUser->first_name }}</h5>
                           <p class="main-profile-name-text">Web Designer</p>
                        </div>
                     </div>
                     <hr class="mg-y-30">
                     <div class="main-profile-social-list">
                        <div class="media">
                           <div class="media-icon bg-primary-transparent text-primary">
                              <i class="icon ion-logo-github"></i>
                           </div>
                           <div class="media-body">
                              <span>Registration Date</span> <a href="">{{ $authUser->registration_date }}</a>
                           </div>
                        </div>
                        <div class="media">
                           <div class="media-icon bg-success-transparent text-success">
                              <i class="icon ion-logo-twitter"></i>
                           </div>
                           <div class="media-body">
                              <span>Activation Date</span> <a href="javaScript:void(0);">{{ $authUser->activation_date_formatted }}</a>
                           </div>
                        </div>
                        <div class="media">
                           <div class="media-icon bg-info-transparent text-info">
                              <i class="icon ion-logo-linkedin"></i>
                           </div>
                           <div class="media-body">
                              <span>Sponsor ID</span> <a href="">{{ @$authUser->sponsor->full_name }}</a>
                           </div>
                        </div>
                        <div class="media">
                           <div class="media-icon bg-danger-transparent text-danger">
                              <i class="icon ion-md-link"></i>
                           </div>
                           <div class="media-body">
                              <span>Status</span> <a href="">Active</a>
                           </div>
                        </div>
                     </div>
                  </div>
               </div>
            </div>
         </div>
         <div class="card mg-b-20">
            <div class="card-body">
               <div class="main-content-label tx-13 mg-b-25">
                  Conatct
               </div>
               <div class="main-profile-contact-list">
                  <div class="media">
                     <div class="media-icon bg-primary-transparent text-primary">
                        <i class="icon ion-md-phone-portrait"></i>
                     </div>
                     <div class="media-body">
                        <span>Mobile</span>
                        <div>
                           {{ $authUser->mobile_number }}
                        </div>
                     </div>
                  </div>
	                  	<div class="media">
	                     	<div class="media-icon bg-success-transparent text-success">
	                        	<i class="icon ion-logo-slack"></i>
	                     	</div>
	                     	<div class="media-body">
	                        	<span>Slack</span>
	                        	<div>
	                           		@spruko.w
	                        	</div>
	                     	</div>
	                  	</div>
                  		<div class="media">
                     		<div class="media-icon bg-info-transparent text-info">
                        		<i class="icon ion-md-locate"></i>
                     		</div>
                     		<div class="media-body">
                        		<span>Current Address</span>
                        		<div>
                           			{{ $authUser->address }}
                        		</div>
                     		</div>
                  		</div>
               		</div>
            	</div>
         	</div>
      	</div>
      	<div class="col-lg-8">
         	<div class="card">
            	<form method="post" action="{{ route('user.account.profile.update') }}" class="mt-6 space-y-6">
	        		@csrf
	        		@method('patch')
            		<div class="card-body">
               			<div class="mb-4 main-content-label">Personal Information</div>
	                  	<div class="form-group ">
	                     	<div class="row">
		                        <div class="col-md-3">
		                           <label class="form-label">First Name</label>
		                        </div>
		                        <div class="col-md-9">
		                           <input type="text" name="first_name" class="form-control"  placeholder="First Name" value="{{ old('first_name', $authUser->first_name) }}">
		                        </div>
	                     	</div>
	                  	</div>
	                  	<div class="form-group ">
	                     	<div class="row">
		                        <div class="col-md-3">
		                           <label class="form-label">Last Name</label>
		                        </div>
		                        <div class="col-md-9">
		                           <input type="text" name="last_name" class="form-control"  placeholder="First Name" value="{{ old('last_name', $authUser->last_name) }}">
		                        </div>
	                     	</div>
	                  	</div>

	                  	<div class="mb-4 main-content-label">Contact Info</div>
	              		<div class="form-group ">
		                    <div class="row">
		                        <div class="col-md-3">
		                           <label class="form-label">Email<i>(required)</i></label>
		                        </div>
		                        <div class="col-md-9">
		                           <input type="text" name="email" class="form-control"  placeholder="Email" value="{{ old('email', $authUser->email) }}" readonly="readonly">
		                        </div>
		                    </div>
		                </div>
		                <div class="form-group ">
		                    <div class="row">
		                        <div class="col-md-3">
		                           <label class="form-label">Mobile No.</label>
		                        </div>
		                        <div class="col-md-9">
		                           <input type="text" name="mobile_number" class="form-control"  placeholder="Mobile number" value="{{ old('mobile_number', $authUser->mobile_number) }}">
		                        </div>
		                    </div>
		                </div>
		                <div class="form-group ">
		                    <div class="row">
		                        <div class="col-md-3">
		                           <label class="form-label">Address</label>
		                        </div>
		                        <div class="col-md-9">
		                           <textarea class="form-control" name="address" rows="2"  placeholder="Address">{{ old('address', $authUser->address) }}</textarea>
		                        </div>
		                    </div>
		                </div>
            		</div>
	            	<div class="card-footer">
	               		<button type="submit" class="btn btn-primary waves-effect waves-light">Update Profile</button>
	            	</div>
               	</form>
         	</div>
      	</div>
   	</div>
</div>
@endsection