blob: 58a46e0ef6a525c876950c40f6c3c16b95460055 [file] [log] [blame]
Matteo Scandolo9f87f302016-12-13 18:11:10 -08001<!--<div ng-show="vm.data.length > 0 && vm.loader == false">-->
2 <div class="row" ng-if="vm.config.filter == 'fulltext'">
3 <div class="col-xs-12">
4 <input
5 class="form-control"
6 placeholder="Type to search.."
7 type="text"
8 ng-model="vm.query"/>
9 </div>
10 </div>
11 <table ng-class="vm.classes">
12 <thead>
13 <tr>
14 <th ng-repeat="col in vm.columns">
15 {{col.label}}
16 <span ng-if="vm.config.order">
17 <a href="" ng-click="vm.orderBy = col.prop; vm.reverse = false">
18 <i class="glyphicon glyphicon-chevron-up"></i>
19 </a>
20 <a href="" ng-click="vm.orderBy = col.prop; vm.reverse = true">
21 <i class="glyphicon glyphicon-chevron-down"></i>
22 </a>
23 </span>
24 </th>
25 <th ng-if="vm.config.actions">Actions:</th>
26 </tr>
27 </thead>
28 <tbody ng-if="vm.config.filter == 'field'">
29 <tr>
30 <td ng-repeat="col in vm.columns">
31 <input
32 ng-if="col.type !== 'boolean' && col.type !== 'array' && col.type !== 'object' && col.type !== 'custom'"
33 class="form-control"
34 placeholder="Type to search by {{col.label}}"
35 type="text"
36 ng-model="vm.query[col.prop]"/>
37 <select
38 ng-if="col.type === 'boolean'"
39 class="form-control"
40 ng-model="vm.query[col.prop]">
41 <option value="">-</option>
42 <option value="true">True</option>
43 <option value="false">False</option>
44 </select>
45 </td>
46 <td ng-if="vm.config.actions"></td>
47 </tr>
48 </tbody>
49 <tbody>
50 <tr ng-repeat="item in vm.data | filter:vm.query | orderBy:vm.orderBy:vm.reverse track by $index">
51 <td ng-repeat="col in vm.columns">
52 <span ng-if="!col.type || col.type === 'text'">{{item[col.prop]}}</span>
53 <span ng-if="col.type === 'boolean'">
54 <i class="glyphicon"
55 ng-class="{'glyphicon-ok': item[col.prop], 'glyphicon-remove': !item[col.prop]}">
56 </i>
57 </span>
58 <span ng-if="col.type === 'date'">
59 {{item[col.prop] | date:'H:mm MMM d, yyyy'}}
60 </span>
61 <span ng-if="col.type === 'array'">
62 {{item[col.prop] | arrayToList}}
63 </span>
64 <span ng-if="col.type === 'object'">
65 <dl class="dl-horizontal">
66 <span ng-repeat="(k,v) in item[col.prop]">
67 <dt>{{k}}</dt>
68 <dd>{{v}}</dd>
69 </span>
70 </dl>
71 </span>
72 <span ng-if="col.type === 'custom'">
73 {{col.formatter(item)}}
74 </span>
75 <span ng-if="col.type === 'icon'">
76 <i class="glyphicon glyphicon-{{col.formatter(item)}}">
77 </i>
78 </span>
79 </td>
80 <td ng-if="vm.config.actions">
81 <a href=""
82 ng-repeat="action in vm.config.actions"
83 ng-click="action.cb(item)"
84 title="{{action.label}}">
85 <i
86 class="glyphicon glyphicon-{{action.icon}}"
87 style="color: {{action.color}};"></i>
88 </a>
89 </td>
90 </tr>
91 </tbody>
92 </table>
93<!--</div>-->
94<!--<div ng-show="(vm.data.length == 0 || !vm.data) && vm.loader == false">-->
95 <!--<xos-alert config="{type: 'info'}">-->
96 <!--No data to show.-->
97 <!--</xos-alert>-->
98<!--</div>-->
99<!--<div ng-show="vm.loader == true">-->
100 <!--<div class="loader"></div>-->
101<!--</div>-->