diff --git a/src/app/_modules/form-fields/types/document/single/field-document-single.component.html b/src/app/_modules/form-fields/types/document/single/field-document-single.component.html index 5e67bf0..093f645 100644 --- a/src/app/_modules/form-fields/types/document/single/field-document-single.component.html +++ b/src/app/_modules/form-fields/types/document/single/field-document-single.component.html @@ -10,7 +10,8 @@
-
+
+ {{asset.name}}
diff --git a/src/app/_modules/form-fields/types/document/single/field-document-single.component.ts b/src/app/_modules/form-fields/types/document/single/field-document-single.component.ts index 13b3460..3c6cc8a 100644 --- a/src/app/_modules/form-fields/types/document/single/field-document-single.component.ts +++ b/src/app/_modules/form-fields/types/document/single/field-document-single.component.ts @@ -52,9 +52,6 @@ export class FieldDocumentSingleComponent { this.asset = asset; this.control?.setValue(asset?.id); } - get extension(){ - return `url(/assets/images/icons/document/${ICON_TYPE[this.asset.extension]}.svg)` - } diff --git a/src/app/_modules/registries/registries.module.ts b/src/app/_modules/registries/registries.module.ts index c9cfeb4..f417246 100644 --- a/src/app/_modules/registries/registries.module.ts +++ b/src/app/_modules/registries/registries.module.ts @@ -13,6 +13,7 @@ import {PaginationModule} from "@app/_modules/pagination/pagination.module"; import {SortablejsModule} from "ngx-sortablejs"; import {ReactiveFormsModule} from "@angular/forms"; import {EntryPropertiesComponent} from "@app/_modules/registries/registry/entries/entry/properties/entry-properties.component"; +import { WidjetModule } from '../widjet/widjet.module'; @NgModule({ imports: [ @@ -20,7 +21,8 @@ import {EntryPropertiesComponent} from "@app/_modules/registries/registry/entrie RouterModule, ReactiveFormsModule, PaginationModule, - SortablejsModule + SortablejsModule, + WidjetModule ], declarations: [ RegistryComponent, diff --git a/src/app/_modules/registries/registry/categories/category/registry-category.component.html b/src/app/_modules/registries/registry/categories/category/registry-category.component.html index ffba81d..aff2867 100644 --- a/src/app/_modules/registries/registry/categories/category/registry-category.component.html +++ b/src/app/_modules/registries/registry/categories/category/registry-category.component.html @@ -1,13 +1,13 @@
{{category.name}}
- - - - - + + + + +
-
+
diff --git a/src/app/_modules/registries/registry/categories/category/registry-category.component.scss b/src/app/_modules/registries/registry/categories/category/registry-category.component.scss index 3062284..e69de29 100644 --- a/src/app/_modules/registries/registry/categories/category/registry-category.component.scss +++ b/src/app/_modules/registries/registry/categories/category/registry-category.component.scss @@ -1,3 +0,0 @@ -.bar { - cursor: pointer; -} diff --git a/src/app/_modules/registries/registry/entries/entry/registry-entry.component.html b/src/app/_modules/registries/registry/entries/entry/registry-entry.component.html index a57d001..2b03136 100644 --- a/src/app/_modules/registries/registry/entries/entry/registry-entry.component.html +++ b/src/app/_modules/registries/registry/entries/entry/registry-entry.component.html @@ -1,10 +1,13 @@
- {{title}} +
+ + {{title}} +
{{title}}
-
+
{{entry.state?.title}}
@@ -16,11 +19,11 @@
-
- - - - +
+ + + +
diff --git a/src/app/_modules/registries/registry/entries/entry/registry-entry.component.scss b/src/app/_modules/registries/registry/entries/entry/registry-entry.component.scss index 8dbf07f..e69de29 100644 --- a/src/app/_modules/registries/registry/entries/entry/registry-entry.component.scss +++ b/src/app/_modules/registries/registry/entries/entry/registry-entry.component.scss @@ -1,45 +0,0 @@ -.main { - .name { - margin-right: 24px; - } - .toggle { - margin-left: auto; - button { - display: block; - width: 20px; - height: 20px; - padding: 0; - background: transparent url('~src/assets/images/icons/expand_less_20.svg') 50% 50% no-repeat; - transform: rotateZ(180deg); - transition: transform 0.3s; - &.less { - transform: rotateZ(0); - } - } - } - .state { - display: inline-block; - padding: 0 8px; - border-radius: 10px; - background-color: #777777; - color: #ffffff; - font-size: 0.875rem; - font-weight: 700; - &.active {background-color: #28A814;} - &.suspended,&.cancelled {background-color: #D9235F;} - } -} - -.details { - padding: 16px 0 0; -} - -.block { - margin-bottom: 16px; - &:last-child {margin-bottom: 0} - &.row { - display: flex; - flex-direction: row; - align-items: center; - } -} diff --git a/src/app/_modules/registries/registry/entries/registry-entries.component.scss b/src/app/_modules/registries/registry/entries/registry-entries.component.scss index 0bd5b46..8b13789 100644 --- a/src/app/_modules/registries/registry/entries/registry-entries.component.scss +++ b/src/app/_modules/registries/registry/entries/registry-entries.component.scss @@ -1,29 +1 @@ -.items { - min-height: 20px; -} -registry-entry { - display: block; - padding: 16px 24px; - border-bottom: #E8E8E8 solid 1px; - &:first-child { - border-top: #E8E8E8 solid 1px; - } -} - -pagination { - display: block; - padding: 0 24px; - &:first-child { - margin-bottom: 12px; - } - &:last-child { - margin-top: 12px; - } -} - -@media screen and (max-width: 1330px) { - registry-entry { - padding: 16px 0; - } -} diff --git a/src/app/_modules/registries/registry/filters/registry-filters.component.html b/src/app/_modules/registries/registry/filters/registry-filters.component.html index 4769176..782041d 100644 --- a/src/app/_modules/registries/registry/filters/registry-filters.component.html +++ b/src/app/_modules/registries/registry/filters/registry-filters.component.html @@ -1,4 +1,4 @@ -
+
diff --git a/src/app/_modules/registries/registry/filters/registry-filters.component.scss b/src/app/_modules/registries/registry/filters/registry-filters.component.scss index b70f6f8..e69de29 100644 --- a/src/app/_modules/registries/registry/filters/registry-filters.component.scss +++ b/src/app/_modules/registries/registry/filters/registry-filters.component.scss @@ -1,5 +0,0 @@ -@media screen and (max-width: 500px) { - button span { - display: none; - } -} diff --git a/src/app/_modules/registries/registry/registry.component.html b/src/app/_modules/registries/registry/registry.component.html index 0d34b77..e5eb396 100644 --- a/src/app/_modules/registries/registry/registry.component.html +++ b/src/app/_modules/registries/registry/registry.component.html @@ -5,8 +5,8 @@
Корневая категория
- - + +
diff --git a/src/app/_modules/registries/registry/registry.component.scss b/src/app/_modules/registries/registry/registry.component.scss index 793da2c..8b13789 100644 --- a/src/app/_modules/registries/registry/registry.component.scss +++ b/src/app/_modules/registries/registry/registry.component.scss @@ -1,37 +1 @@ -registry-entries { - display: block; - padding-bottom: 24px; -} -.bar { - display: flex; - flex-direction: row; - align-items: center; - padding: 24px; - margin-bottom: 24px; - border-radius: 20px; - .name { - margin-right: auto; - font-size: 1.125rem; - font-weight: 700; - } - .menu { - display: flex; - flex-direction: row; - gap: 24px; - button { - width: 24px; - height: 24px; - } - } - .expand { - margin-left: 48px; - button { - width: 24px; - height: 24px; - transform: rotateZ(180deg); - transition: transform 0.3s; - &.less {transform: rotateZ(0);} - } - } -} diff --git a/src/app/_modules/widjet/file-ico/file-ico.component.ts b/src/app/_modules/widjet/file-ico/file-ico.component.ts index b3a4f43..27346ca 100644 --- a/src/app/_modules/widjet/file-ico/file-ico.component.ts +++ b/src/app/_modules/widjet/file-ico/file-ico.component.ts @@ -32,7 +32,7 @@ export class FileIcoComponent { @Input() type: 'string'; get url(){ - let type = this.type.toUpperCase() + let type = this.type?.toUpperCase() let svg = this.typeList[type]? this.typeList[type]+'.svg': 'document_60dp.svg'; diff --git a/src/assets/css/_page-top-panel.scss b/src/assets/css/_page-top-panel.scss index 9892dbb..139597f 100644 --- a/src/assets/css/_page-top-panel.scss +++ b/src/assets/css/_page-top-panel.scss @@ -1,68 +1,2 @@ -.top-panel { - margin: 0 auto 32px; - max-width: 1240px; - &.pt-40 { - padding-top: 40px; - } - .buttons { - margin-bottom: 32px; - .btn { - font-weight: 700; - } - } - - .filters { - padding: 16px 0 24px; - - background-color: #F5F4F4; - border-top: #E8E8E8 solid 1px; - border-bottom: #E8E8E8 solid 1px; - .limiter { - display: flex; - flex-direction: row; - align-items: flex-end; - } - .search { - flex-grow: 1; - label { - margin-bottom: 2px; - color: #86898E; - } - input { - height: 40px; - padding: 8px 52px 8px 16px; - border: #BFBFBF solid 1px; - border-radius: 12px; - background: #ffffff url('~src/assets/images/icons/search_24dp.svg') calc(100% - 12px) 50% no-repeat; - } - } - .advanced { - margin-left: 24px; - button { - display: flex; - flex-direction: row; - align-items: center; - gap: 8px; - height: 40px; - padding: 8px 16px; - background-color: #F9B417; - color: #ffffff; - border-radius: 20px; - font-size: 14px; - font-weight: 700; - text-transform: uppercase; - &:before { - width: 24px; - height: 24px; - background: transparent url('~src/assets/images/icons/filter_empty_24.svg') 50% 50% no-repeat; - content: ''; - } - &.filled:before { - background-image: url('~src/assets/images/icons/filter_filled_24.svg'); - } - } - } - } -} diff --git a/src/assets/css/_registry.scss b/src/assets/css/_registry.scss index 36043cd..e2a1614 100644 --- a/src/assets/css/_registry.scss +++ b/src/assets/css/_registry.scss @@ -1,56 +1,169 @@ .registry { - .bar { - background-color: #3E3D40; - color: #ffffff; - .menu { - button { - background: transparent 50% 50% no-repeat; - &.add.category {background-image: url('~src/assets/images/icons/add_library_24.svg');} - &.add.entry {background-image: url('~src/assets/images/icons/add_notes_24.svg');} - &.move { - background-image: url('~src/assets/images/icons/drag-n-drop_24w.svg'); - cursor: move; - } - &.edit {background-image: url('~src/assets/images/icons/edit_24.svg');} - &.delete {background-image: url('~src/assets/images/icons/close_white_24dp.svg');} + .menu { + ico{ + cursor: pointer; + &:hover svg{ + color: var(--second-act) } } - .expand { - button { - background: url('~src/assets/images/icons/expand_less_24.svg') 50% 50% no-repeat; - } + } + .bar { + background-color: var(--second-dis); + + drop-down{ + margin-left: 24px; } } registry-category { display: block; - .bar { - background-color: #86898E; + } +} + +.top-panel { + + .buttons { + margin-bottom: 32px; + } + + .filters { + padding: 16px 0 24px; + + .search { + flex-grow: 1; + label { + margin-bottom: 2px; + color: var(--second); + } + input { + height: 40px; + padding: 8px 52px 8px 16px; + border: 1px solid (--second-dis); + border-radius: 12px; + background: #ffffff url('~src/assets/images/icons/search_24dp.svg') calc(100% - 12px) 50% no-repeat; + } } - - registry-category { - .bar { - background-color: #F5F4F4; - color: #86898E; - - .menu { - button { - &.add.category {background-image: url('~src/assets/images/icons/add_library_dark_24.svg');} - &.add.entry {background-image: url('~src/assets/images/icons/add_notes_dark_24.svg');} - &.move {background-image: url('~src/assets/images/icons/drag-n-drop_24.svg');} - &.edit {background-image: url('~src/assets/images/icons/edit_dark_24.svg');} - &.delete {background-image: url('~src/assets/images/icons/close_24dp.svg');} - } - } - .expand { - button { - background: url('~src/assets/images/icons/expand_less_dark_24.svg') 50% 50% no-repeat; - } - } - } - - registry-category { - padding-left: 24px; - } + .advanced { + margin-left: 24px; } } } + +registry-entries { + display: block; + padding-bottom: 24px; +} + +.bar { + display: flex; + flex-direction: row; + align-items: center; + padding: 24px; + margin-bottom: 24px; + border-radius: 20px; + .name { + margin-right: auto; + font-size: 1.125rem; + font-weight: 700; + } + .menu { + display: flex; + flex-direction: row; + gap: 24px; + button { + width: 24px; + height: 24px; + } + } + .expand { + margin-left: 48px; + button { + width: 24px; + height: 24px; + transform: rotateZ(180deg); + transition: transform 0.3s; + &.less {transform: rotateZ(0);} + } + } +} + +.items { + min-height: 20px; +} + +registry-entry { + display: block; + padding: 16px 24px; + border-bottom: #E8E8E8 solid 1px; + &:first-child { + border-top: #E8E8E8 solid 1px; + } + .main { + .name { + margin-right: 24px; + } + .menu-entry{ + display: inline-flex; + gap: 24px; + } + .toggle { + margin-left: auto; + button { + display: block; + width: 20px; + height: 20px; + padding: 0; + background: transparent url('~src/assets/images/icons/expand_less_20.svg') 50% 50% no-repeat; + transform: rotateZ(180deg); + transition: transform 0.3s; + &.less { + transform: rotateZ(0); + } + } + } + .state { + display: inline-block; + padding: 0 8px; + border-radius: 10px; + background-color: #777777; + color: #ffffff; + font-size: 0.875rem; + font-weight: 700; + &.active {background-color: #28A814;} + &.suspended,&.cancelled {background-color: #D9235F;} + } + } + + .details { + padding: 16px 0 0; + } + + .block { + margin-bottom: 16px; + &:last-child {margin-bottom: 0} + &.row { + display: flex; + flex-direction: row; + align-items: center; + } + } + +} + +pagination{ + display: block; + padding: 0 24px; + &:first-child { + margin-bottom: 12px; + } + &:last-child { + margin-top: 12px; + } +} + +@media screen and (max-width: 1330px) { + registry-entry { + padding: 16px 0; + } +} + + diff --git a/src/assets/images/ico/add_library_24.svg b/src/assets/images/ico/add_library_24.svg new file mode 100644 index 0000000..2dddb9d --- /dev/null +++ b/src/assets/images/ico/add_library_24.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/assets/images/ico/add_notes_24.svg b/src/assets/images/ico/add_notes_24.svg new file mode 100644 index 0000000..0bd4d4d --- /dev/null +++ b/src/assets/images/ico/add_notes_24.svg @@ -0,0 +1,5 @@ + + + + +