fixing layout stuff.

src/cljs/auto_ap/core.cljs

@@ -2,7 +2,7 @@
   (:require [reagent.core :as reagent]
             [re-frame.core :as re-frame]
             [auto-ap.events :as events]
-            [auto-ap.views.main :refer [page] ]
+            [auto-ap.views.main :refer [page active-page side-bar-layout] ]
             [auto-ap.config :as config]
             [auto-ap.effects :as effects]
             [pushy.core :as pushy]
@@ -16,7 +16,7 @@
 
 (defn mount-root []
   (re-frame/clear-subscription-cache!)
-  (reagent/render [page]
+  (reagent/render [active-page]
                   (.getElementById js/document "app")))
 
 (defn ^:export init []

src/cljs/auto_ap/views/components/invoices/side_bar.cljs

@@ -0,0 +1,33 @@
+(ns auto-ap.views.components.invoices.side-bar
+  (:require [re-frame.core :as re-frame]
+            [reagent.core :as r]
+            [clojure.string :as str]
+            [clojure.spec.alpha :as s]
+            [cljs-time.core :as c]
+            [goog.string :as gstring]
+            [bidi.bidi :as bidi]
+            [auto-ap.routes :as routes]
+            [auto-ap.views.utils :refer [active-when dispatch-event bind-field horizontal-field date->str str->date pretty standard]]
+            [auto-ap.subs :as subs]
+            [auto-ap.events :as events]))
+
+(defn invoices-side-bar []
+  (let [ap @(re-frame/subscribe [::subs/active-page])]
+    [: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"]]]]))

src/cljs/auto_ap/views/main.cljs

@@ -6,6 +6,8 @@
    [auto-ap.subs :as subs]
    [auto-ap.events :as events]
    [auto-ap.views.utils :refer [active-when active-when= login-url dispatch-event]]
+   [auto-ap.views.pages.unpaid-invoices :refer [unpaid-invoices-page]]
+   [auto-ap.views.pages.paid-invoices :refer [paid-invoices-page]]
    [auto-ap.entities.clients :as clients]
    [auto-ap.views.pages :as pages]
    [auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]))
@@ -36,7 +38,6 @@
         menu (re-frame/subscribe [::subs/menu])]
     (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"]
@@ -98,22 +99,19 @@
        [:i {:class "fa fa-github"}]]]]]])
 
 (defn side-bar-layout [{:keys [side-bar main ap bottom]}]
-  [:div 
+  (let [ap @(re-frame/subscribe [::subs/active-page])]
-   [navbar ap]
+    [:div 
-   [:div {:class "columns ", :id "mail-app"}
+     [navbar ap]
-    [:aside {:class "column is-narrow aside menu hero is-fullheight"}
+     [:div {:class "columns ", :id "mail-app"}
-     [:div.main.left-nav
+      [:aside {:class "column is-narrow aside menu hero is-fullheight"}
-      side-bar
+       [:div.main.left-nav
-      
+        side-bar]]
-      ]]
+      [:div {:class "column messages hero is-fullheight", :id "message-feed"}
-    [:div {:class "column messages hero is-fullheight", :id "message-feed"}
+       ^{:key (str "active-page-")}
-     ^{:key (str "active-page-")}
+       [:div.inbox-messages main]]]
-     [:div.inbox-messages
+     [footer]
-      main]]]
+     bottom
-   [footer]
+     [:div#dz-hidden]]))
-   
-   bottom
-   [:div#dz-hidden]])
 
 (defmulti layout page->layout)
 
@@ -205,10 +203,18 @@
                        :ap ap}])
 
 (defmethod layout :blank [ap]
-  [:div  
+  [:div
    ^{:key ap} [pages/active-page ap]])
 
-(defn page []
+(defmulti page (fn [active-page] active-page))
+(defmethod page :unpaid-invoices [_]
+  (unpaid-invoices-page))
+
+(defmethod page :paid-invoices [_]
+  (paid-invoices-page))
+
+
+(defn active-page []
   (let [ap (re-frame/subscribe [::subs/active-page])]
-    [:div  
+    [:div
-     ^{:key @ap} [layout @ap]]))
+     ^{:key @ap} [page @ap]]))

src/cljs/auto_ap/views/pages/paid_invoices.cljs

@@ -5,9 +5,12 @@
             [auto-ap.events :as events]
             [auto-ap.views.utils :refer [dispatch-event]]
             [auto-ap.utils :refer [by replace-if]]
+            [auto-ap.views.main :refer [side-bar-layout]]
             [auto-ap.views.pages.check :as check]
             [auto-ap.views.components.invoice-table :refer [invoice-table] :as invoice-table]
             [auto-ap.views.components.expense-accounts-dialog :as expense-accounts-dialog]
+            [auto-ap.views.components.invoices.side-bar :refer [invoices-side-bar]]
+            [auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]
             [auto-ap.subs :as subs]))
 
 
@@ -59,7 +62,7 @@
                            (replace-if #(= (:id %1) (:id %2)) updated is)))
               (dissoc ::change-expense-accounts))})))
 
-(def paid-invoices-page
+(def paid-invoices-content
   
   (with-meta
     (fn []
@@ -80,3 +83,9 @@
           {:updated-event [::expense-accounts-updated]}]]))
     {:component-will-mount #(do (println "HERE2") (re-frame/dispatch-sync [::params-change {}])) }))
 
+(defn paid-invoices-page []
+  [side-bar-layout {:side-bar [invoices-side-bar]
+                    :main [paid-invoices-content]
+                    :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}]}])

src/cljs/auto_ap/views/pages/unpaid_invoices.cljs

@@ -8,10 +8,15 @@
             [auto-ap.entities.clients :as client]
             [auto-ap.entities.invoice :as invoice]
             [auto-ap.entities.vendors :as vendor]
+            [bidi.bidi :as bidi]
+            [auto-ap.views.main :refer [side-bar-layout]]
+            [auto-ap.routes :as routes]
             [auto-ap.views.components.expense-accounts-dialog :as expense-accounts-dialog]
+            [auto-ap.views.components.vendor-dialog :refer [vendor-dialog]]
+            [auto-ap.views.components.invoices.side-bar :refer [invoices-side-bar]]
             [auto-ap.expense-accounts :as expense-accounts]
             [auto-ap.entities.invoices-expense-accounts :as invoices-expense-accounts]
-            [auto-ap.views.utils :refer [dispatch-event bind-field horizontal-field date->str str->date pretty standard]]
+            [auto-ap.views.utils :refer [active-when dispatch-event bind-field horizontal-field date->str str->date pretty standard]]
             [auto-ap.utils :refer [by replace-if]]
             [auto-ap.views.pages.check :as check]
             [auto-ap.views.components.invoice-table :refer [invoice-table] :as invoice-table]
@@ -677,9 +682,12 @@
 
 
 
-(def unpaid-invoices-page
+
+
+(def unpaid-invoices-content
   (with-meta
-    (fn []
+    (fn [_]
+      
       (let [{:keys [checked print-checks-shown? print-checks-loading? advanced-print-shown? vendor-filter]} @(re-frame/subscribe [::invoice-page]) 
             current-client @(re-frame/subscribe [::subs/client])
             {check-results-shown? :shown? pdf-url :pdf-url} @(re-frame/subscribe [::check-results])]
@@ -769,3 +777,10 @@
 
          ]))
     {:component-will-mount #(re-frame/dispatch-sync [::params-change {}]) }))
+
+(defn unpaid-invoices-page []
+  [side-bar-layout {:side-bar [invoices-side-bar]
+                    :main [unpaid-invoices-content]
+                    :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}]}])