(ns auto-ap.views.pages.new-invoice
  (:require [re-frame.core :as re-frame]
            [auto-ap.subs :as subs]
            [auto-ap.events :as events]))

(defn new-invoice-page []
  (let [form-data (re-frame/subscribe [::subs/new-invoice-form])]
    [:div 
     [:form 
      [:h1.title "New InvoiceR"]
      [:div.field
       [:label.label "Vendor"]
       [:div.control
        [:input.input {:type "text"
                       :auto-focus true
                       :placeholder "CINTAS"
                       :value (:vendor @form-data)
                       :on-change (fn [e]
                                    (re-frame/dispatch [::events/change-form-state
                                                        [:new-invoice :vendor]
                                                        (.. e -target -value)]))}]]]
      [:div.field
       [:label.label "Customer"]
       [:div.control
        [:input.input {:type "text"
                       :placeholder "Brown Chicken Brown Cow"
                       :value (:client @form-data)
                       :on-change (fn [e]
                                    (re-frame/dispatch [::events/change-form-state
                                                        [:new-invoice :client]
                                                        (.. e -target -value)]))}]]]
      [:div.field
       [:label.label "Invoice #"]
       [:div.control
        [:input.input {:type "text"
                       :placeholder "12345"
                       :value (:invoice-number @form-data)
                       :on-change (fn [e]
                                    (re-frame/dispatch [::events/change-form-state
                                                        [:new-invoice :invoice-number]
                                                        (.. e -target -value)]))}]]]
      [:div.field
       [:label.label "Date"]
       [:div.control
        [:input.input {:type "text"
                       :placeholder "11/11/2011"
                       :value (:date @form-data)
                       :on-change (fn [e]
                                    (re-frame/dispatch [::events/change-form-state
                                                        [:new-invoice :date]
                                                        (.. e -target -value)]))}]]]
      [:div.field
       [:label.label "Total"]
       [:div.control
        [:input.input {:type "text"
                       :placeholder "$14.50"
                       :value (:total @form-data)
                       :on-change (fn [e]
                                    (re-frame/dispatch [::events/change-form-state
                                                        [:new-invoice :total]
                                                        (.. e -target -value)]))}]]]
      [:div.control
       [:submit.button.is-large.is-primary {
                                            :disabled (if (and (:total @form-data) (:date @form-data) (:client @form-data) (:invoice-number @form-data)
                                                               (:vendor @form-data))
                                                        ""
                                                        "disabled")
                                            :on-click
                                            (fn [x]
                                              (.preventDefault x)
                                              (re-frame/dispatch [::events/submit-new-invoice @form-data]))}
        [:span
         (when (:loading? @form-data)
           [:i.fa.fa-spin.fa-spinner])
         "Save"]]]]]))