energylink/public/app/features/alerting/partials/notification_edit.html

<navbar icon="fa fa-fw fa-list" title="Alerting" title-url="alerting">
</navbar>

<div class="page-container" >
	<div class="page-header">
		<h1>Alert notification</h1>
  </div>

	<div class="gf-form-group">
		<div class="gf-form">
			<span class="gf-form-label width-8">Name</span>
			<input type="text" class="gf-form-input max-width-15" ng-model="ctrl.notification.name" required></input>
		</div>
		<div class="gf-form">
			<span class="gf-form-label width-8">Type</span>
			<div class="gf-form-select-wrapper width-15">
				<select class="gf-form-input"
					ng-model="ctrl.notification.type"
					ng-options="t for t in ['webhook', 'email']"
					ng-change="ctrl.typeChanged(notification, $index)">
				</select>
			</div>
		</div>
	</div>

	<div class="gf-form-group" ng-show="ctrl.notification.type === 'webhook'">
    <h3 class="page-heading">Webhook settings</h3>
		<div class="gf-form">
			<span class="gf-form-label width-6">Url</span>
			<input type="text" class="gf-form-input max-width-26" ng-model="ctrl.notification.settings.url"></input>
		</div>
		<div class="gf-form-inline">
			<div class="gf-form">
				<span class="gf-form-label width-6">Username</span>
				<input type="text" class="gf-form-input max-width-10" ng-model="ctrl.notification.settings.username"></input>
			</div>
			<div class="gf-form">
				<span class="gf-form-label width-6">Password</span>
				<input type="text" class="gf-form-input max-width-10" ng-model="ctrl.notification.settings.password"></input>
			</div>
		</div>
	</div>
	<div class="gf-form-group section" ng-show="ctrl.notification.type === 'email'">
    <h3 class="page-heading">Email addresses</h3>
		<div class="gf-form">
      <textarea rows="7" class="gf-form-input width-25" ng-ctrl="ctrl.notification.settings.addresses"></textarea>
		</div>
	</div>

  <div class="gf-form-button-group">
    <button ng-click="ctrl.save()" class="btn btn-success">Save</button>
  </div>
</div>