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

<md-content ng-if="submenuNavItem == 'overview' && agentInfo" ng-controller="agentsOverviewController" class="app-container wazuh-column">

	<!--<div class='uil-ring-css' ng-if="tabView == 'panels'">
				<div></div>
			</div>-->

	<!-- Kibana search bar -->
	<!-- Local nav. -->
	<div ng-if="!loading" ng-controller="kibanaSearchbar">
		<kbn-top-nav name="agents_fim" config="topNavMenu">
			<!-- Transcluded elements. -->
			<div data-transclude-slots>
				<!-- Title. -->

				<!-- Search. -->
				<div ng-show="chrome.getVisible()" class="fullWidth" data-transclude-slot="bottomRow">
					<query-bar query="state.query" app-name="'wazuh'" on-submit="updateQueryAndFetch($query)">
					</query-bar>
				</div>
			</div>
		</kbn-top-nav>

		<!-- Filters. -->
		<filter-bar ng-show="showFilterBar()" state="state" index-patterns="indexPattern" ng-if="state.query.language === 'lucene'"></filter-bar>
	</div>


	<div ng-show='!loading' ng-if="tabView == 'panels'">
		<md-content layout="row">
			<md-card flex layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.name}}</div>
					<div class="ng-binding">Name</div>
				</md-card-content>
			</md-card>
			<md-card flex="10" layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.ip}}</div>
					<div class="ng-binding">IP Address</div>
				</md-card-content>
			</md-card>
			<md-card flex="10" layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{ agentInfo.version | limitTo: 12 }}{{agentInfo.version.length > 12 ? '...' : ''}}</div>
					<md-tooltip md-direction="bottom">{{ agentInfo.version }}</md-tooltip>
					<div class="ng-binding">Version</div>
				</md-card-content>
			</md-card>
			<md-card flex layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value legend-value-title ng-binding legend-value-truncate" style="font-size: 14pt;">{{ agentOs }}</div>
					<md-tooltip md-direction="bottom">{{ agentOs }}</md-tooltip>
					<div class="ng-binding">OS</div>
				</md-card-content>
			</md-card>
		</md-content>
		<md-content layout="row">
			<md-card flex layout="column" ng-show="agentInfo.id != '000'">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.lastKeepAlive}}</div>
					<div class="ng-binding">Last keep alive</div>
				</md-card-content>
			</md-card>
			<md-card flex layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.dateAdd}}</div>
					<div class="ng-binding">Registration date</div>
				</md-card-content>
			</md-card>
			<md-card flex layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.syscheck.end}}</div>
					<md-tooltip md-direction="bottom">
						Start time: {{ agentInfo.syscheck.start }}
						<br> End time: {{ agentInfo.syscheck.end }}
						<br> Duration time: {{ agentInfo.syscheck.duration }} minutes
					</md-tooltip>
					<div class="ng-binding">Last syscheck scan</div>
				</md-card-content>
			</md-card>
			<md-card flex layout="column">
				<md-card-content style="text-align: center;">
					<div class="metric-value ng-binding" style="font-size: 14pt;">{{agentInfo.rootcheck.end}}</div>
					<md-tooltip md-direction="bottom">
						Start time: {{ agentInfo.rootcheck.start }}
						<br> End time: {{ agentInfo.rootcheck.end }}
						<br> Duration time: {{ agentInfo.rootcheck.duration }} minutes
					</md-tooltip>
					<div class="ng-binding">Last rootcheck scan</div>
				</md-card-content>
			</md-card>
		</md-content>
	</div>

	<!-- No results message -->
	<md-content flex layout="row" layout-align="start start" ng-show="!results && !loading" ng-if="tabView == 'panels'">
		<md-card flex layout="column">
			<md-card-content style="text-align: center;">
				No results for selected time interval
			</md-card-content>
		</md-card>
	</md-content>

	<!-- View: Discover -->
	<md-content style="background-color: white" flex layout="column" layout-align="start space-around" ng-if="tabView == 'discover' && agentInfo.name">
		<kbn-disfull table-height="1000px;" dis-a="(columns:!(_source),filters:!(),index:'wazuh-alerts-*',interval:auto,query:(query_string:(analyze_wildcard:!t,query:'*')),sort:!('@timestamp',desc))"
		    infinite-scroll="true">
		</kbn-disfull>
	</md-content>

	<!-- View: Panels -->
	<div ng-show='results' ng-if="tabView == 'panels' && !loading">

		<div layout="row" layout-align="center stretch" class="wazuh-row" style="height: 174px;">
			<md-card flex="50" class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Top 5 alerts</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Top-5-alerts'" id="Wazuh-App-Agents-Overview-Top-5-alerts"></kbn-vis>
				</md-card-content>
			</md-card>
			<md-card flex="50" class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Top 5 groups</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Top-5-groups'" id="Wazuh-App-Agents-Overview-Top-5-groups"></kbn-vis>
				</md-card-content>
			</md-card>
		</div>

		<div layout="row" layout-align="center stretch" class="wazuh-row" style="height: 170px;">
			<md-card flex="50" class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Top 5 PCI DSS Requirements</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Top-5-PCI-DSS-Requirements'" id="Wazuh-App-Agents-Overview-Top-5-PCI-DSS-Requirements"></kbn-vis>
				</md-card-content>
			</md-card>
			<md-card flex="50" class="wazuh-row visBox-alert-level-evolution">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Alert level evolution</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Alert-level-evolution'" id="Wazuh-App-Agents-Overview-Alert-level-evolution"></kbn-vis>
				</md-card-content>
			</md-card>
			</div>
			<div layout="row" layout-align="center stretch" class="wazuh-row" style="height: 170px;">
			<md-card flex class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Alerts</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Alerts'" id="Wazuh-App-Agents-Overview-Alerts"></kbn-vis>
				</md-card-content>
			</md-card>
		</div>


		<div layout="row" layout-align="center stretch" class="wazuh-row" style="height: 480px;">
			<md-card flex="60" class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Alerts summary</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Alerts-summary'" id="Wazuh-App-Agents-Overview-Alerts-summary"></kbn-vis>
				</md-card-content>
			</md-card>
			<md-card flex="40" class="wazuh-row">
				<md-card-title>
					<md-card-title-text>
						<span class="md-headline">Groups summary</span>
					</md-card-title-text>
				</md-card-title>
				<md-card-content class="wazuh-row">
					<kbn-vis vis-id="'Wazuh-App-Agents-Overview-Groups-summary'" id="Wazuh-App-Agents-Overview-Groups-summary"></kbn-vis>
				</md-card-content>
			</md-card>
		</div>
	</div>
</md-content>