refact: layout setting value change

biaogebusy · Jan 31, 2024 · cd5e51c · cd5e51c
1 parent 4856d0f
commit cd5e51c
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 43 deletions.
diff --git a/src/app/core/state/BuilderState.ts b/src/app/core/state/BuilderState.ts
@@ -30,15 +30,7 @@ export class BuilderState {
   public builderRightContent$ = new Subject<IBuilderDynamicContent>();
   public showRightDrawer: boolean = true;
   public builderPopupSelect$ = new Subject<any>();
-  public builderLayoutSetting$ = new Subject<{
-    value: {
-      [key: string]: any;
-    };
-    index?: number | undefined;
-    uuid: string;
-    i?: number | undefined;
-    pageIndex?: number;
-  }>();
+  public builderLayoutSetting$ = new Subject<any>();
   public closeBuilderRightDrawer$ = new Subject<boolean>();
   public fixedChange$ = new Subject<boolean>();
   public animateDisable$ = new Subject<boolean>();

diff --git a/src/app/modules/builder/layout-builder/layout-builder.component.ts b/src/app/modules/builder/layout-builder/layout-builder.component.ts
@@ -53,24 +53,12 @@ export class LayoutBuilderComponent implements OnInit, OnDestroy {
         const { i, index, value, uuid } = data;
         if (uuid === this.uuid) {
           const { elements } = this.content;
-          Object.keys(value).forEach((config) => {
-            if (config) {
-              if (
-                this.isLayoutWidget(i, index) &&
-                isNumber(i) &&
-                isNumber(index)
-              ) {
-                elements[i].elements[index] = defaultsDeep(
-                  value[config],
-                  elements[i].elements[index]
-                );
-              }
-              if (i !== undefined && i >= 0 && index === undefined) {
-                elements[i] = defaultsDeep(value[config], elements[i]);
-              }
-            }
-          });
-
+          if (this.isLayoutWidget(i, index) && isNumber(i) && isNumber(index)) {
+            elements[i].elements[index] = value;
+          }
+          if (i !== undefined && i >= 0 && index === undefined) {
+            elements[i] = value;
+          }
           this.builder.updateComponent(this.pageIndex, this.content);
           this.cd.detectChanges();
         }

diff --git a/src/app/modules/builder/layout-builder/layout-setting/layout-setting.component.ts b/src/app/modules/builder/layout-builder/layout-setting/layout-setting.component.ts
@@ -61,19 +61,15 @@ export class LayoutSettingComponent implements OnInit, OnDestroy {
         // emit value to dynamic component
         if (level === 'block') {
           this.builder.builderLayoutSetting$.next({
-            value: {
-              bgImg,
-            },
+            value: this.content.content,
             pageIndex: this.content.pageIndex,
             uuid: this.content.uuid,
           });
         }
 
         if (level === 'layout') {
           this.builder.builderLayoutSetting$.next({
-            value: {
-              bgImg,
-            },
+            value: this.content.content,
             i: this.content.i,
             uuid: this.content.uuid,
           });
@@ -88,11 +84,14 @@ export class LayoutSettingComponent implements OnInit, OnDestroy {
     };
     this.cd.detectChanges();
     this.builder.builderLayoutSetting$.next({
-      value: {
-        bg: {
-          classes: 'bg-fill-width',
+      value: defaultsDeep(
+        {
+          bg: {
+            classes: 'bg-fill-width',
+          },
         },
-      },
+        this.content.content
+      ),
       index: this.content.index,
       uuid: this.content.uuid,
     });
@@ -101,8 +100,14 @@ export class LayoutSettingComponent implements OnInit, OnDestroy {
   onModelChange(value: any) {
     const { flex } = value;
     this.renderLayoutPreview(flex);
+    let content: any = {};
+    Object.keys(value).forEach((config) => {
+      if (config) {
+        content = defaultsDeep(value[config], this.content.content);
+      }
+    });
     this.builder.builderLayoutSetting$.next({
-      value,
+      value: content,
       i: this.content.i,
       index: this.content.index,
       pageIndex: this.content.pageIndex,

diff --git a/src/app/uiux/widgets/builder/dynamic-component/dynamic-component.component.ts b/src/app/uiux/widgets/builder/dynamic-component/dynamic-component.component.ts
@@ -65,11 +65,7 @@ export class DynamicComponentComponent
       .subscribe((data) => {
         const { value, uuid, pageIndex } = data;
         if (this.uuid === uuid) {
-          let content: any = {};
-          Object.keys(value).forEach((config) => {
-            content = defaultsDeep(value[config], content);
-          });
-          this.inputs = { ...this.inputs.content, ...content };
+          this.inputs = value;
           this.loadComponent();
           if (isNumber(pageIndex)) {
             this.builder.updateComponent(pageIndex, this.inputs);