making main form better.
This commit is contained in:
@@ -1,34 +1,41 @@
|
||||
(ns auto-ap.views.pages.invoices.form
|
||||
(:require [auto-ap.entities.invoice :as invoice]
|
||||
[auto-ap.events :as events]
|
||||
[auto-ap.forms :as forms]
|
||||
[auto-ap.status :as status]
|
||||
[auto-ap.subs :as subs]
|
||||
[auto-ap.time-utils :refer [next-dom]]
|
||||
[auto-ap.utils :refer [dollars=]]
|
||||
[auto-ap.views.components.dropdown :refer [drop-down]]
|
||||
[auto-ap.views.components.expense-accounts-field
|
||||
:as
|
||||
expense-accounts-field
|
||||
:refer
|
||||
[expense-accounts-field recalculate-amounts]]
|
||||
[auto-ap.views.components.layouts :as layouts]
|
||||
[auto-ap.views.components.modal :as modal]
|
||||
[auto-ap.views.components.money-field :refer [money-field]]
|
||||
[auto-ap.views.components.switch-field :refer [switch-field]]
|
||||
[auto-ap.views.components.typeahead :refer [typeahead-v3]]
|
||||
[auto-ap.views.components.typeahead.vendor :refer [search-backed-typeahead]]
|
||||
[auto-ap.views.pages.invoices.common :refer [invoice-read]]
|
||||
[auto-ap.views.utils
|
||||
:refer
|
||||
[date->str date-picker dispatch-event standard str->date with-user]]
|
||||
[cljs-time.core :as c]
|
||||
[clojure.spec.alpha :as s]
|
||||
[clojure.string :as str]
|
||||
[re-frame.core :as re-frame]
|
||||
[reagent.core :as r]
|
||||
[vimsical.re-frame.fx.track :as track]
|
||||
[vimsical.re-frame.cofx.inject :as inject]))
|
||||
(:require
|
||||
[auto-ap.entities.invoice :as invoice]
|
||||
[auto-ap.events :as events]
|
||||
[auto-ap.forms :as forms]
|
||||
[auto-ap.forms.builder :as form-builder]
|
||||
[auto-ap.status :as status]
|
||||
[auto-ap.subs :as subs]
|
||||
[auto-ap.time-utils :refer [next-dom]]
|
||||
[auto-ap.utils :refer [dollars=]]
|
||||
[auto-ap.views.components.expense-accounts-field
|
||||
:as expense-accounts-field
|
||||
:refer [recalculate-amounts]]
|
||||
[auto-ap.views.components.layouts :as layouts]
|
||||
[auto-ap.views.components.level :refer [left-stack]]
|
||||
[auto-ap.views.components.modal :as modal]
|
||||
[auto-ap.views.components.expense-accounts-field :refer [expense-accounts-field]]
|
||||
[auto-ap.views.components.dropdown :refer [drop-down]]
|
||||
[auto-ap.views.components.money-field :refer [money-field]]
|
||||
[auto-ap.views.components.switch-field :refer [switch-field]]
|
||||
[auto-ap.views.components.typeahead :refer [typeahead-v3]]
|
||||
[auto-ap.views.components.typeahead.vendor
|
||||
:refer [search-backed-typeahead]]
|
||||
[auto-ap.views.pages.invoices.common :refer [invoice-read]]
|
||||
[auto-ap.views.utils
|
||||
:refer [date->str
|
||||
date-picker-friendly
|
||||
dispatch-event
|
||||
standard
|
||||
str->date
|
||||
with-user]]
|
||||
[cljs-time.core :as c]
|
||||
[clojure.spec.alpha :as s]
|
||||
[clojure.string :as str]
|
||||
[re-frame.core :as re-frame]
|
||||
[reagent.core :as r]
|
||||
[vimsical.re-frame.cofx.inject :as inject]
|
||||
[vimsical.re-frame.fx.track :as track]))
|
||||
|
||||
;; SUBS
|
||||
(re-frame/reg-sub
|
||||
@@ -134,7 +141,8 @@
|
||||
:vendor-preferences vendor-preferences
|
||||
:scheduled-payment (:scheduled-payment edit-invoice)
|
||||
:invoice-number (:invoice-number edit-invoice)
|
||||
:total (:total edit-invoice)
|
||||
:total (cond-> (:total edit-invoice)
|
||||
(not (str/blank? (:total edit-invoice))) (js/parseFloat ))
|
||||
:original edit-invoice
|
||||
:vendor (:vendor edit-invoice)
|
||||
:client (:client edit-invoice)
|
||||
@@ -320,153 +328,125 @@
|
||||
min-total (if (= (:total (:original data)) (:outstanding-balance (:original data)))
|
||||
nil
|
||||
(- (:total (:original data)) (:outstanding-balance (:original data))))]
|
||||
(with-meta
|
||||
(form-inline (assoc params :title [:div "New Invoice "
|
||||
(cond
|
||||
(#{:unpaid ":unpaid"} (:status data))
|
||||
nil
|
||||
[form-builder/builder {:can-submit [::can-submit]
|
||||
:change-event [::changed]
|
||||
:submit-event [::save-requested [::saving ]]
|
||||
:id ::form}
|
||||
|
||||
(#{:voided ":voided"} (:status data))
|
||||
[:div.tag.is-info.is-light "Voided"]
|
||||
[form-builder/section {:title [:div "New Invoice "
|
||||
(cond
|
||||
(#{:unpaid ":unpaid"} (:status data))
|
||||
nil
|
||||
|
||||
(and (#{:paid ":paid"} (:status data))
|
||||
(not (seq (:payments data))))
|
||||
[:div.tag.is-info.is-light "Automatically paid"]
|
||||
(#{:voided ":voided"} (:status data))
|
||||
[:div.tag.is-info.is-light "Voided"]
|
||||
|
||||
(#{:paid ":paid"} (:status data))
|
||||
(if-let [check-number (:check-number (:payment (first (:payments data))))]
|
||||
[:div.tag.is-info.is-light "Paid by check #" check-number ]
|
||||
[:div.tag.is-info.is-light "Paid"])
|
||||
(and (#{:paid ":paid"} (:status data))
|
||||
(not (seq (:payments data))))
|
||||
[:div.tag.is-info.is-light "Automatically paid"]
|
||||
|
||||
:else
|
||||
nil)])
|
||||
[:<>
|
||||
(when-not active-client
|
||||
(field [:span "Client"
|
||||
[:span.has-text-danger " *"]]
|
||||
[typeahead-v3 {:entities @(re-frame/subscribe [::subs/clients])
|
||||
:entity->text :name
|
||||
:type "typeahead-v3"
|
||||
:auto-focus (if active-client false true)
|
||||
:field [:client]
|
||||
:disabled exists?
|
||||
:spec ::invoice/client}]))
|
||||
(field [:span "Vendor"
|
||||
[:span.has-text-danger " *"]]
|
||||
[search-backed-typeahead {:disabled exists?
|
||||
:search-query (fn [i]
|
||||
[:search_vendor
|
||||
{:query i}
|
||||
[:name :id]])
|
||||
:type "typeahead-v3"
|
||||
:auto-focus (if active-client true false)
|
||||
:field [:vendor]}])
|
||||
(#{:paid ":paid"} (:status data))
|
||||
(if-let [check-number (:check-number (:payment (first (:payments data))))]
|
||||
[:div.tag.is-info.is-light "Paid by check #" check-number ]
|
||||
[:div.tag.is-info.is-light "Paid"])
|
||||
|
||||
(field [:span "Date"
|
||||
[:span.has-text-danger " *"]]
|
||||
[date-picker {:class-name "input"
|
||||
:class "input"
|
||||
:format-week-number (fn [] "")
|
||||
:previous-month-button-label ""
|
||||
:placeholder "mm/dd/yyyy"
|
||||
:disable-keyboard-navigation true
|
||||
:next-month-button-label ""
|
||||
:next-month-label ""
|
||||
:type "date"
|
||||
:field [:date]
|
||||
:spec ::invoice/date}])
|
||||
:else
|
||||
nil)]}
|
||||
|
||||
(field "Due (optional)"
|
||||
[date-picker {:class-name "input"
|
||||
:class "input"
|
||||
:format-week-number (fn [] "")
|
||||
:previous-month-button-label ""
|
||||
:placeholder "mm/dd/yyyy"
|
||||
:disable-keyboard-navigation true
|
||||
:next-month-button-label ""
|
||||
:next-month-label ""
|
||||
:type "date"
|
||||
:field [:due]
|
||||
:spec ::invoice/due}])
|
||||
(when-not active-client
|
||||
[form-builder/field {:required? true}
|
||||
"Client"
|
||||
[typeahead-v3 {:entities @(re-frame/subscribe [::subs/clients])
|
||||
:entity->text :name
|
||||
:type "typeahead-v3"
|
||||
:auto-focus (if active-client false true)
|
||||
:field [:client]
|
||||
:disabled exists?
|
||||
:spec ::invoice/client}]])
|
||||
[form-builder/field {:required? true}
|
||||
"Vendor"
|
||||
[search-backed-typeahead {:disabled exists?
|
||||
:search-query (fn [i]
|
||||
[:search_vendor
|
||||
{:query i}
|
||||
[:name :id]])
|
||||
:type "typeahead-v3"
|
||||
:auto-focus (if active-client true false)
|
||||
:field [:vendor]}]]
|
||||
[form-builder/field {:required? true}
|
||||
"Date"
|
||||
[date-picker-friendly {:type "date"
|
||||
:field [:date]
|
||||
:spec ::invoice/date}]]
|
||||
|
||||
[:p.help "Scheduled payment (optional)"]
|
||||
[:div.level
|
||||
[:div.level-left
|
||||
[:div.level-item
|
||||
[:div.control
|
||||
(raw-field
|
||||
[date-picker {:class-name "input"
|
||||
:class "input"
|
||||
:disabled (boolean (:schedule-when-due data))
|
||||
:format-week-number (fn [] "")
|
||||
:previous-month-button-label ""
|
||||
:placeholder "mm/dd/yyyy"
|
||||
:next-month-button-label ""
|
||||
:next-month-label ""
|
||||
:type "date"
|
||||
:field [:scheduled-payment]
|
||||
:spec ::invoice/scheduled-payment}])]]
|
||||
[:div.level-item [:div.control
|
||||
(raw-field
|
||||
[switch-field {:id "schedule-when-due"
|
||||
:field [:schedule-when-due]
|
||||
:label "Same as due date"
|
||||
:type "checkbox"}])]]]]
|
||||
[form-builder/field
|
||||
"Due (optional)"
|
||||
[date-picker-friendly {:type "date"
|
||||
:field [:due]
|
||||
:spec ::invoice/due}]]
|
||||
[form-builder/vertical-control
|
||||
"Scheduled payment (optional)"
|
||||
[left-stack
|
||||
[:div.control
|
||||
[form-builder/raw-field
|
||||
[date-picker-friendly {:type "date"
|
||||
:field [:scheduled-payment]
|
||||
:spec ::invoice/scheduled-payment}]]]
|
||||
[:div.control
|
||||
[form-builder/raw-field
|
||||
|
||||
(field [:span "Invoice #"
|
||||
[:span.has-text-danger " *"]]
|
||||
[:input.input {:type "text"
|
||||
:field [:invoice-number]
|
||||
:spec ::invoice/invoice-number}])
|
||||
|
||||
|
||||
(field [:span "Total"
|
||||
[:span.has-text-danger " *"]]
|
||||
[money-field {:type "money"
|
||||
:field [:total]
|
||||
:disabled (if can-change-amount? "" "disabled")
|
||||
:min min-total
|
||||
:spec ::invoice/total
|
||||
:step "0.01"}])
|
||||
|
||||
(with-meta
|
||||
(field nil
|
||||
[expense-accounts-field {:type "expense-accounts"
|
||||
:descriptor "expense account"
|
||||
:locations (:locations (:client data))
|
||||
:max (:total data)
|
||||
:client (or (:client data) active-client)
|
||||
:field [:expense-accounts]}])
|
||||
{:key (str (:id (:vendor data) "none") "-" (:id (:client data) "none") )})
|
||||
|
||||
(error-notification)
|
||||
|
||||
[:div.columns
|
||||
(when-not exists?
|
||||
[:div.column
|
||||
[drop-down {:header [:button.button.is-primary-two.is-medium.is-fullwidth {:aria-haspopup true
|
||||
:type "button"
|
||||
:on-click (dispatch-event [::events/toggle-menu ::add-and-print-invoice ])
|
||||
:disabled (or (status/disabled-for status)
|
||||
(not can-submit?))
|
||||
:class (status/class-for status)}
|
||||
"Pay "
|
||||
[:span " "]
|
||||
[:span.icon [:i.fa.fa-angle-down {:aria-hidden "true"}]]]
|
||||
:class "is-fullwidth"
|
||||
:id ::add-and-print-invoice}
|
||||
[:div
|
||||
(list
|
||||
(for [{:keys [id name type]} (->> (:bank-accounts (:client data)) (filter :visible) (sort-by :sort-order))]
|
||||
(if (= :cash type)
|
||||
^{:key id} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :cash]])} "With cash"]
|
||||
(list
|
||||
^{:key (str id "-check")} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :check]])} "Print checks from " name]
|
||||
^{:key (str id "-debit")} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :debit]])} "Debit from " name]))))]]])
|
||||
[:div.column
|
||||
|
||||
(submit-button "Save")]]])
|
||||
{:key id}))])
|
||||
[switch-field {:id "schedule-when-due"
|
||||
:field [:schedule-when-due]
|
||||
:label "Same as due date"
|
||||
:type "checkbox"}]]]]]
|
||||
[form-builder/field {:required? true}
|
||||
"Invoice #"
|
||||
[:input.input {:type "text"
|
||||
:field [:invoice-number]
|
||||
:spec ::invoice/invoice-number}]]
|
||||
[form-builder/field {:required? true}
|
||||
"Total"
|
||||
[money-field {:type "money"
|
||||
:field [:total]
|
||||
:disabled (if can-change-amount? "" "disabled")
|
||||
:style {:max-width "8em"}
|
||||
:min min-total
|
||||
:spec ::invoice/total
|
||||
:step "0.01"}]]]
|
||||
[form-builder/raw-field
|
||||
[expense-accounts-field {:type "expense-accounts"
|
||||
:descriptor "expense account"
|
||||
:locations (:locations (:client data))
|
||||
:max (:total data)
|
||||
:client (or (:client data) active-client)
|
||||
:field [:expense-accounts]}]]
|
||||
[form-builder/error-notification]
|
||||
[:div {:style {:margin-bottom "1em"}}]
|
||||
[:div.columns
|
||||
(when-not exists?
|
||||
[:div.column
|
||||
[drop-down {:header [:button.button.is-primary-two.is-medium.is-fullwidth {:aria-haspopup true
|
||||
:type "button"
|
||||
:on-click (dispatch-event [::events/toggle-menu ::add-and-print-invoice ])
|
||||
:disabled (or (status/disabled-for status)
|
||||
(not can-submit?))
|
||||
:class (status/class-for status)}
|
||||
"Pay "
|
||||
[:span " "]
|
||||
[:span.icon [:i.fa.fa-angle-down {:aria-hidden "true"}]]]
|
||||
:class "is-fullwidth"
|
||||
:id ::add-and-print-invoice}
|
||||
[:div
|
||||
(list
|
||||
(for [{:keys [id name type]} (->> (:bank-accounts (:client data)) (filter :visible) (sort-by :sort-order))]
|
||||
(if (= :cash type)
|
||||
^{:key id} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :cash]])} "With cash"]
|
||||
(list
|
||||
^{:key (str id "-check")} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :check]])} "Print checks from " name]
|
||||
^{:key (str id "-debit")} [:a.dropdown-item {:on-click (dispatch-event [::save-requested [::add-and-print id :debit]])} "Debit from " name]))))]]])
|
||||
[:div.column
|
||||
[form-builder/submit-button {:class ["is-fullwidth"]}
|
||||
"Save"]]]])])
|
||||
|
||||
|
||||
(defn form [_]
|
||||
|
||||
Reference in New Issue
Block a user