Files
redash/client/app/components/dashboards/add-widget-dialog.html

71 lines
3.3 KiB
HTML

<div class="modal-header">
<button type="button" class="close" ng-disabled="$ctrl.saveInProgress" aria-hidden="true" ng-click="$ctrl.dismiss()">&times;</button>
<h4 class="modal-title">Add Widget</h4>
</div>
<div class="modal-body">
<p class="btn-group">
<button type="button" class="btn btn-default" ng-class="{active: $ctrl.isVisualization}" ng-click="$ctrl.setType('visualization')">Visualization</button>
<button type="button" class="btn btn-default" ng-class="{active: $ctrl.isTextBox}" ng-click="$ctrl.setType('textbox')">Text Box</button>
</p>
<div ng-show="$ctrl.isTextBox">
<div class="form-group m-b-0">
<textarea class="form-control resize-vertical" style="min-height: 100px"
ng-model="$ctrl.text" ng-model-options="{ debounce: 200 }" rows="5" autofocus></textarea>
</div>
<div ng-show="$ctrl.text" class="m-t-15">
<strong>Preview:</strong>
<p ng-bind-html="$ctrl.text | markdown"></p>
</div>
</div>
<div ng-show="$ctrl.isVisualization">
<div class="form-group">
<input type="text" placeholder="Search a query by name" class="form-control" autofocus
ng-if="!$ctrl.selectedQuery" ng-model="$ctrl.searchTerm" ng-change="$ctrl.searchQueries($ctrl.searchTerm)">
<div ng-if="$ctrl.selectedQuery" class="p-relative">
<input type="text" class="form-control bg-white"
ng-value="$ctrl.selectedQuery.name" readonly="readonly">
<a href="javascript:void(0)" ng-click="$ctrl.selectQuery(null)"
class="d-flex align-items-center justify-content-center"
style="position: absolute; right: 1px; top: 1px; bottom: 1px; width: 30px; background: #fff; border-radius: 3px;"
><i class="text-muted fa fa-times"></i></a>
</div>
</div>
<div ng-if="!$ctrl.selectedQuery" class="scrollbox" style="max-height: 50vh">
<div ng-if="$ctrl.searchTerm == ''">
<div class="list-group" ng-if="$ctrl.recentQueries.length > 0">
<a class="list-group-item" ng-repeat="query in $ctrl.recentQueries"
ng-click="$ctrl.selectQuery(query.id)">{{query.name}}</a>
</div>
</div>
<div ng-if="$ctrl.searchTerm != ''">
<div ng-if="$ctrl.searchedQueries.length == 0" class="text-muted">
No results matching search term.
</div>
<div class="list-group" ng-if="$ctrl.searchedQueries.length > 0">
<a class="list-group-item"
ng-repeat="query in $ctrl.searchedQueries" ng-click="$ctrl.selectQuery(query.id)"
ng-bind-html="$ctrl.trustAsHtml(query.name | highlight: $ctrl.searchTerm)"
></a>
</div>
</div>
</div>
<div ng-show="$ctrl.selectedQuery">
<div class="form-group">
<label>Choose Visualization</label>
<select ng-model="$ctrl.selectedVis" class="form-control"
ng-options="vis as vis.name group by vis.type for vis in $ctrl.selectedQuery.visualizations"></select>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" ng-disabled="$ctrl.saveInProgress" ng-click="$ctrl.dismiss()">Close</button>
<button type="button" class="btn btn-primary" ng-disabled="$ctrl.saveInProgress || !($ctrl.selectedVis || $ctrl.isTextBox)" ng-click="$ctrl.saveWidget()">Add to Dashboard</button>
</div>