285 lines
12 KiB
HTML
285 lines
12 KiB
HTML
<div class="create-broadcast clearfix">
|
|
<div class="create-form-wrapper">
|
|
<div loading-spinner class="create-ticket__loading-spinner" if="state.dataIsLoading" centered="true" overlay="true"></div>
|
|
|
|
<div class="create-ticket__header">
|
|
<h3 class="create-ticket__header-title">{{ 'create.broadcast.header' | i18n }}</h3>
|
|
<span>{{ 'create.broadcast.sub.header' | i18n }}</span>
|
|
</div>
|
|
|
|
<form name="createBroadcastForm" novalidate>
|
|
|
|
<div class="create-ticket__full-width-section">
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="create-ticket__section">
|
|
<label class="label_control-wrap">
|
|
<span class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.audience' | i18n }}
|
|
</span>
|
|
|
|
<div class="create-ticket__person-item">
|
|
<input type="text"
|
|
aria-required="true"
|
|
title="{{ 'create.broadcast.audience' | i18n }}"
|
|
class="custom-input"
|
|
name="audience"
|
|
ng-model="broadcast.audience"
|
|
prevent-click-event
|
|
uib-tooltip="{{'search.category.exceedsChunkSize' | i18n}}"
|
|
tooltip-is-open="state.isAudienceTooltipOpen"
|
|
tooltip-enable="state.exceedsAudienceChunkSize"
|
|
tooltip-trigger="'none'"
|
|
tooltip-placement="'top'"
|
|
ng-blur="closeTooltip()"
|
|
typeahead-min-length="3"
|
|
typeahead-template-url="views/create/custom-add-audience-dropdown.html"
|
|
typeahead="audience as audience.name for audience in getList('broadcastAudience', $viewValue)"
|
|
typeahead-wait-ms="500"
|
|
typeahead-loading="state.audienceIsLoading"
|
|
placeholder="{{ 'create.broadcast.audience.placeholder' | i18n }}"
|
|
required auto-focus>
|
|
|
|
<div class="select-custom-dropdown__spinner-container">
|
|
<loading-spinner if="state.audienceIsLoading" inline="true"></loading-spinner>
|
|
</div>
|
|
<i class="icon-cross item-input__delete-btn" tabindex=0 role="link"
|
|
title="{{'common.button.clear' | i18n}} {{ 'create.broadcast.audience' | i18n }}" ng-if="broadcast.audience && !state.audienceIsLoading"
|
|
focus-input-on-clear ng-click="clearAudience()" ng-enter="clearAudience()">
|
|
</i>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
|
|
<div class="create-ticket__section clearfix">
|
|
<label class="label_control-wrap">
|
|
<span class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.title' | i18n }}
|
|
</span>
|
|
|
|
<div class="create-ticket__item">
|
|
<input type="text"
|
|
aria-required="true"
|
|
title="{{ 'create.broadcast.title' | i18n }}"
|
|
class="custom-input"
|
|
name="title"
|
|
ng-model="broadcast.title"
|
|
prevent-click-event
|
|
placeholder="{{ 'create.broadcast.title.placeholder' | i18n }}"
|
|
maxlength="100"
|
|
required />
|
|
<character-limit-message field="broadcast.title" 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 required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.ticket.priority' | i18n }}
|
|
</span>
|
|
|
|
<div class="create-ticket__item">
|
|
<selection selection-items="broadcastMetadata.priorities"
|
|
selected-item="broadcast.priority"
|
|
title-text="{{'create.ticket.priority' | i18n}}"
|
|
label="label"
|
|
value="label"
|
|
aria-required="true"
|
|
update-selected-item="true">
|
|
</selection>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<div class="create-ticket__section">
|
|
<label class="label_control-wrap">
|
|
<span class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.type' | i18n }}
|
|
</span>
|
|
|
|
<div class="create-ticket__item">
|
|
<selection selection-items="broadcastMetadata.types"
|
|
selected-item="broadcast.broadcastType"
|
|
title-text="{{'create.broadcast.type' | i18n}}"
|
|
label="label"
|
|
value="label"
|
|
aria-required="true"
|
|
update-selected-item="true">
|
|
</selection>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="col-sm-6">
|
|
<div class="create-ticket__section">
|
|
<label class="label_control-wrap">
|
|
<span class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.visibility' | i18n }}
|
|
</span>
|
|
|
|
<div class="create-ticket__item ">
|
|
<selection selection-items="broadcastMetadata.visibilities"
|
|
selected-item="broadcast.visibility"
|
|
title-text="{{'create.broadcast.visibility' | i18n}}"
|
|
label="label"
|
|
value="label"
|
|
aria-required="true"
|
|
update-selected-item="true">
|
|
</selection>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</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="startDate" class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.start.date' | 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="broadcastStartDate"
|
|
datepicker-popup="mediumDate"
|
|
aria-labelledby="startDate"
|
|
ng-model="broadcast.broadcastStartDate"
|
|
is-open="broadcast.broadcastStartDatePicker.open"
|
|
ng-click="openDatePicker(broadcast.broadcastStartDatePicker, $event)"
|
|
ng-enter="openDatePicker(broadcast.broadcastStartDatePicker)"
|
|
datepicker-options="datePickerOptions"
|
|
show-button-bar="false"
|
|
ng-change="updateDateTime('broadcastStart')"
|
|
aria-required="true"
|
|
required />
|
|
<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="{{ broadcast.broadcastStartTime | date: 'shortTime' }}"
|
|
ng-disabled="!broadcast.broadcastStartTime" title="{{'common.label.time' | i18n}}" aria-labelledby="startDate" readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="broadcast.broadcastStartTime">
|
|
<timepicker ng-model="broadcast.broadcastStartTime"
|
|
ng-change="updateDateTime()"
|
|
name="broadcastStartTime"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</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="endDate" class="label__text required__label" data-required="{{'common.label.required.bracketed' | i18n}}">
|
|
{{ 'create.broadcast.end.date' | 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="broadcastEndDate"
|
|
datepicker-popup="mediumDate"
|
|
ng-model="broadcast.broadcastEndDate"
|
|
is-open="broadcast.broadcastEndDatePicker.open"
|
|
ng-click="openDatePicker(broadcast.broadcastEndDatePicker, $event)"
|
|
ng-enter="openDatePicker(broadcast.broadcastEndDatePicker)"
|
|
datepicker-options="datePickerOptions"
|
|
show-button-bar="false"
|
|
ng-change="updateDateTime('broadcastEnd')"
|
|
aria-required="true"
|
|
aria-labelledby="endDate"
|
|
required />
|
|
<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="{{ broadcast.broadcastEndTime | date: 'shortTime' }}"
|
|
ng-disabled="!broadcast.broadcastEndTime" title="{{'common.label.time' | i18n}}" aria-labelledby="endDate" readonly="readonly" />
|
|
<i class="icon-clock_o custom-field__time-icon"></i>
|
|
</div>
|
|
<div class="dropdown-menu" prevent-click-event ng-if="broadcast.broadcastEndTime">
|
|
<timepicker ng-model="broadcast.broadcastEndTime"
|
|
ng-change="updateDateTime()"
|
|
name="broadcastEndTime"
|
|
show-meridian="showMeridian"
|
|
default-hours="12"
|
|
default-minutes="0">
|
|
</timepicker>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-sm-6 create-ticket__section">
|
|
<div class="create-ticket__item">
|
|
<edit-summary is-desc-required="true" ticket="broadcast" context="'create'" desc-limit="255" attachment="true" attachment-limit="1" textplaceholder="'create.broadcast.message.placeholder' | i18n" label="{{'create.broadcast.message' | i18n}}"></edit-summary>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="create-ticket__action-panel">
|
|
<span class="create-ticket__form_invalid" ng-if="createBroadcastForm.$invalid">
|
|
<i class="icon-exclamation_triangle"></i>
|
|
<span ng-if="createBroadcastForm.$error.required.length">{{createBroadcastForm.$error.required.length}} {{ 'create.ticket.more.required.fields' | i18n }}</span>
|
|
<span ng-if="createBroadcastForm.audience.$invalid && createBroadcastForm.audience.$viewValue">{{'create.broadcast.invalid.audience'|i18n}}</span>
|
|
<span ng-if="createBroadcastForm.broadcastStartDate.$invalid && createBroadcastForm.broadcastStartDate.$viewValue">{{'create.broadcast.invalid.start-date'|i18n}}</span>
|
|
<span ng-if="createBroadcastForm.broadcastEndDate.$invalid && createBroadcastForm.broadcastEndDate.$viewValue">{{'create.broadcast.invalid.end-date'|i18n}}</span>
|
|
<span ng-if="formContainsInvalidFields(createBroadcastForm)">{{ 'create.ticket.invalid.fields' | i18n }}</span>
|
|
</span>
|
|
<span class="font-size-m" ng-if="createBroadcastForm.$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="createBroadcastForm.$invalid || state.dataIsLoading" ng-click="createBroadcast()">
|
|
{{ '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>
|
|
|
|
|
|
|