@extends('vendor.dashboard')
@section('vendor')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>

<div class="page-content"> 
    <!--breadcrumb-->
    <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
        <div class="breadcrumb-title pe-3">vendor Profile</div>
        <div class="ps-3">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb mb-0 p-0">
                    <li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">vendor Profilep</li>
                </ol>
            </nav>
        </div>
      
    </div>
    <!--end breadcrumb-->
    <div class="container">
        <div class="main-body">
            <div class="row">
                <div class="col-lg-4">
                    <div class="card">
                        <div class="card-body">
                            <div class="d-flex flex-column align-items-center text-center">
                                <img src="
                                

                                {{
                                
                                empty($getUser->photo)?url('upload/no_image.jpg'):
                                url('upload/vendor/'.$getUser->photo)
                                
                                
                                }}
                                
                                
                                " alt="Admin" class="rounded-circle p-1 bg-primary" width="110">
                                <div class="mt-3">
                                    <h4>{{$getUser->name}}</h4>
                                    <p class="text-secondary mb-1">{{$getUser->username}}</p>
                                    <p class="text-muted font-size-sm">{{$getUser->address}}</p>
                                    <button class="btn btn-primary">Follow</button>
                                    <button class="btn btn-outline-primary">Message</button>
                                </div>
                            </div>
                            <hr class="my-4" />
                            <ul class="list-group list-group-flush">
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap">
                                    <h6 class="mb-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-globe me-2 icon-inline"><circle cx="12" cy="12" r="10"></circle><line x1="2" y1="12" x2="22" y2="12"></line><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path></svg>Website</h6>
                                    <span class="text-secondary">https://codervent.com</span>
                                </li>
                           
                                <li class="list-group-item d-flex justify-content-between align-items-center flex-wrap">
                                    <h6 class="mb-0"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-facebook me-2 icon-inline text-primary"><path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path></svg>Facebook</h6>
                                    <span class="text-secondary">codervent</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-lg-8">
                    <div class="card">
                        <div class="card-body">
                            <form method="post" action="{{ route('vendor.profile.store') }}" enctype="multipart/form-data" >
                                @csrf
                    

                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">User name</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="text" name="username" class="form-control" value="{{$getUser->username}}"  readonly/>
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Full Name</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="text" name="name" class="form-control" value="{{$getUser->name}}" />
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Email</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="text" name="email" class="form-control" value="{{$getUser->email}}" />
                                </div>
                            </div>
                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Phone</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="text" name='phone' class="form-control" value="{{$getUser->phone}}" />
                                </div>
                            </div>
                            
                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Address</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="text"  name="address" class="form-control" value="{{$getUser->address}}" />
                                </div>
                            </div>


                            


                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Scince</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">


                                    <select name="vendor_join" class="form-select mb-3" aria-label="Default select example">
                                        <option  value="non"
                                        
                                        
                                        {{$getUser->vendor_join == "non" ? "selected" : "" }}
                                        >Open this select menu</option>
                                        <option value="2020" 
                                        {{$getUser->vendor_join == "2020" ? "selected" : "" }}
                                        >2020</option>
                                        <option value="2021"
                                        {{$getUser->vendor_join == "2021" ? "selected" : "" }}
                                        >2021</option>
                                        <option value="2022"
                                        {{$getUser->vendor_join == "2022" ? "selected" : "" }}
                                        >2022</option>
                                        <option value="2023"
                                        {{$getUser->vendor_join == "2023" ? "selected" : "" }}
                                        >2023</option>

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



                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">vendor info</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">

                                    <textarea  name="vendor_info" class="form-control" id="inputAddress" placeholder="Vendor Info" rows="3">{{$getUser->vendor_info}}</textarea>

                                </div>
                            </div>






                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0">Photo</h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                    <input id="image" name="photo" type="file" class="form-control"  />
                                </div>
                            </div>


                            <div class="row mb-3">
                                <div class="col-sm-3">
                                    <h6 class="mb-0"></h6>
                                </div>
                                <div class="col-sm-9 text-secondary">
                                   

                                    <img 
                                    id="showImage"
                                    src="
                                

                                    {{
                                    
                                    empty($getUser->photo)?url('upload/no_image.jpg'):
                                    url('upload/vendor/'.$getUser->photo)
                                    
                                    
                                    }}
                                    
                                    
                                    " alt="vendor"  width="110">


                                </div>
                            </div>

                            <div class="row">
                                <div class="col-sm-3"></div>
                                <div class="col-sm-9 text-secondary">
                                    <input type="submit" class="btn btn-primary px-4" value="Save Changes" />
                                </div>
                            </div>

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

<script type="text/javascript">
	$(document).ready(function(){
		$('#image').change(function(e){
			var reader = new FileReader();
			reader.onload = function(e){
				$('#showImage').attr('src',e.target.result);
			}
			reader.readAsDataURL(e.target.files['0']);
		});
	});
</script>



@endsection