mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-23 01:25:38 -05:00
Add grouping feature for model view forms (#1853)
This commit is contained in:
@@ -22,13 +22,15 @@ import { getContentHeight, getContentWidth, Dimension } from 'vs/base/browser/do
|
||||
export interface TitledFormItemLayout {
|
||||
title: string;
|
||||
actions?: string[];
|
||||
isFormComponent: Boolean;
|
||||
isFormComponent: boolean;
|
||||
horizontal: boolean;
|
||||
componentWidth?: number | string;
|
||||
componentHeight?: number | string;
|
||||
titleFontSize?: number | string;
|
||||
required?: boolean;
|
||||
info?: string;
|
||||
isInGroup?: boolean;
|
||||
isGroupLabel?: boolean;
|
||||
}
|
||||
|
||||
export interface FormLayout {
|
||||
@@ -43,10 +45,16 @@ class FormItem {
|
||||
template: `
|
||||
<div #container *ngIf="items" class="form-table" [style.padding]="getFormPadding()" [style.width]="getFormWidth()" [style.height]="getFormHeight()">
|
||||
<ng-container *ngFor="let item of items">
|
||||
<div class="form-row" *ngIf="isGroupLabel(item)">
|
||||
<div class="form-item-row form-group-label">
|
||||
<model-component-wrapper [descriptor]="item.descriptor" [modelStore]="modelStore">
|
||||
</model-component-wrapper>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row" *ngIf="isFormComponent(item)" [style.height]="getRowHeight(item)">
|
||||
|
||||
<ng-container *ngIf="isHorizontal(item)">
|
||||
<div class="form-cell" [style.font-size]="getItemTitleFontSize(item)">
|
||||
<div class="form-cell" [style.font-size]="getItemTitleFontSize(item)" [ngClass]="{'form-group-item': isInGroup(item)}">
|
||||
{{getItemTitle(item)}}<span class="form-required" *ngIf="isItemRequired(item)">*</span>
|
||||
<span class="icon info form-info" *ngIf="itemHasInfo(item)" [title]="getItemInfo(item)"></span>
|
||||
</div>
|
||||
@@ -65,7 +73,7 @@ class FormItem {
|
||||
</div>
|
||||
</div>
|
||||
</ng-container>
|
||||
<div class="form-vertical-container" *ngIf="isVertical(item)" [style.height]="getRowHeight(item)">
|
||||
<div class="form-vertical-container" *ngIf="isVertical(item)" [style.height]="getRowHeight(item)" [ngClass]="{'form-group-item': isInGroup(item)}">
|
||||
<div class="form-item-row" [style.font-size]="getItemTitleFontSize(item)">
|
||||
{{getItemTitle(item)}}<span class="form-required" *ngIf="isItemRequired(item)">*</span>
|
||||
<span class="icon info form-info" *ngIf="itemHasInfo(item)" [title]="getItemInfo(item)"></span>
|
||||
@@ -190,11 +198,19 @@ export default class FormContainer extends ContainerBase<FormItemLayout> impleme
|
||||
return [];
|
||||
}
|
||||
|
||||
private isFormComponent(item: FormItem): Boolean {
|
||||
private isGroupLabel(item: FormItem): boolean {
|
||||
return item && item.config && item.config.isGroupLabel;
|
||||
}
|
||||
|
||||
private isInGroup(item: FormItem): boolean {
|
||||
return item && item.config && item.config.isInGroup;
|
||||
}
|
||||
|
||||
private isFormComponent(item: FormItem): boolean {
|
||||
return item && item.config && item.config.isFormComponent;
|
||||
}
|
||||
|
||||
private itemHasActions(item: FormItem): Boolean {
|
||||
private itemHasActions(item: FormItem): boolean {
|
||||
let itemConfig = item.config;
|
||||
return itemConfig && itemConfig.actions !== undefined && itemConfig.actions.length > 0;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user