You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
148 lines
4.8 KiB
148 lines
4.8 KiB
<div class="section gf-form-group"> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> |
|
Name |
|
</label> |
|
<input |
|
type="text" class="gf-form-input width-12" |
|
ng-model="analyticUnit.name" |
|
ng-blur="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
> |
|
</div> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> Type </label> |
|
<div class="gf-form-select-wrapper"> |
|
<select class="gf-form-input width-12" |
|
ng-model="analyticUnit.type" |
|
ng-options="type.value as type.name for type in ctrl.analyticUnitTypes[analyticUnit.detectorType]" |
|
ng-disabled="true" |
|
></select> |
|
</div> |
|
</div> |
|
</div> |
|
|
|
<div class="section gf-form-group"> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> Positive Color </label> |
|
<label class="gf-form-label"> |
|
<color-picker |
|
color="analyticUnit.labeledColor" |
|
onChange="ctrl.onColorChange.bind(ctrl, analyticUnit.id, false)" |
|
></color-picker> |
|
</label> |
|
</div> |
|
|
|
<div class="gf-form" |
|
ng-if="analyticUnit.detectorType === 'pattern' || analyticUnit.detectorType === 'anomaly'" |
|
> |
|
<label class="gf-form-label query-keyword width-6"> Negative Color </label> |
|
<label class="gf-form-label"> |
|
<color-picker |
|
color="analyticUnit.deletedColor" |
|
onChange="ctrl.onColorChange.bind(ctrl, analyticUnit.id, true)" |
|
></color-picker> |
|
</label> |
|
</div> |
|
</div> |
|
|
|
<div class="section gf-form-group" ng-if="analyticUnit.detectorType === 'threshold'"> |
|
<!-- TODO: move analytic-unit-specific fields rendering to class --> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> Condition </label> |
|
<select class="gf-form-input" |
|
ng-class="{ |
|
'width-5': analyticUnit.condition !== 'NO_DATA', |
|
'width-9': analyticUnit.condition === 'NO_DATA' |
|
}" |
|
ng-model="analyticUnit.condition" |
|
ng-options="type for type in ctrl.analyticsController.conditions" |
|
ng-change="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
></select> |
|
<input class="gf-form-input" |
|
ng-if="analyticUnit.condition !== 'NO_DATA'" |
|
type="number" |
|
ng-model="analyticUnit.value" |
|
ng-blur="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
/> |
|
</div> |
|
</div> |
|
|
|
<div class="section gf-form-group" ng-if="analyticUnit.detectorType === 'anomaly'"> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> |
|
Alpha |
|
|
|
<i class="fa fa-info" bs-tooltip="'Takes value from 0 to 1. Less Alpha means smoother bounds'"></i> |
|
</label> |
|
<input class="gf-form-input width-12" |
|
min="0" |
|
max="1" |
|
type="number" |
|
ng-model="analyticUnit.alpha" |
|
ng-blur="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
/> |
|
</div> |
|
|
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword width-6"> |
|
Сonfidence |
|
|
|
<i class="fa fa-info" bs-tooltip="'Bounds for the metric'"></i> |
|
</label> |
|
<input class="gf-form-input width-12" |
|
min="0" |
|
type="number" |
|
ng-model="analyticUnit.confidence" |
|
ng-blur="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
/> |
|
</div> |
|
|
|
</div> |
|
|
|
<div class="section gf-form-group" ng-if="analyticUnit.detectorType === 'anomaly'"> |
|
<div class="gf-form"> |
|
<gf-form-switch |
|
class="gf-form" |
|
label="Seasonality" |
|
label-class="query-keyword" |
|
on-change="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
checked="analyticUnit.hasSeasonality" |
|
></gf-form-switch> |
|
</div> |
|
|
|
<div class="gf-form" ng-if="analyticUnit.hasSeasonality"> |
|
<label class="gf-form-label query-keyword"> Seasonality Period </label> |
|
<input |
|
type="number" class="gf-form-input" |
|
ng-init="seasonalityValue = analyticUnit.seasonalityPeriod.value" |
|
ng-model="seasonalityValue" |
|
ng-blur="ctrl.onSeasonalityChange(analyticUnit.id, seasonalityValue)" |
|
min="0" |
|
> |
|
</div> |
|
|
|
<div class="gf-form" ng-if="analyticUnit.hasSeasonality"> |
|
<div class="gf-form-select-wrapper"> |
|
<!-- TODO: move periods from ng-options --> |
|
<select class="gf-form-input" |
|
ng-model="analyticUnit.seasonalityPeriod.unit" |
|
ng-change="ctrl.onSeasonalityChange(analyticUnit.id)" |
|
ng-options="type for type in ['seconds', 'minutes', 'hours', 'days', 'years']" |
|
></select> |
|
</div> |
|
</div> |
|
|
|
</div> |
|
|
|
<div class="section gf-form-group" ng-if="analyticUnit.detectorType === 'anomaly'"> |
|
<div class="gf-form"> |
|
<label class="gf-form-label query-keyword"> Enabled bounds </label> |
|
<div class="gf-form-select-wrapper"> |
|
<select class="gf-form-input" |
|
ng-model="analyticUnit.enableBounds" |
|
ng-change="ctrl.onAnalyticUnitChange(analyticUnit)" |
|
ng-options="bound.value as bound.name for bound in ctrl.boundTypes" |
|
></select> |
|
</div> |
|
</div> |
|
</div>
|
|
|