github.com/manicqin/nomad@v0.9.5/ui/app/templates/clients/client.hbs (about) 1 {{title "Client " (or model.name model.shortId)}} 2 <section class="section"> 3 <h1 data-test-title class="title"> 4 <span data-test-node-status="{{model.compositeStatus}}" class="node-status-light {{model.compositeStatus}}"></span> 5 {{or model.name model.shortId}} 6 <span class="tag is-hollow is-small no-text-transform"> 7 {{model.id}} 8 {{copy-button clipboardText=model.id}} 9 </span> 10 </h1> 11 12 <div class="boxed-section is-small"> 13 <div class="boxed-section-body inline-definitions"> 14 <span class="label">Client Details</span> 15 <span class="pair" data-test-status-definition> 16 <span class="term">Status</span> 17 <span class="status-text node-{{model.status}}">{{model.status}}</span> 18 </span> 19 <span class="pair" data-test-address-definition> 20 <span class="term">Address</span> 21 {{model.httpAddr}} 22 </span> 23 <span class="pair" data-test-draining> 24 <span class="term">Draining</span> 25 {{#if model.isDraining}} 26 <span class="status-text is-info">true</span> 27 {{else}} 28 false 29 {{/if}} 30 </span> 31 <span class="pair" data-test-eligibility> 32 <span class="term">Eligibility</span> 33 {{#if model.isEligible}} 34 {{model.schedulingEligibility}} 35 {{else}} 36 <span class="status-text is-warning">{{model.schedulingEligibility}}</span> 37 {{/if}} 38 </span> 39 <span class="pair" data-test-datacenter-definition> 40 <span class="term">Datacenter</span> 41 {{model.datacenter}} 42 </span> 43 <span class="pair" data-test-driver-health> 44 <span class="term">Drivers</span> 45 {{#if model.unhealthyDrivers.length}} 46 {{x-icon "warning" class="is-text is-warning"}} 47 {{model.unhealthyDrivers.length}} of {{model.detectedDrivers.length}} {{pluralize "driver" model.detectedDrivers.length}} unhealthy 48 {{else}} 49 All healthy 50 {{/if}} 51 </span> 52 </div> 53 </div> 54 55 {{#if model.drainStrategy}} 56 <div class="boxed-section is-small is-info"> 57 <div class="boxed-section-body inline-definitions"> 58 <span class="label">Drain Strategy</span> 59 <span class="pair" data-test-drain-deadline> 60 <span class="term">Deadline</span> 61 {{#if model.drainStrategy.isForced}} 62 <span class="badge is-danger">Forced Drain</span> 63 {{else if model.drainStrategy.hasNoDeadline}} 64 No deadline 65 {{else}} 66 {{format-duration model.drainStrategy.deadline}} 67 {{/if}} 68 </span> 69 {{#if model.drainStrategy.forceDeadline}} 70 <span class="pair" data-test-drain-forced-deadline> 71 <span class="term">Forced Deadline</span> 72 {{format-ts model.drainStrategy.forceDeadline}} 73 ({{moment-from-now model.drainStrategy.forceDeadline interval=1000}}) 74 </span> 75 {{/if}} 76 <span class="pair" data-test-drain-ignore-system-jobs> 77 <span class="term">Ignore System Jobs?</span> 78 {{if model.drainStrategy.ignoreSystemJobs "Yes" "No"}} 79 </span> 80 </div> 81 </div> 82 {{/if}} 83 84 <div class="boxed-section"> 85 <div class="boxed-section-head is-hollow"> 86 Resource Utilization 87 </div> 88 <div class="boxed-section-body"> 89 <div class="columns"> 90 <div class="column"> 91 {{primary-metric resource=model metric="cpu"}} 92 </div> 93 <div class="column"> 94 {{primary-metric resource=model metric="memory"}} 95 </div> 96 </div> 97 </div> 98 </div> 99 100 <div class="boxed-section"> 101 <div class="boxed-section-head"> 102 <div> 103 Allocations 104 <button role="button" class="badge is-white" onclick={{action "setPreemptionFilter" false}} data-test-filter-all> 105 {{model.allocations.length}} 106 </button> 107 {{#if preemptions.length}} 108 <button role="button" class="badge is-warning" onclick={{action "setPreemptionFilter" true}} data-test-filter-preemptions> 109 {{preemptions.length}} {{pluralize "preemption" preemptions.length}} 110 </button> 111 {{/if}} 112 </div> 113 {{search-box 114 searchTerm=(mut searchTerm) 115 onChange=(action resetPagination) 116 placeholder="Search allocations..." 117 class="is-inline pull-right" 118 inputClass="is-compact"}} 119 </div> 120 <div class="boxed-section-body is-full-bleed"> 121 {{#list-pagination 122 source=sortedAllocations 123 size=pageSize 124 page=currentPage as |p|}} 125 {{#list-table 126 source=p.list 127 sortProperty=sortProperty 128 sortDescending=sortDescending 129 class="with-foot" as |t|}} 130 {{#t.head}} 131 <th class="is-narrow"></th> 132 {{#t.sort-by prop="shortId"}}ID{{/t.sort-by}} 133 {{#t.sort-by prop="modifyIndex" title="Modify Index"}}Modified{{/t.sort-by}} 134 {{#t.sort-by prop="createIndex" title="Create Index"}}Created{{/t.sort-by}} 135 {{#t.sort-by prop="statusIndex"}}Status{{/t.sort-by}} 136 {{#t.sort-by prop="job.name"}}Job{{/t.sort-by}} 137 {{#t.sort-by prop="jobVersion"}}Version{{/t.sort-by}} 138 <th>CPU</th> 139 <th>Memory</th> 140 {{/t.head}} 141 {{#t.body as |row|}} 142 {{allocation-row 143 allocation=row.model 144 context="node" 145 onClick=(action "gotoAllocation" row.model) 146 data-test-allocation=row.model.id}} 147 {{/t.body}} 148 {{/list-table}} 149 <div class="table-foot"> 150 <nav class="pagination"> 151 <div class="pagination-numbers"> 152 {{p.startsAt}}–{{p.endsAt}} of {{sortedAllocations.length}} 153 </div> 154 {{#p.prev class="pagination-previous"}} < {{/p.prev}} 155 {{#p.next class="pagination-next"}} > {{/p.next}} 156 <ul class="pagination-list"></ul> 157 </nav> 158 </div> 159 {{/list-pagination}} 160 </div> 161 </div> 162 163 <div data-test-client-events class="boxed-section"> 164 <div class="boxed-section-head"> 165 Client Events 166 </div> 167 <div class="boxed-section-body is-full-bleed"> 168 {{#list-table source=sortedEvents class="is-striped" as |t|}} 169 {{#t.head}} 170 <th class="is-2">Time</th> 171 <th class="is-2">Subsystem</th> 172 <th>Message</th> 173 {{/t.head}} 174 {{#t.body as |row|}} 175 <tr data-test-client-event> 176 <td data-test-client-event-time>{{format-ts row.model.time}}</td> 177 <td data-test-client-event-subsystem>{{row.model.subsystem}}</td> 178 <td data-test-client-event-message> 179 {{#if row.model.message}} 180 {{#if row.model.driver}} 181 <span class="badge is-secondary is-small">{{row.model.driver}}</span> 182 {{/if}} 183 {{row.model.message}} 184 {{else}} 185 <em>No message</em> 186 {{/if}} 187 </td> 188 </tr> 189 {{/t.body}} 190 {{/list-table}} 191 </div> 192 </div> 193 194 <div data-test-driver-status class="boxed-section"> 195 <div class="boxed-section-head"> 196 Driver Status 197 </div> 198 <div class="boxed-section-body"> 199 {{#list-accordion source=sortedDrivers key="name" as |a|}} 200 {{#a.head buttonLabel="details" isExpandable=a.item.detected}} 201 <div class="columns inline-definitions {{unless a.item.detected "is-faded"}}"> 202 <div class="column is-1"> 203 <span data-test-name>{{a.item.name}}</span> 204 </div> 205 <div class="column is-2"> 206 {{#if a.item.detected}} 207 <span data-test-health> 208 <span class="color-swatch {{a.item.healthClass}}"></span> 209 {{if a.item.healthy "Healthy" "Unhealthy"}} 210 </span> 211 {{/if}} 212 </div> 213 <div class="column"> 214 <span class="pair"> 215 <span class="term">Detected</span> 216 <span data-test-detected>{{if a.item.detected "Yes" "No"}}</span> 217 </span> 218 <span class="is-pulled-right"> 219 <span class="pair"> 220 <span class="term">Last Updated</span> 221 <span data-test-last-updated class="tooltip" aria-label="{{format-ts a.item.updateTime}}"> 222 {{moment-from-now a.item.updateTime interval=1000}} 223 </span> 224 </span> 225 </span> 226 </div> 227 </div> 228 {{/a.head}} 229 {{#a.body}} 230 <p data-test-health-description class="message">{{a.item.healthDescription}}</p> 231 <div data-test-driver-attributes class="boxed-section"> 232 <div class="boxed-section-head"> 233 {{capitalize a.item.name}} Attributes 234 </div> 235 {{#if a.item.attributes.attributesStructured}} 236 <div class="boxed-section-body is-full-bleed"> 237 {{attributes-table 238 attributes=a.item.attributesShort 239 class="attributes-table"}} 240 </div> 241 {{else}} 242 <div class="boxed-section-body"> 243 <div class="empty-message"> 244 <h3 class="empty-message-headline">No Driver Attributes</h3> 245 </div> 246 </div> 247 {{/if}} 248 </div> 249 {{/a.body}} 250 {{/list-accordion}} 251 </div> 252 </div> 253 254 <div class="boxed-section"> 255 <div class="boxed-section-head"> 256 Attributes 257 </div> 258 <div class="boxed-section-body is-full-bleed"> 259 {{attributes-table 260 data-test-attributes 261 attributes=model.attributes.attributesStructured 262 class="attributes-table"}} 263 </div> 264 <div class="boxed-section-head"> 265 Meta 266 </div> 267 {{#if model.meta.attributesStructured}} 268 <div class="boxed-section-body is-full-bleed"> 269 {{attributes-table 270 data-test-meta 271 attributes=model.meta.attributesStructured 272 class="attributes-table"}} 273 </div> 274 {{else}} 275 <div class="boxed-section-body"> 276 <div data-test-empty-meta-message class="empty-message"> 277 <h3 class="empty-message-headline">No Meta Attributes</h3> 278 <p class="empty-message-body">This client is configured with no meta attributes.</p> 279 </div> 280 </div> 281 {{/if}} 282 </div> 283 </section>