mirror of
https://github.com/maybe-finance/maybe.git
synced 2025-08-07 14:35:23 +02:00
Transfer and Payment auto-matching, model and UI improvements (#1585)
* Transfer data model migration * Transfers and payment modeling and UI improvements * Fix CI * Transfer matching flow * Better UI for transfers * Auto transfer matching, approve, reject flow * Mark transfers created from form as confirmed * Account filtering * Excluded rejected transfers from calculations * Calculation tweaks with transfer exclusions * Clean up migration
This commit is contained in:
Zach Gollwitzer
GitHub
parent
46e129308f
commit
307a3687e8
78 changed files with 1161 additions and 682 deletions
|
|
@ -84,7 +84,7 @@
|
|||
</div>
|
||||
|
||||
<div class="p-4 bg-white rounded-bl-lg rounded-br-lg">
|
||||
<%= render "pagination", pagy: @pagy, current_path: account_path(@account, page: params[:page]) %>
|
||||
<%= render "pagination", pagy: @pagy, current_path: account_path(@account, page: params[:page], tab: params[:tab]) %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
{ label: t(".type"), selected: type },
|
||||
{ data: {
|
||||
action: "trade-form#changeType",
|
||||
trade_form_url_param: new_account_trade_path(account_id: entry.account_id),
|
||||
trade_form_url_param: new_account_trade_path(account_id: entry.account&.id || entry.account_id),
|
||||
trade_form_key_param: "type",
|
||||
}} %>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<% trade, account = entry.account_trade, entry.account %>
|
||||
|
||||
<div class="grid grid-cols-12 items-center <%= entry.excluded ? "text-gray-400 bg-gray-25" : "text-gray-900" %> text-sm font-medium p-4">
|
||||
<div class="col-span-8 flex items-center gap-4">
|
||||
<div class="col-span-6 flex items-center gap-4">
|
||||
<% if selectable %>
|
||||
<%= check_box_tag dom_id(entry, "selection"),
|
||||
class: "maybe-checkbox maybe-checkbox--light",
|
||||
|
|
@ -30,6 +30,10 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-span-2 flex items-center">
|
||||
<%= render "categories/badge", category: trade_category %>
|
||||
</div>
|
||||
|
||||
<div class="col-span-2 justify-self-end font-medium text-sm">
|
||||
<%= content_tag :p,
|
||||
format_money(-entry.amount_money),
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<fieldset class="bg-gray-50 rounded-lg p-1 grid grid-flow-col justify-stretch gap-x-2">
|
||||
<%= radio_tab_tag form: f, name: :nature, value: :outflow, label: t(".expense"), icon: "minus-circle", checked: params[:nature] == "outflow" || params[:nature].nil? %>
|
||||
<%= radio_tab_tag form: f, name: :nature, value: :inflow, label: t(".income"), icon: "plus-circle", checked: params[:nature] == "inflow" %>
|
||||
<%= link_to new_account_transfer_path, data: { turbo_frame: :modal }, class: "flex px-4 py-1 rounded-lg items-center space-x-2 justify-center text-gray-400 group-has-[:checked]:bg-white group-has-[:checked]:text-gray-800 group-has-[:checked]:shadow-sm" do %>
|
||||
<%= link_to new_transfer_path, data: { turbo_frame: :modal }, class: "flex px-4 py-1 rounded-lg items-center space-x-2 justify-center text-gray-400 group-has-[:checked]:bg-white group-has-[:checked]:text-gray-800 group-has-[:checked]:shadow-sm" do %>
|
||||
<%= lucide_icon "arrow-right-left", class: "w-5 h-5" %>
|
||||
<%= tag.span t(".transfer") %>
|
||||
<% end %>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
</span>
|
||||
</h3>
|
||||
|
||||
<% if entry.marked_as_transfer? %>
|
||||
<% if entry.account_transaction.transfer? %>
|
||||
<%= lucide_icon "arrow-left-right", class: "text-gray-500 mt-1 w-5 h-5" %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,26 +8,6 @@
|
|||
<div class="flex items-center gap-1 text-gray-500">
|
||||
<%= turbo_frame_tag "bulk_transaction_edit_drawer" %>
|
||||
|
||||
<%= form_with url: mark_transfers_account_transactions_path,
|
||||
scope: "bulk_update",
|
||||
data: {
|
||||
turbo_frame: "_top",
|
||||
turbo_confirm: {
|
||||
title: t(".mark_transfers"),
|
||||
body: t(".mark_transfers_message"),
|
||||
accept: t(".mark_transfers_confirm"),
|
||||
}
|
||||
} do |f| %>
|
||||
<button id="bulk-transfer-btn"
|
||||
type="button"
|
||||
data-bulk-select-scope-param="bulk_update"
|
||||
data-action="bulk-select#submitBulkRequest"
|
||||
class="p-1.5 group hover:bg-gray-700 flex items-center justify-center rounded-md"
|
||||
title="Mark as transfer">
|
||||
<%= lucide_icon "arrow-right-left", class: "w-5 group-hover:text-white" %>
|
||||
</button>
|
||||
<% end %>
|
||||
|
||||
<%= link_to bulk_edit_account_transactions_path,
|
||||
class: "p-1.5 group hover:bg-gray-700 flex items-center justify-center rounded-md",
|
||||
title: "Edit",
|
||||
|
|
|
|||
|
|
@ -1,10 +1,11 @@
|
|||
<%# locals: (entry:, selectable: true, balance_trend: nil) %>
|
||||
<% transaction, account = entry.account_transaction, entry.account %>
|
||||
|
||||
<div class="grid grid-cols-12 items-center <%= entry.excluded ? "text-gray-400 bg-gray-25" : "text-gray-900" %> text-sm font-medium p-4">
|
||||
<div class="pr-10 flex items-center gap-4 col-span-6">
|
||||
<div class="grid grid-cols-12 items-center text-gray-900 text-sm font-medium p-4">
|
||||
<div class="pr-10 flex items-center gap-4 <%= balance_trend ? "col-span-6" : "col-span-8" %>">
|
||||
<% if selectable %>
|
||||
<%= check_box_tag dom_id(entry, "selection"),
|
||||
disabled: entry.account_transaction.transfer?,
|
||||
class: "maybe-checkbox maybe-checkbox--light",
|
||||
data: { id: entry.id, "bulk-select-target": "row", action: "bulk-select#toggleRowSelection" } %>
|
||||
<% end %>
|
||||
|
|
@ -18,49 +19,44 @@
|
|||
<% end %>
|
||||
|
||||
<div class="truncate">
|
||||
<% if entry.new_record? %>
|
||||
<%= content_tag :p, entry.display_name %>
|
||||
<% else %>
|
||||
<%= link_to entry.display_name,
|
||||
entry.transfer.present? ? account_transfer_path(entry.transfer) : account_entry_path(entry),
|
||||
<div class="space-y-0.5">
|
||||
<div class="flex items-center gap-1">
|
||||
<% if entry.new_record? %>
|
||||
<%= content_tag :p, entry.display_name %>
|
||||
<% else %>
|
||||
<%= link_to entry.display_name,
|
||||
entry.account_transaction.transfer? ? transfer_path(entry.account_transaction.transfer) : account_entry_path(entry),
|
||||
data: { turbo_frame: "drawer", turbo_prefetch: false },
|
||||
class: "hover:underline hover:text-gray-800" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% if entry.excluded %>
|
||||
<span title="One-time <%= entry.amount.negative? ? "income" : "expense" %> (excluded from averages)">
|
||||
<%= lucide_icon "asterisk", class: "w-4 h-4 shrink-0 text-orange-500" %>
|
||||
</span>
|
||||
<% end %>
|
||||
|
||||
<% if entry.account_transaction.transfer? %>
|
||||
<%= render "account/transactions/transfer_match", entry: entry %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="text-gray-500 text-xs font-normal">
|
||||
<% if entry.account_transaction.transfer? %>
|
||||
<%= render "transfers/account_links", transfer: entry.account_transaction.transfer, is_inflow: entry.account_transaction.transfer_as_inflow.present? %>
|
||||
<% else %>
|
||||
<%= link_to entry.account.name, account_path(entry.account, tab: "transactions"), data: { turbo_frame: "_top" }, class: "hover:underline" %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<% if unconfirmed_transfer?(entry) %>
|
||||
<%= render "account/transfers/transfer_toggle", entry: entry %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<% if entry.transfer.present? %>
|
||||
<% unless balance_trend %>
|
||||
<div class="col-span-2"></div>
|
||||
<% end %>
|
||||
|
||||
<div class="col-span-2">
|
||||
<%= render "account/transfers/account_logos", transfer: entry.transfer, outflow: entry.amount.positive? %>
|
||||
</div>
|
||||
<% else %>
|
||||
<div class="flex items-center gap-1 col-span-2">
|
||||
<%= render "categories/menu", transaction: transaction %>
|
||||
</div>
|
||||
|
||||
<% unless balance_trend %>
|
||||
<%= tag.div class: "col-span-2 overflow-hidden truncate" do %>
|
||||
<% if entry.new_record? %>
|
||||
<%= tag.p account.name %>
|
||||
<% else %>
|
||||
<%= link_to account.name,
|
||||
account_path(account, tab: "transactions"),
|
||||
data: { turbo_frame: "_top" },
|
||||
class: "hover:underline" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
<div class="flex items-center gap-1 col-span-2">
|
||||
<%= render "account/transactions/transaction_category", entry: entry %>
|
||||
</div>
|
||||
|
||||
<div class="col-span-2 ml-auto">
|
||||
<%= content_tag :p,
|
||||
|
|
|
|||
|
|
@ -0,0 +1,9 @@
|
|||
<%# locals: (entry:) %>
|
||||
|
||||
<div id="<%= dom_id(entry, "category_menu") %>">
|
||||
<% if entry.account_transaction.transfer? %>
|
||||
<%= render "categories/badge", category: entry.account_transaction.transfer.payment? ? payment_category : transfer_category %>
|
||||
<% else %>
|
||||
<%= render "categories/menu", transaction: entry.account_transaction %>
|
||||
<% end %>
|
||||
</div>
|
||||
27
app/views/account/transactions/_transfer_match.html.erb
Normal file
27
app/views/account/transactions/_transfer_match.html.erb
Normal file
|
|
@ -0,0 +1,27 @@
|
|||
<%# locals: (entry:) %>
|
||||
|
||||
<div id="<%= dom_id(entry, "transfer_match") %>" class="flex items-center gap-1">
|
||||
<% if entry.account_transaction.transfer.confirmed? %>
|
||||
<span title="<%= entry.account_transaction.transfer.payment? ? "Payment" : "Transfer" %> is confirmed">
|
||||
<%= lucide_icon "link-2", class: "w-4 h-4 text-indigo-600" %>
|
||||
</span>
|
||||
<% elsif entry.account_transaction.transfer.pending? %>
|
||||
<span class="inline-flex items-center rounded-full bg-indigo-50 px-2 py-0.5 text-xs font-medium text-indigo-700">
|
||||
Auto-matched
|
||||
</span>
|
||||
|
||||
<%= button_to transfer_path(entry.account_transaction.transfer, transfer: { status: "confirmed" }),
|
||||
method: :patch,
|
||||
class: "text-gray-500 hover:text-gray-800 flex items-center justify-center",
|
||||
title: "Confirm match" do %>
|
||||
<%= lucide_icon "check", class: "w-4 h-4 text-indigo-400 hover:text-indigo-600" %>
|
||||
<% end %>
|
||||
|
||||
<%= button_to transfer_path(entry.account_transaction.transfer, transfer: { status: "rejected" }),
|
||||
method: :patch,
|
||||
class: "text-gray-500 hover:text-gray-800 flex items-center justify-center",
|
||||
title: "Reject match" do %>
|
||||
<%= lucide_icon "x", class: "w-4 h-4 text-gray-400 hover:text-gray-600" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
@ -19,7 +19,7 @@
|
|||
max: Date.current,
|
||||
"data-auto-submit-form-target": "auto" %>
|
||||
|
||||
<% unless @entry.marked_as_transfer? %>
|
||||
<% unless @entry.account_transaction.transfer? %>
|
||||
<div class="flex items-center gap-2">
|
||||
<%= f.select :nature,
|
||||
[["Expense", "outflow"], ["Income", "inflow"]],
|
||||
|
|
@ -32,27 +32,7 @@
|
|||
min: 0,
|
||||
value: @entry.amount.abs %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<%= f.select :account,
|
||||
options_for_select(
|
||||
Current.family.accounts.alphabetically.pluck(:name, :id),
|
||||
@entry.account_id
|
||||
),
|
||||
{ label: t(".account_label") },
|
||||
{ disabled: true } %>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<!-- Details Section -->
|
||||
<%= disclosure t(".details") do %>
|
||||
<div class="pb-4">
|
||||
<%= styled_form_with model: @entry,
|
||||
url: account_transaction_path(@entry),
|
||||
class: "space-y-2",
|
||||
data: { controller: "auto-submit-form" } do |f| %>
|
||||
<% unless @entry.marked_as_transfer? %>
|
||||
<%= f.fields_for :entryable do |ef| %>
|
||||
<%= ef.collection_select :category_id,
|
||||
Current.family.categories.alphabetically,
|
||||
|
|
@ -60,6 +40,30 @@
|
|||
{ label: t(".category_label"),
|
||||
class: "text-gray-400", include_blank: t(".uncategorized") },
|
||||
"data-auto-submit-form-target": "auto" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<!-- Details Section -->
|
||||
<%= disclosure t(".details"), default_open: false do %>
|
||||
<div class="pb-4">
|
||||
<%= styled_form_with model: @entry,
|
||||
url: account_transaction_path(@entry),
|
||||
class: "space-y-2",
|
||||
data: { controller: "auto-submit-form" } do |f| %>
|
||||
<% unless @entry.account_transaction.transfer? %>
|
||||
<%= f.select :account,
|
||||
options_for_select(
|
||||
Current.family.accounts.alphabetically.pluck(:name, :id),
|
||||
@entry.account_id
|
||||
),
|
||||
{ label: t(".account_label") },
|
||||
{ disabled: true } %>
|
||||
|
||||
<%= f.fields_for :entryable do |ef| %>
|
||||
|
||||
<%= ef.collection_select :merchant_id,
|
||||
Current.family.merchants.alphabetically,
|
||||
|
|
@ -94,15 +98,15 @@
|
|||
<!-- Settings Section -->
|
||||
<%= disclosure t(".settings") do %>
|
||||
<div class="pb-4">
|
||||
<!-- Exclude Transaction Form -->
|
||||
|
||||
<%= styled_form_with model: @entry,
|
||||
url: account_transaction_path(@entry),
|
||||
class: "p-3",
|
||||
data: { controller: "auto-submit-form" } do |f| %>
|
||||
<div class="flex cursor-pointer items-center gap-2 justify-between">
|
||||
<div class="flex cursor-pointer items-center gap-4 justify-between">
|
||||
<div class="text-sm space-y-1">
|
||||
<h4 class="text-gray-900"><%= t(".exclude_title") %></h4>
|
||||
<p class="text-gray-500"><%= t(".exclude_subtitle") %></p>
|
||||
<h4 class="text-gray-900">One-time <%= @entry.amount.negative? ? "Income" : "Expense" %></h4>
|
||||
<p class="text-gray-500">One-time transactions will be excluded from certain budgeting calculations and reports to help you see what's really important.</p>
|
||||
</div>
|
||||
|
||||
<div class="relative inline-block select-none">
|
||||
|
|
@ -115,6 +119,18 @@
|
|||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="flex items-center justify-between gap-4 p-3">
|
||||
<div class="text-sm space-y-1">
|
||||
<h4 class="text-gray-900">Transfer or Debt Payment?</h4>
|
||||
<p class="text-gray-500">Transfers and payments are special types of transactions that indicate money movement between 2 accounts.</p>
|
||||
</div>
|
||||
|
||||
<%= link_to new_account_transaction_transfer_match_path(@entry), class: "btn btn--outline flex items-center gap-2", data: { turbo_frame: :modal } do %>
|
||||
<%= lucide_icon "arrow-left-right", class: "w-4 h-4 shrink-0" %>
|
||||
<span class="whitespace-nowrap">Open matcher</span>
|
||||
<% end %>
|
||||
</div>
|
||||
|
||||
<!-- Delete Transaction Form -->
|
||||
<div class="flex items-center justify-between gap-2 p-3">
|
||||
<div class="text-sm space-y-1">
|
||||
|
|
|
|||
44
app/views/account/transfer_matches/_matching_fields.html.erb
Normal file
44
app/views/account/transfer_matches/_matching_fields.html.erb
Normal file
|
|
@ -0,0 +1,44 @@
|
|||
<%# locals: (form:, entry:, candidates:, accounts:) %>
|
||||
|
||||
<% if candidates.any? %>
|
||||
<div data-controller="transfer-match" class="space-y-2">
|
||||
<p class="text-sm text-gray-500">
|
||||
Select a method for matching your transactions.
|
||||
</p>
|
||||
|
||||
<%= form.select :method,
|
||||
[
|
||||
["Match existing transaction (recommended)", "existing"],
|
||||
["Create new transaction", "new"]
|
||||
],
|
||||
{ selected: "existing", label: "Matching method" },
|
||||
data: { action: "change->transfer-match#update" } %>
|
||||
|
||||
<div data-transfer-match-target="existingSelect">
|
||||
<%= form.select :matched_entry_id,
|
||||
candidates.map { |entry|
|
||||
[entry_name_detailed(entry), entry.id]
|
||||
},
|
||||
{ label: "Matching transaction" } %>
|
||||
</div>
|
||||
|
||||
<div data-transfer-match-target="newSelect" class="hidden">
|
||||
<%= form.select :target_account_id,
|
||||
accounts.map { |account| [account.name, account.id] },
|
||||
{ label: "Target account" } %>
|
||||
</div>
|
||||
</div>
|
||||
<% else %>
|
||||
<p class="text-sm text-gray-500">
|
||||
We couldn't find any transactions to match from your other accounts.
|
||||
Please select an account and we will create a new inflow transaction for you.
|
||||
</p>
|
||||
|
||||
<%= form.hidden_field :method, value: "new" %>
|
||||
|
||||
<div>
|
||||
<%= form.select :target_account_id,
|
||||
accounts.map { |account| [account.name, account.id] },
|
||||
{ label: "Target account" } %>
|
||||
</div>
|
||||
<% end %>
|
||||
60
app/views/account/transfer_matches/new.html.erb
Normal file
60
app/views/account/transfer_matches/new.html.erb
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
<%= modal_form_wrapper title: "Match transfer or payment" do %>
|
||||
<%= styled_form_with(
|
||||
url: account_transaction_transfer_match_path(@entry),
|
||||
scope: :transfer_match,
|
||||
class: "space-y-8",
|
||||
data: { turbo_frame: :_top }
|
||||
) do |f| %>
|
||||
<section class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<h2 class="text-sm font-medium text-gray-700">
|
||||
<%= @entry.amount.positive? ? "From account: #{@entry.account.name}" : "From account" %>
|
||||
</h2>
|
||||
|
||||
<% if @entry.amount.positive? %>
|
||||
<%= f.select(
|
||||
:entry_id,
|
||||
[[entry_name_detailed(@entry), @entry.id]],
|
||||
{
|
||||
label: "Outflow transaction",
|
||||
selected: @entry.id,
|
||||
},
|
||||
disabled: true
|
||||
) %>
|
||||
<% else %>
|
||||
<%= render "account/transfer_matches/matching_fields",
|
||||
form: f, entry: @entry, candidates: @transfer_match_candidates, accounts: @accounts %>
|
||||
<% end %>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="flex justify-center py-2">
|
||||
<%= lucide_icon "arrow-down", class: "w-5 h-5" %>
|
||||
</div>
|
||||
|
||||
<section class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<h2 class="text-sm font-medium text-gray-700">
|
||||
<%= @entry.amount.negative? ? "To account: #{@entry.account.name}" : "To account" %>
|
||||
</h2>
|
||||
|
||||
<% if @entry.amount.negative? %>
|
||||
<%= f.select(
|
||||
:entry_id,
|
||||
[[entry_name_detailed(@entry), @entry.id]],
|
||||
{
|
||||
label: "Inflow transaction",
|
||||
selected: @entry.id,
|
||||
},
|
||||
disabled: true
|
||||
) %>
|
||||
<% else %>
|
||||
<%= render "account/transfer_matches/matching_fields",
|
||||
form: f, entry: @entry, candidates: @transfer_match_candidates, accounts: @accounts %>
|
||||
<% end %>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<%= f.submit "Create transfer match", data: { turbo_submits_with: "Saving..."} %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
<%# locals: (transfer:, outflow: false) %>
|
||||
|
||||
<div class="flex items-center gap-2">
|
||||
<% if outflow %>
|
||||
<%= link_to transfer.from_account, data: { turbo_frame: :_top }, class: "hover:opacity-90" do %>
|
||||
<%= circle_logo(transfer.from_name[0].upcase, size: "sm") %>
|
||||
<% end %>
|
||||
|
||||
<%= lucide_icon "arrow-right", class: "text-gray-500 w-4 h-4" %>
|
||||
|
||||
<%= link_to transfer.to_account, data: { turbo_frame: :_top }, class: "hover:opacity-90" do %>
|
||||
<%= circle_logo(transfer.to_name[0].upcase, size: "sm") %>
|
||||
<% end %>
|
||||
<% else %>
|
||||
<%= link_to transfer.to_account, data: { turbo_frame: :_top }, class: "hover:opacity-90" do %>
|
||||
<%= circle_logo(transfer.to_name[0].upcase, size: "sm") %>
|
||||
<% end %>
|
||||
|
||||
<%= lucide_icon "arrow-left", class: "text-gray-500 w-4 h-4" %>
|
||||
|
||||
<%= link_to transfer.from_account, data: { turbo_frame: :_top }, class: "hover:opacity-90" do %>
|
||||
<%= circle_logo(transfer.from_name[0].upcase, size: "sm") %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
@ -1,38 +0,0 @@
|
|||
<%= styled_form_with model: transfer, class: "space-y-4", data: { turbo_frame: "_top", controller: "transfer-form" } do |f| %>
|
||||
<% if transfer.errors.present? %>
|
||||
<div class="text-red-600 flex items-center gap-2">
|
||||
<%= lucide_icon "circle-alert", class: "w-5 h-5" %>
|
||||
<p class="text-sm"><%= @transfer.errors.full_messages.to_sentence %></p>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<section>
|
||||
<fieldset class="bg-gray-50 rounded-lg p-1 grid grid-flow-col justify-stretch gap-x-2">
|
||||
<%= link_to new_account_transaction_path(nature: "expense"), data: { turbo_frame: :modal }, class: "flex px-4 py-1 rounded-lg items-center space-x-2 justify-center text-gray-400" do %>
|
||||
<%= lucide_icon "minus-circle", class: "w-5 h-5" %>
|
||||
<%= tag.span t(".expense") %>
|
||||
<% end %>
|
||||
|
||||
<%= link_to new_account_transaction_path(nature: "income"), data: { turbo_frame: :modal }, class: "flex px-4 py-1 rounded-lg items-center space-x-2 justify-center text-gray-400" do %>
|
||||
<%= lucide_icon "plus-circle", class: "w-5 h-5" %>
|
||||
<%= tag.span t(".income") %>
|
||||
<% end %>
|
||||
|
||||
<%= tag.div class: "flex px-4 py-1 rounded-lg items-center space-x-2 justify-center text-gray-400 bg-white text-gray-800 shadow-sm" do %>
|
||||
<%= lucide_icon "arrow-right-left", class: "w-5 h-5" %>
|
||||
<%= tag.span t(".transfer") %>
|
||||
<% end %>
|
||||
</fieldset>
|
||||
</section>
|
||||
|
||||
<section class="space-y-2">
|
||||
<%= f.collection_select :from_account_id, Current.family.accounts.manual.alphabetically, :id, :name, { prompt: t(".select_account"), label: t(".from") }, required: true %>
|
||||
<%= f.collection_select :to_account_id, Current.family.accounts.manual.alphabetically, :id, :name, { prompt: t(".select_account"), label: t(".to") }, required: true %>
|
||||
<%= f.number_field :amount, label: t(".amount"), required: true, min: 0, placeholder: "100", step: 0.00000001 %>
|
||||
<%= f.date_field :date, value: transfer.date || Date.current, label: t(".date"), required: true, max: Date.current %>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<%= f.submit t(".submit") %>
|
||||
</section>
|
||||
<% end %>
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
<%# locals: (entry:) %>
|
||||
|
||||
<%= form_with url: unmark_transfers_account_transactions_path, class: "flex items-center", data: {
|
||||
turbo_confirm: {
|
||||
title: t(".remove_transfer"),
|
||||
body: t(".remove_transfer_body"),
|
||||
accept: t(".remove_transfer_confirm"),
|
||||
},
|
||||
turbo_frame: "_top"
|
||||
} do |f| %>
|
||||
<%= f.hidden_field "bulk_update[entry_ids][]", value: entry.id %>
|
||||
<%= f.button class: "flex items-center justify-center group", title: "Remove transfer" do %>
|
||||
<%= lucide_icon "arrow-left-right", class: "group-hover:hidden text-gray-500 w-4 h-4" %>
|
||||
<%= lucide_icon "unlink", class: "hidden group-hover:inline-block text-gray-900 w-4 h-4" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
<%= modal_form_wrapper title: t(".title") do %>
|
||||
<%= render "form", transfer: @transfer %>
|
||||
<% end %>
|
||||
|
|
@ -1,121 +0,0 @@
|
|||
<%= drawer do %>
|
||||
<header class="mb-4 space-y-1">
|
||||
<div class="flex items-center gap-4">
|
||||
<h3 class="font-medium">
|
||||
<span class="text-2xl">
|
||||
<%= format_money @transfer.amount_money %>
|
||||
</span>
|
||||
|
||||
<span class="text-lg text-gray-500">
|
||||
<%= @transfer.amount_money.currency.iso_code %>
|
||||
</span>
|
||||
</h3>
|
||||
|
||||
<%= lucide_icon "arrow-left-right", class: "text-gray-500 mt-1 w-5 h-5" %>
|
||||
</div>
|
||||
|
||||
<span class="text-sm text-gray-500">
|
||||
<%= @transfer.name %>
|
||||
</span>
|
||||
</header>
|
||||
|
||||
<div class="space-y-2">
|
||||
<!-- Overview Section -->
|
||||
<%= disclosure t(".overview") do %>
|
||||
<div class="pb-4 px-3 pt-2 text-sm space-y-3 text-gray-900">
|
||||
<div class="space-y-3">
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">To</dt>
|
||||
<dd class="flex items-center gap-2 font-medium">
|
||||
<%= render "accounts/logo", account: @transfer.inflow_transaction.account, size: "sm" %>
|
||||
<%= @transfer.to_name %>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">Date</dt>
|
||||
<dd class="font-medium"><%= l(@transfer.date, format: :long) %></dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">Amount</dt>
|
||||
<dd class="font-medium text-red-500"><%= format_money -@transfer.amount_money %></dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<div class="bg-alpha-black-100 h-px my-2"></div>
|
||||
|
||||
<div class="space-y-3">
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">From</dt>
|
||||
<dd class="flex items-center gap-2 font-medium">
|
||||
<%= render "accounts/logo", account: @transfer.outflow_transaction.account, size: "sm" %>
|
||||
<%= @transfer.from_name %>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">Date</dt>
|
||||
<dd class="font-medium"><%= l(@transfer.date, format: :long) %></dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center gap-2 justify-between">
|
||||
<dt class="text-gray-500">Amount</dt>
|
||||
<dd class="font-medium text-green-500">+<%= format_money @transfer.amount_money %></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<!-- Details Section -->
|
||||
<%= disclosure t(".details") do %>
|
||||
<%= styled_form_with model: @transfer,
|
||||
data: { controller: "auto-submit-form" } do |f| %>
|
||||
<%= f.text_area :notes,
|
||||
label: t(".note_label"),
|
||||
placeholder: t(".note_placeholder"),
|
||||
value: @transfer.outflow_transaction.notes,
|
||||
rows: 5,
|
||||
"data-auto-submit-form-target": "auto" %>
|
||||
<% end %>
|
||||
<% end %>
|
||||
|
||||
<!-- Settings Section -->
|
||||
<%= disclosure t(".settings") do %>
|
||||
<div class="pb-4">
|
||||
<%= styled_form_with model: @transfer,
|
||||
class: "p-3", data: { controller: "auto-submit-form" } do |f| %>
|
||||
<div class="flex cursor-pointer items-center gap-2 justify-between">
|
||||
<div class="text-sm space-y-1">
|
||||
<h4 class="text-gray-900"><%= t(".exclude_title") %></h4>
|
||||
<p class="text-gray-500"><%= t(".exclude_subtitle") %></p>
|
||||
</div>
|
||||
|
||||
<div class="relative inline-block select-none">
|
||||
<%= f.check_box :excluded,
|
||||
checked: @transfer.inflow_transaction.excluded,
|
||||
class: "sr-only peer",
|
||||
"data-auto-submit-form-target": "auto" %>
|
||||
<label for="account_transfer_excluded"
|
||||
class="maybe-switch"></label>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div class="flex items-center justify-between gap-2 p-3">
|
||||
<div class="text-sm space-y-1">
|
||||
<h4 class="text-gray-900"><%= t(".delete_title") %></h4>
|
||||
<p class="text-gray-500"><%= t(".delete_subtitle") %></p>
|
||||
</div>
|
||||
|
||||
<%= button_to t(".delete"),
|
||||
account_transfer_path(@transfer),
|
||||
method: :delete,
|
||||
class: "rounded-lg px-3 py-2 text-red-500 text-sm
|
||||
font-medium border border-alpha-black-200",
|
||||
data: { turbo_confirm: true, turbo_frame: "_top" } %>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -12,7 +12,7 @@
|
|||
<% end %>
|
||||
|
||||
<div class="flex items-center gap-3">
|
||||
<%= tag.div class: "w-8 h-8 rounded-full p-1.5 flex items-center justify-center", style: mixed_hex_styles(color) do %>
|
||||
<%= tag.div class: "w-6 h-6 rounded-full p-1.5 flex items-center justify-center", style: mixed_hex_styles(color) do %>
|
||||
<%= lucide_icon icon, class: "w-4 h-4" %>
|
||||
<% end %>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue