Igor Kulikov
8 years ago
8 changed files with 246 additions and 12 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,100 @@ |
|||
/* |
|||
* Copyright © 2016-2018 The Thingsboard Authors |
|||
* |
|||
* Licensed 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. |
|||
*/ |
|||
import './message-type-autocomplete.scss'; |
|||
|
|||
/* eslint-disable import/no-unresolved, import/default */ |
|||
|
|||
import messageTypeAutocompleteTemplate from './message-type-autocomplete.tpl.html'; |
|||
|
|||
/* eslint-enable import/no-unresolved, import/default */ |
|||
|
|||
/*@ngInject*/ |
|||
export default function MessageTypeAutocomplete($compile, $templateCache, $q, $filter, types) { |
|||
|
|||
var linker = function (scope, element, attrs, ngModelCtrl) { |
|||
var template = $templateCache.get(messageTypeAutocompleteTemplate); |
|||
element.html(template); |
|||
|
|||
var messageTypeList = []; |
|||
for (var t in types.messageType) { |
|||
var type = types.messageType[t]; |
|||
messageTypeList.push(type); |
|||
} |
|||
|
|||
scope.messageType = null; |
|||
scope.messageTypeSearchText = ''; |
|||
|
|||
scope.fetchMessageTypes = function(searchText) { |
|||
var deferred = $q.defer(); |
|||
var result = $filter('filter')(messageTypeList, {'name': searchText}); |
|||
if (result && result.length) { |
|||
deferred.resolve(result); |
|||
} else { |
|||
deferred.resolve([{name: searchText, value: searchText}]); |
|||
} |
|||
return deferred.promise; |
|||
}; |
|||
|
|||
scope.messageTypeSearchTextChanged = function() { |
|||
}; |
|||
|
|||
scope.updateView = function () { |
|||
if (!scope.disabled) { |
|||
var value = null; |
|||
if (scope.messageType) { |
|||
value = scope.messageType.value; |
|||
} |
|||
ngModelCtrl.$setViewValue(value); |
|||
} |
|||
}; |
|||
|
|||
ngModelCtrl.$render = function () { |
|||
var value = ngModelCtrl.$viewValue; |
|||
if (value) { |
|||
var result = $filter('filter')(messageTypeList, {'value': value}, true); |
|||
if (result && result.length) { |
|||
scope.messageType = result[0]; |
|||
} else { |
|||
scope.messageType = { |
|||
name: value, |
|||
value: value |
|||
}; |
|||
} |
|||
} else { |
|||
scope.messageType = null; |
|||
} |
|||
}; |
|||
|
|||
scope.$watch('messageType', function (newValue, prevValue) { |
|||
if (!angular.equals(newValue, prevValue)) { |
|||
scope.updateView(); |
|||
} |
|||
}); |
|||
|
|||
$compile(element.contents())(scope); |
|||
} |
|||
|
|||
return { |
|||
restrict: "E", |
|||
require: "^ngModel", |
|||
link: linker, |
|||
scope: { |
|||
theForm: '=?', |
|||
disabled:'=ngDisabled', |
|||
required:'=ngRequired' |
|||
} |
|||
}; |
|||
} |
|||
@ -0,0 +1,25 @@ |
|||
/** |
|||
* Copyright © 2016-2018 The Thingsboard Authors |
|||
* |
|||
* Licensed 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. |
|||
*/ |
|||
.tb-message-type-autocomplete { |
|||
.tb-message-type-item { |
|||
display: block; |
|||
height: 48px; |
|||
} |
|||
li { |
|||
height: auto !important; |
|||
white-space: normal !important; |
|||
} |
|||
} |
|||
@ -0,0 +1,41 @@ |
|||
<!-- |
|||
|
|||
Copyright © 2016-2018 The Thingsboard Authors |
|||
|
|||
Licensed 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. |
|||
|
|||
--> |
|||
<md-autocomplete ng-required="required" |
|||
ng-disabled="disabled" |
|||
md-no-cache="true" |
|||
md-input-name="messageType" |
|||
ng-model="messageType" |
|||
md-selected-item="messageType" |
|||
md-search-text="messageTypeSearchText" |
|||
md-search-text-change="messageTypeSearchTextChanged()" |
|||
md-items="item in fetchMessageTypes(messageTypeSearchText)" |
|||
md-item-text="item.name" |
|||
md-min-length="0" |
|||
placeholder="{{ 'rulenode.select-message-type' | translate }}" |
|||
md-floating-label="{{ 'rulenode.message-type' | translate }}" |
|||
md-select-on-match="false" |
|||
md-menu-class="tb-message-type-autocomplete"> |
|||
<md-item-template> |
|||
<div class="tb-message-type-item"> |
|||
<span md-highlight-text="messageTypeSearchText" md-highlight-flags="^i">{{item.name}}</span> |
|||
</div> |
|||
</md-item-template> |
|||
<div ng-messages="theForm.messageType.$error"> |
|||
<div translate ng-message="required">rulenode.message-type-required</div> |
|||
</div> |
|||
</md-autocomplete> |
|||
Loading…
Reference in new issue