mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-16 17:22:29 -05:00
Add ModelView ImageComponent (#7106)
* Add ModelView ImageComponent * Remove duplicate property declarations * Fix sqlops too
This commit is contained in:
@@ -19,6 +19,7 @@ import RadioButtonComponent from './radioButton.component';
|
||||
import WebViewComponent from './webview.component';
|
||||
import TableComponent from './table.component';
|
||||
import TextComponent from './text.component';
|
||||
import ImageComponent from './image.component';
|
||||
import LoadingComponent from './loadingComponent.component';
|
||||
import FileBrowserTreeComponent from './fileBrowserTree.component';
|
||||
import EditorComponent from './editor.component';
|
||||
@@ -78,6 +79,9 @@ registerComponentType(WEBVIEW_COMPONENT, ModelComponentTypes.WebView, WebViewCom
|
||||
export const TEXT_COMPONENT = 'text-component';
|
||||
registerComponentType(TEXT_COMPONENT, ModelComponentTypes.Text, TextComponent);
|
||||
|
||||
export const IMAGE_COMPONENT = 'image-component';
|
||||
registerComponentType(IMAGE_COMPONENT, ModelComponentTypes.Image, ImageComponent);
|
||||
|
||||
export const TABLE_COMPONENT = 'table-component';
|
||||
registerComponentType(TABLE_COMPONENT, ModelComponentTypes.Table, TableComponent);
|
||||
|
||||
|
||||
63
src/sql/workbench/browser/modelComponents/image.component.ts
Normal file
63
src/sql/workbench/browser/modelComponents/image.component.ts
Normal file
@@ -0,0 +1,63 @@
|
||||
/*---------------------------------------------------------------------------------------------
|
||||
* Copyright (c) Microsoft Corporation. All rights reserved.
|
||||
* Licensed under the Source EULA. See License.txt in the project root for license information.
|
||||
*--------------------------------------------------------------------------------------------*/
|
||||
|
||||
import {
|
||||
Component, Input, Inject, ChangeDetectorRef, forwardRef,
|
||||
OnDestroy, AfterViewInit, ElementRef
|
||||
} from '@angular/core';
|
||||
|
||||
import * as azdata from 'azdata';
|
||||
|
||||
import { ComponentBase } from 'sql/workbench/browser/modelComponents/componentBase';
|
||||
import { IComponent, IComponentDescriptor, IModelStore } from 'sql/workbench/browser/modelComponents/interfaces';
|
||||
|
||||
@Component({
|
||||
selector: 'modelview-image',
|
||||
template: `
|
||||
<img [style.width]="getWidth()" [style.height]="getHeight()" [src]="src" [alt]="alt">`
|
||||
})
|
||||
export default class ImageComponent extends ComponentBase implements IComponent, OnDestroy, AfterViewInit {
|
||||
@Input() descriptor: IComponentDescriptor;
|
||||
@Input() modelStore: IModelStore;
|
||||
|
||||
constructor(
|
||||
@Inject(forwardRef(() => ChangeDetectorRef)) changeRef: ChangeDetectorRef,
|
||||
@Inject(forwardRef(() => ElementRef)) el: ElementRef) {
|
||||
super(changeRef, el);
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
this.baseInit();
|
||||
}
|
||||
|
||||
ngAfterViewInit(): void {
|
||||
}
|
||||
|
||||
ngOnDestroy(): void {
|
||||
this.baseDestroy();
|
||||
}
|
||||
|
||||
/// IComponent implementation
|
||||
|
||||
public setLayout(layout: any): void {
|
||||
this.layout();
|
||||
}
|
||||
|
||||
public set src(newValue: string) {
|
||||
this.setPropertyFromUI<azdata.ImageComponentProperties, string>((properties, value) => { properties.src = value; }, newValue);
|
||||
}
|
||||
|
||||
public get src(): string {
|
||||
return this.getPropertyOrDefault<azdata.ImageComponentProperties, string>((props) => props.src, '');
|
||||
}
|
||||
|
||||
public set alt(newValue: string) {
|
||||
this.setPropertyFromUI<azdata.ImageComponentProperties, string>((properties, value) => { properties.alt = value; }, newValue);
|
||||
}
|
||||
|
||||
public get alt(): string {
|
||||
return this.getPropertyOrDefault<azdata.ImageComponentProperties, string>((props) => props.alt, '');
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user