add support for flexible entity dataKeys order (timeseries mixed with attributes in arbitrary way) in the widget config
This commit is contained in:
pgrisu
parent
e157f76fcf
commit
76e5aa24fa
@ -50,11 +50,8 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
scope.alarmFields.push(alarmField);
|
||||
}
|
||||
|
||||
scope.selectedTimeseriesDataKey = null;
|
||||
scope.timeseriesDataKeySearchText = null;
|
||||
|
||||
scope.selectedAttributeDataKey = null;
|
||||
scope.attributeDataKeySearchText = null;
|
||||
scope.selectedDataKey = null;
|
||||
scope.dataKeySearchText = null;
|
||||
|
||||
scope.selectedAlarmDataKey = null;
|
||||
scope.alarmDataKeySearchText = null;
|
||||
@ -92,11 +89,7 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
}
|
||||
});
|
||||
|
||||
scope.$watch('timeseriesDataKeys', function () {
|
||||
updateDataKeys();
|
||||
}, true);
|
||||
|
||||
scope.$watch('attributeDataKeys', function () {
|
||||
scope.$watch('dataKeys', function () {
|
||||
updateDataKeys();
|
||||
}, true);
|
||||
|
||||
@ -107,10 +100,9 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
function updateDataKeys() {
|
||||
if (ngModelCtrl.$viewValue) {
|
||||
var dataKeys = [];
|
||||
dataKeys = dataKeys.concat(scope.timeseriesDataKeys);
|
||||
dataKeys = dataKeys.concat(scope.attributeDataKeys);
|
||||
dataKeys = dataKeys.concat(scope.dataKeys);
|
||||
dataKeys = dataKeys.concat(scope.alarmDataKeys);
|
||||
if (ngModelCtrl.$viewValue.dataKeys != dataKeys)
|
||||
if (!angular.equals(ngModelCtrl.$viewValue.dataKeys, dataKeys))
|
||||
{
|
||||
ngModelCtrl.$setDirty();
|
||||
ngModelCtrl.$viewValue.dataKeys = dataKeys;
|
||||
@ -128,21 +120,17 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
} else {
|
||||
scope.entityAlias = null;
|
||||
}
|
||||
var timeseriesDataKeys = [];
|
||||
var attributeDataKeys = [];
|
||||
var dataKeys = [];
|
||||
var alarmDataKeys = [];
|
||||
for (var d in ngModelCtrl.$viewValue.dataKeys) {
|
||||
var dataKey = ngModelCtrl.$viewValue.dataKeys[d];
|
||||
if (dataKey.type === types.dataKeyType.timeseries) {
|
||||
timeseriesDataKeys.push(dataKey);
|
||||
} else if (dataKey.type === types.dataKeyType.attribute) {
|
||||
attributeDataKeys.push(dataKey);
|
||||
if ((dataKey.type === types.dataKeyType.timeseries) || (dataKey.type === types.dataKeyType.attribute)) {
|
||||
dataKeys.push(dataKey);
|
||||
} else if (dataKey.type === types.dataKeyType.alarm) {
|
||||
alarmDataKeys.push(dataKey);
|
||||
}
|
||||
}
|
||||
scope.timeseriesDataKeys = timeseriesDataKeys;
|
||||
scope.attributeDataKeys = attributeDataKeys;
|
||||
scope.dataKeys = dataKeys;
|
||||
scope.alarmDataKeys = alarmDataKeys;
|
||||
}
|
||||
};
|
||||
@ -152,30 +140,19 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
}
|
||||
|
||||
scope.selectedEntityAliasChange = function () {
|
||||
if (!scope.timeseriesDataKeySearchText || scope.timeseriesDataKeySearchText === '') {
|
||||
scope.timeseriesDataKeySearchText = scope.timeseriesDataKeySearchText === '' ? null : '';
|
||||
}
|
||||
if (!scope.attributeDataKeySearchText || scope.attributeDataKeySearchText === '') {
|
||||
scope.attributeDataKeySearchText = scope.attributeDataKeySearchText === '' ? null : '';
|
||||
if (!scope.dataKeySearchText || scope.dataKeySearchText === '') {
|
||||
scope.dataKeySearchText = scope.dataKeySearchText === '' ? null : '';
|
||||
}
|
||||
if (!scope.alarmDataKeySearchText || scope.alarmDataKeySearchText === '') {
|
||||
scope.alarmDataKeySearchText = scope.alarmDataKeySearchText === '' ? null : '';
|
||||
}
|
||||
};
|
||||
|
||||
scope.transformTimeseriesDataKeyChip = function (chip) {
|
||||
scope.transformDataKeyChip = function (chip) {
|
||||
if (scope.maxDataKeys > 0 && ngModelCtrl.$viewValue.dataKeys.length >= scope.maxDataKeys ) {
|
||||
return null;
|
||||
} else {
|
||||
return scope.generateDataKey({chip: chip, type: types.dataKeyType.timeseries});
|
||||
}
|
||||
};
|
||||
|
||||
scope.transformAttributeDataKeyChip = function (chip) {
|
||||
if (scope.maxDataKeys > 0 && ngModelCtrl.$viewValue.dataKeys.length >= scope.maxDataKeys ) {
|
||||
return null;
|
||||
} else {
|
||||
return scope.generateDataKey({chip: chip, type: types.dataKeyType.attribute});
|
||||
return scope.generateDataKey({chip: chip.name, type: chip.type});
|
||||
}
|
||||
};
|
||||
|
||||
@ -230,10 +207,8 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
w.triggerHandler('resize');
|
||||
}
|
||||
}).then(function (dataKey) {
|
||||
if (dataKey.type === types.dataKeyType.timeseries) {
|
||||
scope.timeseriesDataKeys[index] = dataKey;
|
||||
} else if (dataKey.type === types.dataKeyType.attribute) {
|
||||
scope.attributeDataKeys[index] = dataKey;
|
||||
if ((dataKey.type === types.dataKeyType.timeseries) || (dataKey.type === types.dataKeyType.attribute)) {
|
||||
scope.dataKeys[index] = dataKey;
|
||||
} else if (dataKey.type === types.dataKeyType.alarm) {
|
||||
scope.alarmDataKeys[index] = dataKey;
|
||||
}
|
||||
@ -242,7 +217,7 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
});
|
||||
};
|
||||
|
||||
scope.dataKeysSearch = function (searchText, type) {
|
||||
scope.dataKeysSearch = function (searchText) {
|
||||
if (scope.widgetType == types.widgetType.alarm.value) {
|
||||
var dataKeys = searchText ? scope.alarmFields.filter(
|
||||
scope.createFilterForDataKey(searchText)) : scope.alarmFields;
|
||||
@ -250,9 +225,25 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
} else {
|
||||
if (scope.entityAlias) {
|
||||
var deferred = $q.defer();
|
||||
scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: type})
|
||||
scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: types.dataKeyType.timeseries})
|
||||
.then(function (dataKeys) {
|
||||
deferred.resolve(dataKeys);
|
||||
var items = [];
|
||||
for (var i = 0; i < dataKeys.length; i++) {
|
||||
items.push({ name: dataKeys[i], type: types.dataKeyType.timeseries });
|
||||
}
|
||||
if (scope.widgetType == types.widgetType.latest.value) {
|
||||
scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: types.dataKeyType.attribute})
|
||||
.then(function (dataKeys) {
|
||||
for (var i = 0; i < dataKeys.length; i++) {
|
||||
items.push({ name: dataKeys[i], type: types.dataKeyType.attribute });
|
||||
}
|
||||
deferred.resolve(items);
|
||||
}, function (e) {
|
||||
deferred.reject(e);
|
||||
});
|
||||
}
|
||||
else
|
||||
deferred.resolve(items);
|
||||
}, function (e) {
|
||||
deferred.reject(e);
|
||||
});
|
||||
@ -270,13 +261,13 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
|
||||
};
|
||||
};
|
||||
|
||||
scope.createKey = function (event, chipsId) {
|
||||
scope.createKey = function (event, type, chipsId) {
|
||||
var chipsChild = $(chipsId, element)[0].firstElementChild;
|
||||
var el = angular.element(chipsChild);
|
||||
var chipBuffer = el.scope().$mdChipsCtrl.getChipBuffer();
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
el.scope().$mdChipsCtrl.appendChip(chipBuffer.trim());
|
||||
el.scope().$mdChipsCtrl.appendChip({ name: chipBuffer.trim(), type: type});
|
||||
el.scope().$mdChipsCtrl.resetChipBuffer();
|
||||
}
|
||||
|
||||
|
||||
@ -16,6 +16,7 @@
|
||||
@import "../../scss/constants";
|
||||
|
||||
.tb-entity-alias-autocomplete,
|
||||
.tb-datakey-autocomplete,
|
||||
.tb-timeseries-datakey-autocomplete,
|
||||
.tb-attribute-datakey-autocomplete,
|
||||
.tb-alarm-datakey-autocomplete {
|
||||
|
||||
@ -25,82 +25,39 @@
|
||||
<section flex layout='column'>
|
||||
<section flex layout='column' layout-align="center" style="padding-left: 4px;">
|
||||
<md-chips flex ng-if="widgetType != types.widgetType.alarm.value"
|
||||
id="timeseries_datakey_chips"
|
||||
ng-model="timeseriesDataKeys" md-autocomplete-snap
|
||||
md-transform-chip="transformTimeseriesDataKeyChip($chip)"
|
||||
md-require-match="false">
|
||||
<md-autocomplete
|
||||
md-no-cache="true"
|
||||
id="timeseries_datakey"
|
||||
md-selected-item="selectedTimeseriesDataKey"
|
||||
md-search-text="timeseriesDataKeySearchText"
|
||||
md-items="item in dataKeysSearch(timeseriesDataKeySearchText, types.dataKeyType.timeseries)"
|
||||
md-item-text="item.name"
|
||||
md-min-length="0"
|
||||
placeholder="{{'datakey.timeseries' | translate }}"
|
||||
md-menu-class="tb-timeseries-datakey-autocomplete">
|
||||
<span md-highlight-text="timeseriesDataKeySearchText" md-highlight-flags="^i">{{item}}</span>
|
||||
<md-not-found>
|
||||
<div class="tb-not-found">
|
||||
<div class="tb-no-entries" ng-if="!textIsNotEmpty(timeseriesDataKeySearchText)">
|
||||
<span translate>entity.no-keys-found</span>
|
||||
</div>
|
||||
<div ng-if="textIsNotEmpty(timeseriesDataKeySearchText)">
|
||||
<span translate translate-values='{ key: "{{timeseriesDataKeySearchText | truncate:true:6:'...'}}" }'>entity.no-key-matching</span>
|
||||
<span>
|
||||
<a translate ng-click="createKey($event, '#timeseries_datakey_chips')">entity.create-new-key</a>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</md-not-found>
|
||||
</md-autocomplete>
|
||||
<md-chip-template>
|
||||
<div layout="row" layout-align="start center" class="tb-attribute-chip">
|
||||
<div class="tb-color-preview" ng-click="showColorPicker($event, $chip, $index)" style="margin-right: 5px;">
|
||||
<div class="tb-color-result" ng-style="{background: $chip.color}"></div>
|
||||
</div>
|
||||
<div layout="row">
|
||||
<div class="tb-chip-label" tb-chip-draggable>
|
||||
{{$chip.label}}
|
||||
</div>
|
||||
<div class="tb-chip-separator">: </div>
|
||||
<div class="tb-chip-label">
|
||||
<strong ng-if="!$chip.postFuncBody">{{$chip.name}}</strong>
|
||||
<strong ng-if="$chip.postFuncBody">f({{$chip.name}})</strong>
|
||||
</div>
|
||||
</div>
|
||||
<md-button ng-click="editDataKey($event, $chip, $index)" class="md-icon-button tb-md-32">
|
||||
<md-icon aria-label="edit" class="material-icons tb-md-20">edit</md-icon>
|
||||
</md-button>
|
||||
</div>
|
||||
</md-chip-template>
|
||||
</md-chips>
|
||||
<md-chips flex ng-if="widgetType === types.widgetType.latest.value"
|
||||
id="attribute_datakey_chips"
|
||||
ng-model="attributeDataKeys" md-autocomplete-snap
|
||||
md-transform-chip="transformAttributeDataKeyChip($chip)"
|
||||
id="datakey_chips"
|
||||
ng-model="dataKeys" md-autocomplete-snap
|
||||
md-transform-chip="transformDataKeyChip($chip)"
|
||||
md-require-match="false">
|
||||
<md-autocomplete
|
||||
md-no-cache="true"
|
||||
id="attribute_datakey"
|
||||
md-selected-item="selectedAttributeDataKey"
|
||||
md-search-text="attributeDataKeySearchText"
|
||||
md-items="item in dataKeysSearch(attributeDataKeySearchText, types.dataKeyType.attribute)"
|
||||
id="datakey"
|
||||
md-selected-item="selectedDataKey"
|
||||
md-search-text="dataKeySearchText"
|
||||
md-items="item in dataKeysSearch(dataKeySearchText)"
|
||||
md-item-text="item.name"
|
||||
md-min-length="0"
|
||||
placeholder="{{'datakey.attributes' | translate }}"
|
||||
md-menu-class="tb-attribute-datakey-autocomplete">
|
||||
<span md-highlight-text="attributeDataKeySearchText" md-highlight-flags="^i">{{item}}</span>
|
||||
placeholder=""
|
||||
md-menu-class="tb-datakey-autocomplete">
|
||||
<span ng-show="item.type==types.dataKeyType.attribute"><ng-md-icon size="16" icon="perm_device_information"></ng-md-icon></span>
|
||||
<span ng-show="item.type==types.dataKeyType.timeseries"><ng-md-icon size="16" icon="timeline"></ng-md-icon></span>
|
||||
<span md-highlight-text="dataKeySearchText" md-highlight-flags="^i">{{item.name}}</span>
|
||||
<md-not-found>
|
||||
<div class="tb-not-found">
|
||||
<div class="tb-no-entries" ng-if="!textIsNotEmpty(attributeDataKeySearchText)">
|
||||
<div class="tb-no-entries" ng-if="!textIsNotEmpty(dataKeySearchText)">
|
||||
<span translate>entity.no-keys-found</span>
|
||||
</div>
|
||||
<div ng-if="textIsNotEmpty(attributeDataKeySearchText)">
|
||||
<span translate translate-values='{ key: "{{attributeDataKeySearchText | truncate:true:6:'...'}}" }'>entity.no-key-matching</span>
|
||||
<span>
|
||||
<a translate ng-click="createKey($event, '#attribute_datakey_chips')">entity.create-new-key</a>
|
||||
<div ng-if="textIsNotEmpty(dataKeySearchText)">
|
||||
<span translate translate-values='{ key: "{{dataKeySearchText | truncate:true:6:'...'}}" }'>entity.no-key-matching</span>
|
||||
<span>{{'entity.create-new-key' | translate }} </span>
|
||||
<span ng-show="widgetType == types.widgetType.latest.value">
|
||||
<md-tooltip>{{'datakey.attributes' | translate }}</md-tooltip>
|
||||
<ng-md-icon size="16" icon="perm_device_information" ng-click="createKey($event, types.dataKeyType.attribute, '#datakey_chips')"></ng-md-icon>
|
||||
</span>
|
||||
<span>
|
||||
<md-tooltip>{{'datakey.timeseries' | translate }}</md-tooltip>
|
||||
<ng-md-icon size="16" icon="timeline" ng-click="createKey($event, types.dataKeyType.timeseries, '#datakey_chips')"></ng-md-icon>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</md-not-found>
|
||||
@ -112,6 +69,14 @@
|
||||
</div>
|
||||
<div layout="row">
|
||||
<div class="tb-chip-label" tb-chip-draggable>
|
||||
<span ng-show="$chip.type==types.dataKeyType.attribute">
|
||||
<md-tooltip>{{'datakey.attributes' | translate }}</md-tooltip>
|
||||
<ng-md-icon size="20" icon="perm_device_information"></ng-md-icon>
|
||||
</span>
|
||||
<span ng-show="$chip.type==types.dataKeyType.timeseries">
|
||||
<md-tooltip>{{'datakey.timeseries' | translate }}</md-tooltip>
|
||||
<ng-md-icon size="20" icon="timeline"></ng-md-icon>
|
||||
</span>
|
||||
{{$chip.label}}
|
||||
</div>
|
||||
<div class="tb-chip-separator">: </div>
|
||||
@ -137,7 +102,7 @@
|
||||
id="alarm_datakey"
|
||||
md-selected-item="selectedAlarmDataKey"
|
||||
md-search-text="alarmDataKeySearchText"
|
||||
md-items="item in dataKeysSearch(alarmDataKeySearchText, types.dataKeyType.alarm)"
|
||||
md-items="item in dataKeysSearch(alarmDataKeySearchText)"
|
||||
md-item-text="item.name"
|
||||
md-min-length="0"
|
||||
placeholder="{{'datakey.alarm' | translate }}"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user