consul/ui-v2/app/templates/dc/services/index.hbs

62 lines
2.5 KiB
Handlebars

{{#app-view class="service list"}}
{{#block-slot name='notification' as |status type|}}
{{partial 'dc/services/notifications'}}
{{/block-slot}}
{{#block-slot name='header'}}
<h1>
Services <em>{{format-number items.length}} total</em>
</h1>
<label for="toolbar-toggle"></label>
{{/block-slot}}
{{#block-slot name='toolbar'}}
{{#if (gt items.length 0) }}
{{phrase-editor
placeholder='service:name tag:name status:critical search-term'
value=(slice 0 terms.length terms)
onchange=(action (mut terms) value='target.value')
searchable=searchable
}}
{{/if}}
{{/block-slot}}
{{#block-slot name='content'}}
{{#changeable-set dispatcher=searchable}}
{{#block-slot name='set' as |filtered|}}
{{#tabular-collection
route='dc.services.show'
key='Name'
items=filtered as |item index|
}}
{{#block-slot name='header'}}
<th style={{remainingWidth}}>Service</th>
<th style={{totalWidth}}>Health Checks<span><em role="tooltip">The number of health checks for the service on all nodes</em></span></th>
<th style={{remainingWidth}}>Tags</th>
{{/block-slot}}
{{#block-slot name='row'}}
<td data-test-service="{{item.Name}}" style={{remainingWidth}}>
<a href={{href-to 'dc.services.show' item.Name}}>
<span data-test-external-source="{{service/external-source item}}" style={{{ concat 'background-image: ' (css-var (concat '--' (service/external-source item) '-color-svg') 'none')}}}></span>
{{item.Name}}
</a>
</td>
<td style={{totalWidth}}>
{{healthcheck-info
passing=item.ChecksPassing warning=item.ChecksWarning critical=item.ChecksCritical
passingWidth=passingWidth warningWidth=warningWidth criticalWidth=criticalWidth
}}
</td>
<td style={{remainingWidth}}>
{{tag-list items=item.Tags}}
</td>
{{/block-slot}}
{{/tabular-collection}}
{{/block-slot}}
{{#block-slot name='empty'}}
<p>
There are no services.
</p>
{{/block-slot}}
{{/changeable-set}}
{{/block-slot}}
{{/app-view}}