AMBARI-8338. Alerts UI: Unable to enable/disable definition from the definition details page.(xiwang)

ambari-web/app/messages.js

@@ -844,6 +844,8 @@ Em.I18n.translations = {
   'alerts.filters.filteredAlertsInfo': '{0} of {1} alerts showing',
 
   'alerts.thresholds': 'Thresholds',
+  'alerts.definition.details.enable': 'Enable',
+  'alerts.definition.details.disable': 'Disable',
   'alerts.definition.details.enableDisable': 'Enable / Disable',
   'alerts.definition.details.groups': 'Groups',
   'alerts.definition.details.instances': 'Instances',

ambari-web/app/templates/main/alerts/definition_details.hbs

@@ -94,8 +94,13 @@
         {{t common.service}}: <span class="label label-info">{{controller.content.service.serviceName}}</span>
       </div>
       <div>
-        <button {{action disableEnableAlertDefinition target="view"}} class="btn btn-primary"><i
-            class="icon-power-off"></i>&nbsp;{{t alerts.definition.details.enableDisable}}</button>
+        {{#if controller.content.enabled}}
+          <button {{action toggleState target="view"}} class="btn btn-danger"><i
+             class="icon-power-off"></i>&nbsp;{{t alerts.definition.details.disable}}</button>
+        {{else}}
+          <button {{action toggleState target="view"}} class="btn btn-success"><i
+             class="icon-power-off"></i>&nbsp;{{t alerts.definition.details.enable}}</button>
+        {{/if}}
         <button {{action deleteAlertDefinition target="view"}} class="btn btn-primary"><i
             class="icon-trash"></i>&nbsp;{{t common.delete}}</button>
       </div>

ambari-web/app/views/main/alerts/definition_details_view.js

@@ -120,10 +120,21 @@ App.MainAlertDefinitionDetailsView = App.TableView.extend({
 
   /**
    * "Disable / Enable" button handler
-   * @param event
+   * @returns {$.ajax}
+   * @method toggleState
    */
-  disableEnableAlertDefinition: function (event) {
-    // todo: provide disabling/enabling of alert definition
+  toggleState: function() {
+    var alertDefinition = this.get('controller.content');
+    return App.ajax.send({
+      name: 'alerts.update_alert_definition',
+      sender: this,
+      data: {
+        id: alertDefinition.get('id'),
+        data: {
+          "AlertDefinition/enabled": !alertDefinition.get('enabled')
+        }
+      }
+    });
   },
 
   /**