-<h1>Contrats of tenant: <u>tenant1</u></h1><br /><br />
-<h2><u>contract1:</u></h2><br />
-id: {{contract.data.id}}<br />
-description: {{contract.data.description}}<br />
-parent:{{contract.data.parent}}<br />
-<h2>his containers:</b></h2><br />
-<h3><u>Target object:</u></h3><br />{{contract.data.target}}
-<h3><u>Subject object:</u></h3><br />{{contract.data.subject}}
-<h3><u>Clause object:</u></h3><br />{{contract.data.clause}}
-<h3><u>Quality object:</u></h3><br />{{contract.data.quality}}
-<hr />
-<h2><u>tenant1 contracts list:</u></h2><br />
-<section ng-repeat="contractElement in contracts.data"><h5>{{contractElement.data}}</h5><br /></section>
+<section flex layout="column">
+ <div flex layout="row">
+ <md-button ng-click="openContractDialog()" class="md-primary">Add</md-button>
+ <md-button ng-click="getContractList()" class="md-primary">Reload</md-button>
+ </div>
+ <md-table-container ng-if="contracts.data.length" ng-hide="contractId.length">
+ <table md-table>
+ <thead md-head md-order="contractsTableQuery.order">
+ <tr md-row>
+ <th md-column md-order-by="data.id"><span>Id</span></th>
+ <th md-column md-order-by="data.parent"><span>Parent</span></th>
+ <th md-column md-order-by="data.description"><span>Description</span></th>
+ <th md-column><span>Actions</span></th>
+ </tr>
+ </thead>
+ <tbody md-body>
+ <tr md-row ng-repeat="contract in contracts.data | filter: contractsTableQuery.filter | orderBy : contractsTableQuery.order | limitTo: contractsTableQuery.limit : (contractsTableQuery.page -1) * contractsTableQuery.limit">
+ <td md-cell>{{contract.data.id}}</td>
+ <td md-cell>{{contract.data.parent}}</td>
+ <td md-cell>{{contract.data.description}}</td>
+ <td md-cell>
+ <md-button class="md-icon-button" ng-click="openContractDialog(contract)">
+ <md-icon>edit</md-icon>
+ </md-button>
+ <md-button class="md-icon-button" ng-click="deleteContractDialog(contract)">
+ <md-icon>delete</md-icon>
+ </md-button>
+ </td>
+ </tr>
+
+ </tbody>
+ </table>
+ <md-table-pagination md-limit="contractsTableQuery.limit"
+ md-page="contractsTableQuery.page"
+ md-options="contractsTableQuery.options"
+ md-total="{{contracts.data.length}}"
+ md-page-select="options.pageSelect">
+ </md-table-pagination>
+ </md-table-container>
+
+ <section ng-if="contractId.length">
+ Details of contract: <u>{{contract1}}</u><br /><br />
+ <u>contract1:</u><br />
+ id: {{contract.data.id}}<br />
+ description: {{contract.data.description}}<br />
+ parent:{{contract.data.parent}}<br />
+ his containers:</b><br />
+ <u>Target object:</u><br />{{contract.data.target}}
+ <u>Subject object:</u><br />{{contract.data.subject}}
+ <u>Clause object:</u><br />{{contract.data.clause}}
+ <u>Quality object:</u><br />{{contract.data.quality}}
+ </section>
+
+</section>