diff --git a/src/cljs/auto_ap/forms.cljs b/src/cljs/auto_ap/forms.cljs index 3c1ed988..913d6051 100644 --- a/src/cljs/auto_ap/forms.cljs +++ b/src/cljs/auto_ap/forms.cljs @@ -169,7 +169,8 @@ (.preventDefault e)) (when can-submit (re-frame/dispatch-sync (vec (conj submit-event params)))))} - [:h1.title.is-2 title] + (when title + [:h1.title.is-2 title]) children])) :raw-field (fn [control] (let [{:keys [data]} @(re-frame/subscribe [::form id])] diff --git a/src/cljs/auto_ap/views/pages/admin/users/form.cljs b/src/cljs/auto_ap/views/pages/admin/users/form.cljs index 94b5f605..89cf7d93 100644 --- a/src/cljs/auto_ap/views/pages/admin/users/form.cljs +++ b/src/cljs/auto_ap/views/pages/admin/users/form.cljs @@ -8,56 +8,58 @@ [auto-ap.views.components.address :refer [address-field]] [auto-ap.views.components.admin.side-bar :refer [admin-side-bar]] [auto-ap.views.components.layouts :refer [side-bar-layout]] - [auto-ap.views.utils :refer [login-url dispatch-value-change bind-field horizontal-field dispatch-event]] + [auto-ap.views.utils :refer [login-url dispatch-value-change bind-field horizontal-field dispatch-event with-user]] [auto-ap.views.components.modal :refer [modal action-modal]] [auto-ap.views.components.grid :as grid] [auto-ap.utils :refer [by replace-if]] [cljs.reader :as edn] [auto-ap.routes :as routes] [bidi.bidi :as bidi] - [auto-ap.status :as status])) + [auto-ap.status :as status] + [auto-ap.forms :as forms])) (re-frame/reg-sub - ::editing + ::can-submit (fn [db] - (-> db ::editing))) + true)) (re-frame/reg-event-db - ::change - (fn [db [_ path value]] - (assoc-in db (concat [::editing] path) value))) + ::changed + (forms/change-handler ::form + (fn [data field value] + []))) (re-frame/reg-event-db ::editing (fn [db [_ d]] (re-frame/dispatch [::events/modal-status ::edit-user {:visible? true}]) - (assoc-in db [::editing] d))) + (-> db + (forms/start-form ::form d)))) (re-frame/reg-event-db ::add-client - (fn [db [_ d]] + [(forms/in-form ::form)] + (fn [form [_ d]] (let [client (get @(re-frame/subscribe [::subs/clients-by-id]) - (get-in db [::editing :adding-client]))] - (update-in db [::editing :clients] conj client)))) + (get-in form [:data :adding-client]))] + (update-in form [:data :clients] conj client )))) (re-frame/reg-event-db ::remove-client - (fn [db [_ d]] - (update-in db [::editing :clients] #(filter (fn [c] (not= (:id c) d)) %)))) + [(forms/in-form ::form)] + (fn [form [_ d]] + (update-in form [:data :clients] #(filter (fn [c] (not= (:id c) d)) %)))) (re-frame/reg-event-fx - ::save - (fn [{:keys [db]} [_]] - {:db (-> db - (assoc-in [::editing :saving?] true )) - :graphql - {:token (-> db :user) - + ::saving + [with-user (forms/triggers-loading ::form) (forms/in-form ::form)] + (fn [{:keys [db user]} [_]] + {:graphql + {:token user :query-obj {:venia/operation {:operation/type :mutation :operation/name "EditUser"} - :venia/queries [{:query/data [:edit-user - {:edit-user (-> (get db ::editing) + {:edit-user (-> (:data db) (update :clients #(map :id %)) (select-keys #{:id :name :clients :role}))} [:id :name :role [:clients [:id :name]]]]}]} @@ -65,60 +67,64 @@ (re-frame/reg-event-fx ::saved + (forms/triggers-stop ::form) (fn [{:keys [db]} [_ {:keys [edit-user]}]] (re-frame/dispatch [::events/modal-completed ::edit-user]))) +(def user-form (forms/vertical-form {:submit-event [::saving] + :change-event [::changed] + :can-submit [::can-submit] + :id ::form})) + (defn form [] - (let [editing @(re-frame/subscribe [::editing])] - [action-modal {:title (str "Edit " (:name editing)) + (let [{:keys [data active? error id]} @(re-frame/subscribe [::forms/form ::form]) + {:keys [form-inline field raw-field error-notification submit-button]} user-form] + [action-modal {:title (str "Edit " (:name data)) :id ::edit-user :action-text "Save" - :save-event [::save]} - [horizontal-field - [:label.label "Name"] - [bind-field - [:input.input {:type "text" - :field [:name] - :spec ::entity/name - :event ::change - :subscription editing}]]] + :save-event [::saving] + :status-from ::form} + (form-inline {} + [:<> + (field "Name" + [:input.input {:type "text" + :field [:name] + :spec ::entity/name}]) - [horizontal-field - [:label.label "Role"] - [:div.control - [:div.select - [bind-field - [:select {:type "select" - :field [:role] - :spec ::entity/name - :event ::change - :subscription editing} - [:option {:value ":none"} "None"] - [:option {:value ":user"} "User"] - [:option {:value ":manager"} "Manager"] - [:option {:value ":admin"} "Admin"]]]]]] - - (when (#{":user" ":manager"} (:role editing)) - [horizontal-field - [:label.label "Clients"] + + [:div.field + [:p.help "Role"] [:div.control + [:div.select + [raw-field + [:select {:type "select" + :field [:role]} + [:option {:value ":none"} "None"] + [:option {:value ":user"} "User"] + [:option {:value ":manager"} "Manager"] + [:option {:value ":admin"} "Admin"]]]]]]]) + + + + (when (#{":user" ":manager"} (:role data)) + [:div.field + [:p.help "Clients"] + [:div.control [:div.field.has-addons - [:p.control + [:div.control [:div.select - [bind-field + [raw-field [:select {:type "select" - :field [:adding-client] - :event ::change - :subscription editing} + :field [:adding-client]} [:option] - (let [used-clients (set (map :id (:clients editing)))] - (for [{:keys [id name]} @(re-frame/subscribe [::subs/clients]) + (let [used-clients (set (map :id (:clients data)))] + (for [{:keys [id name] :as client} @(re-frame/subscribe [::subs/clients]) :when (not (used-clients id))] ^{:key id} [:option {:value id} name]))]]]] [:p.control [:button.button.is-primary {:on-click (dispatch-event [::add-client])} "Add"]]] [:ul - (for [{:keys [id name]} (:clients editing)] + (for [{:keys [id name]} (:clients data)] ^{:key id} [:li name [:a.icon {:on-click (dispatch-event [::remove-client id])} [:i.fa.fa-times ]]])]]])]))