1<loader loading="loading"></loader>
2<div id="configuration-snmp">
3  <div class="row column">
4    <h1>SNMP settings</h1>
5    <div class="small-12 snmp_description">
6      Set the Simple Network Management Protocol (SNMP) with a host name or IP address and a port.
7    </div>
8    <div class="page-header">
9      <h2>Managers</h2>
10    </div>
11  </div>
12  <div class="row column">
13    <div class="small-8">
14      <div class="row column manager_group">
15        <div class="small-5 snmp__address">
16          <h3>Host name or IP Address</h3>
17        </div>
18        <div class="small-5 snmp__port label">
19          <h3>Port</h3>
20        </div>
21      </div>
22      <div class="row column manager_group empty" ng-if="managers.length <1">
23        No managers have been added yet.
24      </div>
25      <form id="snmp__form" name="snmp__form" novalidate>
26        <div class="row column manager_group" ng-form="manager_group" ng-repeat="manager in managers track by $index">
27          <div class="small-11 snmp__fields">
28            <div class="row column">
29              <div class="small-10">
30                <div class="row column">
31                  <div class="small-offset-6 small-6 help__text snmp__port">
32                    Value must be between 0-65,535
33                  </div>
34                </div>
35                <div class="row column" ng-class="{'submitted':submitted}">
36                  <div class="small-6 snmp__address">
37                    <input id="snmp-manager{{$index+1}}-address"
38                           name="snmp-manager{{$index+1}}-address"
39                           type="text"
40                           ng-change="manager.updateAddress=true"
41                           ng-model="manager.address"
42                           required />
43                    <div ng-messages="manager_group['snmp-manager'+($index+1)+'-address'].$error" class="form-error" ng-class="{'visible': manager_group['snmp-manager'+($index+1)+'-address'].$touched || submitted}">
44                      <p ng-message="required" role="alert">Field is required</p>
45                    </div>
46                  </div>
47                  <div class="small-6 snmp__port">
48                    <input id="snmp-manager{{$index+1}}-port"
49                           name="snmp-manager{{$index+1}}-port"
50                           type="number"
51                           min="0"
52                           max="65535"
53                           step="1"
54                           ng-change="manager.updatePort=true"
55                           ng-model="manager.port"
56                           required/>
57                    <div ng-messages="manager_group['snmp-manager'+($index+1)+'-port'].$error" class="form-error" ng-class="{'visible': manager_group['snmp-manager'+($index+1)+'-port'].$touched || submitted}">
58                      <div ng-message-exp="['min', 'max', 'number', 'step']">
59                        Invalid format
60                      </div>
61                      <p ng-message="required" role="alert">Field is required</p>
62                    </div>
63                  </div>
64                </div>
65              </div>
66              <div class="small-2 align-self-center snmp__buttons">
67                <button class="edit_button" type="button">
68                  <img src="../../assets/images/icon-edit-blue.svg" alt="Edit">
69                </button>
70              </div>
71            </div>
72          </div>
73          <div class="small-1 align-self-center snmp__buttons trash">
74            <button class="trash_button" type="button" ng-click="removeSNMPManager($index)">
75              <img src="../../assets/images/icon-trashcan-blue.svg" alt="Remove">
76            </button>
77          </div>
78        </div>
79        <div class="row column">
80          <button class="btn-add" type="button" ng-click="submitted=false; addNewSNMPManager();"><img class="add__icon" src="../../assets/images/icon-plus.svg" alt=""/> Add manager</button>
81        </div>
82      </form>
83    </div>
84  </div>
85  <div class="row column">
86    <div class="snmp__submit-wrapper">
87      <button type="button" ng-click="submitted=true;  snmp__form.$valid && setSNMP();" class="btn-primary inline">Save settings</button>
88      <button type="button" class="btn-secondary inline" ng-click="refresh()">Cancel</button>
89    </div>
90  </div>
91</div>