@extends('main')

@section('css')
<link rel="stylesheet" href="{{ asset('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/datatables-responsive/css/responsive.bootstrap4.min.css') }}">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css">  
@endsection

@section('content')
<div class="content-wrapper">

    <!-- Main content -->
    <section class="content">
      <div class="row">
        <div class="col-12">
        @if(session('message'))
            <div class="form-group mt-3">
                <div class="alert alert-success" role="alert">
                    {{ session('message') }}
                </div>
            </div>
        @endif
          <div class="card mt-3">
            {{-- <div class="card-header">
                <a href="{{ route('team.create') }}" class="btn btn-primary btn-add-jasa float-right">Add Team Member</a>
            </div> --}}
            <!-- /.card-header -->
            <div class="card-body">
                <div class="table-responsive">
                    <table id="example2" class="table table-bordered table-hover">
                        <thead>
                            <tr>
                            <th>ID Order</th>
                            <th>ID Order Agen</th>
                            <th>Nama Agen</th>
                            <th>Service</th>
                            <th>Domain</th>
                            <th>Template</th>
                            <th>Status</th>
                            <th>Created At</th>
                            <th>Active At</th>
                            <th>Options</th>
                            </tr>
                        </thead>
                        <tbody>
                        @if(!empty($orders))
                        @foreach($orders as $o)
                        <tr>
                           <td>{{ $o->id }}</td>
                           <td>{{ $o->order_agent_id }}</td>
                           <td>{{ $o->agent->name }}</td>
                           <td>{{ $o->service }}</td>
                           <td>{{ $o->domain }}</td>
                           <td>{{ $o->template }}</td>
                           <td class="order-binggo-status">
                               @if($o->status == 'Unpaid')
                               <span class="badge badge-danger">unpaid</span>
                               @elseif($o->status == 'inactive')
                               <span class="badge badge-danger">inactive</span>
                               @elseif($o->status == 'waiting for whmcs')
                               <span class="badge badge-warning">waiting for whmcs</span>
                               @else
                               <span class="badge badge-success">active</span>
                               @endif
                           </td>
                           <td>{{ date('d-m-Y H:i:s', strtotime($o->created_at)) }}</td>
                           <td>{{ $o->active_at ? date('d-m-Y H:i:s', strtotime($o->created_at)) : '-' }}</td>
                            <td class="text-center">
                                @if($o->status === 'inactive' && $o->zone_id != NULL)
                                @if(\App\Http\Controllers\ManagementAgentController::checkZoneStatus($o->zone_id) == 'active')
                                <button class="btn btn-success btn-sm btn-activate" order-id="{{ $o->id }}" name="{{ $o->name }}" email="{{ $o->email }}" template="{{ $o->template }}" domain="{{ $o->domain }}" user-id="{{ $o->whmcs_client_id }}" title="activate order" dashboard="{{ $o->dashboard }}">Activate</button>
                                @else
                                <span class="badge badge-warning">Waiting cloudflare to activate zone</span>
                                @endif
                                @endif

                                @if($o->status == 'inactive')
                                    @if($o->zone_id)
                                        @if(\App\Http\Controllers\ManagementAgentController::checkZoneStatus($o->zone_id) == 'active')
                                            <button class="btn btn-success btn-sm btn-activate" order-id="{{ $o->id }}" name="{{ $o->name }}" email="{{ $o->email }}" template="{{ $o->template }}" domain="{{ $o->domain }}" user-id="{{ $o->whmcs_client_id }}" title="activate order" dashboard="{{ $o->dashboard }}">Activate</button>
                                        @else
                                            <span class="badge badge-warning">Waiting cloudflare to activate zone</span>
                                        @endif
                                    @else
                                        <button class="btn btn-success btn-sm btn-add-to-cloudflare" order-id="{{ $o->id }}" domain="{{ $o->domain }}" user-id="{{ $o->whmcs_client_id }}" title="add domain to cloudflare">Add to Clodflare</button>
                                    @endif
                                @endif
                                
                                @if($o->status == 'active')
                                    <span class="badge badge-success">website active</span>
                                @endif

                                @if($o->status == 'waiting for whmcs')
                                    <button class="btn btn-success btn-sm btn-add-to-whmcs" order-id="{{ $o->id }}" domain="{{ $o->domain }}" user-id="{{ $o->whmcs_client_id }}" template-id="{{ $o->template_id }}" pid="{{ $o->pid }}" title="add order to whmcs">Add Order to Whmcs</button>
                                @endif
                            </td>
                        </tr>
                        @endforeach
                        @endif
                        </tbody>
                    </table>
                </div>
            </div>
            <!-- /.card-body -->
          </div>
          <!-- /.card -->
          <!-- /.card -->
        </div>
        <!-- /.col -->
      </div>
      <!-- /.row -->
    </section>
    <!-- /.content -->
  </div>  
