105 lines
4.0 KiB
HTML
105 lines
4.0 KiB
HTML
<h1 class="ml-3 mb-4 mt-3">Contexts</h1>
|
|
|
|
<div class="container-fluid">
|
|
<div class="row">
|
|
<div class="col">
|
|
|
|
<p>
|
|
<button class="btn btn-sm btn-primary" data-toggle="modal" data-target="#editContextModal" ng-click="prepareNewCtx()">create a new context</button>
|
|
</p>
|
|
<p ng-show="contexts.length > 0">
|
|
<input type="text" class="form-control form-control-sm" ng-model="ctxFilter" placeholder="Filter..." />
|
|
</p>
|
|
<p>
|
|
<span class="text-muted"><b>Number of contexts:</b> {{(contexts | filter:ctxFilter).length}}</span>
|
|
</p>
|
|
<table class="table table-sm table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 20%">ID</th>
|
|
<th style="width: 30%">Label</th>
|
|
<th style="width: 10%">Type</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr ng-show="(contexts|filter:ctxFilter).length == 0">
|
|
<td colspan="4" class="text-muted">no contexts</td>
|
|
</tr>
|
|
<tr ng-repeat="ctx in contexts|filter:ctxFilter">
|
|
<th><a href="#!/context/{{ctx.id}}">{{ctx.id}}</a></th>
|
|
<td>{{ctx.label}}</td>
|
|
<td>{{ctx.type}}</td>
|
|
<td align="right">
|
|
<button type="button" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#editContextModal" ng-click="prepareEditCtx(ctx)">edit</button>
|
|
<button type="button" class="btn btn-sm btn-danger" ng-click="deleteContext(ctx.id)">delete</button>
|
|
</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modals -->
|
|
|
|
<div class="modal fade" tabindex="-1" id="editContextModal">
|
|
<div class="modal-dialog modal-xl">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h4 class="modal-title" ng-if="mode == 'new'">New context</h4>
|
|
<h4 class="modal-title" ng-if="mode == 'edit'">Edit context</h4>
|
|
<button type="button" class="close" data-dismiss="modal">×</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form>
|
|
|
|
<form-textfield label="ID" value="tmpCtx.id" ng-show="mode == 'new'"></form-textfield>
|
|
<form-textfield-static label="ID" value="tmpCtx.id" ng-show="mode == 'edit'"></form-textfield-static>
|
|
<form-textfield label="Label" value="tmpCtx.label"></form-textfield>
|
|
<form-textfield label="Type" value="tmpCtx.type"></form-textfield>
|
|
<div class="form-group">
|
|
<table class="table table-sm table-striped" style="table-layout: fixed;">
|
|
<thead>
|
|
<tr>
|
|
<th style="width: 20%">Parameter Name</th>
|
|
<th style="width: 75%">Parameter Value</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr ng-show="tmpCtx.parameters.length == 0">
|
|
<td colspan="3">0 parameter(s)</td>
|
|
</tr>
|
|
<tr ng-repeat="p in tmpCtx.parameters">
|
|
<th>{{p.name}}</th>
|
|
<td><textarea class="form-control" ng-model="p.value"></textarea></td>
|
|
<td align="right"><button class="btn btn-sm btn-danger" type="button" ng-click="tmpCtx.parameters.splice($index, 1)">
|
|
<i class="fa fa-trash"></i>
|
|
</button></td>
|
|
</tr>
|
|
</tbody>
|
|
<tfoot>
|
|
<tr ng-init="newParamName=newParamValue=''">
|
|
<td><input type="text" class="form-control form-control-sm" placeholder="new param name..." ng-model="newParamName" /></td>
|
|
<td><textarea class="form-control form-control-sm" placeholder="new param value..." ng-model="newParamValue"></textarea></td>
|
|
<td align="right">
|
|
<button type="button" class="btn btn-sm btn-outline-success" ng-click="tmpCtx.parameters.push({'name': newParamName, 'value': newParamValue}); newParamName=newParamValue=''"
|
|
ng-disabled="!newParamValue || !newParamValue">
|
|
<i class="fa fa-plus"></i>
|
|
</button>
|
|
</td>
|
|
</tr>
|
|
</tfoot>
|
|
|
|
</table>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-sm btn-secondary" data-dismiss="modal">Close</button>
|
|
<button type="submit" class="btn btn-sm btn-primary" data-dismiss="modal" ng-click="saveContext(tmpCtx)" ng-disabled="!tmpCtx.id || !tmpCtx.label || !tmpCtx.type">Submit</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |