<x-app-layout>
    {{-- <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            {{ __('Dashboard') }}
        </h2>
    </x-slot> --}}


    <div class="py-4">
        <div class="container-fluid">
            @if ($errors->any())
                <div class="alert alert-danger">
                    <ul>
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif
            <div class="app-content content">
                <div class="details-wrapper">
                    <div class="content-detached content-right">
                    <div class="content-body">
                        <section id="configuration">
                             <div class="row">
                            <div class="col-12">
                            <nav aria-label="breadcrumb ">
                          <ol class="breadcrumb bg-white">
                            <li class="breadcrumb-item"><a href="{{ url('users/list/Active') }}">Users</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Edit</li>
                          </ol>
                        </nav>
                        </div></div>
                        <div class="row">
                            <div class="col-12">
                                <div class="card">
                                <form method="POST" action="{{ route('company.update',$user->id) }}" class="edit-form" id="editcompanies" enctype="multipart/form-data">
                                    @csrf
                                    @method('PUT')
                                        <div class="card-header">
                                            <h4 class="card-title">Edit User </h4>
                                            <button class="btn btn-primary" type="button" id="editcompaniesbutton" onclick="updateCompany();">Update </button>
                                        </div>

                                        <div class="card-body">
                                            <div class="form-content">
                                                <div class="row">
                                                    <div class="col-12">
                                                        <div class="row">

                                                            <div class="col-12">
                                                                <div class="company-header">
                                                                    <h6 class="card-title">Company Details</h6>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Name<span class="text-danger">*</span></label>
                                                                <input type="text" name="companyname" class="form-control" placeholder="" value="{{$user->companyname}}" required autofocus>
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Registration Type</label>
                                                                <select class="form-control" name="regtype" id="regtype" onchange="changeOther()">
                                                                    <option value="">--Select--</option>
                                                                    <option value="L"@if( $user->regtype == 'L' ) selected @endif >LLC</option>
                                                                    <option value="F"@if( $user->regtype == 'F' ) selected @endif>Free Zone</option>
                                                                    <option value="J"@if( $user->regtype == 'J' ) selected @endif>Joint Stock Company</option>
                                                                    <option value="LP"@if( $user->regtype == 'LP' ) selected @endif>Limited Partnership</option>
                                                                    <option value="B"@if( $user->regtype == 'B' ) selected @endif>Branch Office</option>
                                                                    <option value="R"@if( $user->regtype == 'R' ) selected @endif>Representative Office</option>
                                                                    <option value="G"@if( $user->regtype == 'G' ) selected @endif>Government Institution</option>
                                                                    <option value="O"@if( $user->regtype == 'O' ) selected @endif>Others</option>
                                                                </select>
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12" id="otherdiv" style="display:none">
                                                                <label class="control-label">Please specify</label>
                                                                <input type="text" name="other" class="form-control" placeholder="" value="{{$user->other}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Registration Number</label>
                                                                <input type="text" name="companyregno" class="form-control" placeholder="" value="{{$user->companyregno}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Years in Operation</label>
                                                                <input type="text" name="years" class="form-control" placeholder="" value="{{$user->years}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Number of Employees</label>
                                                                <select class="form-control" name="employeesno">
                                                                    <option value="">--Select--</option>
                                                                    <option value="1"@if( $user->employeesno == 1 ) selected @endif >1-100</option>
                                                                    <option value="2"@if( $user->employeesno == 2 ) selected @endif >101-500</option>
                                                                    <option value="3"@if( $user->employeesno == 3 ) selected @endif >501-1000</option>
                                                                    <option value="4"@if( $user->employeesno == 4 ) selected @endif >1000+</option>
                                                                </select>
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Website</label>
                                                                <input type="text" name="company_website" class="form-control" placeholder="" value="{{$user->company_website}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Email ID</label>
                                                                <input type="text" name="company_email" class="form-control" placeholder="" value="{{$user->company_email}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Company Contact Number</label>
                                                                <input type="text" name="company_number" class="form-control" placeholder="" value="{{$user->company_number}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office Address 1</label>
                                                                <input type="text" name="headoffice_address_1" class="form-control" placeholder="" value="{{$user->headoffice_address}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office Address 2</label>
                                                                <input type="text" name="headoffice_address_2" class="form-control" placeholder="" value="{{$user->headoffice_address_2}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office Address 3</label>
                                                                <input type="text" name="headoffice_address_3" class="form-control" placeholder="" value="{{$user->headoffice_address_3}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office City</label>
                                                                <input type="text" name="headoffice_city" class="form-control" placeholder="" value="{{$user->headoffice_city}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office State</label>
                                                                <input type="text" name="headoffice_state" class="form-control" placeholder="" value="{{$user->headoffice_state}}">
                                                            </div>
                                                            <div class="col-md-4 col-sm-6 col-12">
                                                                <label class="control-label">Head Office Country</label>
                                                                <input type="text" name="headoffice_country" class="form-control" placeholder="" value="{{$user->headoffice_country}}">
                                                            </div>

                                                            <!-- <div class="col-md-4 col-sm-6 col-12">
                                                                <div class="pt-0 pt-sm-5">
                                                                    <input type="checkbox" class="mr5" id="sendinvite" value="on">
                                                                    <label class="control-label pl-1 inviteLabel" for="sendinvite">Send Invitation</label>
                                                                </div>
                                                            </div> -->

                                                            <div class="offset-4"></div>
                                                            <div class="col-md-3">
                                                                <label class="control-label">Add Company logo</label>
                                                                <div class="upload-imgblock">
                                                                    <div class="upload-field">
                                                                        @if( $user->logo_path != '' )
                                                                            <img class="" id="logoimage" src="{{$user->logo_path}}">
                                                                        @else
                                                                            <img class="" id="logoimage" src="{!! asset('images/upload-img.png') !!}">
                                                                        @endif
                                                                        <div class="imgControls">
                                                                            <div class="position-relative uploadImg" id="upload-icon">
                                                                                <a href="{{ url('crop/logo')}}" name="upload-logo" id="upload-logo" data-toggle="modal"  class="aupload btn btn-upload">
                                                                                <span><i class='fas fa-upload'></i></span>
                                                                            </a>
                                                                            </div>
                                                                            <div class="remove-icon" id="removelogo" onclick="removeLogo()" style="display:none;">
                                                                                <i class="fas fa-times icon-img"></i>
                                                                            </div>
                                                                            @if($user->logo_path != '')
                                                                            <div class="remove-icon" onclick="removeLogo()" id="remove-logo">
                                                                                <i class="fas fa-times icon-img"></i>
                                                                            </div>
                                                                            @endif
                                                                        </div>

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

                                                        </div>
                                                        <span class="doc-up-note"><strong>Note:</strong> Please upload an image of size greater than <sab>150px X 150px</sab>. You can upload only  .jpg, png, jpeg files.</span>
                                                        <input type="hidden" id="templogo" name="templogo" value="">
                                                        <div class="row mt-5">
                                                            
                                                            <div class="col-12">
                                                                <div class="company-header">
                                                                    <h6 class="card-title">Company User Details</h6>
                                                                </div>
                                                            </div>

                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">First Name<span class="text-danger">*</span></label>
                                                                <input type="text" name="firstname" class="form-control" placeholder="" value="{{$user->firstname}}" required autofocus>
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Last Name<span class="text-danger">*</span></label>
                                                                <input type="text" name="lastname" class="form-control" placeholder="" value="{{$user->lastname}}" required autofocus>
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Email ID<span class="text-danger">*</span></label>
                                                                <input type="text" name="email" class="form-control" placeholder="" value="{{$user->email}}" required autofocus>
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Contact Number<span class="text-danger">*</span></label>
                                                                <input type="text" name="mobile_phone" class="form-control" placeholder="" value="{{$user->mobile_phone}}" required autofocus>
                                                            </div>
                                                             <div class="col-md-4 col-12">
                                                                <label class="control-label">User Type<span class="text-danger">*</span></label>
                                                                <select class="form-control" name="user_type" id="user_type" required autofocus>
                                                                     <option value="">--Select--</option>
                                                                     <option value="client" @if( $user->user_type == 'client' ) selected @endif>Client</option>
                                                                     <option value="contractor" @if( $user->user_type == 'contractor' ) selected @endif>Contractor</option>
                                                                     <option value="sub-contractor" @if( $user->user_type == 'sub-contractor') selected @endif>Sub-Contractor</option>  
                                                                </select>
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Designation<span class="text-danger">*</span></label>
                                                                <select class="form-control" name="company_role" id="company_role" onchange="changeOtherDes();" required autofocus>
                                                                    <option value="">--Select--</option>
                                                                    <option value="1" @if( $user->company_role_id == 1 ) selected @endif >Owner</option>
                                                                    <option value="2"@if( $user->company_role_id == 2 ) selected @endif>Board Member </option>
                                                                    <option value="3"@if( $user->company_role_id == 3 ) selected @endif>Consultant </option>
                                                                    <option value="4"@if( $user->company_role_id == 4 ) selected @endif>Manager </option>
                                                                    <option value="5"@if( $user->company_role_id == 5 ) selected @endif>Administrator </option>
                                                                    <option value="6"@if( $user->company_role_id == 6 ) selected @endif>Employee </option>
                                                                    <option value="7"@if( $user->company_role_id == 7 ) selected @endif>Other </option>option>
                                                                </select>
                                                            </div>
                                                            <div class="col-md-4 col-12" id="otherdesdiv" style="display:none">
                                                                <label class="control-label">Please specify</label>
                                                                <input type="text" name="otherdesignation" class="form-control" placeholder="" value="{{$user->otherdesignation}}">
                                                            </div>
                                                            <div class="col-md-4 col-12" id="locdiv" style="display:none">
                                                                <label class="control-label">Current Work Location</label>
                                                                <input type="text" name="work_location" class="form-control" placeholder="" value="{{$user->work_location}}">
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Department</label>
                                                                <input type="text" name="department" class="form-control" placeholder="" value="{{$user->department}}">
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Address</label>
                                                                <textarea name="address" class="form-control">{{$user->address}}</textarea>
                                                            </div>
                                                            <div class="col-md-4 col-12" >
                                                                <label class="control-label">City</label>
                                                                <input type="text" name="city" class="form-control" placeholder="" value="{{$user->city}}">
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">State</label>
                                                                <input type="text" name="state" class="form-control" placeholder="" value="{{$user->state}}">
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">Zip Code</label>
                                                                <input type="text" name="zip" class="form-control" placeholder="" value="{{$user->zip}}">
                                                            </div>
                                                            <div class="col-12 col-sm-6 col-md-4">
                                                                <div class="form-group">
                                                                    @if($user->password == '' )
                                                                    <div class="FL">
                                                                            <input type="checkbox" id="MaidenName" onclick="showHideControl()" name="chkname" />
                                                                            <label for="setpassword">Set Password</label>
                                                                    </div>

                                                                    <div>
                                                                        <input <?php if($user->isverified == '1'){ ?> style="display:none" <?php } ?> id="passwrdFld" disabled type="password" name="password" class="form-control frm1 pwdUpdate" value="" placeholder="Set Password">
                                                                        <a class="inside-btn editshow" style="top:35px" href="javascript:void(0)">Show</a>
                                                                    </div>
                                                                    @endif
                                                                </div>
                                                            </div>
                                                             <div class="col-12"></div>

                                                            <div class="col-md-3 col-sm-4 mt-3">
                                                                <label class="control-label">Add Profile Picture</label>
                                                                <div class="upload-imgblock">
                                                                    <div class="upload-field">
                                                                    @if( $user->image_path != '' )
                                                                        <img class="" src="{{$user->image_path}}" id="userimage">
                                                                    @else
                                                                        <img class="" id="userimage" src="{!! asset('images/userdefault.png') !!}">
                                                                    @endif
                                                                    <div class="imgControls">
                                                                        <div class="position-relative uploadImg" id="uploadimg">
                                                                            <a href="{{ url('crop/profile')}}" name="upload-img" id="upload-img" data-toggle="modal"  class="aupload btn btn-upload"> 
                                                                            <span><i class='fas fa-upload'></i></span>
                                                                        </a>
                                                                        </div>
                                                                        <div class="remove-icon" id="removeimg" onclick="removeImage()" style="display: none;">
                                                                            <i class="fas fa-times icon-img"></i>
                                                                        </div>
                                                                        @if($user->image_path != '')
                                                                        <div class="remove-icon" onclick="removeImage()" id="remove-img">
                                                                            <i class="fas fa-times icon-img"></i>
                                                                        </div>
                                                                        @endif
                                                                    </div>

                                                                    </div>
                                                                
                                                                </div>

                                                            </div>
                                                        </div>
                                                        <span class="doc-up-note"><strong>Note:</strong> Please upload an image of size greater than <sab>150px X 150px</sab>. You can upload only  .jpg, png, jpeg files.</span>
                                                        <input type="hidden" id="tempimage" name="tempimage" value="">
                                                        <div class="row mt-5">

                                                            <div class="col-12">
                                                                <div class="company-header">
                                                                    <h6 class="card-title">File Access Level</h6>
                                                                </div>
                                                            </div>
                                                            <div class="col-md-4 col-12">
                                                                <label class="control-label">File Access Level<span class="text-danger">*</span></label>
                                                                <select class="form-control" name="access_level" required autofocus>
                                                                    <option value="">--Select--</option>
                                                                    <option value="L" @if( $user->access_level == 'L' ) selected @endif >Low</option>
                                                                    <option value="M" @if( $user->access_level == 'M' ) selected @endif >Medium</option>
                                                                    <option value="H" @if( $user->access_level == 'H' ) selected @endif >High</option>
                                                                </select>
                                                            </div>
                                                            <input type="hidden" name="isremoveimage" id="isremoveimage" value="0">
                                                            <input type="hidden" name="isremovelogo" id="isremovelogo" value="0">
                                                        </div>
                                                        
                                                        <div class="DataNote mt-3 p-2">
                                                            <p>Note : Users will be added to the system via Front End Website registrations and also from the Admin panel.</p>
                                                            <ul>
                                                                <h6>From the Website Front End</h6>
                                                                <li>Users registers into the system.</li>
                                                                <li>Registered users will be displayed in the pending queue in the admin panel.</li>
                                                                <li>Admins can approve or reject the registered users.</li>
                                                                <li>On approval, an email intimation will be send to the registered user indicating that the account has been activated.</li>
                                                                <li>Users can then login to the system</li>
                                                            </ul>
                                                            <hr>
                                                            <ul>
                                                                <h6>From the Admin Panel</h6>
                                                                <li>Admins can create users into the system. These users will directly be listed in the Active list </li>
                                                                <li>They can create users via sent invitation or set password.</li>
                                                                <li>If the user is created via sent invitation, an account activation email will be sent to the users for activation.</li>
                                                            </ul>
                                                            <hr>
                                                            <ul>
                                                                <h6>File Access Level</h6>
                                                                <li>Low - Users will have access to Public files in the system</li>
                                                                <li>Medium - Users will have access to Public and Confidential files in the system</li>
                                                                <li>High - Users will have access to Public, Confidential and Highly Confidential files in the system</li>
                                                            </ul>
                                                        </div>

                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <!-- <div class="card-content collapse show">
                                            <div class="card-body card-dashboard">
                                                <div class="tab-content form-content" id="edit-tabcontent">

                                                    <div class="tab-pane fade" id="overview" role="tabpanel" aria-labelledby="overview-tab">
                                                    </div>		
                                                    
                                                    <div class="tab-pane fade active show" id="club-details" role="tabpanel" aria-labelledby="club-details-tab">
                                                        <div class="flex-rowblock">
                                                            <div class="left-flexbox">
                                                                <d
                                                            </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div> -->
                                    </form>
                                </div>
                            </div>
                        </div>
                    </section>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
    $(document).ready(function () {
              $(".inside-btn").click(function(){
          if( $("#passwrdFld").attr('type') == 'password' ){
              $("#passwrdFld").attr('type','text');
              $(this).html('Hide');
          }else{
              $("#passwrdFld").attr('type','password');
              $(this).html('Show');
          }
        });
        $(".aupload").colorbox({
            iframe: true,
            width: "650px",
            height: "650px"
        });
        <?php if($user->image_path != '') { ?>
               $("#uploadimg").hide();
            <?php } ?> 
            <?php if($user->logo_path != '') { ?>
               $("#upload-icon").hide();
            <?php } ?> 
            $('#editcompanies').validate({
            rules : {
                firstname : 'required',
                lastname : 'required',
                companyname: 'required',
                email: {
                    required : true,
                    email: true,
                 },
                password  : 'required',
                mobile_phone :  {
                    required :true,
                    number : true,
                },
                company_role : 'required',
                access_level : 'required',
                user_type : 'required',
                 password : {
                    required:"#MaidenName:checked",
                      // minlength: 6
                },
            },
            messages : {
                firstname :'Please enter first name.',
                lastname :'Please enter last name.',
                companyname: 'Please enter company name.',
                email: {
                    required : 'Please enter email.',
                    email: 'Please enter valid email.'
                },
                password: 'Please enter password.',
                mobile_phone : {
                    required : 'Please enter contact number.',
                    number : 'Please enter a valid phone number.'
                },
                company_role: 'Please select designation.',
                user_type : 'Please select user type.',
            }
               
            });
            $(document).on('change','#upload-img',function(event){
                var ext = $('#upload-img').val().split('.').pop().toLowerCase();
                if($.inArray(ext, ['gif','png','jpg','jpeg']) == -1) {
                    alert('Upload a JPG/GIF/PNG image with a dimension of 1600 x 400px (Width/Height).');
                }else{
                    var _URL = window.URL || window.webkitURL;
                    var file, img;
                if ((file = this.files[0])) {
                    img = new Image();
                    var fileExtension = ['jpeg', 'jpg', 'png', 'gif'];
                    img.onload = function () {
                    var w = this.width ;
                    var h = this.height ;
                    var tmppath = URL.createObjectURL(event.target.files[0]);
                    $("#userimage").attr("src",tmppath);
                    $("#removeimg").show();
                    $("#uploadimg").hide();

                };
                img.src = _URL.createObjectURL(file);
                }
                }
            });
            $(document).on('change','#upload-logo',function(event){
                var ext = $('#upload-logo').val().split('.').pop().toLowerCase();
                if($.inArray(ext, ['gif','png','jpg','jpeg']) == -1) {
                    alert('Upload a JPG/GIF/PNG image with a dimension of 1600 x 400px (Width/Height).');
                }else{
                    var _URL = window.URL || window.webkitURL;
                    var file, img;
                if ((file = this.files[0])) {
                    img = new Image();
                    var fileExtension = ['jpeg', 'jpg', 'png', 'gif'];
                    img.onload = function () {
                    var w = this.width ;
                    var h = this.height ;
                    var tmppath = URL.createObjectURL(event.target.files[0]);
                    $("#logoimage").attr("src",tmppath);
                    $("#removelogo").show();
                    $("#upload-icon").hide();

                };
                img.src = _URL.createObjectURL(file);
                }
                }
            });
    });
    function showHideControl(){
       // $('#passwrdFld').toggle();

        if($("#MaidenName").prop('checked') == false){
        $('#passwrdFld').prop("disabled", true);
        $('label[for=passwrdFld]').remove();
        $('#passwrdFld').removeClass("error");
        $('#passwrdFld').val("");
        }else{
        $('#passwrdFld').prop("disabled", false);
        }
    }
    function updateCompany(){
         if($("#editcompanies").valid()){
            $("#editcompaniesbutton").prop('disabled',true);
            $("#editcompanies").submit();
         }else{
            setTimeout(function(){
                $('html, body').animate({
                    scrollTop: ($('.error:visible').first().offset().top - 100)
            }, 500);
            //$('.error:visible').first().focus();
            },500);
         }
        }
        function changeOther(){
            $("#otherdiv").hide();
            if($("#regtype").val() == 'O'){
                $("#otherdiv").show();
            }
        }
        function changeOtherDes(){
            $("#otherdesdiv").hide();
            $("#locdiv").hide();
            if($("#company_role").val() == '7'){
                $("#otherdesdiv").show();
            }
            if($("#company_role").val() == '5'){
                $("#locdiv").show();
            }
        }
        function removeImage(){
            if(confirm('Are you sure you want to delete this image?'))
            {
                $("#userimage").attr("src","{{asset('images/userdefault.png')}}");
                $("#isremoveimage").val('1');
                $("#removeimg").hide();
                $("#remove-img").hide();
                $("#uploadimg").show();
                $("#upload-img").show();
            }
        }
        function removeLogo(){
            if(confirm('Are you sure you want to delete this image?'))
            {
                $("#logoimage").attr("src","{{asset('images/upload-img.png')}}");
                $("#isremovelogo").val('1');
                $("#removelogo").hide();
                $("#remove-logo").hide();
                $("#upload-icon").show();
                $("#upload-logo").show();
            }
        }
        function profileImage(imagekey,imagePath){
            $("#tempimage").val(imagekey);
            $("#userimage").attr("src",imagePath);
            $("#userimage").show();
            $("#upload-img").hide();
            $("#removeimg").show();
        }
        function logoImage(imagekey,imagePath){
            $("#templogo").val(imagekey);
            $("#logoimage").attr("src",imagePath);
            $("#logoimage").show();
            $("#upload-logo").hide();
            $("#removelogo").show();
            $("#remove-logo").show();
        }
        </script>
</x-app-layout>