github.com/manicqin/nomad@v0.9.5/ui/app/templates/allocations/allocation/index.hbs (about) 1 {{title "Allocation " model.name}} 2 <section class="section"> 3 {{#if error}} 4 <div data-test-inline-error class="notification is-danger"> 5 <div class="columns"> 6 <div class="column"> 7 <h3 data-test-inline-error-title class="title is-4">{{error.title}}</h3> 8 <p data-test-inline-error-body>{{error.description}}</p> 9 </div> 10 <div class="column is-centered is-minimum"> 11 <button data-test-inline-error-close class="button is-danger" onclick={{action onDismiss}}>Okay</button> 12 </div> 13 </div> 14 </div> 15 {{/if}} 16 17 <h1 data-test-title class="title with-headroom"> 18 Allocation {{model.name}} 19 <span class="bumper-left tag {{model.statusClass}}">{{model.clientStatus}}</span> 20 <span class="tag is-hollow is-small no-text-transform"> 21 {{model.id}} 22 {{copy-button clipboardText=model.id}} 23 </span> 24 {{#if model.isRunning}} 25 {{two-step-button 26 data-test-stop 27 idleText="Stop" 28 cancelText="Cancel" 29 confirmText="Yes, Stop" 30 confirmationMessage="Are you sure? This will reschedule the allocation on a different client." 31 awaitingConfirmation=stopAllocation.isRunning 32 disabled=(or stopAllocation.isRunning restartAllocation.isRunning) 33 onConfirm=(perform stopAllocation)}} 34 {{two-step-button 35 data-test-restart 36 idleText="Restart" 37 cancelText="Cancel" 38 confirmText="Yes, Restart" 39 confirmationMessage="Are you sure? This will restart the allocation in-place." 40 awaitingConfirmation=restartAllocation.isRunning 41 disabled=(or stopAllocation.isRunning restartAllocation.isRunning) 42 onConfirm=(perform restartAllocation)}} 43 {{/if}} 44 </h1> 45 46 <div class="boxed-section is-small"> 47 <div data-test-allocation-details class="boxed-section-body inline-definitions"> 48 <span class="label">Allocation Details</span> 49 <span class="pair job-link"><span class="term">Job</span> 50 {{#link-to "jobs.job" model.job (query-params jobNamespace=model.job.namespace.id) data-test-job-link}}{{model.job.name}}{{/link-to}} 51 </span> 52 <span class="pair node-link"><span class="term">Client</span> 53 {{#link-to "clients.client" model.node data-test-client-link}}{{model.node.shortId}}{{/link-to}} 54 </span> 55 </div> 56 </div> 57 58 <div class="boxed-section"> 59 <div class="boxed-section-head is-hollow"> 60 Resource Utilization 61 </div> 62 <div class="boxed-section-body"> 63 {{#if model.isRunning}} 64 <div class="columns"> 65 <div class="column"> 66 {{primary-metric resource=model metric="cpu"}} 67 </div> 68 <div class="column"> 69 {{primary-metric resource=model metric="memory"}} 70 </div> 71 </div> 72 {{else}} 73 <div data-test-resource-error class="empty-message"> 74 <h3 data-test-resource-error-headline class="empty-message-headline">Allocation isn't running</h3> 75 <p class="empty-message-body">Only running allocations utilize resources.</p> 76 </div> 77 {{/if}} 78 </div> 79 </div> 80 81 <div class="boxed-section"> 82 <div class="boxed-section-head"> 83 Tasks 84 </div> 85 <div class="boxed-section-body {{if sortedStates.length "is-full-bleed"}}"> 86 {{#if sortedStates.length}} 87 {{#list-table 88 source=sortedStates 89 sortProperty=sortProperty 90 sortDescending=sortDescending 91 class="is-striped" as |t|}} 92 {{#t.head}} 93 <th class="is-narrow"></th> 94 {{#t.sort-by prop="name"}}Name{{/t.sort-by}} 95 {{#t.sort-by prop="state"}}State{{/t.sort-by}} 96 <th>Last Event</th> 97 {{#t.sort-by prop="events.lastObject.time"}}Time{{/t.sort-by}} 98 <th>Addresses</th> 99 <th>CPU</th> 100 <th>Memory</th> 101 {{/t.head}} 102 {{#t.body as |row|}} 103 {{task-row 104 data-test-task-row=row.model.name 105 task=row.model 106 onClick=(action "taskClick" row.model.allocation row.model)}} 107 {{/t.body}} 108 {{/list-table}} 109 {{else}} 110 <div data-test-empty-tasks-list class="empty-message"> 111 <h3 data-test-empty-tasks-list-headline class="empty-message-headline">No Tasks</h3> 112 <p data-test-empty-tasks-list-body class="empty-message-body">Allocations will not have tasks until they are in a running state.</p> 113 </div> 114 {{/if}} 115 </div> 116 </div> 117 118 {{#if network.ports.length}} 119 <div class="boxed-section" data-test-allocation-ports> 120 <div class="boxed-section-head"> 121 Ports 122 </div> 123 <div class="boxed-section-body is-full-bleed"> 124 {{#list-table source=network.ports as |t|}} 125 {{#t.head}} 126 <th class="is-2">Name</th> 127 <th class="is-1">Dynamic?</th> 128 <th>Host Address</th> 129 <th>Mapped Port</th> 130 {{/t.head}} 131 {{#t.body as |row|}} 132 <tr data-test-allocation-port> 133 <td data-test-allocation-port-name>{{row.model.name}}</td> 134 <td data-test-allocation-port-is-dynamic>{{if row.model.isDynamic "Yes" "No"}}</td> 135 <td data-test-allocation-port-address> 136 <a href="http://{{network.ip}}:{{row.model.port}}" target="_blank" rel="noopener noreferrer">{{network.ip}}:{{row.model.port}}</a> 137 </td> 138 <td data-test-allocation-port-to>{{row.model.to}}</td> 139 </tr> 140 {{/t.body}} 141 {{/list-table}} 142 </div> 143 </div> 144 {{/if}} 145 146 {{#if services.length}} 147 <div class="boxed-section"> 148 <div class="boxed-section-head"> 149 Services 150 </div> 151 <div class="boxed-section-body is-full-bleed"> 152 {{#list-table source=services as |t|}} 153 {{#t.head}} 154 <th class="is-2">Name</th> 155 <th class="is-1">Port</th> 156 <td>Tags</td> 157 <td>Connect?</td> 158 <td>Upstreams</td> 159 {{/t.head}} 160 {{#t.body as |row|}} 161 <tr data-test-service> 162 <td data-test-service-name>{{row.model.name}}</td> 163 <td data-test-service-port>{{row.model.portLabel}}</td> 164 <td data-test-service-tags>{{join ", " row.model.tags}}</td> 165 <td data-test-service-connect>{{if row.model.connect "Yes" "No"}}</td> 166 <td data-test-service-upstreams> 167 {{#each row.model.connect.sidecarService.proxy.upstreams as |upstream|}} 168 {{upstream.destinationName}}:{{upstream.localBindPort}} 169 {{/each}} 170 </td> 171 </tr> 172 {{/t.body}} 173 {{/list-table}} 174 </div> 175 </div> 176 {{/if}} 177 178 {{#if model.hasRescheduleEvents}} 179 <div class="boxed-section" data-test-reschedule-events> 180 <div class="boxed-section-head is-hollow"> 181 Reschedule Events 182 </div> 183 <div class="boxed-section-body"> 184 {{reschedule-event-timeline allocation=model}} 185 </div> 186 </div> 187 {{/if}} 188 189 {{#if model.wasPreempted}} 190 <div class="boxed-section is-warning" data-test-was-preempted> 191 <div class="boxed-section-head">Preempted By</div> 192 <div class="boxed-section-body"> 193 {{#if (not preempter)}} 194 <div class="empty-message"> 195 <h3 class="empty-message-headline">Allocation is gone</h3> 196 <p class="empty-message-body">This allocation has been stopped and garbage collected.</p> 197 </div> 198 {{else}} 199 <div class="boxed-section is-small"> 200 <div class="boxed-section-body inline-definitions"> 201 <span class="pair"> 202 <span data-test-allocation-status class="tag {{preempter.statusClass}}"> 203 {{preempter.clientStatus}} 204 </span> 205 </span> 206 <span class="pair"> 207 <span class="term" data-test-allocation-name>{{preempter.name}}</span> 208 {{#link-to "allocations.allocation" preempter data-test-allocation-id}}{{preempter.shortId}}{{/link-to}} 209 </span> 210 <span class="pair job-link"><span class="term">Job</span> 211 {{#link-to "jobs.job" preempter.job (query-params jobNamespace=preempter.job.namespace.id) data-test-job-link}}{{preempter.job.name}}{{/link-to}} 212 </span> 213 <span class="pair job-priority"><span class="term">Priority</span> 214 <span data-test-job-priority>{{preempter.job.priority}}</span> 215 </span> 216 <span class="pair node-link"><span class="term">Client</span> 217 {{#link-to "clients.client" preempter.node data-test-client-link}}{{preempter.node.shortId}}{{/link-to}} 218 </span> 219 <span class="pair"><span class="term">Reserved CPU</span> 220 <span data-test-allocation-cpu>{{preempter.resources.cpu}} MHz</span> 221 </span> 222 <span class="pair"><span class="term">Reserved Memory</span> 223 <span data-test-allocation-memory>{{preempter.resources.memory}} MiB</span> 224 </span> 225 </div> 226 </div> 227 {{/if}} 228 </div> 229 </div> 230 {{/if}} 231 232 {{#if (and model.preemptedAllocations.isFulfilled model.preemptedAllocations.length)}} 233 <div class="boxed-section" data-test-preemptions> 234 <div class="boxed-section-head">Preempted Allocations</div> 235 <div class="boxed-section-body"> 236 {{#list-table 237 source=model.preemptedAllocations 238 class="allocations is-isolated" as |t|}} 239 {{#t.head}} 240 <th class="is-narrow"></th> 241 <th>ID</th> 242 <th>Task Group</th> 243 <th>Created</th> 244 <th>Modified</th> 245 <th>Status</th> 246 <th>Version</th> 247 <th>Node</th> 248 <th>CPU</th> 249 <th>Memory</th> 250 {{/t.head}} 251 {{#t.body as |row|}} 252 {{allocation-row allocation=row.model context="job" data-test-allocation=row.model.id}} 253 {{/t.body}} 254 {{/list-table}} 255 </div> 256 </div> 257 {{/if}} 258 </section>