@extends('layouts.admin')

@section('content')
@php $readonly=''; @endphp
@if($action=='View')
@php $readonly='readonly'; @endphp
@endif
<style>
  .image-container {
    width: 100px;
    height: 100px;
    border: 1px solid #ccc;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .image-container img {
    max-width: 100%;
    max-height: 100%;
  }
</style>
<div class="page-links">
  <a href="{{ route('dashboard') }}">Dashboard</a>
  <span> > </span>
  <a href="{{ route('vendors.index') }}">Vendors</a>
</div>
<div class="row">
  <div class="col-xxl-10 col-md-12  col-12 mb-5">
    @if($action == 'Edit')
    <form class="form-data" id="edit_form" method="POST" action="{{ route('vendors.update', [$record->id]) }}" enctype="multipart/form-data">
      {{ method_field('PUT') }}
      @else
      <form class="form-data" method="POST" id="add_form" action="{{ route('vendors.store') }}" enctype="multipart/form-data">
        @endif
        @csrf
        <!-- basic information -->
        <div class="card-main">
          <div class="tabs-main">
            <ul class="nav nav-tabs d-none d-lg-flex" id="myTab" role="tablist">
              <li class="nav-item" role="presentation">
                <button class="nav-link form-tabs active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home-tab-pane" type="button" role="tab" aria-controls="home-tab-pane" aria-selected="true">Vendor Details</button>
              </li>
              <li class="nav-item" role="presentation">
                <button class="nav-link form-tabs" id="profile-tab" data-bs-toggle="tab" data-bs-target="#profile-tab-pane" type="button" role="tab" aria-controls="profile-tab-pane" aria-selected="false">Contact Information</button>
              </li>
              <li class="nav-item" role="presentation">
                <button class="nav-link form-tabs" id="account-tab" data-bs-toggle="tab" data-bs-target="#account-tab-pane" type="button" role="tab" aria-controls="account-tab-pane" aria-selected="false">Account Information</button>
              </li>
            </ul>
            <div class="tab-content" id="myTabContent">
              <div class="tab-pane fade show active accordion-item" id="home-tab-pane" role="tabpanel" aria-labelledby="home-tab" tabindex="0">

                <h2 class=" d-lg-none" id="headingOne">
                  <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">Customer Details</button>
                </h2>
                <div id="collapseOne" class="accordion-collapse collapse show  d-lg-block" aria-labelledby="headingOne" data-bs-parent="#myTabContent">
                  <div class="accordion-body">
                    <div class="customer-details-form form-fld">
                      <div class="row">
                        <div class="col-md-4 col-12 mb-3">
                          <label>Name <small class="red">* </small></label>
                          @if(old('name'))
                          @php $name = old('name'); @endphp
                          @elseif(isset($record->name) && $record->name != '')
                          @php $name = $record->name; @endphp
                          @else
                          @php $name = ''; @endphp
                          @endif
                          <input type="text" id="name" name="name" value="{{ $name }}" class="form-control @error('name') is-invalid @enderror" placeholder="Enter Name" {{$readonly}}>
                          @error('name')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Nick Name <small class="red">* </small></label>
                          @if(old('nick_name'))
                          @php $nick_name = old('nick_name'); @endphp
                          @elseif(isset($record->nick_name) && $record->nick_name != '')
                          @php $nick_name = $record->nick_name; @endphp
                          @else
                          @php $nick_name = ''; @endphp
                          @endif
                          <input type="text" id="nick_name" name="nick_name" value="{{ $nick_name }}" class="form-control @error('nick_name') is-invalid @enderror" placeholder="Enter Nick Name" {{$readonly}}>
                          @error('nick_name')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Email <small class="red">* </small></label>
                          @if(old('email'))
                          @php $email = old('email'); @endphp
                          @elseif(isset($record->email) && $record->email != '')
                          @php $email = $record->email; @endphp
                          @else
                          @php $email = ''; @endphp
                          @endif
                          <input type="email" id="email" name="email" value="{{ $email }}" class="form-control @error('email') is-invalid @enderror" placeholder="Enter Email" {{$readonly}}>
                          @error('email')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Website </label>
                          @if(old('website'))
                          @php $website = old('website'); @endphp
                          @elseif(isset($record->website) && $record->website != '')
                          @php $website = $record->website; @endphp
                          @else
                          @php $website = ''; @endphp
                          @endif
                          <input type="text" id="website" name="website" value="{{ $website }}" class="form-control @error('website') is-invalid @enderror" placeholder="Enter Website" {{$readonly}}>
                          @error('website')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Phone No </label>
                          @if(old('phone'))
                          @php $phone = old('phone'); @endphp
                          @elseif(isset($record->phone) && $record->phone != '')
                          @php $phone = $record->phone; @endphp
                          @else
                          @php $phone = ''; @endphp
                          @endif
                          <input type="text" id="phone" name="phone" value="{{ $phone }}" class="form-control @error('phone') is-invalid @enderror" placeholder="Enter Phone Number" {{$readonly}}>
                          @error('phone')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Alternate Phone No </label>
                          @if(old('alternate_phone'))
                          @php $alternate_phone = old('alternate_phone'); @endphp
                          @elseif(isset($record->alternate_phone) && $record->alternate_phone != '')
                          @php $alternate_phone = $record->alternate_phone; @endphp
                          @else
                          @php $alternate_phone = ''; @endphp
                          @endif
                          <input type="text" id="alternate_phone" name="alternate_phone" value="{{ $alternate_phone }}" class="form-control @error('alternate_phone') is-invalid @enderror" placeholder="Enter Alternate Phone Number" {{$readonly}}>
                          @error('alternate_phone')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>


                        <div class="col-md-4 col-12 mb-3">
                          <label>Country </label>
                          @if(old('country_id'))
                          @php $country_id = old('country_id'); @endphp
                          @elseif(isset($record->country_id) && $record->country_id != '')
                          @php $country_id = $record->country_id; @endphp
                          @else
                          @php $country_id = ''; @endphp
                          @endif
                          <select id="country_id" name="country_id" class="form-control">
                            <option value="" disabled>Select</option>
                            @foreach($countries as $country)
                            <option value="{{$country->id}}" {!! ($country->id==$country_id) ? 'selected' : '' !!}>{{$country->name}}</option>
                            @endforeach
                          </select>
                          @error('country_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>State </label>
                          @if(old('state_id'))
                          @php $state_id = old('state_id'); @endphp
                          @elseif(isset($record->state_id) && $record->state_id != '')
                          @php $state_id = $record->state_id; @endphp
                          @else
                          @php $state_id = ''; @endphp
                          @endif
                          <select id="state_id" name="state_id" class="form-control">
                            <option value="" disabled>Select</option>
                            @foreach($states as $state)
                            <option value="{{$state->id}}" {!! ($state->id==$state_id) ? 'selected' : '' !!}>{{$state->name}}</option>
                            @endforeach
                          </select>
                          @error('state_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>City </label>
                          @if(old('city_id'))
                          @php $city_id = old('city_id'); @endphp
                          @elseif(isset($record->city_id) && $record->city_id != '')
                          @php $city_id = $record->city_id; @endphp
                          @else
                          @php $city_id = ''; @endphp
                          @endif
                          <select id="city_id" name="city_id" class="form-control">
                            <option value="" disabled>Select</option>
                            @foreach($cities as $city)
                            <option value="{{$city->id}}" {!! ($city->id==$city_id) ? 'selected' : '' !!}>{{$city->name}}</option>
                            @endforeach
                          </select>
                          @error('city_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Address </label>
                          @if(old('address'))
                          @php $address = old('address'); @endphp
                          @elseif(isset($record->address) && $record->address != '')
                          @php $address = $record->address; @endphp
                          @else
                          @php $address = ''; @endphp
                          @endif
                          <textarea id="address" name="address" class="form-control @error('alternate_phone') is-invalid @enderror">{!! $address !!}</textarea>
                          @error('address')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Zipcode </label>
                          @if(old('zipcode'))
                          @php $zipcode = old('zipcode'); @endphp
                          @elseif(isset($record->zipcode) && $record->zipcode != '')
                          @php $zipcode = $record->zipcode; @endphp
                          @else
                          @php $zipcode = ''; @endphp
                          @endif
                          <input type="text" id="zipcode" name="zipcode" value="{{ $zipcode }}" class="form-control @error('zipcode') is-invalid @enderror" placeholder="Enter Zipcode" {{$readonly}}>
                          @error('zipcode')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Currency </label>
                          @if(old('currency_id'))
                          @php $currency_id = old('currency_id'); @endphp
                          @elseif(isset($record->currency_id) && $record->currency_id != '')
                          @php $currency_id = $record->currency_id; @endphp
                          @else
                          @php $currency_id = ''; @endphp
                          @endif
                          <select id="currency_id" name="currency_id" class="form-control">
                            <option value="" disabled>Select</option>
                            @foreach($currencies as $currency)
                            <option value="{{$currency->id}}" {!! ($currency_id==$currency->id) ? 'selected' : '' !!}>{{$currency->name}}</option>
                            @endforeach
                          </select>
                          @error('currency_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Payment Terms </label>
                          @if(old('payment_term_id'))
                          @php $payment_term_id = old('payment_term_id'); @endphp
                          @elseif(isset($record->payment_term_id) && $record->payment_term_id != '')
                          @php $payment_term_id = $record->payment_term_id; @endphp
                          @else
                          @php $payment_term_id = ''; @endphp
                          @endif
                          <select id="payment_term_id" name="payment_term_id" class="form-control">
                            <option value=0>Select</option>
                            @foreach($paymentTerms as $term)
                            <option value="{{$term->id}}" {!! ($payment_term_id==$term->id) ? 'selected' : '' !!}>{{$term->term}}</option>
                            @endforeach
                          </select>
                          @error('payment_term_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>Shipping Methods </label>
                          @if(old('shipping_method_ids'))
                          @php $shipping_method_ids = old('shipping_method_ids'); @endphp
                          @elseif(isset($record->shipping_method_ids) && $record->shipping_method_ids != '')
                          @php $shipping_method_ids = $record->shipping_method_ids; @endphp
                          @else
                          @php $shipping_method_ids = ''; @endphp
                          @endif
                          <select id="shipping_method_ids" name="shipping_method_ids[]" class="form-control" multiple>
                            <option value="" disabled>Select</option>
                            @foreach($shippingMethods as $method)
                            <option value="{{$method->id}}">{{$method->carrier .'-'. $method->service }}</option>
                            @endforeach
                          </select>
                          @error('shipping_method_ids')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          <label>VChat Id </label>
                          @if(old('vchat_id'))
                          @php $vchat_id = old('vchat_id'); @endphp
                          @elseif(isset($record->vchat_id) && $record->vchat_id != '')
                          @php $vchat_id = $record->vchat_id; @endphp
                          @else
                          @php $vchat_id = ''; @endphp
                          @endif
                          <input type="text" id="vchat_id" name="vchat_id" value="{{ $vchat_id }}" class="form-control @error('vchat_id') is-invalid @enderror" placeholder="Enter Vchat Id" {{$readonly}}>
                          @error('vchat_id')
                          <span class="error">{{ $message }}</span>
                          @enderror
                        </div>

                        <div class="col-md-4 col-12 mb-3">
                          @if(isset($record->active))
                          @php $active = $record->active; @endphp
                          @else
                          @php $active = 1; @endphp
                          @endif
                          <label for="name" class="control-label"> Active</label>
                          <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" role="switch" name="active" id="flexSwitchCheckChecked"  value=1>
                          </div>
                        </div>


                      </div>
                      <!-- <div class="row">
                        <div class="col-12">
                          <div class="float-end">
                            <button type="button" class="btn btn-light bg-color20 color0 border-0  float-end save-draft">Save</button>
                            <button type="button" class="btn btn-light me-2 float-end save-draft ">Save and Create Contact</button>
                          </div>
                        </div>
                      </div> -->
                    </div>
                  </div>
                </div>

              </div>
              <div class="tab-pane fade accordion-item" id="profile-tab-pane" role="tabpanel" aria-labelledby="profile-tab" tabindex="0">
                <h2 class="d-lg-none" id="headingTwo">
                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
                    Contact Information
                  </button>
                </h2>
                <div id="collapseTwo" class="accordion-collapse collapse d-lg-block" aria-labelledby="headingTwo" data-bs-parent="#myTabContent">
                  <div class="accordion-body">
                    <div class="row">
                      <!-- <div class="row">
                      <div class="col-8">
                        <h2 class="iheading-man border-0">Contact Information</h2>
                      </div>
                      <div class="col-4 text-end">
                        <button class="btn btn-info text-light" type="button" id="addMoreContactInfo"><i class="fa fa-plus"></i> Add More</button>
                      </div>
                      <hr />
                    </div> -->
                      <div class="col-12">
                      <div id="contactInfo">

                        @if(isset($record->contacts) && $record->contacts->count()>0)
                        @foreach($record->contacts as $contact)

                        @include('vendor.contact-info',['contact'=>$contact])
                        @endforeach
                        @else
                        @include('vendor.contact-info')
                        @endif
                      </div>
                      </div>

                      <div class="col-12 text-end">
                        <button class="btn btn-info text-light" type="button" id="addMoreContactInfo"><i class="fa fa-plus"></i> Add More</button>
                      </div>
                    </div>
                  </div>
                </div>
              </div>

              <div class="tab-pane fade accordion-item" id="account-tab-pane" role="tabpanel" aria-labelledby="account-tab" tabindex="0">
                <h2 class="d-lg-none" id="headingThree">
                  <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
                  Account Information
                  </button>
                </h2>
                <div id="collapseThree" class="accordion-collapse collapse d-lg-block" aria-labelledby="headingThree" data-bs-parent="#myTabContent">
                  <div class="accordion-body">

                    <div class="row">
                    <div class="col-12">
                      <!-- <div class="col-8">
                        <h2 class="iheading-man border-0">Account Information</h2>
                      </div>
                      <div class="col-4 text-end">
                        <button class="btn btn-info text-light" type="button" id="addMoreAccountInfo"><i class="fa fa-plus"></i> Add More</button>
                      </div>
                      <hr />
                    </div> -->
                    <div id="accountInfo">
                      @if(isset($record->bank_accounts) && $record->bank_accounts->count()>0)
                      @foreach($record->bank_accounts as $bank_accounts)

                      @include('vendor.account-info',['record'=>$bank_accounts])
                      @endforeach
                      @else
                      @include('vendor.account-info')
                      @endif
                    </div>
                    </div>
                    <div class="col-12 text-end">
                        <button class="btn btn-info text-light" type="button" id="addMoreAccountInfo"><i class="fa fa-plus"></i> Add More</button>
                      </div>
                  </div>
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>
        <!-- end basic information -->
        <!-- new-card -->
        <div class="fix-button-main">
          <div class="save-fix">
            <div class="float-end">
              @if($action!='View')
              <button type="submit" class="btn save-b me-3" type="button">
                Save
              </button>
              @endif
              <a type="button" class="btn btn-light me-2 float-end save-draft" href="{{ route('colors.index') }}"> {!! ($action!='View') ? 'Cancel' : 'Back' !!}</a>
            </div>
          </div>
        </div>
      </form>
  </div>
</div>
@endsection
@push('scripts')
<script>
  $(document).ready(function() {
    // select countries
    $("#country_id").select2({
      ajax: {
        url: "{{ route('getCountries') }}",
        type: "get",
        dataType: 'json',
        delay: 250,
        data: function(params) {
          return {
            searchTerm: params.term // search term

          };
        },
        processResults: function(response) {
          return {
            results: response

          };
        },
        cache: true
      }
    });

    // select states
    $("#state_id").select2({
      ajax: {
        url: "{{ route('getStates') }}",
        type: "get",
        dataType: 'json',
        delay: 250,
        data: function(params) {
          country_id = $("#country_id").val();
          return {
            searchTerm: params.term, // search term
            country_id: country_id
          };
        },
        processResults: function(response) {
          return {
            results: response

          };
        },
        cache: true
      }
    });

    // select cities
    $("#city_id").select2({
      ajax: {
        url: "{{ route('getCities') }}",
        type: "get",
        dataType: 'json',
        delay: 250,
        data: function(params) {
          state_id = $("#state_id").val();
          return {
            searchTerm: params.term, // search term
            state_id: state_id
          };
        },
        processResults: function(response) {
          return {
            results: response

          };
        },
        cache: true
      }
    });

    $('#shipping_method_ids').select2();
    $('#payment_term_id').select2();
    $('#currency_id').select2();
    $('#contact_role_id').select2();
  });

  $(document).on('click', '#addMoreContactInfo', function() {
    $.ajax({
      type: "GET",
      url: "{{ route('vendors.addMoreContactInfo') }}",
      success: function(response) {
        $('#contactInfo').append(response);
      }
    });
  });

  $(document).on('click', '#addMoreAccountInfo', function() {
    $.ajax({
      type: "GET",
      url: "{{ route('vendors.addMoreAccountInfo') }}",
      success: function(response) {
        $('#accountInfo').append(response);
      }
    });
  });

  $(document).on('click', '.deleteContact', function(e) {
    e.preventDefault();
    text = 'you want to delete ?';
    const swalWithBootstrapButtons = Swal.mixin({
      customClass: {
        confirmButton: 'btn btn-success',
        cancelButton: 'btn btn-danger'
      },
      buttonsStyling: false
    });
    swalWithBootstrapButtons
      .fire({
        title: 'Are you sure?',
        text: text,
        icon: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes',
        cancelButtonText: 'No',
        reverseButtons: true
      })
      .then((result) => {
        if (result.isConfirmed) {
          url = "{{ route('vendors.deleteContact') }}";
          id = $(this).attr('data-id');
          that = this;
          $.ajax({
            url: url,
            type: 'POST',
            data: {
              "id": id
            },
            success: function(res) {
              if (res) {
                $(that).parents('.card').remove();
              }
            }
          });
        } else if (result.dismiss === Swal.DismissReason.cancel) {
          swalWithBootstrapButtons.fire('Cancelled', '', 'error');
        }
      });

  });

  $(document).on('click', '.deleteAccount', function(e) {
    e.preventDefault();
    text = 'you want to delete ?';
    const swalWithBootstrapButtons = Swal.mixin({
      customClass: {
        confirmButton: 'btn btn-success',
        cancelButton: 'btn btn-danger'
      },
      buttonsStyling: false
    });
    swalWithBootstrapButtons
      .fire({
        title: 'Are you sure?',
        text: text,
        icon: 'warning',
        showCancelButton: true,
        confirmButtonText: 'Yes',
        cancelButtonText: 'No',
        reverseButtons: true
      })
      .then((result) => {
        if (result.isConfirmed) {
          url = "{{ route('vendors.deleteAccount') }}";
          id = $(this).attr('data-id');
          that = this;
          $.ajax({
            url: url,
            type: 'POST',
            data: {
              "id": id
            },
            success: function(res) {
              if (res) {
                $(that).parents('.card').remove();
              }
            }
          });
        } else if (result.dismiss === Swal.DismissReason.cancel) {
          swalWithBootstrapButtons.fire('Cancelled', '', 'error');
        }
      });

  });
</script>
@endpush