jumbotron

projects/app-vniigaz/src/assets/html/left-content.component.html

@@ -1,15 +1,2 @@
-<div class="background"  [ngStyle]="{'background-image':background}" *ngIf="pageName">
+<jumbotron></jumbotron>
-    <div class="left-content">
-        <header-user-bar></header-user-bar>
-        <h1 class="h1-jumbotron">
-            {{pageName}}
-        </h1>
-        <div class="menu" *ngIf="editMode">
-            <div class="block">
-                <a (click)="editBackground()"><ico ico="edit_24"></ico></a>
-                <a (click)="removeBackground()"><ico ico="delete_24"></ico></a>
-            </div>
-        </div>      
-    </div>
-</div>
 <edit-switch></edit-switch>

projects/app/_modules/layout/left-content/left-content.component.ts

@@ -1,8 +1,4 @@
 import { Component } from '@angular/core';
-import { Router, NavigationEnd } from '@angular/router';
-import { Subscription } from "rxjs";
-import { PagesService } from '@app/_services/pages.service';
-import { FormsService } from '@app/_services';
 import { html } from '@environments/htmlenv';
 
 
@@ -13,56 +9,6 @@ import { html } from '@environments/htmlenv';
 })
 export class LeftContentComponent {
 
-  public url: string = "";
-  public background:string;
-  public pageName:string;
-  public editable:string;
-  public editMode: boolean = false;
-  private pageID: string;
-  private routeSubscription: Subscription;
-
-
-
-  constructor(
-    private router: Router,
-    private pagesService:PagesService,
-    private formsService: FormsService) {
-    
-  }
-
-  ngOnInit(){
-    this.pagesService.editMode.subscribe(
-      mode => {
-        this.editMode = mode;
-      }
-    )
-    this.pagesService.currentPage.subscribe(
-      page => {
-        if (page){
-          this.background = page.image?.data?.links?.full;
-          if (this.background) this.background = `url(${this.background})`;
-          this.pageName = (page.parents?.data[2]||page).name;
-          this.editable = page.permissions?.edit || page.permissions?.anything;
-          this.pageID = page.id
-        }else{
-          this.pageName = null;
-          this.editable = null;
-          this.pagesService.editMode.next(false)
-        }
-      }
-    )
-  }
-
-  editBackground() {
-    this.formsService.createModel('page-background', {extraProps: {attach: {pageId: this.pageID}}});
-  }
-
-  removeBackground() {
-    if (confirm('Вы деествительно хотите удалить этот фон?')) {
-      this.pagesService.deleteBackground(this.pageID).subscribe(res => {
-      });
-    }
-  }
 
 }
 

projects/app/_modules/viget/jumbotron/jumbotron.component.html

@@ -0,0 +1,14 @@
+<div class="background"  [ngStyle]="{'background-image':background}" *ngIf="pageName">
+    <div class="left-content">
+        <header-user-bar></header-user-bar>
+        <h1 class="h1-jumbotron">
+            {{pageName}}
+        </h1>
+        <div class="menu" *ngIf="editMode">
+            <div class="block">
+                <a (click)="editBackground()"><ico ico="edit_24"></ico></a>
+                <a (click)="removeBackground()"><ico ico="delete_24"></ico></a>
+            </div>
+        </div>      
+    </div>
+</div>

projects/app/_modules/viget/jumbotron/jumbotron.component.ts

@@ -0,0 +1,66 @@
+import { Component } from '@angular/core';
+import { Router } from '@angular/router';
+import { Subscription } from "rxjs";
+import { PagesService } from '@app/_services/pages.service';
+import { FormsService } from '@app/_services';
+
+@Component({
+  selector: 'jumbotron',
+  templateUrl: './jumbotron.component.html',
+  styleUrls: ['./jumbotron.component.scss']
+})
+export class Jumbotron {
+    public url: string = "";
+    public background:string;
+    public pageName:string;
+    public editable:string;
+    public editMode: boolean = false;
+    private pageID: string;
+    private routeSubscription: Subscription;
+  
+  
+  
+    constructor(
+      private router: Router,
+      private pagesService:PagesService,
+      private formsService: FormsService) {
+      
+    }
+  
+    ngOnInit(){
+      this.pagesService.editMode.subscribe(
+        mode => {
+          this.editMode = mode;
+        }
+      )
+      this.pagesService.currentPage.subscribe(
+        page => {
+          if (page){
+            this.background = page.image?.data?.links?.full;
+            if (this.background) this.background = `url(${this.background})`;
+            this.pageName = (page.parents?.data[2]||page).name;
+            this.editable = page.permissions?.edit || page.permissions?.anything;
+            this.pageID = page.id
+          }else{
+            this.pageName = null;
+            this.editable = null;
+            this.pagesService.editMode.next(false)
+          }
+        }
+      )
+    }
+  
+    editBackground() {
+      this.formsService.createModel('page-background', {extraProps: {attach: {pageId: this.pageID}}});
+    }
+  
+    removeBackground() {
+      if (confirm('Вы деествительно хотите удалить этот фон?')) {
+        this.pagesService.deleteBackground(this.pageID).subscribe(res => {
+        });
+      }
+    }
+}
+
+ 
+

projects/app/_modules/viget/viget.module.ts

@@ -7,6 +7,7 @@ import {DropDownComponent } from "./drop-down/drop-down.component";
 import { SliderComponent } from './slider/slider.component';
 import { SwitchComponent } from './switch/switch.component';
 import { EditSwitch } from "./edit-switch/edit-switch.component";
+import { Jumbotron } from "./jumbotron/jumbotron.component";
 
 
 @NgModule({
@@ -20,7 +21,8 @@ import { EditSwitch } from "./edit-switch/edit-switch.component";
         DropDownComponent,
         SliderComponent,
         SwitchComponent,
-        EditSwitch
+        EditSwitch,
+        Jumbotron
     ],
     exports: [
         IcoComponent,
@@ -28,7 +30,8 @@ import { EditSwitch } from "./edit-switch/edit-switch.component";
         DropDownComponent,
         SliderComponent,
         SwitchComponent,
-        EditSwitch
+        EditSwitch,
+        Jumbotron
     ]
 })
 export class VigetModule {