much better sorting.

This commit is contained in:
Bryce Covert
2020-04-25 16:21:36 -07:00
parent a8736f351e
commit d799fc469d
17 changed files with 294 additions and 219 deletions

View File

@@ -3,6 +3,7 @@
[auto-ap.subs :as subs]
[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]
@@ -44,8 +45,9 @@
(defn query [params]
{:venia/queries [[:invoice_page
(assoc params
:client-id (:id @(re-frame/subscribe [::subs/client])))
(-> params
(assoc
:client-id (:id @(re-frame/subscribe [::subs/client]))))
[[:invoices [:id :total :outstanding-balance :invoice-number :date :due :status :client-identifier
[:vendor [:name :id]]
[:expense_accounts [:amount :id :location
@@ -64,19 +66,22 @@
opc (fn [p]
(on-params-change (merge @params p)))]
(fn [{:keys [id invoice-page status on-params-change vendors checked params]}]
(let [{:keys [sort-by asc]} @params
(let [{:keys [sort asc]} @params
{:keys [invoices 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%")
]
percentage-size (if selected-client "%50%" "33%")]
[:div
[paginator {:start start :end end :count count :total total
:on-change (fn [p ]
(on-params-change (merge @params p) ))}]
[:div.level
[:div.level-left
[:div.level-item
[paginator {:start start :end end :count count :total total
:on-change (fn [p ]
(on-params-change (merge @params p) ))}]]
[:div.level-item
[sort-by-list {:sort sort
:on-change opc}]]]]
[:table.table.is-fullwidth
[:thead
[:tr
@@ -86,53 +91,61 @@
(when-not selected-client
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Client"
:sort-key "client"
:sort-by sort-by
:sort sort
:asc asc}
"Client"])
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Vendor"
:sort-key "vendor"
:sort-by sort-by
:sort sort
:asc asc}
"Vendor"]
[sorted-column {:on-sort opc
:style {:width percentage-size :cursor "pointer"}
:sort-name "Invoice Number"
:sort-key "invoice-number"
:sort-by sort-by
:sort sort
:asc asc}
"Invoice #"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Date"
:sort-key "date"
:sort-by sort-by
:sort sort
:asc asc}
"Date"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Due"
:sort-key "due"
:sort-by sort-by
:sort sort
:asc asc}
"Due"]
[sorted-column {:on-sort opc
:style {:width "5em" :cursor "pointer"}
:sort-name "Location"
:sort-key "location"
:sort-by sort-by
:sort sort
:asc asc}
"Loc"]
[sorted-column {:on-sort opc
:style {:width "8em" :cursor "pointer"}
:sort-name "Total"
:sort-key "total"
:class "has-text-right"
:sort-by sort-by
:sort sort
:asc asc}
"Amount"]
[sorted-column {:on-sort opc
:style {:width "10em" :cursor "pointer"}
:sort-name "Outstanding"
:sort-key "outstanding-balance"
:class "has-text-right"
:sort-by sort-by
:sort sort
:asc asc}
"Outstanding"]

View File

@@ -0,0 +1,21 @@
(ns auto-ap.views.components.sort-by-list
(:require [re-frame.core :as re-frame]
[auto-ap.subs :as subs]
[auto-ap.views.utils :refer [date->str]]
[reagent.core :as reagent]
[clojure.string :as str]
[cljs-time.format :as format]))
(defn sort-by-list [{:keys [sort on-change]}]
[:div.field.is-grouped.is-grouped-multiline
(for [{:keys [sort-key sort-name asc]} sort]
^{:key sort-key}
[:div.control
[:div.tags.has-addons
[:div.tag.is-medium [:span.icon (if asc
[:i.fa.fa-sort-up]
[:i.fa.fa-sort-down])]
[:span sort-name] ]
[:a.tag.is-medium.is-delete {:on-click (fn []
(on-change {:sort (filter #(not= sort-key (:sort-key %)) sort)}))}]]])])

View File

@@ -5,30 +5,45 @@
[reagent.core :as reagent]
[clojure.string :as str]
[cljs-time.format :as format]))
(defn toggle-sort-by [params key]
(defn toggle-sort-by [params sort-key sort-name asc]
(let [[found? sort] (reduce
(fn [[found? sort] sort-item]
(if (= sort-key (:sort-key sort-item))
[true (conj sort
(update sort-item :asc not))]
[found? (conj sort sort-item)]))
[false []]
(:sort params))
sort (if found?
sort
(conj sort {:sort-key sort-key
:sort-name sort-name
:asc true}))]
(-> params
(assoc :sort-by key)
(update :asc not)))
(-> params
(assoc :sort sort))))
(defn sort-icon [which sort-by asc]
(cond
(and (= sort-by which) asc)
[:span.icon
[:i.fa.fa-sort-up]]
(defn sort-icon [which sort asc]
(let [sort-item (first (filter #(= which (:sort-key %)) sort))]
(cond
(and sort-item (:asc sort-item))
[:span.icon
[:i.fa.fa-sort-up]]
(and (= sort-by which) (not asc))
[:span.icon
[:i.fa.fa-sort-down]]
(and sort-item (not (:asc sort-item)))
[:span.icon
[:i.fa.fa-sort-down]]
:else
[:span.icon
[:i.fa.fa-sort]]))
:else
[:span.icon
[:i.fa.fa-sort]])))
(defn sorted-column [{:keys [on-sort sort-key sort-by asc style class]} & rest]
[:th {:on-click (fn [e] (on-sort (toggle-sort-by {:asc asc} sort-key)))
(defn sorted-column [{:keys [on-sort sort-key sort sort-name asc style class]} & rest]
[:th {:on-click (fn [e]
(on-sort
(toggle-sort-by {:sort sort} sort-key sort-name asc)))
:style style
:class class}
rest
(sort-icon sort-key sort-by asc)])
(sort-icon sort-key sort asc)])