From 4d1209f0019d300a877e7fac7e5cb54aba8350d4 Mon Sep 17 00:00:00 2001
From: devcui <devcui@outlook.com>
Date: Fri, 17 Feb 2023 16:48:21 +0800
Subject: [PATCH] fix(theme:layout): fix display service cascade

---
 .../layout-basic/layout-basic.component.ts    |  9 ++++++-
 .../theme/layout-default/layout.component.ts  | 24 ++++++++++++-------
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/packages/bis/layout/layout-basic/layout-basic.component.ts b/packages/bis/layout/layout-basic/layout-basic.component.ts
index 3f501043c..d9f870cdd 100644
--- a/packages/bis/layout/layout-basic/layout-basic.component.ts
+++ b/packages/bis/layout/layout-basic/layout-basic.component.ts
@@ -136,7 +136,7 @@ class YunzaiLayoutBasicComponent implements OnInit, OnDestroy {
     if (!this.state.display.nav) {
       cascadingStyleSheet = {
         ...cascadingStyleSheet,
-        top: 0
+        top: '0px'
       };
     }
     if (!this.state.display.aside) {
@@ -207,6 +207,13 @@ class YunzaiLayoutBasicComponent implements OnInit, OnDestroy {
     this.layoutDisplayService.listen('reuseTab', (display: boolean) => {
       this.state.display.reusetab = display;
     });
+    this.layoutDisplayService.listen('nav', (display: boolean) => {
+      this.state.display.nav = display;
+    });
+
+    this.layoutDisplayService.listen('aside', (display: boolean) => {
+      this.state.display.aside = display;
+    });
   }
 
   ngOnDestroy(): void {
diff --git a/packages/theme/layout-default/layout.component.ts b/packages/theme/layout-default/layout.component.ts
index 642854756..af24159fe 100644
--- a/packages/theme/layout-default/layout.component.ts
+++ b/packages/theme/layout-default/layout.component.ts
@@ -39,11 +39,7 @@ import { LayoutDefaultOptions } from './types';
     <div class="yunzai-default__progress-bar" *ngIf="isFetching"></div>
     <layout-default-header *ngIf="!opt.hideHeader && displayNav" [items]="headerItems"></layout-default-header>
     <ng-container *ngIf="displayAside">
-      <div
-        *ngIf="!opt.hideAside"
-        class="yunzai-default__aside"
-        [ngStyle]="!displayAside ? { 'margin-top': '0px' } : {}"
-      >
+      <div *ngIf="!opt.hideAside" class="yunzai-default__aside" [ngStyle]="asideStyle">
         <div class="yunzai-default__aside-wrap">
           <div class="yunzai-default__aside-inner">
             <ng-container *ngTemplateOutlet="asideUser"></ng-container>
@@ -60,10 +56,7 @@ import { LayoutDefaultOptions } from './types';
         </div>
       </div>
     </ng-container>
-    <section
-      class="yunzai-default__content"
-      [ngStyle]="{ 'margin-top': !displayNav ? '0px' : '', 'margin-left': !displayAside ? '0px' : '' }"
-    >
+    <section class="yunzai-default__content" [ngStyle]="contentStyle">
       <ng-container *ngTemplateOutlet="content"></ng-container>
       <ng-content></ng-content>
     </section>
@@ -87,6 +80,19 @@ export class LayoutDefaultComponent implements OnInit, OnDestroy {
   @Input() content: TemplateRef<void> | null = null;
   @Input() customError?: string | null;
 
+  get contentStyle(): any {
+    return {
+      'margin-top': !this.displayNav ? '0px' : '',
+      'margin-left': !this.displayAside ? '0px' : ''
+    };
+  }
+
+  get asideStyle(): any {
+    return {
+      'margin-top': !this.displayNav ? '0px' : ''
+    };
+  }
+
   displayNav = true;
   displayAside = true;