<h1 class=“page-header”>Table: {{keyspace.name}}.{{table.name}}</h1> <tabset>
<tab> <tab-heading>Rows <span class="badge">{{result.rows.length}}</span></tab-heading> <div class="row-limit"> <label for="limit">Row Limit</label> <input type="checkbox" title="Row Limit Checkbox" ng-model="rowLimit.enabled" value="rowLimit.enabled" /> <input id="limit" ng-model="rowLimit.value" ng-if="rowLimit.enabled" value="rowLimit.value" /> </div> <div> <button type="button" class="btn btn-danger" ng-click="executeStatement()">Fetch Rows</button> </div> <button class="btn btn-sm btn-warning loading-button" ng-show="loading"> <span class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span> Loading... </button> <table class="table table-striped table-hover" ng-if="result || error"> <thead> <tr> <th ng-repeat="column in table.columns">{{column.name}}</th> <th class="row-actions">Actions</th> </tr> </thead> <tbody> <tr ng-repeat="row in result.rows"> <td ng-repeat="column in table.columns"> {{row[column.name]}} </td> <td> <div class="btn-group"> <button type="button" class="btn btn-xs btn-default"><span class="glyphicon glyphicon-pencil"></span> Edit</button> <button type="button" class="btn btn-xs btn-danger"><span class="glyphicon glyphicon-minus"></span> Delete</button> </div> </td> </tr> </tbody> <tfoot> <tr> <td colspan="{{table.columns.length}}"> <span ng-show="result">Total: {{result.rows.length}} results</span> <dl ng-show="error"> <dt>{{error.class}}: {{error.message}}</dt> <dd ng-repeat="entry in error.trace track by $index">{{entry}}</dd> </dl> </td> <td> <button type="button" class="btn btn-xs btn-success"><span class="glyphicon glyphicon-plus"></span> Create</button> </td> </tr> </tfoot> </table> </tab> <tab heading="Columns"> <table class="table"> <thead> <tr> <th>Name</th> <th>Type</th> <th>Order</th> <th>Options</th> </tr> <thead> <tbody> <tr ng-repeat="column in table.columns"> <td>{{column.name}}</td> <td>{{column.type}}</td> <td>{{column.order}}</td> <td>{{column.options}}</td> </tr> </tbody> </table> </tab> <tab heading="Definition"> <p> <pre class="highlight"><code-highlight language="cql" code="{{table.cql}}" /></pre> </p> </tab>
</tabset>