Commit 36a472e4 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski

[bootstrap v4] ngrams table work

parent 9b3764b0
...@@ -149,87 +149,85 @@ tableContainerCpt { dispatch ...@@ -149,87 +149,85 @@ tableContainerCpt { dispatch
} = R.hooksComponentWithModule thisModule "tableContainer" cpt } = R.hooksComponentWithModule thisModule "tableContainer" cpt
where where
cpt props _ = do cpt props _ = do
pure $ H.div {className: "container-fluid"} pure $ H.div {className: "container-fluid"} [
[ H.div {className: "jumbotron1"} R2.row
[ R2.row [ H.div {className: "card col-12"}
[ H.div {className: "panel panel-default"} [ H.div {className: "card-header"}
[ H.div {className: "panel-heading"} [
[ R2.row [ H.div {className: "col-md-2", style: {marginTop: "6px"}}
R2.row [ H.div {className: "col-md-2", style: {marginTop: "6px"}} [ H.div {} syncResetButton
[ H.div {} syncResetButton , if A.null props.tableBody && searchQuery /= "" then
, if A.null props.tableBody && searchQuery /= "" then H.li { className: "list-group-item" } [
H.li { className: "list-group-item" } [ H.button { className: "btn btn-primary"
H.button { className: "btn btn-primary" , on: { click: const $ dispatch
, on: { click: const $ dispatch $ CoreAction
$ CoreAction $ addNewNgramA
$ addNewNgramA (normNgram tabNgramType searchQuery)
(normNgram tabNgramType searchQuery) CandidateTerm
CandidateTerm }
} }
} [ H.text ("Add " <> searchQuery) ]
[ H.text ("Add " <> searchQuery) ] ] else H.div {} []
] else H.div {} [] ]
] , H.div {className: "col-md-2", style: {marginTop : "6px"}}
, H.div {className: "col-md-2", style: {marginTop : "6px"}} [ H.li {className: "list-group-item"}
[ H.li {className: "list-group-item"} [ R2.select { id: "picklistmenu"
[ R2.select { id: "picklistmenu" , className: "form-control custom-select"
, className: "form-control custom-select" , defaultValue: (maybe "" show termListFilter)
, defaultValue: (maybe "" show termListFilter) , on: {change: setTermListFilter <<< read <<< R.unsafeEventValue}}
, on: {change: setTermListFilter <<< read <<< R.unsafeEventValue}} (map optps1 termLists)]
(map optps1 termLists)] ]
] , H.div {className: "col-md-2", style: {marginTop : "6px"}}
, H.div {className: "col-md-2", style: {marginTop : "6px"}} [ H.li {className: "list-group-item"}
[ H.li {className: "list-group-item"} [ R2.select {id: "picktermtype"
[ R2.select {id: "picktermtype" , className: "form-control custom-select"
, className: "form-control custom-select" , defaultValue: (maybe "" show termSizeFilter)
, defaultValue: (maybe "" show termSizeFilter) , on: {change: setTermSizeFilter <<< read <<< R.unsafeEventValue}}
, on: {change: setTermSizeFilter <<< read <<< R.unsafeEventValue}} (map optps1 termSizes)]
(map optps1 termSizes)] ]
] , H.div { className: "col-md-2", style: { marginTop: "6px" } }
, H.div { className: "col-md-2", style: { marginTop: "6px" } } [ H.li {className: "list-group-item"}
[ H.li {className: "list-group-item"} [ H.div { className: "form-inline" }
[ H.div { className: "form-inline" } [ H.div { className: "form-group" }
[ H.div { className: "form-group" } [ props.pageSizeControl
[ props.pageSizeControl , H.label {} [ H.text " items" ]
, H.label {} [ H.text " items" ] -- H.div { className: "col-md-6" } [ props.pageSizeControl ]
-- H.div { className: "col-md-6" } [ props.pageSizeControl ] -- , H.div { className: "col-md-6" } [
-- , H.div { className: "col-md-6" } [ -- ]
-- ]
]
]
]
]
, H.div {className: "col-md-4", style: {marginTop : "6px", marginBottom : "1px"}}
[ H.li {className: "list-group-item"}
[ props.pageSizeDescription
, props.paginationLinks
]
]
]
]
, editor
, if (selectionsExist ngramsSelection)
then H.li {className: "list-group-item"}
[selectButtons true]
else H.div {} []
, H.div {id: "terms_table", className: "panel-body"}
[ H.table {className: "table able"}
[ H.thead {className: "tableHeader"} [props.tableHead]
, H.tbody {} props.tableBody
]
, H.li {className: "list-group-item"}
[ H.div { className: "row" }
[ H.div { className: "col-md-4" }
[selectButtons (selectionsExist ngramsSelection)]
, H.div {className: "col-md-4 col-md-offset-4"}
[props.paginationLinks]
]
]
]
]
] ]
] ]
] ]
]
, H.div {className: "col-md-4", style: {marginTop : "6px", marginBottom : "1px"}}
[ H.li {className: "list-group-item"}
[ props.pageSizeDescription
, props.paginationLinks
]
]
]
]
, editor
, if (selectionsExist ngramsSelection)
then H.li {className: "list-group-item"}
[selectButtons true]
else H.div {} []
, H.div {id: "terms_table", className: "panel-body"}
[ H.table {className: "table able"}
[ H.thead {className: ""} [props.tableHead]
, H.tbody {} props.tableBody
]
, H.li {className: "list-group-item"}
[ H.div { className: "row" }
[ H.div { className: "col-md-4" }
[selectButtons (selectionsExist ngramsSelection)]
, H.div {className: "col-md-4 col-md-offset-4"}
[props.paginationLinks]
]
]
]
]
]
]
-- WHY setPath f = origSetPageParams (const $ f path) -- WHY setPath f = origSetPageParams (const $ f path)
setTermListFilter x = setPath $ _ { termListFilter = x } setTermListFilter x = setPath $ _ { termListFilter = x }
setTermSizeFilter x = setPath $ _ { termSizeFilter = x } setTermSizeFilter x = setPath $ _ { termSizeFilter = x }
......
...@@ -38,17 +38,21 @@ searchInputCpt :: R.Component SearchInputProps ...@@ -38,17 +38,21 @@ searchInputCpt :: R.Component SearchInputProps
searchInputCpt = R.hooksComponentWithModule thisModule "searchInput" cpt searchInputCpt = R.hooksComponentWithModule thisModule "searchInput" cpt
where where
cpt { onSearch, searchQuery } _ = cpt { onSearch, searchQuery } _ =
pure $ H.div { className: "input-group" } pure $ R2.row [
[ searchButton H.div { className: "col-12" } [
, fieldInput H.div { className: "input-group" } [
] searchButton
, fieldInput
]
]
]
where where
searchButton = searchButton =
H.div { className: "input-group-addon" } H.div { className: "input-group-prepend" }
[ [
if searchQuery /= "" if searchQuery /= ""
then removeButton then removeButton
else H.span { className: "fa fa-search" } [] else H.span { className: "fa fa-search input-group-text" } []
] ]
removeButton = removeButton =
H.button { className: "btn btn-danger" H.button { className: "btn btn-danger"
......
...@@ -155,7 +155,7 @@ ngramsViewCpt = R.hooksComponentWithModule thisModule "ngramsView" cpt ...@@ -155,7 +155,7 @@ ngramsViewCpt = R.hooksComponentWithModule thisModule "ngramsView" cpt
charts params CTabTerms (chartType /\ setChartType) _ = [ charts params CTabTerms (chartType /\ setChartType) _ = [
H.div {className: "row"} H.div {className: "row"}
[ H.div {className: "col-md-offset-5 col-md-6 content"} [ H.div {className: "col-6 ml-auto mr-auto"}
[ H.img { src: "images/Gargantextuel-212x300.jpg" [ H.img { src: "images/Gargantextuel-212x300.jpg"
, id: "funnyimg" , id: "funnyimg"
} }
......
...@@ -168,9 +168,11 @@ defaultContainer {title} props = R.fragment $ props.syncResetButton <> controls ...@@ -168,9 +168,11 @@ defaultContainer {title} props = R.fragment $ props.syncResetButton <> controls
, H.div {className: "col-md-4"} [ props.paginationLinks ] , H.div {className: "col-md-4"} [ props.paginationLinks ]
, H.div {className: "col-md-4"} [ props.pageSizeControl ] , H.div {className: "col-md-4"} [ props.pageSizeControl ]
] ]
, H.table {className: "table"} , R2.row [
[ H.thead {className: "thead-dark"} [ props.tableHead ] H.table {className: "col-md-12 table"}
, H.tbody {} props.tableBody [ H.thead {className: "thead-dark"} [ props.tableHead ]
, H.tbody {} props.tableBody
]
] ]
] ]
......
...@@ -203,7 +203,7 @@ appendChildToParentId ps c = delay unit $ \_ -> do ...@@ -203,7 +203,7 @@ appendChildToParentId ps c = delay unit $ \_ -> do
Just el -> appendChild el c Just el -> appendChild el c
effectLink :: Effect Unit -> String -> R.Element effectLink :: Effect Unit -> String -> R.Element
effectLink eff msg = H.a {on: {click: const eff}} [H.text msg] effectLink eff msg = H.a { on: {click: const eff} } [H.text msg]
useCache :: forall i o. Eq i => i -> (i -> R.Hooks o) -> R.Hooks o useCache :: forall i o. Eq i => i -> (i -> R.Hooks o) -> R.Hooks o
useCache i f = do useCache i f = do
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment