@extends('layouts.web')
@section('content')
<nav class="navbar navbar-default navbar-fixed-top stuck">
  <div class="container">
      @include('include.navbar')
    </div>
</nav>
<div class="navbar-fixed-padding-top">
@include('include.subnavbar')
  <div class="container">
  		@include('partials.alerts')
    	<div class="breadcrumb-block">
   			<h3><strong>Contracts</strong></h3>
        </div>
        <div class="" id="bidding-list">   
          <form>
            <!--<table class="table vmiddle">
              <thead>
                <th>Property</th>
                <th>Property Address</th>
                <th>Tenant Name</th>    
                <th>Propose Rent</th>
                <th>Move-In Date</th>
                <th>Tenant Note </th>  
                <th>Landlord Note</th>
                <th>Bid Status</th>    
                <th>Action</th>                
              </thead>-->
              <div class="row tenant-contract-list"> 
                @foreach($bidding_list as $bid)
                <div class="col-md-6">
                    <div class="white-box white-box-shadow pos-rel">
                    <h3 class="mt-0 mb-0"><a href="{{ url('/properties/detail/'.base64_encode($bid->property->id)) }}"><strong>{{ $bid->property->name }}</strong></a></h3>
                    <p class="text-muted">{{ $bid->property->address }}</p>
                    <p><a href="javascript:void(0);" data-toggle="modal" data-title-deed="{{ $bid->property->title_deed }}" data-target="#titleDeedModal" class="title_deed"><i class="fa fa-file-text"></i> Property Title Deed</a></p>
                    <hr/>
                    <div class="row">
                    	<div class="col-sm-12">
                        	<h5 class="mt-0"><strong>Tenant Details</strong></h5>
                            <div class="row">
                    		<div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Name</label>
                                <p class="text-capitalize">
                                	<a href="#viewDetails" class="viewDetails"
                                    data-toggle="modal" data-id="{{ $bid->id }}"
                                    data-tenant="{{ $bid['tenant']['firstname'] }} {{ $bid['tenant']['lastname'] }}"
                                    data-email="{{ $bid['tenant']['email'] }}" data-address="{{ $bid['tenant']['address'] }}"
                                    data-code="{{ $bid['tenant']['country_code'] }}" data-mobile="{{ $bid['tenant']['mobile'] }}" 
                                    data-empstatus="{{ $bid['employmentstatus']['name'] }}">
                                    {{ $bid->tenant->firstname.' '.$bid->tenant->lastname }}
                                    </a>
                                </p>
                            </div>
                            </div>
                            <div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Propose Rent</label>
                                <p>{{ number_format($bid->propose_rent,2) }}</p>
                            </div>
                            </div>
                            <div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Move-In Date</label>
                                <p>{{ date("j F, Y", strtotime($bid->move_in_date)) }}</p>
                            </div>
                            </div>
                            <!-- <div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Note</label>
                                <p><a href="#tenantNote" data-toggle="modal" class="tnote" data-tnote="{{ $bid->tenant_note }}"><i class="fa fa-file-text"></i> Click to view</a></p>
                            </div>
                            </div> -->
                            </div>
                        </div>
                    </div>
                    <hr/>
                    <div class="row">
                    	<div class="col-sm-12">
                            <div class="row">
                    		<div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Bid Status</label>
                                <p>{{ $bid->bidstatus->name }}&nbsp; 
                                @if($bid->bid_status_id != '54')
                          <!-- <a href="#bidStatus" data-toggle="modal" class="bidstatus" data-bid-id="{{ $bid->id }}" data-property-name="{{ $bid->property->name }}" data-tenant-id="{{ $bid->tenant_id }}" data-bid-status-id="{{ $bid->bid_status_id }}"><i class="fa fa-edit"></i></a> -->
                        @endif
                                </p>
                            </div>
                           	</div>
                            <!-- <div class="col-sm-6">
                            <div class="form-group">
                            	<label class="text-muted">Note</label>
                                <p><a href="#landlordNote" data-toggle="modal" class="lnote" data-lnote="{{ $bid->landlord_note }}"><i class="fa fa-file-text"></i> Click to view</a></p>
                            </div>
                            </div> -->

                            <div class="col-sm-6">
                            <div class="form-group">
                              <label class="text-muted">Tenancy Contract Starting Date</label>
                                <p>@if(!empty($bid->tenancy_contract_starting_date)) {{ date("j F, Y", strtotime($bid->tenancy_contract_starting_date)) }} @endif</p>
                            </div>
                            </div>

                            <div class="col-sm-6">
                            <div class="form-group">
                              <label class="text-muted">Tenancy Contract End Date</label>
                                <p>@if(!empty($bid->tenancy_contract_end_date)) {{ date("j F, Y", strtotime($bid->tenancy_contract_end_date)) }} @endif</p>
                            </div>
                            </div>
                            
                            </div>
                        </div>
                    </div>
                        <div class="text-center">
                            <div class="visible-xs pt-5">&nbsp;</div>
                            <!-- @if($bid->bid_status_id == '54')
                                <a href="{{ url('/').'/'.$bid->contract['path'] }}" class="contract btn btn-purple app-edit-bid" target="_blank">View Contract</a>
                            @else
                                <a href="#contractModal" class="contract btn btn-purple app-edit-bid" role="button" data-toggle="modal" 
                                data-id="{{ $bid->id }}" data-property="{{ $bid->property->name}}" data-landlord="{{ $bid->property->landlord_id }}" data-tenant="{{ $bid->tenant_id }}" data-property-id="{{ $bid->property_id }}">Add Contract</a>
                            @endif -->
							@if($bid->bid_status_id == '51')
							<a href="{{ route('add_contract',[base64_encode($bid->id)]) }}" class="contract btn btn-purple app-edit-bid">Add Contract</a>
							@elseif($bid->bid_status_id == '53' || $bid->bid_status_id == '54' || $bid->bid_status_id == '64')
							<a href="{{ route('view_contract',[base64_encode($bid->id)]) }}" class="contract btn btn-purple app-edit-bid">View Contract</a>
							@endif
							
							
							
							
                        </div>
                    </div>
                </div>
                @endforeach
              </div>
          </form>
        </div>
        {{ $bidding_list->links() }}
  </div>
