module LoggedIn.Income.View exposing ( view ) import Dict import Date import Time exposing (Time) import Color import Task import FontAwesome import Html exposing (..) import Html.Events exposing (..) import Html.Attributes exposing (..) import Html.App as Html import Form exposing (Form) import Dialog import Msg exposing (Msg) import LoggedData exposing (LoggedData) import Model.Income exposing (IncomeId, Income, userCumulativeIncomeSince) import Model.Translations exposing (getMessage, getParamMessage) import Model.Payer exposing (useIncomesFrom) import Model.User exposing (UserId, User) import Model.View as View import LoggedIn.Income.Model as IncomeModel import LoggedIn.Msg as LoggedInMsg import LoggedIn.Income.Msg as IncomeMsg import LoggedIn.View.Date exposing (renderShortDate) import LoggedIn.View.Format as Format 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 = div [ class "income" ] [ case useIncomesFrom loggedData.users loggedData.incomes loggedData.payments of Just since -> cumulativeIncomesView loggedData since Nothing -> text "" , h1 [] [ text <| getMessage "MonthlyNetIncomes" loggedData.translations ] , addIncomeView loggedData incomeModel.addIncome , incomesView loggedData ] cumulativeIncomesView : LoggedData -> Time -> Html Msg cumulativeIncomesView loggedData since = let longDate = renderLongDate (Date.fromTime since) loggedData.translations in div [] [ h1 [] [ text <| getParamMessage [longDate] "CumulativeIncomesSince" loggedData.translations ] , ul [] ( Dict.toList loggedData.users |> List.map (\(userId, user) -> (user.name, userCumulativeIncomeSince loggedData.currentTime since loggedData.incomes userId) ) |> List.sortBy snd |> List.map (\(userName, cumulativeIncome) -> li [] [ text userName , text " − " , text <| Format.price loggedData.conf cumulativeIncome ] ) ) ] addIncomeView : LoggedData -> Form String IncomeModel.AddIncome -> Html Msg addIncomeView loggedData addIncome = let htmlMap = Html.map (Msg.UpdateLoggedIn << LoggedInMsg.IncomeMsg << IncomeMsg.AddIncomeMsg) in Html.form [ onSubmitPrevDefault Msg.NoOp ] [ Form.textInput loggedData.translations addIncome htmlMap "income" "creation" , Form.textInput loggedData.translations addIncome htmlMap "income" "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 (.time << snd) |> List.reverse |> List.map (incomeView loggedData) ) incomeView : LoggedData -> (IncomeId, Income) -> Html Msg incomeView loggedData (incomeId, income) = li [] [ text <| renderShortDate (Date.fromTime income.time) loggedData.translations , text " − " , text <| Format.price loggedData.conf income.amount , let dialogConfig = { className = "incomeDialog" , title = getMessage "ConfirmDelete" loggedData.translations , body = always <| text "" , confirm = getMessage "Confirm" loggedData.translations , confirmMsg = always <| Ok <| Msg.UpdateLoggedIn <| LoggedInMsg.DeleteIncome incomeId , undo = getMessage "Undo" loggedData.translations } in button [ onClick (Msg.Dialog <| Dialog.Open dialogConfig) ] [ FontAwesome.remove Color.chestnutRose 14 ] ]