dendi-wang/thingsboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update widget for backward compatibility

Browse Source
This commit is contained in:
Chantsova Ekaterina 2019-11-14 18:52:49 +02:00 committed by Andrew Shvayka
parent 9c5dd4345c
commit e253b6443c
3 changed files with 192 additions and 120 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
application/src/main/data/json/system/widget_bundles/input_widgets.json
View File

@ -319,7 +319,7 @@
"resources": [], "resources": [],
"templateHtml": "<tb-multiple-input-widget \n form-id=\"formId\"\n ctx=\"ctx\">\n</tb-multiple-input-widget>", "templateHtml": "<tb-multiple-input-widget \n form-id=\"formId\"\n ctx=\"ctx\">\n</tb-multiple-input-widget>",
"templateCss": "", "templateCss": "",
"controllerScript": "let $scope;\r\nlet settings;\r\nlet attributeService;\r\nlet toast;\r\nlet utils;\r\nlet types;\r\n\r\nself.onInit = function() {\r\n var scope = self.ctx.$scope;\r\n var id = self.ctx.$scope.$injector.get('utils').guid();\r\n scope.formId = \"form-\"+id;\r\n scope.ctx = self.ctx;\r\n}\r\n\r\nself.onDataUpdated = function() {\r\n self.ctx.$scope.$broadcast('multiple-input-data-updated', self.ctx.$scope.formId);\r\n}\r\n\r\nself.typeParameters = function() {\r\n return {\r\n maxDatasources: 1\r\n }\r\n}\r\n\r\nself.onResize = function() {\r\n self.ctx.$scope.$broadcast('multiple-input-resize', self.ctx.$scope.formId);\r\n}\r\n", "controllerScript": "let $scope;\r\nlet settings;\r\nlet attributeService;\r\nlet toast;\r\nlet utils;\r\nlet types;\r\n\r\nself.onInit = function() {\r\n var scope = self.ctx.$scope;\r\n var id = self.ctx.$scope.$injector.get('utils').guid();\r\n scope.formId = \"form-\"+id;\r\n scope.ctx = self.ctx;\r\n}\r\n\r\nself.onDataUpdated = function() {\r\n self.ctx.$scope.$broadcast('multiple-input-data-updated', self.ctx.$scope.formId);\r\n}\r\n\r\nself.onResize = function() {\r\n self.ctx.$scope.$broadcast('multiple-input-resize', self.ctx.$scope.formId);\r\n}\r\n",
"settingsSchema": "{\n \"schema\": {\n \"type\": \"object\",\n \"title\": \"MultipleInput\",\n \"properties\": {\n \"widgetTitle\": {\n \"title\": \"Widget title\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"showActionButtons\":{\n \"title\":\"Show action buttons\",\n \"type\":\"boolean\",\n \"default\": true\n },\n \"showResultMessage\":{\n \"title\":\"Show result message\",\n \"type\":\"boolean\",\n \"default\": true\n },\n \"fieldsAlignment\": {\n \"title\": \"Fields alignment\",\n \"type\": \"string\",\n \"default\": \"row\"\n },\n \"fieldsInRow\": {\n \"title\": \"Number of fields in the row\",\n \"type\": \"number\",\n \"default\": \"2\"\n }\n },\n \"required\": []\n },\n \"form\": [\n \"widgetTitle\",\n \"showActionButtons\",\n \"showResultMessage\",\n {\n \"key\": \"fieldsAlignment\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"row\",\n \"label\": \"Row (default)\"\n },\n {\n \"value\": \"column\",\n \"label\": \"Column\"\n }\n ]\n },\n \"fieldsInRow\"\n ]\n}", "settingsSchema": "{\n \"schema\": {\n \"type\": \"object\",\n \"title\": \"MultipleInput\",\n \"properties\": {\n \"widgetTitle\": {\n \"title\": \"Widget title\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"showActionButtons\":{\n \"title\":\"Show action buttons\",\n \"type\":\"boolean\",\n \"default\": true\n },\n \"showResultMessage\":{\n \"title\":\"Show result message\",\n \"type\":\"boolean\",\n \"default\": true\n },\n \"fieldsAlignment\": {\n \"title\": \"Fields alignment\",\n \"type\": \"string\",\n \"default\": \"row\"\n },\n \"fieldsInRow\": {\n \"title\": \"Number of fields in the row\",\n \"type\": \"number\",\n \"default\": \"2\"\n }\n },\n \"required\": []\n },\n \"form\": [\n \"widgetTitle\",\n \"showActionButtons\",\n \"showResultMessage\",\n {\n \"key\": \"fieldsAlignment\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"row\",\n \"label\": \"Row (default)\"\n },\n {\n \"value\": \"column\",\n \"label\": \"Column\"\n }\n ]\n },\n \"fieldsInRow\"\n ]\n}",
"dataKeySettingsSchema": "{\n \"schema\": {\n \"type\": \"object\",\n \"title\": \"DataKeySettings\",\n \"properties\": {\n \"dataKeyType\": {\n \"title\": \"Datakey type\",\n \"type\": \"string\",\n \"default\": \"server\"\n },\n \"dataKeyValueType\": {\n \"title\": \"Datakey value type\",\n \"type\": \"string\",\n \"default\": \"string\"\n },\n \"required\": {\n \"title\": \"Value is required\",\n \"type\": \"boolean\",\n \"default\": false\n },\n \"isEditable\": {\n \"title\": \"Ability to edit attribute\",\n \"type\": \"string\",\n \"default\": \"editable\"\n },\n \"disabledOnDataKey\": {\n \"title\": \"Disable on false value of another datakey (specify datakey name)\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"dataKeyHidden\": {\n \"title\": \"Hide input field\",\n \"type\": \"boolean\",\n \"default\": false\n },\n \"step\": {\n \"title\": \"Step interval between values (only for numbers)\",\n \"type\": \"number\",\n \"default\": \"1\"\n },\n \"requiredErrorMessage\": {\n \"title\": \"'Required' error message\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"icon\": {\n \"title\": \"Icon to show before input cell\",\n \"type\": \"string\",\n \"default\": \"\"\n }\n },\n \"required\": []\n },\n \"form\": [\n {\n \"key\": \"dataKeyType\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"server\",\n \"label\": \"Server attribute (default)\"\n },\n {\n \"value\": \"shared\",\n \"label\": \"Shared attribute\"\n },\n {\n \"value\": \"timeseries\",\n \"label\": \"Timeseries\"\n }\n ]\n },\n {\n \"key\": \"dataKeyValueType\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"string\",\n \"label\": \"String\"\n },\n {\n \"value\": \"double\",\n \"label\": \"Double\"\n },\n {\n \"value\": \"integer\",\n \"label\": \"Integer\"\n },\n {\n \"value\": \"booleanCheckbox\",\n \"label\": \"Boolean (Checkbox)\"\n },\n {\n \"value\": \"booleanSwitch\",\n \"label\": \"Boolean (Switch)\"\n },\n {\n \"value\": \"dateTime\",\n \"label\": \"Date & Time\"\n },\n {\n \"value\": \"date\",\n \"label\": \"Date\"\n },\n {\n \"value\": \"time\",\n \"label\": \"Time\"\n }\n ]\n },\n \"required\",\n {\n \"key\": \"isEditable\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"editable\",\n \"label\": \"Editable (default)\"\n },\n {\n \"value\": \"disabled\",\n \"label\": \"Disabled\"\n },\n {\n \"value\": \"readonly\",\n \"label\": \"Read-only\"\n }\n ]\n },\n \"disabledOnDataKey\",\n \"dataKeyHidden\",\n \"step\",\n \"requiredErrorMessage\",\n\t\t{\n \t\t\"key\": \"icon\",\n\t\t\t\"type\": \"icon\"\n\t\t}\n ]\n}\n", "dataKeySettingsSchema": "{\n \"schema\": {\n \"type\": \"object\",\n \"title\": \"DataKeySettings\",\n \"properties\": {\n \"dataKeyType\": {\n \"title\": \"Datakey type\",\n \"type\": \"string\",\n \"default\": \"server\"\n },\n \"dataKeyValueType\": {\n \"title\": \"Datakey value type\",\n \"type\": \"string\",\n \"default\": \"string\"\n },\n \"required\": {\n \"title\": \"Value is required\",\n \"type\": \"boolean\",\n \"default\": false\n },\n \"isEditable\": {\n \"title\": \"Ability to edit attribute\",\n \"type\": \"string\",\n \"default\": \"editable\"\n },\n \"disabledOnDataKey\": {\n \"title\": \"Disable on false value of another datakey (specify datakey name)\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"dataKeyHidden\": {\n \"title\": \"Hide input field\",\n \"type\": \"boolean\",\n \"default\": false\n },\n \"step\": {\n \"title\": \"Step interval between values (only for numbers)\",\n \"type\": \"number\",\n \"default\": \"1\"\n },\n \"requiredErrorMessage\": {\n \"title\": \"'Required' error message\",\n \"type\": \"string\",\n \"default\": \"\"\n },\n \"icon\": {\n \"title\": \"Icon to show before input cell\",\n \"type\": \"string\",\n \"default\": \"\"\n }\n },\n \"required\": []\n },\n \"form\": [\n {\n \"key\": \"dataKeyType\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"server\",\n \"label\": \"Server attribute (default)\"\n },\n {\n \"value\": \"shared\",\n \"label\": \"Shared attribute\"\n },\n {\n \"value\": \"timeseries\",\n \"label\": \"Timeseries\"\n }\n ]\n },\n {\n \"key\": \"dataKeyValueType\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"string\",\n \"label\": \"String\"\n },\n {\n \"value\": \"double\",\n \"label\": \"Double\"\n },\n {\n \"value\": \"integer\",\n \"label\": \"Integer\"\n },\n {\n \"value\": \"booleanCheckbox\",\n \"label\": \"Boolean (Checkbox)\"\n },\n {\n \"value\": \"booleanSwitch\",\n \"label\": \"Boolean (Switch)\"\n },\n {\n \"value\": \"dateTime\",\n \"label\": \"Date & Time\"\n },\n {\n \"value\": \"date\",\n \"label\": \"Date\"\n },\n {\n \"value\": \"time\",\n \"label\": \"Time\"\n }\n ]\n },\n \"required\",\n {\n \"key\": \"isEditable\",\n \"type\": \"rc-select\",\n \"multiple\": false,\n \"items\": [\n {\n \"value\": \"editable\",\n \"label\": \"Editable (default)\"\n },\n {\n \"value\": \"disabled\",\n \"label\": \"Disabled\"\n },\n {\n \"value\": \"readonly\",\n \"label\": \"Read-only\"\n }\n ]\n },\n \"disabledOnDataKey\",\n \"dataKeyHidden\",\n \"step\",\n \"requiredErrorMessage\",\n\t\t{\n \t\t\"key\": \"icon\",\n\t\t\t\"type\": \"icon\"\n\t\t}\n ]\n}\n",
"defaultConfig": "{\"datasources\":[{\"type\":\"function\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Sin\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.23592248334107624,\"funcBody\":\"return Math.round(1000*Math.sin(time/5000));\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":true,\"backgroundColor\":\"#fff\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{},\"title\":\"Update Multiple Attributes\",\"dropShadow\":true,\"enableFullscreen\":false,\"enableDataExport\":false,\"widgetStyle\":{},\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400},\"useDashboardTimewindow\":true,\"showLegend\":false,\"actions\":{}}" "defaultConfig": "{\"datasources\":[{\"type\":\"function\",\"name\":\"function\",\"dataKeys\":[{\"name\":\"f(x)\",\"type\":\"function\",\"label\":\"Sin\",\"color\":\"#2196f3\",\"settings\":{},\"_hash\":0.23592248334107624,\"funcBody\":\"return Math.round(1000*Math.sin(time/5000));\"}]}],\"timewindow\":{\"realtime\":{\"timewindowMs\":60000}},\"showTitle\":true,\"backgroundColor\":\"#fff\",\"color\":\"rgba(0, 0, 0, 0.87)\",\"padding\":\"8px\",\"settings\":{},\"title\":\"Update Multiple Attributes\",\"dropShadow\":true,\"enableFullscreen\":false,\"enableDataExport\":false,\"widgetStyle\":{},\"titleStyle\":{\"fontSize\":\"16px\",\"fontWeight\":400},\"useDashboardTimewindow\":true,\"showLegend\":false,\"actions\":{}}"

