fix add-section css

projects/app-vniigaz/src/assets/css/basics.scss

@@ -141,7 +141,7 @@ body {
             }
             .menu{
               position: absolute;
-              left: 0px;
+              left: 40px;
               top: 32px;
             }        
           }

projects/app-vniigaz/src/assets/css/dropdown.scss

@@ -1,3 +1,11 @@
+add-section{
+  position: relative;
+  .dropdown{
+    top:22px;
+    left:0px;
+  }
+}
+
 .dropdown {
   position: absolute;
   width: 250px;

projects/app-vniigaz/src/assets/html/header.component.html

@@ -8,41 +8,5 @@
   <pages-menu class="top-menu"></pages-menu>
   <a class="btn vnii" href="https://ais.vniigaz-cert.ru/" target="_blank">АИС СЦ ВНИИГАЗ</a>
 </div>
-  
-
-
-
-
-
-
-<!-- <div class="header">
-  <div class="bottom">
-    <a href="/glavnaia/" class="logo hidemobile"></a>
-    <div class="grid-menu" >
-      <button class="close" (click)="showBottom=false"></button>
-      <pages-menu [items]="menuItems" (onSelected)="itemSelect($event)"></pages-menu>
-      <a class="ais">АИС СЦ ВНИИГАЗ</a>
-    </div>
-    <div class="right" style="position: relative;">
-      <a href="/glavnaia/" class="logo showmobile"></a>
-      <a class="btn hidemobile" href="https://ais.vniigaz-cert.ru/" target="_blank">АИС СЦ ВНИИГАЗ</a>
-      <header-user-bar *ngIf="user" [user]="user"></header-user-bar>
-    </div>
-  </div>
-</div>
-<div  class="header showmobile" *ngIf="showBottom">
-  <retainer></retainer>
-  <div class="bottom">
-    <div class="grid-menu">
-      <div class="left-block">
-        <button class="close" (click)="showBottom=false"></button>
-        <pages-menu [items]="menuItems" (onSelected)="itemSelect($event)"></pages-menu>
-        <a class="ais" href="https://ais.vniigaz-cert.ru/" target="_blank">АИС СЦ ВНИИГАЗ</a>
-      </div>
-    </div>
-    <div class="fog"  (click)="showBottom=false" [ngClass]="{hidemobile:!showBottom,showmobile:showBottom}"></div>
-  </div>
-</div> -->
-
 
 

projects/app/_modules/layout/header/header.component.ts

@@ -1,5 +1,4 @@
 import {Component} from '@angular/core';
-import {PagesService} from "@app/_services/pages.service";
 import {AuthenticationService, ListsService} from "@app/_services";
 import {Subscription} from "rxjs";
 import { Router } from '@angular/router';
@@ -11,17 +10,13 @@ import { html } from '@environments/htmlenv';
   styleUrls: ['header.component.scss']
 })
 export class HeaderComponent {
-  public menuItems = <any>[];
   public user: any;
   public loading: boolean = false;
-  public error: string = '';
-  routeSubscription?: Subscription;
   subscription: Subscription;
   showMobileMenu = false;  
 
   constructor(
     private router:Router,
-    private pagesService: PagesService, 
     public authenticationService: AuthenticationService, 
     private listsService: ListsService) {
     this.subscription = this.authenticationService.user.subscribe(user => {

projects/app/_modules/pages/sections/add/add-section.component.html

@@ -1,41 +1,23 @@
-<div (mouseleave)="hideDD()">
+<div class="add" (mouseleave)="hideDD()">
-
+  <div class="toggle prime" [class.active]="ddVisible" (click)="toggleDD()">
- <div class="header">  
+    <ico ico="add_circle_24"></ico>
-    <a class="toggle" [class.active]="ddVisible" (click)="toggleDD()">
+    <a [class.active]="ddVisible">Добавить элемент</a>
-      <ico ico="plus_filled_24" [color]="ddVisible?'var(--active)':null" [size]="24"></ico>
+    <drop-down ico="arrow_drop_down_24" [target]="menu" [visible]="ddVisible"></drop-down>
-      <span [style.color]="ddVisible?'var(--active)':null">Добавить элемент</span>
+  </div>
-      <drop-down [visible]="ddVisible" [target]="menu"></drop-down>
+  <div class="dropdown" #menu>
-    </a>
+    <div class="menu" *ngIf="types?.length">
-    
+      <div *ngFor="let type of types; let i=index" class="type">
- </div>
+        <div class="row" *ngIf="type?.children?.data?.length > 0; else addItem" (click)="toggleSub(i)">
-
+          <div class="title">{{type.title}}</div>
-
+          <drop-down ico="expand_less_24" [target]="submenu" [visible]="sub[i]" [angle] = "[180,0]"></drop-down>
-
+        </div>
-<div class="menu" #menu>
-  <div *ngFor="let type of types" class="block">
-
-    <div *ngIf="type?.children?.data?.length > 0; else addItem">
-      
-        <a class="item" (click)="subClick(type)">
-          {{type.title}}
-          <drop-down [visible]="type.showChilren" [target]="submenu"></drop-down>
-        </a>
         <div #submenu>
-          <div *ngFor="let childrenType of type?.children?.data"  class="block"
+          <div class="sub-row" *ngFor="let childrenType of type?.children?.data" (click)="add(childrenType.name)" [innerText]="childrenType.title"></div>
-          (click)="add(childrenType.name)">
+        </div>
-            <div [innerText]="childrenType.title" class="item"></div>
+        <ng-template #addItem>
-          </div>
+          <div class="row" (click)="add(type.name)"><div class="title" [innerText]="type.title"></div></div>
-        </div>        
+        </ng-template>
-    </div>
-
-    <ng-template #addItem>
-      <div (click)="add(type.name)">
-        <div [innerText]="type.title" class="item"></div>
       </div>
-    </ng-template>
+    </div>
-
   </div>
 </div>
-
-</div>
-

projects/app/_modules/pages/sections/add/add-section.component.ts

@@ -12,6 +12,7 @@ export class AddSectionComponent {
   @Input() modelType: string;
   public types = <any>[];
   public ddVisible = false;
+  public sub:boolean[] =[]
 
   constructor(private formsService: FormsService, private objectsService: ObjectsService) {
   }
@@ -22,7 +23,7 @@ export class AddSectionComponent {
 
 
   fetchTypes() {
-    this.objectsService.fetchType('page-section', {include: 'children.children.children.children'}).subscribe(res => {
+    this.objectsService.fetchType('page-section', {include: 'children.children'}).subscribe(res => {
       this.types = res.data?.children?.data;
       this.types = this.types.map(item => {
         item.parent = item?.children?.data?.length > 0;
@@ -31,7 +32,6 @@ export class AddSectionComponent {
       });
     });
   }
-
   add(type: string) {
     this.types = this.types.map(item => {
       item.showChilren = false;
@@ -42,15 +42,25 @@ export class AddSectionComponent {
     this.hideDD();
   }
 
+  submenu(type: any) {
+    this.types = this.types.map(item => {
+      item.showChilren = item.showChilren ? false : item.id === type.id;
+      return item;
+    });
+  }
+
   toggleDD() {
     this.ddVisible = !this.ddVisible;
   }
- 
+  showDD() {
+    this.ddVisible = true;
+  }
   hideDD() {
     this.ddVisible = false;
   }
-
+  toggleSub(i:number){
-  subClick(type){
+    let val=!this.sub[i];
-    type.showChilren = !type.showChilren;
+    this.sub = this.sub.map(item=>false);
+    this.sub[i]=val;
   }
 }

projects/app/_modules/pages/sections/menu/page-menu.component.html

@@ -1,16 +1,16 @@
 <div class="menu" *ngIf="editMode">
   <div class="block">
     <a type="button" *ngIf="!isFirst" (click)="move(ord - 1)">
-      <ico ico="upward_24"></ico>
+      <ico ico="arrow_upward_24"></ico>
     </a>
     <a type="button" *ngIf="!isLast" (click)="move(ord + 1)">
-      <ico ico="downward_24"></ico>
+      <ico ico="arrow_downward_24"></ico>
     </a>
     <a type="button" (click)="edit()">
       <ico ico="edit_24"></ico>
     </a>
     <a type="button" (click)="delete()">
-      <ico ico="trash_24"></ico>
+      <ico ico="delete_24"></ico>
     </a>
   </div>
 </div>

projects/app/_modules/viget/drop-down/drop-down.component.ts

@@ -7,7 +7,7 @@ import { Component, Input, Output, EventEmitter } from '@angular/core';
 })
 export class DropDownComponent {
 
-  @Input() ico = 'drop_down_24';
+  @Input() ico = 'arrow_drop_down_24';
   @Input() angle = [0,-180];
   @Input() visible = false;
   @Input() target:HTMLElement;