mirror of
https://github.com/firefly-iii/firefly-iii.git
synced 2025-10-26 05:26:17 +00:00
Split form in parts, add "edit" page.
This commit is contained in:
James Cole
@@ -0,0 +1,32 @@
|
||||
<div class="row mb-3">
|
||||
<div class="col-sm-3">
|
||||
<template x-if="loadingCurrencies">
|
||||
<span class="form-control-plaintext"><em
|
||||
class="fa-solid fa-spinner fa-spin"></em></span>
|
||||
</template>
|
||||
<template x-if="!loadingCurrencies">
|
||||
<select class="form-control" :id="'currency_code_' + index"
|
||||
x-model="transaction.currency_code"
|
||||
>
|
||||
<template x-for="currency in nativeCurrencies">
|
||||
<option :selected="currency.id == defaultCurrency.id"
|
||||
:label="currency.name" :value="currency.code"
|
||||
x-text="currency.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
</template>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<input type="number" step="any" min="0"
|
||||
:id="'amount_' + index"
|
||||
:data-index="index"
|
||||
:class="{'is-invalid': transaction.errors.amount.length > 0, 'input-mask' : true, 'form-control': true}"
|
||||
x-model="transaction.amount" data-inputmask="currency"
|
||||
@change="changedAmount"
|
||||
placeholder="0.00">
|
||||
<template x-if="transaction.errors.amount.length > 0">
|
||||
<div class="invalid-feedback"
|
||||
x-text="transaction.errors.amount[0]"></div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'attachments_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-file-import"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="file" multiple
|
||||
class="form-control attachments"
|
||||
:id="'attachments_' + index"
|
||||
:data-index="index"
|
||||
name="attachments[]"
|
||||
placeholder="{{ __('firefly.category') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,25 @@
|
||||
<template x-if="transactionType != 'deposit' && transactionType != 'transfer'">
|
||||
<div class="row mb-3">
|
||||
<label :for="'budget_id_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-chart-pie"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<template x-if="loadingBudgets">
|
||||
<span class="form-control-plaintext"><em
|
||||
class="fa-solid fa-spinner fa-spin"></em></span>
|
||||
</template>
|
||||
<template x-if="!loadingBudgets">
|
||||
<select class="form-control"
|
||||
:id="'budget_id_' + index"
|
||||
x-model="transaction.budget_id"
|
||||
>
|
||||
<template x-for="budget in budgets">
|
||||
<option :label="budget.name" :value="budget.id"
|
||||
x-text="budget.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'category_name_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-bookmark"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="search"
|
||||
class="form-control ac-category"
|
||||
:id="'category_name_' + index"
|
||||
x-model="transaction.category_name"
|
||||
:data-index="index"
|
||||
placeholder="{{ __('firefly.category') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,16 @@
|
||||
<template x-for="dateField in dateFields">
|
||||
<div class="row mb-1">
|
||||
<label :for="dateField + '_date_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-calendar-alt" :title="dateField"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="date"
|
||||
class="form-control"
|
||||
:id="dateField + '_date_' + index"
|
||||
x-model="transaction[dateField]"
|
||||
:data-index="index"
|
||||
placeholder="">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,11 @@
|
||||
<div class="row mb-3">
|
||||
<label for="date_0" class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-calendar"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="datetime-local" class="form-control" :id="'date_' + index"
|
||||
@change="detectTransactionType"
|
||||
x-model="transaction.date"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,13 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'description_' + index" class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<em title="TODO explain me" class="fa-solid fa-font"></em>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text" class="form-control ac-description"
|
||||
:id="'description_' + index"
|
||||
@change="detectTransactionType"
|
||||
x-model="transaction.description"
|
||||
:data-index="index"
|
||||
placeholder="{{ __('firefly.description') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'dest_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-arrow-left"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text"
|
||||
class="form-control ac-dest"
|
||||
:id="'dest_' + index"
|
||||
x-model="transaction.destination_account.alpine_name"
|
||||
:data-index="index"
|
||||
placeholder="{{ __('firefly.destination_account') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,21 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'external_url_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-link"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
:id="'external_url_' + index"
|
||||
x-model="transaction.external_url"
|
||||
:data-index="index"
|
||||
:class="{'is-invalid': transaction.errors.external_url.length > 0, 'form-control': true}"
|
||||
placeholder="{{ __('firefly.external_url') }}" />
|
||||
<template x-if="transaction.errors.external_url.length > 0">
|
||||
<div class="invalid-feedback"
|
||||
x-text="transaction.errors.external_url[0]">
|
||||
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,45 @@
|
||||
<template x-if="foreignAmountEnabled">
|
||||
<div class="row mb-3">
|
||||
<div class="col-sm-3">
|
||||
<label class="form-label"> </label>
|
||||
<template x-if="loadingCurrencies">
|
||||
<span class="form-control-plaintext"><em
|
||||
class="fa-solid fa-spinner fa-spin"></em></span>
|
||||
</template>
|
||||
<template x-if="!loadingCurrencies">
|
||||
<select class="form-control"
|
||||
:id="'foreign_currency_code_' + index"
|
||||
x-model="transaction.foreign_currency_code"
|
||||
>
|
||||
<template x-for="currency in foreignCurrencies">
|
||||
<option :label="currency.name" :value="currency.code"
|
||||
x-text="currency.name"></option>
|
||||
</template>
|
||||
</select>
|
||||
</template>
|
||||
</div>
|
||||
<div class="col-sm-9">
|
||||
<template x-if="transactionType != 'transfer'">
|
||||
<label class="small form-label">Amount in foreign amount, if
|
||||
any</label>
|
||||
</template>
|
||||
<template x-if="transactionType == 'transfer'">
|
||||
<label class="small form-label">Amount in currency of
|
||||
destination
|
||||
account</label>
|
||||
</template>
|
||||
<input type="number" step="any" min="0"
|
||||
:id="'amount_' + index"
|
||||
:data-index="index"
|
||||
:class="{'is-invalid': transaction.errors.foreign_amount.length > 0, 'input-mask' : true, 'form-control': true}"
|
||||
x-model="transaction.foreign_amount"
|
||||
data-inputmask="currency"
|
||||
@change="changedAmount"
|
||||
placeholder="0.00">
|
||||
<template x-if="transaction.errors.foreign_amount.length > 0">
|
||||
<div class="invalid-feedback"
|
||||
x-text="transaction.errors.foreign_amount[0]"></div>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'internal_reference_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-anchor"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="search"
|
||||
class="form-control"
|
||||
:id="'internal_reference_' + index"
|
||||
x-model="transaction.internal_reference"
|
||||
:data-index="index"
|
||||
placeholder="{{ __('firefly.internal_reference') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,18 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'map_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-earth-europe"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<div :id="'location_map_' + index" style="height:300px;" :data-index="index"></div>
|
||||
<span class="muted small">
|
||||
<template x-if="!transaction.hasLocation">
|
||||
<span>Tap the map to add a location</span>
|
||||
</template>
|
||||
<template x-if="transaction.hasLocation">
|
||||
<a :data-index="index" href="#" @click="clearLocation">Clear point</a>
|
||||
</template>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
11
resources/views/v2/partials/form/transaction/notes.blade.php
Normal file
11
resources/views/v2/partials/form/transaction/notes.blade.php
Normal file
@@ -0,0 +1,11 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'notes_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-font"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<textarea class="form-control" :id="'notes_' + index"
|
||||
x-model="transaction.notes"
|
||||
placeholder="{{ __('firefly.notes') }}"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,30 @@
|
||||
<template
|
||||
x-if="transactionType != 'deposit' && transactionType != 'withdrawal'">
|
||||
<div class="row mb-3">
|
||||
<label :for="'piggy_bank_id_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-piggy-bank"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<template x-if="loadingPiggyBanks">
|
||||
<span class="form-control-plaintext"><em
|
||||
class="fa-solid fa-spinner fa-spin"></em></span>
|
||||
</template>
|
||||
<template x-if="!loadingPiggyBanks">
|
||||
<select class="form-control"
|
||||
:id="'piggy_bank_id_' + index"
|
||||
x-model="transaction.piggy_bank_id">
|
||||
<template x-for="group in piggyBanks">
|
||||
<optgroup :label="group.name">
|
||||
<template x-for="piggyBank in group.piggyBanks">
|
||||
<option :label="piggyBank.name"
|
||||
:value="piggyBank.id"
|
||||
x-text="piggyBank.name"></option>
|
||||
</template>
|
||||
</optgroup>
|
||||
</template>
|
||||
</select>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,14 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'source_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-arrow-right"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<input type="text"
|
||||
class="form-control ac-source"
|
||||
:id="'source_' + index"
|
||||
x-model="transaction.source_account.alpine_name"
|
||||
:data-index="index"
|
||||
placeholder="{{ __('firefly.source_account') }}">
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,31 @@
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" x-model="returnHereButton" type="checkbox"
|
||||
id="returnButton">
|
||||
<label class="form-check-label" for="returnButton">
|
||||
Return here to create a new transaction
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" x-model="resetButton" type="checkbox"
|
||||
id="resetButton" :disabled="!returnHereButton">
|
||||
<label class="form-check-label" for="resetButton">
|
||||
Reset the form after returning
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="rulesButton"
|
||||
:checked="rulesButton">
|
||||
<label class="form-check-label" for="rulesButton">
|
||||
Run rules on this transaction
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div class="form-check">
|
||||
<input class="form-check-input" type="checkbox" id="webhookButton"
|
||||
:checked="webhookButton">
|
||||
<label class="form-check-label" for="webhookButton">
|
||||
Run webhooks on this transaction
|
||||
</label>
|
||||
</div>
|
||||
@@ -0,0 +1,30 @@
|
||||
<template x-if="transactionType != 'transfer' && transactionType != 'deposit'">
|
||||
<div class="row mb-3">
|
||||
<label :for="'bill_id_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-calendar"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<template x-if="loadingSubscriptions">
|
||||
<span class="form-control-plaintext"><em
|
||||
class="fa-solid fa-spinner fa-spin"></em></span>
|
||||
</template>
|
||||
<template x-if="!loadingSubscriptions">
|
||||
<select class="form-control"
|
||||
:id="'bill_id_' + index"
|
||||
x-model="transaction.bill_id">
|
||||
<template x-for="group in subscriptions">
|
||||
<optgroup :label="group.name">
|
||||
<template
|
||||
x-for="subscription in group.subscriptions">
|
||||
<option :label="subscription.name"
|
||||
:value="subscription.id"
|
||||
x-text="subscription.name"></option>
|
||||
</template>
|
||||
</optgroup>
|
||||
</template>
|
||||
</select>
|
||||
</template>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
16
resources/views/v2/partials/form/transaction/tags.blade.php
Normal file
16
resources/views/v2/partials/form/transaction/tags.blade.php
Normal file
@@ -0,0 +1,16 @@
|
||||
<div class="row mb-3">
|
||||
<label :for="'tags_' + index"
|
||||
class="col-sm-1 col-form-label d-none d-sm-block">
|
||||
<i class="fa-solid fa-tag"></i>
|
||||
</label>
|
||||
<div class="col-sm-10">
|
||||
<select
|
||||
class="form-select ac-tags"
|
||||
:id="'tags_' + index"
|
||||
x-model="transaction.tags"
|
||||
:name="'tags['+index+'][]'"
|
||||
multiple>
|
||||
<option value="">Type a tag...</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user