@css(node_modules/tom-select/dist/css/tom-select.min.css)
@js(node_modules/tom-select/dist/js/tom-select.base.min.js)
@js(js/communities/transaction.js)

@extends(templates/layout_normal)

@section(main)
    <h2>
        <a href="<?= Container::$routeCollection->getRoute('community')->generateLink(['communitySlug' => $community->getSlug()]) ?>"><?= $community->getName() ?></a> »
        <a href="<?= Container::$routeCollection->getRoute('community.transactions')->generateLink(['communitySlug' => $community->getSlug()]) ?>">Transactions</a> »
        <?php if (isset($event)): ?>
            <a href="<?= Container::$routeCollection->getRoute('community.events')->generateLink(['communitySlug' => $community->getSlug()]) ?>">Events</a> »
            <a href="<?= Container::$routeCollection->getRoute('community.event')->generateLink(['communitySlug' => $community->getSlug(), 'eventSlug' => $event->getSlug()]) ?>"><?= $event->getTitle() ?></a> »
        <?php endif; ?>
        <?php if (isset($transaction)): ?>
            Edit transaction
        <?php else: ?>
            New transaction
        <?php endif; ?>
    </h2>
    <div class="box compactBox">
        <?php
        $formAction = isset($transaction) ?
            Container::$routeCollection->getRoute('community.transactions.edit-action')->generateLink(['communitySlug' => $community->getSlug(), 'transactionId' => $transaction->getId()]) :
            Container::$routeCollection->getRoute('community.transactions.new-action')->generateLink(['communitySlug' => $community->getSlug()]);
        ?>
        <form id="transactionForm" action="<?= $formAction ?>" method="post" data-redirect-on-success="<?= Container::$routeCollection->getRoute('community.transactions')->generateLink(['communitySlug' => $community->getSlug(), 'event' => isset($event) ? $event->getSlug() : null]) ?>">
            <p class="formLabel">Event</p>
            <select name="event_id">
                <option value="">[none]</option>
                <?php if (isset($event)): ?>
                    <option value="<?= $event->getId() ?>" selected><?= $event->getTitle() ?></option>
                <?php endif; ?>
            </select>
            <p class="formLabel marginTop">Payer</p>
            <select class="big fullWidth" name="payer_user_id" required>
                <option value="" hidden></option>
                <?php foreach ($members as $member): ?>
                    <option value="<?= $member->getUser()->getId() ?>" <?= isset($transaction) && $transaction->getPayerUserId() === $member->getUser()->getId() ? 'selected' : '' ?>><?= $member->getUser()->getDisplayName() ?></option>
                <?php endforeach; ?>
            </select>
            <p class="formLabel marginTop">Payee(s)</p>
            <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(100px, 1fr)); grid-gap: 10px;">
                <?php foreach ($members as $member): ?>
                    <div style="text-align: center;">
                        <input id="payee_<?= $member->getUserId() ?>" type="checkbox" name="payee_user_ids[]" value="<?= $member->getUserId() ?>" <?= !isset($transaction) || count($payeeUserIds) === 0 || in_array($member->getUserId(), $payeeUserIds) ? 'checked' : '' ?>><!--
                     --><label for="payee_<?= $member->getUserId() ?>"><?= $member->getUser()->getDisplayName() ?></label>
                    </div>
                <?php endforeach; ?>
            </div>
            <p class="formLabel marginTop">Description</p>
            <input type="text" class="text big fullWidth" name="description" value="<?= isset($transaction) ? $transaction->getDescription() : '' ?>" required>
            <p class="formLabel marginTop">Sum</p>
            <input type="number" class="text big fullWidth" name="sum" value="<?= isset($transaction) ? $transaction->getSum() : '' ?>" min="0" step="0.000000001" required>
            <p class="formLabel marginTop">Currency</p>
            <select class="big fullWidth" name="currency_id" required>
                <option value="" hidden></option>
                <?php foreach ($currencies as $currency): ?>
                    <option value="<?= $currency->getId() ?>" <?= isset($transaction) && $transaction->getCurrencyId() === $currency->getId() ? 'selected' : '' ?>><?= $currency->getCode() ?></option>
                <?php endforeach; ?>
            </select>
            <p class="formLabel marginTop">Time</p>
            <input type="datetime-local" class="text big fullWidth" name="time" value="<?= isset($transaction) ? $transaction->getTimeDate()->format('Y-m-d\TH:i') : (new DateTime())->format('Y-m-d\TH:i') ?>" required>
            <p class="formError justify marginTop"></p>
            <div class="right marginTop" style="font-size: 0;">
                <button type="submit" name="submit_button"><?= isset($transaction) ? '<i class="fa-regular fa-floppy-disk"></i> Save' : '<i class="fa-regular fa-plus"></i> Create' ?></button>
                <?php if (isset($transaction)): ?>
                    <button type="submit" form="deleteTransaction"  name="submit_button" data-confirmation="Are you sure you want to delete this transaction?" class="red marginLeft"><i class="fa-regular fa-trash-can"></i> Delete</button>
                <?php endif; ?>
            </div>
        </form>
        <?php if (isset($transaction)): ?>
            <form id="deleteTransaction" action="<?= Container::$routeCollection->getRoute('community.transactions.delete-action')->generateLink(['communitySlug' => $community->getSlug(), 'transactionId' => $transaction->getId()]) ?>" method="post" data-redirect-on-success="<?= Container::$routeCollection->getRoute('community.transactions')->generateLink(['communitySlug' => $community->getSlug()]) ?>"></form>
        <?php endif; ?>
    </div>
@endsection

@section(pageScript)
<script>
    var searchEventUrl = '<?= Container::$routeCollection->getRoute('community.events.search')->generateLink(['communitySlug' => $community->getSlug(), 'q' => 'QUERY']) ?>';
</script>
@endsection