Design income form

1 files changed, 26 insertions, 40 deletions

diff --git a/src/client/elm/LoggedIn/Income/View.elm b/src/client/elm/LoggedIn/Income/View.elm
index 036cd80..d5863ab 100644
--- a/src/client/elm/LoggedIn/Income/View.elm
+++ b/src/client/elm/LoggedIn/Income/View.elm
@@ -5,13 +5,15 @@ module LoggedIn.Income.View exposing
 import Dict
 import Date
 import Time exposing (Time)
+import Color
+
+import FontAwesome
 
-import Html.App as Html
 import Html exposing (..)
 import Html.Events exposing (..)
 import Html.Attributes exposing (..)
+import Html.App as Html
 import Form exposing (Form)
-import Form.Input as Input
 
 import Msg exposing (Msg)
 
@@ -29,10 +31,10 @@ import LoggedIn.Income.Msg as IncomeMsg
 import LoggedIn.View.Date exposing (renderShortDate)
 import LoggedIn.View.Format as Format
 
-import Utils.Maybe exposing (isJust)
-
 import LoggedIn.View.Date exposing (renderLongDate)
 import View.Events exposing (onSubmitPrevDefault)
+import View.Form as Form
+import View.Color as Color
 
 view : LoggedData -> IncomeModel.Model -> Html Msg
 view loggedData incomeModel =
@@ -41,9 +43,8 @@ view loggedData incomeModel =
     [ case useIncomesFrom loggedData.users loggedData.incomes loggedData.payments of
         Just since -> cumulativeIncomesView loggedData since
         Nothing -> text ""
-    , h1 [] [ text <| getMessage "AddIncome" loggedData.translations ]
-    , addIncomeView loggedData incomeModel.addIncome
     , h1 [] [ text <| getMessage "MonthlyNetIncomes" loggedData.translations ]
+    , addIncomeView loggedData incomeModel.addIncome
     , incomesView loggedData
     ]
 
@@ -71,45 +72,31 @@ cumulativeIncomesView loggedData since =
             )
         ]
 
-addIncomeView : LoggedData -> Form () IncomeModel.AddIncome -> Html Msg
+addIncomeView : LoggedData -> Form String IncomeModel.AddIncome -> Html Msg
 addIncomeView loggedData addIncome =
-  let
-    errorFor error field =
-      if isJust field.liveError
-        then div [ class "error" ] [ text (getMessage error loggedData.translations) ]
-        else text ""
-    creation = Form.getFieldAsString "creation" addIncome
-    amount = Form.getFieldAsString "amount" addIncome
-    htmlMap = Html.map (Msg.UpdateLoggedIn << LoggedInMsg.IncomeMsg << IncomeMsg.AddIncomeMsg)
-  in
-    Html.form
-      [ onSubmitPrevDefault Msg.NoOp ]
-      [ label [] [ text (getMessage "Creation" loggedData.translations) ]
-      , htmlMap <| Input.textInput creation []
-      , errorFor "DateValidationError" creation
-
-      , label [] [ text (getMessage "Amount" loggedData.translations) ]
-      , htmlMap <| Input.textInput amount []
-      , errorFor "IncomeValidationError" amount
-
-      , button
-          [ case Form.getOutput addIncome of
-              Just data ->
-                onClick (Msg.UpdateLoggedIn <| LoggedInMsg.AddIncome data.creation data.amount)
-              Nothing ->
-                onClick (Msg.UpdateLoggedIn <| LoggedInMsg.IncomeMsg <| IncomeMsg.AddIncomeMsg <| Form.Submit)
-          ]
-          [ text (getMessage "Add" loggedData.translations) ]
-      ]
+  let htmlMap = Html.map (Msg.UpdateLoggedIn << LoggedInMsg.IncomeMsg << IncomeMsg.AddIncomeMsg)
+  in  Html.form
+        [ onSubmitPrevDefault Msg.NoOp ]
+        [ Form.textInput loggedData.translations addIncome htmlMap "creation"
+        , Form.textInput loggedData.translations addIncome htmlMap "amount"
+        , button
+            [ case Form.getOutput addIncome of
+                Just data ->
+                  onClick (Msg.UpdateLoggedIn <| LoggedInMsg.AddIncome data.time data.amount)
+                Nothing ->
+                  onClick (Msg.UpdateLoggedIn <| LoggedInMsg.IncomeMsg <| IncomeMsg.AddIncomeMsg <| Form.Submit)
+            ]
+            [ text (getMessage "Add" loggedData.translations) ]
+        ]
 
 incomesView : LoggedData -> Html Msg
 incomesView loggedData =
   ul
-    []
+    [ class "incomes" ]
     ( loggedData.incomes
         |> Dict.toList
         |> List.filter ((==) loggedData.me << .userId << snd)
-        |> List.sortBy (.creation << snd)
+        |> List.sortBy (.time << snd)
         |> List.reverse
         |> List.map (incomeView loggedData)
     )
@@ -118,11 +105,10 @@ incomeView : LoggedData -> (IncomeId, Income) -> Html Msg
 incomeView loggedData (incomeId, income) =
   li
     []
-    [ text <| renderShortDate (Date.fromTime income.creation) loggedData.translations
+    [ text <| renderShortDate (Date.fromTime income.time) loggedData.translations
     , text "    −    "
     , text <| Format.price loggedData.conf income.amount
-    , text "    −    "
     , button
         [ onClick (Msg.UpdateLoggedIn <| LoggedInMsg.DeleteIncome incomeId) ]
-        [ text "x" ]
+        [ FontAwesome.remove Color.chestnutRose 14 ]
     ]