blob: f425c0b6488d411ef2a2c5ab422e6b3bd4b1e98d [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">
Matteo Scandolod58d5042016-12-16 16:59:21 -080018 <i class="fa fa-chevron-up"></i>
Matteo Scandolo9f87f302016-12-13 18:11:10 -080019 </a>
20 <a href="" ng-click="vm.orderBy = col.prop; vm.reverse = true">
Matteo Scandolod58d5042016-12-16 16:59:21 -080021 <i class="fa fa-chevron-down"></i>
Matteo Scandolo9f87f302016-12-13 18:11:10 -080022 </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'">
Matteo Scandolod58d5042016-12-16 16:59:21 -080054 <i class="fa"
55 ng-class="{'fa-ok': item[col.prop], 'fa-remove': !item[col.prop]}">
Matteo Scandolo9f87f302016-12-13 18:11:10 -080056 </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'">
Matteo Scandolod58d5042016-12-16 16:59:21 -080076 <i class="fa fa-{{col.formatter(item)}}">
Matteo Scandolo9f87f302016-12-13 18:11:10 -080077 </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
Matteo Scandolod58d5042016-12-16 16:59:21 -080086 class="fa fa-{{action.icon}}"
Matteo Scandolo9f87f302016-12-13 18:11:10 -080087 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>-->