diff --git a/src/app/_modules/administration/site-pages/administrate-site-pages.component.html b/src/app/_modules/administration/site-pages/administrate-site-pages.component.html index d6e71e0..ea83b89 100644 --- a/src/app/_modules/administration/site-pages/administrate-site-pages.component.html +++ b/src/app/_modules/administration/site-pages/administrate-site-pages.component.html @@ -1 +1,18 @@ - + + + \ No newline at end of file diff --git a/src/app/_modules/administration/site-pages/administrate-site-pages.component.scss b/src/app/_modules/administration/site-pages/administrate-site-pages.component.scss index e69de29..d431c74 100644 --- a/src/app/_modules/administration/site-pages/administrate-site-pages.component.scss +++ b/src/app/_modules/administration/site-pages/administrate-site-pages.component.scss @@ -0,0 +1,170 @@ + +.item.home .bar .mid .info .logo::before{ + background-image: url('~src/assets/images/icons/home_page_24dp.svg'); + } + + .item:not(.home){ + .bar{ + padding-left: 50px; + + } + .item .bar{ + padding-left: 100px; + } + .item .item .bar{ + padding-left: 150px; + } + .item .item .item .bar{ + padding-left: 200px; + } + + .item .item .item .item .bar{ + padding-left: 250px; + } + } + + + + .item { + .bar { + display: flex; + flex-direction: row; + align-items: center; + padding: 16px 0; + border-bottom: #E0E0E0 solid 1px; + .left { + flex-shrink: 0; + width: 40px; + height: 24px; + cursor: pointer; + .toggle { + border:none; + width: 100%; + height: 100%; + background: transparent url("~src/assets/images/icons/expand_less_20.svg") 50% 50% no-repeat; + transform: rotate(90deg); + transition: transform .3s; + } + } + .mid { + flex-grow: 1; + padding: 0 16px; + .info { + display: flex; + flex-direction: row; + align-items: center; + .logo { + display: flex; + align-items: center; + justify-content: center; + position: relative; + flex-shrink: 0; + width: 40px; + height: 40px; + margin-right: 16px; + border-radius: 100px; + background-color: #0070BA; + color: #ffffff; + span{ + display: none; + + } + &::before { + content: ""; + display: block; + background: transparent url("~src/assets/images/icons/web_page_24dp.svg")no-repeat; + width: 24px; + height: 24px; + } + + img { + width: 100%; + height: 100%; + border-radius: 100px; + object-fit: cover; + background-color: #ffffff; + } + } + .name { + p { + margin: 0; + a { + color: var(--grey-7); + } + &.sub { + font-size: 0.875rem; + color: #7f7f7f; + } + } + } + } + } + .right { + display: flex; + flex-direction: row; + align-items: center; + flex-shrink: 1; + button { + margin-left: 24px; + &.edit { + background-image: url('~src/assets/images/icons/edit_24dp.svg'); + } + &.add { + background-image: url('~src/assets/images/icons/add_library_dark_24.svg'); + } + &.delete { + background-image: url('~src/assets/images/icons/close_24dp.svg'); + } + &.move { + background-image: url('~src/assets/images/icons/drag-n-drop_24.svg'); + cursor: move; + } + } + } + .right-home { + width: 144px; + } + } + .items { + display: none; + + } + &.active { + >.bar { + .left { + .toggle { + transform: rotate(180deg); + } + } + } + >.items { + display: block; + } + } + } + + + @media screen and (max-width: 1330px) { + .item { + .bar { + .mid { + padding: 0 12px; + .info .logo { + display: none; + } + } + .right { + display: none; + } + } + .items { + padding-left: 16px; + } + &.company { + .items { + padding-left: 40px; + } + } + } + } + \ No newline at end of file diff --git a/src/app/_modules/administration/site-pages/administrate-site-pages.component.ts b/src/app/_modules/administration/site-pages/administrate-site-pages.component.ts index e3f538d..0332b40 100644 --- a/src/app/_modules/administration/site-pages/administrate-site-pages.component.ts +++ b/src/app/_modules/administration/site-pages/administrate-site-pages.component.ts @@ -1,5 +1,6 @@ import {Component} from '@angular/core'; import {PagesService} from "@app/_services/pages.service"; +import { FormsService } from '@app/_services'; @Component({ selector: 'administrate-site-pages', @@ -8,20 +9,21 @@ import {PagesService} from "@app/_services/pages.service"; }) export class AdministrateSitePagesComponent { constructor( - private pagesService: PagesService + private pagesService: PagesService, + private formsService: FormsService, ) {} public mainPage:any; ngOnInit() { - this.fetchRootPages() + this.fetchRootPage(); } - fetchRootPages() { - let include = ['children','parent']; + fetchRootPage() { + let include = ['children.children','parent.children']; this.pagesService.root({include: include}).subscribe(res => { - this.mainPage = res.data; - console.log('MAIN', this.mainPage) + this.mainPage = res.data[0].parent.data; + console.log('MAIN', this.mainPage); }); } diff --git a/src/app/_modules/pages/pages.module.ts b/src/app/_modules/pages/pages.module.ts index 33a9fe2..a0263ef 100644 --- a/src/app/_modules/pages/pages.module.ts +++ b/src/app/_modules/pages/pages.module.ts @@ -39,6 +39,7 @@ import {SortablejsModule} from "ngx-sortablejs"; PagesListComponent, SearchSectionsComponent, PagesTreeComponent, + PagesTreeItemComponent, ] }) export class PagesModule {} diff --git a/src/app/_modules/pages/tree/item/pages-tree-item.component.html b/src/app/_modules/pages/tree/item/pages-tree-item.component.html index 89995b8..3c11a93 100644 --- a/src/app/_modules/pages/tree/item/pages-tree-item.component.html +++ b/src/app/_modules/pages/tree/item/pages-tree-item.component.html @@ -1,10 +1,12 @@
-
+
+ +
-
-
+
- - + +
diff --git a/src/app/_modules/pages/tree/item/pages-tree-item.component.ts b/src/app/_modules/pages/tree/item/pages-tree-item.component.ts index c9b2c44..956b503 100644 --- a/src/app/_modules/pages/tree/item/pages-tree-item.component.ts +++ b/src/app/_modules/pages/tree/item/pages-tree-item.component.ts @@ -16,13 +16,20 @@ export class PagesTreeItemComponent { public touched = false; public subscription: Subscription; - constructor(private router: Router, private pagesService: PagesService, private formsService: FormsService, private listsService: ListsService) { + constructor( + private router: Router, + private pagesService: + PagesService, private formsService: FormsService, + private listsService: ListsService) { } ngOnInit() { this.subscription = this.listsService.controls(this.listId).subscribe(res => { if (this.touched) this.fetch(); }); + if(!this.parent){ + this.active = true; + } } diff --git a/src/app/_modules/pages/tree/pages-tree.component.html b/src/app/_modules/pages/tree/pages-tree.component.html index fc86949..4b6d87d 100644 --- a/src/app/_modules/pages/tree/pages-tree.component.html +++ b/src/app/_modules/pages/tree/pages-tree.component.html @@ -1,19 +1,4 @@ -
-
-
- -
-
-
- -

Главная страница

-
-
-
-
-
-
-
+
diff --git a/src/app/_modules/pages/tree/pages-tree.component.scss b/src/app/_modules/pages/tree/pages-tree.component.scss index a3b0d1c..6efd2c4 100644 --- a/src/app/_modules/pages/tree/pages-tree.component.scss +++ b/src/app/_modules/pages/tree/pages-tree.component.scss @@ -1,8 +1,4 @@ -.item.home .bar .mid .info .logo::before{ - background-image: url('~src/assets/images/icons/home_page_24dp.svg'); -} - .item:not(.home){ .bar{ padding-left: 50px; @@ -76,7 +72,9 @@ width: 24px; height: 24px; } - + &.orphan::before{ + background-image: url('~src/assets/images/icons/home_page_24dp.svg'); + } img { width: 100%; height: 100%; @@ -120,6 +118,9 @@ cursor: move; } } + .orphan{ + margin-right: 48px; + } } .right-home { width: 144px; diff --git a/src/app/_modules/pages/tree/pages-tree.component.ts b/src/app/_modules/pages/tree/pages-tree.component.ts index a6e25d2..acd1c74 100644 --- a/src/app/_modules/pages/tree/pages-tree.component.ts +++ b/src/app/_modules/pages/tree/pages-tree.component.ts @@ -36,9 +36,10 @@ export class PagesTreeComponent { ngOnInit() { console.log('parent',this.parent) - if (!this.parent) this.subscription = this.listsService.controls(this.listId).subscribe(res => { - this.fetch(); - }); + this.fetchSubpages() + // if (!this.parent) this.subscription = this.listsService.controls(this.listId).subscribe(res => { + // this.fetch(); + // }); } ngOnChanges() { @@ -79,8 +80,11 @@ export class PagesTreeComponent { console.log(parent) console.log(event.item.id) console.log({parent: this.parent?.id, ord: event.newIndex}) - this.pagesService.move(event.item.id, {parent: this.parent?.id, ord: event.newIndex}).subscribe(res => { - }); + if(this.parent?.id){ + this.pagesService.move(event.item.id, {parent: this.parent?.id, ord: event.newIndex}).subscribe(res => { + }); + } + } diff --git a/src/environments/environment.ts b/src/environments/environment.ts index fb0dc2e..ab2d1fc 100644 --- a/src/environments/environment.ts +++ b/src/environments/environment.ts @@ -5,8 +5,8 @@ export const environment = { production: false, apiUrl: 'http://api.vniigazv2.lc', - clientId: 2, - clientSecret: 'Z4AOjzV1N676Yvudrm5SfpeFLxh00RigroxaBYCw', + clientId: 4, + clientSecret: 'KaeoKK3VEnfycWBdlcpAnIVS2BYtEr4rbVXXm9gd', }; /*