SmartIT_Extensions/BMC/smart-it-full/views/create/create-work-order.html

694 lines
30 KiB
HTML

<div class="create-workorder clearfix">
<div class="create-form-wrapper">
<div loading-spinner class="create-ticket__loading-spinner" if="state.dataIsLoading" centered="true" overlay="true"></div>
<div class="clearfix">
<form name="createWorkorderForm" novalidate>
<div class="create-ticket__header">
<h3 class="create-ticket__header-title">{{ 'create.workorder.header' | i18n }}</h3>
<span>{{ 'create.workorder.sub.header' | i18n }}</span>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-6 create-ticket__section">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="{{persons[0].selectedSubType.relationship + '.loginId'}}"
entity="workorder">
{{ 'create.ticket.affected.customer' | i18n }}
</span>
<div class="create-ticket__person-item"
ng-repeat="person in persons"
ng-if="person.show">
<input type="text"
potentially-required-field
field-name="{{person.selectedSubType.relationship + '.loginId'}}"
entity="workorder"
title="{{ 'create.ticket.affected.' + person.selectedSubType.relationship | i18n }}"
class="custom-input"
ng-model="person.ngModel"
role="combobox"
prevent-click-event
typeahead-min-length="3"
typeahead-template-url="views/create/custom-add-user-dropdown.html"
typeahead-on-select="onCustomerSelect($model)"
typeahead-wait-ms="500"
typeahead-loading="person.isLoading"
typeahead="customer as customer.firstName + ' ' + customer.lastName for customer in getList('person', $viewValue)"
placeholder="{{ 'create.ticket.affected.' + person.selectedSubType.relationship + '.placeholder' | i18n }}"
auto-focus>
<div class="person-item__select-type dropdown" ng-if="person.ngModel.fullName">
<button type="button" class="person-select-type dropdown-toggle" aria-label="{{ 'smartrecorder.personTypeMenu.shortName.' + person.selectedSubType.i18nKey | i18n}}">
<span ng-if="person.ngModel.isVIP">{{'common.labels.vip' | i18n}}</span> {{ 'smartrecorder.personTypeMenu.shortName.' + person.selectedSubType.i18nKey | i18n}}
</button>
<ul class="dropdown-menu full-width">
<li ng-repeat="subType in personSubTypes">
<div role="menuitem" tabindex="0" class="{{(subType.relationship == person.selectedSubType.relationship) ? 'dropdown-item_selected' : 'dropdown-item'}}"
ng-click="updatePersonSubType(person, subType)">{{ 'smartrecorder.personTypeMenu.shortName.' + subType.i18nKey | i18n}}
</div>
</li>
</ul>
</div>
<div class="select-custom-dropdown__spinner-container">
<loading-spinner if="person.isLoading" inline="true"></loading-spinner>
</div>
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
title="{{'common.button.clear' | i18n}} {{ 'create.ticket.affected.' + person.selectedSubType.relationship | i18n }}" ng-if="(person.ngModel || person.index === 1) && !person.isLoading"
focus-input-on-clear ng-click="clearPerson(person)" ng-enter="clearPerson(person)">
</i>
</div>
</label>
<div class="create-ticket__item">
<button type="button" class="small-btn_secondary create-ticket__add-person"
ng-click="addPerson()"
ng-hide="persons[0].show && persons[1].show">
{{ 'create.ticket.add.person.btn' | i18n }}
</button>
</div>
</div>
<div class="col-sm-6 create-ticket__section">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="customer.company.name"
entity="workorder">
{{ 'create.ticket.affected.company' | i18n }}
</span>
<div class="create-ticket__company-item">
<input type="text"
potentially-required-field
field-name="customer.company.name"
entity="workorder"
title="{{ 'create.ticket.affected.company' | i18n }}"
class="custom-input"
name="company"
placeholder="{{ 'create.ticket.affected.company.placeholder' | i18n }}"
ng-model="workorder.selectedCompany.name"
ng-disabled="true">
</div>
</label>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-6 create-ticket__section">
<label class="label_control-wrap">
<span class="label__text">
{{ 'create.ticket.selectWorkOrderTemplate' | i18n }}
</span>
<div class="create-ticket__template-item">
<div class="create-ticket__template-input">
<input type="text"
aria-required="true"
title="{{ 'create.ticket.selectWorkOrderTemplate' | i18n }}"
class="ticket-template__input"
name="template"
ng-model="workorder.selectedTemplate"
ng-disabled="!workorder.selectedCompany"
role="combobox"
prevent-click-event
typeahead-min-length="3"
typeahead="template as template.name for template in getList('workorderTemplate', $viewValue)"
placeholder="{{ 'create.ticket.template.placeholder' | i18n }}">
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
title="{{'common.button.clear' | i18n}} {{ 'create.ticket.selectWorkOrderTemplate' | i18n }}" ng-if="workorder.selectedTemplate"
focus-input-on-clear ng-click="clearSelectedTemplate()" ng-enter="clearSelectedTemplate()">
</i>
</div>
<button type="button" class="small-btn_secondary ticket-template__browse-btn" ng-disabled="!workorder.selectedCompany || workorder.selectedTemplate.name" ng-click="browseWorkorderTemplate()">{{ 'create.ticket.browse.btn' | i18n }}</button>
</div>
</label>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-6 create-ticket__section">
<div class="clearfix">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="summary"
entity="workorder">
{{ 'create.workorder.summary' | i18n }}
</span>
<div class="create-ticket__item">
<input type="text"
prevent-click-event
potentially-required-field
field-name="summary"
entity="workorder"
title="{{ 'create.workorder.summary' | i18n }}"
class="custom-input"
name="summary"
ng-model="workorder.summary"
placeholder="{{ 'create.workorder.summary.placeholder' | i18n }}"
maxlength="100">
<character-limit-message field="workorder.summary" limit="100"></character-limit-message>
</div>
</label>
</div>
<div class="row">
<div class="col-sm-6">
<div class="create-ticket__section">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="priority"
entity="workorder">
{{ 'create.ticket.priority' | i18n }}
</span>
<div class="create-ticket__item">
<selection selection-items="workorderMetadata.priorities"
selected-item="workorder.selectedPriority"
title-text="{{'create.ticket.priority' | i18n}}"
label="label"
value="label"
aria-required="true"
field-name="priority"
entity="workorder"
update-selected-item="true">
</selection>
</div>
</label>
</div>
<div class="create-ticket__section">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="status.value"
entity="workorder">
{{ 'create.workorder.status' | i18n }}
</span>
<div class="create-ticket__item">
<selection selection-items="workorderMetadata.statuses"
selected-item="workorder.selectedStatus"
selection-callback="updateStatusReason()"
title-text="{{'create.workorder.status' | i18n}}"
label="label"
value="label"
aria-required="true"
field-name="status.value"
entity="workorder"
update-selected-item="true">
</selection>
</div>
</label>
</div>
<div class="create-ticket__section" ng-if="workorder.selectedStatus.statusReasons.length">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="status.reason"
entity="workorder">
{{ 'create.ticket.status.reason' | i18n }}
</span>
<div class="create-ticket__item">
<selection selection-items="workorder.selectedStatus.statusReasons"
selected-item="workorder.selectedStatusReason"
title-text="{{'create.incident.status-reason' | i18n}}"
label="label"
value="label"
aria-required="true"
field-name="status.reason"
entity="workorder"
update-selected-item="true">
</selection>
</div>
</label>
</div>
</div>
</div>
</div>
<div class="col-sm-6 create-ticket__section">
<div class="create-ticket__item">
<edit-summary label="{{'create.workorder.description' | i18n}}" ticket="workorder" context="'create'"
textplaceholder="'create.ticket.description.placeholder' | i18n" attachment="true" show-attachment-icon="true"></edit-summary>
</div>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-6 create-ticket__section">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="customer.company.location"
entity="workorder">
{{ 'create.workorder.location' | i18n }}
</span>
<div class="row">
<div class="col-sm-6">
<div class="create-ticket__location-item">
<input type="text"
potentially-required-field
field-name="customer.company.location"
entity="workorder"
title="{{ 'create.workorder.location' | i18n }}"
class="custom-input"
name="location"
ng-model="workorder.location"
typeahead-wait-ms="550"
typeahead-loading="state.loadingLocations"
typeahead-min-length="3"
typeahead-ignore-blur="true"
typeahead="location as (location.name +' @ '+ location.address) for location in getList('workorderLocation', $viewValue)"
placeholder="{{ 'create.workorder.location.placeholder' | i18n }}">
<span loading-spinner class="create-ticket__loading-spinner_poi-input" if="state.loadingLocations" overlay="true" inline="true"></span>
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
title="{{'common.button.clear' | i18n}} {{ 'create.workorder.location' | i18n }}" ng-if="workorder.location"
focus-input-on-clear ng-click="clearLocation()" ng-enter="clearLocation()">
</i>
</div>
</div>
<div class="col-sm-6">
<div class="create-ticket__location-item" ng-if="workorder.location.id">
<input type="text"
title="{{ 'create.workorder.location.poi.placeholder' | i18n }}"
class="custom-input"
name="poi"
ng-model="workorder.poi"
typeahead-wait-ms="550"
typeahead-loading="state.loadingPOI"
typeahead-min-length="3"
typeahead-ignore-blur="true"
typeahead="poi as (poi.type.name + ': ' + poi.name + ' @ ' + poi.floormap.name) for poi in getList('workorderPOI', {searchText: $viewValue, location: workorder.location.id})"
placeholder="{{ 'create.workorder.location.poi.placeholder' | i18n }}">
<span loading-spinner class="create-ticket__loading-spinner_poi-input" if="state.loadingPOI" overlay="true" inline="true"></span>
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
title="{{'common.button.clear' | i18n}}" ng-if="workorder.poi"
focus-input-on-clear ng-click="workorder.poi = null" ng-enter="workorder.poi = null">
</i>
</div>
</div>
</div>
</label>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-6">
<div class="row">
<div class="col-sm-6 create-ticket__section create-ticket__affected-service">
<label class="label_control-wrap">
<span class="label__text"
potentially-required-field
field-name="impactedService.name"
entity="workorder">
{{ 'create.ticket.affected.business.services' | i18n }}
</span>
<div class="create-ticket__service-item">
<input type="text"
potentially-required-field
field-name="impactedService.name"
entity="workorder"
title="{{ 'create.ticket.affected.business.services' | i18n }}"
name="service"
ng-model="workorder.selectedService"
ng-disabled="!workorder.customer"
role="combobox"
typeahead-wait-ms="500"
typeahead-min-length="3"
typeahead-template-url="views/create/custom-add-asset-dropdown.html"
typeahead="service as service.name for service in getList('service', $viewValue)"
placeholder="{{ 'create.ticket.affected.business.services.placeholder' | i18n }}"
class="custom-input">
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
title="{{'common.button.clear' | i18n}} {{ 'create.ticket.affected.business.services' | i18n }}" ng-if="workorder.selectedService"
focus-input-on-clear ng-click="clearSelectedService()" ng-enter="clearSelectedService()">
</i>
</div>
</label>
</div>
</div>
<div class="row">
<div class="col-sm-6 create-ticket__section">
<div class="create-ticket__date">
<label class="label_control-wrap">
<div id="scheduledStart" class="label__text"
potentially-required-field
field-name="scheduledStartDate"
entity="workorder">
{{ 'create.ticket.scheduled.start.time' | i18n }}
</div>
<div class="create-ticket__date-time-item">
<div class="custom-field__date">
<input type="text"
title="{{'common.label.date' | i18n}}"
class="form-control"
name="scheduledStartDate"
datepicker-popup="mediumDate"
ng-model="workorder.scheduledStartDate"
is-open="workorder.scheduledStartDatePicker.open"
show-button-bar="false"
ng-click="openDatePicker(workorder.scheduledStartDatePicker, $event)"
ng-enter="openDatePicker(workorder.scheduledStartDatePicker)"
datepicker-options="datePickerOptions"
ng-change="updateDateTime('scheduled')"
potentially-required-field
field-name="scheduledStartDate"
entity="workorder"
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">
<div class="dropdown timepicker">
<div class="dropdown-toggle">
<input class="form-control custom-field__time-input" type="text" value="{{ workorder.scheduledStartTime | date: 'shortTime' }}"
ng-disabled="!workorder.scheduledStartDate" title="{{'common.label.time' | i18n}}"
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="workorder.scheduledStartTime">
<timepicker ng-model="workorder.scheduledStartTime"
ng-change="updateDateTime('scheduled')"
show-meridian="showMeridian">
</timepicker>
</div>
</div>
</div>
</div>
</label>
</div>
<div class="create-ticket__date">
<label class="label_control-wrap">
<div id="scheduledEnd" class="label__text"
potentially-required-field
field-name="scheduledEndDate"
entity="workorder">
{{ 'create.ticket.scheduled.end.time' | i18n }}
</div>
<div class="create-ticket__date-time-item">
<div class="custom-field__date">
<input type="text"
title="{{'common.label.date' | i18n}}"
class="form-control"
name="scheduledEndDate"
datepicker-popup="mediumDate"
ng-model="workorder.scheduledEndDate"
is-open="workorder.scheduledEndDatePicker.open"
show-button-bar="false"
ng-click="openDatePicker(workorder.scheduledEndDatePicker, $event)"
ng-enter="openDatePicker(workorder.scheduledEndDatePicker)"
datepicker-options="datePickerOptions"
ng-change="updateDateTime('scheduled')"
potentially-required-field
field-name="scheduledEndDate"
entity="workorder"
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">
<div class="dropdown timepicker">
<div class="dropdown-toggle">
<input class="form-control custom-field__time-input" type="text" value="{{ workorder.scheduledEndTime | date: 'shortTime' }}"
ng-disabled="!workorder.scheduledEndDate" 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="workorder.scheduledEndTime">
<timepicker ng-model="workorder.scheduledEndTime"
ng-change="updateDateTime('scheduled')"
show-meridian="showMeridian">
</timepicker>
</div>
</div>
</div>
</div>
</label>
</div>
</div>
<div class="col-sm-6 create-ticket__section">
<div class="create-ticket__date">
<label class="label_control-wrap">
<div id="actualStart" class="label__text"
potentially-required-field
field-name="actualStartDate"
entity="workorder">
{{ 'create.ticket.actual.start.time' | i18n }}
</div>
<div class="create-ticket__date-time-item">
<div class="custom-field__date">
<input type="text"
title="{{'common.label.date' | i18n}}"
class="form-control"
name="actualStartDate"
datepicker-popup="mediumDate"
ng-model="workorder.actualStartDate"
is-open="workorder.actualStartDatePicker.open"
show-button-bar="false"
ng-click="openDatePicker(workorder.actualStartDatePicker, $event)"
ng-enter="openDatePicker(workorder.actualStartDatePicker)"
datepicker-options="datePickerOptions"
ng-change="updateDateTime('actual')"
potentially-required-field
field-name="actualStartDate"
entity="workorder"
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">
<div class="dropdown timepicker">
<div class="dropdown-toggle">
<input class="form-control custom-field__time-input" type="text" value="{{ workorder.actualStartTime | date: 'shortTime' }}"
ng-disabled="!workorder.actualStartDate" 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="workorder.actualStartTime">
<timepicker ng-model="workorder.actualStartTime"
ng-change="updateDateTime('actual')"
show-meridian="showMeridian">
</timepicker>
</div>
</div>
</div>
</div>
</label>
</div>
<div class="create-ticket__date">
<label class="label_control-wrap">
<div id="actualEnd" class="label__text"
potentially-required-field
field-name="actualEndDate"
entity="workorder">
{{ 'create.ticket.actual.end.time' | i18n }}
</div>
<div class="create-ticket__date-time-item">
<div class="custom-field__date">
<input type="text"
title="{{'common.label.date' | i18n}}"
class="form-control"
name="actualEndDate"
datepicker-popup="mediumDate"
ng-model="workorder.actualEndDate"
is-open="workorder.actualEndDatePicker.open"
show-button-bar="false"
ng-click="openDatePicker(workorder.actualEndDatePicker, $event)"
ng-enter="openDatePicker(workorder.actualEndDatePicker)"
datepicker-options="datePickerOptions"
ng-change="updateDateTime('actual')"
potentially-required-field
field-name="actualEndDate"
entity="workorder"
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">
<div class="dropdown timepicker">
<div class="dropdown-toggle">
<input class="form-control custom-field__time-input" type="text" value="{{ workorder.actualEndTime | date: 'shortTime' }}"
ng-disabled="!workorder.actualEndDate" 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="workorder.actualEndTime">
<timepicker ng-model="workorder.actualEndTime"
ng-change="updateDateTime('actual')"
show-meridian="showMeridian">
</timepicker>
</div>
</div>
</div>
</div>
</label>
</div>
</div>
</div>
</div>
<div class="col-sm-6 create-ticket__section">
<categories-editor ng-if="workorder.allCategories" entity="workorder" categories="workorder.allCategories" location-company="workorder.locationCompany" allow-location-company-edit="true"></categories-editor>
</div>
</div>
</div>
<div class="create-ticket__full-width-section" ng-if="workorder.dynamicFields.length">
<div class="row">
<div class="col-sm-12" ng-if="dynamicFields.length">
<dynamic-field-container ticket="workorder" fields="dynamicFields"></dynamic-field-container>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-12 create-ticket__section">
<div class="create-ticket__assignment">
<div class="ticket__label-small">
{{ 'create.ticket.assignee' | i18n }}
</div>
<div class="auto-assign__text" ng-if="workorder.autoAssignAssignee">
{{ 'create.ticket.auto.assign' | i18n }}
</div>
<div ng-if="!workorder.autoAssignAssignee">
<img ng-if="workorder.selectedAssignee.loginId" alt="{{workorder.selectedAssignee.fullName}}" class="ticket-assignee__thumbnail" imgplaceholder="user"
thumbnail-img="{{'data:' + workorder.selectedAssignee.thumbnailMime + ';base64,' + workorder.selectedAssignee.thumbnail}}" />
<span ng-if="!workorder.selectedAssignee.loginId" class="ticket-assignee__none icon-question_circle"></span>
<div class="ticket-assignee__info">
<div class="ticket__label-small">{{'common.labels.assignedTo' | i18n }}:</div>
<span ng-if="!workorder.selectedAssignee.loginId" class="ticket__field-value">{{'common.label.noneYet' | i18n }}</span>
<span ng-if="workorder.selectedAssignee.loginId" class="ticket__field-value">{{workorder.selectedAssignee.fullName}}</span>
</div>
<div class="ticket-assignee__support-group">
<div class="ticket__label-small">{{'common.labels.supportGroup' | i18n}}:</div>
<span class="ticket__field-value">{{ workorder.selectedGroup.name || ('common.label.noneYet' | i18n ) }}</span>
</div>
</div>
<div class="ticket-assignee__action" ng-click="assignToMe($event, 'ticketassignee')" ng-enter="assignToMe($event, 'ticketassignee')"
ng-if="availableForAssignment && workorder.selectedAssignee.id !== loggedInUserId">
<i class="icon-user_plus"></i>
<a aria-label="{{'common.labels.assignToMe' | i18n}} {{'common.aria.labels.assignToMeAsAssignee' | i18n}}" href="">
{{'common.labels.assignToMe' | i18n }}
</a>
</div>
</div>
<div class="create-ticket__assignment">
<div class="ticket__label-small">
{{ 'create.workorder.requestmanager' | i18n }}
</div>
<div class="auto-assign__text" ng-if="workorder.autoAssignManager">
{{ 'create.ticket.auto.assign' | i18n }}
</div>
<div ng-if="!workorder.autoAssignManager">
<img ng-if="workorder.selectedManager.loginId" alt="{{workorder.selectedManager.fullName}}" class="ticket-assignee__thumbnail" imgplaceholder="user"
thumbnail-img="{{'data:' + workorder.selectedManager.thumbnailMime + ';base64,' + workorder.selectedManager.thumbnail}}" />
<span ng-if="!workorder.selectedManager.loginId" class="ticket-assignee__none icon-question_circle"></span>
<div class="ticket-assignee__info">
<div class="ticket__label-small">{{'common.labels.assignedTo' | i18n }}:</div>
<span ng-if="!workorder.selectedManager.loginId" class="ticket__field-value">{{'common.label.noneYet' | i18n }}</span>
<span ng-if="workorder.selectedManager.loginId" class="ticket__field-value">{{workorder.selectedManager.fullName}}</span>
</div>
<div class="ticket-assignee__support-group">
<div class="ticket__label-small">{{'common.labels.supportGroup' | i18n}}:</div>
<span class="ticket__field-value">{{ workorder.selectedManagerGroup.name || ('common.label.noneYet' | i18n ) }}</span>
</div>
</div>
<div class="ticket-assignee__action" ng-click="assignToMe($event, 'workordermanager')" ng-enter="assignToMe($event, 'workordermanager')"
ng-if="availableForAssignment && workorder.selectedManager.id !== loggedInUserId">
<i class="icon-user_plus"></i>
<a aria-label="{{'common.labels.assignToMe' | i18n}} {{'common.aria.labels.assignToMeAsManager' | i18n}}" href="">
{{'common.labels.assignToMe' | i18n }}
</a>
</div>
</div>
<div class="create-ticket__assignment">
<button type="button" class="btn_primary ticket-template__assignment-btn" ng-click="assign($event)">{{ 'create.ticket.assignment' | i18n }}</button>
</div>
</div>
</div>
</div>
<div class="create-ticket__full-width-section">
<div class="row">
<div class="col-sm-12">
<custom-field-container ticket="workorder" fields="customFields"></custom-field-container>
</div>
</div>
</div>
</form>
</div>
</div>
<div class="create-ticket__action-panel">
<span class="create-ticket__form_invalid" ng-if="createWorkorderForm.$invalid">
<i class="icon-exclamation_triangle"></i>
<span ng-if="createWorkorderForm.$error.required.length">{{createWorkorderForm.$error.required.length}} {{ 'create.ticket.more.required.fields' | i18n }}</span>
<span ng-if="createWorkorderForm.scheduledStartDate.$invalid && createWorkorderForm.scheduledStartDate.$dirty">{{'create.ticket.invalid.scheduled-start-date'|i18n}}</span>
<span ng-if="createWorkorderForm.scheduledEndDate.$invalid && createWorkorderForm.scheduledEndDate.$dirty">{{'create.ticket.invalid.scheduled-end-date'|i18n}}</span>
<span ng-if="createWorkorderForm.actualStartDate.$invalid && createWorkorderForm.actualStartDate.$dirty">{{'create.ticket.invalid.actual-start-date'|i18n}}</span>
<span ng-if="createWorkorderForm.actualEndDate.$invalid && createWorkorderForm.actualEndDate.$dirty">{{'create.ticket.invalid.actual-end-date'|i18n}}</span>
<span ng-if="formContainsInvalidFields(createWorkorderForm) &&
(createWorkorderForm.scheduledStartDate.$invalid && createWorkorderForm.scheduledStartDate.$dirty ||
createWorkorderForm.scheduledEndDate.$invalid && createWorkorderForm.scheduledEndDate.$dirty ||
createWorkorderForm.actualStartDate.$invalid && createWorkorderForm.actualStartDate.$dirty ||
createWorkorderForm.actualEndDate.$invalid && createWorkorderForm.actualEndDate.$dirty)">{{ 'create.ticket.invalid.fields' | i18n }}</span>
</span>
<span class="font-size-m" ng-if="createWorkorderForm.$valid">
<i class="icon-check"></i>
{{ 'create.ticket.all.required.fields.complete' | i18n }}
</span>
<div class="pull-right">
<button type="submit" class="btn_primary create-ticket__action-btn" ng-disabled="createWorkorderForm.$invalid || state.dataIsLoading" ng-click="createWorkOrder()">
{{ 'common.button.save' | i18n }}
</button>
<button type="button" class="btn_secondary action-panel__cancel-btn" ng-disabled="state.dataIsLoading" ng-click="cancel()">
{{ 'common.button.cancel' | i18n }}
</button>
</div>
</div>
</div>