Use accordion-table styles for application environment table
This commit is contained in:
parent
f6f093ef85
commit
5a10e0658a
@ -23,26 +23,25 @@
|
|||||||
<th scope='col' class='table-cell--align-right'>{{ "portfolios.applications.environments.members" | translate }}</th>
|
<th scope='col' class='table-cell--align-right'>{{ "portfolios.applications.environments.members" | translate }}</th>
|
||||||
</thead>
|
</thead>
|
||||||
|
|
||||||
<tbody v-for='(members_list, name) in environments' class='spend-table__portfolio'>
|
<tbody v-for='(members_list, name) in environments' class='accordion-table__items'>
|
||||||
<tr>
|
<tr>
|
||||||
<th scope='rowgroup' v-on:click="toggle($event, name)" v-html='name'></th>
|
<th scope='rowgroup' v-on:click="toggle($event, name)" v-html='name'></th>
|
||||||
|
|
||||||
<template v-if="environmentsState[name].isVisible">
|
<template v-if="environmentsState[name].isVisible">
|
||||||
<span v-on:click="toggle($event, name)" class='icon-link icon-link--large spend-table__application__toggler'>
|
<td v-on:click="toggle($event, name)" class='icon-link icon-link--large accordion-table__item__toggler'>Hide Members(<span v-html='members_list.length'></span>){{ Icon('caret_up') }}</td>
|
||||||
<td>Hide Members(<span v-html='members_list.length'></span>){{ Icon('caret_up') }}</td>
|
|
||||||
</template>
|
</template>
|
||||||
<template v-else>
|
<template v-else>
|
||||||
<span v-on:click="toggle($event, name)" class='icon-link icon-link--large spend-table__application__toggler'>
|
<td v-on:click="toggle($event, name)" class='icon-link icon-link--large accordion-table__item__toggler'>Show Members(<span v-html='members_list.length'></span>){{ Icon('caret_down') }}</td>
|
||||||
<td>Show Members(<span v-html='members_list.length'></span>){{ Icon('caret_down') }}</td>
|
|
||||||
</template>
|
</template>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
<tr scope='rowgroup' v-for='member in members_list' v-show='environmentsState[name].isVisible' class='spend-table__application__env'>
|
<tr scope='rowgroup' v-for='member in members_list' v-show='environmentsState[name].isVisible' class='accordion-table__item__expanded'>
|
||||||
<td class='accordion__item application-list-item__environment table-cell--expand'>
|
<td class='table-cell--expand'>
|
||||||
<div class='application-list-item__environment__name'>
|
<div>
|
||||||
<span v-html='member'></span>
|
<span v-html='member'></span>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
|
<td class='table-cell--expand'></td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user