Skip to content

Commit b1ed05a

Browse files
maxceemmaxceem
authored
Merge pull request #4223 from yoution/feature/generic-phases-with-new-milestone-types
fix: fixed generic phase issue
2 parents 2ce9df1 + 3794d45 commit b1ed05a

File tree

6 files changed

+104
-352
lines changed

6 files changed

+104
-352
lines changed

‎src/projects/detail/components/CreatePhaseForm/CreatePhaseForm.jsx‎

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import PT from 'prop-types'
66
import moment from 'moment'
77
import FormsyForm from 'appirio-tech-react-components/components/Formsy'
88
import FormsySelect from '../../../../components/Select/FormsySelect'
9-
import { MILESTONE_TYPE, MILESTONE_TYPE_OPTIONS } from '../../../../config/constants'
9+
import { MILESTONE_TYPE, MILESTONE_TYPE_OPTIONS, MILESTONE_STATUS } from '../../../../config/constants'
1010
import GenericMenu from '../../../../components/GenericMenu'
1111
import TrashIcon from '../../../../assets/icons/icon-trash.svg'
1212
import styles from './CreatePhaseForm.scss'
@@ -122,6 +122,7 @@ class CreatePhaseForm extends React.Component {
122122
})
123123

124124
if (publishClicked) {
125+
milestones[0].status= MILESTONE_STATUS.ACTIVE
125126
onSubmit('active', phaseData, milestones)
126127
} else {
127128
onSubmit('draft', phaseData, milestones)
@@ -139,23 +140,25 @@ class CreatePhaseForm extends React.Component {
139140
milestones
140141
} = this.state
141142

143+
144+
const newMilestones = _.cloneDeep(milestones)
142145

143146
// omit phase fields
144147
_.forEach(_.keys(_.omit(change, ['title', 'startDate', 'endDate'])), (k) => {
145148
const arrs = k.match(/(\w+)_(\d+)/)
146149
const arrIndex = arrs[2]
147150
const objKey = arrs[1]
148-
if(change[k] && change[k] !== milestones[arrIndex][objKey]) {
151+
if(change[k] !== milestones[arrIndex][objKey]) {
149152
// set default title with option type
150-
if (objKey === 'type' && !milestones[arrIndex]['type']) {
151-
milestones[arrIndex]['title'] = this.getOptionType(change[k])
153+
if (objKey === 'type' && change[k] && !milestones[arrIndex]['title']) {
154+
newMilestones[arrIndex]['title'] = this.getOptionType(change[k])
152155
}
153-
milestones[arrIndex][objKey] = change[k]
156+
newMilestones[arrIndex][objKey] = change[k]
154157
}
155158
})
156159

157160

158-
this.setState({milestones})
161+
this.setState({milestones: newMilestones})
159162
}
160163

161164
getOptionType(val) {

‎src/projects/detail/components/CreatePhaseForm/CreatePhaseForm.scss‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -184,9 +184,6 @@
184184
float: initial;
185185
}
186186
}
187-
div {
188-
padding: 0!important;
189-
}
190187
input {
191188
width: 100%!important;
192189
display: block;

‎src/projects/detail/components/timeline/CreateMilestoneForm/CreateMilestoneForm.jsx‎

Lines changed: 46 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import React from 'react'
55
import PT from 'prop-types'
66
import moment from 'moment'
77

8-
import { MILESTONE_TYPE, MILESTONE_TYPE_OPTIONS } from '../../../../../config/constants'
8+
import { MILESTONE_TYPE_OPTIONS } from '../../../../../config/constants'
99
import LoadingIndicator from '../../../../../components/LoadingIndicator/LoadingIndicator'
1010
import Form from '../Form'
1111
import './CreateMilestoneForm.scss'
@@ -14,22 +14,29 @@ class CreateMilestoneForm extends React.Component {
1414
constructor(props) {
1515
super(props)
1616

17+
const {previousMilestone} = props
1718
this.state = {
1819
isEditing: false,
19-
type: MILESTONE_TYPE.REPORTING,
20-
title: 'Reporting',
21-
startDate: moment.utc().format('YYYY-MM-DD'),
22-
endDate: moment.utc().add(3, 'days').format('YYYY-MM-DD')
20+
type: '',
21+
title: '',
22+
startDate: moment.utc(previousMilestone.endDate).format('YYYY-MM-DD'),
23+
endDate: moment.utc(previousMilestone.endDate).add(3, 'days').format('YYYY-MM-DD')
2324
}
2425

2526
this.submitForm = this.submitForm.bind(this)
2627
this.cancelEdit = this.cancelEdit.bind(this)
2728
this.onAddClick = this.onAddClick.bind(this)
29+
this.changeForm = this.changeForm.bind(this)
2830
}
2931

3032
cancelEdit() {
33+
const {previousMilestone} = this.props
3134
this.setState({
32-
isEditing: false
35+
isEditing: false,
36+
type: '',
37+
title: '',
38+
startDate: moment.utc(previousMilestone.endDate).format('YYYY-MM-DD'),
39+
endDate: moment.utc(previousMilestone.endDate).add(3, 'days').format('YYYY-MM-DD')
3340
})
3441
}
3542

@@ -56,6 +63,35 @@ class CreateMilestoneForm extends React.Component {
5663
values.blockedText = 'blocked text'
5764
onSubmit(values)
5865
}
66+
changeForm(values) {
67+
const { type, title, startDate, endDate } = this.state
68+
if (values['name'] !== title) {
69+
this.setState({
70+
title: values['name']
71+
})
72+
}
73+
if (values['startDate'] !== startDate) {
74+
this.setState({
75+
startDate: values['startDate']
76+
})
77+
}
78+
if (values['endDate'] !== endDate) {
79+
this.setState({
80+
endDate: values['endDate']
81+
})
82+
}
83+
// set title when select type and title is empty
84+
if (values['type'] !== type) {
85+
this.setState({
86+
type: values['type']
87+
})
88+
if (!title) {
89+
this.setState({
90+
title: values['type']
91+
})
92+
}
93+
}
94+
}
5995

6096
render() {
6197
const { isAdding, isEditing, type, title, startDate, endDate } = this.state
@@ -76,7 +112,7 @@ class CreateMilestoneForm extends React.Component {
76112
fields={[
77113
{
78114
label: 'Type',
79-
placeholder: 'Type',
115+
placeholder:'Select Type',
80116
options: MILESTONE_TYPE_OPTIONS,
81117
name: 'type',
82118
value: type,
@@ -88,12 +124,7 @@ class CreateMilestoneForm extends React.Component {
88124
name: 'name',
89125
value: title,
90126
type: 'text',
91-
validations: {
92-
isRequired: true
93-
},
94-
validationError: 'Name is required',
95127
},
96-
97128
{
98129
label: 'Start Date',
99130
placeholder: 'start date',
@@ -119,7 +150,9 @@ class CreateMilestoneForm extends React.Component {
119150
]}
120151
onCancelClick={this.cancelEdit}
121152
onSubmit={this.submitForm}
153+
onChange={this.changeForm}
122154
submitButtonTitle="Create Milestone"
155+
disableSubmitButton={!type}
123156
/>
124157
)
125158

@@ -133,6 +166,7 @@ class CreateMilestoneForm extends React.Component {
133166

134167
CreateMilestoneForm.propTypes = {
135168
onSubmit: PT.func.isRequired,
169+
previousMilestone: PT.object.isRequired
136170
}
137171

138172
export default CreateMilestoneForm

‎src/projects/detail/components/timeline/Timeline/Timeline.jsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -150,14 +150,15 @@ class Timeline extends React.Component {
150150
} else {
151151
//Ordering milestones wrt "order" before rendering
152152
const orderedMilestones = timeline.milestones ? _.orderBy(timeline.milestones, ['order']) : []
153+
const allShowMilestones = _.reject(orderedMilestones, { hidden: true })
153154
return (
154155
<div ref={ div => { this.div = div } }>
155156
<NotificationsReader
156157
key="notifications-reader"
157158
id={`phase-${phaseId}-timeline-${timeline.id}`}
158159
criteria={buildPhaseTimelineNotificationsCriteria(timeline)}
159160
/>
160-
{_.reject(orderedMilestones, { hidden: true }).map((milestone, index) => (
161+
{allShowMilestones.map((milestone, index) => (
161162
<Milestone
162163
key={milestone.id}
163164
currentUser={currentUser}
@@ -176,6 +177,7 @@ class Timeline extends React.Component {
176177
/>
177178
))}
178179
<CreateMilestoneForm
180+
previousMilestone={_.last(allShowMilestones)}
179181
onSubmit={this.createMilestone}
180182
/>
181183
</div>

‎src/projects/detail/components/timeline/createMilestoneForm/CreateMilestoneForm.jsx‎

Lines changed: 46 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import React from 'react'
55
import PT from 'prop-types'
66
import moment from 'moment'
77

8-
import { MILESTONE_TYPE, MILESTONE_TYPE_OPTIONS } from '../../../../../config/constants'
8+
import { MILESTONE_TYPE_OPTIONS } from '../../../../../config/constants'
99
import LoadingIndicator from '../../../../../components/LoadingIndicator/LoadingIndicator'
1010
import Form from '../Form'
1111
import './CreateMilestoneForm.scss'
@@ -14,22 +14,29 @@ class CreateMilestoneForm extends React.Component {
1414
constructor(props) {
1515
super(props)
1616

17+
const {previousMilestone} = props
1718
this.state = {
1819
isEditing: false,
19-
type: MILESTONE_TYPE.REPORTING,
20-
title: 'Reporting',
21-
startDate: moment.utc().format('YYYY-MM-DD'),
22-
endDate: moment.utc().add(3, 'days').format('YYYY-MM-DD')
20+
type: '',
21+
title: '',
22+
startDate: moment.utc(previousMilestone.endDate).format('YYYY-MM-DD'),
23+
endDate: moment.utc(previousMilestone.endDate).add(3, 'days').format('YYYY-MM-DD')
2324
}
2425

2526
this.submitForm = this.submitForm.bind(this)
2627
this.cancelEdit = this.cancelEdit.bind(this)
2728
this.onAddClick = this.onAddClick.bind(this)
29+
this.changeForm = this.changeForm.bind(this)
2830
}
2931

3032
cancelEdit() {
33+
const {previousMilestone} = this.props
3134
this.setState({
32-
isEditing: false
35+
isEditing: false,
36+
type: '',
37+
title: '',
38+
startDate: moment.utc(previousMilestone.endDate).format('YYYY-MM-DD'),
39+
endDate: moment.utc(previousMilestone.endDate).add(3, 'days').format('YYYY-MM-DD')
3340
})
3441
}
3542

@@ -56,6 +63,35 @@ class CreateMilestoneForm extends React.Component {
5663
values.blockedText = 'blocked text'
5764
onSubmit(values)
5865
}
66+
changeForm(values) {
67+
const { type, title, startDate, endDate } = this.state
68+
if (values['name'] !== title) {
69+
this.setState({
70+
title: values['name']
71+
})
72+
}
73+
if (values['startDate'] !== startDate) {
74+
this.setState({
75+
startDate: values['startDate']
76+
})
77+
}
78+
if (values['endDate'] !== endDate) {
79+
this.setState({
80+
endDate: values['endDate']
81+
})
82+
}
83+
// set title when select type and title is empty
84+
if (values['type'] !== type) {
85+
this.setState({
86+
type: values['type']
87+
})
88+
if (!title) {
89+
this.setState({
90+
title: values['type']
91+
})
92+
}
93+
}
94+
}
5995

6096
render() {
6197
const { isAdding, isEditing, type, title, startDate, endDate } = this.state
@@ -76,7 +112,7 @@ class CreateMilestoneForm extends React.Component {
76112
fields={[
77113
{
78114
label: 'Type',
79-
placeholder: 'Type',
115+
placeholder:'Select Type',
80116
options: MILESTONE_TYPE_OPTIONS,
81117
name: 'type',
82118
value: type,
@@ -88,12 +124,7 @@ class CreateMilestoneForm extends React.Component {
88124
name: 'name',
89125
value: title,
90126
type: 'text',
91-
validations: {
92-
isRequired: true
93-
},
94-
validationError: 'Name is required',
95127
},
96-
97128
{
98129
label: 'Start Date',
99130
placeholder: 'start date',
@@ -119,7 +150,9 @@ class CreateMilestoneForm extends React.Component {
119150
]}
120151
onCancelClick={this.cancelEdit}
121152
onSubmit={this.submitForm}
153+
onChange={this.changeForm}
122154
submitButtonTitle="Create Milestone"
155+
disableSubmitButton={!type}
123156
/>
124157
)
125158

@@ -133,6 +166,7 @@ class CreateMilestoneForm extends React.Component {
133166

134167
CreateMilestoneForm.propTypes = {
135168
onSubmit: PT.func.isRequired,
169+
previousMilestone: PT.object.isRequired
136170
}
137171

138172
export default CreateMilestoneForm

0 commit comments

Comments
 (0)