Improve layout of download links

This commit is contained in:
Arik Fraimovich 2016-02-22 11:50:42 +02:00
parent b462869be7
commit 553c6ac8d7
3 changed files with 28 additions and 23 deletions

View File

@ -8,7 +8,7 @@
'query': '=',
'visualization': '=?'
},
template: '<small><span class="glyphicon glyphicon-link"></span></small> <a ng-href="{{link}}" class="query-link">{{query.name}}</a>',
template: '<a ng-href="{{link}}" class="query-link">{{query.name}}</a>',
link: function(scope, element) {
scope.link = 'queries/' + scope.query.id;
if (scope.visualization) {

View File

@ -46,20 +46,17 @@
tooltip-placement="bottom">Updated: <span am-time-ago="queryResult.getUpdatedAt()"></span></span>
<span class="pull-right">
<a class="btn btn-default btn-xs" ng-href="queries/{{query.id}}#{{widget.visualization.id}}" ng-show="currentUser.hasPermission('view_query')"><span class="glyphicon glyphicon-link"></span></a>
<button type="button" class="btn btn-default btn-xs" ng-show="dashboard.canEdit()" ng-click="deleteWidget()" title="Remove Widget"><span class="glyphicon glyphicon-trash"></span></button>
</span>
<span class="pull-right">
<a class="btn btn-default btn-xs" ng-disabled="!queryResult.getData()" query-result-link target="_self">
<span class="glyphicon glyphicon-cloud-download"></span>
</a>
</span>
<span class="pull-right">
<a class="btn btn-default btn-xs" ng-disabled="!queryResult.getData()" file-type="xlsx" query-result-link target="_self">
<div class="btn-group">
<button class="btn btn-default btn-xs" ng-disabled="!queryResult.getData()" query-result-link target="_self" title="Download as CSV File">
<span class="fa fa-file-o"></span>
</button>
<button class="btn btn-default btn-xs" ng-disabled="!queryResult.getData()" file-type="xlsx" query-result-link target="_self" title="Download as Excel File">
<i class="fa fa-file-excel-o"></i>
</a>
</button>
</div>
<a class="btn btn-default btn-xs" ng-href="queries/{{query.id}}#{{widget.visualization.id}}" ng-show="currentUser.hasPermission('view_query')"><span class="glyphicon glyphicon-link"></span></a>
<button type="button" class="btn btn-default btn-xs" ng-show="dashboard.canEdit()" ng-click="deleteWidget()" title="Remove Widget"><span class="glyphicon glyphicon-trash"></span></button>
</span>
</div>
</div>

View File

@ -159,17 +159,25 @@
<p>
<p>
<a class="btn btn-primary btn-sm" ng-disabled="queryExecuting || !queryResult.getData()" query-result-link target="_self">
<span class="glyphicon glyphicon-cloud-download"></span>
<span>Download CSV</span>
</a>
<div class="btn-group" dropdown>
<button type="button" class="btn btn-primary btn-sm dropdown-toggle" ng-disabled="queryExecuting || !queryResult.getData()" aria-haspopup="true" dropdown-toggle
aria-expanded="false">
Download Dataset <span class="caret"></span>
</button>
<ul class="dropdown-menu" dropdown-menu>
<li>
<a query-result-link target="_self">
<span class="fa fa-file-o"></span> Download as CSV File
</a>
</li>
<li>
<a query-result-link file-type="xlsx" target="_self">
<span class="fa fa-file-excel-o"></span> Download as Excel File
</a>
</li>
</ul>
</div>
<a class="btn btn-primary btn-sm" ng-disabled="queryExecuting || !queryResult.getData()" file-type="xlsx" query-result-link target="_self">
<span class="glyphicon glyphicon-cloud-download"></span>
<span>Download Excel</span>
</a>
</p>
<p>
<a class="btn btn-warning btn-sm" ng-disabled="queryExecuting" data-toggle="modal" data-target="#archive-confirmation-modal"
ng-show="!query.is_archived && query.id != undefined && (isQueryOwner || currentUser.hasPermission('admin'))">
<i class="fa fa-archive" title="Archive Query"></i>