merge

src/app/app-routing.module.ts

@@ -39,6 +39,7 @@ const routes: Routes = [
       scrollPositionRestoration: 'enabled',
       initialNavigation: 'enabledBlocking',
       preloadingStrategy: PreloadAllModules,
+      onSameUrlNavigation: 'reload',
     }),
   ],
   exports: [RouterModule],

src/app/core/interceptors/browserState-interceptor.service.ts

@@ -5,9 +5,8 @@ import {
   HttpRequest,
   HttpResponse,
 } from '@angular/common/http';
-import { Inject, Injectable, makeStateKey, TransferState } from '@angular/core';
+import { inject, Injectable, makeStateKey, TransferState } from '@angular/core';
 
-import type { ICoreConfig } from '@core/interface/IAppConfig';
 import { ApiService } from '@core/service/api.service';
 import { CORE_CONFIG } from '@core/token/token-providers';
 import { Observable, of } from 'rxjs';
@@ -19,11 +18,9 @@ import { environment } from 'src/environments/environment';
 export class BrowserStateInterceptor implements HttpInterceptor {
   public responseCache = new Map();
 
-  constructor(
-    private transferState: TransferState,
-    private apiService: ApiService,
-    @Inject(CORE_CONFIG) public coreConfig: ICoreConfig,
-  ) {}
+  private transferState = inject(TransferState);
+  private apiService = inject(ApiService);
+  public coreConfig = inject(CORE_CONFIG);
 
   intercept(
     req: HttpRequest<any>,

src/app/core/interface/IBuilder.ts

@@ -40,6 +40,7 @@ export interface IBuilderDynamicContent {
   hasBackdrop?: any;
   elements: any[];
   style?: any;
+  classes?: string;
 }
 
 export interface IBuilderSamplePage {

src/app/core/service/builder.service.ts

@@ -15,14 +15,17 @@ import { NodeService } from './node.service';
 import { catchError, tap } from 'rxjs/operators';
 import { environment } from 'src/environments/environment';
 import { DrupalJsonApiParams } from 'drupal-jsonapi-params';
+import { MatDialog } from '@angular/material/dialog';
+import { DialogComponent } from '@uiux/widgets/dialog/dialog.component';
 
 @Injectable({
   providedIn: 'root',
 })
 export class BuilderService extends ApiService {
   http = inject(HttpClient);
-  util = inject(UtilitiesService);
+  dialog = inject(MatDialog);
   builder = inject(BuilderState);
+  util = inject(UtilitiesService);
   nodeService = inject(NodeService);
   user: IUser;
   constructor(
@@ -47,6 +50,15 @@ export class BuilderService extends ApiService {
     return lang;
   }
 
+  getPageParams(): string {
+    const apiParams = new DrupalJsonApiParams();
+    apiParams.addCustomParam({ noCache: true });
+    apiParams.addInclude(['uid', 'group', 'cover', 'cover.field_media_image']);
+    const params = apiParams.getQueryString();
+
+    return params;
+  }
+
   loadPage(page: {
     langcode?: string;
     nid: string;
@@ -62,10 +74,14 @@ export class BuilderService extends ApiService {
         if (status) {
           this.builder.loadNewPage(this.formatToExtraData(page, isTemplate));
           if (uuid && !isTemplate) {
-            this.openPageSetting({
-              uuid,
-              langcode,
-            });
+            this.openPageSetting(
+              {
+                uuid,
+                langcode,
+              },
+              '/api/v1/node/landing_page',
+              this.getPageParams(),
+            );
           }
 
           if (body.length === 0) {
@@ -85,31 +101,32 @@ export class BuilderService extends ApiService {
       .fetch(`/api/v3/landingPage?content=/node/${nid}`, 'noCache=1', '', lang)
       .subscribe((page: any) => {
         this.builder.loading$.next(false);
-        this.builder.rightContent$.next({
-          mode: 'over',
-          hasBackdrop: true,
-          style: {
-            width: '800px',
-          },
-          elements: [
-            {
-              type: 'jsoneditor',
-              data: page,
-              isSetting: true,
-              actions: [
-                {
-                  type: 'update',
-                  label: '更新配置',
-                  params: {
-                    uuid,
-                    langcode,
-                    api: '/api/v1/node/json',
-                    type: 'node--json',
+        this.dialog.open(DialogComponent, {
+          width: '1000px',
+          panelClass: ['close-outside', 'close-icon-white'],
+          data: {
+            disableCloseButton: true,
+            inputData: {
+              content: {
+                type: 'jsoneditor',
+                data: page,
+                isSetting: true,
+                actions: [
+                  {
+                    type: 'update',
+                    label: '更新配置',
+                    params: {
+                      reqRoles: ['administrator'],
+                      uuid,
+                      langcode,
+                      api: '/api/v1/node/json',
+                      type: 'node--json',
+                    },
                   },
-                },
-              ],
+                ],
+              },
             },
-          ],
+          },
         });
       });
   }
@@ -329,20 +346,15 @@ export class BuilderService extends ApiService {
     return currentPage;
   }
 
-  openPageSetting(page: { uuid: string; langcode?: string }): void {
+  openPageSetting(
+    page: { uuid: string; langcode?: string },
+    api: string,
+    params: string,
+  ): void {
     const { uuid, langcode } = page;
-    const apiParams = new DrupalJsonApiParams();
-    apiParams.addCustomParam({ noCache: true });
-    apiParams.addInclude(['uid', 'group', 'cover', 'cover.field_media_image']);
-    const params = apiParams.getQueryString();
     const lang = this.getApiLang(langcode);
     this.nodeService
-      .fetch(
-        `/api/v1/node/landing_page/${uuid}`,
-        params,
-        this.user.csrf_token,
-        lang,
-      )
+      .fetch(`${api}/${uuid}`, params, this.user.csrf_token, lang)
       .subscribe(
         (res) => {
           this.builder.loading$.next(false);

src/app/core/service/content.service.ts

@@ -191,7 +191,7 @@ export class ContentService {
   loadJSON(jsonPath: string): Observable<any> {
     const { lang, path } = this.getUrlPath(jsonPath);
     const apiPath = environment.production
-      ? `${this.apiUrl}${lang}/api/v3/landingPage?content=${path}`
+      ? `${this.apiUrl}${lang}/api/v3/landingPage?content=${path}&nocache=true`
       : `${this.apiUrl}/assets/app${lang}${path}.json`;
 
     return this.http.get<any>(apiPath);

src/app/core/service/tags.service.ts

@@ -1,4 +1,4 @@
-import { Inject, Injectable } from '@angular/core';
+import { Injectable, inject } from '@angular/core';
 import { Meta, Title } from '@angular/platform-browser';
 import type { IPage } from '@core/interface/IAppConfig';
 import hljs from 'highlight.js/lib/core';
@@ -13,11 +13,9 @@ import { DOCUMENT } from '@angular/common';
   providedIn: 'root',
 })
 export class TagsService {
-  constructor(
-    private titleService: Title,
-    private meta: Meta,
-    @Inject(DOCUMENT) private document: Document
-  ) {}
+  private titleService = inject(Title);
+  private meta = inject(Meta);
+  private document = inject(DOCUMENT);
 
   public setTitle(newTitle: string): void {
     this.titleService.setTitle(newTitle);

src/app/core/state/BuilderState.ts

@@ -39,7 +39,8 @@ export class BuilderState {
 
   public loading$ = new BehaviorSubject<boolean>(true);
   public updateSuccess$ = new Subject<boolean>();
-  public COPYKEY = 'bc';
+  public COPYCOMPONENTKEY = 'cck';
+  public COPYWIDGETKEY = 'cwk';
 
   private page: IPage = {
     title: '着陆页',

src/app/modules/builder/builder.component.html

@@ -23,6 +23,7 @@
         >
           <mat-drawer
             class="!fixed"
+            [class]="(builder.rightContent$ | async)?.classes"
             #builderRightDrawer
             [ngStyle]="{
               overflow: builderRightDrawer.opened ? 'visible' : 'auto',

src/app/modules/builder/builder.component.scss

@@ -13,6 +13,16 @@
   }
 }
 
+.mat-drawer {
+  &.json-setting {
+    ::ng-deep {
+      .ace_editor {
+        min-height: 85vh;
+      }
+    }
+  }
+}
+
 .actions {
   &.expand {
     position: absolute;

src/app/modules/builder/layout-builder/block-toolbar/block-toolbar.component.ts

@@ -72,7 +72,7 @@ export class BlockToolbarComponent implements OnInit {
   onCopy(widget: any): any {
     this.util.openSnackbar(`已复制${widget.type}的JSON`);
     this.util.copy(JSON.stringify(widget));
-    this.storage.store(this.builder.COPYKEY, widget);
+    this.storage.store(this.builder.COPYWIDGETKEY, widget);
   }
 
   deleteBlock(i: number, index: number): void {

src/app/modules/builder/main/builder-workspace/builder-workspace.component.ts

@@ -14,6 +14,7 @@ import { ScreenState } from '@core/state/screen/ScreenState';
 import { BUILDER_FULL_SCREEN, CORE_CONFIG } from '@core/token/token-providers';
 import { LocalStorageService } from 'ngx-webstorage';
 import { Observable } from 'rxjs';
+import { TagsService } from '@core/service/tags.service';
 
 @Component({
   selector: 'app-builder-workspace',
@@ -30,11 +31,14 @@ export class BuilderWorkspaceComponent implements AfterViewInit {
   screenState = inject(ScreenState);
   storage = inject(LocalStorageService);
   private destroyRef = inject(DestroyRef);
+  tagService = inject(TagsService);
   constructor(
     @Inject(CORE_CONFIG) private coreConfig: ICoreConfig,
     @Inject(DOCUMENT) private doc: Document,
     @Inject(BUILDER_FULL_SCREEN) public builderFullScreen$: Observable<boolean>,
-  ) {}
+  ) {
+    this.tagService.setTitle('工作区');
+  }
 
   ngOnInit(): void {
     if (this.coreConfig.builder?.enable) {

src/app/modules/builder/main/card-list/card-page/card-page.component.ts

@@ -82,7 +82,11 @@ export class CardPageComponent {
 
   updatePage(page: IPageMeta): void {
     this.builder.loading$.next(true);
-    this.builderService.openPageSetting(page);
+    this.builderService.openPageSetting(
+      page,
+      '/api/v1/node/landing_page',
+      this.builderService.getPageParams(),
+    );
   }
 
   onTitle(event: any, page: IPageMeta): void {

src/app/modules/builder/main/manage-page/manage-page.component.html

@@ -1,15 +1,17 @@
 <div class="manage-page p-5 relative">
-  @if (page$ | async; as page) {
-    @for (item of page; track $index) {
-      <app-dynamic-component
-        [inputs]="{ content: item }"
-      ></app-dynamic-component>
+  @if (pageContent$ | async; as page) {
+    @if (page.body) {
+      @for (item of page.body; track $index) {
+        <app-dynamic-component
+          [inputs]="{ content: item }"
+        ></app-dynamic-component>
+      }
+    } @else {
+      <mat-spinner
+        class="page-loading"
+        diameter="50"
+        color="primary"
+      ></mat-spinner>
     }
-  } @else {
-    <mat-spinner
-      class="page-loading"
-      diameter="50"
-      color="primary"
-    ></mat-spinner>
   }
 </div>