(ns auto-ap.views.pages.check
  (:require-macros [cljs.core.async.macros :refer [go]])
  (:require [re-frame.core :as re-frame]
            [reagent.core :as reagent]
            [auto-ap.subs :as subs]
            [auto-ap.events :as events]
            [auto-ap.views.utils :refer [login-url]]
            [cljs.reader :as edn]
            [auto-ap.routes :as routes]
            [bidi.bidi :as bidi]
            [goog.string :as gstring]))

(re-frame/reg-sub
 ::checks
 (fn [db]
   (-> db ::checks)))

(defn check-page []
  (let [checks @(re-frame/subscribe [::checks])]
    [:div 
     (for [{:keys [vendor-name paid-to client check date amount memo]} checks
           
           
           :let [amount (gstring/format "--%.2f--" amount)]]
       [:div
        [:div.columns
         (let [{:keys [name address1 city state zip bank]} client]
           (list
            [:div.column.is-4
             [:p name]
             [:p address1]
             [:p city ", " state zip]]
            [:div.column.is-7

             [:p.has-text-centered (:name bank)]
             [:p.has-text-centered (:acct bank)]
             ]))

         [:div.column
          check]
         ]
        [:div.columns
         [:div.column.is-11]
         [:div.column date]
         ]
        [:div.columns
         [:div.column
          "PAY"
          ]
         [:div.column
          "TO THE ORDER OF"]
         [:div.column.is-9
          vendor-name]
         [:div.column
          
          amount]]

        [:div.columns
         [:div.column]
         [:div.column.is-8 {:style {"border-bottom" "1px solid black"}} "One thousand two hundred thirty four and fifty six cents"]
         [:div.column.is-3]]

        [:div.columns
         [:div.column ""]]
        [:div.columns
         [:div.column " "]]
        

        [:div.columns
         [:div.column
          "MEMO"]
         [:div.column.is-7 {:style {"border-bottom" "1px solid black"}}
          memo]
         [:div.column.is-4]]

        [:div.columns
         [:div.column.is-2 ]
         [:div.column.is-10 {:style {"font-family" "MICR" "font-size" "20pt"}}
          (str "c" check "c a" (:acct-number (:bank client)) "a 10302c")]]


        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column]
         [:div.column.is-10
          (let [{:keys [name address1 city state zip bank]} client]
            (list
             [:p name]
             [:p address1]
             [:p city ", " state zip]
             ))
          
          
          
          ]
         [:div.column
          check]]

        [:div.columns
         [:div.column " "]]
        [:div.columns
         [:div.column " "]]
        [:div.columns
         [:div.column " "]]
        [:div.columns
         [:div.column " "]]
        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column]
         [:div.column.is-5
          vendor-name]
         [:div.column
          [:p.has-text-right "Paid to:"]
          [:p.has-text-right "Amount:"]
          [:p.has-text-right "Date:"]]

         [:div.column.is-5
          [:p paid-to]
          [:p amount]
          [:p date]]]

        [:div.columns
         [:div.column "MEMO"]
         [:div.column.is-11
          memo 
          ]]

        [:div.columns
         [:div.column " "]]

        [:div.columns
         [:div.column.is-6] 
         [:div.column
          [:p.has-text-right "Check:"]
          [:p.has-text-right "Vendor:"]
          [:p.has-text-right "Bank Account:"]
          [:p.has-text-right "Paid To:"]
          [:p.has-text-right "Amount:"]
          [:p.has-text-right "Date:"]]

         [:div.column.is-5
          [:p check]
          [:p vendor-name]
          [:p (:name (:bank client))]
          [:p paid-to]
          [:p amount]
          [:p date]]]
        [:div.columns
         [:div.column "MEMO"]
         [:div.column.is-11
          memo]]
        [:footer]])]))