@endsection

@section('js')
<script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-responsive/js/dataTables.responsive.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}"></script>
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@9"></script>
<script>
$(document).ready(function() {
    $('#example2').DataTable({
        "order": [[ 0, "desc" ]]
    })

    $('body').on('click', '.btn-add-to-whmcs', function() {
        let order_id = $(this).attr('order-id');
        let domain = $(this).attr('domain');
        let whmcs_id = $(this).attr('user-id');
        let pid = $(this).attr('pid')
        let template_id = $(this).attr('template-id')
        Swal.fire({
            title: 'Do you want to add this domain to cloudflare ?',
            text: "",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes'
        }).then((result) => {
            if (result.value) {
                $.ajax({
                    type: "POST",
                    url: "https://my.binggo.co.id/api/orderwebsite",
                    data: {
                        whmcs_id,
                        pid,
                        domain,
                        template_id
                    },
                    beforeSend: function() {
                        let timerInterval;
                        Swal.fire({
                            title: 'Please Wait',
                            html: 'Order is adding to WHMCS',
                            timerProgressBar: true,
                            onBeforeOpen: () => {
                                Swal.showLoading()
                            },
                            onClose: () => {
                                clearInterval(timerInterval)
                            }
                            }).then((result) => {
                            if (
                                /* Read more about handling dismissals below */
                                result.dismiss === Swal.DismissReason.timer
                            ) {
                                console.log('I was closed by the timer') // eslint-disable-line
                            }
                            })
                    },
                    success: function(response) {
                       updateOrderAfterWhmcs({
                        whmcs_order_id: response.whmcs_order_id,
                        order_id,
                        domain,
                        whmcs_id,
                        _token: "{{ csrf_token() }}"
                       })
                    }
                });
            }
        });
    })

    $('body').on('click', '.btn-add-to-cloudflare', function() {
        let order_id = $(this).attr('order-id');
        let domain = $(this).attr('domain');
        let user_id = $(this).attr('user-id');
        Swal.fire({
            title: 'Do you want to add this domain to cloudflare ?',
            text: "",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes'
        }).then((result) => {
            if (result.value) {
                $.ajax({
                    type: "POST",
                    url: "{{ route('agent.add-to-cloudflare') }}",
                    data: {
                        _token: "{{ csrf_token() }}",
                        order_id,
                        domain,
                        user_id
                    },
                    beforeSend: function() {
                        let timerInterval;
                        Swal.fire({
                            title: 'Please Wait',
                            html: 'Domain is adding to cloudflare ',
                            timerProgressBar: true,
                            onBeforeOpen: () => {
                                Swal.showLoading()
                            },
                            onClose: () => {
                                clearInterval(timerInterval)
                            }
                            }).then((result) => {
                            if (
                                /* Read more about handling dismissals below */
                                result.dismiss === Swal.DismissReason.timer
                            ) {
                                console.log('I was closed by the timer') // eslint-disable-line
                            }
                            })
                    },
                    success: function(response) {
                        $('body').find('.btn-add-to-cloudflare[order-id="'+order_id+'"]').parent().html(`
                            <span class="badge badge-warning">Waiting cloudflare to activate zone</span>
                        `)
                        Swal.fire(
                            'Success!',
                            'Domain Successfully added to cloudflare',
                            'success'
                        )
                    }
                });
            }
        });
    })

    $('body').on('click', '.btn-activate', function() {
        let order_id = $(this).attr('order-id');
        let domain = $(this).attr('domain');
        let user_id = $(this).attr('user-id');
        let name = $(this).attr('name');
        let template = $(this).attr('template');
        let email = $(this).attr('email');
        let dashboard = $(this).attr('dashboard');
        Swal.fire({
            title: 'Do you want to activate this website ?',
            text: "",
            type: 'warning',
            showCancelButton: true,
            confirmButtonColor: '#3085d6',
            cancelButtonColor: '#d33',
            confirmButtonText: 'Yes'
        }).then((result) => {
            if (result.value) {
                $.ajax({
                    type: "POST",
                    url: "https://cserv1.binggo.co.id/api/add-binggo",
                    data: {
                        _token: "{{ csrf_token() }}",
                        order_id,
                        domain,
                        user_id,
                        name,
                        template,
                        email,
                        dashboard
                    },
                    beforeSend: function() {
                        let timerInterval;
                        Swal.fire({
                            title: 'Please Wait',
                            html: 'We are activating the website',
                            timerProgressBar: true,
                            onBeforeOpen: () => {
                                Swal.showLoading()
                            },
                            onClose: () => {
                                clearInterval(timerInterval)
                            }
                            }).then((result) => {
                            if (
                                /* Read more about handling dismissals below */
                                result.dismiss === Swal.DismissReason.timer
                            ) {
                                console.log('I was closed by the timer') // eslint-disable-line
                            }
                            })
                    },
                    success: function(response) {
                        if(response == 'success') {
                            updateOrderStatus({ order_id, domain, user_id, _token: "{{ csrf_token() }}" });
                        } else {
                            Swal.fire({
                                icon: 'error',
                                title: 'Pengaktifan Web Tidak Berhasil'
                            })
                        }
                    }
                });
            }
        });
    })
})

