registry
Boris Voropaev
parent
44ee28d209
commit
8cc142ee24
|
|
@ -10,7 +10,8 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="values" *ngIf="asset">
|
||||
<div class="item" [style.backgroundImage]="extension">
|
||||
<div class="item">
|
||||
<file-ico [type]="asset.extension"></file-ico>
|
||||
<a href="{{asset.links?.open}}" target="_blank">{{asset.name}}</a>
|
||||
<button type="button" class="btn clear trash" (click)="clear()"></button>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -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)`
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
|
|
@ -1,13 +1,13 @@
|
|||
<div class="bar" (click)="toggle()">
|
||||
<div class="name">{{category.name}}</div>
|
||||
<div class="menu" *ngIf="editMode" (click)="$event.stopPropagation()">
|
||||
<button type="button" class="move" title="Переместить"></button>
|
||||
<button type="button" class="edit" title="Редактировать" (click)="edit()"></button>
|
||||
<button type="button" class="add category" title="Добавить подкатегорию" (click)="addCategory()"></button>
|
||||
<button type="button" class="add entry" title="Добавить запись" (click)="addEntry()"></button>
|
||||
<button type="button" class="delete" title="Удалить категорию" (click)="delete()"></button>
|
||||
<ico ico="drag-n-drop_24" class="move" title="Переместить"></ico>
|
||||
<ico ico="edit_24" title="Редактировать" (click)="edit()"></ico>
|
||||
<ico ico="add_library_24" title="Добавить подкатегорию" (click)="addCategory()"></ico>
|
||||
<ico ico="add_notes_24" title="Добавить запись" (click)="addEntry()"></ico>
|
||||
<ico ico="delete_24" title="Удалить категорию" (click)="delete()"></ico>
|
||||
</div>
|
||||
<div class="expand"><button [class.less]="isExpanded" type="button"></button></div>
|
||||
<drop-down [visible]="isExpanded" ico="chevron_right_24" [angle]="[90,-90]"></drop-down>
|
||||
</div>
|
||||
<div class="details" *ngIf="isExpanded">
|
||||
<registry-categories [registry]="registry" [parent]="category" [editMode]="editMode"></registry-categories>
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
.bar {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
|
@ -1,10 +1,13 @@
|
|||
<div class="main">
|
||||
<div class="block row">
|
||||
<div class="name">
|
||||
<a class="document" *ngIf="link" [href]="link" target="_blank">{{title}}</a>
|
||||
<div *ngIf="link">
|
||||
<file-ico [type]="entry.asset.data.extension"></file-ico>
|
||||
<a [href]="link" target="_blank">{{title}}</a>
|
||||
</div>
|
||||
<span *ngIf="!link">{{title}}</span>
|
||||
</div>
|
||||
<div class="toggle" *ngIf="isExpandable"><button type="button" [class.less]="isExpanded" (click)="toggle()"></button></div>
|
||||
<!-- <drop-down *ngIf="isExpandable" (click)="toggle()" [visible]="isExpanded"></drop-down> -->
|
||||
</div>
|
||||
<div class="block" *ngIf="registryOptions?.states && activeSince">
|
||||
<div class="state {{entry.state?.name}}">{{entry.state?.title}}</div>
|
||||
|
|
@ -16,11 +19,11 @@
|
|||
</div>
|
||||
</div>
|
||||
<div class="block" *ngIf="editMode">
|
||||
<div class="inline-menu default">
|
||||
<button *ngIf="registryOptions?.operations" type="button" class="add" (click)="add()"></button>
|
||||
<button type="button" class="move" title="Переместить"></button>
|
||||
<button type="button" class="edit" title="Редактировать" (click)="edit()"></button>
|
||||
<button type="button" class="delete" title="Удалить" (click)="delete()"></button>
|
||||
<div class="menu menu-entry">
|
||||
<ico ico="drag-n-drop_24" class="move" title="Переместить"></ico>
|
||||
<ico ico="edit_24" title="Редактировать" (click)="edit()"></ico>
|
||||
<!-- <ico ico="add_notes_24" title="Добавить запись" (click)="add()"></ico> -->
|
||||
<ico ico="delete_24" title="Удалить категорию" (click)="delete()"></ico>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div class="filters fullwidth" [formGroup]="filters">
|
||||
<div class="filters" [formGroup]="filters">
|
||||
<div class="limiter">
|
||||
<div class="search">
|
||||
<label for="search">Поиск</label>
|
||||
|
|
|
|||
|
|
@ -1,5 +0,0 @@
|
|||
@media screen and (max-width: 500px) {
|
||||
button span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -5,8 +5,8 @@
|
|||
<div class="bar" *ngIf="editMode">
|
||||
<div class="name">Корневая категория</div>
|
||||
<div class="menu">
|
||||
<button *ngIf="hasCategories" type="button" class="add category" title="Добавить категорию" (click)="addCategory()"></button>
|
||||
<button type="button" class="add entry" (click)="addEntry()" title="Добавить запись"></button>
|
||||
<ico ico="add_library_24" *ngIf="hasCategories" title="Добавить категорию" (click)="addCategory()"></ico>
|
||||
<ico ico="add_notes_24" (click)="addEntry()" title="Добавить запись"></ico>
|
||||
</div>
|
||||
</div>
|
||||
<registry-categories *ngIf="hasCategories && !isFiltersApplied" [registry]="registry" [editMode]="editMode"></registry-categories>
|
||||
|
|
|
|||
|
|
@ -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);}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -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';
|
||||
|
|
|
|||
|
|
@ -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');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="ico">
|
||||
<path id="Vector" d="M13 14H15V11H18V9H15V6H13V9H10V11H13V14ZM8 18C7.45 18 6.97917 17.8042 6.5875 17.4125C6.19583 17.0208 6 16.55 6 16V4C6 3.45 6.19583 2.97917 6.5875 2.5875C6.97917 2.19583 7.45 2 8 2H20C20.55 2 21.0208 2.19583 21.4125 2.5875C21.8042 2.97917 22 3.45 22 4V16C22 16.55 21.8042 17.0208 21.4125 17.4125C21.0208 17.8042 20.55 18 20 18H8ZM8 16H20V4H8V16ZM4 22C3.45 22 2.97917 21.8042 2.5875 21.4125C2.19583 21.0208 2 20.55 2 20V6H4V20H18V22H4Z" fill="currentColor"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 599 B |
|
|
@ -0,0 +1,5 @@
|
|||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g id="ico">
|
||||
<path id="Vector" d="M5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H19C19.55 3 20.0208 3.19583 20.4125 3.5875C20.8042 3.97917 21 4.45 21 5V11.7C20.6833 11.55 20.3583 11.4208 20.025 11.3125C19.6917 11.2042 19.35 11.125 19 11.075V5H5V19H11.05C11.1 19.3667 11.1792 19.7167 11.2875 20.05C11.3958 20.3833 11.525 20.7 11.675 21H5ZM5 18V19V5V11.075V11V18ZM7 17H11.075C11.125 16.65 11.2042 16.3083 11.3125 15.975C11.4208 15.6417 11.5417 15.3167 11.675 15H7V17ZM7 13H13.1C13.6333 12.5 14.2292 12.0833 14.8875 11.75C15.5458 11.4167 16.25 11.1917 17 11.075V11H7V13ZM7 9H17V7H7V9ZM18 23C16.6167 23 15.4375 22.5125 14.4625 21.5375C13.4875 20.5625 13 19.3833 13 18C13 16.6167 13.4875 15.4375 14.4625 14.4625C15.4375 13.4875 16.6167 13 18 13C19.3833 13 20.5625 13.4875 21.5375 14.4625C22.5125 15.4375 23 16.6167 23 18C23 19.3833 22.5125 20.5625 21.5375 21.5375C20.5625 22.5125 19.3833 23 18 23ZM17.5 21H18.5V18.5H21V17.5H18.5V15H17.5V17.5H15V18.5H17.5V21Z" fill="currentColor"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
Loading…
Reference in New Issue