350 lines
17 KiB
HTML
350 lines
17 KiB
HTML
<div class="edit-ticket-dates">
|
|
<div class="ticket-date__form_invalid"
|
|
ng-if="(dateForm.scheduledStartDate.$invalid && dateForm.scheduledStartDate.$dirty)||
|
|
(dateForm.scheduledEndDate.$invalid && dateForm.scheduledEndDate.$dirty) ||
|
|
(dateForm.actualStartDate.$invalid && dateForm.actualStartDate.$dirty) ||
|
|
(dateForm.actualEndDate.$invalid && dateForm.actualEndDate.$dirty) ||
|
|
(dateForm.targetDate.$invalid && dateForm.targetDate.$dirty)">
|
|
<i class="icon-exclamation_triangle"></i>
|
|
<span ng-if="dateForm.scheduledStartDate.$invalid && dateForm.scheduledStartDate.$dirty">{{'create.ticket.invalid.scheduled-start-date'|i18n}}</span>
|
|
<span ng-if="dateForm.scheduledEndDate.$invalid && dateForm.scheduledEndDate.$dirty">{{'create.ticket.invalid.scheduled-end-date'|i18n}}</span>
|
|
<span ng-if="dateForm.actualStartDate.$invalid && dateForm.actualStartDate.$dirty">{{'create.ticket.invalid.actual-start-date'|i18n}}</span>
|
|
<span ng-if="dateForm.actualEndDate.$invalid && dateForm.actualEndDate.$dirty">{{'create.ticket.invalid.actual-end-date'|i18n}}</span>
|
|
<span ng-if="dateForm.targetDate.$invalid && dateForm.targetDate.$dirty">{{'create.ticket.invalid.target-date'|i18n}}</span>
|
|
</div>
|
|
<div class="row ticket__row">
|
|
<div class="col-sm-6 custom-field__date_time_container" ng-hide="onlyShowRequired && (!isFieldRequired('scheduledStartDate') || !ticket.accessMappings.scheduleddateEditAllowed)">
|
|
<label class="label_control-wrap">
|
|
<span id="scheduledStart" class="label__text" ng-class="{'required__label' : (isFieldRequired('scheduledStartDate') && !makeScheduleDatesOptional)}"
|
|
data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.ticket.scheduled.start.time' | i18n }}
|
|
</span>
|
|
|
|
<div class="col-sm-12">
|
|
<div class="custom-field__date col-sm-6">
|
|
<input type="text"
|
|
required
|
|
class="form-control"
|
|
name="scheduledStartDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.scheduledStartDate"
|
|
is-open="ticket.scheduledStartDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.scheduledStartDatePicker.open = true"
|
|
ng-enter="ticket.scheduledStartDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.scheduledStartDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('scheduled')"
|
|
ng-if="isFieldRequired('scheduledStartDate') && !makeScheduleDatesOptional"
|
|
aria-label="{{'common.aria.labels.scheduleStart' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<input type="text"
|
|
potentially-required-field
|
|
field-name="scheduledStartDate"
|
|
entity="ticket"
|
|
class="form-control"
|
|
name="scheduledStartDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.scheduledStartDate"
|
|
is-open="ticket.scheduledStartDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.scheduledStartDatePicker.open = true"
|
|
ng-enter="ticket.scheduledStartDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.scheduledStartDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('scheduled')"
|
|
ng-if="!isFieldRequired('scheduledStartDate') || makeScheduleDatesOptional"
|
|
aria-label="{{'common.aria.labels.scheduleStart' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<i class="icon-calendar custom-field__date-icon"></i>
|
|
</div>
|
|
|
|
<div class="custom-field__time col-sm-6">
|
|
<div class="dropdown timepicker">
|
|
<div class="dropdown-toggle">
|
|
<input class="form-control custom-field__time-input" type="text" value="{{ ticket.scheduledStartDate | date: 'shortTime' }}"
|
|
ng-disabled="validator.scheduledStartTimeDisabled(ticket, true, ignoreAccessMapping)"
|
|
title="{{'common.label.time' | i18n}}" aria-labelledby="scheduledStart"
|
|
aria-label="{{'common.aria.labels.scheduleStart' | i18n}} {{'common.aria.labels.timeField' | i18n}}"
|
|
readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="ticket.scheduledStartDate">
|
|
<timepicker ng-model="ticket.scheduledStartDate"
|
|
ng-change="updateDateTime('scheduled')"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="col-sm-6 custom-field__date_time_container" ng-hide="onlyShowRequired && (!isFieldRequired('actualStartDate') || !ticket.accessMappings.actualdateEditAllowed) ">
|
|
<label class="label_control-wrap">
|
|
<span id="actualStart" class="label__text" ng-class="{'required__label' : (isFieldRequired('actualStartDate') && !makeActualDatesOptional)}"
|
|
data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.ticket.actual.start.time' | i18n }}
|
|
</span>
|
|
|
|
<div class="col-sm-12">
|
|
<div class="custom-field__date col-sm-6">
|
|
<input type="text"
|
|
required
|
|
class="form-control"
|
|
name="actualStartDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.actualStartDate"
|
|
is-open="ticket.actualStartDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.actualStartDatePicker.open = true"
|
|
ng-enter="ticket.actualStartDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.actualStartDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('actual')"
|
|
ng-if="isFieldRequired('actualStartDate') && !makeActualDatesOptional"
|
|
aria-label="{{'common.aria.labels.actualStart' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<input type="text"
|
|
potentially-required-field
|
|
field-name="actualStartDate"
|
|
entity="ticket"
|
|
class="form-control"
|
|
name="actualStartDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.actualStartDate"
|
|
is-open="ticket.actualStartDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.actualStartDatePicker.open = true"
|
|
ng-enter="ticket.actualStartDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.actualStartDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('actual')"
|
|
ng-if="!isFieldRequired('actualStartDate') || makeActualDatesOptional"
|
|
aria-label="{{'common.aria.labels.actualStart' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<i class="icon-calendar custom-field__date-icon"></i>
|
|
</div>
|
|
<div class="custom-field__time col-sm-6">
|
|
<div class="dropdown timepicker">
|
|
<div class="dropdown-toggle">
|
|
<input class="form-control custom-field__time-input" type="text" value="{{ ticket.actualStartDate | date: 'shortTime' }}"
|
|
ng-disabled="validator.actualStartTimeDisabled(ticket, true, ignoreAccessMapping)"
|
|
title="{{'common.label.time' | i18n}}" aria-label="{{'common.aria.labels.actualStart' | i18n}} {{'common.aria.labels.timeField' | i18n}}" readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="ticket.actualStartDate">
|
|
<timepicker ng-model="ticket.actualStartDate"
|
|
ng-change="updateDateTime('actual')"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="row ticket__row">
|
|
<div class="col-sm-6 custom-field__date_time_container" ng-hide="onlyShowRequired && (!isFieldRequired('scheduledEndDate') || !ticket.accessMappings.scheduleddateEditAllowed)">
|
|
<label class="label_control-wrap">
|
|
<span id="scheduledEnd" class="label__text" ng-class="{'required__label' : (isFieldRequired('scheduledEndDate') && !makeScheduleDatesOptional)}"
|
|
data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.ticket.scheduled.end.time' | i18n }}
|
|
</span>
|
|
|
|
<div class="col-sm-12">
|
|
<div class="custom-field__date col-sm-6">
|
|
<input type="text"
|
|
required
|
|
class="form-control"
|
|
name="scheduledEndDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.scheduledEndDate"
|
|
is-open="ticket.scheduledEndDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.scheduledEndDatePicker.open = true"
|
|
ng-enter="ticket.scheduledEndDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.scheduledEndDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('scheduled')"
|
|
ng-if="isFieldRequired('scheduledEndDate') && !makeScheduleDatesOptional"
|
|
aria-label="{{'common.aria.labels.scheduleEnd' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<input type="text"
|
|
potentially-required-field
|
|
field-name="scheduledEndDate"
|
|
entity="ticket"
|
|
class="form-control"
|
|
name="scheduledEndDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.scheduledEndDate"
|
|
is-open="ticket.scheduledEndDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.scheduledEndDatePicker.open = true"
|
|
ng-enter="ticket.scheduledEndDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.scheduledEndDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('scheduled')"
|
|
ng-if="!isFieldRequired('scheduledEndDate') || makeScheduleDatesOptional"
|
|
aria-label="{{'common.aria.labels.scheduleEnd' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<i class="icon-calendar custom-field__date-icon"></i>
|
|
</div>
|
|
|
|
<div class="custom-field__time col-sm-6">
|
|
<div class="dropdown timepicker">
|
|
<div class="dropdown-toggle">
|
|
<input class="form-control custom-field__time-input" type="text" value="{{ ticket.scheduledEndDate | date: 'shortTime' }}"
|
|
ng-disabled="validator.scheduledEndTimeDisabled(ticket, true, ignoreAccessMapping)"
|
|
title="{{'common.label.time' | i18n}}" aria-label="{{'common.aria.labels.scheduleEnd' | i18n}} {{'common.aria.labels.timeField' | i18n}}" readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="ticket.scheduledEndDate">
|
|
<timepicker ng-model="ticket.scheduledEndDate"
|
|
ng-change="updateDateTime('scheduled')"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="col-sm-6 custom-field__date_time_container" ng-hide="onlyShowRequired && (!isFieldRequired('actualEndDate') || !ticket.accessMappings.actualdateEditAllowed)">
|
|
<label class="label_control-wrap">
|
|
<span id="actualEnd" class="label__text" ng-class="{'required__label' : (isFieldRequired('actualEndDate') && !makeActualDatesOptional)}"
|
|
data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.ticket.actual.end.time' | i18n }}
|
|
</span>
|
|
|
|
<div class="col-sm-12">
|
|
<div class="custom-field__date col-sm-6">
|
|
<input type="text"
|
|
required
|
|
class="form-control"
|
|
name="actualEndDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.actualEndDate"
|
|
is-open="ticket.actualEndDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.actualEndDatePicker.open = true"
|
|
ng-enter="ticket.actualEndDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.actualEndDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('actual')"
|
|
ng-if="isFieldRequired('actualEndDate') && !makeActualDatesOptional"
|
|
aria-label="{{'common.aria.labels.actualEnd' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<input type="text"
|
|
potentially-required-field
|
|
field-name="actualEndDate"
|
|
entity="ticket"
|
|
class="form-control"
|
|
name="actualEndDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.actualEndDate"
|
|
is-open="ticket.actualEndDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.actualEndDatePicker.open = true"
|
|
ng-enter="ticket.actualEndDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.actualEndDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateDateTime('actual')"
|
|
ng-if="!isFieldRequired('actualEndDate') || makeActualDatesOptional"
|
|
aria-label="{{'common.aria.labels.actualEnd' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<i class="icon-calendar custom-field__date-icon"></i>
|
|
</div>
|
|
|
|
<div class="custom-field__time col-sm-6">
|
|
<div class="dropdown timepicker">
|
|
<div class="dropdown-toggle">
|
|
<input class="form-control custom-field__time-input" type="text" value="{{ ticket.actualEndDate | date: 'shortTime' }}"
|
|
ng-disabled="validator.actualEndTimeDisabled(ticket, true, ignoreAccessMapping)"
|
|
title="{{'common.label.time' | i18n}}"
|
|
aria-label="{{'common.aria.labels.actualEnd' | i18n}} {{'common.aria.labels.timeField' | i18n}}"
|
|
readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="ticket.actualEndDate">
|
|
<timepicker ng-model="ticket.actualEndDate"
|
|
ng-change="updateDateTime('actual')"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="ticket__change-target-date-separator" ng-if="targetDateEnabled"></div>
|
|
<div class="row ticket__row" ng-if="targetDateEnabled">
|
|
<div class="col-sm-6 custom-field__date_time_container">
|
|
<label>
|
|
<span id="targetDate" class="label__text">
|
|
{{'create.ticket.target.date' | i18n}}
|
|
</span>
|
|
|
|
<div class="col-sm-12">
|
|
<div class="custom-field__date col-sm-6">
|
|
<input type="text"
|
|
class="form-control"
|
|
name="targetDate"
|
|
title="{{'common.label.date' | i18n}}"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="ticket.targetDate"
|
|
is-open="ticket.targetDatePicker.open"
|
|
show-button-bar="false"
|
|
ng-click="ticket.targetDatePicker.open = true"
|
|
ng-enter="ticket.targetDatePicker.open = true"
|
|
datepicker-options="datePickerOptions"
|
|
ng-disabled="validator.targetDateDisabled(ticket, true, ignoreAccessMapping)"
|
|
ng-change="updateTargetDate()"
|
|
aria-label="{{'common.aria.labels.targetDate' | i18n}} {{'common.aria.labels.dateField' | i18n}}"
|
|
/>
|
|
<i class="icon-calendar custom-field__date-icon"></i>
|
|
</div>
|
|
<div class="custom-field__time col-sm-6">
|
|
<div class="dropdown timepicker">
|
|
<div class="dropdown-toggle">
|
|
<input class="form-control custom-field__time-input" type="text" value="{{ ticket.targetDate | date: 'shortTime' }}"
|
|
ng-disabled="validator.targetTimeDisabled(ticket, true, ignoreAccessMapping)"
|
|
title="{{'common.label.time' | i18n}}" aria-labelledby="targetDate"
|
|
aria-label="{{'common.aria.labels.targetDate' | i18n}} {{'common.aria.labels.timeField' | i18n}}"
|
|
readonly="readonly"/>
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="ticket.targetDate">
|
|
<timepicker ng-model="ticket.targetDate"
|
|
ng-change="updateTargetDate()"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="col-sm-6"></div>
|
|
</div>
|
|
</div> |