1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
|
module Checkout exposing (..)
import Browser
import Browser.Navigation as Nav
import Html
import Html.Styled exposing (..)
import Html.Styled.Attributes exposing (..)
import Html.Styled.Events exposing (..)
import Http
import Json.Decode as D
import Json.Encode as Encode
import Tuple exposing (..)
import Url
import Url.Parser as P exposing ((</>), Parser, int, oneOf, s, string)
import Utils exposing (..)
type alias Model =
{ pageStatus : Status
, paymentMode : String
, cartTotal : Float
}
type Status
= Loading
| Loaded
| NotLoaded
type Msg
= CheckoutPressed
| CheckoutSuccessful (Result Http.Error ())
| AmountLoaded (Result Http.Error Float)
| FetchAmount
| PaymentModeSelected String
init : Model
init =
Model NotLoaded "Cash" 0
update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
case msg of
CheckoutPressed ->
( model, tryCheckout model.paymentMode )
CheckoutSuccessful _ ->
( model, Cmd.none )
AmountLoaded res ->
case res of
Ok v ->
( { model | cartTotal = v }, Cmd.none )
Err _ ->
( { model | pageStatus = NotLoaded }, Cmd.none )
FetchAmount ->
let
_ =
Debug.log "err" "fetching checkout amount"
in
( { model | pageStatus = Loading }, fetchAmount )
PaymentModeSelected s ->
( { model | paymentMode = s }, Cmd.none )
fetchAmount : Cmd Msg
fetchAmount =
Http.riskyRequest
{ method = "GET"
, headers = []
, url = "http://127.0.0.1:7878/cart/total"
, body = Http.emptyBody
, expect = Http.expectJson AmountLoaded D.float
, timeout = Nothing
, tracker = Nothing
}
tryCheckout : String -> Cmd Msg
tryCheckout pm =
Http.riskyRequest
{ method = "POST"
, headers = []
, url = "http://127.0.0.1:7878/transaction/checkout"
, body = Http.stringBody "application/json" pm
, expect = Http.expectWhatever CheckoutSuccessful
, timeout = Nothing
, tracker = Nothing
}
viewStatus : Status -> String
viewStatus s =
case s of
Loading ->
"Loading"
Loaded ->
"Ready!"
NotLoaded ->
"Not loaded ..."
view : Model -> Html Msg
view model =
case model.pageStatus of
Loading ->
div [] [ text <| viewStatus Loading ]
_ ->
div []
[ div [] [ text <| String.fromFloat <| model.cartTotal ]
, select []
[ option [ onInput PaymentModeSelected ] [ text "Cash" ]
, option [ onInput PaymentModeSelected ] [ text "Debit Card" ]
, option [ onInput PaymentModeSelected ] [ text "Credit Card" ]
]
, div [] [ a [ href "/cart" ] [ text "Cancel" ] ]
, div [] [ button [ onClick CheckoutPressed ] [ text "Confirm and Pay" ] ]
]
|