Merge pull request #3363 from mabashian/dashboard-dropdowns

Fix dashboard dropdowns after bootstrap upgrade

Reviewed-by: https://github.com/softwarefactory-project-zuul[bot]
This commit is contained in:
softwarefactory-project-zuul[bot] 2019-03-07 15:38:11 +00:00 committed by GitHub
commit 1dcb7591c5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 33 additions and 27 deletions

View File

@ -99,6 +99,10 @@
text-transform: uppercase;
transition: background-color 0.2s;
width: 100%;
> span {
width: 100%;
}
}
.DashboardGraphs-filterDropdownText:hover {
@ -110,6 +114,8 @@
font-size: 12px;
width: 20px;
padding: 0 10px;
float: right;
margin-top: 1px;
}
.DashboardGraphs-filterDropdownItems {

View File

@ -12,7 +12,10 @@
data-target="#"
href="/page.html"
class="DashboardGraphs-filterDropdownText">
<translate>Past Month</translate> <i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
<span id="period-dropdown-display">
<span translate>Past Month</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</span>
</a>
<ul class="dropdown-menu DashboardGraphs-filterDropdownItems
DashboardGraphs-filterDropdownItems--period" role="menu" aria-labelledby="period-dropdown">
@ -34,7 +37,10 @@
<a id="type-dropdown" role="button" data-toggle="dropdown" data-target="#" class="DashboardGraphs-filterDropdownText"
href="/page.html">
<translate>All</translate> <i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
<span id="type-dropdown-display">
<span translate>All</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</span>
</a>
<ul class="dropdown-menu DashboardGraphs-filterDropdownItems
@ -62,10 +68,10 @@
data-target="#"
href="/page.html"
class="DashboardGraphs-filterDropdownText">
<translate>All</translate>
<i class="fa fa-angle-down
DashboardGraphs-filterIcon">
</i>
<span id="status-dropdown-display">
<span translate>All</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</span>
</a>
<ul class="dropdown-menu DashboardGraphs-filterDropdownItems

View File

@ -126,13 +126,11 @@ function JobStatusGraph($window, adjustGraphSize, templateUrl, i18n, moment, gra
$('.n').off('click').on("click", function(){
period = this.getAttribute("id");
$('#period-dropdown')
.replaceWith(`
<a id="period-dropdown" class="DashboardGraphs-filterDropdownText DashboardGraphs-filterDropdownItems--period" role="button"
data-toggle="dropdown" data-target="#" href="/page.html">
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</a>`);
$('#period-dropdown-display')
.html(`
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
`);
scope.$parent.isFailed = true;
scope.$parent.isSuccessful = true;
@ -143,13 +141,11 @@ function JobStatusGraph($window, adjustGraphSize, templateUrl, i18n, moment, gra
$('.m').off('click').on("click", function(){
job_type = this.getAttribute("id");
$('#type-dropdown')
.replaceWith(`
<a id="type-dropdown" class="DashboardGraphs-filterDropdownText DashboardGraphs-filterDropdownItems--jobType" role="button"
data-toggle="dropdown" data-target="#" href="/page.html">
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</a>`);
$('#type-dropdown-display')
.html(`
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
`);
scope.$parent.isFailed = true;
scope.$parent.isSuccessful = true;
@ -159,13 +155,11 @@ function JobStatusGraph($window, adjustGraphSize, templateUrl, i18n, moment, gra
$('.o').off('click').on('click', function() {
var job_status = this.getAttribute('id');
$('#status-dropdown')
.replaceWith(`
<a id="status-dropdown" class="DashboardGraphs-filterDropdownText DashboardGraphs-filterDropdownItems--status" role="button"
data-toggle="dropdown" data-target="#" href="/page.html">
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
</a>`);
$('#status-dropdown-display')
.html(`
<span>${this.text}</span>
<i class="fa fa-angle-down DashboardGraphs-filterIcon"></i>
`);
recreateGraph(scope.period, scope.jobType, job_status);
});