working on ui improvements.

This commit is contained in:
BC
2018-07-06 18:48:57 -07:00
parent bf7d0698d4
commit d87ebbbfe4
5 changed files with 108 additions and 102 deletions

View File

@@ -25,19 +25,19 @@
(let [{:keys [visible? saving?]} @(re-frame/subscribe [::subs/modal-state id])]
(when visible?
(-> [modal {:title title
:foot [:input.button.is-primary {
:type "submit"
:form id
:disabled (cond saving?
"disabled"
:foot [:input.button.is-primary {:type "submit"
:tab-index "0"
:form id
:disabled (cond saving?
"disabled"
(not can-submit?)
"disabled"
(not can-submit?)
"disabled"
:else
"")
:class (when saving?
"is-loading")
:else
"")
:class (when saving?
"is-loading")
:value action-text}
]
:id id

View File

@@ -1,5 +1,6 @@
(ns auto-ap.views.components.typeahead
(:require [reagent.core :as r]
[reagent.ratom :as ra]
[clojure.string :as str]))
(defn typeahead [{:keys [matches on-change field text-field value class not-found-description
@@ -13,73 +14,75 @@
(when on-change
(if (= :not-found id)
(on-change nil text-description text-value)
(on-change id text-description (or text-value text-description)))))]
(fn [{:keys [matches on-change field text-field value class not-found-description]}]
(let [valid-matches (take 5 (for [[[id t :as match] i] (map vector matches (range))
:when (str/includes? (.toLowerCase t) (.toLowerCase @text))]
match))
valid-matches (if (and not-found-description @text)
(concat valid-matches [[:not-found (not-found-description @text) (not-found-value @text)]])
valid-matches)]
[:div.typeahead
(if @selected
[:div.input {:class class
:tab-index "0"
:on-key-up (fn [e]
(if (= 8 (.-keyCode e))
(do
(select [nil "" nil])
true)
false))}
[:div.control
[:div.tags.has-addons
[:span.tag @text]
[:a.tag.is-delete {:on-click (fn [] (select [nil "" nil]))}]]]]
[:input.input {:type "text"
:class class
:field field
:value @text
:auto-focus auto-focus
:on-blur (fn [e]
(cond @selected
nil
(on-change id text-description (or text-value text-description)))))
]
(r/create-class
{:reagent-render (fn [{:keys [matches on-change field text-field value class not-found-description]}]
(let [valid-matches (take 5 (for [[[id t :as match] i] (map vector matches (range))
:when (str/includes? (.toLowerCase t) (.toLowerCase @text))]
match))
valid-matches (if (and not-found-description @text)
(concat valid-matches [[:not-found (not-found-description @text) (not-found-value @text)]])
valid-matches)]
[:div.typeahead
(if @selected
[:div.input {:class class
:tab-index "0"
:on-key-up (fn [e]
(if (= 8 (.-keyCode e))
(do
(select [nil "" nil])
true)
false))}
[:div.control
[:div.tags.has-addons
[:span.tag @text]
[:a.tag.is-delete {:on-click (fn [] (select [nil "" nil]))}]]]]
[:input.input {:type "text"
:class class
:field field
:value @text
:auto-focus auto-focus
:on-blur (fn [e]
(cond @selected
nil
(#{"" nil} @text)
nil
(#{"" nil} @text)
nil
(seq valid-matches)
(do (select (first valid-matches))
true)
(seq valid-matches)
(do (select (first valid-matches))
true)
:else
(do (select [nil ""])
true)))
:on-key-up (fn [e]
(if (and (= 13 (.-keyCode e))
(seq valid-matches))
(do
(select (first valid-matches))
false)
true))
:on-change (fn [e]
(reset! highlighted (ffirst valid-matches))
(select [nil (.. e -target -value)]))}
])
(cond
(and (seq @text)
(not @selected)
(seq valid-matches))
[:div.typeahead-menu
[:ul
(for [[id t :as match] valid-matches]
:else
(do (select [nil ""])
true)))
:on-key-up (fn [e]
(if (and (= 13 (.-keyCode e))
(seq valid-matches))
(do
(select (first valid-matches))
false)
true))
:on-change (fn [e]
(reset! highlighted (ffirst valid-matches))
(select [nil (.. e -target -value)]))}
])
(cond
(and (seq @text)
(not @selected)
(seq valid-matches))
[:div.typeahead-menu
[:ul
(for [[id t :as match] valid-matches]
[:li.typeahead-suggestion {:class (if (= id @highlighted)
"typeahead-highlighted")
:on-mouse-down #(do (select match))} t])]]
[:li.typeahead-suggestion {:class (if (= id @highlighted)
"typeahead-highlighted")
:on-mouse-down #(do (select match))} t])]]
:else
nil)]))))
:else
nil)]))})))

View File

@@ -10,10 +10,8 @@
[auto-ap.entities.vendors :as entity]
[auto-ap.subs :as subs]))
(defn vendor-dialog [{:keys [vendor save-event change-event id] {:keys [name]} :vendor}]
(let [companies-by-id @(re-frame/subscribe [::subs/companies-by-id])]
[action-modal {:id id
:title [:span (if (:id vendor)
(str "Edit " (or name "<vendor>"))
@@ -22,13 +20,17 @@
[:span.icon.has-text-danger
[:i.fa.fa-exclamation-triangle]])]
:action-text "Save"
:save-event save-event}
:save-event save-event
:can-submit? (s/valid? ::entity/vendor vendor)}
(doto (s/explain ::entity/vendor vendor) println)
[horizontal-field
[:label.label "Name"]
[:div.control
[bind-field
[:input.input {:type "text"
:auto-focus true
:field :name
:spec ::entity/name
:event change-event
@@ -43,7 +45,16 @@
:spec ::entity/print-as
:event change-event
:subscription vendor}]]]]
[:h2.subtitle "Expense Accounts"]
[horizontal-field
[:label.label "Default"]
[bind-field
[typeahead {:matches (map (fn [[k v]] [k (:name v)]) chooseable-expense-accounts)
:type "typeahead"
:field [:default-expense-account]
:spec ::entity/default-expense-account
:event change-event
:subscription vendor}]]]
#_[horizontal-field
[:label.label "Code"]
[:div.control
@@ -151,16 +162,7 @@
:subscription vendor}]]
" Never"]]]
[:h2.subtitle "Expense Accounts"]
[horizontal-field
[:label.label "Default"]
[bind-field
[typeahead {:matches (map (fn [[k v]] [k (:name v)]) chooseable-expense-accounts)
:type "typeahead"
:field [:default-expense-account]
:spec ::entity/default-expense-account
:event change-event
:subscription vendor}]]]

View File

@@ -290,7 +290,6 @@
(re-frame/reg-event-fx
::change-expense-accounts
(fn [{:keys [db]} [_ id]]
(println "HELLLO")
{:dispatch [::events/modal-status ::change-expense-accounts {:visible? true}]
:db (assoc-in db [::change-expense-accounts :invoice] (get (by :id (get-in db [::invoice-page :invoices])) id))}))
@@ -529,6 +528,16 @@
:action-text "Create"
:save-event [::create-invoice]
:can-submit? (s/valid? ::invoice/invoice data)}
(when-not @(re-frame/subscribe [::subs/company])
[horizontal-field
[:label.label "Company"]
[bind-field
[typeahead {:matches (map (fn [x] [(:id x) (:name x)]) @(re-frame/subscribe [::subs/companies]))
:type "typeahead"
:field [:company-id]
:event change-event
:spec ::invoice/company-id
:subscription data}]]])
[horizontal-field
[:label.label "Vendor"]
@@ -552,16 +561,7 @@
:spec ::invoice/date
:subscription data}]]]
(when-not @(re-frame/subscribe [::subs/company])
[horizontal-field
[:label.label "Company"]
[bind-field
[typeahead {:matches (map (fn [x] [(:id x) (:name x)]) @(re-frame/subscribe [::subs/companies]))
:type "typeahead"
:field [:company-id]
:event change-event
:spec ::invoice/company-id
:subscription data}]]])
[horizontal-field
[:label.label "Invoice #"]
@@ -583,7 +583,8 @@
:event change-event
:subscription data
:spec ::invoice/total
:step "0.01"}]]]]]]))
:step "0.01"}]]]]]
]))

View File

@@ -30,7 +30,7 @@
(when (.-stopPropagation e)
(.stopPropagation e)
(.preventDefault e))
(re-frame/dispatch event)))
(re-frame/dispatch-sync event)))
(def pretty-long (format/formatter "MM/dd/yyyy HH:mm:ss"))
(def pretty (format/formatter "MM/dd/yyyy"))