const gradingPeriodSetTitle = set => {
if (set.title && set.title.trim()) {
return set.title.trim()
} else {
const createdAt = DateHelper.formatDateForDisplay(new Date(set.created_at))
return I18n.t('Set created %{createdAt}', {createdAt})
}
}
_validateMultipleGradingPeriods (date, errs) {
const helper = new GradingPeriodsHelper(this.gradingPeriods)
const dueAt = date === null ? null : new Date(this._formatDatetime(date))
if (!helper.isDateInClosedGradingPeriod(dueAt)) return
const earliestDate = helper.earliestValidDueDate
if (earliestDate) {
const formatted = DateHelper.formatDateForDisplay(earliestDate)
errs.due_at = I18n.t('Please enter a due date on or after %{earliestDate}', {
earliestDate: formatted,
})
} else {
errs.due_at = I18n.t('Due date cannot fall in a closed grading period')
}
}
renderEndDate: function() {
if (isEditable(this)) {
return (
<input id={postfixId("period_end_date_", this)} type="text"
className="GradingPeriod__Detail ic-Input input-grading-period-date date_field"
ref="endDate"
name="endDate"
defaultValue={DateHelper.formatDateForDisplay(this.props.endDate)}
disabled={this.props.disabled}/>
);
} else {
return (
<div>
<span className="screenreader-only">{I18n.t("End Date")}</span>
{ tabbableDate("endDate", this.props.endDate) }
</div>
);
}
},
const tabbableDate = (ref, date) => {
const formattedDate = DateHelper.formatDateForDisplay(date);
return <span ref={ref} className="GradingPeriod__Action">{ formattedDate }</span>;
};
<div className="GradingPeriodList__period__attribute col-xs-12 col-md-8 col-lg-2">
<span ref="weight">{ I18n.t("Weight:") } { I18n.n(this.props.period.weight, {percentage: true}) }</span>
</div>
);
}
},
render() {
return (
<div className="GradingPeriodList__period">
<div className="GradingPeriodList__period__attributes grid-row">
<div className="GradingPeriodList__period__attribute col-xs-12 col-md-8 col-lg-4">
<span ref="title">{this.props.period.title}</span>
</div>
<div className="GradingPeriodList__period__attribute col-xs-12 col-md-8 col-lg-2">
<span ref="startDate">{I18n.t("Starts:")} {DateHelper.formatDateForDisplay(this.props.period.startDate)}</span>
</div>
<div className="GradingPeriodList__period__attribute col-xs-12 col-md-8 col-lg-2">
<span ref="endDate">{I18n.t("Ends:")} {DateHelper.formatDateForDisplay(this.props.period.endDate)}</span>
</div>
<div className="GradingPeriodList__period__attribute col-xs-12 col-md-8 col-lg-2">
<span ref="closeDate">{I18n.t("Closes:")} {DateHelper.formatDateForDisplay(this.props.period.closeDate)}</span>
</div>
{this.renderWeight()}
</div>
<div className="GradingPeriodList__period__actions">
{this.renderEditButton()}
{this.renderDeleteButton()}
</div>
</div>
);