"use strict";
/* eslint-disable @typescript-eslint/no-non-null-assertion, unicorn/prefer-module */
Object.defineProperty(exports, "__esModule", { value: true });
(() => {
    const los = exports.los;
    const feeCategoriesContainerElement = document.querySelector('#container--feeCategories');
    let feeCategories = exports.feeCategories;
    delete exports.feeCategories;
    function renderFeeCategories() {
        if (feeCategories.length === 0) {
            feeCategoriesContainerElement.innerHTML = `<div class="message is-warning">
                <p class="message-body">There are no available fees.</p>
                </div>`;
            return;
        }
        feeCategoriesContainerElement.innerHTML = '';
        for (const feeCategory of feeCategories) {
            const feeCategoryContainerElement = document.createElement('section');
            feeCategoryContainerElement.className = 'panel container--feeCategory';
            feeCategoryContainerElement.dataset.feeCategoryId =
                feeCategory.feeCategoryId.toString();
            feeCategoryContainerElement.innerHTML =
                '<div class="panel-heading">' +
                    '<div class="columns">' +
                    ('<div class="column">' +
                        '<h2 class="title is-4">' +
                        cityssm.escapeHTML(feeCategory.feeCategory || '') +
                        '</h2>' +
                        '</div>') +
                    ('<div class="column is-narrow">' +
                        '<div class="field is-grouped is-justify-content-end">' +
                        (feeCategory.fees.length === 0
                            ? '<div class="control">' +
                                '<button class="button is-small is-danger button--deleteFeeCategory" type="button">' +
                                '<span class="icon is-small"><i class="fas fa-trash" aria-hidden="true"></i></span>' +
                                '<span>Delete Category</span>' +
                                '</button>' +
                                '</div>'
                            : '') +
                        ('<div class="control">' +
                            '<button class="button is-small is-primary button--editFeeCategory" type="button">' +
                            '<span class="icon is-small"><i class="fas fa-pencil-alt" aria-hidden="true"></i></span>' +
                            '<span>Edit Category</span>' +
                            '</button>' +
                            '</div>') +
                        ('<div class="control">' +
                            '<button class="button is-small is-success button--addFee" data-cy="addFee" type="button">' +
                            '<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>' +
                            '<span>Add Fee</span>' +
                            '</button>' +
                            '</div>') +
                        ('<div class="control">' +
                            los.getMoveUpDownButtonFieldHTML('button--moveFeeCategoryUp', 'button--moveFeeCategoryDown') +
                            '</div>') +
                        '</div>') +
                    '</div>' +
                    '</div>';
            if (feeCategory.fees.length === 0) {
                feeCategoryContainerElement.insertAdjacentHTML('beforeend', `<div class="panel-block is-block">
                        <div class="message is-info">
                        <p class="message-body">
                            There are no fees in the
                            "${cityssm.escapeHTML(feeCategory.feeCategory || '')}"
                            category.
                        </p>
                        </div>
                    </div>`);
                feeCategoryContainerElement
                    .querySelector('.button--deleteFeeCategory')
                    .addEventListener('click', confirmDeleteFeeCategory);
            }
            else {
                for (const fee of feeCategory.fees) {
                    const panelBlockElement = document.createElement('div');
                    panelBlockElement.className = 'panel-block is-block container--fee';
                    panelBlockElement.dataset.feeId = fee.feeId.toString();
                    const hasTagsBlock = fee.isRequired || fee.occupancyTypeId || fee.lotTypeId;
                    panelBlockElement.innerHTML =
                        '<div class="columns">' +
                            ('<div class="column is-half">' +
                                '<p>' +
                                '<a class="has-text-weight-bold" href="#">' +
                                cityssm.escapeHTML(fee.feeName || '') +
                                '</a><br />' +
                                '<small>' +
                                cityssm
                                    .escapeHTML(fee.feeDescription || '')
                                    .replace(/\n/g, '<br />') +
                                '</small>' +
                                '</p>' +
                                (hasTagsBlock
                                    ? '<p class="tags">' +
                                        (fee.isRequired
                                            ? '<span class="tag is-warning">Required</span>'
                                            : '') +
                                        (fee.occupancyTypeId
                                            ? ' <span class="tag has-tooltip-bottom" data-tooltip="' +
                                                los.escapedAliases.Occupancy +
                                                ' Type Filter">' +
                                                cityssm.escapeHTML(fee.occupancyType || '') +
                                                '</span>'
                                            : '') +
                                        (fee.lotTypeId
                                            ? ' <span class="tag has-tooltip-bottom" data-tooltip="' +
                                                los.escapedAliases.Lot +
                                                ' Type Filter">' +
                                                cityssm.escapeHTML(fee.lotType || '') +
                                                '</span>'
                                            : '') +
                                        '</p>'
                                    : '') +
                                '</div>') +
                            ('<div class="column">' +
                                '<div class="columns is-mobile">' +
                                ('<div class="column has-text-centered">' +
                                    (fee.feeFunction
                                        ? cityssm.escapeHTML(fee.feeFunction) +
                                            '<br />' +
                                            '<small>Fee Function</small>'
                                        : '$' +
                                            fee.feeAmount.toFixed(2) +
                                            '<br />' +
                                            '<small>Fee</small>') +
                                    '</div>') +
                                ('<div class="column has-text-centered">' +
                                    (fee.taxPercentage
                                        ? fee.taxPercentage + '%'
                                        : '$' + fee.taxAmount.toFixed(2)) +
                                    '<br /><small>Tax</small>' +
                                    '</div>') +
                                ('<div class="column has-text-centered">' +
                                    (fee.includeQuantity
                                        ? cityssm.escapeHTML(fee.quantityUnit || '') +
                                            '<br />' +
                                            '<small>Quantity</small>'
                                        : '') +
                                    '</div>') +
                                '</div>' +
                                '</div>') +
                            ('<div class="column is-narrow">' +
                                los.getMoveUpDownButtonFieldHTML('button--moveFeeUp', 'button--moveFeeDown') +
                                '</div>' +
                                '</div>') +
                            '</div>';
                    panelBlockElement
                        .querySelector('a')
                        .addEventListener('click', openEditFee);
                    panelBlockElement.querySelector('.button--moveFeeUp').addEventListener('click', moveFee);
                    panelBlockElement.querySelector('.button--moveFeeDown').addEventListener('click', moveFee);
                    feeCategoryContainerElement.append(panelBlockElement);
                }
            }
            feeCategoryContainerElement
                .querySelector('.button--editFeeCategory')
                .addEventListener('click', openEditFeeCategory);
            feeCategoryContainerElement
                .querySelector('.button--addFee')
                .addEventListener('click', openAddFee);
            feeCategoryContainerElement.querySelector('.button--moveFeeCategoryUp').addEventListener('click', moveFeeCategory);
            feeCategoryContainerElement.querySelector('.button--moveFeeCategoryDown').addEventListener('click', moveFeeCategory);
            feeCategoriesContainerElement.append(feeCategoryContainerElement);
        }
    }
    /*
     * Fee Categories
     */
    document
        .querySelector('#button--addFeeCategory')
        .addEventListener('click', () => {
        let addCloseModalFunction;
        const doAddFeeCategory = (submitEvent) => {
            submitEvent.preventDefault();
            cityssm.postJSON(los.urlPrefix + '/admin/doAddFeeCategory', submitEvent.currentTarget, (responseJSON) => {
                if (responseJSON.success) {
                    feeCategories = responseJSON.feeCategories;
                    addCloseModalFunction();
                    renderFeeCategories();
                }
                else {
                    bulmaJS.alert({
                        title: 'Error Creating Fee Category',
                        message: responseJSON.errorMessage || '',
                        contextualColorName: 'danger'
                    });
                }
            });
        };
        cityssm.openHtmlModal('adminFees-addFeeCategory', {
            onshown(modalElement, closeModalFunction) {
                bulmaJS.toggleHtmlClipped();
                modalElement.querySelector('#feeCategoryAdd--feeCategory').focus();
                addCloseModalFunction = closeModalFunction;
                modalElement
                    .querySelector('form')
                    .addEventListener('submit', doAddFeeCategory);
            },
            onremoved() {
                bulmaJS.toggleHtmlClipped();
                document.querySelector('#button--addFeeCategory').focus();
            }
        });
    });
    function openEditFeeCategory(clickEvent) {
        const feeCategoryId = Number.parseInt(clickEvent.currentTarget.closest('.container--feeCategory').dataset.feeCategoryId, 10);
        const feeCategory = feeCategories.find((currentFeeCategory) => {
            return currentFeeCategory.feeCategoryId === feeCategoryId;
        });
        let editCloseModalFunction;
        function doUpdateFeeCategory(submitEvent) {
            submitEvent.preventDefault();
            cityssm.postJSON(los.urlPrefix + '/admin/doUpdateFeeCategory', submitEvent.currentTarget, (responseJSON) => {
                if (responseJSON.success) {
                    feeCategories = responseJSON.feeCategories;
                    editCloseModalFunction();
                    renderFeeCategories();
                }
                else {
                    bulmaJS.alert({
                        title: 'Error Updating Fee Category',
                        message: responseJSON.errorMessage || '',
                        contextualColorName: 'danger'
                    });
                }
            });
        }
        cityssm.openHtmlModal('adminFees-editFeeCategory', {
            onshow(modalElement) {
                ;
                modalElement.querySelector('#feeCategoryEdit--feeCategoryId').value = feeCategory.feeCategoryId.toString();
                modalElement.querySelector('#feeCategoryEdit--feeCategory').value = feeCategory.feeCategory;
            },
            onshown(modalElement, closeModalFunction) {
                bulmaJS.toggleHtmlClipped();
                editCloseModalFunction = closeModalFunction;
                modalElement
                    .querySelector('form')
                    .addEventListener('submit', doUpdateFeeCategory);
                modalElement.querySelector('#feeCategoryEdit--feeCategory').focus();
            },
            onremoved: () => {
                bulmaJS.toggleHtmlClipped();
            }
        });
    }
    function confirmDeleteFeeCategory(clickEvent) {
        const feeCategoryId = Number.parseInt(clickEvent.currentTarget.closest('.container--feeCategory').dataset.feeCategoryId, 10);
        function doDelete() {
            cityssm.postJSON(los.urlPrefix + '/admin/doDeleteFeeCategory', {
                feeCategoryId
            }, (responseJSON) => {
                if (responseJSON.success) {
                    feeCategories = responseJSON.feeCategories;
                    renderFeeCategories();
                }
                else {
                    bulmaJS.alert({
                        title: 'Error Updating Fee Category',
                        message: responseJSON.errorMessage || '',
                        contextualColorName: 'danger'
                    });
                }
            });
        }
        bulmaJS.confirm({
            title: 'Delete Fee Category?',
            message: 'Are you sure you want to delete this fee category?',
            contextualColorName: 'warning',
            okButton: {
                text: 'Yes, Delete the Fee Category',
                callbackFunction: doDelete
            }
        });
    }
    function moveFeeCategory(clickEvent) {
        const buttonElement = clickEvent.currentTarget;
        const feeCategoryId = buttonElement.closest('.container--feeCategory').dataset.feeCategoryId;
        cityssm.postJSON(los.urlPrefix +
            '/admin/' +
            (buttonElement.dataset.direction === 'up'
                ? 'doMoveFeeCategoryUp'
                : 'doMoveFeeCategoryDown'), {
            feeCategoryId,
            moveToEnd: clickEvent.shiftKey ? '1' : '0'
        }, (responseJSON) => {
            if (responseJSON.success) {
                feeCategories = responseJSON.feeCategories;
                renderFeeCategories();
            }
            else {
                bulmaJS.alert({
                    title: 'Error Moving Fee Category',
                    message: responseJSON.errorMessage || '',
                    contextualColorName: 'danger'
                });
            }
        });
    }
    /*
     * Fees
     */
    function openAddFee(clickEvent) {
        const feeCategoryId = Number.parseInt(clickEvent.currentTarget.closest('.container--feeCategory').dataset.feeCategoryId, 10);
        let addCloseModalFunction;
        function doAddFee(submitEvent) {
            submitEvent.preventDefault();
            cityssm.postJSON(los.urlPrefix + '/admin/doAddFee', submitEvent.currentTarget, (responseJSON) => {
                if (responseJSON.success) {
                    feeCategories = responseJSON.feeCategories;
                    addCloseModalFunction();
                    renderFeeCategories();
                }
                else {
                    bulmaJS.alert({
                        title: 'Error Adding Fee',
                        message: responseJSON.errorMessage || '',
                        contextualColorName: 'danger'
                    });
                }
            });
        }
        cityssm.openHtmlModal('adminFees-addFee', {
            onshow(modalElement) {
                const feeCategoryElement = modalElement.querySelector('#feeAdd--feeCategoryId');
                for (const feeCategory of feeCategories) {
                    const optionElement = document.createElement('option');
                    optionElement.value = feeCategory.feeCategoryId.toString();
                    optionElement.textContent = feeCategory.feeCategory;
                    if (feeCategory.feeCategoryId === feeCategoryId) {
                        optionElement.selected = true;
                    }
                    feeCategoryElement.append(optionElement);
                }
                const occupancyTypeElement = modalElement.querySelector('#feeAdd--occupancyTypeId');
                for (const occupancyType of exports.occupancyTypes) {
                    const optionElement = document.createElement('option');
                    optionElement.value = occupancyType.occupancyTypeId.toString();
                    optionElement.textContent = occupancyType.occupancyType;
                    occupancyTypeElement.append(optionElement);
                }
                const lotTypeElement = modalElement.querySelector('#feeAdd--lotTypeId');
                for (const lotType of exports.lotTypes) {
                    const optionElement = document.createElement('option');
                    optionElement.value = lotType.lotTypeId.toString();
                    optionElement.textContent = lotType.lotType;
                    lotTypeElement.append(optionElement);
                }
                ;
                modalElement.querySelector('#feeAdd--taxPercentage').value = exports.taxPercentageDefault.toString();
                los.populateAliases(modalElement);
            },
            onshown(modalElement, closeModalFunction) {
                bulmaJS.toggleHtmlClipped();
                addCloseModalFunction = closeModalFunction;
                modalElement.querySelector('form').addEventListener('submit', doAddFee);
                modalElement.querySelector('#feeAdd--feeName').focus();
                modalElement.querySelector('#feeAdd--feeFunction').addEventListener('change', () => {
                    const feeAmountElement = modalElement.querySelector('#feeAdd--feeAmount');
                    const feeFunctionElement = modalElement.querySelector('#feeAdd--feeFunction');
                    if (feeFunctionElement.value === '') {
                        feeFunctionElement
                            .closest('.select')
                            .classList.remove('is-success');
                        feeAmountElement.classList.add('is-success');
                        feeAmountElement.disabled = false;
                    }
                    else {
                        feeFunctionElement.closest('.select').classList.add('is-success');
                        feeAmountElement.classList.remove('is-success');
                        feeAmountElement.disabled = true;
                    }
                });
                modalElement
                    .querySelector('#feeAdd--taxPercentage')
                    .addEventListener('keyup', () => {
                    const taxAmountElement = modalElement.querySelector('#feeAdd--taxAmount');
                    const taxPercentageElement = modalElement.querySelector('#feeAdd--taxPercentage');
                    if (taxPercentageElement.value === '') {
                        taxPercentageElement.classList.remove('is-success');
                        taxAmountElement.classList.add('is-success');
                        taxAmountElement.disabled = false;
                    }
                    else {
                        taxPercentageElement.classList.add('is-success');
                        taxAmountElement.classList.remove('is-success');
                        taxAmountElement.disabled = true;
                    }
                });
                modalElement
                    .querySelector('#feeAdd--includeQuantity')
                    .addEventListener('change', () => {
                    ;
                    modalElement.querySelector('#feeAdd--quantityUnit').disabled =
                        modalElement.querySelector('#feeAdd--includeQuantity').value === '';
                });
            },
            onremoved() {
                bulmaJS.toggleHtmlClipped();
            }
        });
    }
    function openEditFee(clickEvent) {
        clickEvent.preventDefault();
        const feeContainerElement = clickEvent.currentTarget.closest('.container--fee');
        const feeId = Number.parseInt(feeContainerElement.dataset.feeId, 10);
        const feeCategoryId = Number.parseInt(feeContainerElement.closest('.container--feeCategory')
            .dataset.feeCategoryId);
        const feeCategory = feeCategories.find((currentFeeCategory) => {
            return currentFeeCategory.feeCategoryId === feeCategoryId;
        });
        const fee = feeCategory.fees.find((currentFee) => {
            return currentFee.feeId === feeId;
        });
        let editCloseModalFunction;
        let editModalElement;
        function doUpdateFee(submitEvent) {
            submitEvent.preventDefault();
            cityssm.postJSON(los.urlPrefix + '/admin/doUpdateFee', submitEvent.currentTarget, (responseJSON) => {
                if (responseJSON.success) {
                    feeCategories = responseJSON.feeCategories;
                    editCloseModalFunction();
                    renderFeeCategories();
                }
                else {
                    bulmaJS.alert({
                        title: 'Error Updating Fee',
                        message: responseJSON.errorMessage || '',
                        contextualColorName: 'danger'
                    });
                }
            });
        }
        function confirmDeleteFee(clickEvent) {
            clickEvent.preventDefault();
            const doDelete = () => {
                cityssm.postJSON(los.urlPrefix + '/admin/doDeleteFee', {
                    feeId
                }, (responseJSON) => {
                    if (responseJSON.success) {
                        feeCategories = responseJSON.feeCategories;
                        editCloseModalFunction();
                        renderFeeCategories();
                    }
                    else {
                        bulmaJS.alert({
                            title: 'Error Deleting Fee',
                            message: responseJSON.errorMessage || '',
                            contextualColorName: 'danger'
                        });
                    }
                });
            };
            bulmaJS.confirm({
                title: 'Delete Fee?',
                message: 'Are you sure you want to delete this fee?',
                contextualColorName: 'warning',
                okButton: {
                    text: 'Yes, Delete the Fee',
                    callbackFunction: doDelete
                }
            });
        }
        function toggleFeeFields() {
            const feeAmountElement = editModalElement.querySelector('#feeEdit--feeAmount');
            const feeFunctionElement = editModalElement.querySelector('#feeEdit--feeFunction');
            if (feeFunctionElement.value === '') {
                feeFunctionElement.closest('.select').classList.remove('is-success');
                feeAmountElement.classList.add('is-success');
                feeAmountElement.disabled = false;
            }
            else {
                feeFunctionElement.closest('.select').classList.add('is-success');
                feeAmountElement.classList.remove('is-success');
                feeAmountElement.disabled = true;
            }
        }
        function toggleTaxFields() {
            const taxAmountElement = editModalElement.querySelector('#feeEdit--taxAmount');
            const taxPercentageElement = editModalElement.querySelector('#feeEdit--taxPercentage');
            if (taxPercentageElement.value === '') {
                taxPercentageElement.classList.remove('is-success');
                taxAmountElement.classList.add('is-success');
                taxAmountElement.disabled = false;
            }
            else {
                taxPercentageElement.classList.add('is-success');
                taxAmountElement.classList.remove('is-success');
                taxAmountElement.disabled = true;
            }
        }
        function toggleQuantityFields() {
            const includeQuanitityValue = editModalElement.querySelector('#feeEdit--includeQuantity').value;
            editModalElement.querySelector('#feeEdit--quantityUnit').disabled = includeQuanitityValue === '';
        }
        cityssm.openHtmlModal('adminFees-editFee', {
            onshow(modalElement) {
                editModalElement = modalElement;
                modalElement.querySelector('#feeEdit--feeId').value = fee.feeId.toString();
                const feeCategoryElement = modalElement.querySelector('#feeEdit--feeCategoryId');
                for (const feeCategory of feeCategories) {
                    const optionElement = document.createElement('option');
                    optionElement.value = feeCategory.feeCategoryId.toString();
                    optionElement.textContent = feeCategory.feeCategory;
                    if (feeCategory.feeCategoryId === feeCategoryId) {
                        optionElement.selected = true;
                    }
                    feeCategoryElement.append(optionElement);
                }
                ;
                modalElement.querySelector('#feeEdit--feeName').value = fee.feeName;
                modalElement.querySelector('#feeEdit--feeDescription').value = fee.feeDescription;
                const occupancyTypeElement = modalElement.querySelector('#feeEdit--occupancyTypeId');
                for (const occupancyType of exports.occupancyTypes) {
                    const optionElement = document.createElement('option');
                    optionElement.value = occupancyType.occupancyTypeId.toString();
                    optionElement.textContent = occupancyType.occupancyType;
                    if (occupancyType.occupancyTypeId === fee.occupancyTypeId) {
                        optionElement.selected = true;
                    }
                    occupancyTypeElement.append(optionElement);
                }
                const lotTypeElement = modalElement.querySelector('#feeEdit--lotTypeId');
                for (const lotType of exports.lotTypes) {
                    const optionElement = document.createElement('option');
                    optionElement.value = lotType.lotTypeId.toString();
                    optionElement.textContent = lotType.lotType;
                    if (lotType.lotTypeId === fee.lotTypeId) {
                        optionElement.selected = true;
                    }
                    lotTypeElement.append(optionElement);
                }
                ;
                modalElement.querySelector('#feeEdit--feeAmount').value = fee.feeAmount ? fee.feeAmount.toFixed(2) : '';
                modalElement
                    .querySelector('#feeEdit--feeFunction')
                    .addEventListener('change', toggleFeeFields);
                toggleFeeFields();
                modalElement.querySelector('#feeEdit--taxAmount').value = fee.taxAmount ? fee.taxAmount.toFixed(2) : '';
                const taxPercentageElement = modalElement.querySelector('#feeEdit--taxPercentage');
                taxPercentageElement.value = fee.taxPercentage
                    ? fee.taxPercentage.toString()
                    : '';
                taxPercentageElement.addEventListener('keyup', toggleTaxFields);
                toggleTaxFields();
                const includeQuantityElement = modalElement.querySelector('#feeEdit--includeQuantity');
                if (fee.includeQuantity) {
                    includeQuantityElement.value = '1';
                }
                includeQuantityElement.addEventListener('change', toggleQuantityFields);
                modalElement.querySelector('#feeEdit--quantityUnit').value = fee.quantityUnit || '';
                toggleQuantityFields();
                if (fee.isRequired) {
                    ;
                    modalElement.querySelector('#feeEdit--isRequired').value = '1';
                }
                los.populateAliases(modalElement);
            },
            onshown(modalElement, closeModalFunction) {
                bulmaJS.toggleHtmlClipped();
                editCloseModalFunction = closeModalFunction;
                modalElement
                    .querySelector('form')
                    .addEventListener('submit', doUpdateFee);
                bulmaJS.init(modalElement);
                modalElement
                    .querySelector('.button--deleteFee')
                    .addEventListener('click', confirmDeleteFee);
            },
            onremoved: () => {
                bulmaJS.toggleHtmlClipped();
            }
        });
    }
    function moveFee(clickEvent) {
        const buttonElement = clickEvent.currentTarget;
        const feeContainerElement = buttonElement.closest('.container--fee');
        const feeId = feeContainerElement.dataset.feeId;
        cityssm.postJSON(los.urlPrefix +
            '/admin/' +
            (buttonElement.dataset.direction === 'up'
                ? 'doMoveFeeUp'
                : 'doMoveFeeDown'), {
            feeId,
            moveToEnd: clickEvent.shiftKey ? '1' : '0'
        }, (responseJSON) => {
            if (responseJSON.success) {
                feeCategories = responseJSON.feeCategories;
                renderFeeCategories();
            }
            else {
                bulmaJS.alert({
                    title: 'Error Moving Fee',
                    message: responseJSON.errorMessage || '',
                    contextualColorName: 'danger'
                });
            }
        });
    }
    /*
     * Initialize
     */
    renderFeeCategories();
})();