notid/integreat
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

started work on simplifying invoice page

Browse Source
This commit is contained in:
Bryce Covert
2020-08-10 13:26:14 -07:00
parent 8f491de902
commit 9dede12b61
5 changed files with 174 additions and 249 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/cljs/auto_ap/views/components/grid.cljs
View File

@@ -108,14 +108,16 @@
(r/as-element (into
[:div {:style {:margin-bottom "1rem"}}
[:div.level
[:div.level-left
[:div.level-item
[paginator {:start start :end end :count count :total total
:on-change on-params-change}]]
[:div.level-item
[sort-by-list {:sort (:sort params)
:on-change on-params-change}]]]]]
children))))]))
(into
[:div.level-left
[:div.level-item
[paginator {:start start :end end :count count :total total
:on-change on-params-change}]]
[:div.level-item
[sort-by-list {:sort (:sort params)
:on-change on-params-change}]]]
(mapv (fn [c]
[:div.level-item c]) children))]]))))]))
(defn table []
(r/create-class {:reagent-render

289
src/cljs/auto_ap/views/components/invoice_table.cljs
View File

@@ -1,49 +1,21 @@
(ns auto-ap.views.components.invoice-table
(:require [re-frame.core :as re-frame]
(:require [auto-ap.events :as events]
[auto-ap.routes :as routes]
[auto-ap.subs :as subs]
[auto-ap.views.components.buttons :as buttons]
[auto-ap.views.components.dropdown
:refer
[drop-down drop-down-contents]]
[auto-ap.views.components.grid :as grid]
[auto-ap.views.pages.invoices.form :as form]
[auto-ap.views.pages.invoices.common :refer [invoice-read]]
[auto-ap.views.utils :refer [date->str dispatch-event nf]]
[bidi.bidi :as bidi]
[cemerick.url :as url]
[auto-ap.subs :as subs]
[auto-ap.routes :as routes]
[auto-ap.views.utils :refer [date->str dispatch-event delayed-dispatch nf]]
[auto-ap.views.components.paginator :refer [paginator]]
[auto-ap.views.components.sort-by-list :refer [sort-by-list]]
[auto-ap.views.components.sorter :refer [sorted-column]]
[auto-ap.views.components.dropdown :refer [drop-down drop-down-contents]]
[auto-ap.events :as events]
[reagent.core :as reagent]
[clojure.string :as str]
[cljs-time.format :as format]
[cljs-time.core :as t]
[clojure.string :as str]
[goog.string :as gstring]
[goog.i18n.NumberFormat.Format])
)
;; TODO graphql schema enforcement
;; TODO postgres constraints for data integrity
;; TODO performance
;; TODO refactor graphql
(re-frame/reg-event-fx
::toggle-checks
(fn [{:keys [db] } [_ invoice-id]]
{:db
(update-in db [::visible-checks] (fn [i] (if (= i invoice-id) nil invoice-id) ))}))
(re-frame/reg-sub
::visible-checks
(fn [db]
(::visible-checks db)))
(re-frame/reg-event-fx
::toggle-expense-accounts
(fn [{:keys [db] } [_ invoice-id]]
{:db
(update-in db [::visible-expense-accounts] (fn [i] (if (= i invoice-id) nil invoice-id) ))}))
(re-frame/reg-sub
::visible-expense-accounts
(fn [db]
(::visible-expense-accounts db)))
[re-frame.core :as re-frame]))
(defn query [params]
{:venia/queries [[:invoice_page
@@ -80,15 +52,53 @@
(fn [{table-params :db} [_ params :as z]]
{:db (merge table-params params)}))
(defn row [{:keys [invoice check-boxes checked on-check-changed selected-client overrides expense-event on-edit-invoice on-void-invoice on-unvoid-invoice]}]
(re-frame/reg-event-fx
::void-invoice
(fn [{:keys [db]} [_ {id :id}]]
{:graphql
{:token (-> db :user)
:owns-state {:multi ::void
:which id}
:query-obj {:venia/operation {:operation/type :mutation
:operation/name "VoidInvoice"}
:venia/queries [{:query/data [:void-invoice
{:invoice-id id}
invoice-read]}]}
:on-success (fn [result]
[::invoice-updated (assoc (:void-invoice result)
:class "live-removed")])}}))
(re-frame/reg-event-fx
::unvoid-invoice
(fn [{:keys [db]} [_ {id :id}]]
{:graphql
{:token (-> db :user)
:owns-state {:multi ::unvoid
:which id}
:query-obj {:venia/operation {:operation/type :mutation
:operation/name "UnvoidInvoice"}
:venia/queries [{:query/data [:unvoid-invoice
{:invoice-id id}
invoice-read]}]}
:on-success (fn [result]
[::invoice-updated (assoc (:unvoid-invoice result)
:class "live-added")])}}))
(re-frame/reg-event-fx
::invoice-updated
(fn [{:keys [db]} [_ invoice]]
{:db db}))
(defn row [{:keys [invoice check-boxes checked on-check-changed selected-client overrides expense-event ]}]
(let [{:keys [client payments expense-accounts invoice-number date due total outstanding-balance id vendor checkable?] :as i} invoice
accounts-by-id @(re-frame/subscribe [::subs/accounts-by-id client])
account->name #(:name (accounts-by-id (:id %)))]
[:tr {:class (:class i)}
[grid/row {:class (:class i)}
(when check-boxes
[:td.expandable
[grid/cell {}
[:input.checkbox (cond-> {:type "checkbox"
:checked (if (get checked id)
"checked"
"")
@@ -96,13 +106,14 @@
(on-check-changed id i)))}
(boolean? checkable?) (assoc :disabled (not checkable?))) ]])
(when-not selected-client
[:td (if-let [client-override (:client overrides)]
(client-override i)
(:name client))])
[:td (:name vendor)]
[:td invoice-number]
[:td (date->str date) ]
[:td
[grid/cell {}
(if-let [client-override (:client overrides)]
(client-override i)
(:name client))])
[grid/cell {} (:name vendor)]
[grid/cell {} invoice-number]
[grid/cell {} (date->str date) ]
[grid/cell {}
(when due
(let [today (t/at-midnight (t/now))
due (t/at-midnight due)
@@ -113,19 +124,18 @@
[:span.has-text-success due-in " days"]
[:span.has-text-danger due-in " days"])
))]
[:td (str/join ", " (set (map :location expense-accounts)))]
[:td.has-text-right (nf total )]
[:td.has-text-right (nf outstanding-balance )]
[:td.expandable
[grid/cell {} (str/join ", " (set (map :location expense-accounts)))]
[grid/cell {:class "has-text-right"} (nf total )]
[grid/cell {:class "has-text-right"} (nf outstanding-balance )]
[grid/cell {:style {:overflow "visible"}}
[:div.buttons
(when (seq expense-accounts)
[drop-down {:id [::expense-accounts id ]
:header [:a.button.badge {:data-badge (str (clojure.core/count expense-accounts))
:aria-haspopup true
:on-click (dispatch-event [::events/toggle-menu [::expense-accounts id]])
:tab-index "0"
} "Accounts"]}
:tab-index "0"} "Accounts"]}
[drop-down-contents
[:div
(for [e expense-accounts]
@@ -137,12 +147,15 @@
(when expense-event
[:a.dropdown-item.is-primary {:on-click (dispatch-event (conj expense-event i))} "Change"])]]])
[:span {:style {:margin-left "1em"}}]
(when (and on-edit-invoice (not= ":voided" (:status i)))
[:a.button {:on-click (fn [] (on-edit-invoice i))} [:span.icon [:i.fa.fa-pencil]]])
(when (and on-void-invoice (= (:outstanding-balance i) (:total i)) (not= ":voided" (:status i)))
[:a.button {:on-click (fn [] (on-void-invoice i))} [:span.icon [:span.icon-bin-2 {:style {:font-weight "400"}}]]])
(when (and on-unvoid-invoice (= ":voided" (:status i)))
[:a.button {:on-click (fn [] (on-unvoid-invoice i))} [:span [:span.icon [:i.fa.fa-undo]]]])
(when (not= ":voided" (:status i))
[buttons/fa-icon {:icon "fa-pencil"
:event [::form/editing i]}])
(when (and (= (:outstanding-balance i) (:total i)) (not= ":voided" (:status i)))
[buttons/sl-icon {:icon "icon-bin-2"
:event [::void-invoice i]}])
(when (= ":voided" (:status i))
[buttons/fa-icon {:icon "fa-undo"
:event [::unvoid-invoice i]}])
(when (seq payments)
[drop-down {:id [::payments id]
:header [:button.button.badge {:data-badge (str (clojure.core/count payments))
@@ -169,19 +182,12 @@
(when (= :cleared (:status (:payment payment)))
(str " - " (:post-date (:transaction (:payment payment))))))]))]])]]]))
(defn invoice-table [{:keys [id invoice-page status vendors check-boxes checked on-check-changed on-edit-invoice on-void-invoice on-unvoid-invoice expense-event overrides]}]
(let [opc (fn [p]
(re-frame/dispatch [::params-changed p]))
visible-checks @(re-frame/subscribe [::visible-checks])
visible-expense-accounts @(re-frame/subscribe [::visible-expense-accounts])
selected-client @(re-frame/subscribe [::subs/client])
(defn invoice-table [{:keys [id invoice-page status vendors check-boxes checked on-check-changed expense-event overrides]}]
(let [selected-client @(re-frame/subscribe [::subs/client])
{:keys [sort]} @(re-frame/subscribe [::table-params])
{:keys [invoices outstanding start end count total]} @invoice-page
visible-checks @(re-frame/subscribe [::visible-checks])
visible-expense-accounts @(re-frame/subscribe [::visible-expense-accounts])
selected-client @(re-frame/subscribe [::subs/client])
percentage-size (if selected-client "%50%" "33%")
is-loading? (:loading @status)
is-loading? (= :loading status)
is-sorted-by-vendor? (and (= "vendor" (:sort-key (first sort)))
(not is-loading?))
[invoice-groups] (if is-sorted-by-vendor?
@@ -196,95 +202,46 @@
[[] nil]
(:invoices @invoice-page))
[[(:invoices @invoice-page)]])]
[:div
[:div.level
[:div.level-left
[:div.level-item
[paginator {:start start :end end :count count :total total
:on-change opc}]]
[:div.level-item
[sort-by-list {:sort sort
:on-change opc}]]
[:div.level-item
"Outstanding " (nf outstanding)]]]
(doall
(for [invoices invoice-groups]
^{:key (:id (first invoices))}
[:table.table.is-fullwidth
[:thead
[:tr
(when check-boxes
[:th {:style {"width" "20px"}}])
(when-not selected-client
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Client"
:sort-key "client"
:sort sort}
"Client"])
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Vendor"
:sort-key "vendor"
:sort sort}
(if is-sorted-by-vendor?
(:name (:vendor (first invoices)))
"Vendor")]
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Invoice Number"
:sort-key "invoice-number"
:sort sort}
"Invoice #"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Date"
:sort-key "date"
:sort sort}
"Date"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Due"
:sort-key "due"
:sort sort}
"Due"]
[sorted-column {:on-sort opc
:style {:width "5em" :cursor "pointer"}
:sort-name "Location"
:sort-key "location"
:sort sort}
"Loc"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Total"
:sort-key "total"
:class "has-text-right"
:sort sort}
"Amount"]
[grid/grid {:on-params-change (fn [p]
(re-frame/dispatch [::params-changed p]))
:params @(re-frame/subscribe [::table-params])
:status status
;; TODO checkboxes
:column-count (if selected-client 8 9)}
[grid/controls @invoice-page
[:div.level-item
"Outstanding " (nf outstanding)]]
(for [invoices invoice-groups]
^{:key (or (:id (first invoices)) "init")}
[grid/table {:fullwidth true}
[grid/header {}
[grid/row {}
(when check-boxes
[grid/header-cell {:style {:width "22px"}}])
(when-not selected-client
[grid/sortable-header-cell {:sort-key "client" :sort-name "Client"} "Client"])
[grid/sortable-header-cell {:sort-key "vendor" :sort-name "Vendor"}
(if is-sorted-by-vendor?
(:name (:vendor (first invoices)))
"Vendor")]
[sorted-column {:on-sort opc
:style {:width "10em" :cursor "pointer"}
:sort-name "Outstanding"
:sort-key "outstanding-balance"
:class "has-text-right"
:sort sort}
"Outstanding"]
[:th {:style {:width "20rem" :cursor "pointer"}}
""]]]
[:tbody
(if is-loading?
[:tr
[:td {:col-span 5}
[:i.fa.fa-spin.fa-spinner]]]
(for [{:keys [client payments expense-accounts invoice-number date due total outstanding-balance id vendor] :as i} invoices]
^{:key id}
[row {:invoice i
:check-boxes check-boxes
:checked checked
:on-check-changed on-check-changed
:selected-client selected-client
:overrides overrides
:expense-event expense-event
:on-edit-invoice on-edit-invoice
:on-void-invoice on-void-invoice
:on-unvoid-invoice on-unvoid-invoice}]))]]))]))
[grid/sortable-header-cell {:sort-key "invoice-number" :sort-name "Invoice Number"} "Invoice #"]
[grid/sortable-header-cell {:sort-key "date" :sort-name "Date" :style {:width "8em"}} "Date"]
[grid/sortable-header-cell {:sort-key "due" :sort-name "Due" :style {:width "8em"}} "Due"]
[grid/sortable-header-cell {:sort-key "location" :sort-name "Location" :style {:width "5em"}} "Loc"]
[grid/sortable-header-cell {:sort-key "total" :sort-name "Total" :style {:width "8em"} :class "has-text-right"} "Total"]
[grid/sortable-header-cell {:sort-key "outstanding-balance" :sort-name "Outstanding" :style {:width "10em"} :class "has-text-right"} "Outstanding"]
[grid/header-cell {:style {:width "20rem" }}]
]]
[grid/body
(for [{:keys [client payments expense-accounts invoice-number date due total outstanding-balance id vendor] :as i} invoices]
^{:key id}
[row {:invoice i
:check-boxes check-boxes
:checked checked
:on-check-changed on-check-changed
:selected-client selected-client
:overrides overrides
:expense-event expense-event}])]])]))