From a99d5d9fc24c2ac74576a5d52ad7b8aa0c4af960 Mon Sep 17 00:00:00 2001
From: Vladyslav_Prykhodko <vprykhodko@thingsboard.io>
Date: Mon, 1 Jun 2020 11:50:25 +0300
Subject: [PATCH] Improvment view mail-setting

---
 ui/src/app/admin/admin.controller.js          |  3 +
 .../app/admin/outgoing-mail-settings.tpl.html | 73 ++++++++++---------
 2 files changed, 43 insertions(+), 33 deletions(-)

diff --git a/ui/src/app/admin/admin.controller.js b/ui/src/app/admin/admin.controller.js
index 8a2f04c621..f949c7a2fa 100644
--- a/ui/src/app/admin/admin.controller.js
+++ b/ui/src/app/admin/admin.controller.js
@@ -39,6 +39,9 @@ export default function AdminController(adminService, toast, $scope, $rootScope,
     function loadSettings() {
         adminService.getAdminSettings($state.$current.data.key).then(function success(settings) {
             vm.settings = settings;
+            if(vm.settings.jsonValue && vm.settings.jsonValue.enableTls && angular.isString(vm.settings.jsonValue.enableTls)){
+                vm.settings.jsonValue.enableTls = vm.settings.jsonValue.enableTls === 'true';
+            }
         });
     }
 
diff --git a/ui/src/app/admin/outgoing-mail-settings.tpl.html b/ui/src/app/admin/outgoing-mail-settings.tpl.html
index 89f551ed29..596c9c4091 100644
--- a/ui/src/app/admin/outgoing-mail-settings.tpl.html
+++ b/ui/src/app/admin/outgoing-mail-settings.tpl.html
@@ -38,7 +38,7 @@
 					</md-input-container>
 					<md-input-container class="md-block">
 						<label translate>admin.smtp-protocol</label>
-			            <md-select ng-disabled="$root.loading" ng-model="vm.settings.jsonValue.smtpProtocol">
+			            <md-select ng-model="vm.settings.jsonValue.smtpProtocol">
 			              	<md-option ng-repeat="smtpProtocol in vm.smtpProtocols" value="{{smtpProtocol}}">
 			                	{{smtpProtocol.toUpperCase()}}
 			             	 </md-option>
@@ -77,48 +77,55 @@
 				              <div translate ng-message="pattern">admin.timeout-invalid</div>
 				              <div translate ng-message="md-maxlength">admin.timeout-invalid</div>
 	       				</div>				
-					</md-input-container>	
-					<md-checkbox ng-disabled="$root.loading"
-								 aria-label="{{ 'admin.enable-tls' | translate }}" ng-model="vm.settings.jsonValue.enableTls">{{ 'admin.enable-tls' | translate }}</md-checkbox>
+					</md-input-container>
+					<md-checkbox class="md-block" layout="row"
+								 aria-label="{{ 'admin.enable-tls' | translate }}"
+								 ng-model="vm.settings.jsonValue.enableTls">
+						{{ 'admin.enable-tls' | translate }}
+					</md-checkbox>
 					<md-input-container class="md-block" ng-if="vm.settings.jsonValue.enableTls">
 						<label translate>admin.tls-version</label>
-						<md-select ng-disabled="$root.loading" ng-model="vm.settings.jsonValue.tlsVersion">
+						<md-select ng-model="vm.settings.jsonValue.tlsVersion">
 							<md-option ng-repeat="tlsVersion in vm.tlsVersions" value="{{tlsVersion}}">
 								{{tlsVersion}}
 							</md-option>
 						</md-select>
 					</md-input-container>
-					<md-checkbox class="md-block" flex="100" flex-gt-sm="60" ng-disabled="$root.loading" aria-label="{{ 'admin.enable-proxy' | translate }}" ng-model="vm.settings.jsonValue.enableProxy">
+					<md-checkbox class="md-block" layout="row"
+								 aria-label="{{ 'admin.enable-proxy' | translate }}"
+								 ng-model="vm.settings.jsonValue.enableProxy">
 						{{ 'admin.enable-proxy' | translate }}
 					</md-checkbox>
-					<div layout-gt-sm="row">
-					<md-input-container class="md-block" flex="100" flex-gt-sm="60" ng-if="vm.settings.jsonValue.enableProxy">
-						<label translate>admin.proxy-host</label>
-						<input required name="proxyHost" ng-model="vm.settings.jsonValue.proxyHost">
-						<div ng-messages="vm.settingsForm.proxyHost.$error">
-							<div translate ng-message="required">admin.proxy-host-required</div>
+					<section ng-if="vm.settings.jsonValue.enableProxy">
+						<div layout-gt-sm="row">
+							<md-input-container class="md-block" flex="100" flex-gt-sm="60">
+								<label translate>admin.proxy-host</label>
+								<input required name="proxyHost" ng-model="vm.settings.jsonValue.proxyHost">
+								<div ng-messages="vm.settingsForm.proxyHost.$error">
+									<div translate ng-message="required">admin.proxy-host-required</div>
+								</div>
+							</md-input-container>
+							<md-input-container class="md-block" flex="100" flex-gt-sm="40">
+								<label translate>admin.proxy-port</label>
+								<input required name="proxyPort" ng-model="vm.settings.jsonValue.proxyPort"
+									   ng-pattern="/^([0-9]{1,4}|[1-5][0-9]{4}|6[0-4][0-9]{3}|65[0-4][0-9]{2}|655[0-2][0-9]|6553[0-5])$/"
+									   md-maxlength="5">
+								<div ng-messages="vm.settingsForm.proxyPort.$error" role="alert" multiple>
+									<div translate ng-message="required">admin.proxy-port-required</div>
+									<div translate ng-message="pattern">admin.proxy-port-invalid</div>
+									<div translate ng-message="md-maxlength">admin.proxy-port-invalid</div>
+								</div>
+							</md-input-container>
 						</div>
-					</md-input-container>
-					<md-input-container ng-if="vm.settings.jsonValue.enableProxy" class="md-block" flex="100" flex-gt-sm="40">
-						<label translate>admin.proxy-port</label>
-						<input required name="proxyPort" ng-model="vm.settings.jsonValue.proxyPort"
-							   ng-pattern="/^([0-9]{1,4}|[1-5][0-9]{4}|6[0-4][0-9]{3}|65[0-4][0-9]{2}|655[0-2][0-9]|6553[0-5])$/"
-							   md-maxlength="5">
-						<div ng-messages="vm.settingsForm.proxyPort.$error" role="alert" multiple>
-							<div translate ng-message="required">admin.proxy-port-required</div>
-							<div translate ng-message="pattern">admin.proxy-port-invalid</div>
-							<div translate ng-message="md-maxlength">admin.proxy-port-invalid</div>
-						</div>
-					</md-input-container>
-					</div>
-					<md-input-container class="md-block" ng-if="vm.settings.jsonValue.enableProxy">
-						<label translate>admin.proxy-user</label>
-						<input name="proxyUser" ng-model="vm.settings.jsonValue.proxyUser">
-					</md-input-container>
-					<md-input-container class="md-block" ng-if="vm.settings.jsonValue.enableProxy">
-						<label translate>admin.proxy-password</label>
-						<input name="proxyPassword" ng-model="vm.settings.jsonValue.proxyPassword">
-					</md-input-container>
+						<md-input-container class="md-block">
+							<label translate>admin.proxy-user</label>
+							<input name="proxyUser" ng-model="vm.settings.jsonValue.proxyUser">
+						</md-input-container>
+						<md-input-container class="md-block">
+							<label translate>admin.proxy-password</label>
+							<input name="proxyPassword" ng-model="vm.settings.jsonValue.proxyPassword">
+						</md-input-container>
+					</section>
 					<md-input-container class="md-block">
 						<label translate>common.username</label>
 						<input name="username" placeholder="{{ 'common.enter-username' | translate }}" ng-model="vm.settings.jsonValue.username">