added sortability

This commit is contained in:
Bryce Covert
2018-04-12 15:26:18 -07:00
parent f41c0fcba7
commit 38d9c1a1d3
4 changed files with 59 additions and 54 deletions

View File

@@ -1,54 +1,57 @@
(ns auto-ap.views.components.invoice-table
(:require [re-frame.core :as re-frame]
[auto-ap.subs :as subs]))
[auto-ap.subs :as subs]
[reagent.core :as reagent]))
(re-frame/reg-sub
::invoices
(fn [db [_ id]]
(get-in db [:invoice-table id :invoices])))
(defn toggle-sort-by [params key]
(-> params
(assoc :sort-by key)
(assoc :asc (if (:asc params)
false
true))))
(re-frame/reg-sub
::status
(fn [db [_ id]]
(get-in db [:invoice-table id :status])))
(defn sort-icon [which sort-by asc]
(cond
(and (= sort-by which) asc)
[:span.icon
[:i.fa.fa-sort-up]]
(re-frame/reg-event-fx
::mounted
(fn [{:keys [db] :as cofx} [_ id]]
{:db (assoc-in db [:invoice-table id :status :loading] true )
:graphql {:token (-> cofx :db :user)
:query-obj {:venia/queries [[:invoice
{:imported false :company_id (:id @(re-frame/subscribe [::subs/company]))}
[:id :total :invoice-number :date [:vendor [:name :id]] [:company [:name :id]]]]]}
:on-success [::received-invoices id]}}))
(and (= sort-by which) (not asc))
[:span.icon
[:i.fa.fa-sort-down]]
(re-frame/reg-event-fx
::received-invoices
(fn [{:keys [db] :as cofx} [_ id invoices]]
{:db (-> db
(assoc-in [:invoice-table id :invoices] (:invoice invoices))
(assoc-in [:invoice-table id :status :loading] false))}))
:else
[:span.icon
[:i.fa.fa-sort]]))
(defn invoice-table [{:keys [id invoices status on-params-change]}]
[:table {:class "table", :style {:width "100%"}}
[:thead
[:tr
[:th {:on-click (fn [e] (on-params-change {:sort-by "vendor"}))} "Vendor" ]
[:th {:on-click (fn [e] (on-params-change {:sort-by "company"}))} "Company"]
[:th {:on-click (fn [e] (on-params-change {:sort-by "invoice-number"}))} "Invoice #"]
[:th {:on-click (fn [e] (on-params-change {:sort-by "date"}))} "Date"]
[:th {:on-click (fn [e] (on-params-change {:sort-by "total"}))} "Amount"]]]
[:tbody
(if (:loading @status)
[:tr
[:td {:col-span 5}
[:i.fa.fa-spin.fa-spinner]]]
(for [{:keys [company invoice-number date total id vendor] :as i} @invoices]
^{:key (str company "-" invoice-number "-" date "-" total "-" id)}
[:tr
[:td (:name vendor)]
[:td (:name company)]
[:td invoice-number]
[:td date]
[:td total]]))]])
(let [state (reagent/atom {})]
(fn []
(let [{:keys [sort-by asc]} @state]
[:table {:class "table", :style {:width "100%"}}
[:thead
[:tr
[:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "vendor")))} "Vendor"
(sort-icon "vendor" sort-by asc)
]
[:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "company")))} "Company"
(sort-icon "company" sort-by asc)]
[:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "invoice-number")))} "Invoice #"
(sort-icon "invoice-number" sort-by asc)]
[:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "date")))} "Date"
(sort-icon "date" sort-by asc)]
[:th {:on-click (fn [e] (on-params-change (swap! state toggle-sort-by "total")))} "Amount"
(sort-icon "total" sort-by asc)]]]
[:tbody
(if (:loading @status)
[:tr
[:td {:col-span 5}
[:i.fa.fa-spin.fa-spinner]]]
(for [{:keys [company invoice-number date total id vendor] :as i} @invoices]
^{:key (str company "-" invoice-number "-" date "-" total "-" id)}
[:tr
[:td (:name vendor)]
[:td (:name company)]
[:td invoice-number]
[:td date]
[:td total]]))]]))))

View File

@@ -16,7 +16,8 @@
:query-obj {:venia/queries [[:invoice
{:imported true
:company_id (:id @(re-frame/subscribe [::subs/company]))
:sort-by (:sort-by params)}
:sort-by (:sort-by params)
:asc (:asc params true)}
[:id :total :invoice-number :date [:vendor [:name :id]] [:company [:name :id]]]]]}
:on-success [::events/received-invoices :unpaid]}}))