Custom input for amount.

This commit is contained in:
James Cole
2018-04-22 08:08:09 +02:00
parent e005fe7ce1
commit f16b2257c6
2 changed files with 102 additions and 75 deletions

View File

@@ -18,6 +18,31 @@
* along with Firefly III. If not, see <http://www.gnu.org/licenses/>.
*/
.split_amount_input {
width: 40%;
border-radius: 0;
height: 36px;
padding: 6px 12px;
background-color: #fff;
background-image: none;
border: 1px solid #ccd0d2;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-webkit-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
-webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
}
.split_amount_input:focus {
border-color: #98cbe8;
outline: 0;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(152, 203, 232, .6);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(152, 203, 232, .6);
}
#daterange {
cursor: pointer;
}

View File

@@ -184,7 +184,7 @@
<div class="box-body">
<div class="container-fluid split_row_holder">
<div class="row bg-gray-light" style="padding-bottom:3px;">
<div class="col-lg-1 col-md-1 col-sm-6 col-xs-6">&nbsp;</div>
{# HEADER #}
<div class="col-lg-1 col-md-1 col-sm-6 col-xs-6"><strong>{{ trans('list.split_number') }}</strong></div>
<div class="col-lg-3 col-md-5 col-sm-12 col-xs-12"><strong>{{ trans('list.description') }}</strong></div>
{# withdrawal and deposit have a destination. #}
@@ -195,28 +195,25 @@
{% if preFilled.what == 'deposit' %}
<div class="col-lg-2 col-md-5 col-sm-12 col-xs-12"><strong>{{ trans('list.source') }}</strong></div>
{% endif %}
<div class="col-lg-1 col-md-5 col-sm-12 col-xs-12"><strong>{{ trans('list.amount') }}</strong></div>
<div class="col-lg-1 col-md-7 col-sm-12 col-xs-12">
&nbsp;
</div>
<div class="col-lg-2 col-md-5 col-sm-12 col-xs-12"><strong>{{ trans('list.amount') }}</strong></div>
{# only withdrawal has budget #}
{% if preFilled.what == 'withdrawal' %}
<div class="col-lg-1 col-md-6 col-sm-12 col-xs-12"><strong>{{ trans('list.budget') }}</strong></div>
<div class="col-lg-2 col-md-6 col-sm-12 col-xs-12"><strong>{{ trans('list.budget') }}</strong></div>
{% endif %}
<div class="col-lg-2 col-md-6 col-sm-12 col-xs-12"><strong>{{ trans('list.category') }}</strong></div>
</div>
{# ROWS #}
{% for index, transaction in preFilled.transactions %}
<div class="row {% if loop.index0 % 2 == 1 %}bg-gray-light{% endif %} split_row" data-split="{{ loop.index0 }}">
{# button #}
<div class="col-lg-1 col-md-1 col-sm-6 col-xs-6">
<a href="#" class="btn btn-xs btn-danger remove-current-split" data-split="{{ loop.index0 }}">
<i class="fa fa-trash" data-split="{{ loop.index0 }}"></i></a>
<i class="fa fa-trash" data-split="{{ loop.index0 }}"></i> #{{ loop.index }}</a>
</div>
{# index #}
<div class="col-lg-1 col-md-1 col-sm-6 col-xs-6 count">#{{ loop.index }}</div>
{# description #}
<div class="col-lg-3 col-md-5 col-sm-12 col-xs-12">
<input autocomplete="off" type="text" name="transactions[{{ loop.index0 }}][transaction_description]"
@@ -228,7 +225,8 @@
{% if preFilled.what == 'withdrawal' %}
<div class="col-lg-2 col-md-5 col-sm-12 col-xs-12">
<input autocomplete="off" type="text" name="transactions[{{ loop.index0 }}][destination_name]"
value="{% if transaction.destination_type != 'Cash account' %}{{ transaction.destination_name }}{% endif %}" class="form-control"/>
value="{% if transaction.destination_type != 'Cash account' %}{{ transaction.destination_name }}{% endif %}"
class="form-control"/>
</div>
{% endif %}
@@ -241,23 +239,27 @@
{% endif %}
{# amount#}
{% if transaction.foreign_amount != null %}
<div class="col-lg-1 col-md-5 col-sm-12 col-xs-12">
{% else %}
<div class="col-lg-2 col-md-5 col-sm-12 col-xs-12">
{{ transaction.currency_symbol }}&nbsp;<input class="split_amount_input" type="number" name="transactions[{{ loop.index0 }}][amount]" value="{{ transaction.amount }}"
autocomplete="off" step="any">
{% if transaction.foreign_amount != null %}
{{ transaction.foreign_currency_symbol }}&nbsp;<input class="split_amount_input" type="number" name="transactions[{{ loop.index0 }}][foreign_amount]"
value="{{ transaction.foreign_amount }}" autocomplete="off" step="any">
<input type="hidden" name="transactions[{{ loop.index0 }}][foreign_currency_id]" value="{{ transaction.foreign_currency_id }}">
{% endif %}
<div class="input-group">
<div class="input-group-addon">{{ transaction.currency_symbol }}</div>
<input type="number" name="transactions[{{ loop.index0 }}][amount]" value="{{ transaction.amount }}"
class="form-control" autocomplete="off" step="any">
</div>
<input type="hidden" name="transactions[{{ loop.index0 }}][transaction_currency_id]"
value="{{ transaction.transaction_currency_id }}">
</div>
{# foreign amount #}
{#
{% if transaction.foreign_amount != null %}
<div class="col-lg-1 col-md-7 col-sm-12 col-xs-12">
<div class="col-lg-1 col-md-5 col-sm-12 col-xs-12" style="border:1px red solid;">
{% else %}
<div class="col-lg-2 col-md-5 col-sm-12 col-xs-12" style="border:1px blue solid;">
{% endif %}
{% if transaction.foreign_amount != null %}
<div class="col-lg-1 col-md-7 col-sm-12 col-xs-12" style="border:1px green solid;">
<div class="input-group">
<div class="input-group-addon">{{ transaction.foreign_currency_symbol }}</div>
<input type="number" name="transactions[{{ loop.index0 }}][foreign_amount]"
@@ -270,10 +272,10 @@
</div>
{% endif %}
#}
{# budget #}
{% if preFilled.what == 'withdrawal' %}
<div class="col-lg-1 col-md-6 col-sm-12 col-xs-12">
<div class="col-lg-2 col-md-6 col-sm-12 col-xs-12">
<select class="form-control" name="transactions[{{ loop.index0 }}][budget_id]">
{% for key, budget in budgets %}
<option label="{{ budget }}" value="{{ key }}"
@@ -286,7 +288,7 @@
{# category #}
<div class="col-lg-2 col-md-6 col-sm-12 col-xs-12">
<input autocomplete="off" type="text" name="transactions[{{ loop.index0 }}][category_name]"
value="{{ transaction.category_name}}"
value="{{ transaction.category_name }}"
class="form-control"/>
</div>
</div>