mostly reorganized

This commit is contained in:
Bryce Covert
2019-01-24 09:18:47 -08:00
parent e75ef6b884
commit 336d0779ff
3 changed files with 162 additions and 191 deletions

View File

@@ -130,6 +130,12 @@
.nav.menu .nav-item.is-active .icon-btn .fa {
color: #2EB398;
}
nav.navbar .navbar-item.is-active {
background-color: #f5f5f5;
color: #363636;
}
.aside {
display:block;
background-color: #F9F9F9;
@@ -171,12 +177,12 @@
padding: 10px 0;
color: #6F7B7E;
}
.aside .main .item.active {
.aside .main .item.is-active {
background-color: #F1F1F1;
margin: 0 -50px;
padding-left: 50px;
}
.aside .main .item:active,.aside .main .item:hover {
.aside .main .item:is-active,.aside .main .item:hover {
background-color: #F2F2F2;
margin: 0 -50px;
padding-left: 50px;
@@ -295,7 +301,7 @@
font-weight: bold;
color: #B6C7D1;
}
.card.active {
.card.is-active {
background-color:#F5F5F5;
}
.table { table-layout: fixed }

View File

@@ -5,7 +5,7 @@
[auto-ap.routes :as routes]
[auto-ap.subs :as subs]
[auto-ap.events :as events]
[auto-ap.views.utils :refer [active-when= login-url dispatch-event]]
[auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event]]
[auto-ap.entities.clients :as clients]
[auto-ap.views.pages :as pages]
[auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]))
@@ -34,130 +34,47 @@
(defn login-dropdown []
(let [user (re-frame/subscribe [::subs/user])
menu (re-frame/subscribe [::subs/menu])]
[:div {:id "navMenu", :class "navbar-menu"}
[:div {:class "navbar-end"}
(if @user
[:div {:class (str "navbar-item has-dropdown " (when (get-in @menu [:account :active?]) "is-active"))}
[:a {:class "navbar-link login" :on-click (fn [e] (re-frame/dispatch [::events/toggle-menu :account]))} (:user/name @user)]
[:div {:class "navbar-dropdown"}
[:a {:class "navbar-item"} "My profile"]
(when (= "admin" (:user/role @user))
[:a {:class "navbar-item" :href (bidi/path-for routes/routes :admin)
:on-click (fn [e] (re-frame/dispatch [::events/toggle-menu :account]))} "Administration"])
[:hr {:class "navbar-divider"}]
[:a.navbar-item {:on-click (fn [e] (.preventDefault e) (re-frame/dispatch [::events/logout]))} "Logout"]]]
[:a.navbar-item {:href login-url} "Login"])]]))
(if @user
[:div {:class (str "navbar-item has-dropdown " (when (get-in @menu [:account :active?]) "is-active"))}
[:a {:class "navbar-link login" :on-click (fn [e] (re-frame/dispatch [::events/toggle-menu :account]))} (:user/name @user)]
[:div {:class "navbar-dropdown"}
[:a {:class "navbar-item"} "My profile"]
(when (= "admin" (:user/role @user))
[:a {:class "navbar-item" :href (bidi/path-for routes/routes :admin)
:on-click (fn [e] (re-frame/dispatch [::events/toggle-menu :account]))} "Administration"])
[:hr {:class "navbar-divider"}]
[:a.navbar-item {:on-click (fn [e] (.preventDefault e) (re-frame/dispatch [::events/logout]))} "Logout"]]]
[:a.navbar-item {:href login-url} "Login"])))
(defmulti layout page->layout)
(defmethod layout :admin-left-panel [ap]
(defn navbar [ap]
(let [client (re-frame/subscribe [::subs/client])
clients (re-frame/subscribe [::subs/clients])
menu (re-frame/subscribe [::subs/menu])]
[:div
[:nav {:class "navbar has-shadow"}
[:div {:class "container"}
[:div {:class "navbar-brand"}
[:a {:class "navbar-item", :href "../"}
[:img {:src "/img/logo.png"}]
]]
[:div {:class "navbar-burger burger", :data-target "navMenu"}
[:span]
[:span]
[:span]]
[login-dropdown]]]
[:div {:class "columns", :id "mail-app"}
[:aside {:class "column is-narrow aside menu hero is-fullheight"}
[:div.main
[:p.menu-label "General"]
[:p.menu-item
[:a {:href (bidi/path-for routes/routes :admin) , :class (str "item" (active-when= ap :admin))}
[:span {:class "icon"}
[:i {:class "fa fa-tachometer"}]]
[:span {:class "name"} "Dashboard"]]]
[:p.menu-label "Setup"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-clients) , :class (str "item" (active-when= ap :admin-clients))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Clients"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-vendors) , :class (str "item" (active-when= ap :admin-vendors))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Vendors"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-users), :class (str "item" (active-when= ap :admin-users))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Users"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-yodlee), :class (str "item" (active-when= ap :admin-yodlee))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Yodlee Link"]]]
[:ul ]]
[:p.menu-label "History"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-reminders) , :class (str "item" (active-when= ap :admin-reminders))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Reminders"]]]]
[:p.menu-label "Import"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-excel-import) , :class (str "item" (active-when= ap :admin-excel-import))}
[:span {:class "icon"}
[:i {:class "fa fa-download"}]]
[:span {:class "name"} "Excel Invoices"]]]]]
[:div.left-nav
[:div {:class "compose has-text-centered"}
[:a {:class "button is-danger is-block is-bold" :href (bidi/path-for routes/routes :index)}
[:span {:class "compose"} "Back"]]]]]
[:div {:class "column messages hero is-fullheight", :id "message-feed"}
^{:key (str "active-page-" (:name @client))}
[:div.inbox-messages
[pages/active-page ap]]]]
[:footer {:class "footer"}
[:div {:class "container"}
[:div {:class "content has-text-centered"}
[:p
[:strong "Integreat"]]
[:p
[:a {:class "icon", :href "https://github.com/dansup/bulma-templates"}
[:i {:class "fa fa-github"}]]]]]]
[:div#dz-hidden]]))
(defmethod layout :left-panel [ap]
(let [client (re-frame/subscribe [::subs/client])
clients (re-frame/subscribe [::subs/clients])
menu (re-frame/subscribe [::subs/menu])]
[:div
[:nav {:class "navbar has-shadow"}
[:nav {:class "navbar has-shadow"}
[:div {:class "container"}
[:div {:class "navbar-brand"}
[:a {:class "navbar-item", :href "../"}
[:img {:src "/img/logo.png"}]]]
[:div {:id "navMenu", :class "navbar-menu "
:on-click (fn [] (re-frame/dispatch [::events/toggle-menu :client]))}
[:div.navbar-menu
[:div.navbar-start
[:a.navbar-item {:class [(active-when ap #{:unpaid-invoices :paid-invoices})]
:href (bidi/path-for routes/routes :unpaid-invoices)}
"Invoices" ]
[:a.navbar-item {:class [(active-when ap = :checks)]
:href (bidi/path-for routes/routes :checks)}
"Payments" ]
[:a.navbar-item {:class [(active-when ap = :transactions)]
:href (bidi/path-for routes/routes :transactions)}
"Transactions" ]]
[:div {:class "navbar-burger burger", :data-target "navMenu"}
[:span]
[:span]
[:span]]
[:div.navbar-end
[:div { :class (str "navbar-item has-dropdown " (when (get-in @menu [:client :active?]) "is-active"))}
[:a {:class "navbar-link login"} "Client: " (if @client (:name @client)
"All")]
[:a {:class "navbar-link login" :on-click (fn [] (re-frame/dispatch [::events/toggle-menu :client]))} "Client: " (if @client (:name @client)
"All")]
[:div {:class "navbar-dropdown"}
[:a {:class "navbar-item"
:on-click (fn [] (re-frame/dispatch [::events/swap-client nil]))
@@ -167,81 +84,125 @@
^{:key id }
[:a {:class "navbar-item"
:on-click (fn [] (re-frame/dispatch [::events/swap-client client]))
} name])]]]]
[:div {:class "navbar-burger burger", :data-target "navMenu"}
[:span]
[:span]
[:span]]
[login-dropdown]]]
[:div {:class "columns", :id "mail-app"}
[:aside {:class "column is-narrow aside menu hero is-fullheight"}
[:div.main.left-nav
[:p.menu-label "General"]
[:p.menu-item
[:a {:href (bidi/path-for routes/routes :index) , :class (str "item" (active-when= ap :index))}
[:span {:class "icon"}
[:i {:class "fa fa-tachometer"}]]
[:span {:class "name"} "Dashboard"]]]
} name])]]]]
[login-dropdown]]]))
[:p.menu-label "Accounts Payable"]
[:ul.menu-list
#_[:li.menu-item
[:a {:href (bidi/path-for routes/routes :import-invoices) , :class (str "item" (active-when= ap :import-invoices))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Upload Invoices"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :unpaid-invoices), :class (str "item" (active-when= ap :unpaid-invoices))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-open-o"}]]
[:span {:class "name"} "Unpaid Invoices"]]
]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :paid-invoices), :class (str "item" (active-when= ap :paid-invoices))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Paid Invoices"]]
]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :checks), :class (str "item" (active-when= ap :checks))}
[:span {:class "icon"}
[:i {:class "fa fa-money"}]]
[:span {:class "name"} "Checks"]]]
(defn footer []
[:footer {:class "footer"}
[:div {:class "container"}
[:div {:class "content has-text-centered"}
[:p
[:strong "Integreat"]]
[:p
[:a {:class "icon", :href "https://github.com/dansup/bulma-templates"}
[:i {:class "fa fa-github"}]]]]]])
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :transactions), :class (str "item" (active-when= ap :transactions))}
[:span {:class "icon"}
[:i {:class "fa fa-exchange"}]]
[:span {:class "name"} "Transactions"]]]
]
[:div {:class "compose has-text-centered"}
[:a {:class "button is-danger is-block is-bold" :href (bidi/path-for routes/routes :index)
:on-click (dispatch-event [::events/modal-status ::user-editing-vendor {:visible? true}])}
[:span {:class "compose"} "New Vendor"]]]]]
(defn side-bar-layout [{:keys [side-bar main ap bottom]}]
[:div
[navbar ap]
[:div {:class "columns ", :id "mail-app"}
[:aside {:class "column is-narrow aside menu hero is-fullheight"}
[:div.main.left-nav
side-bar
[:div {:class "column messages hero is-fullheight", :id "message-feed"}
^{:key (str "active-page-" (:name @client))}
[:div.inbox-messages
[pages/active-page ap]]]]
[:footer {:class "footer"}
[:div {:class "container"}
[:div {:class "content has-text-centered"}
[:p
[:strong "Integreat"]]
[:p
[:a {:class "icon", :href "https://github.com/dansup/bulma-templates"}
[:i {:class "fa fa-github"}]]]]]]
[:div#dz-hidden]
[vendor-dialog {:vendor @(re-frame/subscribe [::subs/user-editing-vendor])
:save-event [::events/save-vendor]
:change-event [::events/change-nested-form-state [:user-editing-vendor]]
:id ::user-editing-vendor}]]))
]]
[:div {:class "column messages hero is-fullheight", :id "message-feed"}
^{:key (str "active-page-")}
[:div.inbox-messages
main]]]
[footer]
bottom
[:div#dz-hidden]])
(defmulti layout page->layout)
(defmethod layout :admin-left-panel [ap]
[side-bar-layout {:side-bar
[:div
[:p.menu-label "General"]
[:p.menu-item
[:a {:href (bidi/path-for routes/routes :admin) , :class (str "item" (active-when ap = :admin))}
[:span {:class "icon"}
[:i {:class "fa fa-tachometer"}]]
[:span {:class "name"} "Dashboard"]]]
[:p.menu-label "Setup"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-clients) , :class (str "item" (active-when ap = :admin-clients))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Clients"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-vendors) , :class (str "item" (active-when ap = :admin-vendors))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Vendors"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-users), :class (str "item" (active-when ap = :admin-users))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Users"]]]
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-yodlee), :class (str "item" (active-when ap = :admin-yodlee))}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Yodlee Link"]]]
[:ul ]]
[:p.menu-label "History"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-reminders) , :class (str "item" (active-when ap = :admin-reminders))}
[:span {:class "icon"}
[:i {:class "fa fa-star-o"}]]
[:span {:class "name"} "Reminders"]]]]
[:p.menu-label "Import"]
[:ul.menu-list
[:li.menu-item
[:a {:href (bidi/path-for routes/routes :admin-excel-import) , :class (str "item" (active-when ap = :admin-excel-import))}
[:span {:class "icon"}
[:i {:class "fa fa-download"}]]
[:span {:class "name"} "Excel Invoices"]]]]]
:main [pages/active-page ap]
:ap ap
:bottom [vendor-dialog {:vendor @(re-frame/subscribe [::subs/user-editing-vendor])
:save-event [::events/save-vendor]
:change-event [::events/change-nested-form-state [:user-editing-vendor]]
:id ::user-editing-vendor}]}])
(defmethod layout :left-panel [ap]
[side-bar-layout {:side-bar [:div [:p.menu-label "Type"]
[:ul.menu-list
[:li.menu-item
[:a.item {:href (bidi/path-for routes/routes :unpaid-invoices)
:class [(active-when ap = :unpaid-invoices)]}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-open-o"}]]
[:span {:class "name"} "Unpaid Invoices"]]]
[:li.menu-item
[:a.item {:href (bidi/path-for routes/routes :paid-invoices)
:class [(active-when ap = :paid-invoices)]}
[:span {:class "icon"}
[:i {:class "fa fa-envelope-o"}]]
[:span {:class "name"} "Paid Invoices"]]]]
[:div {:class "compose has-text-centered"}
[:a {:class "button is-danger is-block is-bold" :href (bidi/path-for routes/routes :index)
:on-click (dispatch-event [::events/modal-status ::user-editing-vendor {:visible? true}])}
[:span {:class "compose"} "New Vendor"]]]]
:main [pages/active-page ap]
:bottom [vendor-dialog {:vendor @(re-frame/subscribe [::subs/user-editing-vendor])
:save-event [::events/save-vendor]
:change-event [::events/change-nested-form-state [:user-editing-vendor]]
:id ::user-editing-vendor}]
:ap ap}])
(defmethod layout :blank [ap]
[:div

View File

@@ -8,7 +8,11 @@
[cljs-time.format :as format]))
(defn active-when= [active-page candidate]
(when (= active-page candidate) " active"))
(when (= active-page candidate) " is-active"))
(defn active-when [active-page f & rest]
(when (apply f (into [active-page] rest)) " is-active"))
(def login-url
(let [client-id "264081895820-0nndcfo3pbtqf30sro82vgq5r27h8736.apps.googleusercontent.com"