@extends('layouts.app')
@section('title', 'Company')
@section('content')
<div class="container-fluid mt-1">
@include('settings.common_tabs')
<div class="col-lg-12">
	<div class="card shadow-lg">
		<div class="card-header card_header" >
			<h4 class="mt-2 ml-2"> Company Details</h4>
		</div></br>
		<div class="card-body p-0 ">
            <div class="d-flex flex-row-reverse bd-highlight ml-2" >
				<div class="text-right mx-4">
					<span class="edit_company_profile" style="cursor:pointer;"><i class="fa-solid fa-pen-to-square"></i>&nbsp; Edit</span>
                </div>
            </div>
			<div class="row mt-3 display_div mx-3">
				<div class="col-lg-12">
					<div class="card mb-4">
						<div class="card-body">
							<div class="row">
								<div class="col-sm-2">
									<p class="mb-0 mt-2"><b>Company Name</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted mb-0 mt-2"><b>{{$companyData->company_name}}</b></p>
								</div>
                                <div class="col-sm-2">
									<p class="mb-0 mt-2"><b>Email</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted mb-0 mt-2"><b>{{$companyData->email_id}}</b></p>
								</div>
							</div>
							<hr>
							<div class="row mt-1">
                                <div class="col-sm-2">
                                    <p class="mb-0"><b>Contact Number</b></p>
                                </div>
                                <div class="col-sm-4">
                                    <p class="text-muted mb-0">{{$companyData->contact_no}}</p>
                                </div>
                                <div class="col-sm-2">
									<p class="mb-0 mt-2"><b>Address</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted mb-0 mt-2"><b>{{$companyData->address}}</b></p>
								</div>
							</div>
							<hr>
							<div class="row mt-1">
                                <div class="col-sm-2">
									<p class="mb-0"><b>City</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted mb-0"><b>{{$companyData->city}}</b></p>
								</div>
                                <div class="col-sm-2">
									<p class="mb-0"><b>State</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted mb-0"><b>{{$companyData->state}}</b></p>
								</div>
							</div>
                            <hr>
							<div class="row mt-1">
                                <div class="col-sm-2">
                                    <p class="mb-0"><b>Zip</b></p>
                                </div>
                                <div class="col-sm-4">
                                    <p class="text-muted mb-0"><b>{{$companyData->zip}}</b></p>
                                </div>
                                <div class="col-sm-2">
									<p><b>Status</b></p>
								</div>
								<div class="col-sm-4">
									<p class="text-muted"><b>@if($companyData->is_active == 1) Active @else Inactive @endif</b></p>
								</div>
							</div>
                            <hr>
							<div class="row mt-1">
                                <div class="col-sm-2">
                                    <p class="mb-0"><b>Logo</b></p>
                                </div>
                                <div class="col-sm-4">
                                    @if(isset($companyData->logo))<img src="data:image;base64,{{base64_encode($companyData->logo)}}" style="width:20%;height:80%;opacity:1;">@endif
                                </div>
							</div>
						</div>
					</div>
				</div>
			</div>
            <div class="mt-3 edit_div d-none mx-3" >
                <form id="update_company_profile" method="POST" action="{{route('update_company_profile')}}" enctype="multipart/form-data" data-parsley-validate>
                    @csrf
                    <input type="hidden" name="id" value="{{$companyData->id}}">
                    <div class="row">
                        <div class="col-lg-12">	
                            <div class="card mb-4">	
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Company Name<span class="text-danger"> * <span></p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input id="company_name" name="company_name" type="text" class="form-control" autocomplete="off" placeholder="Enter Company Name" value="{{$companyData->company_name}}" required data-parsley-trigger="focusout" data-parsley-trigger="keyup" data-parsley-pattern="^[A-Za-z & . ]*$">
                                        </div>
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Email</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input id="email" name="email" type="email" class="form-control" value="{{$companyData->email_id}}" autocomplete="off" placeholder="Enter Email" >
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Contact Number</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input data-parsley-type="number" data-parsley-trigger="change" data-parsley-minlength="10" data-parsley-maxlength="15" value="{{$companyData->contact_no}}" id="contactno" name="contact_no" type="text" class="form-control" autocomplete="off" placeholder="Enter Contact Number" data-parsley-minlength-message="This value should have minimum 10 characters" data-parsley-maxlength-message="This value should have maximum 15 characters" >
                                        </div>
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Address</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input id="address" name="address" type="text" class="form-control" autocomplete="off" value="{{$companyData->address}}" placeholder="Enter Address" >
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">City</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input id="city" name="city" type="text" class="form-control" autocomplete="off" placeholder="Enter City" value="{{$companyData->city}}" data-parsley-trigger="focusout" data-parsley-trigger="keyup" data-parsley-pattern="^[A-Za-z ][A-Za-z ]*$">
                                        </div>
                                        <div class="col-sm-2 ">
                                            <p class="mb-0 mt-2">State</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input id="state" name="state" type="text" class="form-control" autocomplete="off" placeholder="Enter State" value="{{$companyData->state}}"  data-parsley-trigger="focusout" data-parsley-trigger="keyup" data-parsley-pattern="^[A-Za-z ][A-Za-z ]*$">
                                        </div>
                                    </div>
                                        <hr>
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Zip</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input data-parsley-type="integer" data-parsley-trigger="keyup" id="zipcode" name="zipcode" value="{{$companyData->zip}}" type="text" class="form-control" autocomplete="off" placeholder="Enter Zipcode" data-parsley-type-message ="This value should be a valid number">
                                        </div>
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Logo</p>
                                        </div>
                                        <div class="col-sm-3">
                                            <input type="file" name="photo" id="photo" class="form-control" data-height="250" data-parsley-trigger="keyup" accept=".jpg,.png,.svg" data-parsley-fileextension='jpg,png,svg,jpeg' data-parsley-errors-container="#startTimeErrorContainer" data-parsley-trigger="change">
                                        </div>
                                    </div>
                                    <hr>
                                    <div class="row">
                                        <div class="col-sm-2">
                                            <p class="mb-0 mt-2">Status</p>
                                        </div>
                                        <div class="col-sm-3 mt-2">
                                            <input id="isactive" name="isactive" type="checkbox" data-toggle="toggle" data-on="Yes" data-off="No" @if($companyData->is_active ==1) checked @endif> Is Active?</label>
                                        </div>	
                                    </div>		
                                </div>
                            </div>
                            <div class=" text-center mb-4">
                                <a href="{{ route('company') }}"><button type="button" class="btn btn-danger btn-sm cancel_btn">Cancel</button></a>
                                <button type="submit" class="btn btn-success btn-sm submit_btn">Update</button>
                            </div>	
				        </div>
                    </div>
				</form>
			</div>
		</div>
	</div>
