简柏林 / thingskit · Commits

Commit 76e5aa24fa80b7bf6c8dbf8508353f0002aabfd0

Authored by pgrisu
1 parent e157f76f

add support for flexible entity dataKeys order (timeseries mixed with attributes… 

… in arbitrary way) in the widget config
Inline Side-by-side
Showing 3 changed files with 69 additions and 112 deletions
... ... @@ -50,11 +50,8 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
50 50 scope.alarmFields.push(alarmField);
51 51 }
52 52
53   - scope.selectedTimeseriesDataKey = null;
54   - scope.timeseriesDataKeySearchText = null;
55   -
56   - scope.selectedAttributeDataKey = null;
57   - scope.attributeDataKeySearchText = null;
  53 + scope.selectedDataKey = null;
  54 + scope.dataKeySearchText = null;
58 55
59 56 scope.selectedAlarmDataKey = null;
60 57 scope.alarmDataKeySearchText = null;
... ... @@ -92,11 +89,7 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
92 89 }
93 90 });
94 91
95   - scope.$watch('timeseriesDataKeys', function () {
96   - updateDataKeys();
97   - }, true);
98   -
99   - scope.$watch('attributeDataKeys', function () {
  92 + scope.$watch('dataKeys', function () {
100 93 updateDataKeys();
101 94 }, true);
102 95
... ... @@ -107,10 +100,9 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
107 100 function updateDataKeys() {
108 101 if (ngModelCtrl.$viewValue) {
109 102 var dataKeys = [];
110   - dataKeys = dataKeys.concat(scope.timeseriesDataKeys);
111   - dataKeys = dataKeys.concat(scope.attributeDataKeys);
  103 + dataKeys = dataKeys.concat(scope.dataKeys);
112 104 dataKeys = dataKeys.concat(scope.alarmDataKeys);
113   - if (ngModelCtrl.$viewValue.dataKeys != dataKeys)
  105 + if (!angular.equals(ngModelCtrl.$viewValue.dataKeys, dataKeys))
114 106 {
115 107 ngModelCtrl.$setDirty();
116 108 ngModelCtrl.$viewValue.dataKeys = dataKeys;
... ... @@ -128,21 +120,17 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
128 120 } else {
129 121 scope.entityAlias = null;
130 122 }
131   - var timeseriesDataKeys = [];
132   - var attributeDataKeys = [];
  123 + var dataKeys = [];
133 124 var alarmDataKeys = [];
134 125 for (var d in ngModelCtrl.$viewValue.dataKeys) {
135 126 var dataKey = ngModelCtrl.$viewValue.dataKeys[d];
136   - if (dataKey.type === types.dataKeyType.timeseries) {
137   - timeseriesDataKeys.push(dataKey);
138   - } else if (dataKey.type === types.dataKeyType.attribute) {
139   - attributeDataKeys.push(dataKey);
  127 + if ((dataKey.type === types.dataKeyType.timeseries) || (dataKey.type === types.dataKeyType.attribute)) {
  128 + dataKeys.push(dataKey);
140 129 } else if (dataKey.type === types.dataKeyType.alarm) {
141 130 alarmDataKeys.push(dataKey);
142 131 }
143 132 }
144   - scope.timeseriesDataKeys = timeseriesDataKeys;
145   - scope.attributeDataKeys = attributeDataKeys;
  133 + scope.dataKeys = dataKeys;
146 134 scope.alarmDataKeys = alarmDataKeys;
147 135 }
148 136 };
... ... @@ -152,30 +140,19 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
152 140 }
153 141
154 142 scope.selectedEntityAliasChange = function () {
155   - if (!scope.timeseriesDataKeySearchText || scope.timeseriesDataKeySearchText === '') {
156   - scope.timeseriesDataKeySearchText = scope.timeseriesDataKeySearchText === '' ? null : '';
157   - }
158   - if (!scope.attributeDataKeySearchText || scope.attributeDataKeySearchText === '') {
159   - scope.attributeDataKeySearchText = scope.attributeDataKeySearchText === '' ? null : '';
  143 + if (!scope.dataKeySearchText || scope.dataKeySearchText === '') {
  144 + scope.dataKeySearchText = scope.dataKeySearchText === '' ? null : '';
160 145 }
161 146 if (!scope.alarmDataKeySearchText || scope.alarmDataKeySearchText === '') {
162 147 scope.alarmDataKeySearchText = scope.alarmDataKeySearchText === '' ? null : '';
163 148 }
164 149 };
165 150
166   - scope.transformTimeseriesDataKeyChip = function (chip) {
167   - if (scope.maxDataKeys > 0 && ngModelCtrl.$viewValue.dataKeys.length >= scope.maxDataKeys ) {
168   - return null;
169   - } else {
170   - return scope.generateDataKey({chip: chip, type: types.dataKeyType.timeseries});
171   - }
172   - };
173   -
174   - scope.transformAttributeDataKeyChip = function (chip) {
  151 + scope.transformDataKeyChip = function (chip) {
175 152 if (scope.maxDataKeys > 0 && ngModelCtrl.$viewValue.dataKeys.length >= scope.maxDataKeys ) {
176 153 return null;
177 154 } else {
178   - return scope.generateDataKey({chip: chip, type: types.dataKeyType.attribute});
  155 + return scope.generateDataKey({chip: chip.name, type: chip.type});
179 156 }
180 157 };
181 158
... ... @@ -230,10 +207,8 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
230 207 w.triggerHandler('resize');
231 208 }
232 209 }).then(function (dataKey) {
233   - if (dataKey.type === types.dataKeyType.timeseries) {
234   - scope.timeseriesDataKeys[index] = dataKey;
235   - } else if (dataKey.type === types.dataKeyType.attribute) {
236   - scope.attributeDataKeys[index] = dataKey;
  210 + if ((dataKey.type === types.dataKeyType.timeseries) || (dataKey.type === types.dataKeyType.attribute)) {
  211 + scope.dataKeys[index] = dataKey;
237 212 } else if (dataKey.type === types.dataKeyType.alarm) {
238 213 scope.alarmDataKeys[index] = dataKey;
239 214 }
... ... @@ -242,7 +217,7 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
242 217 });
243 218 };
244 219
245   - scope.dataKeysSearch = function (searchText, type) {
  220 + scope.dataKeysSearch = function (searchText) {
246 221 if (scope.widgetType == types.widgetType.alarm.value) {
247 222 var dataKeys = searchText ? scope.alarmFields.filter(
248 223 scope.createFilterForDataKey(searchText)) : scope.alarmFields;
... ... @@ -250,9 +225,25 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
250 225 } else {
251 226 if (scope.entityAlias) {
252 227 var deferred = $q.defer();
253   - scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: type})
  228 + scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: types.dataKeyType.timeseries})
254 229 .then(function (dataKeys) {
255   - deferred.resolve(dataKeys);
  230 + var items = [];
  231 + for (var i = 0; i < dataKeys.length; i++) {
  232 + items.push({ name: dataKeys[i], type: types.dataKeyType.timeseries });
  233 + }
  234 + if (scope.widgetType == types.widgetType.latest.value) {
  235 + scope.fetchEntityKeys({entityAliasId: scope.entityAlias.id, query: searchText, type: types.dataKeyType.attribute})
  236 + .then(function (dataKeys) {
  237 + for (var i = 0; i < dataKeys.length; i++) {
  238 + items.push({ name: dataKeys[i], type: types.dataKeyType.attribute });
  239 + }
  240 + deferred.resolve(items);
  241 + }, function (e) {
  242 + deferred.reject(e);
  243 + });
  244 + }
  245 + else
  246 + deferred.resolve(items);
256 247 }, function (e) {
257 248 deferred.reject(e);
258 249 });
... ... @@ -270,13 +261,13 @@ function DatasourceEntity($compile, $templateCache, $q, $mdDialog, $window, $doc
270 261 };
271 262 };
272 263
273   - scope.createKey = function (event, chipsId) {
  264 + scope.createKey = function (event, type, chipsId) {
274 265 var chipsChild = $(chipsId, element)[0].firstElementChild;
275 266 var el = angular.element(chipsChild);
276 267 var chipBuffer = el.scope().$mdChipsCtrl.getChipBuffer();
277 268 event.preventDefault();
278 269 event.stopPropagation();
279   - el.scope().$mdChipsCtrl.appendChip(chipBuffer.trim());
  270 + el.scope().$mdChipsCtrl.appendChip({ name: chipBuffer.trim(), type: type});
280 271 el.scope().$mdChipsCtrl.resetChipBuffer();
281 272 }
282 273
... ...
... ... @@ -16,6 +16,7 @@
16 16 @import "../../scss/constants";
17 17
18 18 .tb-entity-alias-autocomplete,
  19 +.tb-datakey-autocomplete,
19 20 .tb-timeseries-datakey-autocomplete,
20 21 .tb-attribute-datakey-autocomplete,
21 22 .tb-alarm-datakey-autocomplete {
... ...
... ... @@ -25,82 +25,39 @@
25 25 <section flex layout='column'>
26 26 <section flex layout='column' layout-align="center" style="padding-left: 4px;">
27 27 <md-chips flex ng-if="widgetType != types.widgetType.alarm.value"
28   - id="timeseries_datakey_chips"
29   - ng-model="timeseriesDataKeys" md-autocomplete-snap
30   - md-transform-chip="transformTimeseriesDataKeyChip($chip)"
31   - md-require-match="false">
32   - <md-autocomplete
33   - md-no-cache="true"
34   - id="timeseries_datakey"
35   - md-selected-item="selectedTimeseriesDataKey"
36   - md-search-text="timeseriesDataKeySearchText"
37   - md-items="item in dataKeysSearch(timeseriesDataKeySearchText, types.dataKeyType.timeseries)"
38   - md-item-text="item.name"
39   - md-min-length="0"
40   - placeholder="{{'datakey.timeseries' | translate }}"
41   - md-menu-class="tb-timeseries-datakey-autocomplete">
42   - <span md-highlight-text="timeseriesDataKeySearchText" md-highlight-flags="^i">{{item}}</span>
43   - <md-not-found>
44   - <div class="tb-not-found">
45   - <div class="tb-no-entries" ng-if="!textIsNotEmpty(timeseriesDataKeySearchText)">
46   - <span translate>entity.no-keys-found</span>
47   - </div>
48   - <div ng-if="textIsNotEmpty(timeseriesDataKeySearchText)">
49   - <span translate translate-values='{ key: "{{timeseriesDataKeySearchText | truncate:true:6:&apos;...&apos;}}" }'>entity.no-key-matching</span>
50   - <span>
51   - <a translate ng-click="createKey($event, '#timeseries_datakey_chips')">entity.create-new-key</a>
52   - </span>
53   - </div>
54   - </div>
55   - </md-not-found>
56   - </md-autocomplete>
57   - <md-chip-template>
58   - <div layout="row" layout-align="start center" class="tb-attribute-chip">
59   - <div class="tb-color-preview" ng-click="showColorPicker($event, $chip, $index)" style="margin-right: 5px;">
60   - <div class="tb-color-result" ng-style="{background: $chip.color}"></div>
61   - </div>
62   - <div layout="row">
63   - <div class="tb-chip-label" tb-chip-draggable>
64   - {{$chip.label}}
65   - </div>
66   - <div class="tb-chip-separator">: </div>
67   - <div class="tb-chip-label">
68   - <strong ng-if="!$chip.postFuncBody">{{$chip.name}}</strong>
69   - <strong ng-if="$chip.postFuncBody">f({{$chip.name}})</strong>
70   - </div>
71   - </div>
72   - <md-button ng-click="editDataKey($event, $chip, $index)" class="md-icon-button tb-md-32">
73   - <md-icon aria-label="edit" class="material-icons tb-md-20">edit</md-icon>
74   - </md-button>
75   - </div>
76   - </md-chip-template>
77   - </md-chips>
78   - <md-chips flex ng-if="widgetType === types.widgetType.latest.value"
79   - id="attribute_datakey_chips"
80   - ng-model="attributeDataKeys" md-autocomplete-snap
81   - md-transform-chip="transformAttributeDataKeyChip($chip)"
  28 + id="datakey_chips"
  29 + ng-model="dataKeys" md-autocomplete-snap
  30 + md-transform-chip="transformDataKeyChip($chip)"
82 31 md-require-match="false">
83 32 <md-autocomplete
84 33 md-no-cache="true"
85   - id="attribute_datakey"
86   - md-selected-item="selectedAttributeDataKey"
87   - md-search-text="attributeDataKeySearchText"
88   - md-items="item in dataKeysSearch(attributeDataKeySearchText, types.dataKeyType.attribute)"
  34 + id="datakey"
  35 + md-selected-item="selectedDataKey"
  36 + md-search-text="dataKeySearchText"
  37 + md-items="item in dataKeysSearch(dataKeySearchText)"
89 38 md-item-text="item.name"
90 39 md-min-length="0"
91   - placeholder="{{'datakey.attributes' | translate }}"
92   - md-menu-class="tb-attribute-datakey-autocomplete">
93   - <span md-highlight-text="attributeDataKeySearchText" md-highlight-flags="^i">{{item}}</span>
  40 + placeholder=""
  41 + md-menu-class="tb-datakey-autocomplete">
  42 + <span ng-show="item.type==types.dataKeyType.attribute"><ng-md-icon size="16" icon="perm_device_information"></ng-md-icon></span>
  43 + <span ng-show="item.type==types.dataKeyType.timeseries"><ng-md-icon size="16" icon="timeline"></ng-md-icon></span>
  44 + <span md-highlight-text="dataKeySearchText" md-highlight-flags="^i">{{item.name}}</span>
94 45 <md-not-found>
95 46 <div class="tb-not-found">
96   - <div class="tb-no-entries" ng-if="!textIsNotEmpty(attributeDataKeySearchText)">
  47 + <div class="tb-no-entries" ng-if="!textIsNotEmpty(dataKeySearchText)">
97 48 <span translate>entity.no-keys-found</span>
98 49 </div>
99   - <div ng-if="textIsNotEmpty(attributeDataKeySearchText)">
100   - <span translate translate-values='{ key: "{{attributeDataKeySearchText | truncate:true:6:&apos;...&apos;}}" }'>entity.no-key-matching</span>
101   - <span>
102   - <a translate ng-click="createKey($event, '#attribute_datakey_chips')">entity.create-new-key</a>
  50 + <div ng-if="textIsNotEmpty(dataKeySearchText)">
  51 + <span translate translate-values='{ key: "{{dataKeySearchText | truncate:true:6:&apos;...&apos;}}" }'>entity.no-key-matching</span>
  52 + <span>{{'entity.create-new-key' | translate }} </span>
  53 + <span ng-show="widgetType == types.widgetType.latest.value">
  54 + <md-tooltip>{{'datakey.attributes' | translate }}</md-tooltip>
  55 + <ng-md-icon size="16" icon="perm_device_information" ng-click="createKey($event, types.dataKeyType.attribute, '#datakey_chips')"></ng-md-icon>
103 56 </span>
  57 + <span>
  58 + <md-tooltip>{{'datakey.timeseries' | translate }}</md-tooltip>
  59 + <ng-md-icon size="16" icon="timeline" ng-click="createKey($event, types.dataKeyType.timeseries, '#datakey_chips')"></ng-md-icon>
  60 + </span>
104 61 </div>
105 62 </div>
106 63 </md-not-found>
... ... @@ -112,6 +69,14 @@
112 69 </div>
113 70 <div layout="row">
114 71 <div class="tb-chip-label" tb-chip-draggable>
  72 + <span ng-show="$chip.type==types.dataKeyType.attribute">
  73 + <md-tooltip>{{'datakey.attributes' | translate }}</md-tooltip>
  74 + <ng-md-icon size="20" icon="perm_device_information"></ng-md-icon>
  75 + </span>
  76 + <span ng-show="$chip.type==types.dataKeyType.timeseries">
  77 + <md-tooltip>{{'datakey.timeseries' | translate }}</md-tooltip>
  78 + <ng-md-icon size="20" icon="timeline"></ng-md-icon>
  79 + </span>
115 80 {{$chip.label}}
116 81 </div>
117 82 <div class="tb-chip-separator">: </div>
... ... @@ -137,7 +102,7 @@
137 102 id="alarm_datakey"
138 103 md-selected-item="selectedAlarmDataKey"
139 104 md-search-text="alarmDataKeySearchText"
140   - md-items="item in dataKeysSearch(alarmDataKeySearchText, types.dataKeyType.alarm)"
  105 + md-items="item in dataKeysSearch(alarmDataKeySearchText)"
141 106 md-item-text="item.name"
142 107 md-min-length="0"
143 108 placeholder="{{'datakey.alarm' | translate }}"
... ...