From e49200e6dc9bd94511b9ba63c8263f5c05709798 Mon Sep 17 00:00:00 2001 From: Bryce Covert Date: Tue, 4 Aug 2020 07:42:50 -0700 Subject: [PATCH] standardized user form --- .../auto_ap/views/pages/admin/users/form.cljs | 124 ++++++++++++++++++ .../views/pages/admin/users/table.cljs | 44 +++++++ 2 files changed, 168 insertions(+) create mode 100644 src/cljs/auto_ap/views/pages/admin/users/form.cljs create mode 100644 src/cljs/auto_ap/views/pages/admin/users/table.cljs diff --git a/src/cljs/auto_ap/views/pages/admin/users/form.cljs b/src/cljs/auto_ap/views/pages/admin/users/form.cljs new file mode 100644 index 00000000..94b5f605 --- /dev/null +++ b/src/cljs/auto_ap/views/pages/admin/users/form.cljs @@ -0,0 +1,124 @@ +(ns auto-ap.views.pages.admin.users.form + (:require [re-frame.core :as re-frame] + [reagent.core :as reagent] + [clojure.string :as str] + [auto-ap.subs :as subs] + [auto-ap.events :as events] + [auto-ap.entities.clients :as entity] + [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.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])) + +(re-frame/reg-sub + ::editing + (fn [db] + (-> db ::editing))) + +(re-frame/reg-event-db + ::change + (fn [db [_ path value]] + (assoc-in db (concat [::editing] path) 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))) + +(re-frame/reg-event-db + ::add-client + (fn [db [_ d]] + (let [client (get @(re-frame/subscribe [::subs/clients-by-id]) + (get-in db [::editing :adding-client]))] + (update-in db [::editing :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)) %)))) + +(re-frame/reg-event-fx + ::save + (fn [{:keys [db]} [_]] + {:db (-> db + (assoc-in [::editing :saving?] true )) + :graphql + {:token (-> db :user) + + :query-obj {:venia/operation {:operation/type :mutation + :operation/name "EditUser"} + + :venia/queries [{:query/data [:edit-user + {:edit-user (-> (get db ::editing) + (update :clients #(map :id %)) + (select-keys #{:id :name :clients :role}))} + [:id :name :role [:clients [:id :name]]]]}]} + :on-success [::saved]}})) + +(re-frame/reg-event-fx + ::saved + (fn [{:keys [db]} [_ {:keys [edit-user]}]] + (re-frame/dispatch [::events/modal-completed ::edit-user]))) + +(defn form [] + (let [editing @(re-frame/subscribe [::editing])] + [action-modal {:title (str "Edit " (:name editing)) + :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}]]] + + [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.control + + [:div.field.has-addons + [:p.control + [:div.select + [bind-field + [:select {:type "select" + :field [:adding-client] + :event ::change + :subscription editing} + [:option] + (let [used-clients (set (map :id (:clients editing)))] + (for [{:keys [id name]} @(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)] + ^{:key id} [:li name [:a.icon {:on-click (dispatch-event [::remove-client id])} [:i.fa.fa-times ]]])]]])])) diff --git a/src/cljs/auto_ap/views/pages/admin/users/table.cljs b/src/cljs/auto_ap/views/pages/admin/users/table.cljs new file mode 100644 index 00000000..69fbe734 --- /dev/null +++ b/src/cljs/auto_ap/views/pages/admin/users/table.cljs @@ -0,0 +1,44 @@ +(ns auto-ap.views.pages.admin.users.table + (:require + [clojure.string :as str] + [re-frame.core :as re-frame] + [auto-ap.views.utils :refer [action-cell-width]] + [auto-ap.views.pages.admin.users.form :as form] + [auto-ap.views.components.buttons :as buttons] + [auto-ap.views.components.grid :as grid])) + +(re-frame/reg-event-fx + ::params-changed + (fn [{:keys [db]} [_ p]] + {:db (assoc db ::params p)})) + +(re-frame/reg-sub + ::params + (fn [db] + (-> db ::params))) + +(defn table [{:keys [status page]}] + (let [params @(re-frame/subscribe [::params])] + [grid/grid {:status status + :on-params-change (fn [p] + (re-frame/dispatch [::params-changed p])) + :params params + :column-count 4} + [grid/controls page] + [grid/table {:fullwidth true} + [grid/header + [grid/row {} + [grid/header-cell {} "User"] + [grid/header-cell {} "Role"] + [grid/header-cell {} "Clients"] + [grid/header-cell {:style {:width (action-cell-width 1)}} ]]] + [grid/body + (for [{:keys [id name role clients] :as c} (:data page)] + ^{:key (str name "-" id )} + [grid/row {:class (:class c)} + [grid/cell {} name] + [grid/cell {} role] + [grid/cell {} (str/join ", " (map :name clients))] + [grid/cell {} + [buttons/fa-icon {:event [::form/editing c] + :icon "fa-pencil"}]]])]]]))