add angular web add loading.

boot/platform/src/main/java/com/platform/boot/relational/menus/MenusController.java

@@ -8,7 +8,6 @@
 import org.springframework.security.core.context.ReactiveSecurityContextHolder;
 import org.springframework.util.Assert;
 import org.springframework.util.StringUtils;
-import org.springframework.web.bind.annotation.*;
 import reactor.core.publisher.Flux;
 import reactor.core.publisher.Mono;
 
@@ -24,13 +23,12 @@
 @RequiredArgsConstructor
 public class MenusController {
 
-
     private final MenusService menusService;
 
     @GetMapping("search")
     @PreAuthorize("hasRole(T(com.platform.boot.commons.utils.ContextUtils).RULE_ADMINISTRATORS)")
     public Flux<Menu> search(MenuRequest request) {
-        return this.menusService.search(request);
+        return this.menusService.search(request).distinct(Menu::getAuthority);
     }
 
     @GetMapping("me")
@@ -41,7 +39,7 @@ public Flux<Menu> load(MenuRequest request) {
             if (!rules.contains(RULE_ADMINISTRATORS)) {
                 request.setRules(rules);
             }
-            return this.menusService.search(request);
+            return this.search(request);
         });
     }
 

boot/platform/src/main/java/com/platform/boot/relational/menus/MenusService.java

