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

payments use new grid. Still need to update void button

Browse Source
This commit is contained in:
Bryce Covert
2020-08-08 08:00:15 -07:00
parent e0222bac48
commit 32152ea924
2 changed files with 75 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
src/cljs/auto_ap/views/pages/payments.cljs
View File

@@ -18,7 +18,9 @@
[auto-ap.views.pages.payments.side-bar :as side-bar]
[auto-ap.views.pages.payments.table :as table]
[auto-ap.views.pages.check :as check]
[auto-ap.subs :as subs]))
[auto-ap.subs :as subs]
[auto-ap.status :as status]
[vimsical.re-frame.fx.track :as track]))
@@ -28,48 +30,35 @@
(fn [db]
(-> db ::payment-page)))
(re-frame/reg-sub
::last-params
(fn [db]
(-> db ::last-params)))
(re-frame/reg-sub
::params
:<- [::last-params]
:<- [::subs/client]
:<- [::side-bar/filter-params]
:<- [::table/table-params]
(fn [[last-params client filter-params table-params]]
(let [params (cond-> {}
client (assoc :client-id (:id client))
(seq filter-params) (merge filter-params)
(seq table-params) (merge table-params))]
(when (not= last-params params)
(re-frame/dispatch [::params-change]))
params)))
(fn [[ client filter-params table-params]]
(cond-> {}
client (assoc :client-id (:id client))
(seq filter-params) (merge filter-params)
(seq table-params) (merge table-params))))
(re-frame/reg-event-fx
::params-change
[with-user (re-frame/inject-cofx ::inject/sub [::params])]
(fn [{:keys [user db ::params]}[_ ]]
(when (not= (::last-params db) params)
{:db (-> db
(assoc-in [:status :loading] true)
(assoc-in [::last-params] params))
:graphql {:token user
:query-obj {:venia/queries [[:payment_page
params
[[:payments [:id :status :amount :type :check_number :s3_url
[:bank-account [:name]]
:date [:vendor [:name :id]] [:client [:name :id]]
[:invoices [:invoice-id [:invoice [:invoice-number]]]]]]
:total
:start
:end]]]}
:on-success [::received]
:on-error [::events/page-failed]}
:set-uri-params (dissoc params
:client-id)})))
[with-user]
(fn [{:keys [user db ]}[_ params]]
{:graphql {:token user
:owns-state {:single ::page}
:query-obj {:venia/queries [[:payment_page
params
[[:payments [:id :status :amount :type :check_number :s3_url
[:bank-account [:name]]
:date [:vendor [:name :id]] [:client [:name :id]]
[:invoices [:invoice-id [:invoice [:invoice-number]]]]]]
:total
:start
:end]]]}
:on-success [::received]}
:set-uri-params (dissoc params :client-id)}))
(re-frame/reg-event-fx
::void-check
@@ -105,21 +94,30 @@
(re-frame/reg-event-fx
::unmounted
(fn [{:keys [db]} _]
{:db (dissoc db ::last-params ::table/table-params ::side-bar/filters ::side-bar/settled-filters ::payment-page)}))
{:db (dissoc db ::last-params ::table/table-params ::side-bar/filters ::side-bar/settled-filters ::payment-page)
::track/dispose {:id ::params} }))
(re-frame/reg-event-fx
::mounted
(fn [{:keys [db]} _]
{::track/register {:id ::params
:subscription [::params]
:event-fn (fn [params] [::params-change params])}}))
(defn content []
(let [params @(re-frame/subscribe [::params])]
[:div
[:h1.title "Payments"]
[table/table {:id :payments
:payment-page (re-frame/subscribe [::payment-page])
:status (re-frame/subscribe [::subs/status])
:payment-page @(re-frame/subscribe [::payment-page])
:status @(re-frame/subscribe [::status/single ::page])
:void-event [::void-check]}]]))
(defn payments-page []
(reagent/create-class
{:display-name "payments-page"
:component-will-unmount #(re-frame/dispatch [::unmounted])
:component-did-mount #(re-frame/dispatch [::mounted])
:reagent-render
(fn []
[side-bar-layout {:side-bar [side-bar/side-bar]

128
src/cljs/auto_ap/views/pages/payments/table.cljs
View File

@@ -11,7 +11,9 @@
[auto-ap.views.components.dropdown :refer [drop-down drop-down-contents]]
[auto-ap.events :as events]
[goog.string :as gstring]
[re-frame.core :as re-frame]))
[re-frame.core :as re-frame]
[auto-ap.views.components.grid :as grid]
[auto-ap.views.components.buttons :as buttons]))
(re-frame/reg-sub
::specific-table-params
@@ -36,27 +38,27 @@
void-event :void-event
}]
(let [{:keys [client s3-url bank-account payments type check-number date amount id vendor status invoices] :as check} check]
[:tr {:class (:class check)}
[grid/row {:class (:class check)}
(when-not selected-client
[:td (:name client)])
[:td (:name vendor)]
[:td (:name bank-account)]
[:td (cond
[grid/cell {} (:name client)])
[grid/cell {} (:name vendor)]
[grid/cell {} (:name bank-account)]
[grid/cell {} (cond
(= :cash type) "Cash"
(= :debit type) "Debit"
:else (if s3-url
[:a {:href s3-url :target "_new"} [:a.button [:span.icon [:i.fa.fa-share-square-o]]
[:span (str " " check-number )]]]
check-number))]
[:td (date->str date) ]
[:td.has-text-right (nf amount )]
[:td status]
[:td.expandable
[:div.buttons
[grid/cell {} (date->str date) ]
[grid/cell {:class "has-text-right"} (nf amount )]
[grid/cell {} status]
[grid/cell {:style {:overflow "visible"}}
[:div.buttons
(when (seq invoices)
[drop-down {:id [::invoices id]
:header [:button.button.badge {:data-badge (str (clojure.core/count invoices))
:aria-haspopup true
:aria-haspopup true?
:tab-index "0"
:on-click (dispatch-event [::events/toggle-menu [::invoices id]])
} "Invoices"]}
@@ -75,82 +77,32 @@
(when (or (= :pending status)
(and (#{":cash" :cash ":debit" :debit} type)
(not= :voided status)))
[:button.button.is-warning.is-outlined {:on-click (dispatch-event (conj void-event check))} [:span [:span.icon [:i.fa.fa-minus-circle]]]])]]]))
[buttons/sl-icon {:event (conj void-event check) :icon :icon-bin-2}])]]]))
(defn table [{:keys [id payment-page status void-event]}]
(let [{:keys [sort]} @(re-frame/subscribe [::table-params])
{:keys [payments start end count total]} @payment-page
selected-client @(re-frame/subscribe [::subs/client])
percentage-size (if selected-client "50%" "33%")
opc (fn [e]
(re-frame/dispatch [::params-changed e]))]
[: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}]]]]
[:table.table.is-fullwidth
[:thead
[:tr
(let [selected-client @(re-frame/subscribe [::subs/client])
percentage-size (if selected-client "50%" "33%")]
[grid/grid {:on-params-change (fn [e]
(re-frame/dispatch [::params-changed e]))
:params @(re-frame/subscribe [::table-params])
:status status
:column-count (if selected-client 7 8)}
[grid/controls payment-page]
[grid/table {:fullwidth true}
[grid/header {}
[grid/row {}
(when-not selected-client
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-key "client"
:sort-name "Client"
:sort sort}
"Client"])
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-key "vendor"
:sort-name "Vendor"
:sort sort}
"Vendor"]
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-key "bank-account"
:sort-name "Bank Account"
:sort sort}
"Bank Account"]
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-key "check-number"
:sort-name "Check #"
:sort sort}
"Check #"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-key "date"
:sort-name "Date"
:sort sort}
"Date"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:class "has-text-right"
:sort-key "amount"
:sort-name "Amount"
:sort sort}
"Amount"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-key "status"
:sort-name "Status"
:sort sort}
"Status"]
[:th {:style {:width "15em"}} "" ]]]
[:tbody
(if (:loading @status)
[:tr
[:td {:col-span 5}
[:i.fa.fa-spin.fa-spinner]]]
(for [check (:payments @payment-page)]
^{:key (:id check)}
[row {:check check
:selected-client selected-client
:void-event void-event}]))]]]))
[grid/sortable-header-cell {:sort-key "client" :sort-name "Client"} "Client"])
[grid/sortable-header-cell {:sort-key "vendor" :sort-name "Vendor"} "Vendor"]
[grid/sortable-header-cell {:sort-key "bank-account" :sort-name "Bank Account"} "Bank Account"]
[grid/sortable-header-cell {:sort-key "check-number" :sort-name "Check Number"} "Check Number"]
[grid/sortable-header-cell {:sort-key "date" :sort-name "Date" :style {:width "8em"}} "Date"]
[grid/sortable-header-cell {:sort-key "amount" :sort-name "Amount" :class "has-text-right" :style {:width "8em"}} "Amount"]
[grid/sortable-header-cell {:sort-key "status" :sort-name "Status" :style {:width "7em"}} "Status"]
[grid/header-cell {:style {:width "12em"}}]]]
[grid/body
(for [check (:payments payment-page)]
^{:key (:id check)}
[row {:check check
:selected-client selected-client
:void-event void-event}])]]]))