</div>

<!-- Modal -->
    <div class="modal fade" id="titleDeedModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="myModalLabel">Property Title Deed</h4>
          </div>
          <div class="modal-body">
            <embed src="" width="100%" height="400px" id="title_deed"/>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          </div>
        </div>
      </div>
    </div>

<div class="modal fade" id="contractModal">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Upload contract</h4>
      </div>
      {{ Form::open(['url' => 'contracts/store', 'method'=>'post', 'id'=>'uploadcontract', 'enctype' => 'multipart/form-data']) }}
      <div class="modal-body text-center">
        <input type="hidden" id="bidding_id" name="bid_id" value="">
        <input type="hidden" id="property_id" name="property_id" value="">
        <input type="hidden" id="landlord_id" name="landlord_id" value="">
        <input type="hidden" id="tenant_id" name="tenant_id" value="">
        <p><strong>When you upload the contract, a notification will be sent to the Tenant</strong></p>
        <div class="text-center pt-15">
        <input type="file" name="document" style="margin:auto;" />
        </div>
        <div class="text-muted"><small>File size should not be more than 2 MB. Valid type .doc, .pdf, .docx</small></div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
        <button type="Submit" class="btn btn-purple">Submit</button>
      </div>
      {{ Form::close() }}
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal --> 