function updateOrderStatus(data) {
    $.ajax({
        type: 'POST',
        url: "{{ route('agent.activate') }}",
        data,
        success(res) {
           updateOrderAgent({
               domain: res.domain,
               order_id: res.order_id,
               cost: res.cost,
               deposit: res.deposit,
               income: res.income,
               commision: res.commision
           });
        }
    })
}

function updateOrderAfterWhmcs(data) {
    $.ajax({
        type: 'POST',
        url: "{{ route('agent.after-whmcs') }}",
        data,
        success(res) {
            $('body').find('.btn-add-to-whmcs[order-id="'+data.order_id+'"]').parent().parent().find('.order-binggo-status').html(`
                <span class="badge badge-danger">inactive</span>
            `)
            $('body').find('.btn-add-to-whmcs[order-id="'+data.order_id+'"]').parent().html(`
                <button class="btn btn-success btn-sm btn-add-to-cloudflare" order-id="${data.order_id}" domain="${data.domain}" user-id="${data.whmcs_id}" title="add domain to cloudflare">Add to Clodflare</button>
            `)

        }
    })
}

function updateOrderAgent(data) {
    $.ajax({
        type: 'POST',
        url: `https://${data.domain}/api/agent/active`,
        data: {
            order_id: data.order_id,
            cost: data.cost,
            deposit: data.deposit,
            commision: data.commision,
            income: data.income
        },
        success(res) {
            $('body').find('.btn-add-to-cloudflare[order-id="'+data.order_id+'"]').parent().html(`
                <span class="badge badge-success">website active</span>
            `)
            $('body').find('.btn-add-to-cloudflare[order-id="'+data.order_id+'"]').parent().parent().find('.order-binggo-status').html(`
                <span class="badge badge-success">active</span>
            `)
            Swal.fire(
                'Congrats!',
                'Website Berhasil Diaktifkan!',
                'success'
            )
        }
    })
}
</script>
@endsection