{{#if customer_group_name '!=' 'Reseller'}}

<div class="reseller-info">
    <h3 class="resale-title">Resale Certification Information</h3>

    <form action="/account.php?action=update_account" class="form" method="POST" enctype="multipart/form-data" id="reseller-cert">
        <fieldset class="form-fieldset form-container">
            <legend class="legend">Upload Resale Certificate</legend>
            <p class="required-text">* Required Fields</p>
            <p class="field required-item">
                <label for="resale-number" class="required-item required">Enter Your Resale Number</label>
                <div class="form-row--half">
                    <div class="input-box form-field form-field--input form-field--inputText">
                        <input type="text" id="resale-number" class="input-text required-entry form-input" name="resale_number">
                    </div>
                </div>
            </p>
            <p class="field required-item">
                <label for="reseller" class="required-item required">Upload Your Resale Certificate here</label>
                <div class="input-box">
                    <input type="file" id="reseller" class="input-text required-entry" name="file">
                </div>
            </p>
            <p class="field">
                Supported File Types: 'doc', 'docx', 'txt', 'pdf'
            </p>
            <p class="field">
                Or Send Your Resale Certificate to <a href="mailto:order@neteon.net">order@neteon.net</a>
            </p>
        </fieldset>
        <div class="actions">
            <button type="submit" title="Submit" class="button button--primary">Update Details</button>
        </div>
    </form>
</div>

<hr>


<script>
var form = document.getElementById("reseller-cert");
form.addEventListener("submit", formSubmit);

function formSubmit(e) {
    e.preventDefault()

    if (!$('input[name="resale_number"]').val() || document.querySelector("#reseller").files.length == 0) {
        return false;
    }

    $('.form-container button[type="submit"]')
        .attr('disabled', 'disabled')
        .css({
            "background-color": "#e1e1e1"
        });
    $('.form-container input, .form-container textarea').attr('disabled', 'disabled');
    const formData = new FormData();
    var customFiles = document.querySelector("#reseller").files || [];

    formData.append("customer-name", "{{{customer.name}}}");
    formData.append("customer-email", "{{{customer.email}}}");
    formData.append("customer-file", customFiles[0]);
    formData.append("resell-number", $(`input[name="resale_number"]`, this).val());


    fetch("https://getform.io/f/2d59d05d-0b46-4a36-9a51-71ad0e9aa109", {
        method: "POST",
        body: formData,
    }).then(response => {
        console.log('success', response);
        console.log('submission-success');

        $('#sent_success').show();
        setTimeout(function() {
            $(location).attr('href', '/submission-success/')
        }, 1000)


    }).catch(error => {
        console.log('error', error);

        $('.form-container button[type="submit"]')
            .removeAttr('disabled')
            .css({
                "background-color": "#0b8a8a"
            });
        $('.form-container input, .form-container textarea').removeAttr('disabled');
    })
}

$(document).ready(function() {
    $('.required-item input').attr('required', 'required')
})

</script>
{{/if}}

<h3 class="account-heading">{{lang 'account.orders.heading' }}</h3>

<ul class="account-list">
    {{#each orders}}
    <li class="account-listItem">
        <div class="account-product">
            <div class="account-product-figure">
                {{#if items.0.type '===' 'giftcertificate'}}
                    <img
                        alt="GiftCertificate"
                        title="GiftCertificate"
                        src="{{cdn ../theme_settings.default_image_gift_certificate}}">
                {{else}}
                    {{> components/common/responsive-img
                        image=image
                        class="account-product-image"
                        fallback_size=../theme_settings.productthumb_size
                        lazyload=../theme_settings.lazyload_mode
                        default_image=../theme_settings.default_image_product
                    }}
                {{/if}}
            </div>
            <div class="account-product-body">
                <div class="account-orderStatus">
                    <h6 class="account-orderStatus-label">{{this.status}}</h6>
                    {{#if ../settings.returns_enabled}}
                        {{#if this.return_url}}
                            <a class="account-orderStatus-action" href="{{this.return_url}}">
                                {{lang 'account.orders.return_items' }}
                            </a>
                        {{/if}}
                    {{/if}}
                </div>

                <h5 class="account-product-title">
                    <a href="{{this.details_url}}">{{lang 'account.orders.list.order_number' number=this.id}}</a>
                </h5>
                <p class="account-product-description">{{lang 'account.orders.list.product_details' num_products=this.items.length cost=this.total.formatted}}</p>

                <div class="account-product-details">
                    <div class="account-product-detail">
                        <h6 class="account-product-detail-heading">{{lang 'account.orders.order_placed' }}</h6>
                        <span>{{this.date}}</span>
                    </div>
                    <div class="account-product-detail">
                        <h6 class="account-product-detail-heading">{{lang 'account.orders.last_update' }}</h6>
                        <span>{{this.last_update_date}}</span>
                    </div>
                </div>
            </div>
        </div>
    </li>
    {{/each}}
</ul>