@@ -37,24 +37,25 @@ public class MenusService extends AbstractDatabase {
 
     public Flux<Menu> search(MenuRequest request) {
         var cacheKey = ContextUtils.cacheKey(request);
-        Query query = Query.query(request.toCriteria()).sort(Sort.by("sort"));
-        return this.queryWithCache(cacheKey, query, Menu.class);
+        Query query = Query.query(request.toCriteria()).sort(Sort.by("id").descending());
+        return this.queryWithCache(cacheKey, query, Menu.class)
+                .flatMap(ContextUtils::serializeUserAuditor);
     }
 
     public Mono<Menu> add(MenuRequest request) {
         Criteria criteria = MenuRequest.of(request.getTenantCode(), request.getAuthority()).toCriteria();
         return this.entityTemplate.exists(Query.query(criteria), Menu.class).filter(isExists -> !isExists)
                 .switchIfEmpty(Mono.error(RestServerException
                         .withMsg("Add menu[" + request.getName() + "] is exists",
-                                "Menu already exists, Please choose another name. is params: " + criteria)))
+                                "The menu already exists, please try another name. is params: " + criteria)))
                 .flatMap((b) -> this.operate(request));
     }
 
     public Mono<Menu> modify(MenuRequest request) {
         var oldMunuMono = this.menusRepository.findByCode(request.getCode())
                 .switchIfEmpty(Mono.error(RestServerException.withMsg(
                         "Modify menu [" + request.getName() + "] is empty",
-                        "Menu does not exist, Please choose another name. is code: " + request.getCode())));
+                        "The menu does not exist, please choose another name. is code: " + request.getCode())));
         oldMunuMono = oldMunuMono.flatMap(old -> {
             request.setId(old.getId());
             request.setAuthority(old.getAuthority());

ui/web/src/app/app.component.ts

@@ -1,5 +1,5 @@
 import {Component, OnInit} from '@angular/core';
-import {LoadingService} from "./shared/loading.service";
+import {LoadingService} from "./core/loading.service";
 
 @Component({
   selector: 'app-root',

ui/web/src/app/app.module.ts

@@ -1,23 +1,18 @@
 import {APP_ID, isDevMode, NgModule} from '@angular/core';
 
-import {AppRoutingModule} from './app-routing.module';
 import {AppComponent} from './app.component';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
 import {ServiceWorkerModule} from '@angular/service-worker';
-import {RouterModule} from '@angular/router';
-import {httpInterceptorProviders} from "./http-interceptors";
+import {TitleStrategy} from '@angular/router';
+import {httpInterceptorProviders} from "./core/http-interceptors";
 import {HttpClientXsrfModule} from "@angular/common/http";
 import {SharedModule} from "./shared/shared.module";
-import {PageNotFoundComponent} from "./pages/page-not-found/page-not-found.component";
-import {NzSpinModule} from "ng-zorro-antd/spin";
-import {NzBackTopModule} from "ng-zorro-antd/back-top";
-import {NzResultModule} from "ng-zorro-antd/result";
+import {PagesModule} from "./pages/pages.module";
+import {PageTitleStrategy} from "./core/title-strategy.service";
+import {CoreModule} from "./core/core.module";
 
 @NgModule({
-  declarations: [
-    AppComponent,
-    PageNotFoundComponent
-  ],
+  declarations: [AppComponent],
   imports: [
     ServiceWorkerModule.register('ngsw-worker.js', {
       enabled: !isDevMode(),
@@ -30,16 +25,14 @@ import {NzResultModule} from "ng-zorro-antd/result";
       cookieName: 'XSRF-TOKEN',
       headerName: 'X-XSRF-TOKEN'
     }),
-    RouterModule,
-    AppRoutingModule,
+    CoreModule,
     SharedModule,
-    NzSpinModule,
-    NzBackTopModule,
-    NzResultModule
+    PagesModule
   ],
   providers: [
     httpInterceptorProviders,
-    {provide: APP_ID, useValue: 'serverApp'}
+    {provide: APP_ID, useValue: 'serverApp'},
+    {provide: TitleStrategy, useClass: PageTitleStrategy}
   ],
   bootstrap: [AppComponent]
 })

ui/web/src/app/security/auth.service.ts → ui/web/src/app/core/auth.service.ts

@@ -24,12 +24,11 @@ export const authGuard: CanMatchFn | CanActivateFn | CanActivateChildFn = () =>
 })
 export class AuthService {
 
-  private sessionKey = 'x-auth-token';
-  private authenticatedSource = new Subject<boolean>();
   isLoggedIn = false;
   // store the URL so we can redirect after logging in
   loginUrl = '/auth/login';
-
+  private sessionKey = 'x-auth-token';
+  private authenticatedSource = new Subject<boolean>();
   authenticated$ = this.authenticatedSource.asObservable();
 
   authToken(): string {

ui/web/src/app/core/core.module.ts

@@ -0,0 +1,14 @@
+import {NgModule, Optional, SkipSelf} from '@angular/core';
+
+
+@NgModule({
+  providers: []
+})
+export class CoreModule {
+  constructor(@Optional() @SkipSelf() parentModule?: CoreModule) {
+    if (parentModule) {
+      throw new Error(
+        'CoreModule is already loaded. Import it in the AppModule only');
+    }
+  }
+}

ui/web/src/app/http-interceptors/auth.interceptor.ts → ui/web/src/app/core/http-interceptors/auth.interceptor.ts

@@ -1,7 +1,7 @@
 import {Injectable} from '@angular/core';
 import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
 import {Observable} from 'rxjs';
-import {AuthService} from "../security/auth.service";
+import {AuthService} from "../auth.service";
 
 @Injectable()
 export class AuthInterceptor implements HttpInterceptor {

ui/web/src/app/http-interceptors/handle-error.interceptor.ts → ui/web/src/app/core/http-interceptors/handle-error.interceptor.ts

@@ -1,9 +1,9 @@
 import {Injectable} from '@angular/core';
 import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
 import {catchError, Observable, throwError, timeout} from 'rxjs';
-import {AuthService} from "../security/auth.service";
 import {MatSnackBar} from "@angular/material/snack-bar";
 import {Router} from "@angular/router";
+import {AuthService} from "../auth.service";
 
 @Injectable()
 export class HandleErrorInterceptor implements HttpInterceptor {

ui/web/src/app/http-interceptors/xhr.interceptor.ts → ui/web/src/app/core/http-interceptors/xhr.interceptor.ts

@@ -1,7 +1,7 @@
 import {Injectable} from '@angular/core';
 import {HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from '@angular/common/http';
 import {finalize, Observable} from 'rxjs';
-import {LoadingService} from "../shared/loading.service";
+import {LoadingService} from "../loading.service";
 
 /**
  * This code is an interceptor that adds a header to the request and shows a progress bar while the request is being processed. It then sends the request to the next handler and hides the progress bar when the request is finished.

ui/web/src/app/pages/pages-routing.module.ts

@@ -1,14 +1,20 @@
 import {NgModule} from '@angular/core';
 import {RouterModule, Routes} from '@angular/router';
-import {WelcomeComponent} from './welcome/welcome.component';
+import {PageNotFoundComponent} from "./page-not-found/page-not-found.component";
 
 const routes: Routes = [
-    {path: '', component: WelcomeComponent},
+  {path: 'welcome', loadChildren: () => import('./pages.module').then(m => m.PagesModule)},
+  {
+    path: 'auth', loadChildren: () => import('./security/security.module').then(m => m.SecurityModule),
+    title: "系统登录"
+  },
+  {path: '', pathMatch: 'full', redirectTo: '/auth'},
+  {path: '**', component: PageNotFoundComponent}
 ];
 
 @NgModule({
-    imports: [RouterModule.forChild(routes)],
-    exports: [RouterModule]
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
 })
 export class PagesRoutingModule {
 }

ui/web/src/app/pages/pages.module.ts

@@ -1,28 +1,25 @@
-import {NgModule} from '@angular/core';
+import {NgModule, Optional, SkipSelf} from '@angular/core';
 
 import {PagesRoutingModule} from './pages-routing.module';
 
 import {WelcomeComponent} from './welcome/welcome.component';
-import {NzIconModule} from "ng-zorro-antd/icon";
-import {NzLayoutModule} from "ng-zorro-antd/layout";
-import {NzMenuModule} from "ng-zorro-antd/menu";
-import {NzSliderModule} from "ng-zorro-antd/slider";
-import {NzResultModule} from "ng-zorro-antd/result";
+import {PageNotFoundComponent} from "./page-not-found/page-not-found.component";
+import {SecurityModule} from "./security/security.module";
+import {SharedModule} from "../shared/shared.module";
 
 @NgModule({
   imports: [
     PagesRoutingModule,
-    NzIconModule,
-    NzLayoutModule,
-    NzMenuModule,
-    NzSliderModule,
-    NzLayoutModule,
-    NzMenuModule,
-    NzIconModule,
-    NzResultModule
+    SecurityModule,
+    SharedModule
   ],
-  declarations: [WelcomeComponent],
-  exports: [WelcomeComponent]
+  declarations: [WelcomeComponent, PageNotFoundComponent]
 })
 export class PagesModule {
+  constructor(@Optional() @SkipSelf() parentModule?: PagesModule) {
+    if (parentModule) {
+      throw new Error(
+        'PagesModule is already loaded. Import it in the AppModule only');
+    }
+  }
 }

ui/web/src/app/security/login/login.component.html → ui/web/src/app/pages/security/login/login.component.html

@@ -2,7 +2,7 @@
   <div class="position-absolute top-50 start-50 translate-middle">
     <div class="card" style="width: 28rem;">
       <h4 class="card-header text-center py-2">
-        <a class="navbar-brand navbar-brand-autodark" href="." i18n="@@app.login.title">
+        <a class="navbar-brand navbar-brand-autodark" href="../../../../../../.." i18n="@@app.login.title">
           Plate Platform Manager</a>
       </h4>
       <div class="card-body">
@@ -56,7 +56,7 @@ <h5 class="text-center mb-4" i18n>Login to your account</h5>
             </div>-->
             <div class="layui-form-item">
               <input lay-skin="primary" name="remember" title="记住密码" type="checkbox">
-              <a class="mt-1 float-end" href="./">忘记密码？</a>
+              <a class="mt-1 float-end" href="../../../../../../..">忘记密码？</a>
             </div>
             <div class="layui-form-item">
               <button [disabled]="!loginForm.valid" class="layui-btn layui-btn-fluid" type="submit">登录</button>
@@ -66,13 +66,13 @@ <h5 class="text-center mb-4" i18n>Login to your account</h5>
         <div class="layui-form-item mt-2">
           <label>社交账号登录</label>
           <span class="px-2 me-2">
-        <a href="."><i class="layui-icon layui-icon-login-qq fs-4"
-                       style="color: #3492ed;"></i></a>
-        <a href="."><i class="layui-icon layui-icon-login-wechat fs-4"
-                       style="color: #4daf29;"></i></a>
-        <a href="."><i class="layui-icon layui-icon-login-weibo fs-4"
-                       style="color: #cf1900;"></i></a>
-        </span> 或 <a class="ms-4" href=".">注册帐号</a>
+        <a href="../../../../../../.."><i class="layui-icon layui-icon-login-qq fs-4"
+                                          style="color: #3492ed;"></i></a>
+        <a href="../../../../../../.."><i class="layui-icon layui-icon-login-wechat fs-4"
+                                          style="color: #4daf29;"></i></a>
+        <a href="../../../../../../.."><i class="layui-icon layui-icon-login-weibo fs-4"
+                                          style="color: #cf1900;"></i></a>
+        </span> 或 <a class="ms-4" href="../../../../../../..">注册帐号</a>
         </div>
       </div>
     </div>

ui/web/src/app/security/login/login.component.scss → ui/web/src/app/pages/security/login/login.component.scss

@@ -4,7 +4,8 @@
 }
 
 .page {
-  background-image: url(https://bing.biturl.top/?resolution=1920&format=image&index=0&mkt=zh-CN);
+  background-image: url(https://bing.biturl.top/?resolution=1920&format=image&index=0&mkt=zh-CN),
+  url('/ui/web/src/assets/th.jpg'), linear-gradient(rgba(0, 0, 255, 0.5), rgba(255, 255, 0, 0.5));
   background-position: center;
   background-repeat: no-repeat;
   background-size: cover;

ui/web/src/app/security/login/login.service.ts → ui/web/src/app/pages/security/login/login.service.ts

@@ -1,7 +1,7 @@
 import {Injectable} from '@angular/core';
 import {HttpClient, HttpHeaders} from "@angular/common/http";
 import {Observable, tap} from "rxjs";
-import {AuthService} from "../auth.service";
+import {AuthService} from "../../../core/auth.service";
 
 export interface Authentication {
   token: string;

ui/web/src/app/security/security-routing.module.ts → ui/web/src/app/pages/security/security-routing.module.ts

@@ -1,7 +1,7 @@
 import {NgModule} from '@angular/core';
 import {RouterModule, Routes, TitleStrategy} from '@angular/router';
 import {LoginComponent} from "./login/login.component";
-import {PageTitleStrategy} from "../shared/title-strategy.service";
+import {PageTitleStrategy} from "../../core/title-strategy.service";
 
 const routes: Routes = [
   {path: 'login', component: LoginComponent, title: "系统登录"},

ui/web/src/app/security/security.module.ts → ui/web/src/app/pages/security/security.module.ts

@@ -2,7 +2,7 @@ import {NgModule, Optional, SkipSelf} from '@angular/core';
 
 import {SecurityRoutingModule} from './security-routing.module';
 import {LoginComponent} from './login/login.component';
-import {SharedModule} from "../shared/shared.module";
+import {SharedModule} from "../../shared/shared.module";
 import {MAT_SNACK_BAR_DEFAULT_OPTIONS} from "@angular/material/snack-bar";
 import {NzDividerModule} from "ng-zorro-antd/divider";
 

ui/web/src/app/shared/shared-zorro.module.ts

@@ -0,0 +1,31 @@
+import {NgModule} from '@angular/core';
+import {NzSpinModule} from "ng-zorro-antd/spin";
+import {NzBackTopModule} from "ng-zorro-antd/back-top";
+import {NzResultModule} from "ng-zorro-antd/result";
+import {MatSnackBarModule} from "@angular/material/snack-bar";
+import {MatProgressBarModule} from "@angular/material/progress-bar";
+import {NzIconModule} from "ng-zorro-antd/icon";
+import {NzLayoutModule} from "ng-zorro-antd/layout";
+import {NzMenuModule} from "ng-zorro-antd/menu";
+import {NzSliderModule} from "ng-zorro-antd/slider";
+
+
+@NgModule({
+  exports: [
+    NzSpinModule,
+    NzBackTopModule,
+    NzResultModule,
+    MatSnackBarModule,
+    MatProgressBarModule,
+    NzIconModule,
+    NzLayoutModule,
+    NzMenuModule,
+    NzSliderModule,
+    NzLayoutModule,
+    NzMenuModule,
+    NzIconModule,
+    NzResultModule
+  ]
+})
+export class SharedZorroModule {
+}