Agent layout fixes (#1559)

* added layout to agent

* formatting

* formatting
This commit is contained in:
Anthony Dresser
2018-06-07 14:57:50 -07:00
committed by GitHub
parent e9747a61ac
commit 0a839c7321
5 changed files with 52 additions and 42 deletions

View File

@@ -242,4 +242,8 @@ export class PanelComponent extends Disposable {
this.selectTab(this._mru[0]);
}
}
public layout() {
this._activeTab.layout();
}
}

View File

@@ -72,4 +72,8 @@ export class TabComponent implements OnDestroy {
return false;
}
}
public layout() {
this._child.layout();
}
}

View File

@@ -44,6 +44,7 @@ export class ControlHostContent {
}
public layout(): void {
this._agentViewComponent.layout();
}
public get id(): string {

View File

@@ -7,7 +7,7 @@ import 'vs/css!../common/media/jobs';
import 'sql/parts/dashboard/common/dashboardPanelStyles';
import * as nls from 'vs/nls';
import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, Injectable} from '@angular/core';
import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, Injectable } from '@angular/core';
import * as Utils from 'sql/parts/connection/common/utils';
import { RefreshWidgetAction, EditDashboardAction } from 'sql/parts/dashboard/common/actions';
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
@@ -49,8 +49,8 @@ export class AgentViewComponent {
};
constructor(
@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef){
this._expanded = new Map<string, string>();
@Inject(forwardRef(() => ChangeDetectorRef)) private _cd: ChangeDetectorRef) {
this._expanded = new Map<string, string>();
}
/**
@@ -103,4 +103,8 @@ export class AgentViewComponent {
public setExpanded(jobId: string, errorMessage: string) {
this._expanded.set(jobId, errorMessage);
}
public layout() {
this._panel.layout();
}
}

View File

@@ -12,37 +12,29 @@ import 'vs/css!../common/media/jobs';
import 'vs/css!sql/media/icons/common-icons';
import { Component, Inject, forwardRef, ElementRef, ChangeDetectorRef, ViewChild, AfterContentChecked } from '@angular/core';
import { FieldType, IObservableCollection, CollectionChange, SlickGrid } from 'angular2-slickgrid';
import * as sqlops from 'sqlops';
import * as vscode from 'vscode';
import { IColorTheme } from 'vs/workbench/services/themes/common/workbenchThemeService';
import { IDisposable } from 'vs/base/common/lifecycle';
import * as themeColors from 'vs/workbench/common/theme';
import { ActionBar } from 'vs/base/browser/ui/actionbar/actionbar';
import * as nls from 'vs/nls';
import * as dom from 'vs/base/browser/dom';
import { IGridDataSet } from 'sql/parts/grid/common/interfaces';
import { Table } from 'sql/base/browser/ui/table/table';
import { attachTableStyler } from 'sql/common/theme/styler';
import { JobHistoryComponent } from './jobHistory.component';
import { AgentViewComponent } from '../agent/agentView.component';
import { RowDetailView } from 'sql/base/browser/ui/table/plugins/rowdetailview';
import { JobCacheObject } from 'sql/parts/jobManagement/common/jobManagementService';
import { AgentJobUtilities } from '../common/agentJobUtilities';
import * as Utils from 'sql/parts/connection/common/utils';
import { IJobManagementService } from '../common/interfaces';
import { DashboardServiceInterface } from 'sql/parts/dashboard/services/dashboardServiceInterface.service';
import { CommonServiceInterface } from 'sql/services/common/commonServiceInterface.service';
import { DashboardPage } from 'sql/parts/dashboard/common/dashboardPage.component';
import { TabChild } from 'sql/base/browser/ui/panel/tab.component';
export const JOBSVIEW_SELECTOR: string = 'jobsview-component';
@Component({
selector: JOBSVIEW_SELECTOR,
templateUrl: decodeURI(require.toUrl('./jobsView.component.html'))
templateUrl: decodeURI(require.toUrl('./jobsView.component.html')),
providers: [{ provide: TabChild, useExisting: forwardRef(() => JobsViewComponent) }],
})
export class JobsViewComponent implements AfterContentChecked {
@@ -52,14 +44,14 @@ export class JobsViewComponent implements AfterContentChecked {
private _disposables = new Array<vscode.Disposable>();
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', 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.name', 'Name'), field: 'name', formatter: this.renderName, width: 200, id: 'name' },
{ 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' },
];
@@ -97,6 +89,10 @@ export class JobsViewComponent implements AfterContentChecked {
this._isCloud = this._dashboardService.connectionManagementService.connectionInfo.serverInfo.isCloud;
}
public layout() {
this._table.layout(new dom.Dimension(dom.getContentWidth(this._gridEl.nativeElement), dom.getContentHeight(this._gridEl.nativeElement)));
}
ngAfterContentChecked() {
if (this.isVisible === false && this._gridEl.nativeElement.offsetParent !== null) {
this.isVisible = true;
@@ -193,11 +189,11 @@ export class JobsViewComponent implements AfterContentChecked {
});
this._table.registerPlugin(<any>this.rowDetail);
this.rowDetail.onBeforeRowDetailToggle.subscribe(function(e, args) {
this.rowDetail.onBeforeRowDetailToggle.subscribe(function (e, args) {
});
this.rowDetail.onAfterRowDetailToggle.subscribe(function(e, args) {
this.rowDetail.onAfterRowDetailToggle.subscribe(function (e, args) {
});
this.rowDetail.onAsyncEndUpdate.subscribe(function(e, args) {
this.rowDetail.onAsyncEndUpdate.subscribe(function (e, args) {
});
this.dataView.beginUpdate();
@@ -207,15 +203,15 @@ export class JobsViewComponent implements AfterContentChecked {
this._table.resizeCanvas();
let expandedJobs = this._agentViewComponent.expanded;
let expansions = 0;
for (let i = 0; i < jobs.length; i++){
for (let i = 0; i < jobs.length; i++) {
let job = jobs[i];
if (job.lastRunOutcome === 0 && !expandedJobs.get(job.jobId)) {
this.expandJobRowDetails(i+expandedJobs.size);
this.addToStyleHash(i+expandedJobs.size);
this.expandJobRowDetails(i + expandedJobs.size);
this.addToStyleHash(i + expandedJobs.size);
this._agentViewComponent.setExpanded(job.jobId, 'Loading Error...');
} else if (job.lastRunOutcome === 0 && expandedJobs.get(job.jobId)) {
this.expandJobRowDetails(i+expansions);
this.addToStyleHash(i+expansions);
this.expandJobRowDetails(i + expansions);
this.addToStyleHash(i + expansions);
expansions++;
}
}
@@ -233,7 +229,7 @@ export class JobsViewComponent implements AfterContentChecked {
if (currentTab) {
let currentTabHeight = currentTab.clientHeight;
if (currentTabHeight < self._tabHeight) {
$('agentview-component #jobsDiv div.ui-widget').css('height', `${currentTabHeight-22}px`);
$('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`);
@@ -245,14 +241,14 @@ export class JobsViewComponent implements AfterContentChecked {
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`);
$('#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();
}
private setRowWithErrorClass(hash: {[index: number]: {[id: string]: string;}}, row: number, errorClass: string) {
private setRowWithErrorClass(hash: { [index: number]: { [id: string]: string; } }, row: number, errorClass: string) {
hash[row] = {
'_detail_selector': errorClass,
'id': errorClass,
@@ -271,13 +267,14 @@ export class JobsViewComponent implements AfterContentChecked {
}
private addToStyleHash(row: number) {
let hash : {
let hash: {
[index: number]: {
[id: string]: string;
}} = {};
[id: string]: string;
}
} = {};
hash = this.setRowWithErrorClass(hash, row, 'job-with-error');
hash = this.setRowWithErrorClass(hash, row+1, 'error-row');
this._table.grid.setCellCssStyles('error-row'+row.toString(), hash);
hash = this.setRowWithErrorClass(hash, row + 1, 'error-row');
this._table.grid.setCellCssStyles('error-row' + row.toString(), hash);
}
private renderName(row, cell, value, columnDef, dataContext) {
@@ -348,7 +345,7 @@ export class JobsViewComponent implements AfterContentChecked {
let jobName: string;
let cell = args.grid.getCellNode(row, 1);
if (this.isErrorRow(cell)) {
jobName = args.grid.getCellNode(row-1, 1).innerText.trim();
jobName = args.grid.getCellNode(row - 1, 1).innerText.trim();
} else {
jobName = cell.innerText.trim();
}
@@ -365,10 +362,10 @@ export class JobsViewComponent implements AfterContentChecked {
self.jobHistories[job.jobId] = result.jobs;
self._jobCacheObject.setJobHistory(job.jobId, result.jobs);
if (self._agentViewComponent.expanded.has(job.jobId)) {
let jobHistory = self._jobCacheObject.getJobHistory(job.jobId)[result.jobs.length-1];
let jobHistory = self._jobCacheObject.getJobHistory(job.jobId)[result.jobs.length - 1];
let item = self.dataView.getItemById(job.jobId + '.error');
let noStepsMessage = nls.localize('jobsView.noSteps', 'No Steps available for this job.');
let errorMessage = jobHistory ? jobHistory.message: noStepsMessage;
let errorMessage = jobHistory ? jobHistory.message : noStepsMessage;
item['name'] = nls.localize('jobsView.error', 'Error: ') + errorMessage;
self._agentViewComponent.setExpanded(job.jobId, item['name']);
self.dataView.updateItem(job.jobId + '.error', item);