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