<!-- Modal for View Details -->
<div class="modal fade" id="viewDetails">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Tenant Details</h4>
      </div>
      <div class="modal-body">
    	<div class="row">
        	<div class="col-sm-6">
            	<label class="mb-0 text-muted">Name</label>
                <p id="name" class="text-capitalize"></p>
            </div>
            <div class="col-sm-6">
            	<label class="mb-0 text-muted">Email</label>
                <p id="email"></p>
            </div>
        </div>
        <div class="row">
        	<div class="col-sm-6">
            	<label class="mb-0 text-muted">Mobile</label>
                <p id="mob"></p>
            </div>
            <div class="col-sm-6">
            	<label class="mb-0 text-muted">Employment Status</label>
                <p id="empstat"></p>
            </div>
        </div>
        <div class="row">
        	<div class="col-sm-12">
            	<label class="mb-0 text-muted">Address</label>
                <p id="address"></p>
            </div>
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>

    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal --> 

<!-- For showing Tenant Note -->
<div class="modal fade" id="tenantNote">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Tenant Note</h4>
      </div>
      {{ Form::open() }}
      <div class="modal-body">
        <p id="tnote"></p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
      {{ Form::close() }}
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal --> 

<!-- For showing Landlord Note -->
<div class="modal fade" id="landlordNote">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Landlord Note</h4>
      </div>
      {{ Form::open() }}
      <div class="modal-body text-center">
        <p id="lnote"></p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
      {{ Form::close() }}
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal --> 

<!-- For updating bid status -->
<div class="modal fade" id="bidStatus">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Bid Status</h4>
      </div>
      {{ Form::open(['url' => 'contracts/bidupdate', 'method'=>'post']) }}
      <div class="modal-body text-center">
        <select name="bid_status_id" id="bid_status_id" required class="form-control" style="height:auto;">
          <option value="">Select</option>
          <option value="53">Contract Inprogress</option>
          <option value="52">Pending Documents</option>
        </select>
        <input type="hidden" id="bid_id" name="bid_id">
        <input type="hidden" id="propertyname" name="property_name">
        <input type="hidden" id="tenant" name="tenant_id">
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="submit" class="btn btn-purple">Submit</button>
      </div>
      {{ Form::close() }}
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal --> 


  @include('include.footer')
    @include('include.scripts')
<script>
  $(function () {   
        $(document).on('click', '.title_deed', function(){
            var title_deed = $(this).data('title-deed');
            title_deed_url = APPURL+'/'+title_deed ;
            $('#title_deed').prop('src',title_deed_url);
        });
    });

    $(function () {   
        $(document).on('click', '.contract', function(){
            var bid_id = $(this).data('id');
            var property_name = $(this).data('property');
            $('.propertyname').text(property_name);
            $('#bidding_id').val(bid_id);
            $('#property_id').val($(this).data('property-id'));
            $('#landlord_id').val($(this).data('landlord'));
            $('#tenant_id').val($(this).data('tenant'));
        });
    });
   
    $(document).on('click', '.viewDetails', function(){
        var code = $(this).data('code');
        var mob = $(this).data('mobile');
        $('#name').text($(this).data('tenant'));
        $('#email').text($(this).data('email'));
        $('#address').text($(this).data('address'));
        $('#mob').text(code + "-" + mob);
        $('#empstat').text($(this).data('empstatus'));
    });

    $(document).on('click', '.tnote', function(){
        $('#tnote').text($(this).data('tnote'));
    });

    $(document).on('click', '.lnote', function(){
        $('#lnote').text($(this).data('lnote'));
    });

    $(document).on('click', '.bidstatus', function(){
      $('#propertyname').val($(this).data('property-name'));
      $('#tenant').val($(this).data('tenant-id'));
      $('#bid_id').val($(this).data('bid-id'));
      $('#bid_status_id').val($(this).data('bid-status-id'));
    });
</script>
<script>
$.validator.addMethod('filesize', function (value, element, param) {
    return this.optional(element) || (element.files[0].size <= param)
}, 'File size must be less than 2 MB');

$("#uploadcontract").validate({
	rules: {
		document: {
			required: true,
			extension: "doc,docx,pdf",
            filesize : 2097152
		}
	},
	messages: {
		document: {
			required: "Required"
		}
	}
});
</script>
@endsection