</div>
</div>
<script type="text/javascript">
$(function () {
    @if(Session::has('success'))
    new PNotify({
    title: 'Success',
    text:  "{{Session::get('success')}}",
    type: 'success'
    });
            
    @endif
    @if ($errors->any())
        
        @foreach ($errors->all() as $error)
        
        new PNotify({
        title: 'Error',
        text:  "{{ $error }}",
        type: 'error'
        });
        @endforeach
        
    @endif
});

$(document).ready(function()
{
    var $tabid=  'tab3';
    $(".odtabs").not("#tab3").addClass('btn-outline-secondary');
    $("#tab3").addClass('btn-secondary');

    $(".edit_company_profile").click(function()
    {
        $(".display_div").addClass('d-none');
        $(".edit_div").removeClass('d-none');
        $(".edit_company_profile").addClass('d-none');
    });

    window.ParsleyValidator
        .addValidator('fileextension', function (value, requirement) {
            var tagslistarr = requirement.split(',');
            var fileExtension = value.split('.').pop();
            var arr=[];
            $.each(tagslistarr,function(i,val){
            arr.push(val);
            });
            if(jQuery.inArray(fileExtension, arr)!='-1') {
                return true;
            } else {
                return false;
            }
        }, 32)
        .addMessage('en', 'fileextension', 'The extension doesn\'t match the required');
        $("form").parsley();

        $('#update_company_profile').parsley();
        $('#update_company_profile').on('submit', function(event){
        event.preventDefault();
        if($('#update_company_profile').parsley().isValid())
        {
            var url = '{{ route("update_company_profile") }}';
            $.ajax({
                type: "post",
                url: url,
                data: new FormData($("#update_company_profile")[0]),
                processData: false,
                contentType: false,
                success: function(response) 
                {
                    if(response.data =='success')
                    {
                        new PNotify({
                            title: 'Success',
                            text:  response.msg,
                            type: 'success'
                            });
                            setTimeout(function(){  location.reload(); }, 1000);                    }
                    else
                    {
                        new PNotify({
                        title: 'Error',
                        text:  response.msg,
                        type: 'error',
                        delay: 1000
                        });
                    }
                    
                    
                },
                error: function(response) 
                {
                    var err = "";
                        $.each(response.responseJSON.errors,function(field_name,error){
                    
                    err = err +'<br>' + error;
                    });
                        new PNotify({
                        title: 'Error',
                        text:  err,
                        type: 'error',
                        delay: 1000
                    });
                },	
            });
        }
    });
});
</script>
@endsection