fix add-section css
parent
902dc39b88
commit
87b9571f68
|
|
@ -141,7 +141,7 @@ body {
|
|||
}
|
||||
.menu{
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
left: 40px;
|
||||
top: 32px;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,11 @@
|
|||
add-section{
|
||||
position: relative;
|
||||
.dropdown{
|
||||
top:22px;
|
||||
left:0px;
|
||||
}
|
||||
}
|
||||
|
||||
.dropdown {
|
||||
position: absolute;
|
||||
width: 250px;
|
||||
|
|
|
|||
|
|
@ -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> -->
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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 => {
|
||||
|
|
|
|||
|
|
@ -1,41 +1,23 @@
|
|||
<div (mouseleave)="hideDD()">
|
||||
|
||||
<div class="header">
|
||||
<a class="toggle" [class.active]="ddVisible" (click)="toggleDD()">
|
||||
<ico ico="plus_filled_24" [color]="ddVisible?'var(--active)':null" [size]="24"></ico>
|
||||
<span [style.color]="ddVisible?'var(--active)':null">Добавить элемент</span>
|
||||
<drop-down [visible]="ddVisible" [target]="menu"></drop-down>
|
||||
</a>
|
||||
|
||||
</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 class="add" (mouseleave)="hideDD()">
|
||||
<div class="toggle prime" [class.active]="ddVisible" (click)="toggleDD()">
|
||||
<ico ico="add_circle_24"></ico>
|
||||
<a [class.active]="ddVisible">Добавить элемент</a>
|
||||
<drop-down ico="arrow_drop_down_24" [target]="menu" [visible]="ddVisible"></drop-down>
|
||||
</div>
|
||||
<div class="dropdown" #menu>
|
||||
<div class="menu" *ngIf="types?.length">
|
||||
<div *ngFor="let type of types; let i=index" class="type">
|
||||
<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 #submenu>
|
||||
<div *ngFor="let childrenType of type?.children?.data" class="block"
|
||||
(click)="add(childrenType.name)">
|
||||
<div [innerText]="childrenType.title" class="item"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ng-template #addItem>
|
||||
<div (click)="add(type.name)">
|
||||
<div [innerText]="type.title" class="item"></div>
|
||||
<div class="sub-row" *ngFor="let childrenType of type?.children?.data" (click)="add(childrenType.name)" [innerText]="childrenType.title"></div>
|
||||
</div>
|
||||
<ng-template #addItem>
|
||||
<div class="row" (click)="add(type.name)"><div class="title" [innerText]="type.title"></div></div>
|
||||
</ng-template>
|
||||
</div>
|
||||
</ng-template>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
|
||||
subClick(type){
|
||||
type.showChilren = !type.showChilren;
|
||||
toggleSub(i:number){
|
||||
let val=!this.sub[i];
|
||||
this.sub = this.sub.map(item=>false);
|
||||
this.sub[i]=val;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
Loading…
Reference in New Issue