@@ -452,7 +459,7 @@ class SpecQuestions extends React.Component {
!(question.type === 'estimation' && template.hideEstimation)
).map((q, index) => {
return (
- _.includes(['checkbox', 'checkbox-group', 'radio-group', 'add-ons', 'textinput', 'textbox', 'numberinput', 'skills', 'slide-radiogroup', 'slider-standard', 'select-dropdown', 'talent-picker'], q.type) && q.visibilityForRendering === STEP_VISIBILITY.READ_OPTIMIZED ? (
+ _.includes(['checkbox', 'checkbox-group', 'radio-group', 'add-ons', 'textinput', 'textbox', 'numberinput', 'skills', 'slide-radiogroup', 'slider-standard', 'select-dropdown', 'talent-picker', 'talent-picker-v2'], q.type) && q.visibilityForRendering === STEP_VISIBILITY.READ_OPTIMIZED ? (
{
+ if (!required) {
+ return true
+ }
+ return _.some(value, (v) => {
+ return v.people !== '0' && v.duration !== '0' && v.skills.length > 0 && v.workLoad.value !== null && v.jobDescription.length
+ }) // validation body
+ },
+ noPartialFillsExist: (formValues, value) => {
+ return _.every(value, v => {
+
+ const isOneValueFilled = v.people > 0 || v.duration > 0 || (v.skills && v.skills.length) || (v.jobDescription && v.jobDescription.length) || (v.workLoad && v.workLoad.value !== null)
+ const isAllValuesFilled = v.people > 0 && v.duration > 0 && v.skills && v.skills.length && v.jobDescription.length && v.workLoad.value !== null
+ // If one value is filled, all values should be filled to make this row valid. Partial fill is not valid
+ const isRowValid = !isOneValueFilled || isAllValuesFilled
+ return isRowValid
+ })
+ }
+ }
+ setValidations(validations)
+ }
+
+ updateOptions(props) {
+ const options = props.options.map(o => ({...o, skillsCategories: o.skillsCategory ? [ o.skillsCategory ] : null}))
+ this.setState({ options })
+ }
+
+ getDefaultValue() {
+ const { options } = this.props
+ return options.map((o) => ({
+ role: o.role,
+ people: '0',
+ duration: '0',
+ skills: [],
+ additionalSkills: [],
+ workLoad: { value: null, title: 'Select Workload'},
+ jobDescription: ''
+ }))
+ }
+
+ onChange(value) {
+ const {setValue, name} = this.props
+
+ setValue(value)
+ this.props.onChange(name, value)
+ }
+
+ handleValueChange(index, field, value) {
+ const { getValue } = this.props
+ let values = getValue() || this.getDefaultValue()
+ values = [...values.slice(0, index), { ...values[index], [field]: value }, ...values.slice(index + 1)]
+
+ this.onChange(values)
+ }
+
+ insertRole(index, role) {
+ const { getValue } = this.props
+ let values = getValue() || this.getDefaultValue()
+
+ values = [
+ ...values.slice(0, index),
+ {
+ role,
+ people: '0',
+ duration: '0',
+ skills: [],
+ additionalSkills: [],
+ workLoad: { value: null, title: 'Select Workload'},
+ jobDescription: '',
+ },
+ ...values.slice(index)
+ ]
+ this.onChange(values)
+ }
+
+ removeRole(index) {
+ const { getValue } = this.props
+ let values = getValue() || this.getDefaultValue()
+ values = [...values.slice(0, index), ...values.slice(index + 1)]
+ this.onChange(values)
+ }
+
+ canDeleteRole(role, index) {
+ const { getValue } = this.props
+ const values = getValue() || this.getDefaultValue()
+ return _.findIndex(values, { role }) !== index
+ }
+
+ render() {
+ const { wrapperClass, getValue } = this.props
+ const { options } = this.state
+
+ const errorMessage =
+ this.props.getErrorMessage() || this.props.validationError
+ const hasError = !this.props.isPristine() && !this.props.isValid()
+
+ const values = getValue() || this.getDefaultValue()
+
+ return (
+
+
+ {options.length > 0 ? values.map((v, roleIndex) => {
+ const roleSetting = _.find(options, { role: v.role })
+ return (
+
+ )
+ }) : null}
+
+ {hasError ?
{errorMessage}
: null}
+
+
+
+
{roleSetting.roleTitle}
+
+
+
+
+
+
+ {canBeDeleted(value.role, rowIndex) && (
+
+
+
+ )}
+
+
+
+
+
+
+
+
+
+ {/*
+ Please do not refactor getValue prop's value to a binded function with constant reference.
+ SkillsQuestion is a pure component. If all the props are constant across renders, SkillsQuestion cannot detect the change in value.skills.
+ So, it'll break the functionality of the component.
+ "getValue" prop is left as inline arrow function to trigger re rendering of the SkillsQuestion component whenever the parent rerenders.
+ */}
+ value.skills}
+ onChange={_.noop}
+ selectWrapperClass={cn(styles.noMargin, {[styles.skillHasError]: isRowIncomplete && !(value.skills && value.skills.length)})}
+ />
+
+ )
+
+ const workLoadColumn = (
+
+
+
+
+ )
+
+ const jobDescriptionColumn = (
+
+
+
+
+
+
+
+ {/*
+ Please do not refactor getValue prop's value to a binded function with constant reference.
+ SkillsQuestion is a pure component. If all the props are constant across renders, SkillsQuestion cannot detect the change in value.skills.
+ So, it'll break the functionality of the component.
+ "getValue" prop is left as inline arrow function to trigger re rendering of the SkillsQuestion component whenever the parent rerenders.
+ */}
+ value.additionalSkills}
+ onChange={_.noop}
+ selectWrapperClass={cn(styles.noMargin)}
+ />
+
+ )
+
+ return (
+
+
+ {roleColumn}
+ {actionsColumn}
+
+
+
+ {peopleColumn}
+ {workLoadColumn}
+
+
+ {durationColumn}
+
+
+ {jobDescriptionColumn}
+
+
+
{skillSelectionColumn}
+
{additionalSkillSelectionColumn}
+
@@ -547,6 +554,16 @@ class ProjectInfoContainer extends React.Component {
+ {project.billingAccountId ?
+
+ {BillingInfo}
+
+ :
+
+ {BillingInfo}
+
+
+ }
diff --git a/src/projects/detail/containers/ProjectInfoContainer.scss b/src/projects/detail/containers/ProjectInfoContainer.scss
index a12ee6fe4..0e72b7755 100644
--- a/src/projects/detail/containers/ProjectInfoContainer.scss
+++ b/src/projects/detail/containers/ProjectInfoContainer.scss
@@ -48,6 +48,18 @@
letter-spacing: 0.8px;
}
+.administration-section .billing-account-info {
+ @include roboto-medium;
+ font-size: $tc-label-md;
+ color: $tc-gray-40;
+ line-height: $base-unit*6;
+ padding-left: 4 * $base_unit;
+
+ @media screen and (max-width: $screen-md - 1px) {
+ padding-bottom: 4 * $base_unit;
+ }
+}
+
.all-project-link-wrapper {
display: flex;
padding: 20px;
@@ -60,6 +72,8 @@
margin-top: 20px;
padding: 5px 0;
+
+
:global {
.panel {
// avoid double padding for editable project status