mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-19 01:25:36 -05:00
Agent UI fixes (#1510)
* added ellipses for long job names * fixed resizing crash in jobs history page * added some more ui fixes * changed minWidths to widths * code review comments
This commit is contained in:
@@ -11,6 +11,7 @@ export class AgentJobUtilities {
|
||||
|
||||
public static startIconClass: string = 'action-label icon runJobIcon';
|
||||
public static stopIconClass: string = 'action-label icon stopJobIcon';
|
||||
public static jobMessageLength: number = 110;
|
||||
|
||||
public static convertToStatusString(status: number): string {
|
||||
switch(status) {
|
||||
|
||||
@@ -76,7 +76,7 @@ jobhistory-component {
|
||||
background: green;
|
||||
}
|
||||
|
||||
#jobsDiv .jobview-jobnameindicatorfailure {
|
||||
#jobsDiv .slick-cell.l1.r1 .jobview-jobnameindicatorfailure {
|
||||
width: 5px;
|
||||
background: red;
|
||||
}
|
||||
@@ -86,15 +86,23 @@ jobhistory-component {
|
||||
background: orange;
|
||||
}
|
||||
|
||||
#jobsDiv .jobview-jobnameindicatorunknown {
|
||||
#jobsDiv .jobview-grid .jobview-jobnameindicatorunknown {
|
||||
width: 5px;
|
||||
background: yellow;
|
||||
background: grey;
|
||||
}
|
||||
|
||||
#jobsDiv .jobview-jobnametext {
|
||||
#jobsDiv .jobview-grid .slick-cell.l1.r1.error-row .jobview-jobnametext {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#jobsDiv .jobview-grid .slick-cell.l1.r1 .jobview-jobnametext {
|
||||
text-overflow: ellipsis;
|
||||
width: 200px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#jobsDiv .job-with-error {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
@@ -79,4 +79,4 @@
|
||||
|
||||
jobstepsview-component {
|
||||
padding-top: 10px;
|
||||
}
|
||||
}
|
||||
@@ -27,6 +27,7 @@ import { OEAction } from 'sql/parts/objectExplorer/viewlet/objectExplorerActions
|
||||
import { Builder, $, withElementById } from 'vs/base/browser/builder';
|
||||
import { AgentJobHistoryInfo } from 'sqlops';
|
||||
import { Agent } from 'vs/base/node/request';
|
||||
import { AgentJobUtilities } from 'sql/parts/jobManagement/common/agentJobUtilities';
|
||||
|
||||
export class JobStepsViewRow {
|
||||
public stepID: string;
|
||||
@@ -111,7 +112,7 @@ export class JobStepsViewRenderer implements tree.IRenderer {
|
||||
private _statusIcon: HTMLElement;
|
||||
|
||||
public getHeight(tree: tree.ITree, element: JobStepsViewRow): number {
|
||||
return 22;
|
||||
return 22 * Math.ceil(element.message.length/AgentJobUtilities.jobMessageLength);
|
||||
}
|
||||
|
||||
public getTemplateId(tree: tree.ITree, element: JobStepsViewRow | JobStepsViewModel): string {
|
||||
|
||||
@@ -53,14 +53,14 @@ export class JobsViewComponent implements AfterContentChecked {
|
||||
|
||||
private columns: Array<Slick.Column<any>> = [
|
||||
{ name: nls.localize('jobColumns.name','Name'), field: 'name', formatter: this.renderName, width: 200 , id: 'name' },
|
||||
{ name: nls.localize('jobColumns.lastRun','Last Run'), field: 'lastRun', minWidth: 150, id: 'lastRun' },
|
||||
{ name: nls.localize('jobColumns.nextRun','Next Run'), field: 'nextRun', minWidth: 150, id: 'nextRun' },
|
||||
{ name: nls.localize('jobColumns.enabled','Enabled'), field: 'enabled', minWidth: 70, id: 'enabled' },
|
||||
{ name: nls.localize('jobColumns.status','Status'), field: 'currentExecutionStatus', minWidth: 60, id: 'currentExecutionStatus' },
|
||||
{ name: nls.localize('jobColumns.category','Category'), field: 'category', minWidth: 150, id: 'category' },
|
||||
{ name: nls.localize('jobColumns.runnable','Runnable'), field: 'runnable', minWidth: 50, id: 'runnable' },
|
||||
{ name: nls.localize('jobColumns.schedule','Schedule'), field: 'hasSchedule', minWidth: 50, id: 'hasSchedule' },
|
||||
{ name: nls.localize('jobColumns.lastRunOutcome', 'Last Run Outcome'), field: 'lastRunOutcome', minWidth: 150, id: 'lastRunOutcome' },
|
||||
{ name: nls.localize('jobColumns.lastRun','Last Run'), field: 'lastRun', width: 150, id: 'lastRun' },
|
||||
{ name: nls.localize('jobColumns.nextRun','Next Run'), field: 'nextRun', width: 150, id: 'nextRun' },
|
||||
{ name: nls.localize('jobColumns.enabled','Enabled'), field: 'enabled', width: 70, id: 'enabled' },
|
||||
{ name: nls.localize('jobColumns.status','Status'), field: 'currentExecutionStatus', width: 60, id: 'currentExecutionStatus' },
|
||||
{ name: nls.localize('jobColumns.category','Category'), field: 'category', width: 150, id: 'category' },
|
||||
{ name: nls.localize('jobColumns.runnable','Runnable'), field: 'runnable', width: 50, id: 'runnable' },
|
||||
{ name: nls.localize('jobColumns.schedule','Schedule'), field: 'hasSchedule', width: 50, id: 'hasSchedule' },
|
||||
{ name: nls.localize('jobColumns.lastRunOutcome', 'Last Run Outcome'), field: 'lastRunOutcome', width: 150, id: 'lastRunOutcome' },
|
||||
];
|
||||
|
||||
private rowDetail: RowDetailView;
|
||||
@@ -228,16 +228,26 @@ export class JobsViewComponent implements AfterContentChecked {
|
||||
this._cd.detectChanges();
|
||||
const self = this;
|
||||
this._tabHeight = $('agentview-component #jobsDiv .jobview-grid').get(0).clientHeight;
|
||||
$(window).resize((e) => {
|
||||
let currentTabHeight = $('agentview-component #jobsDiv .jobview-grid').get(0).clientHeight;
|
||||
if (currentTabHeight < self._tabHeight) {
|
||||
$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight-22}px`);
|
||||
self._table.resizeCanvas();
|
||||
} else {
|
||||
$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight}px`);
|
||||
self._table.resizeCanvas();
|
||||
$(window).resize(() => {
|
||||
let currentTab = $('agentview-component #jobsDiv .jobview-grid').get(0);
|
||||
if (currentTab) {
|
||||
let currentTabHeight = currentTab.clientHeight;
|
||||
if (currentTabHeight < self._tabHeight) {
|
||||
$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight-22}px`);
|
||||
self._table.resizeCanvas();
|
||||
} else {
|
||||
$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight}px`);
|
||||
self._table.resizeCanvas();
|
||||
}
|
||||
self._tabHeight = currentTabHeight;
|
||||
}
|
||||
self._tabHeight = currentTabHeight;
|
||||
});
|
||||
this._table.grid.onColumnsResized.subscribe((e, data: any) => {
|
||||
let nameWidth: number = data.grid.getColumnWidths()[1];
|
||||
// adjust job name when resized
|
||||
$('#jobsDiv .jobview-grid .slick-cell.l1.r1 .jobview-jobnametext').css('width', `${nameWidth-10}px`);
|
||||
// adjust error message when resized
|
||||
$('#jobsDiv .jobview-grid .slick-cell.l1.r1.error-row .jobview-jobnametext').css('width', '100%');
|
||||
});
|
||||
this.loadJobHistories();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user