| Current File : //usr/local/jetapps/var/www/jetbackup5/docroot/app/views/dashboard.htm |
<div ng-controller="dashboard" class="dashboard">
<div class="row top_tiles">
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats pointer" ng-click="changeView('alerts')">
<div class="icon"><em class="fas fa-exclamation-triangle"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
{{ (!loadingStatistics && stats.alerts >= 0 ? stats.alerts : lang.t("N/A")) }}
</div>
<h3>{{ lang.t("New Alerts") }}</h3>
</div>
</div>
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats pointer" ng-click="changeView('accounts')">
<div class="icon"><em class="fas fa-users"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
{{ (!loadingStatistics && stats.accounts >= 0 ? stats.accounts : lang.t("N/A")) }}
</div>
<h3>{{ lang.t("Total Accounts") }}</h3>
</div>
</div>
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats pointer" ng-click="changeView('backupJobs')">
<div class="icon"><em class="fas fa-cubes"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
<div ng-show="!loadingStatistics && stats.backup_jobs < 0 && stats.clone_jobs < 0">{{lang.t("N/A")}}</div>
<div ng-show="!loadingStatistics">
<span ng-show="stats.backup_jobs >= 0">{{stats.backup_jobs}} <small style="font-size: 14px;">{{lang.t("Backup")}}</small></span>
<span ng-show="stats.clone_jobs >= 0">{{stats.clone_jobs}} <small style="font-size: 14px;">{{lang.t("Clone")}}</small></span>
</div>
</div>
<h3>{{ lang.t("Total Jobs") }}</h3>
</div>
</div>
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats pointer" ng-click="changeView('accounts')">
<div class="icon"><em class="fas fa-database"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
{{ (!loadingStatistics && stats.backups >= 0 ? stats.backups : lang.t("N/A")) }}
</div>
<h3>{{ lang.t("Total Backups") }}</h3>
</div>
</div>
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats">
<div class="icon"><em class="fas fa-hdd"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
{{ (!loadingStatistics && stats.disk_usage >= 0 ? util.sizeToNumber(stats.disk_usage, false, 1) : lang.t("N/A")) }}
</div>
<h3>{{ lang.t("Total Accounts Usage (%s)", (!loadingStatistics && stats.disk_usage > 0 ? util.sizeToType(stats.disk_usage) : "KB")) }}</h3>
</div>
</div>
<div class="col-xl-4 col-lg-4 col-md-6 col-sm-6 col-xs-12">
<div class="tile-stats pointer" ng-click="changeView('queue')">
<div class="icon"><em class="fas fa-tasks"></em></div>
<div class="count">
<span ng-show="loadingStatistics"><em class='fa fa-cog fa-spin'></em></span>
<div ng-show="!loadingStatistics && stats.backup_jobs_running < 0 && stats.clone_jobs_running < 0">{{lang.t("N/A")}}</div>
<div ng-show="!loadingStatistics">
<span ng-show="stats.backup_jobs_running >= 0">{{stats.backup_jobs_running}} <small style="font-size: 14px;">{{lang.t("Backup")}}</small></span>
<span ng-show="stats.clone_jobs_running >= 0">{{stats.clone_jobs_running}} <small style="font-size: 14px;">{{lang.t("Clone")}}</small></span>
</div>
</div>
<h3>{{ lang.t("Jobs Running") }}</h3>
</div>
</div>
</div>
<div class="row">
<!-- RECENT ALERTS -->
<div ng-show="perm.canViewAlerts" class="col-xl-6 col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/alerts" ng-click="changeView('alerts')" title="{{ lang.t('Recent JetBackup Alerts') }}">{{ lang.t("Recent Alerts") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<ul class="list-unstyled timeline">
<li ng-repeat="alert in alerts track by $index" id="alert_row_{{$index}}" ng-click="changeView('alerts')" class="pointer">
<div class="block">
<div class="tags {{ const.ALERT_LEVEL_TYPES[alert.level] }}"><a href="" class="tag"><span>{{ const.ALERT_LEVEL_NAMES[alert.level] }}</span></a></div>
<div class="block_content">
<h2 class="title"><a>{{ alert.title }}</a></h2>
<div class="byline"><span>{{ lang.d(alert.created) }}</span></div>
<p class="excerpt">{{ alert.message }}</p>
</div>
</div>
</li>
<li ng-hide="!loadingStatistics && !loadingAlerts">
<loading-box><span>{{ lang.t("Loading Items") }}</span></loading-box>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/queue" ng-click="changeView('queue')" title="{{ lang.t('Go to Queue page') }}">{{ lang.t("Queue Summary") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content queue-summary">
<div class="row">
<div class="col-md-3 col-xs-6">
<div class="tile-stats">
<div class="count"><span>{{queue_summary.pending}}</span> <em class="fas fa-clock"></em></div>
<h3>{{ lang.t("Pending") }}</h3>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="tile-stats">
<div class="count"><span>{{queue_summary.processing}}</span> <em class="fas fa-running"></em></div>
<h3>{{ lang.t("Processing") }}</h3>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="tile-stats">
<div class="count"><span>{{queue_summary.completed}}</span> <em class="fas fa-check"></em></div>
<h3>{{ lang.t("Completed") }}</h3>
</div>
</div>
<div class="col-md-3 col-xs-6">
<div class="tile-stats">
<div class="count"><span>{{queue_summary.failed}}</span> <em class="fas fa-times"></em></div>
<h3>{{ lang.t("Failed/Canceled") }}</h3>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/queue" ng-click="changeView('queue')" title="{{ lang.t('Go to Queue page') }}">{{ lang.t("Latest Queue") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="table-responsive">
<table class="table table-striped content-table">
<thead>
<tr class="headings">
<th class="col-sm-2 col-md-2 col-lg-2 column-title">
{{ lang.t("Type") }}
</th>
<th class="col-sm-3 col-md-3 col-lg-3 column-title">
{{ lang.t("Information") }}
</th>
<th class="col-sm-2 col-md-2 col-lg-2 column-title">
{{ lang.t("Created") }}
</th>
<th class="col-sm-1 col-md-1 col-lg-1 column-title">
{{ lang.t("Owner") }}
</th>
<th class="col-sm-4 col-md-4 col-lg-4 column-title">
{{ lang.t("Status") }}
</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="group in queues">
<td data-title="{{ lang.t('Type') }}">
{{ const.QUEUE_ITEM_TYPE_NAMES[group.type] }}
</td>
<td data-title="{{ lang.t('Information') }}">
<div ng-repeat="(key, value) in group.data">{{key.replace("_", '')|capitalize}}: {{value}}</div>
</td>
<td data-title="{{ lang.t('Created') }}">
{{ lang.d(group.created, 'shorttime') }}
</td>
<td data-title="{{ lang.t('Owner') }}">
{{ group.owner_name ? group.owner_name : '-' }}
</td>
<td data-title="{{ lang.t('Status') }}">
<div ng-class="{
'text-green': group.status == const.QUEUE_STATUS_COMPLETED,
'text-yellow': group.status == const.QUEUE_STATUS_PARTIALLY,
'text-red': (group.status == const.QUEUE_STATUS_FAILED || group.status == const.QUEUE_STATUS_ABORTED || group.status == const.QUEUE_STATUS_NEVER_FINISHED)
}">
<span ng-class="{
'fas fa-spin fa-circle-notch': group.status >= const.QUEUE_STATUS_PROCESSING && group.status < const.QUEUE_STATUS_COMPLETED,
'fas fa-check': group.status == const.QUEUE_STATUS_COMPLETED,
'fas fa-times': group.status == const.QUEUE_STATUS_FAILED || group.status == const.QUEUE_STATUS_ABORTED || group.status == const.QUEUE_STATUS_NEVER_FINISHED,
'fas fa-exclamation-triangle': group.status == const.QUEUE_STATUS_PARTIALLY,
'far fa-clock': group.status == const.QUEUE_STATUS_PENDING
}"></span>
<strong ng-show="group.status <= const.QUEUE_STATUS_PROCESSING || group.status >= const.QUEUE_STATUS_COMPLETED">{{ const.QUEUE_STATUS_NAMES[group.status] }}</strong>
<strong ng-show="group.status > const.QUEUE_STATUS_PROCESSING && group.status < const.QUEUE_STATUS_COMPLETED">{{ const.QUEUE_STATUS_NAMES[group.type][group.status] }}</strong>
</div>
<uib-progressbar ng-show="group.status >= const.QUEUE_STATUS_PROCESSING && group.status < const.QUEUE_STATUS_COMPLETED" class="progress-striped active" max="100" value="group.items_progress_percentage"><span style="color:black; white-space:nowrap; text-align: center;">{{ lang.t("%s out of %s (%s%%)", group.items_completed, group.items, group.items_progress_percentage) }}</span></uib-progressbar>
<div style="font-size: 11px;">{{ lang.t("State changed at %s", lang.d(group.status_time, 'shorttime')) }}</div>
</td>
</tr>
<tr ng-hide="!loadingStatistics && !loadingQueues">
<td colspan="5">
<loading-box><span>{{ lang.t("Loading Queue Items") }}</span></loading-box>
</td>
</tr>
<tr ng-hide="queues.length > 0 || loadingStatistics || loadingQueues">
<td colspan="5">
<span>{{ lang.t("No Queue Items Found") }}</span>
</td>
</tr>
</tbody>
</table>
</div>
<pagination fetch="listQueueItems" meta="queueMeta"></pagination>
</div>
</div>
</div>
</div>
</div>
<!-- EOF RECENT ALERTS -->
<div class="col-xl-6 col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="row">
<div ng-show="perm.canManageDestinations" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/destinations" ng-click="changeView('/destinations')" title="{{ lang.t('Click for destinations page') }}">{{ lang.t("Destinations List") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="table-responsive">
<table class="table table-striped content-table">
<thead>
<tr class="headings">
<th class="column-title">{{ lang.t("Name") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Type") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Disk Info") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Total Jobs") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Status") }}</th>
</tr>
</thead>
<tbody>
<tr class="even pointer" ng-repeat="destination in destinations" ng-click="changeView('/destinationManage/' + destination._id)">
<td>
{{ destination.name }}
<div ng-show="destination.reindex" style="font-size: 11px;"><span class="fas fa-spin fa-circle-notch"></span> {{ lang.t("Reindex in process") }}</div>
</td>
<td style="text-align: center;">{{ destination.type }}</td>
<td>
<span ng-hide="destination.disk_usage" style="font-size: 11px;">{{ lang.t("N/A") }}</span>
<span ng-show="destination.disk_usage" style="font-size: 11px;">{{ lang.t("%s used / %s total (%s free)", util.sizeToHumanReadable(destination.disk_usage.usage), util.sizeToHumanReadable(destination.disk_usage.total), util.sizeToHumanReadable(destination.disk_usage.free)) }}</span>
<p style="margin: 0; padding: 0; font-size: 11px; font-weight: bold;">{{ lang.t("Last Updated at %s", destination.update_date ? lang.d(destination.update_date, 'shorttime') : lang.t("Never")) }}</p>
</td>
<td style="text-align: center;">{{ destination.count }}</td>
<td ng-click="$event.stopPropagation();" style="text-align: center;">
<button ng-click="toggleDestinationStatus(destination)" class="toggle-switch"><em class="fas toggle-icon" ng-class="{ 'fa-toggle-on text-green': !destination.disabled, 'fa-toggle-on text-gray': destination.disabled }"></em></button>
</td>
</tr>
<tr ng-hide="!loadingStatistics && !loadingDestinations">
<td colspan="5">
<loading-box><span>{{ lang.t("Loading Destinations") }}</span></loading-box>
</td>
</tr>
<tr ng-hide="destinations.length > 0 || loadingStatistics || loadingDestinations">
<td colspan="5">
<span>{{ lang.t("No Destinations Found") }}</span>
</td>
</tr>
</tbody>
</table>
</div>
<pagination fetch="listDestinations" meta="destinationMeta"></pagination>
</div>
</div>
</div>
<div ng-show="perm.canManageBackupJobs" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/backupJobs" ng-click="changeView('/backupJobs')" title="{{ lang.t('Go to backup jobs page') }}">{{ lang.t("Backup Jobs List") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="table-responsive">
<table class="table table-striped content-table">
<thead>
<tr class="headings">
<th class="column-title">{{ lang.t("Name") }}</th>
<th class="column-title">{{ lang.t("Type") }}</th>
<th class="column-title">{{ lang.t("Schedules") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Next Run") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Last Run") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Status") }}</th>
</tr>
</thead>
<tbody>
<tr class="even pointer" ng-repeat="backup in backups track by $index" id="backup_row_{{$index}}" ng-click="changeView('/backupJobManage/' + backup._id)">
<td>{{ backup.name }}</td>
<td>
{{ backup.contains_name }} - {{ const.BACKUP_STRUCTURE_NAMES[backup.structure] }} {{ backup.encrypted ? lang.t("Encrypted") : ''}}
</td>
<td>
<ul style="margin: 0; padding: 0 0 0 10px;">
<li ng-repeat="schedule in backup.schedules">{{ schedule.name }} <small>({{ lang.t("Retain %s Backups", schedule.retain) }})</small></li>
<li ng-hide="backup.schedules.length">{{ lang.t("Manually") }}</li>
</ul>
</td>
<td style="text-align: center;">
<div ng-if="backup.running">
<span class="fas fa-spin fa-circle-notch"></span>
{{ lang.t("Backup Job Running") }}...
</div>
<div ng-if="!backup.running && !backup.next_run">{{ lang.t("Never") }}</div>
<div ng-if="!backup.running && backup.next_run && !backup.disabled">{{ lang.d(backup.next_run) }}</div>
<div ng-if="!backup.running && backup.next_run && backup.disabled">{{ lang.t("Never") }}<br /><span style="font-size: 8px;">{{ lang.t("Backup Job Disabled") }}</span></div>
</td>
<td style="text-align: center;">{{ backup.last_run ? lang.d(backup.last_run, 'shorttime') : lang.t('Never') }}</td>
<td ng-click="$event.stopPropagation();" style="text-align: center;">
<button ng-click="toggleBackupJobStatus(backup)" class="toggle-switch"><em class="fas toggle-icon" ng-class="{ 'fa-toggle-on text-green': !backup.disabled, 'fa-toggle-on text-gray': backup.disabled }"></em></button>
</td>
</tr>
<tr ng-hide="!loadingStatistics && !loadingBackups">
<td colspan="6">
<loading-box><span>{{ lang.t("Loading Backup Jobs") }}</span></loading-box>
</td>
</tr>
<tr ng-hide="backups.length > 0 || loadingStatistics || loadingBackups">
<td colspan="6">
<span>{{ lang.t("No Backup Jobs Found") }}</span>
</td>
</tr>
</tbody>
</table>
</div>
<pagination fetch="listBackupJobs" meta="backupMeta"></pagination>
</div>
</div>
</div>
<div ng-show="perm.canManageCloneJobs" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<div class="x_panel">
<div class="x_title">
<h2><a href="{{primaryURL}}/cloneJobs" ng-click="changeView('/cloneJobs')" title="{{ lang.t('Go to clone jobs page') }}">{{ lang.t("Clone Jobs List") }}</a></h2>
<div class="clearfix"></div>
</div>
<div class="x_content">
<div class="table-responsive">
<table class="table table-striped content-table">
<thead>
<tr class="headings">
<th class="column-title">{{ lang.t("Name") }}</th>
<th class="column-title">{{ lang.t("Type") }}</th>
<th class="column-title">{{ lang.t("Schedules") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Next Run") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Last Run") }}</th>
<th style="text-align: center;" class="column-title">{{ lang.t("Status") }}</th>
</tr>
</thead>
<tbody>
<tr class="even pointer" ng-repeat="clone in clones track by $index" id="clone_row_{{$index}}" ng-click="changeView('/cloneJobManage/' + clone._id)">
<td>{{ clone.name }}</td>
<td>
{{ clone.contains_name }}
</td>
<td>
<ul style="margin: 0; padding: 0 0 0 10px;">
<li ng-repeat="schedule in clone.schedules">{{ schedule.name }}</li>
<li ng-hide="clone.schedules.length">{{ lang.t("Manually") }}</li>
</ul>
</td>
<td style="text-align: center;">
<div ng-if="clone.running">
<span class="fas fa-spin fa-circle-notch"></span>
{{ lang.t("Clone Job Running") }}...
</div>
<div ng-if="!clone.running && !clone.next_run">{{ lang.t("Never") }}</div>
<div ng-if="!clone.running && clone.next_run && !clone.disabled">{{ lang.d(clone.next_run) }}</div>
<div ng-if="!clone.running && clone.next_run && clone.disabled">{{ lang.t("Never") }}<br /><span style="font-size: 8px;">{{ lang.t("Clone Job Disabled") }}</span></div>
</td>
<td style="text-align: center;">{{ clone.last_run ? lang.d(clone.last_run, 'shorttime') : lang.t('Never') }}</td>
<td ng-click="$event.stopPropagation();" style="text-align: center;">
<button ng-click="toggleCloneJobStatus(clone)" class="toggle-switch"><em class="fas toggle-icon" ng-class="{ 'fa-toggle-on text-green': !clone.disabled, 'fa-toggle-on text-gray': clone.disabled }"></em></button>
</td>
</tr>
<tr ng-hide="!loadingStatistics && !loadingClones">
<td colspan="6">
<loading-box><span>{{ lang.t("Loading Clone Jobs") }}</span></loading-box>
</td>
</tr>
<tr ng-hide="clones.length > 0 || loadingStatistics || loadingClones">
<td colspan="6">
<span>{{ lang.t("No Clones Jobs Found") }}</span>
</td>
</tr>
</tbody>
</table>
</div>
<pagination fetch="listCloneJobs" meta="cloneMeta"></pagination>
</div>
</div>
</div>
</div>
</div>
</div>
</div>