280
ui/src/app/widget/lib/multiple-input-widget.js
View File

@ -47,14 +47,14 @@ function MultipleInputWidgetController($q, $scope, $translate, attributeService,
vm.entityDetected = false; vm.entityDetected = false;
vm.isAllParametersValid = true; vm.isAllParametersValid = true;
vm.data = []; vm.sources = [];
vm.datasources = null; vm.datasources = null;
vm.discardAll = discardAll; vm.discardAll = discardAll;
vm.inputChanged = inputChanged; vm.inputChanged = inputChanged;
vm.save = save; vm.save = save;
$scope.$watch('vm.ctx', function() { $scope.$watch('vm.ctx', function () {
if (vm.ctx && vm.ctx.defaultSubscription) { if (vm.ctx && vm.ctx.defaultSubscription) {
vm.settings = vm.ctx.settings; vm.settings = vm.ctx.settings;
vm.widgetConfig = vm.ctx.widgetConfig; vm.widgetConfig = vm.ctx.widgetConfig;
@ -65,100 +65,113 @@ function MultipleInputWidgetController($q, $scope, $translate, attributeService,
} }
}); });
$scope.$on('multiple-input-data-updated', function(event, formId) { $scope.$on('multiple-input-data-updated', function (event, formId) {
if (vm.formId == formId) { if (vm.formId == formId) {
updateWidgetData(vm.subscription.data); updateWidgetData(vm.subscription.data);
$scope.$digest(); $scope.$digest();
} }
}); });
$scope.$on('multiple-input-resize', function(event, formId) { $scope.$on('multiple-input-resize', function (event, formId) {
if (vm.formId == formId) { if (vm.formId == formId) {
updateWidgetDisplaying(); updateWidgetDisplaying();
} }
}); });
function discardAll() { function discardAll() {
for (var i = 0; i < vm.data.length; i++) { for (var i = 0; i < vm.sources.length; i++) {
vm.data[i].data.currentValue = vm.data[i].data.originalValue; for (var j = 0; j < vm.sources[i].keys.length; j++) {
vm.sources[i].keys[j].data.currentValue = vm.sources[i].keys[j].data.originalValue;
}
} }
$scope.multipleInputForm.$setPristine(); $scope.multipleInputForm.$setPristine();
} }
function inputChanged(key) { function inputChanged(source, key) {
if (!vm.settings.showActionButtons) { if (!vm.settings.showActionButtons) {
if (!key.settings.required || (key.settings.required && key.data && angular.isDefined(key.data.currentValue))) { if (!key.settings.required || (key.settings.required && key.data && angular.isDefined(key.data.currentValue))) {
vm.save(key); var dataToSave = {
datasource: source.datasource,
keys: [key]
};
vm.save(dataToSave);
} }
} }
} }
function save(key) { function save(dataToSave) {
var tasks = []; var tasks = [];
var serverAttributes = [], sharedAttributes = [], telemetry = [];
var config = { var config = {
ignoreLoading: !vm.settings.showActionButtons ignoreLoading: !vm.settings.showActionButtons
}; };
var data; var data;
if (key) { if (dataToSave) {
data = [key]; data = [dataToSave];
} else { } else {
data = vm.data; data = vm.sources;
} }
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
var item = data[i]; var serverAttributes = [], sharedAttributes = [], telemetry = [];
if (item.data.currentValue !== item.data.originalValue) { for (let j = 0; j < data[i].keys.length; j++) {
var attribute = { var key = data[i].keys[j];
key: item.name if (key.data.currentValue !== key.data.originalValue) {
}; var attribute = {
switch (item.settings.dataKeyValueType) { key: key.name
case 'dateTime': };
case 'date': if (key.data.currentValue) {
attribute.value = item.data.currentValue.getTime(); switch (key.settings.dataKeyValueType) {
break; case 'dateTime':
case 'time': case 'date':
attribute.value = item.data.currentValue.getTime() - moment().startOf('day').valueOf();//eslint-disable-line attribute.value = key.data.currentValue.getTime();
break; break;
default: case 'time':
attribute.value = item.data.currentValue; attribute.value = key.data.currentValue.getTime() - moment().startOf('day').valueOf();//eslint-disable-line
} break;
default:
attribute.value = key.data.currentValue;
}
} else {
attribute.value = key.data.currentValue;
}
switch (item.settings.dataKeyType) { switch (key.settings.dataKeyType) {
case 'shared': case 'shared':
sharedAttributes.push(attribute); sharedAttributes.push(attribute);
break; break;
case 'timeseries': case 'timeseries':
telemetry.push(attribute); telemetry.push(attribute);
break; break;
default: default:
serverAttributes.push(attribute); serverAttributes.push(attribute);
}
} }
} }
if (serverAttributes.length) {
tasks.push(attributeService.saveEntityAttributes(
data[i].datasource.entityType,
data[i].datasource.entityId,
types.attributesScope.server.value,
serverAttributes,
config));
}
if (sharedAttributes.length) {
tasks.push(attributeService.saveEntityAttributes(
data[i].datasource.entityType,
data[i].datasource.entityId,
types.attributesScope.shared.value,
sharedAttributes,
config));
}
if (telemetry.length) {
tasks.push(attributeService.saveEntityTimeseries(
data[i].datasource.entityType,
data[i].datasource.entityId,
types.latestTelemetry.value,
telemetry,
config));
}
} }
for (let i = 0; i < serverAttributes.length; i++) {
tasks.push(attributeService.saveEntityAttributes(
vm.datasources[0].entityType,
vm.datasources[0].entityId,
types.attributesScope.server.value,
serverAttributes,
config));
}
for (let i = 0; i < sharedAttributes.length; i++) {
tasks.push(attributeService.saveEntityAttributes(
vm.datasources[0].entityType,
vm.datasources[0].entityId,
types.attributesScope.shared.value,
sharedAttributes,
config));
}
for (let i = 0; i < telemetry.length; i++) {
tasks.push(attributeService.saveEntityTimeseries(
vm.datasources[0].entityType,
vm.datasources[0].entityId,
types.latestTelemetry.value,
telemetry,
config));
}
if (tasks.length) { if (tasks.length) {
$q.all(tasks).then( $q.all(tasks).then(
function success() { function success() {
@ -173,6 +186,8 @@ function MultipleInputWidgetController($q, $scope, $translate, attributeService,
} }
} }
); );
} else {
$scope.multipleInputForm.$setPristine();
} }
} }
@ -186,6 +201,18 @@ function MultipleInputWidgetController($q, $scope, $translate, attributeService,
vm.ctx.widgetTitle = vm.widgetTitle; vm.ctx.widgetTitle = vm.widgetTitle;
//For backward compatibility
if (angular.isUndefined(vm.settings.showActionButtons)) {
vm.settings.showActionButtons = true;
}
if (angular.isUndefined(vm.settings.fieldsAlignment)) {
vm.settings.fieldsAlignment = 'row';
}
if (angular.isUndefined(vm.settings.fieldsInRow)) {
vm.settings.fieldsInRow = 2;
}
//For backward compatibility
vm.isVerticalAlignment = !(vm.settings.fieldsAlignment === 'row'); vm.isVerticalAlignment = !(vm.settings.fieldsAlignment === 'row');
if (!vm.isVerticalAlignment && vm.settings.fieldsInRow) { if (!vm.isVerticalAlignment && vm.settings.fieldsInRow) {
@ -195,60 +222,105 @@ function MultipleInputWidgetController($q, $scope, $translate, attributeService,
function updateDatasources() { function updateDatasources() {
if (vm.datasources && vm.datasources.length) { if (vm.datasources && vm.datasources.length) {
var datasource = vm.datasources[0]; vm.entityDetected = true;
if (datasource.type === types.datasourceType.entity) { for (var i = 0; i < vm.datasources.length; i++) {
for (var i = 0; i < datasource.dataKeys.length; i++) { var datasource = vm.datasources[i];
if ((datasource.entityType !== types.entityType.device) && (datasource.dataKeys[i].settings.dataKeyType == 'shared')) { var source = {
vm.isAllParametersValid = false; datasource: datasource,
keys: []
};
if (datasource.type === types.datasourceType.entity) {
for (var j = 0; j < datasource.dataKeys.length; j++) {
if ((datasource.entityType !== types.entityType.device) && (datasource.dataKeys[j].settings.dataKeyType == 'shared')) {
vm.isAllParametersValid = false;
}
source.keys.push(datasource.dataKeys[j]);
if (source.keys[j].units) {
source.keys[j].label += ' (' + source.keys[j].units + ')';
}
source.keys[j].data = {};
//For backward compatibility
if (angular.isUndefined(source.keys[j].settings.dataKeyType)) {
if (vm.settings.attributesShared === true) {
source.keys[j].settings.dataKeyType = 'shared';
} else {
source.keys[j].settings.dataKeyType = 'server';
}
}
if (angular.isUndefined(source.keys[j].settings.dataKeyValueType)) {
if (source.keys[j].settings.inputTypeNumber === true) {
source.keys[j].settings.dataKeyValueType = 'double';
} else {
source.keys[j].settings.dataKeyValueType = 'string';
}
}
if (angular.isUndefined(source.keys[j].settings.isEditable)) {
if (source.keys[j].settings.readOnly === true) {
source.keys[j].settings.isEditable = 'readonly';
} else {
source.keys[j].settings.isEditable = 'editable';
}
}
//For backward compatibility
} }
vm.data.push(datasource.dataKeys[i]); } else {
vm.data[i].data = {}; vm.entityDetected = false;
} }
vm.entityDetected = true; vm.sources.push(source);
} }
} }
} }
function updateWidgetData(data) { function updateWidgetData(data) {
for (var i = 0; i < vm.data.length; i++) { var dataIndex = 0;
var keyData = data[i].data; for (var i = 0; i < vm.sources.length; i++) {
if (keyData && keyData.length) { var source = vm.sources[i];
var value; for (var j = 0; j < source.keys.length; j++) {
switch (vm.data[i].settings.dataKeyValueType) { var keyData = data[dataIndex].data;
case 'dateTime': var key = source.keys[j];
case 'date': if (keyData && keyData.length) {
value = moment(keyData[0][1]).toDate(); // eslint-disable-line var value;
break; switch (key.settings.dataKeyValueType) {
case 'time': case 'dateTime':
value = moment().startOf('day').add(keyData[0][1], 'ms').toDate(); // eslint-disable-line case 'date':
break; value = moment(keyData[0][1]).toDate(); // eslint-disable-line
case 'booleanCheckbox': break;
case 'booleanSwitch': case 'time':
value = (keyData[0][1] === 'true'); value = moment().startOf('day').add(keyData[0][1], 'ms').toDate(); // eslint-disable-line
break; break;
default: case 'booleanCheckbox':
value = keyData[0][1]; case 'booleanSwitch':
value = (keyData[0][1] === 'true');
break;
default:
value = keyData[0][1];
}
key.data = {
currentValue: value,
originalValue: value
};
} }
vm.data[i].data = { if (key.settings.isEditable === 'editable' && key.settings.disabledOnDataKey) {
currentValue: value, var conditions = data.filter((item) => {
originalValue: value return item.dataKey.name === key.settings.disabledOnDataKey;
}; });
} if (conditions && conditions.length) {
if (conditions[0].data.length) {
if (vm.data[i].settings.isEditable === 'editable' && vm.data[i].settings.disabledOnDataKey) { if (conditions[0].data[0][1] === 'false') {
var conditions = data.filter((item) => { key.settings.disabledOnCondition = true;
return item.dataKey.name === vm.data[i].settings.disabledOnDataKey; } else {
}); key.settings.disabledOnCondition = !conditions[0].data[0][1];
if (conditions && conditions.length) { }
if (conditions[0].data.length) {
if (conditions[0].data[0][1] === 'false') {
vm.data[i].settings.disabledOnCondition = true;
} else {
vm.data[i].settings.disabledOnCondition = !conditions[0].data[0][1];
} }
} }
} }
dataIndex++;
} }
} }
} }

30
ui/src/app/widget/lib/multiple-input-widget.tpl.html
View File

@ -17,9 +17,9 @@
--> -->
<form class="tb-multiple-input" name="multipleInputForm" ng-submit="vm.save()" novalidate autocomplete="off"> <form class="tb-multiple-input" name="multipleInputForm" ng-submit="vm.save()" novalidate autocomplete="off">
<div style="padding: 0 8px;" ng-if="vm.entityDetected && vm.isAllParametersValid"> <div style="padding: 0 8px;" ng-if="vm.entityDetected && vm.isAllParametersValid">
<div layout="row" layout-wrap ng-class="{'vertical-alignment': vm.isVerticalAlignment || vm.changeAlignment}"> <div layout="row" ng-repeat="source in vm.sources" layout-wrap ng-class="{'vertical-alignment': vm.isVerticalAlignment || vm.changeAlignment}">
<div ng-repeat="key in vm.data" ng-style="{'width': (vm.isVerticalAlignment || vm.changeAlignment) ? '100%' : vm.inputWidthSettings}"> <div ng-repeat="key in source.keys" ng-if="!key.settings.dataKeyHidden" ng-style="{'width': (vm.isVerticalAlignment || vm.changeAlignment) ? '100%' : vm.inputWidthSettings}">
<div class="input-field" ng-if="(key.settings.dataKeyValueType === 'string') && !key.settings.dataKeyHidden"> <div class="input-field" ng-if="(key.settings.dataKeyValueType === 'string')">
<md-input-container class="md-block"> <md-input-container class="md-block">
<label>{{key.label}}</label> <label>{{key.label}}</label>
<md-icon class="material-icons" ng-if="key.settings.icon"> <md-icon class="material-icons" ng-if="key.settings.icon">
@ -32,13 +32,13 @@
ng-required="key.settings.required" ng-required="key.settings.required"
type="text" type="text"
md-select-on-focus md-select-on-focus
ng-blur="vm.inputChanged(key)"> ng-blur="vm.inputChanged(source,key)">
<div ng-messages="multipleInputForm[key.name].$error"> <div ng-messages="multipleInputForm[key.name].$error">
<div ng-message="required">{{ key.settings.requiredErrorMessage }}</div> <div ng-message="required">{{ key.settings.requiredErrorMessage }}</div>
</div> </div>
</md-input-container> </md-input-container>
</div> </div>
<div class="input-field" ng-if="(key.settings.dataKeyValueType === 'double') && !key.settings.dataKeyHidden"> <div class="input-field" ng-if="(key.settings.dataKeyValueType === 'double')">
<md-input-container class="md-block"> <md-input-container class="md-block">
<label>{{key.label}}</label> <label>{{key.label}}</label>
<md-icon class="material-icons" ng-if="key.settings.icon"> <md-icon class="material-icons" ng-if="key.settings.icon">
@ -52,13 +52,13 @@
type="number" type="number"
step="key.settings.step" step="key.settings.step"
md-select-on-focus md-select-on-focus
ng-blur="vm.inputChanged(key)"> ng-blur="vm.inputChanged(source,key)">
<div ng-messages="multipleInputForm[key.name].$error"> <div ng-messages="multipleInputForm[key.name].$error">
<div ng-message="required">{{ key.settings.requiredErrorMessage }}</div> <div ng-message="required">{{ key.settings.requiredErrorMessage }}</div>
</div> </div>
</md-input-container> </md-input-container>
</div> </div>
<div class="input-field" ng-if="(key.settings.dataKeyValueType === 'integer') && !key.settings.dataKeyHidden"> <div class="input-field" ng-if="(key.settings.dataKeyValueType === 'integer')">
<md-input-container class="md-block"> <md-input-container class="md-block">
<label>{{key.label}}</label> <label>{{key.label}}</label>
<md-icon class="material-icons" ng-if="key.settings.icon"> <md-icon class="material-icons" ng-if="key.settings.icon">
@ -73,26 +73,26 @@
step="key.settings.step" step="key.settings.step"
md-select-on-focus md-select-on-focus
ng-pattern="/^-?[0-9]+$/" ng-pattern="/^-?[0-9]+$/"
ng-blur="vm.inputChanged(key)"> ng-blur="vm.inputChanged(source,key)">
<div ng-messages="multipleInputForm[key.name].$error"> <div ng-messages="multipleInputForm[key.name].$error">
<div ng-message="required">{{ key.settings.requiredErrorMessage }}</div> <div ng-message="required">{{ key.settings.requiredErrorMessage }}</div>
<div translate ng-message="pattern">value.invalid-integer-value</div> <div translate ng-message="pattern">value.invalid-integer-value</div>
</div> </div>
</md-input-container> </md-input-container>
</div> </div>
<div class="input-field" ng-if="(key.settings.dataKeyValueType === 'booleanCheckbox') && !key.settings.dataKeyHidden" class="md-block"> <div class="input-field" ng-if="(key.settings.dataKeyValueType === 'booleanCheckbox')" class="md-block">
<md-checkbox name="{{key.name}}" <md-checkbox name="{{key.name}}"
ng-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition" ng-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition"
ng-model="key.data.currentValue" ng-model="key.data.currentValue"
ng-change="vm.inputChanged(key)"> ng-change="vm.inputChanged(source,key)">
{{key.label}} {{key.label}}
</md-checkbox> </md-checkbox>
</div> </div>
<div class="input-field" ng-if="(key.settings.dataKeyValueType === 'booleanSwitch') && !key.settings.dataKeyHidden" class="md-block"> <div class="input-field" ng-if="(key.settings.dataKeyValueType === 'booleanSwitch')" class="md-block">
<md-switch name="{{key.name}}" <md-switch name="{{key.name}}"
ng-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition" ng-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition"
ng-model="key.data.currentValue" ng-model="key.data.currentValue"
ng-change="vm.inputChanged(key)" ng-change="vm.inputChanged(source,key)"
aria-label="{{key.label}}" aria-label="{{key.label}}"
md-invert> md-invert>
{{key.label}} {{key.label}}
@ -100,7 +100,7 @@
</div> </div>
<div ng-if="(key.settings.dataKeyValueType === 'dateTime') || <div ng-if="(key.settings.dataKeyValueType === 'dateTime') ||
(key.settings.dataKeyValueType === 'date') || (key.settings.dataKeyValueType === 'date') ||
(key.settings.dataKeyValueType === 'time') && !key.settings.dataKeyHidden" (key.settings.dataKeyValueType === 'time')"
class="md-block input-field date-time-input" layout="column"> class="md-block input-field date-time-input" layout="column">
<label class="date-time-input__label">{{key.label}}</label> <label class="date-time-input__label">{{key.label}}</label>
<div layout="row" ng-class="{'vertically-aligned': vm.smallWidthContainer}"> <div layout="row" ng-class="{'vertically-aligned': vm.smallWidthContainer}">
@ -108,7 +108,7 @@
ng-if="key.settings.dataKeyValueType !== 'time'" ng-if="key.settings.dataKeyValueType !== 'time'"
mdp-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition" mdp-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition"
ng-model="key.data.currentValue" ng-model="key.data.currentValue"
ng-change="vm.inputChanged(key)" ng-change="vm.inputChanged(source,key)"
mdp-placeholder="{{ 'widgets.input-widgets.date' | translate }}"> mdp-placeholder="{{ 'widgets.input-widgets.date' | translate }}">
<div ng-messages="multipleInputForm[key.name].$error"> <div ng-messages="multipleInputForm[key.name].$error">
<div ng-message="required">{{ key.settings.requiredErrorMessage }}</div> <div ng-message="required">{{ key.settings.requiredErrorMessage }}</div>
@ -118,7 +118,7 @@
ng-if="key.settings.dataKeyValueType !== 'date'" ng-if="key.settings.dataKeyValueType !== 'date'"
mdp-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition" mdp-disabled="key.settings.isEditable === 'disabled' || key.settings.disabledOnCondition"
ng-model="key.data.currentValue" ng-model="key.data.currentValue"
ng-change="vm.inputChanged(key)" ng-change="vm.inputChanged(source,key)"
mdp-placeholder="{{ 'widgets.input-widgets.time' | translate }}" mdp-placeholder="{{ 'widgets.input-widgets.time' | translate }}"
mdp-auto-switch="true"> mdp-auto-switch="true">
<div ng-messages="multipleInputForm[key.name].$error"> <div ng-messages="multipleInputForm[key.name].$error">