{% extends "./layout/default.twig" %}

{% block breadcrumbs %}
    {{ Breadcrumbs.renderIfExists }}
{% endblock %}
{% block content %}
    {{ Form.open({'class' : 'form-horizontal','id' : 'store','url' : route('split.journal.from-store.post')}) }}
    <input type="hidden" name="what" value="{{ data.what }}" />
    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">{{ ('split_title_'~data.what)|_ }}</h3>

                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body">
                    <p>
                        {{ ('split_intro_one_'~data.what)|_ }}
                    </p>
                    <p>
                        {{ ('split_intro_two_'~data.what)|_ }}
                    </p>
                    <p>
                        {% if data.what =='deposit' %}
                            {{ trans(('firefly.split_intro_three_'~data.what), {total: 500|formatAmount, split_one: 425|formatAmount, split_two: 75|formatAmount})|raw }}
                        {% else %}
                            {{ trans(('firefly.split_intro_three_'~data.what), {total: 20|formatAmount, split_one: 15|formatAmount, split_two: 5|formatAmount})|raw }}
                        {% endif %}
                    </p>
                    <!--
                    <p>
                        Firefly supports the "splitting" of an [expense / withdrawal / transfer].

                        It means that the amount of money you've spent/earned/transfered is divided between
                        several source accounts, destination accounts or budgets.

                        Example for withdrawals: split your 20,- groceries so you pay 15,- from your "daily groceries" budget
                        and 5,- from your "cigarettes" budget.

                        Example for deposits: split your 500,- salary so that 450,- is categorized "salary" and 50,- is categorized "reimbursed expenses".

                        Example for transfers: split your 100,- transfer so that 50,- is put in the piggy bank "new couch" and 50,- is not.
                    </p>
                    -->
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-6 col-md-6 col-sm-6">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">{{ 'transaction_meta_data'|_ }}</h3>

                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body">
                    {{ ExpandedForm.text('journal_description', data.description) }}
                    {{ ExpandedForm.select('currency', currencies, data.amount_currency_id_amount) }}
                    {{ ExpandedForm.staticText('amount', data.amount|formatAmount) }}
                    <!-- show static source if withdrawal or transfer -->
                    {% if data.what == 'withdrawal' or data.what == 'transfer' %}
                        {{ ExpandedForm.staticText('asset_source_account', assetAccounts[data.source_account_id]) }}
                        <input type="hidden" name="source_account_id" value="{{ data.source_account_id }}"/>
                    {% endif %}
                    <!-- show static source if deposit: -->
                    {% if data.what == 'deposit' %}
                    {{ ExpandedForm.staticText('revenue_account', data.source_account_name) }}
                        <input type="hidden" name="source_account_name" value="{{ data.source_account_name }}"/>
                    {% endif %}
                    <!-- show static destination if transfer -->
                    {% if data.what == 'transfer' %}
                        {{ ExpandedForm.staticText('asset_destination_account', assetAccounts[data.destination_account_id]) }}
                        <input type="hidden" name="destination_account_id" value="{{ data.destination_account_id }}"/>
                    {% endif %}
                </div>
            </div>
        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">{{ 'transaction_dates'|_ }}</h3>

                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body">
                    {{ ExpandedForm.date('date', data.date) }}

                    {{ ExpandedForm.date('interest_date', data.interest_date) }}

                    {{ ExpandedForm.date('book_date', data.book_date) }}

                    {{ ExpandedForm.date('process_date', data.process_date) }}
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-lg-12 col-md-12 col-sm-12">
            <div class="box">
                <div class="box-header with-border">
                    <h3 class="box-title">{{ 'splits'|_ }}</h3>

                    <div class="box-tools pull-right">
                        <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button>
                    </div>
                </div>
                <div class="box-body">
                    <p>
                        {{ ('split_table_intro_'~data.what)|_ }}
                    </p>
                    <table class="table table-bordered table-condensed table-striped split-table">
                        <thead>
                        <tr>
                            <th>{{ trans('list.split_number') }}</th>
                            <th>{{ trans('list.description') }}</th>
                            <!-- split the source of a deposit -->
                            <!--
                            {% if data.what == 'deposit' %}
                                <th>{{ trans('list.source') }}</th>
                            {% endif %}
                            -->
                            <!-- split where a withdrawal is going -->
                            <!-- split where a deposit is going -->
                            {% if data.what == 'withdrawal' or data.what == 'deposit' %}
                                <th>{{ trans('list.destination') }}</th>
                            {% endif %}
                            <th>{{ trans('list.amount') }}</th>
                            {% if data.what == 'withdrawal' %}
                                <th>{{ trans('list.budget') }}</th>
                            {% endif %}
                            <th>{{ trans('list.category') }}</th>
                            {% if data.what == 'transfer' %}
                                <th>{{ trans('list.piggy_bank') }}</th>
                            {% endif %}
                        </tr>
                        </thead>
                        <tbody>
                        <tr class="initial-row">
                            <td class="count">#1</td>
                            <td>{{ Form.input('text', 'description[]', data.description, {class: 'form-control'}) }}</td>

                            <!-- withdrawal has several destination names. -->
                            {% if data.what == 'withdrawal' %}
                                <td>
                                    {{ Form.input('text', 'destination_account_name[]', data.destination_account_name, {class: 'form-control'}) }}
                                </td>
                            {% endif %}

                            <!-- deposit has several destination id's -->
                            {% if data.what == 'deposit' %}
                                <td>
                                    {{ Form.select('destination_account_id[]', assetAccounts, data.destination_account_id, {class: 'form-control'}) }}
                                </td>
                            {% endif %}



                            <td style="width:10%;">
                                {{ Form.input('number', 'amount[]', data.amount, {class: 'form-control', autocomplete: 'off', step: 'any', min:'0.01'}) }}
                            </td>
                            {% if data.what == 'withdrawal' %}
                                <td>
                                    {{ Form.select('budget[]', budgets, data.budget_id, {class: 'form-control'}) }}
                                </td>
                            {% endif %}
                            <td>
                                {{ Form.input('text', 'category[]', data.category, {class: 'form-control'}) }}
                            </td>
                        </tr>
                        </tbody>
                    </table>
                    <p>
                        <br/>
                        <a href="#" class="btn btn-default btn-do-split"><i class="fa fa-plus-circle"></i> {{ 'add_another_split'|_ }}</a>
                    </p>
                    <p class="pull-right">
                        <button type="submit" id="transaction-btn" class="btn btn-success pull-right">
                            {{ ('store_splitted_'~data.what)|_ }}
                        </button>
                    </p>
                </div>
            </div>
        </div>
    </div>
    </form>

{% endblock %}
{% block scripts %}
    <script type="text/javascript">
        var originalSum = {{ data.amount }};
        var what = "{{ data.what }}";
    </script>
    <script type="text/javascript" src="js/lib/bootstrap3-typeahead.min.js"></script>
    <script type="text/javascript" src="js/ff/transactions/create-edit.js"></script>
    <script type="text/javascript" src="js/ff/split/journal/from-store.js"></script>
{% endblock %}
{% block styles %}
{% endblock %}