wazuh-kibana-app/public/templates/agents.html

<div flex ng-controller="agentsController" layout="column">

	<md-content class="md-padding">
		<md-nav-bar md-selected-nav-item="menuNavItem" nav-bar-aria-label="navigation menu">
			<md-nav-item id="header_logo" md-nav-href="http://wazuh.com" name="wazuh" aria-label="img logo">
					<img aria-label="Logo image" src="/plugins/wazuh/icon.png" height="44" weight="252"></img>
			</md-nav-item>
			<md-nav-item md-nav-href="#/manager" name="manager">Manager</md-nav-item>
			<md-nav-item md-nav-href="#/agents" name="agents">Agents</md-nav-item>
			<md-nav-item md-nav-href="#/ruleset" name="ruleset">Ruleset</md-nav-item>
			<md-nav-item md-nav-href="#/fim" name="fim">File integrity</md-nav-item>
			<md-nav-item md-nav-href="#/policy_monitoring" name="policy_monitoring">Policy monitoring</md-nav-item>
			<md-nav-item md-nav-href="#/settings" name="settings">Settings</md-nav-item>
		</md-nav-bar>
	</md-content>

	<md-progress-linear md-mode="indeterminate" ng-show="load"></md-progress-linear>

	<md-content class="md-padding">
		<md-nav-bar md-selected-nav-item="submenuNavItem" nav-bar-aria-label="navigation submenu">
			<md-nav-item md-nav-href="#/agents" name="overview">Overview</md-nav-item>
			<md-nav-item md-nav-href="#/agents/metrics" name="metrics">Metrics</md-nav-item>
		</md-nav-bar>
	</md-content>

	<div flex layout="row" ng-if="!load">
		<md-content flex id="content" layout-padding>
			<md-toolbar class="md-primary _md" ng-show="_agent">
				<div class="md-toolbar-tools">
					<h3 class="ng-binding">{{_agent.id}} - {{_agent.name}}</h3>
				</div>
			</md-toolbar>
			<md-tabs md-dynamic-height md-border-bottom ng-show="_agent" flex>
				<md-tab label="Global" flex>
					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-list class="md-dense" flex>
							<md-list-item class="md-2-line">
								<div class="md-list-item-text" layout="column">
									<h3>ID</h3>
									<p>{{_agent.id}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line">
								<div class="md-list-item-text" layout="column">
									<h3>Name</h3>
									<p>{{_agent.name}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line md-offset">
								<div class="md-list-item-text" layout="column">
									<h3>IP address</h3>
									<p>{{_agent.ip}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line md-offset">
								<div class="md-list-item-text" layout="column">
									<h3>Status</h3>
									<p>{{_agent.status}}</p>
								</div>
							</md-list-item>
						</md-list>
						<md-list class="md-dense" flex>
							<md-list-item class="md-2-line md-offset">
								<div class="md-list-item-text" layout="column">
									<h3>Operative system</h3>
									<p>{{agentInfo.os}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line md-offset">
								<div class="md-list-item-text" layout="column">
									<h3>Client version</h3>
									<p>{{agentInfo.version}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line md-offset">
								<div class="md-list-item-text" layout="column">
									<h3>Last keep alive</h3>
									<p>{{agentInfo.lastKeepAlive}}</p>
								</div>
							</md-list-item>
							<md-list-item class="md-2-line md-offset" ng-class="{ hidden: (_agent.id == '000') }">
								<div class="md-list-item-text" layout="column">
									<h3>Agent key</h3>
									<input aria-label="Agent key" ng-model="agentInfo.key" disabled></input>
								</div>
							</md-list-item>
						</md-list>
					</div>
					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-button md-no-ink class="md-primary" ng-class="{ hidden: (_agent.id == '000') }" ng-click="restart(_agent)">
							<span class="form-group-addon glyphicon glyphicon-repeat iconControl"></span> Restart
						</md-button>
						<md-button md-no-ink class="md-primary" ng-class="{ hidden: (_agent.id == '000') }" ng-click="delete(_agent, $event)">
							<span class="form-group-addon glyphicon glyphicon-remove iconControl"></span> Delete
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name)">
							<span class="form-group-addon glyphicon glyphicon-share iconControl"></span> Discover alerts
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAgentMetrics(_agent.name)">
							<span class="form-group-addon glyphicon glyphicon-share iconControl"></span> Metrics
						</md-button>
					</div>
				</md-tab>
				<md-tab label="File integrity" flex>
					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-list class="md-dense" flex layout="column">
							<md-list-item class="md-2-line" layout="column">
								<div class="md-list-item-text" layout="column">
									<h3>Last scan started</h3>
									<p>{{agentInfo.syscheckTime}}</p>
								</div>
							</md-list-item>
						</md-list>
						<md-list class="md-dense" flex layout="column">
							<md-list-item class="md-2-line" layout="column">
								<div class="md-list-item-text" layout="column">
									<h3>Last scan ended</h3>
									<p>{{agentInfo.syscheckEndTime}}</p>
								</div>
							</md-list-item>
						</md-list>
					</div>

					<md-toolbar layout="row" class="md-hue-3" ng-if="agentInfo.syscheckEvents.length > 0" hide-xs>
						<div class="md-toolbar-tools">
							<span flex="40">File</span>
							<span flex="10">Event</span>
							<span flex="10">Perms</span>
							<span flex="10">User</span>
							<span flex="10">Group</span>
							<span flex="10">Date</span>
						</div>
					</md-toolbar>
					<md-list ng-repeat="event in agentInfo.syscheckEvents" ng-if="agentInfo.syscheckEvents.length > 0" hide-xs>
						<md-list-item>
							<span flex="40">{{event.file}}</span>
							<span flex="10">{{event.event.charAt(0).toUpperCase() + event.event.slice(1)}}</span>
							<span flex="10">{{event.octalMode.slice(-4)}}</span>
							<span flex="10">{{event.user}}</span>
							<span flex="10">{{event.group}}</span>
							<span flex="10">{{event.modificationDate}}</span>
						</md-list-item>
					</md-list>


					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-button md-no-ink class="md-primary" ng-click="loadFIM(_agent.id);">
							<span class="form-group-addon glyphicon glyphicon-share iconControl"></span> Details
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="runSyscheck(_agent);">
							<span class="form-group-addon glyphicon glyphicon-repeat iconControl"></span> Restart scan
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="deleteSyscheck(_agent, $event);">
							<span class="form-group-addon glyphicon glyphicon-remove iconControl"></span> Clear database
						</md-button>
					</div>
				</md-tab>
				<md-tab label="Rootcheck" flex>
					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-list class="md-dense" flex layout="column">
								<md-list-item class="md-2-line" layout="column">
									<div class="md-list-item-text" layout="column">
										<h3>Last scan started</h3>
										<p>{{agentInfo.rootcheckTime}}</p>
									</div>
								</md-list-item>
							</md-list>
							<md-list class="md-dense" flex layout="column">
								<md-list-item class="md-2-line" layout="column">
									<div class="md-list-item-text" layout="column">
										<h3>Last scan ended</h3>
										<p>{{agentInfo.rootcheckEndTime}}</p>
									</div>
								</md-list-item>
						</md-list>
					</div>


					<md-toolbar layout="row" class="md-hue-3" ng-if="agentInfo.rootcheckEvents.length > 0" hide-xs>
						<div class="md-toolbar-tools">
							<span flex="50">Control</span>
							<span flex="25">Detected</span>
							<span flex="25">Last scan</span>
						</div>
					</md-toolbar>
					<md-list ng-repeat="event in agentInfo.rootcheckEvents" ng-if="agentInfo.rootcheckEvents.length > 0" hide-xs>
						<md-list-item>
							<span flex="50">{{event.event.length > 53 ? event.event.substring(0, 50)+'...' : event.event}}</span>
							<span flex="25">{{event.oldDay}}</span>
							<span flex="25">{{event.readDay}}</span>
						</md-list-item>
					</md-list>


					<div flex layout="row" layout-sm="column" layout-xs="column">
						<md-button md-no-ink class="md-primary" ng-click="loadRootcheck(_agent.id);">
							<span class="form-group-addon glyphicon glyphicon-share iconControl"></span> Details
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="runSyscheck(_agent);">
							<span class="form-group-addon glyphicon glyphicon-repeat iconControl"></span> Restart scan
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="deleteRootcheck(_agent, $event);">
							<span class="form-group-addon glyphicon glyphicon-remove iconControl"></span> Clear database
						</md-button>
					</div>
				</md-tab>
				<md-tab label="Discover" flex>
					<div flex layout="column">
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.AlertLevel:>10')">
							High risk level
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.groups:attacks')">
							Attacks
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.groups:syscheck')">
							FIM
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.groups:rootcheck')">
							Rootcheck
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.groups:sshd')">
							SSHD
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name, 'rule.groups:authentication_failures')">
							Auth failures
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadAlertsUrl(_agent.name)">
							Discover alerts
						</md-button>
					</div>
				</md-tab>
				<md-tab label="Dashboards" flex>
					<div flex layout="column">
						<md-button md-no-ink class="md-primary" ng-click="loadDashboardUrl(_agent.name)">
							Alerts
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadComplianceDashboardUrl(_agent.name, 'pci');">
							PCI compliance
						</md-button>
						<md-button md-no-ink class="md-primary" ng-click="loadComplianceDashboardUrl(_agent.name, 'cis');">
							CIS compliance
						</md-button>
					</div>
				</md-tab>
			</md-tabs>
		</md-content>

		<md-sidenav md-is-open="isOpenSidenav" md-component-id="agentsNav" md-is-locked-open="$mdMedia('gt-sm')" md-disable-backdrop
			layout="column" class="md-sidenav-right md-whiteframe-z2" flex="30">
			<md-icon md-font-icon="fa fa-times" aria-label="close lateral menu" ng-click="isOpenSidenav = !isOpenSidenav" hide-gt-sm></md-icon>
			<md-input-container class="sideNavBox">
				<label for="searchBox">Search</label>
				<input type="text" id="searchBox" ng-model="$parent.search" ng-change="agentsGet()" md-autofocus flex>
				<md-icon md-font-icon="fa fa-cog" ng-click="showFiltersDialog()" />
			</md-input-container>
			<md-chips>
				<md-chip ng-show="statusFilter">{{statusFilter}}</md-chip>
				<md-chip ng-show="!statusFilter">all</md-chip>
				<md-chip ng-show="sortKey">
					{{sortKey}}
					<span class="glyphicon sort-icon" ng-class="{'glyphicon-triangle-top':reverse,'glyphicon-triangle-bottom':!reverse}"></span>
				</md-chip>
			</md-chips>
			<md-virtual-repeat-container class="vertical-repeater" >
				<div md-virtual-repeat="agent in agentsObj" md-on-demand flex>
					<div layout="column" layout-align="space-around stretch">
						<md-card ng-click="fetchAgent(agent)">
							<md-card-title>
								<md-card-title-text>
									<span class="md-title">{{agent.id}} <span ng-if="agent.id == '000'">(Manager)</span></span>
									<span class="md-subhead">{{agent.name}} - {{agent.ip}}</span>
								</md-card-title-text>
								<div layout="column" class="status" ng-class="getAgentStatusClass(agent.status);">
								</div>
							</md-card-title>
						</md-card>
					</div>
				</div>
			</md-virtual-repeat-container>
		</md-sidenav>
		<md-button ng-show="!isOpenSidenav" class="md-icon-button md-primary" ng-click="isOpenSidenav = !isOpenSidenav" aria-label="Agents"
			hide-gt-sm>
			<span class="glyphicon glyphicon-menu-hamburger"></span>
		</md-button>
	</div>

	<div style="display: none">
		<div class="md-dialog-container" id="filtersDialog">
			<md-dialog layout-padding layout="column" layout-align="space-around center">
				<label>Filter by status:</label>
				<md-input-container>
					<md-select ng-model="statusFilter" ng-change="agentStatusFilter()" aria-label="Filter by status">
						<md-option value="all">All</md-option>
						<md-option value="active">Active</md-option>
						<md-option value="disconnected">Disconnected</md-option>
						<md-option value="never connected">Never connected</md-option>
					</md-select>
				</md-input-container>
				<label>Order by:</label>
				<div flex layout="row" layout-align="space-around center" md-disable-backdrop class="md-padding">
					<md-button class="md-primary" ng-click="sort('status')">
						<span>Status</span>
						<span class="glyphicon sort-icon" ng-show="sortKey=='status'" ng-class="{'glyphicon-triangle-top':reverse,'glyphicon-triangle-bottom':!reverse}"></span>
						<span class="glyphicon sort-icon glyphicon-minus" ng-show="sortKey!='status'"></span>
					</md-button>
					<md-button class="md-primary" ng-click="sort('ip')">
						<span>IP</span>
						<span class="glyphicon sort-icon" ng-show="sortKey=='ip'" ng-class="{'glyphicon-triangle-top':reverse,'glyphicon-triangle-bottom':!reverse}"></span>
						<span class="glyphicon sort-icon glyphicon-minus" ng-show="sortKey!='ip'"></span>
					</md-button>
					<md-button class="md-primary" ng-click="sort('name')">
						<span>Name</span>
						<span class="glyphicon sort-icon" ng-show="sortKey=='name'" ng-class="{'glyphicon-triangle-top':reverse,'glyphicon-triangle-bottom':!reverse}"></span>
						<span class="glyphicon sort-icon glyphicon-minus" ng-show="sortKey!='name'"></span>
					</md-button>
					<md-button class="md-primary" ng-click="sort('id')">
						<span>ID</span>
						<span class="glyphicon sort-icon" ng-show="sortKey=='id'" ng-class="{'glyphicon-triangle-top':reverse,'glyphicon-triangle-bottom':!reverse}"></span>
						<span class="glyphicon sort-icon glyphicon-minus" ng-show="sortKey!='id'"></span>
					</md-button>
				</div>
			</md-dialog>
		</div>
	</div>

</div>