我正在使用Angular 14和Kendo Dialog UI 7.1.2
在点击链接时，我应该在链接下方显示一个Map面板，如下面的截图。最大化和关闭按钮应该如截图中所示。当面板打开时，面板不应该有阴影效果。

的数据
与此相关的代码在下面...

private maximizeWindow(): void {
    // Your maximize logic goes here
    console.log('Maximize button clicked');
}

private onWindowClose(): void {
    if (this.dialogRef) {
      this.dialogRef.close();
    }
}

public openWindow(): void {
    this.dialogRef = this.dialogService.open({
      content: 'Window content goes here',
      width: 400,
      height: 200,
    });
}

<kendo-window
  [width]="400"
  [height]="200"
  (close)="onWindowClose()">
  <div class="custom-titlebar">
    My Window
    <button class="custom-action" (click)="maximizeWindow()">Maximize</button>
    <button class="custom-action" (click)="closeWindow()">Close</button>
  </div>
  <sd-customer-map [customer]="customer" class="map-image"></sd-customerinquiry-map>
</kendo-window>

字符串
CSS代码在下面。

.custom-titlebar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f0f0f0;
  padding: 5px 10px;
}

.custom-action {
  background: none;
  border: none;
  cursor: pointer;
  outline: none;
  margin-left: 10px;
}

型
有了这个代码，它显示像一个窗口在屏幕的中心与阴影效果。此外，我想把MapComponent显示Map已经存在。现在它显示空窗口框。

已编辑

有三件事我正在调查……
1.在超链接附近显示窗口。
1.在窗口内显示Map组件。
1.使用最大化和关闭的自定义按钮。
任何帮助都将不胜感激。谢谢。