Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
Julien Jerphanion
Rex Dri
Commits
a6c0ea70
Commit
a6c0ea70
authored
Sep 12, 2018
by
Florent Chehab
Browse files
Fullscreen merge in an abstract editor class
saving okkkkkk
parent
6726073a
Changes
9
Hide whitespace changes
Inline
Side-by-side
frontend/src/components/university/modules/GenericModule.js
View file @
a6c0ea70
...
...
@@ -6,7 +6,6 @@ import compose from 'recompose/compose';
import
{
connect
}
from
"
react-redux
"
;
import
Paper
from
'
@material-ui/core/Paper
'
;
import
FullScreenDialog
from
'
../../shared/FullScreenDialog
'
;
import
red
from
'
@material-ui/core/colors/red
'
;
import
orange
from
'
@material-ui/core/colors/orange
'
;
import
green
from
'
@material-ui/core/colors/green
'
;
...
...
@@ -84,17 +83,16 @@ class GenericModule extends MyComponent {
this
.
setState
({
fullScreenDialogOpen
:
false
});
};
myRender
()
{
const
{
classes
}
=
this
.
props
;
return
(
<
div
>
<
FullScreenDialog
<
this
.
props
.
editor
open
=
{
this
.
state
.
fullScreenDialogOpen
}
handleClose
=
{
this
.
handleCloseFullScreenDialog
}
handleSave
=
{
this
.
props
.
handleSaveEditor
}
>
{
this
.
props
.
editor
}
<
/FullScreenDialog
>
modelData
=
{
this
.
props
.
modelData
}
/
>
<
Paper
className
=
{
classes
.
root
}
square
=
{
true
}
>
{
renderFirstRow
.
bind
(
this
)()}
...
...
frontend/src/components/university/modules/UniversitySemestersDates.js
View file @
a6c0ea70
...
...
@@ -68,7 +68,7 @@ class UniversitySemestersDates extends MyComponent {
parse
(
rawModelData
)
{
// reverse serialization
const
semestersDates
=
this
.
getFetchedData
(
'
universitiesSemestersDatesEl
'
);
let
{
autumn_begin
,
autumn_end
,
spring_begin
,
spring_end
,
comment
,
useful_links
}
=
semestersDates
;
let
{
autumn_begin
,
autumn_end
,
spring_begin
,
spring_end
,
comment
,
useful_links
,
id
,
university
}
=
semestersDates
;
const
modelData
=
{
autumn_begin
:
convertDateStrToDate
(
autumn_begin
),
...
...
@@ -76,8 +76,9 @@ class UniversitySemestersDates extends MyComponent {
spring_begin
:
convertDateStrToDate
(
spring_begin
),
spring_end
:
convertDateStrToDate
(
spring_end
),
useful_links
,
comment
,
university
,
id
,
comment
}
return
modelData
;
...
...
@@ -97,7 +98,8 @@ class UniversitySemestersDates extends MyComponent {
<
GenericModule
title
=
{
"
Date des semestres
"
}
rawModelData
=
{
semestersDates
}
editor
=
{
<
UniversitySemestersDatesEditor
modelData
=
{
this
.
parse
()}
/>
}
modelData
=
{
this
.
parse
()}
editor
=
{
UniversitySemestersDatesEditor
}
>
<
div
className
=
{
classes
.
root
}
>
<
Table
>
...
...
frontend/src/components/
shared/FullScreenDialog
.js
→
frontend/src/components/
university/modules/editors/Editor
.js
View file @
a6c0ea70
...
...
@@ -11,28 +11,37 @@ import Typography from '@material-ui/core/Typography';
import
CloseIcon
from
'
@material-ui/icons/Close
'
;
import
Slide
from
'
@material-ui/core/Slide
'
;
import
UniversitySemestersDatesEditor
from
'
../university/modules/editors/UniversitySemestersDatesEditor
'
;
import
MyComponent
from
'
../../../MyComponent
'
;
const
styles
=
theme
=>
({
appBar
:
{
position
:
'
relative
'
,
},
flex
:
{
flex
:
1
,
},
paper
:
{
padding
:
2
*
theme
.
spacing
.
unit
,
margin
:
2
*
theme
.
spacing
.
unit
,
}
});
import
dateToDateStr
from
'
../../../../utils/dateToDateStr
'
;
function
Transition
(
props
)
{
return
<
Slide
direction
=
"
up
"
{...
props
}
/>
;
}
class
FullScreenDialog
extends
React
.
Component
{
class
Editor
extends
MyComponent
{
constructor
(
props
)
{
super
(
props
);
this
.
formData
=
{};
this
.
formError
=
{};
}
setFormDataAndError
(
field
,
data
,
type
=
null
)
{
console
.
log
(
data
,
type
)
let
correctData
=
data
.
data
;
if
(
type
==
'
date
'
)
{
correctData
=
dateToDateStr
(
correctData
);
}
this
.
formData
[
field
]
=
correctData
;
this
.
formError
[
field
]
=
data
.
hasError
;
}
renderEditor
()
{
return
(
<
div
>
No
editor
set
<
/div>
)
}
r
ender
()
{
myR
ender
()
{
const
{
classes
}
=
this
.
props
;
return
(
<
div
>
...
...
@@ -50,13 +59,13 @@ class FullScreenDialog extends React.Component {
<
Typography
variant
=
"
title
"
color
=
"
inherit
"
className
=
{
classes
.
flex
}
>
Mode
édition
<
/Typography
>
<
Button
color
=
"
inherit
"
onClick
=
{
this
.
props
.
handleClose
}
>
<
Button
color
=
"
inherit
"
onClick
=
{
()
=>
this
.
handleSaveEditor
()
}
>
Enregistrer
<
/Button
>
<
/Toolbar
>
<
/AppBar
>
<
Paper
className
=
{
classes
.
paper
}
>
{
this
.
props
.
children
}
{
this
.
renderEditor
()
}
<
/Paper
>
<
/Dialog
>
<
/div
>
...
...
@@ -64,13 +73,13 @@ class FullScreenDialog extends React.Component {
}
}
FullScreenDialog
.
propTypes
=
{
Editor
.
propTypes
=
{
classes
:
PropTypes
.
object
.
isRequired
,
};
FullScreenDialog
.
defaultProps
=
{
Editor
.
defaultProps
=
{
open
:
false
,
handleClose
:
()
=>
console
.
log
(
"
Dev forgot something...
"
)
};
export
default
withStyles
(
styles
,
{
withTheme
:
true
})(
FullScreenDialog
)
;
export
default
Editor
;
\ No newline at end of file
frontend/src/components/university/modules/editors/UniversitySemestersDatesEditor.js
View file @
a6c0ea70
...
...
@@ -6,7 +6,8 @@ import { connect } from "react-redux";
import
TextField
from
'
@material-ui/core/TextField
'
;
import
MyComponent
from
'
../../../MyComponent
'
;
import
Editor
from
'
./Editor
'
;
import
editorStyle
from
'
./editorStyle
'
;
import
DateField
from
'
./fields/DateField
'
;
import
UsefulLinksField
from
'
./fields/UsefulLinksField
'
;
import
MarkdownField
from
'
./fields/MarkdownField
'
;
...
...
@@ -15,52 +16,40 @@ import {
universitiesSemestersDatesElSaveData
}
from
'
../../../../generated/actions
'
;
const
styles
=
theme
=>
({
...
editorStyle
(
theme
)
});
class
UniversitySemestersDatesEditor
extends
MyComponent
{
constructor
(
props
)
{
super
(
props
);
this
.
formData
=
{};
this
.
formError
=
{};
const
{
modelData
}
=
this
.
props
;
for
(
let
fieldKey
in
modelData
){
this
.
formData
[
fieldKey
]
=
modelData
[
fieldKey
];
this
.
formError
[
fieldKey
]
=
modelData
[
fieldKey
];
}
class
UniversitySemestersDatesEditor
extends
Editor
{
handleSaveEditor
()
{
const
tmp
=
Object
.
assign
({},
this
.
props
.
modelData
,
this
.
formData
)
console
.
log
(
tmp
);
console
.
log
(
this
.
props
);
this
.
props
.
saveData
(
tmp
);
}
setFormDataAndError
(
field
,
data
)
{
this
.
formData
[
field
]
=
data
.
data
;
this
.
formError
[
field
]
=
data
.
hasError
;
}
handleSendToServer
(
data
)
{
this
.
props
.
saveData
(
formData
);
}
myRender
()
{
const
{
modelData
}
=
this
.
props
;
renderEditor
()
{
const
{
modelData
}
=
this
.
props
;
return
(
<
div
>
<
DateField
label
=
{
"
Date de début du semestre de printemps
"
}
required
=
{
true
}
selectedDate
=
{
modelData
.
spring_begin
}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
spring_begin
'
,
data
)}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
spring_begin
'
,
data
,
'
date
'
)}
/
>
<
DateField
label
=
{
"
Date de fin du semestre de printemps
"
}
selectedDate
=
{
modelData
.
spring_end
}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
spring_end
'
,
data
)}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
spring_end
'
,
data
,
'
date
'
)}
/
>
<
DateField
label
=
{
"
Date de début du semestre d'automne
"
}
selectedDate
=
{
modelData
.
autumn_begin
}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
autumn_begin
'
,
data
)}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
autumn_begin
'
,
data
,
'
date
'
)}
/
>
<
DateField
label
=
{
"
Date de fin du semestre d'automne
"
}
selectedDate
=
{
modelData
.
autumn_end
}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
autumn_end
'
,
data
)}
onChange
=
{(
data
)
=>
this
.
setFormDataAndError
(
'
autumn_end
'
,
data
,
'
date
'
)}
/
>
<
MarkdownField
label
=
{
"
Éventuel commentaire associé à ces informations
"
}
maxLength
=
{
100
}
value
=
{
modelData
.
comment
}
...
...
@@ -85,13 +74,12 @@ UniversitySemestersDatesEditor.propTypes = {
const
mapDispatchToProps
=
(
dispatch
)
=>
{
return
{
saveData
:
(
data
)
=>
universitiesSemestersDatesElSaveData
(
data
)
saveData
:
(
data
)
=>
dispatch
(
universitiesSemestersDatesElSaveData
(
data
)
)
};
};
export
default
compose
(
//
withStyles(styles, { withTheme: true }),
withStyles
(
styles
,
{
withTheme
:
true
}),
connect
(
null
,
mapDispatchToProps
)
)(
UniversitySemestersDatesEditor
);
\ No newline at end of file
frontend/src/components/university/modules/editors/editorStyle.js
0 → 100644
View file @
a6c0ea70
export
default
function
editorStyle
(
theme
)
{
return
{
appBar
:
{
position
:
'
relative
'
,
},
flex
:
{
flex
:
1
,
},
paper
:
{
padding
:
2
*
theme
.
spacing
.
unit
,
margin
:
2
*
theme
.
spacing
.
unit
,
}
}
};
frontend/src/components/university/modules/editors/fields/DateField.js
View file @
a6c0ea70
...
...
@@ -33,6 +33,12 @@ class DateField extends PureComponent {
hasError
:
this
.
hasError
(
this
.
props
.
selectedDate
)
}
componentDidMount
(){
// store the data in formData
this
.
handleDateChange
(
this
.
props
.
selectedDate
);
}
handleDateChange
=
(
date
)
=>
{
const
newState
=
{
selectedDate
:
date
,
...
...
frontend/src/components/university/modules/editors/fields/MarkdownField.js
View file @
a6c0ea70
...
...
@@ -22,6 +22,11 @@ class MarkdownField extends React.Component {
hasError
:
this
.
hasError
(
this
.
props
.
value
)
};
componentDidMount
()
{
// store the data in formData
this
.
handleChangeValue
(
this
.
props
.
value
);
}
hasError
(
value
)
{
if
(
this
.
props
.
required
&&
value
==
''
)
{
return
true
;
...
...
@@ -39,10 +44,14 @@ class MarkdownField extends React.Component {
if
(
maxLength
&&
value
.
length
>
maxLength
+
1
)
{
value
=
value
.
substring
(
0
,
maxLength
+
1
);
}
this
.
setState
({
const
newState
=
{
value
,
hasError
:
this
.
hasError
(
value
)
}
this
.
setState
(
newState
);
this
.
props
.
onChange
({
data
:
newState
.
value
,
hasError
:
newState
.
hasError
});
}
...
...
frontend/src/components/university/modules/editors/fields/UsefulLinksField.js
View file @
a6c0ea70
...
...
@@ -33,6 +33,11 @@ class UsefulLinksField extends React.Component {
errorMessage
:
''
,
}
componentDidMount
()
{
// store the data in formData
this
.
updateUsefulLinks
(
this
.
props
.
usefulLinks
);
}
hasError
(
usefulLinks
)
{
if
(
this
.
props
.
required
&&
usefulLinks
.
length
==
0
)
{
return
true
;
...
...
@@ -42,7 +47,16 @@ class UsefulLinksField extends React.Component {
}
updateUsefulLinks
(
newUsefullLinks
)
{
this
.
setState
({
usefulLinks
:
newUsefullLinks
});
const
newState
=
{
usefulLinks
:
newUsefullLinks
,
hasError
:
this
.
hasError
(
newUsefullLinks
)
}
this
.
setState
(
newState
);
this
.
props
.
onChange
({
data
:
newState
.
usefulLinks
,
hasError
:
newState
.
hasError
});
}
handleUsefulLinkUrlChange
=
(
idx
,
evt
)
=>
{
...
...
frontend/src/utils/dateToDateStr.js
0 → 100644
View file @
a6c0ea70
export
default
function
dateToDateStr
(
date
)
{
if
(
!
date
)
{
return
null
;
}
let
yyyy
=
date
.
getFullYear
(),
mm
=
date
.
getMonth
()
+
1
,
dd
=
date
.
getDate
();
mm
=
mm
<
10
?
'
0
'
+
mm
:
mm
;
dd
=
dd
<
10
?
'
0
'
+
dd
:
dd
;
return
yyyy
+
'
-
'
+
mm
+
'
-
'
+
dd
;
}
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment