@extends('users::user-profile')

@section('inside')
<div class="dashboard__orders card">
    <div class="card-header">
        <h5>{{__('general.user-profile.affiliate.social')}}</h5>
    </div>
    @if(!empty($status) && $status == 'success')
    <div class="alert alert-success">{{$msg}}</div>
    @endif
    @if(!empty($status) && $status == 'failure')
    <div class="alert alert-danger">{{$msg}}</div>
    @endif
    <div class="card-divider"></div>
    <div class="card-table">
        <form id="socials">
            {{csrf_field()}}
            <div class="form-group">
                <label for="facebook"><i style="color: #4177F2" class="fab fa-facebook"></i> Facebook</label>
                <input id="facebook" type="text" class="form-control" name="facebook" value="{{$affiliate->facebook}}">

            </div>
            <div class="form-group">
                <label for="twitter"><i style="color: #49A1F2" class="fab fa-twitter"></i> Twitter</label>
                <input id="twitter" type="text" class="form-control" name="twitter" value="{{$affiliate->twitter}}">
            </div>
            <div class="form-group">
                <label for="youtube"><i style="color: red" class="fab fa-youtube"></i> Youtube Kanal ID</label>
                <input id="youtube" type="text" class="form-control" name="youtube" value="{{$affiliate->youtube}}">

            </div>
            <div class="form-group">
                <label for="instagram"><i style="color: #C52F91" class="fab fa-instagram"></i> Instagram</label>
                <input id="instagram" type="text" class="form-control" name="instagram" value="{{$affiliate->instagram}}">
                @if($instagram)
                <button type="button" disabled="disabled"  class="btn btn-primary" style="background-color: #C52F91;border-color: #C52F91"><i class="fab fa-instagram"></i> Instagram Bağlandı</button>
                @else
                <a href="https://www.instagram.com/oauth/authorize?client_id=1090917464691078&redirect_uri=https://sanatsaldunya.e-ticaret.me/instagram/callback&scope=user_profile,user_media&response_type=code&state={{\Illuminate\Support\Facades\Auth::user()->id}}" target="_blank" class="btn btn-primary" style="background-color: #C52F91;border-color: #C52F91"><i class="fab fa-instagram"></i> Instagram ile Bağlan</a>
                    @endif
            </div>
            <div class="form-group">
                <label for="whatsapp"><i style="color: #4BE676" class="fab fa-whatsapp"></i> Whatsapp</label>
                <input id="whatsapp" type="text" class="form-control" name="whatsapp" value="{{$affiliate->whatsapp}}">
            </div>
            <button id="save-social" type="button" class="btn btn-primary">Kaydet</button>
        </form>
    </div>
</div>
@endsection
@section('js')
    <script>
        $('#save-social').on('click',function () {
            $('#save-social').attr('disabled','disabled');
            $('#save-social').text('Kaydediliyor...');
           $.post('{{route('affiliate-save-social')}}',$('#socials').serialize(),function (response) {
                if(response.status == 'success'){
                    $('#save-social').text('Kaydedildi');
                }else{

                    $('#save-social').text('Kaydedilemedi');
                    setTimeout(function () {
                        $('#save-social').removeAttr('disabled');
                        $('#save-social').text('Kaydet');
                    },2000);
                }
           }).fail(function () {
               $('#save-social').text('Kaydedilemedi');
               setTimeout(function () {
                   $('#save-social').removeAttr('disabled');
                   $('#save-social').text('Kaydet');
               },2000);
           });
        });
    </script>
    @endsection