ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-18 01:25:37 -05:00
Code Issues Packages Projects Releases Wiki Activity

a few table designer improvements (#17588)

Browse Source
This commit is contained in:
Alan Ren
2021-11-03 17:57:47 -07:00
committed by GitHub
parent 6ae8db35df
commit f3e1c2cc8b
4 changed files with 78 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
src/sql/base/browser/ui/designer/designer.ts
View File

@@ -134,7 +134,7 @@ export class Designer extends Disposable implements IThemable {
layout: size => {
this.layoutTabbedPanel();
},
minimumSize: 200,
minimumSize: 400,
maximumSize: Number.POSITIVE_INFINITY,
onDidChange: Event.None
}, Sizing.Distribute);
@@ -514,7 +514,7 @@ export class Designer extends Disposable implements IThemable {
const groupNames = [];
const componentsToCreate = skipTableCreation ? components.filter(component => component.componentType !== 'table') : components;
componentsToCreate.forEach(component => {
if (component.group && groupNames.indexOf(component.group) === -1) {
if (groupNames.indexOf(component.group) === -1) {
groupNames.push(component.group);
}
});
@@ -529,7 +529,7 @@ export class Designer extends Disposable implements IThemable {
const groupHeader = container.appendChild(DOM.$('div.full-row'));
groupHeaders.push(groupHeader);
this.styleGroupHeader(groupHeader);
groupHeader.innerText = group;
groupHeader.innerText = group ?? localize('designer.generalGroupName', "General");
componentsToCreate.forEach(component => {
if (component.group === group) {
uiComponents.push(this.createComponent(container, component, identifierGetter(component), componentMap, setWidth));
@@ -591,24 +591,26 @@ export class Designer extends Disposable implements IThemable {
break;
case 'table':
const tableProperties = componentDefinition.componentProperties as DesignerTableProperties;
const buttonContainer = container.appendChild(DOM.$('.full-row')).appendChild(DOM.$('.add-row-button-container'));
const addNewText = localize('designer.newRowText', "Add New");
const addRowButton = new Button(buttonContainer, {
title: addNewText,
secondary: true
});
addRowButton.onDidClick(() => {
this.handleEdit({
type: DesignerEditType.Add,
property: componentDefinition.propertyName,
if (tableProperties.canAddRows !== false) {
const buttonContainer = container.appendChild(DOM.$('.full-row')).appendChild(DOM.$('.add-row-button-container'));
const addNewText = localize('designer.newRowText', "Add New");
const addRowButton = new Button(buttonContainer, {
title: addNewText,
secondary: true
});
});
this.styleComponent(addRowButton);
addRowButton.label = addNewText;
addRowButton.icon = {
id: `add-row-button new codicon`
};
this._buttons.push(addRowButton);
addRowButton.onDidClick(() => {
this.handleEdit({
type: DesignerEditType.Add,
property: componentDefinition.propertyName,
});
});
this.styleComponent(addRowButton);
addRowButton.label = addNewText;
addRowButton.icon = {
id: `add-row-button new codicon`
};
this._buttons.push(addRowButton);
}
const tableContainer = container.appendChild(DOM.$('.full-row'));
const table = new Table(tableContainer, {
dataProvider: new TableDataView()
@@ -664,24 +666,26 @@ export class Designer extends Disposable implements IThemable {
};
}
});
const deleteRowColumn = new ButtonColumn({
id: 'deleteRow',
iconCssClass: Codicon.trash.classNames,
title: localize('designer.removeRowText', "Remove"),
width: 20,
resizable: false,
isFontIcon: true
});
deleteRowColumn.onClick((e) => {
(this._input.viewModel[componentDefinition.propertyName] as DesignerTableProperties).data.splice(e.row, 1);
this.handleEdit({
type: DesignerEditType.Remove,
property: componentDefinition.propertyName,
value: e.item
if (tableProperties.canRemoveRows !== false) {
const deleteRowColumn = new ButtonColumn({
id: 'deleteRow',
iconCssClass: Codicon.trash.classNames,
title: localize('designer.removeRowText', "Remove"),
width: 20,
resizable: false,
isFontIcon: true
});
});
table.registerPlugin(deleteRowColumn);
columns.push(deleteRowColumn.definition);
deleteRowColumn.onClick((e) => {
(this._input.viewModel[componentDefinition.propertyName] as DesignerTableProperties).data.splice(e.row, 1);
this.handleEdit({
type: DesignerEditType.Remove,
property: componentDefinition.propertyName,
value: e.item
});
});
table.registerPlugin(deleteRowColumn);
columns.push(deleteRowColumn.definition);
}
table.columns = columns;
table.grid.onBeforeEditCell.subscribe((e, data): boolean => {
return data.item[data.column.field].enabled !== false;

17
src/sql/base/browser/ui/designer/interfaces.ts
View File

@@ -154,16 +154,29 @@ export interface DesignerTableProperties extends ComponentProperties {
columns?: string[];
/**
* The display name of the object type
* The display name of the object type.
*/
objectTypeDisplayName: string;
/**
* the properties of the table data item
* The properties of the table data item.
*/
itemProperties?: DesignerDataPropertyInfo[];
/**
* The data to be displayed.
*/
data?: DesignerTableComponentRowData[];
/**
* Whether user can add new rows to the table. The default value is true.
*/
canAddRows?: boolean;
/**
* Whether user can remove rows from the table. The default value is true.
*/
canRemoveRows?: boolean;
}
export interface DesignerTableComponentRowData {