@extends('layouts.master')
@section('page_title', 'Billing')

@section('content')
    <div class="container">
        {{ Form::page_header("Billing", "business") }}
        <div class="row">
            <div class="grey-bg curve_container bt-container-dashboard">
                @if(isset($account_not_found))
                    {{ Form::label_title("Couldn't find account") }}
                @else
                    {{ Form::row_label_inline('Account Balance', isset($account_balance) ? \App\Helpers\Format_Helper::format_currency($account_balance/100) : '', null, 3, 9) }}
                    {{ Form::row_label_inline('Last Payment', isset($last_payment)
                        ? \App\Helpers\Format_Helper::format_currency($last_payment->total_in_cents/100) . ' on ' . \Carbon\Carbon::instance($last_payment->created_at)->format('m/d/Y') : '',
                         null, 3, 9) }}
                    {{ Form::separator_row('grey-divider thin-divider') }}
                    {{ Form::label_title('Billing Info') }}
                    @if(isset($billing_info))
                        {{ Form::row_label_inline('First Name', $billing_info->first_name, null, 3, 9) }}
                        {{ Form::row_label_inline('Last Name', $billing_info->last_name, null, 3, 9) }}
                        {{ Form::row_label_inline('Address', $billing_info->address1, null, 3, 9) }}
                        {{ Form::row_label_inline('City', $billing_info->city, null, 3, 9) }}
                        {{ Form::row_label_inline('State', $billing_info->state, null, 3, 9) }}
                        {{ Form::row_label_inline('Zip Code', $billing_info->zip, null, 3, 9) }}
                        {{ Form::row_label_inline('Card Type', $billing_info->card_type, null, 3, 9) }}
                        {{ Form::row_label_inline('Expires', $billing_info->month . '/' . $billing_info->year, null, 3, 9) }}
                        {{ Form::row_label_inline('Last Four', $billing_info->last_four, null, 3, 9) }}
                    @else
                        {{ Form::label_title("No Billing Info on File", \App\Helpers\FormComponentHelper::SIZE_LARGE) }}
                    @endif
{{--                    {{ Form::button_link('Update Billing Info', $billing_url) }}--}}
                    {{ Form::label_grey('Billing has changed to a new provider and will be available in fuse+. In the mean time please reach out to Nancy Cochran for billing changes.') }}

                    {{ Form::separator_row('grey-divider thin-divider') }}
                    {{ Form::label_title('Monthly Fees') }}
                    {{ Form::row_label_inline('Business Package', $business->business_package_label, null, 3, 9) }}
                    @if(isset($has_subscription))
                        @foreach($subscriptions as $subscription)
                            {{ Form::row_label_inline('Recurly Plan Name', $subscription->plan->name, null, 3, 9) }}
                            {{ Form::row_label_inline('State', $subscription->state, null, 3, 9) }}
                            {{ Form::row_label_inline('Amount', \App\Helpers\Format_Helper::format_currency($subscription->unit_amount_in_cents/100), null, 3, 9) }}
                            {{ Form::row_label_inline('Activated At', \Carbon\Carbon::instance($subscription->activated_at)->format('m/d/Y'), null, 3, 9) }}
                            {{ Form::row_label_inline('Current Period Started', \Carbon\Carbon::instance($subscription->current_period_started_at)->format('m/d/Y'), null, 3, 9) }}
                            {{ Form::row_label_inline('Current Period Ends', \Carbon\Carbon::instance($subscription->current_period_ends_at)->format('m/d/Y'), null, 3, 9) }}
                            @if($subscription->pending_subscription)
                                {{ Form::label_title('Subscription Changes At End Of Cycle') }}
                                {{ Form::row_label_inline('New Plan', $subscription->pending_subscription->plan->name, null, 3, 9) }}
                                {{ Form::row_label_inline('Amount', \App\Helpers\Format_Helper::format_currency($subscription->pending_subscription->unit_amount_in_cents/100), null, 3, 9) }}
                            @endif
                            @php
                                $date = \Carbon\Carbon::instance($subscription->current_period_ends_at)->format('m/d/Y');
                            @endphp
                            @if ($business->can_cancel_subscription($subscription->state) && $loop->first)
{{--                                {{ Form::button_ex('Update Subscription', "show_update_popup('{$subscription->uuid}', {$business->business});", 'update-subscription-button') }}--}}
{{--                                {{ Form::button_ex('Cancel Services', "cancel_subscription_modal('{$subscription->uuid}', '{$date}', {$business->business}, '{$subscription->state}')") }}--}}
{{--                                {{ Form::button_ex('Change Log', "show_change_log()", 'change-log-button') }}--}}
{{--                                {{ Form::separator_row('grey-divider thin-divider') }}--}}
                                {{ Form::label_grey('Billing has changed to a new provider and will be available in fuse+. In the mean time please reach out to Nancy Cochran for billing changes.') }}

                                <!-- For the update subscription popup -->
                                    <div class="modal-dialog modal-lg bt-modal-dialog" id="update-subscription-dialog" style="display: none" title="Update Subscription">
                                        <div class="modal-body" id="edit_body">
                                            {{ Form::hidden('is_edit_popup', true, ['id'=>'is_edit_popup']) }}
                                            {{ Form::hidden('ticket_due_date', $date, ['id' => 'ticket_due_date']) }}
                                            <div class="row">
                                                {{ Form::select_ex("update_type", null, $update_type, null, null, null, 'type', 'Update Options') }}
                                                <div id="plan-update">
                                                    {{ Form::label_styled('Choose a Business Package', null, \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                    {{ Form::select_ex("plan_code", null, $business_packages, null, null, null, 'plan', 'Select A Business Package') }}
                                                </div>
                                                <div id="amount-update">
                                                    {{ Form::label_styled('Amount', null, \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                    {{ Form::dollar_ex("amount", null, null, null, null, null, 'amount') }}
                                                </div>
                                                <div id="date-update">
                                                    {{ Form::label_styled('New Start Date', null, \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                    {{ Form::date_ex("delay_date", null, null, 'date') }}
                                                </div>
                                                <div id="notes-update">
                                                    {{ Form::label_styled('Notes', null, \App\Helpers\FormComponentHelper::SIZE_SMALL) }}
                                                    {{ Form::textarea_ex('notes', null, null, null, 'notes') }}
                                                </div>
                                                <div id="update-manually">
                                                    {{ Form::checkbox_row('manual', 0, 'Update Recurly Manually', null, 'manual_update') }}
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <!-- END For the update popup -->
                            @elseif (\App\Providers\AuthServiceProvider::user_has_permission(\App\Providers\AuthServiceProvider::UPDATE_BILLING) && $subscription->state != 'canceled' && !$loop->first)
                                {{ Form::separator_row('grey-divider thin-divider') }}
                            @else
                                {{ Form::button_ex('Change Log', "show_change_log()", 'change-log-button') }}
                                {{ Form::separator_row('grey-divider thin-divider') }}
                            @endif
                        @endforeach
                    @else
                        {{ Form::label_title("No Subscription on File", \App\Helpers\FormComponentHelper::SIZE_LARGE) }}
                        {{ Form::button_ex('Change Log', "show_change_log()", 'change-log-button') }}
                        {{ Form::separator_row('grey-divider thin-divider') }}
                    @endif
                    {{ Form::label_title('Invoices') }}
                    @include('search._search_grid_table')

                    <!-- For the change log popup -->
                    @include('shared.modals._basic_modal', ['title' => 'Change Log', 'modal_id' => 'change-log-dialog', 'value' => $business->recurly_change_log])
                    <!-- END For the change log popup -->
                @endif
            </div>
        </div>
    </div>

@endsection
@section('page_style')
    {{ Html::style('/css/daterangepicker.css') }}
    {{ Html::style('/css/daterangepicker_custom.css') }}
    <style>
        .table {
            margin-top: 60px;
        }

        .ui-dialog-buttonset .bt-button {
            background-color: transparent;
            border-color: black;
            color: black;
            font-family: 'Open Sans', sans-serif;
            font-weight: 300;
            font-size: 16px;
        }

        .ui-dialog .ui-dialog-content {
            margin: 0;
            padding: 10px 24px 0px;
        }

        .ui-dialog .ui-dialog-title {
            font-family: 'Open Sans';
            font-weight: 100;
        }

        .ui-dialog .ui-dialog-titlebar-close {
            display: none;
        }
    </style>
@endsection
@section('page_script')
    {{ Html::script('/js/moment.min.js') }}
    {{ Html::script('/js/daterangepicker.js') }}
    <script>
        function show_change_log() {
            var change_log_dialog = $('#change-log-dialog');

            change_log_dialog.dialog({
                position: { my: "left top", at: "right top", of: '#change-log-button' },
                resizable: true,
                draggable: true,
                width: 400,
                height: 400,
                modal: true,
                closeOnEscape: true,
                // we want to control the close button instead of just show the default
                dialogClass: "no-close",
                buttons: [
                    {
                        text: "CLOSE",
                        "class": 'bt-label bt-btn-medium uppercase bt-button edit-popup-btn',
                        "id": 'cancel',
                        click: function() {
                            $( this ).dialog( "close" );
                        }
                    }
                ],
            });
        }

        function show_update_popup(sub_id, business) {
            init_daterangepicker_with_null_support('date');
            var edit_dialog = $('#update-subscription-dialog');

            edit_dialog.dialog({
                position: { my: "left top", at: "right top", of: '#update-subscription-button' },
                resizable: false,
                draggable: false,
                width: 400,
                modal: true,
                closeOnEscape: true,
                // we want to control the close button instead of just show the default
                dialogClass: "no-close",
                buttons: [
                    {
                        text: "SAVE",
                        "class": 'bt-label bt-btn-medium uppercase bt-button edit-popup-btn',
                        "id": 'save-recurly-changes',
                        click: function() {
                            $('#save-recurly-changes').prop('disabled', true).css('border-color', '#C9C9C9');
                            update_subscription(sub_id, business);
                        }
                    },
                    {
                        text: "CANCEL",
                        "class": 'bt-label bt-btn-medium uppercase bt-button edit-popup-btn',
                        "id": 'cancel',
                        click: function() {
                            $( this ).dialog( "close" );
                        }
                    }
                ],
            });

            $('#plan-update').hide();
            $('#amount-update').hide();
            $('#date-update').hide();
            $('#notes-update').hide();
            $('#update-manually').hide();

            $('#type').change(function(){
                if ($(this).val() == '{{ \App\Models\Business::BILLING_CHANGE_PLAN }}') {
                    $('#plan-update').show();
                    $('#amount-update').show();
                    $('#date-update').hide();
                    $('#notes-update').show();
                    $('#update-manually').show();
                }
                else if ($(this).val() == '{{ \App\Models\Business::BILLING_CHANGE_AMOUNT }}') {
                    $('#plan-update').hide();
                    $('#amount-update').show();
                    $('#date-update').hide();
                    $('#notes-update').show();
                    $('#update-manually').show();
                }
                else if ($(this).val() == '{{ \App\Models\Business::BILLING_DELAY_BILLING }}') {
                    $('#plan-update').hide();
                    $('#amount-update').hide();
                    $('#date-update').show();
                    $('#notes-update').show();
                    $('#update-manually').show();
                }
            });
            $('#plan').change(function(){
                if ($(this).val() == '{{ \App\Models\Business_Package_Recurly_Map::PACKAGE_IGC_ONLY }}') {
                    $('#amount').val('0.00').prop('disabled', true);
                    $('#manual_update').prop('disabled', false);
                }
                else if($(this).val() == '{{ \App\Models\Business_Package_Recurly_Map::PACKAGE_HOSTING_ONLY }}'){
                    $('#manual_update').prop('checked', true).prop('disabled', true);
                    $('#amount').val('0.00').prop('disabled', true);
                }
                else {
                    $('#amount').prop('disabled', false);
                    $('#manual_update').prop('disabled', false).prop('checked', false);
                }
            });
            $('#manual_update').change(function() {
                if ($(this).is(':checked')) {
                    $('#amount').val('0.00').prop('disabled', true);
                }
                else {
                    $('#amount').prop('disabled', false);
                }
            });
        }

        function update_subscription(sub_id, business) {
            var type = $('#type').val();
            var plan = $('#plan').val();
            var amount = $('#amount').val();
            var date = $('#date').val();
            var notes = $('#notes').val();
            var ticket_due_date = $('#ticket_due_date').val();
            var manual_update = $('#manual_update').prop('checked') ? 1 : 0;

            $.ajax({
                type: "POST",
                url: '{{ action('SuperAdminBusinessController@post_update_subscription') }}',
                data: { business: business, sub_id: sub_id, type: type, plan: plan, amount: amount, date: date, notes: notes, ticket_due_date: ticket_due_date, manual_update: manual_update },
                success: function (result) {
                    $('#update-subscription-dialog').dialog("close");
                    location.reload();
                },
                error: update_billing_error
            });
        }

        function cancel_subscription_modal(sub_id, date, business, sub_state) {
            showYesNoModalAlert('Cancel Subscription', 'Cancel subscription at end of billing cycle on ' + date, "cancel_subscription('"+sub_id+"', "+business+", '"+date+"', '"+sub_state+"')");
        }

        function cancel_subscription(sub_id, business, cancel_date, sub_state) {
            $("body").css("cursor", "wait");
            $.ajax({
                type: "POST",
                url: '{{ action('SuperAdminBusinessController@post_cancel_subscription') }}',
                data: { business: business, sub_id: sub_id, cancel_date: cancel_date, sub_state: sub_state },
                success: function (result) {
                    location.reload();
                    $("body").css("cursor", "default");
                }
            });
            $('#modal-alert').modal('hide');
        }

        var update_billing_error = function(xhr) {
            if(xhr.status === 422) // validation error
            {
                var errors = JSON.parse(xhr.responseText);
                errors = errors.errors;
                Object.keys(errors).forEach(function (k) {
                    var selector = k;
                    element = document.getElementById(selector);
                    if (k == 'amount')
                        $('#amount-update').append("<p class='validation-message'>" + errors[k] + "</p>");
                    else if (k == 'date')
                        $('#date-update').append("<p class='validation-message'>" + errors[k] + "</p>");
                    else
                        $(element).parent().append("<p class='validation-message'>" + errors[k] + "</p>");
                    $(element).css('border-color', '#cc0000');
                    $(element).on('input', function () {
                        $(this).css('border-color', '#797979');
                        $('.validation-message').remove();
                    });
                });
            }
            else if (xhr.status == 400) // general error
            {
                var errors = JSON.parse(xhr.responseText);
                error = errors.message;
                alert(error);
            }
        };
    </script>
@endsection