From f5e64310fe3f4a174f8f966edc1f9cc09af4639e Mon Sep 17 00:00:00 2001 From: Guillermo Ramos Date: Sat, 15 Mar 2025 18:01:58 +0100 Subject: Format update overview --- front/src/Main.elm | 154 ++++++++++++++++++++++++++++++++++------------------- 1 file changed, 98 insertions(+), 56 deletions(-) diff --git a/front/src/Main.elm b/front/src/Main.elm index 57a6f11..fef4863 100644 --- a/front/src/Main.elm +++ b/front/src/Main.elm @@ -12,6 +12,7 @@ import Html , div , hr , input + , li , p , pre , span @@ -22,6 +23,7 @@ import Html , th , thead , tr + , ul ) import Html.Attributes exposing @@ -98,6 +100,15 @@ make_t lang str = "Total to pay: " -> "Total a pagar: " + "Total after early payments: " -> + "Total tras amortizaciones anticipadas: " + + "Payed early: " -> + "Anticipado: " + + "Saved: " -> + "Ahorro: " + "Initial payment: " -> "Pago inicial: " @@ -119,6 +130,9 @@ make_t lang str = "Pending" -> "Pendiente" + "Updates" -> + "Actualizaciones" + _ -> str @@ -186,7 +200,7 @@ capitalSumView { t, settings } { principal, interest } = , ")" ] in - span [ class "underline", title partsTitle ] [ amountView settings.currency (principal + interest) ] + amountView (titledAttrs partsTitle) settings.currency (principal + interest) type alias MortgageSim = @@ -915,29 +929,29 @@ amountToString currency amount = amountStr -amountView : Currency -> Float -> Html Msg -amountView currency amount = +amountView : List (Attribute Msg) -> Currency -> Float -> Html Msg +amountView attrs currency amount = let amountStr = Round.round 2 amount in - case String.split "." amountStr of - int :: float :: [] -> - let - floatPart = - case float of - "00" -> - [] - - _ -> - [ text <| String.fromChar (currencySep currency).decimal - , span [ class "text-sm" ] [ text float ] - ] - - els = - [ text (insertThousandsSep currency int) ] ++ floatPart - in - span [] <| + span attrs <| + case String.split "." amountStr of + int :: float :: [] -> + let + floatPart = + case float of + "00" -> + [] + + _ -> + [ text <| String.fromChar (currencySep currency).decimal + , span [ class "text-sm" ] [ text float ] + ] + + els = + [ text (insertThousandsSep currency int) ] ++ floatPart + in case currencyOrder currency of Prefix -> [ text (currencySymbol currency) ] ++ els @@ -945,8 +959,13 @@ amountView currency amount = Postfix -> els ++ [ text (currencySymbol currency) ] - _ -> - text amountStr + _ -> + [ text amountStr ] + + +titledAttrs : String -> List (Attribute Msg) +titledAttrs title_ = + [ class "underline", title title_ ] specsView : Model -> Html Msg @@ -1050,7 +1069,7 @@ simUpdateView : List (Attribute Msg) -> Model -> SimUpdate -> Html Msg simUpdateView attrs m upd = case upd of Amortize f -> - p attrs [ text "+", amountView m.settings.currency f ] + p attrs [ text "+", amountView [] m.settings.currency f ] SetI1 f -> p attrs [ text <| String.fromFloat f, text "%" ] @@ -1100,7 +1119,7 @@ quotaView m { updates } { month, payed, pending_principal } = [ yearField , text (String.fromInt month) , capitalSumView m payed - , amountView m.settings.currency pending_principal + , amountView [] m.settings.currency pending_principal , updatesField ] ) @@ -1159,45 +1178,68 @@ simView m ( rawSpecs, sim ) = fee = total * parseFloat rawSpecs.fee / 100 - overview financed = - div [] - [ pre [] - [ text <| t "Financed (mortgage): " - , capitalSumView m financed + overview title financed extraLis = + div [ class "my-2 p-1 border-2 rounded-md border-gray-400" ] + [ p [ class "text-lg" ] + [ text title + , amountView [ class "font-bold" ] + currency + (financed.principal + + financed.interest + + initial + + vat + + fee + ) ] - , pre [] - [ text <| t "Total to pay: " - , span [ class "font-bold" ] - [ amountView currency - (financed.principal - + financed.interest - + initial - + vat - + fee - ) + , ul [ class "list-inside list-disc" ] + ([ li [] + [ text <| t "Initial payment: " + , amountView [] currency (initial + vat + fee) ] - ] + , li [] + [ text <| t "Financed (mortgage): " + , capitalSumView m financed + ] + ] + ++ extraLis + ) ] in div [] [ hr [ class "my-5" ] [] - , pre [ class "leading-none" ] + , p [] [ text <| t "Initial payment: " - , amountView currency (initial + vat + fee) - , text "\n├ " - , text <| t "Property: " - , amountView currency initial - , text "\n├ " - , text <| t "Agent fee: " - , amountView currency fee - , text "\n└ " - , text <| t "VAT: " - , amountView currency vat + , amountView [ class "font-bold" ] currency (initial + vat + fee) ] - , p [ class "text-lg font-bold" ] [ text "-- without early payments --" ] - , overview sim.topay - , p [ class "text-lg font-bold" ] [ text "-- with early payments --" ] - , overview sim.payed + , ul [ class "list-inside list-disc" ] + [ li [] + [ text <| t "Property: " + , amountView [] currency initial + ] + , li [] + [ text <| t "Agent fee: " + , amountView [] currency fee + ] + , li [] + [ text <| t "VAT: " + , amountView [] currency vat + ] + ] + , overview (t "Total to pay: ") sim.topay [] + , if capitalSumView m sim.topay /= capitalSumView m sim.payed then + overview (t "Total after early payments: ") sim.payed <| + [ li [] + [ text <| t "Payed early: " + , amountView [] currency sim.payed_amortized + ] + , li [] + [ text <| t "Saved: " + , amountView [] currency (sim.topay.interest - sim.payed.interest) + ] + ] + + else + text "" , mortgageView m sim ] @@ -1206,7 +1248,7 @@ view : Model -> Document Msg view m = { title = "Hiccup" , body = - [ div [ class "flex flex-col max-w-lg mx-auto items-center mt-2 p-3 border-2 rounded-md border-gray-500 bg-gray-100" ] + [ div [ class "flex flex-col max-w-xl mx-auto items-center mt-2 p-3 border-2 rounded-md border-gray-500 bg-gray-100" ] [ div [ class "min-w-full" ] [ specsView m , case m.simulation of -- cgit v1.2.3