@extends('layouts.app')

@push('action')
    <li class="nav-item ms-3">
        <button type="button" class="btn btn-success btn-icon"  onclick="submit_form()">
            <i class="bi bi-check-circle"></i> Save
        </button>
    </li>
@endpush

@section('contents')
    <div class="content ">
        <form method="POST" name="integration" id="integration">
            @csrf
        <div class="row flex-column-reverse flex-md-row">
            <div class="col-md-8">
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="profile" role="tabpanel" aria-labelledby="profile-tab">
                        <div class="mb-4">
                            <div class="card mb-4">
                                <div class="card-body">
                                    <h6 class="card-title mb-4">Printavo API Configurations</h6>
                                    <div class="row">
                                        <div class="col-md-6">
{{--                                            <label class="form-label">Printavo Url</label>--}}
{{--                                            <div class="mb-3 input-group">--}}
{{--                                                <span class="input-group-text" id="inputGroupPrepend2" onclick="showField(this, 'printavo_url')" aria-hidden="true"><i class="bi bi-eye"></i></span>--}}
{{--                                                <input type="password" class="form-control" value="{{$settings['printavo_url'] ?? null}}" name="printavo_url" id="printavo_url">--}}
{{--                                            </div>--}}
{{--                                            <label class="form-label">Printavo Email</label>--}}
{{--                                            <div class="mb-3 input-group">--}}
{{--                                                <span class="input-group-text" id="inputGroupPrepend2" onclick="showField(this, 'printavo_email')" aria-hidden="true"><i class="bi bi-eye"></i></span>--}}
{{--                                                <input type="password" class="form-control" value="{{$settings['printavo_email'] ?? null}}" name="printavo_email" id="printavo_email">--}}
{{--                                            </div>--}}
                                            <label class="form-label">Printavo Token</label>
                                            <div class="mb-3 input-group">
                                                <span class="input-group-text"  aria-hidden="true"><i class="bi bi-eye"></i></span>
                                                <select class="form-control" name="client" id="client">

                                                    @foreach($clients as $client)
                                                        <option value="{{$client['id']}}" {{isset($settings->admin_client_id) ? $settings->admin_client_id == $client['id'] ? 'selected' : ''}}>{{$client['name']}}</option>
                                                    @endforeach
                                                </select>
                                            </div>
                                        </div>
{{--                                        <div class="col-md-6">--}}
{{--                                            <label class="form-label">Printavo Customer Id</label>--}}
{{--                                            <div class="mb-3 input-group">--}}
{{--                                                <span class="input-group-text" id="inputGroupPrepend2" onclick="showField(this, 'printavo_customer_id')" aria-hidden="true"><i class="bi bi-eye"></i></span>--}}
{{--                                                <input type="password" class="form-control" value="{{$settings['printavo_customer_id'] ?? null}}" name="printavo_customer_id" id="printavo_customer_id">--}}
{{--                                            </div>--}}
{{--                                        </div>--}}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>
            <div class="col-md-4">
                <div class="card sticky-top mb-4 mb-md-0">
                    <div class="card-body">
                        <ul class="nav nav-pills flex-column gap-2" id="myTab" role="tablist">
                            <li class="nav-item" role="presentation">
                                <a class="nav-link active" id="profile-tab" data-bs-toggle="tab" href="#profile" role="tab"
                                   aria-controls="profile" aria-selected="true">
                                    <i class="bi bi-person me-2"></i> Printavo
                                </a>
                            </li>

                        </ul>
                    </div>
                </div>
            </div>
        </div>
        </form>
    </div>
@endsection
@push('script')
    <script>
        function showField(obj, type) {
            if (document.getElementById(type).type == 'text') {
                document.getElementById(type).type = 'password';
            } else {
                document.getElementById(type).type = 'text';
            }
        }
        function submit_form()
        {
            var form = $('#integration')[0];
            var formData = new FormData(form);
                $.ajax({
                    type: "POST",
                    url: "{{route('integrations.store')}}",
                    data: formData,
                    processData: false,
                    contentType: false,
                    success: function (response) {
                        console.log(response);
                        if(response.status ==200){
                            swal("Settings successfully added!", {
                                icon: "success",
                                timer: 2000,
                            });
                        }else{
                            swal("Something went wrong!", {
                                icon: "error",
                                timer: 2000,
                            });
                        }
                    },
                    error: function (data) {
                      if (data) {
                          if (data.status == 403) {
                              swal({
                              text: 'you dont have the permission for this action ',
                              icon: "error",
                              timer: 5000,
                          });
                          } else{
                               swal(data.message, {
                                  icon: "error",
                                  timer: 4000,
                              });
                          }
                      }
                     }
                });
        }
    </script>
@endpush