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
|
module LoggedIn.Category.Table exposing
( view
)
import Dict exposing (..)
import Date exposing (Date)
import String exposing (append)
import FontAwesome
import View.Color as Color
import Html exposing (..)
import Html.Attributes exposing (..)
import Html.Events exposing (..)
import Dialog
import Dialog.AddCategory.Model as AddCategory
import Dialog.AddCategory.View as AddCategory
import Tooltip
import Msg exposing (Msg)
import LoggedData exposing (LoggedData)
import LoggedIn.Msg as LoggedInMsg
import View.Date as Date
import LoggedIn.View.Format as Format
import Model.User exposing (getUserName)
import Model.Category as Category exposing (CategoryId, Category)
import Model.PaymentCategory as PaymentCategory
import Model.Translations exposing (getMessage)
view : LoggedData -> Html Msg
view loggedData =
let categories =
loggedData.categories
|> Dict.toList
|> List.sortBy (.name << Tuple.second)
in div
[ class "table" ]
[ div
[ class "lines" ]
( headerLine loggedData :: List.map (paymentLine loggedData) categories)
, if List.isEmpty (Dict.toList loggedData.categories)
then
div
[ class "emptyTableMsg" ]
[ text <| getMessage loggedData.translations "NoCategories" ]
else
text ""
]
headerLine : LoggedData -> Html Msg
headerLine loggedData =
div
[ class "header" ]
[ div [ class "cell name" ] [ text <| getMessage loggedData.translations "Name" ]
, div [ class "cell category" ] [ text <| getMessage loggedData.translations "Color" ]
, div [ class "cell" ] []
, div [ class "cell" ] []
, div [ class "cell" ] []
]
paymentLine : LoggedData -> (CategoryId, Category) -> Html Msg
paymentLine loggedData (categoryId, category) =
div
[ class "row" ]
[ div
[ class "cell category" ]
[ text category.name ]
, div
[ class "cell category" ]
[ span
[ class "tag"
, style [("background-color", category.color)]
]
[ text category.color ]
]
, div
[ class "cell button" ]
[ let currentDate = Date.fromTime loggedData.currentTime
in AddCategory.button
loggedData
(AddCategory.initialClone loggedData.translations category)
"CloneCategory"
(FontAwesome.clone Color.chestnutRose 18)
(Just (getMessage loggedData.translations "Clone"))
]
, div
[ class "cell button" ]
[ AddCategory.button
loggedData
(AddCategory.initialEdit loggedData.translations categoryId category)
"EditCategory"
(FontAwesome.pencil Color.chestnutRose 18)
(Just (getMessage loggedData.translations "Edit"))
]
, div
[ class "cell button" ]
[ if PaymentCategory.isCategoryUnused categoryId loggedData.paymentCategories
then
let dialogConfig =
{ className = "deleteCategoryDialog"
, title = getMessage loggedData.translations "ConfirmCategoryDelete"
, body = always <| text ""
, confirm = getMessage loggedData.translations "Confirm"
, confirmMsg = always <| Msg.Dialog <| Dialog.UpdateAndClose <| Msg.DeleteCategory categoryId
, undo = getMessage loggedData.translations "Undo"
}
in button
( Tooltip.show Msg.Tooltip (getMessage loggedData.translations "Delete")
++ [ onClick (Msg.Dialog <| Dialog.Open dialogConfig) ]
)
[ FontAwesome.trash Color.chestnutRose 18 ]
else
span
( Tooltip.show Msg.Tooltip (getMessage loggedData.translations "UsedCategory") )
[ FontAwesome.trash Color.silver 18 ]
]
]
|
