| <ol class="breadcrumb"> |
| <li> |
| <a class="badge badge-type" href="#">Master</a> |
| </li> |
| <li class="active"> |
| <span class="badge badge-type">Agent</span> |
| {{agent_id}} |
| </li> |
| </ol> |
| |
| <div class="alert alert-error hidden" id="alert"> |
| <button class="close" data-dismiss="alert">×</button> |
| <strong>{{alert_message}}</strong> |
| </div> |
| |
| <div class="row" id="agent"> |
| <div class="col-md-3"> |
| <div class="well"> |
| <dl class="inline clearfix"> |
| <dt>Cluster:</dt> |
| <dd> |
| <span ng-show="clusterNamed">{{cluster}}</span> |
| <span ng-show="!clusterNamed"> |
| (Unnamed) |
| <i class="icon-info-sign" |
| tooltip="To name this cluster, set the --cluster flag when starting the master." |
| tooltip-placement="right"></i> |
| </span> |
| </dd> |
| <dt>Agent:</dt> |
| <dd>{{state.hostname}}</dd> |
| <dt>Version:</dt> |
| <dd>{{state.version}}</dd> |
| <dt>Built:</dt> |
| <dd> |
| <m-timestamp value="{{state.build_time * 1000}}"></m-timestamp> |
| </dd> |
| <dt>Started:</dt> |
| <dd> |
| <m-timestamp value="{{state.start_time * 1000}}"></m-timestamp> |
| </dd> |
| <dt>Master:</dt> |
| <dd>{{state.master_hostname}}</dd> |
| </dl> |
| <p><a href="" ng-click="log($event)">LOG</a></p> |
| |
| <h4>Tasks</h4> |
| <table class="table table-condensed"> |
| <tbody> |
| <tr> |
| <td>Staging</td> |
| <td class="text-right">{{staging_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Starting</td> |
| <td class="text-right">{{starting_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Running</td> |
| <td class="text-right">{{running_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Killing</td> |
| <td class="text-right">{{killing_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Finished</td> |
| <td class="text-right">{{finished_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Killed</td> |
| <td class="text-right">{{killed_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Failed</td> |
| <td class="text-right">{{failed_tasks | number}}</td> |
| </tr> |
| <tr> |
| <td>Lost</td> |
| <td class="text-right">{{lost_tasks | number}}</td> |
| </tr> |
| </tbody> |
| </table> |
| |
| <h4>Resources</h4> |
| <table class="table table-condensed"> |
| <thead> |
| <tr> |
| <td></td> |
| <td class="text-right">Used</td> |
| <td class="text-right">Allocated</td> |
| <td class="text-right">Available</td> |
| <td class="text-right">Total</td> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <td>CPUs</td> |
| <td class="text-right"> |
| {{monitor.statistics.cpus_total_usage | number}} |
| </td> |
| <td class="text-right"> |
| {{state.allocated_resources.cpus | number}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.cpus - state.allocated_resources.cpus | number}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.cpus | number}} |
| </td> |
| </tr> |
| <tr> |
| <td>GPUs</td> |
| <td class="text-right"> |
| N/A |
| </td> |
| <td class="text-right"> |
| {{state.allocated_resources.gpus | number}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.gpus - state.allocated_resources.gpus | number}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.gpus | number}} |
| </td> |
| </tr> |
| <tr> |
| <td>Memory</td> |
| <td class="text-right"> |
| {{monitor.statistics.mem_rss_bytes | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{state.allocated_resources.mem * (1024 * 1024) | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{(state.resources.mem - state.allocated_resources.mem) * (1024 * 1024) | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.mem * (1024 * 1024) | dataSize}} |
| </td> |
| </tr> |
| <tr> |
| <td>Disk</td> |
| <td class="text-right"> |
| {{monitor.statistics.disk_used_bytes | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{state.allocated_resources.disk * (1024 * 1024) | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{(state.resources.disk - state.allocated_resources.disk) * (1024 * 1024) | dataSize}} |
| </td> |
| <td class="text-right"> |
| {{state.resources.disk * (1024 * 1024) | dataSize}} |
| </td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| |
| </div> |
| <div class="col-md-9"> |
| <table m-table table-content="agent.reserved_resources_as_array" title="Resource Reservations" |
| class="table table-striped table-bordered table-condensed"> |
| <thead> |
| <tr> |
| <th data-key="role">Reservation Role</th> |
| <th data-key="cpus">CPUs (Allocated / Total)</th> |
| <th data-key="gpus">GPUs (Allocated / Total)</th> |
| <th data-key="mem">Mem (Allocated / Total)</th> |
| <th data-key="disk">Disk (Allocated / Total)</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr> |
| <td><em>Unreserved</em></td> |
| <td>{{state.unreserved_resources_allocated.cpus | number}} / {{state.unreserved_resources.cpus | number}}</td> |
| <td>{{state.unreserved_resources_allocated.gpus | number}} / {{state.unreserved_resources.gpus | number}}</td> |
| <td>{{state.unreserved_resources_allocated.mem * (1024 * 1024) | dataSize}} / {{state.unreserved_resources.mem * (1024 * 1024) | dataSize}}</td> |
| <td>{{state.unreserved_resources_allocated.disk * (1024 * 1024) | dataSize}} / {{state.unreserved_resources.disk * (1024 * 1024) | dataSize}}</td> |
| </tr> |
| <tr ng-repeat="reservation in $data"> |
| <td>{{reservation.role}}</td> |
| <td>{{(state.reserved_resources_allocated[reservation.role].cpus || 0) | number}} / {{reservation.cpus | number}}</td> |
| <td>{{(state.reserved_resources_allocated[reservation.role].gpus || 0) | number}} / {{reservation.gpus | number}}</td> |
| <td>{{(state.reserved_resources_allocated[reservation.role].mem * (1024 * 1024) || 0) | dataSize}} / {{reservation.mem * (1024 * 1024) | dataSize}}</td> |
| <td>{{(state.reserved_resources_allocated[reservation.role].disk * (1024 * 1024) || 0) | dataSize}} / {{reservation.disk * (1024 * 1024) | dataSize}}</td> |
| </tr> |
| </tbody> |
| </table> |
| |
| <table m-table table-content="agent.frameworks" title="Frameworks" |
| class="table table-striped table-bordered table-condensed"> |
| <thead> |
| <tr> |
| <th data-key="id">ID</th> |
| <th data-key="user">User</th> |
| <th data-key="name">Name</th> |
| <th data-key="roles">Roles</th> |
| <th data-key="num_tasks">Active Tasks</th> |
| <th data-key="cpus">CPUs (Used / Allocated)</th> |
| <th data-key="gpus">GPUs (Used / Allocated)</th> |
| <th data-key="mem">Mem (Used / Allocated)</th> |
| <th data-key="disk">Disk (Used / Allocated)</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr ng-repeat="framework in $data"> |
| <td> |
| <a href="{{'#/agents/' + agent_id + '/frameworks/' + framework.id}}"> |
| {{(framework.id | truncateMesosID) || framework.name}}</a> |
| <button class="btn btn-xs btn-toggle btn-default" |
| clipboard |
| data-clipboard-text="{{framework.id}}" |
| tooltip="Copy ID" |
| tooltip-placement="right" |
| tooltip-trigger="clipboardhover"> |
| </button> |
| </td> |
| <td>{{framework.user}}</td> |
| <td>{{framework.name}}</td> |
| <!-- TODO(bmahler): This doesn't display well when there are a lot |
| of roles (e.g. a large organization with a lot of teams & |
| services, using roles like /engineering/frontend/webserver, etc). |
| Figure out a way to display this without bloating the table. --> |
| <td>{{framework.roles.toString()}}</td> |
| <td>{{framework.num_tasks | number}}</td> |
| <td>{{monitor.frameworks[framework.id].statistics.cpus_total_usage | number}} / {{framework.cpus | number}}</td> |
| <!-- TODO(haosdent): We need to show statistics for gpu once it is provided in monitor endpoint. --> |
| <td>N/A</td> |
| <td>{{monitor.frameworks[framework.id].statistics.mem_rss_bytes | dataSize}} / {{framework.mem * (1024 * 1024) | dataSize}}</td> |
| <td>{{monitor.frameworks[framework.id].statistics.disk_used_bytes | dataSize}} / {{framework.disk * (1024 * 1024) | dataSize}}</td> |
| </tr> |
| </tbody> |
| </table> |
| |
| <table m-table table-content="agent.completed_frameworks" title="Completed Frameworks" |
| class="table table-striped table-bordered table-condensed"> |
| <thead> |
| <tr> |
| <th data-key="id">ID</th> |
| <th data-key="user">User</th> |
| <th data-key="name">Name</th> |
| <th data-key="roles">Roles</th> |
| <th data-key="tasks.length">Active Tasks</th> |
| <th data-key="resources.cpus">CPUs</th> |
| <th data-key="resources.gpus">GPUs</th> |
| <th data-key="resources.mem">Mem</th> |
| <th data-key="resources.disk">Disk</th> |
| </tr> |
| </thead> |
| <tbody> |
| <tr ng-repeat="completed_framework in $data"> |
| <td> |
| <a href="{{'#/agents/' + agent_id + '/frameworks/' + completed_framework.id}}"> |
| {{completed_framework.id | truncateMesosID}}</a> |
| <button class="btn btn-xs btn-toggle btn-default" |
| clipboard |
| data-clipboard-text="{{framework.id}}" |
| tooltip="Copy ID" |
| tooltip-placement="right" |
| tooltip-trigger="clipboardhover"> |
| </button> |
| </td> |
| <td>{{completed_framework.user}}</td> |
| <td>{{completed_framework.name}}</td> |
| <!-- TODO(bmahler): This doesn't display well when there are a lot |
| of roles (e.g. a large organization with a lot of teams & |
| services, using roles like /engineering/frontend/webserver, etc). |
| Figure out a way to display this without bloating the table. --> |
| <td>{{completed_framework.roles.toString()}}</td> |
| <td>{{completed_framework.num_tasks | number}}</td> |
| <td>{{completed_framework.cpus | number}}</td> |
| <td>{{completed_framework.gpus | number}}</td> |
| <td>{{completed_framework.mem * (1024 * 1024) | dataSize}}</td> |
| <td>{{completed_framework.disk * (1024 * 1024) | dataSize}}</td> |
| </tr> |
| </tbody> |
| </table> |
| </div> |
| </div> |