eagle-server/src/main/webapp/app/dev/partials/alert/policyEdit.html

<!--
  Licensed to the Apache Software Foundation (ASF) under one
  or more contributor license agreements.  See the NOTICE file
  distributed with this work for additional information
  regarding copyright ownership.  The ASF licenses this file
  to you under the Apache License, Version 2.0 (the
  "License"); you may not use this file except in compliance
  with the License.  You may obtain a copy of the License at

      http://www.apache.org/licenses/LICENSE-2.0

  Unless required by applicable law or agreed to in writing, software
  distributed under the License is distributed on an "AS IS" BASIS,
  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  See the License for the specific language governing permissions and
  limitations under the License.
  -->

<div class="box-body">
	<ul class="timeline">
		<!-- Base Info -->
		<li class="time-label">
			<span class="bg-blue">#1. Basic Information</span>
		</li>
		<li>
			<span class="fa fa-file-text bg-aqua"></span>
			<div class="timeline-item">
				<div class="timeline-body">
					<div class="form-group">
						<label>Policy Name</label>
						<input type="text" class="form-control" ng-model="policy.name" ng-readonly="!newPolicy" />
					</div>
					<div class="form-group">
						<label>Description <small class="text-muted">[Optional]</small></label>
						<textarea class="form-control" ng-model="policy.description" rows="3"></textarea>
					</div>
				</div>
			</div>
		</li>

		<!-- Alert Stream -->
		<li class="time-label" ng-class="{disabled: !checkBasicInfo()}">
			<span class="bg-blue">#2. Alert Stream</span>
		</li>
		<li ng-class="{disabled: !checkBasicInfo()}">
			<span class="fa fa-rocket bg-aqua"></span>
			<div class="timeline-item">
				<div class="timeline-body">
					<label>Input Stream</label>
					<ul class="list-unstyled with-margin">
						<li ng-repeat="stream in policy.inputStreams track by $index">
							[<a class="fa fa-times" ng-click="removeStream(stream)"></a>] {{stream}}
						</li>
						<li ng-if="policy.inputStreams.length === 0"><span class="fa fa-ban"></span> (empty list)</li>
					</ul>

					<div class="inner-block">
						<div class="form-group">
							<label>Application</label>
							<select class="form-control" ng-model="selectedApplication" ng-change="refreshStreamSelect()">
								<option ng-repeat="(app, list) in applications track by $index" value="{{app}}">
									{{app}}
								</option>
							</select>
						</div>
						<div class="form-group">
							<label>Stream</label>
							<select class="form-control" ng-model="selectedStream">
								<option ng-repeat="stream in applications[selectedApplication] track by $index" value="{{stream.streamId}}">
									[{{stream.siteId}}]
									{{stream.streamId}}
									{{checkAddStream(stream.streamId) ? '' : '(Already Added)'}}
								</option>
							</select>
						</div>
						<button class="btn btn-success" ng-click="addStream()" ng-disabled="!checkAddStream(selectedStream)">
							<span class="fa fa-plus"></span> Add Stream
						</button>
					</div>


					<label>Output Stream</label>
					<ul class="list-unstyled with-margin">
						<li ng-repeat="stream in policy.outputStreams track by $index">
							[<a class="fa fa-times" ng-click="removeOutputStream(stream)"></a>] {{stream}}
						</li>
						<li ng-if="policy.outputStreams.length === 0"><span class="fa fa-ban"></span> (empty list)</li>
					</ul>
					<div class="inner-block">
						<div class="form-group">
							<input type="text" class="form-control" ng-model="outputStream" />
						</div>
						<button class="btn btn-success" ng-click="addOutputStream()" ng-disabled="!checkAddOutputStream()">
							<span class="fa fa-plus"></span> Add Stream
						</button>
					</div>
				</div>
			</div>
		</li>

		<!-- Definition -->
		<li class="time-label" ng-class="{disabled: !checkAlertStream()}">
			<span class="bg-blue">#3. Definition</span>
		</li>
		<li ng-class="{disabled: !checkAlertStream()}">
			<span class="fa fa-pencil bg-aqua"></span>
			<div class="timeline-item">
				<div class="timeline-body">
					<div class="form-group">
						<label>Definition</label>
						<textarea class="form-control" ng-model="policy.definition.value" rows="8"></textarea>
					</div>

					<div class="form-group" ng-class="{'has-warning': !checkNumber(policy.parallelismHint)}">
						<label>
							Parallelism Hint
							<small class="text-muted" ng-if="!checkNumber(policy.parallelismHint)">- Number Only</small>
						</label>
						<input type="number" class="form-control" ng-model="policy.parallelismHint" />
					</div>

					<label>Partition <small class="text-muted">[Optional]</small></label>
					<ul class="list-unstyled with-margin">
						<li ng-repeat="partition in policy.partitionSpec track by $index">
							[<a class="fa fa-times" ng-click="removePartition(partition)"></a>]
							[<span class="text-primary">{{partition.type}}</span>]
							{{partition.streamId}}:
							<strong class="text-success">{{partition.columns.join(", ")}}</strong>
						</li>
						<li ng-if="policy.partitionSpec.length === 0"><span class="fa fa-ban"></span> (empty list)</li>
					</ul>

					<div class="inner-block">
						<div class="form-group">
							<label>Stream</label>
							<select class="form-control" ng-model="partitionStream">
								<option ng-repeat="stream in policy.inputStreams track by $index" value="{{stream}}">
									{{stream}}
								</option>
							</select>
						</div>
						<div class="form-group">
							<label>Type</label>
							<select class="form-control" ng-model="partitionType">
								<option>GROUPBY</option>
								<option>GLOBAL</option>
								<option>SHUFFLE</option>
							</select>
						</div>
						<div class="form-group">
							<label>Columns</label>
							<div>
								<label class="checkbox-inline" ng-repeat="column in getPartitionColumns() track by $index">
									<input type="checkbox"
										   ng-checked="partitionColumns[column.name]"
										   ng-click="partitionColumns[column.name] = !partitionColumns[column.name]"
									/>{{column.name}}
								</label>
							</div>
						</div>

						<button class="btn btn-success" ng-click="addPartition()" ng-disabled="!checkAddPartition()">
							<span class="fa fa-plus"></span> Add Partition
						</button>
					</div>
				</div>
			</div>
		</li>

		<!-- Publisher Configuration -->
		<li class="time-label" ng-class="{disabled: !checkDefinition()}">
			<span class="bg-blue">#4. Publisher Configuration</span>
		</li>
		<li ng-class="{disabled: !checkDefinition()}">
			<span class="fa fa-envelope bg-aqua"></span>
			<div class="timeline-item">
				<div class="timeline-body">
					<label>Publisher</label>
					<ul class="list-unstyled with-margin block-list">
						<li ng-repeat="publisher in publisherList track by publisher.name">
							<a class="pull-right fa fa-times" ng-click="removePublisher(publisher)"></a>
							<p>
								<strong>Name:</strong>
								{{publisher.name}}
							</p>
							<p>
								<strong>Type:</strong>
								{{publisher.type}}
							</p>
							<p>
								<strong>DeDup-Interval Min:</strong>
								{{publisher.dedupIntervalMin}}
							</p>
							<p ng-repeat="field in publisherTypes[publisher.type] track by $index">
								<strong>{{field}}:</strong>
								{{publisher.properties[field]}}
							</p>
						</li>
						<li ng-if="publisherList.length === 0" class="no-decorate"><span class="fa fa-ban"></span> (empty list)</li>
					</ul>

					<div class="inner-block">
						<div class="form-group">
							<label>Name</label>
							<input type="text" class="form-control" ng-model="publisher.name" />
						</div>
						<div class="form-group">
							<label>DeDup-Interval Min</label>
							<input type="text" class="form-control" ng-model="publisher.dedupIntervalMin" />
						</div>
						<div class="form-group">
							<label>Type</label>
							<select class="form-control" ng-model="publisherType">
								<option ng-repeat="(type, fields) in publisherTypes track by $index"
										value="{{type}}">{{type}}</option>
							</select>
						</div>
						<div class="form-group" ng-repeat="field in publisherTypes[publisherType] track by $index">
							<label>{{field}}</label>
							<input type="text" class="form-control" ng-model="publisherProps[field]" />
						</div>
						<button class="btn btn-success" ng-click="addPublisher()" ng-disabled="!checkAddPublisher()">
							<span class="fa fa-plus"></span> Add Publisher
						</button>
					</div>
				</div>
			</div>
		</li>
	</ul>

	<pre class="hide">{{policy | json : "\t"}}</pre>
</div>

<div class="box-footer text-right">
	<button class="btn btn-primary" ng-disabled="!checkDefinition() || policyLock" ng-click="createPolicy()">
		{{newPolicy ? 'New' : 'Update'}} Policy
	</button>
</div>