mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ACS-5761] Demo Shell pages cleanup (#8802)
remove the content that is not covered by e2e testing, preparation steps for the demo shell decommissioning
This commit is contained in:
@@ -350,20 +350,20 @@
|
||||
"pageSize": 5,
|
||||
"options": [
|
||||
{
|
||||
"name": "APP.SEARCH.RADIO.NONE",
|
||||
"name": "None",
|
||||
"value": "",
|
||||
"default": true
|
||||
},
|
||||
{
|
||||
"name": "APP.SEARCH.RADIO.ALL",
|
||||
"name": "All",
|
||||
"value": "TYPE:'cm:folder' OR TYPE:'cm:content'"
|
||||
},
|
||||
{
|
||||
"name": "APP.SEARCH.RADIO.FOLDER",
|
||||
"name": "Folder",
|
||||
"value": "TYPE:'cm:folder'"
|
||||
},
|
||||
{
|
||||
"name": "APP.SEARCH.RADIO.DOCUMENT",
|
||||
"name": "Document",
|
||||
"value": "TYPE:'cm:content'"
|
||||
}
|
||||
]
|
||||
@@ -386,7 +386,7 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
"name": "DEFAULT_SEARCH",
|
||||
"name": "Default",
|
||||
"default": true
|
||||
},
|
||||
{
|
||||
|
@@ -38,13 +38,9 @@ import { AppLayoutComponent } from './components/app-layout/app-layout.component
|
||||
import { HomeComponent } from './components/home/home.component';
|
||||
import { SearchBarComponent } from './components/search/search-bar.component';
|
||||
import { SearchResultComponent } from './components/search/search-result.component';
|
||||
import { SearchExtendedComponent } from './components/search/search-extended.component';
|
||||
import { LogComponent } from './components/log/log.component';
|
||||
import { FormComponent } from './components/form/form.component';
|
||||
import { FormListComponent } from './components/form/form-list.component';
|
||||
import { FormLoadingComponent } from './components/form/form-loading.component';
|
||||
import { OverlayViewerComponent } from './components/overlay-viewer/overlay-viewer.component';
|
||||
|
||||
import { ProcessServiceComponent } from './components/process-service/process-service.component';
|
||||
import { ShowDiagramComponent } from './components/process-service/show-diagram.component';
|
||||
import { FormViewerComponent } from './components/process-service/form-viewer.component';
|
||||
@@ -53,7 +49,6 @@ import { AppsViewComponent } from './components/process-service/apps-view.compon
|
||||
import { FilesComponent } from './components/files/files.component';
|
||||
import { VersionManagerDialogAdapterComponent } from './components/files/version-manager-dialog-adapter.component';
|
||||
import { MetadataDialogAdapterComponent } from './components/files/metadata-dialog-adapter.component';
|
||||
import { ThemePickerModule } from './components/theme-picker/theme-picker';
|
||||
import { appRoutes } from './app.routes';
|
||||
import { TaskAttachmentsComponent } from './components/process-service/task-attachments.component';
|
||||
import { ProcessAttachmentsComponent } from './components/process-service/process-attachments.component';
|
||||
@@ -77,22 +72,15 @@ import { StartTaskCloudDemoComponent } from './components/cloud/start-task-cloud
|
||||
import { StartProcessCloudDemoComponent } from './components/cloud/start-process-cloud-demo.component';
|
||||
import { CloudBreadcrumbsComponent } from './components/cloud/cloud-breadcrumb-component';
|
||||
import { CloudFiltersDemoComponent } from './components/cloud/cloud-filters-demo.component';
|
||||
import { TemplateDemoComponent } from './components/template-list/template-demo.component';
|
||||
import { PeopleGroupCloudDemoComponent } from './components/cloud/people-groups-cloud-demo.component';
|
||||
import { ConfirmDialogExampleComponent } from './components/confirm-dialog/confirm-dialog-example.component';
|
||||
import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/cloud-form-demo.component';
|
||||
import { environment } from '../environments/environment';
|
||||
import { AppCloudSharedModule } from './components/cloud/shared/cloud.shared.module';
|
||||
import { DemoErrorComponent } from './components/error/demo-error.component';
|
||||
import { ProcessServicesCloudModule } from '@alfresco/adf-process-services-cloud';
|
||||
import { FilteredSearchComponent } from './components/files/filtered-search.component';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component';
|
||||
import {
|
||||
CustomEditorComponent,
|
||||
CustomWidgetComponent
|
||||
} from './components/cloud/custom-form-components/custom-editor.component';
|
||||
import { AspectListSampleComponent } from './components/aspect-list-sample/aspect-list-sample.component';
|
||||
import { CustomEditorComponent, CustomWidgetComponent } from './components/cloud/custom-form-components/custom-editor.component';
|
||||
|
||||
import { registerLocaleData } from '@angular/common';
|
||||
import localeFr from '@angular/common/locales/fr';
|
||||
@@ -150,7 +138,6 @@ registerLocaleData(localeSv);
|
||||
ProcessModule.forRoot(),
|
||||
ProcessServicesCloudModule.forRoot(),
|
||||
ExtensionsModule.forRoot(),
|
||||
ThemePickerModule,
|
||||
NgChartsModule,
|
||||
AppCloudSharedModule,
|
||||
MonacoEditorModule.forRoot()
|
||||
@@ -163,29 +150,24 @@ registerLocaleData(localeSv);
|
||||
HomeComponent,
|
||||
SearchBarComponent,
|
||||
SearchResultComponent,
|
||||
SearchExtendedComponent,
|
||||
LogComponent,
|
||||
ProcessServiceComponent,
|
||||
ShowDiagramComponent,
|
||||
FormViewerComponent,
|
||||
FormNodeViewerComponent,
|
||||
AppsViewComponent,
|
||||
FilesComponent,
|
||||
FilteredSearchComponent,
|
||||
FormComponent,
|
||||
FormListComponent,
|
||||
VersionManagerDialogAdapterComponent,
|
||||
MetadataDialogAdapterComponent,
|
||||
TaskAttachmentsComponent,
|
||||
ProcessAttachmentsComponent,
|
||||
OverlayViewerComponent,
|
||||
SharedLinkViewComponent,
|
||||
FormLoadingComponent,
|
||||
DemoPermissionComponent,
|
||||
DemoErrorComponent,
|
||||
FormLoadingComponent,
|
||||
TreeViewSampleComponent,
|
||||
AspectListSampleComponent,
|
||||
CloudLayoutComponent,
|
||||
AppsCloudDemoComponent,
|
||||
TasksCloudDemoComponent,
|
||||
@@ -198,11 +180,8 @@ registerLocaleData(localeSv);
|
||||
StartProcessCloudDemoComponent,
|
||||
CloudBreadcrumbsComponent,
|
||||
CloudFiltersDemoComponent,
|
||||
TemplateDemoComponent,
|
||||
PeopleGroupCloudDemoComponent,
|
||||
ConfirmDialogExampleComponent,
|
||||
FormCloudDemoComponent,
|
||||
ConfirmDialogExampleComponent,
|
||||
CustomEditorComponent,
|
||||
CustomWidgetComponent,
|
||||
ProcessCloudLayoutComponent,
|
||||
@@ -212,7 +191,6 @@ registerLocaleData(localeSv);
|
||||
providers: [
|
||||
{ provide: AppConfigService, useClass: DebugAppConfigService }, // not use this service in production
|
||||
provideTranslations('app', 'resources'),
|
||||
provideTranslations('lazy-loading', 'resources/lazy-loading'),
|
||||
AppNotificationsService,
|
||||
{
|
||||
provide: APP_INITIALIZER,
|
||||
|
@@ -26,11 +26,9 @@ import { FormViewerComponent } from './components/process-service/form-viewer.co
|
||||
import { FormNodeViewerComponent } from './components/process-service/form-node-viewer.component';
|
||||
import { AppsViewComponent } from './components/process-service/apps-view.component';
|
||||
import { SearchResultComponent } from './components/search/search-result.component';
|
||||
import { SearchExtendedComponent } from './components/search/search-extended.component';
|
||||
import { FilesComponent } from './components/files/files.component';
|
||||
import { FormComponent } from './components/form/form.component';
|
||||
import { FormListComponent } from './components/form/form-list.component';
|
||||
import { OverlayViewerComponent } from './components/overlay-viewer/overlay-viewer.component';
|
||||
import { SharedLinkViewComponent } from './components/shared-link-view/shared-link-view.component';
|
||||
import { FormLoadingComponent } from './components/form/form-loading.component';
|
||||
import { DemoPermissionComponent } from './components/permissions/demo-permissions.component';
|
||||
@@ -46,15 +44,11 @@ import { StartProcessCloudDemoComponent } from './components/cloud/start-process
|
||||
import { TaskDetailsCloudDemoComponent } from './components/cloud/task-details-cloud-demo.component';
|
||||
import { CloudViewerComponent } from './components/cloud/cloud-viewer.component';
|
||||
import { ProcessDetailsCloudDemoComponent } from './components/cloud/process-details-cloud-demo.component';
|
||||
import { TemplateDemoComponent } from './components/template-list/template-demo.component';
|
||||
import { FormCloudDemoComponent } from './components/app-layout/cloud/form-demo/cloud-form-demo.component';
|
||||
import { ConfirmDialogExampleComponent } from './components/confirm-dialog/confirm-dialog-example.component';
|
||||
import { DemoErrorComponent } from './components/error/demo-error.component';
|
||||
import { TaskHeaderCloudDemoComponent } from './components/cloud/task-header-cloud-demo.component';
|
||||
import { FilteredSearchComponent } from './components/files/filtered-search.component';
|
||||
import { ProcessCloudLayoutComponent } from './components/cloud/process-cloud-layout.component';
|
||||
import { ServiceTaskListCloudDemoComponent } from './components/cloud/service-task-list-cloud-demo.component';
|
||||
import { AspectListSampleComponent } from './components/aspect-list-sample/aspect-list-sample.component';
|
||||
import { SearchFilterChipsComponent } from './components/search/search-filter-chips.component';
|
||||
|
||||
export const appRoutes: Routes = [
|
||||
@@ -70,12 +64,7 @@ export const appRoutes: Routes = [
|
||||
canActivate: [AuthGuardEcm],
|
||||
canActivateChild: [AuthGuardEcm],
|
||||
outlet: 'overlay',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
}
|
||||
]
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
},
|
||||
{
|
||||
path: 'files/:nodeId/:versionId/view',
|
||||
@@ -83,24 +72,14 @@ export const appRoutes: Routes = [
|
||||
canActivate: [AuthGuardEcm],
|
||||
canActivateChild: [AuthGuardEcm],
|
||||
outlet: 'overlay',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
}
|
||||
]
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
},
|
||||
{
|
||||
path: 'preview/blob',
|
||||
component: AppComponent,
|
||||
outlet: 'overlay',
|
||||
pathMatch: 'full',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
}
|
||||
]
|
||||
loadChildren: () => import('./components/file-view/file-view.module').then(m => m.FileViewModule)
|
||||
},
|
||||
{ path: 'preview/s/:id', component: SharedLinkViewComponent },
|
||||
{
|
||||
@@ -113,64 +92,13 @@ export const appRoutes: Routes = [
|
||||
redirectTo: `/home`,
|
||||
pathMatch: 'full'
|
||||
},
|
||||
{
|
||||
path: 'breadcrumb',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/breadcrumb-demo/breadcrumb-demo.module').then(m => m.AppBreadcrumbModule)
|
||||
},
|
||||
{
|
||||
path: 'notifications',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/notifications/notifications.module').then(m => m.AppNotificationsModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'config-editor',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/config-editor/config-editor.module').then(m => m.AppConfigEditorModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'pipes',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/pipes/pipes.module').then(m => m.AppPipesModule)
|
||||
}
|
||||
]
|
||||
loadChildren: () => import('./components/config-editor/config-editor.module').then(m => m.AppConfigEditorModule)
|
||||
},
|
||||
{
|
||||
path: 'card-view',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/card-view/card-view.module').then(m => m.AppCardViewModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'sites',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/sites/sites.module').then(m => m.SitesModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'header-data',
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
loadChildren: () => import('./components/header-data/header-data.module').then(m => m.AppHeaderDataModule)
|
||||
}
|
||||
]
|
||||
loadChildren: () => import('./components/card-view/card-view.module').then(m => m.AppCardViewModule)
|
||||
},
|
||||
{
|
||||
path: '',
|
||||
@@ -255,14 +183,6 @@ export const appRoutes: Routes = [
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: 'node-selector',
|
||||
loadChildren: () => import('./components/content-node-selector/content-node-selector.module').then(m => m.AppContentNodeSelectorModule)
|
||||
},
|
||||
{
|
||||
path: 'confirm-dialog',
|
||||
component: ConfirmDialogExampleComponent
|
||||
},
|
||||
{
|
||||
path: 'settings-layout',
|
||||
loadChildren: () => import('./components/settings/settings.module').then(m => m.AppSettingsModule)
|
||||
@@ -277,26 +197,6 @@ export const appRoutes: Routes = [
|
||||
component: FilesComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'filtered-search',
|
||||
component: FilteredSearchComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'filtered-search/:id',
|
||||
component: FilteredSearchComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'filtered-search/:id/display/:mode',
|
||||
component: FilteredSearchComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'extensions/document-list/presets',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/document-list/extension-presets/extension-presets.module').then(m => m.ExtensionPresetsModule)
|
||||
},
|
||||
{
|
||||
path: 'files/:id',
|
||||
component: FilesComponent,
|
||||
@@ -311,19 +211,6 @@ export const appRoutes: Routes = [
|
||||
path: 'dl-custom-sources',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/files/custom-sources.module').then(m => m.AppCustomSourcesModule)
|
||||
|
||||
},
|
||||
{
|
||||
path: 'datatable',
|
||||
loadChildren: () => import('./components/datatable/datatable.module').then(m => m.AppDataTableModule)
|
||||
},
|
||||
{
|
||||
path: 'datatable/dnd',
|
||||
loadChildren: () => import('./components/datatable/drag-and-drop/datatable-dnd.module').then(m => m.AppDataTableDndModule)
|
||||
},
|
||||
{
|
||||
path: 'rich-text-editor',
|
||||
loadChildren: () => import('./components/rich-text-editor/rich-text-editor.module').then(m => m.AppRichTextEditorModule)
|
||||
},
|
||||
{
|
||||
path: 'search',
|
||||
@@ -335,11 +222,6 @@ export const appRoutes: Routes = [
|
||||
component: SearchFilterChipsComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'extendedSearch',
|
||||
component: SearchExtendedComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'activiti',
|
||||
component: AppsViewComponent,
|
||||
@@ -399,21 +281,6 @@ export const appRoutes: Routes = [
|
||||
component: FormNodeViewerComponent,
|
||||
canActivate: [AuthGuardBpm]
|
||||
},
|
||||
{
|
||||
path: 'webscript',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/webscript/webscript.module').then(m => m.AppWebScriptModule)
|
||||
},
|
||||
{
|
||||
path: 'tag',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/tag/tag.module').then(m => m.AppTagModule)
|
||||
},
|
||||
{
|
||||
path: 'social',
|
||||
canActivate: [AuthGuardEcm],
|
||||
loadChildren: () => import('./components/social/social.module').then(m => m.AppSocialModule)
|
||||
},
|
||||
{
|
||||
path: 'permissions/:id',
|
||||
component: DemoPermissionComponent,
|
||||
@@ -424,40 +291,14 @@ export const appRoutes: Routes = [
|
||||
component: TreeViewSampleComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'expandable-list',
|
||||
component: AspectListSampleComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'about',
|
||||
loadChildren: () => import('./components/about/about.module').then(m => m.AppAboutModule)
|
||||
},
|
||||
{
|
||||
path: 'icons',
|
||||
loadChildren: () => import('./components/icons/icons.module').then(m => m.AppIconsModule)
|
||||
},
|
||||
{ path: 'form-cloud', component: FormCloudDemoComponent },
|
||||
{ path: 'form', component: FormComponent },
|
||||
{ path: 'form-list', component: FormListComponent },
|
||||
{ path: 'form-loading', component: FormLoadingComponent },
|
||||
{
|
||||
path: 'overlay-viewer',
|
||||
component: OverlayViewerComponent,
|
||||
canActivate: [AuthGuardEcm]
|
||||
},
|
||||
{
|
||||
path: 'datatable-lazy',
|
||||
loadChildren: () => import('./components/lazy-loading/lazy-loading.module').then(m => m.LazyLoadingModule)
|
||||
},
|
||||
{
|
||||
path: 'copy-content',
|
||||
loadChildren: () => import('./components/datatable/copy-content/datatable.module').then(m => m.AppDataTableCopyModule)
|
||||
},
|
||||
{
|
||||
path: 'template-list',
|
||||
component: TemplateDemoComponent
|
||||
},
|
||||
{
|
||||
path: 'task-list',
|
||||
canActivate: [AuthGuardBpm],
|
||||
|
@@ -1,4 +1,4 @@
|
||||
<mat-slide-toggle [(ngModel)]="dev">{{'APP.ABOUT.DEVELOPMENT' | translate }}</mat-slide-toggle>
|
||||
<mat-slide-toggle [(ngModel)]="dev">Dev Mode</mat-slide-toggle>
|
||||
|
||||
<adf-about>
|
||||
<adf-about-panel *ngIf="dev" [label]="'ABOUT.SERVER_SETTINGS.TITLE' | translate">
|
||||
|
@@ -1,30 +1,24 @@
|
||||
<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="220" [stepOver]="780" [hideSidenav]="hideSidenav"
|
||||
[expandedSidenav]="expandedSidenav" (expanded)="setState($event)" [position]="position" data-automation-id="sidenav-layout">
|
||||
<adf-sidenav-layout
|
||||
[sidenavMin]="70"
|
||||
[sidenavMax]="220"
|
||||
[stepOver]="780"
|
||||
data-automation-id="sidenav-layout">
|
||||
|
||||
<adf-sidenav-layout-header>
|
||||
<ng-template let-toggleMenu="toggleMenu" let-isMenuMinimized="isMenuMinimized">
|
||||
|
||||
<ng-template>
|
||||
<adf-layout-header
|
||||
id="adf-header"
|
||||
[title]="title | translate"
|
||||
[redirectUrl]="redirectUrl"
|
||||
[logo]="logo"
|
||||
[tooltip]="tooltip | translate"
|
||||
[showSidenavToggle]="showMenu"
|
||||
[expandedSidenav]="!isMenuMinimized()"
|
||||
[color]="color"
|
||||
[position]="position"
|
||||
(clicked)=toggleMenu($event)>
|
||||
title="ADF Demo Application"
|
||||
redirectUrl="/home"
|
||||
tooltip="ADF Demo Application"
|
||||
[showSidenavToggle]="false">
|
||||
|
||||
<div class="app-layout-menu-spacer"></div>
|
||||
|
||||
<app-search-bar></app-search-bar>
|
||||
|
||||
<div class="app-header-delimiexpandedSidenavter"></div>
|
||||
|
||||
<app-shell-user-info [menuPositionX]="'before'" [menuPositionY]="'above'"></app-shell-user-info>
|
||||
|
||||
<app-theme-picker></app-theme-picker>
|
||||
<button data-automation-id="language-menu-button" mat-icon-button [matMenuTriggerFor]="langMenu">
|
||||
<mat-icon>language</mat-icon>
|
||||
</button>
|
||||
@@ -33,7 +27,6 @@
|
||||
</mat-menu>
|
||||
|
||||
<adf-notification-history menuPositionX="before" menuPositionY="above"></adf-notification-history>
|
||||
|
||||
</adf-layout-header>
|
||||
</ng-template>
|
||||
</adf-sidenav-layout-header>
|
||||
@@ -78,7 +71,6 @@
|
||||
</adf-sidenav-layout-content>
|
||||
|
||||
</adf-sidenav-layout>
|
||||
<app-log></app-log>
|
||||
|
||||
<mat-menu #nestedMenu="matMenu" xPosition="after" class="nestedMenu">
|
||||
<ng-template matMenuContent let-links="links">
|
||||
|
@@ -1,15 +1,3 @@
|
||||
@media screen and (max-width: 599px) {
|
||||
app-search-bar {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 350px) {
|
||||
app-search-bar {
|
||||
width: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
adf-file-uploading-dialog {
|
||||
z-index: 1100;
|
||||
}
|
||||
@@ -33,21 +21,11 @@ adf-file-uploading-dialog {
|
||||
}
|
||||
}
|
||||
|
||||
.mat-nav-list .mat-list-item.app-sidenav-link {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
&-menu-spacer {
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 959px) {
|
||||
.app-menu {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
mat-sidenav-content > div {
|
||||
display: flex;
|
||||
height: 100%;
|
||||
@@ -56,7 +34,3 @@ mat-sidenav-content > div {
|
||||
flex: auto;
|
||||
}
|
||||
}
|
||||
|
||||
[dir='rtl'] .app-sidenav-link__expand-button {
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
|
@@ -15,12 +15,8 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, ViewEncapsulation, OnInit, OnDestroy } from '@angular/core';
|
||||
import { UserPreferencesService, AppConfigService, AlfrescoApiService, UserPreferenceValues } from '@alfresco/adf-core';
|
||||
import { HeaderDataService } from '../header-data/header-data.service';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { ThemePalette } from '@angular/material/core';
|
||||
import { Component, ViewEncapsulation } from '@angular/core';
|
||||
import { AlfrescoApiService } from '@alfresco/adf-core';
|
||||
|
||||
@Component({
|
||||
templateUrl: './app-layout.component.html',
|
||||
@@ -28,158 +24,43 @@ import { ThemePalette } from '@angular/material/core';
|
||||
host: { class: 'app-layout' },
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class AppLayoutComponent implements OnInit, OnDestroy {
|
||||
private onDestroy$ = new Subject<boolean>();
|
||||
|
||||
export class AppLayoutComponent {
|
||||
links: Array<any> = [
|
||||
{ href: '/home', icon: 'home', title: 'APP_LAYOUT.HOME' },
|
||||
{ href: '/home', icon: 'home', title: 'Home' },
|
||||
{ href: '/files', icon: 'folder_open', title: 'Content Services' },
|
||||
{ href: '/card-view', icon: 'view_headline', title: 'CardView' },
|
||||
{ href: '/task-list', icon: 'assignment', title: 'Task List' },
|
||||
{
|
||||
href: '/extensions', icon: 'extension', title: 'Extensions', children: [
|
||||
{ href: '/extensions/document-list/presets', icon: 'extension', title: 'Document List' }
|
||||
href: '/cloud', icon: 'cloud', title: 'Process Cloud', children: [
|
||||
{ href: '/cloud/', icon: 'cloud', title: 'Home' },
|
||||
{ href: '/cloud/community', icon: 'cloud', title: 'Community' },
|
||||
{ href: '/form-cloud', icon: 'poll', title: 'Form' },
|
||||
{ href: '/cloud/people-group-cloud', icon: 'group', title: 'People/Group Cloud' },
|
||||
{ href: '/cloud/task-header-cloud', icon: 'cloud', title: 'Task Header Cloud' },
|
||||
{ href: '/cloud/service-task-list', icon: 'cloud', title: 'Service Task List' }
|
||||
]
|
||||
},
|
||||
{ href: '/files', icon: 'folder_open', title: 'APP_LAYOUT.CONTENT_SERVICES' },
|
||||
{ href: '/filtered-search', icon: 'rowing', title: 'APP_LAYOUT.FILTERED_SEARCH' },
|
||||
{ href: '/breadcrumb', icon: 'label', title: 'APP_LAYOUT.BREADCRUMB' },
|
||||
{ href: '/notifications', icon: 'alarm', title: 'APP_LAYOUT.NOTIFICATIONS' },
|
||||
{ href: '/card-view', icon: 'view_headline', title: 'APP_LAYOUT.CARD_VIEW' },
|
||||
{ href: '/confirm-dialog', icon: 'view_headline', title: 'APP_LAYOUT.CONFIRM-DIALOG' },
|
||||
{ href: '/header-data', icon: 'edit', title: 'APP_LAYOUT.HEADER_DATA' },
|
||||
{ href: '/node-selector', icon: 'attachment', title: 'APP_LAYOUT.NODE-SELECTOR' },
|
||||
{ href: '/sites', icon: 'format_list_bulleted', title: 'APP_LAYOUT.SITES' },
|
||||
{ href: '/task-list', icon: 'assignment', title: 'APP_LAYOUT.TASK_LIST' },
|
||||
{
|
||||
href: '/cloud', icon: 'cloud', title: 'APP_LAYOUT.PROCESS_CLOUD', children: [
|
||||
{ href: '/cloud/', icon: 'cloud', title: 'APP_LAYOUT.HOME' },
|
||||
{ href: '/cloud/community', icon: 'cloud', title: 'APP_LAYOUT.COMMUNITY' },
|
||||
{ href: '/form-cloud', icon: 'poll', title: 'APP_LAYOUT.FORM' },
|
||||
{ href: '/cloud/people-group-cloud', icon: 'group', title: 'APP_LAYOUT.PEOPLE_GROUPS_CLOUD' },
|
||||
{ href: '/cloud/task-header-cloud', icon: 'cloud', title: 'APP_LAYOUT.TASK_HEADER_CLOUD.COMPONENT_NAME' },
|
||||
{ href: '/cloud/service-task-list', icon: 'cloud', title: 'APP_LAYOUT.SERVICE_TASK_LIST' }
|
||||
]
|
||||
},
|
||||
{ href: '/activiti', icon: 'device_hub', title: 'APP_LAYOUT.PROCESS_SERVICES', children: [
|
||||
{ href: '/activiti', icon: 'vpn_key', title: 'APP_LAYOUT.APP' },
|
||||
{ href: '/process-list', icon: 'assignment', title: 'APP_LAYOUT.PROCESS_LIST' },
|
||||
{ href: '/form', icon: 'poll', title: 'APP_LAYOUT.FORM' },
|
||||
{ href: '/form-list', icon: 'library_books', title: 'APP_LAYOUT.FORM_LIST' },
|
||||
{ href: '/form-loading', icon: 'cached', title: 'APP_LAYOUT.FORM_LOADING' }
|
||||
{ href: '/activiti', icon: 'device_hub', title: 'Process Services', children: [
|
||||
{ href: '/activiti', icon: 'vpn_key', title: 'App' },
|
||||
{ href: '/process-list', icon: 'assignment', title: 'Process List' },
|
||||
{ href: '/form', icon: 'poll', title: 'Form' },
|
||||
{ href: '/form-list', icon: 'library_books', title: 'Form List' },
|
||||
{ href: '/form-loading', icon: 'cached', title: 'Form Loading' }
|
||||
]},
|
||||
{ href: '/login', icon: 'vpn_key', title: 'APP_LAYOUT.LOGIN' },
|
||||
{ href: '/trashcan', icon: 'delete', title: 'APP_LAYOUT.TRASHCAN' },
|
||||
{ href: '/dl-custom-sources', icon: 'extension', title: 'APP_LAYOUT.CUSTOM_SOURCES' },
|
||||
{ href: '/datatable', icon: 'view_module', title: 'APP_LAYOUT.DATATABLE', children: [
|
||||
{ href: '/datatable', icon: 'view_module', title: 'APP_LAYOUT.DATATABLE' },
|
||||
{ href: '/datatable-lazy', icon: 'view_module', title: 'APP_LAYOUT.DATATABLE_LAZY' },
|
||||
{ href: '/datatable/dnd', icon: 'view_module', title: 'Drag and Drop' },
|
||||
{ href: '/copy-content', icon: 'view_module', title: 'Copy Content' }
|
||||
]},
|
||||
{ href: '/rich-text-editor', icon: 'list_alt', title: 'APP_LAYOUT.RICH_TEXT_EDITOR' },
|
||||
{ href: '/template-list', icon: 'list_alt', title: 'APP_LAYOUT.TEMPLATE' },
|
||||
{ href: '/webscript', icon: 'extension', title: 'APP_LAYOUT.WEBSCRIPT' },
|
||||
{ href: '/tag', icon: 'local_offer', title: 'APP_LAYOUT.TAG' },
|
||||
{ href: '/social', icon: 'thumb_up', title: 'APP_LAYOUT.SOCIAL' },
|
||||
{ href: '/pipes', icon: 'layers', title: 'APP_LAYOUT.PIPES' },
|
||||
{ href: '/settings-layout', icon: 'settings', title: 'APP_LAYOUT.SETTINGS' },
|
||||
{ href: '/config-editor', icon: 'code', title: 'APP_LAYOUT.CONFIG-EDITOR' },
|
||||
{ href: '/extendedSearch', icon: 'search', title: 'APP_LAYOUT.SEARCH' },
|
||||
/* cspell:disable-next-line */
|
||||
{ href: '/overlay-viewer', icon: 'pageview', title: 'APP_LAYOUT.OVERLAY_VIEWER' },
|
||||
{ href: '/treeview', icon: 'nature', title: 'APP_LAYOUT.TREE_VIEW' },
|
||||
{ href: '/expandable-list', icon: 'hot_tub', title: 'APP_LAYOUT.EXPAND_LIST' },
|
||||
{ href: '/icons', icon: 'tag_faces', title: 'APP_LAYOUT.ICONS' },
|
||||
{ href: '/about', icon: 'info_outline', title: 'APP_LAYOUT.ABOUT' }
|
||||
{ href: '/login', icon: 'vpn_key', title: 'Login' },
|
||||
{ href: '/trashcan', icon: 'delete', title: 'Trashcan' },
|
||||
{ href: '/dl-custom-sources', icon: 'extension', title: 'Custom Sources' },
|
||||
{ href: '/settings-layout', icon: 'settings', title: 'Settings' },
|
||||
{ href: '/config-editor', icon: 'code', title: 'Configuration Editor' },
|
||||
{ href: '/treeview', icon: 'nature', title: 'Tree View' },
|
||||
{ href: '/about', icon: 'info_outline', title: 'About' }
|
||||
];
|
||||
|
||||
expandedSidenav = false;
|
||||
|
||||
position: 'start' | 'end' = 'start';
|
||||
direction = 'ltr';
|
||||
|
||||
hideSidenav = false;
|
||||
showMenu = true;
|
||||
|
||||
enableRedirect = true;
|
||||
color: ThemePalette = 'primary';
|
||||
title = 'APP_LAYOUT.APP_NAME';
|
||||
logo: string;
|
||||
redirectUrl: string | any[] = ['/home'];
|
||||
tooltip = 'APP_LAYOUT.APP_NAME';
|
||||
|
||||
ngOnInit() {
|
||||
const expand = this.config.get<boolean>('sideNav.expandedSidenav');
|
||||
const preserveState = this.config.get('sideNav.preserveState');
|
||||
|
||||
if (preserveState && expand) {
|
||||
this.expandedSidenav = (this.userPreferences.get('expandedSidenav', expand.toString()) === 'true');
|
||||
} else if (expand) {
|
||||
this.expandedSidenav = expand;
|
||||
}
|
||||
|
||||
this.headerService.hideMenu
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(show => this.showMenu = show);
|
||||
|
||||
this.headerService.color
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(color => {
|
||||
if (['primary', 'accent', 'warn'].includes(color)) {
|
||||
this.color = color;
|
||||
} else {
|
||||
this.color = undefined;
|
||||
document.documentElement.style.setProperty('--theme-primary-color', color);
|
||||
}
|
||||
});
|
||||
|
||||
this.headerService.title
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(title => this.title = title);
|
||||
|
||||
this.headerService.headerTextColor
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(headerTextColor => {
|
||||
document.documentElement.style.setProperty('--theme-header-text-color', headerTextColor);
|
||||
});
|
||||
|
||||
this.headerService.logo
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(path => this.logo = path);
|
||||
|
||||
this.headerService.redirectUrl
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(redirectUrl => this.redirectUrl = redirectUrl);
|
||||
|
||||
this.headerService.tooltip
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(tooltip => this.tooltip = tooltip);
|
||||
|
||||
this.headerService.position
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(position => this.position = position);
|
||||
|
||||
this.headerService.hideSidenav
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(hideSidenav => this.hideSidenav = hideSidenav);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.onDestroy$.next(true);
|
||||
this.onDestroy$.complete();
|
||||
}
|
||||
|
||||
constructor(
|
||||
private userPreferences: UserPreferencesService,
|
||||
private config: AppConfigService,
|
||||
private alfrescoApiService: AlfrescoApiService,
|
||||
private headerService: HeaderDataService) {
|
||||
constructor(private alfrescoApiService: AlfrescoApiService) {
|
||||
if (this.alfrescoApiService.getInstance().isOauthConfiguration()) {
|
||||
this.enableRedirect = false;
|
||||
}
|
||||
}
|
||||
|
||||
setState(state) {
|
||||
if (this.config.get('sideNav.preserveState')) {
|
||||
this.userPreferences.set(UserPreferenceValues.ExpandedSideNavStatus, state);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -1,18 +0,0 @@
|
||||
<div class="example-button-container">
|
||||
<p> ASPECT CHOSEN :</p>
|
||||
<p>{{currentResult}}</p>
|
||||
<br>
|
||||
<mat-form-field class="example-almost-full-width">
|
||||
<mat-label>Node Id For Aspects</mat-label>
|
||||
<input matInput placeholder="Node Id" [(ngModel)]="currentNodeId">
|
||||
</mat-form-field>
|
||||
<button mat-raised-button color="primary" [attr.aria-label]="'SHOW_LIST_LABEL' | translate" (click)="showAspectForNode()">
|
||||
Show/Hide List
|
||||
</button>
|
||||
<adf-aspect-list [nodeId]="currentNodeId" *ngIf="isShowed" (valueChanged)="onValueChanged($event)"></adf-aspect-list>
|
||||
</div>
|
||||
<div>
|
||||
<button mat-fab color="primary" [attr.aria-label]="'OPEN_DIALOG' | translate" (click)="openAspectDialog()">
|
||||
Dialog
|
||||
</button>
|
||||
</div>
|
@@ -1,7 +0,0 @@
|
||||
.example-button-container {
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.example-almost-full-width {
|
||||
width: 70%;
|
||||
}
|
@@ -1,47 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { DialogAspectListService } from '@alfresco/adf-content-services';
|
||||
import { Component } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-expandable-menu',
|
||||
templateUrl: './aspect-list-sample.component.html',
|
||||
styleUrls: ['./aspect-list-sample.component.scss']
|
||||
})
|
||||
export class AspectListSampleComponent {
|
||||
|
||||
currentNodeId: string = '';
|
||||
isShowed: boolean = false;
|
||||
|
||||
currentResult: string[] = [];
|
||||
|
||||
constructor(private dialogAspectListService: DialogAspectListService) { }
|
||||
|
||||
showAspectForNode() {
|
||||
this.isShowed = !this.isShowed;
|
||||
}
|
||||
|
||||
openAspectDialog() {
|
||||
this.dialogAspectListService.openAspectListDialog(this.currentNodeId).subscribe((result) => this.currentResult = Array.from(result));
|
||||
}
|
||||
|
||||
onValueChanged(aspects) {
|
||||
this.currentResult = Array.from(aspects);
|
||||
}
|
||||
|
||||
}
|
@@ -1,87 +0,0 @@
|
||||
<main>
|
||||
<h1>Breadcrumb</h1>
|
||||
<ul>
|
||||
<li>Try creating and navigating long paths</li>
|
||||
<li>Try resizing the browser width to ensure items are trimmed as expected</li>
|
||||
</ul>
|
||||
|
||||
<h2>1. Standalone (fixed size)</h2>
|
||||
<small>Component is used in the fixed-width layout</small>
|
||||
|
||||
<div class="app-breadcrumb-container-restricted">
|
||||
<adf-breadcrumb root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</div>
|
||||
|
||||
<h2>2. Standalone (full width)</h2>
|
||||
<small>Component fits the parent container width</small>
|
||||
|
||||
<div>
|
||||
<adf-breadcrumb root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</div>
|
||||
|
||||
<h2>2.1 Standalone with Dropdown (full width)</h2>
|
||||
<small>
|
||||
Component fits the parent container width but is limited to 3 items to display at once.
|
||||
It should automatically switch to the Dropdown mode if the path exceeds 3 nodes.
|
||||
</small>
|
||||
|
||||
<div>
|
||||
<adf-breadcrumb [maxItems]="3" root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</div>
|
||||
|
||||
<h2>3. Toolbar (standalone)</h2>
|
||||
<small>Component used as a child of the Toolbar component</small>
|
||||
|
||||
<adf-toolbar>
|
||||
<adf-breadcrumb root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</adf-toolbar>
|
||||
|
||||
<h2>4. Toolbar (title)</h2>
|
||||
<small>Component is wrapped into the Toolbar Title component</small>
|
||||
|
||||
<adf-toolbar>
|
||||
<adf-toolbar-title>
|
||||
<adf-breadcrumb root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</adf-toolbar-title>
|
||||
</adf-toolbar>
|
||||
|
||||
<h2>5. Toolbar with separators and buttons</h2>
|
||||
<small>
|
||||
Component is wrapped into the Toolbar Title component.
|
||||
The toolbar also has separators and buttons that might provide impact on breadcrumb layout.
|
||||
Buttons do nothing and are present for layout purposes.
|
||||
</small>
|
||||
|
||||
<adf-toolbar class="app-full-content-toolbar">
|
||||
<adf-toolbar-title>
|
||||
<adf-breadcrumb root="APP.PERSONAL-FILES" [target]="documentList" [folderNode]="documentList.folderNode">
|
||||
</adf-breadcrumb>
|
||||
</adf-toolbar-title>
|
||||
<adf-toolbar-divider></adf-toolbar-divider>
|
||||
<button mat-icon-button [attr.aria-label]="'BREADCRUMB_DEMO.NEW_FOLDER_LABEL' | translate">
|
||||
<mat-icon>create_new_folder</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button [attr.aria-label]="'BREADCRUMB_DEMO.EDIT_NODE_LABEL' | translate">
|
||||
<mat-icon>create</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button [attr.aria-label]="'BREADCRUMB_DEMO.DELETE_NODE_LABEL' | translate">
|
||||
<mat-icon>delete</mat-icon>
|
||||
</button>
|
||||
</adf-toolbar>
|
||||
|
||||
<h2>6. Dropdown Breadcrumb</h2>
|
||||
|
||||
<adf-dropdown-breadcrumb class="app-files-breadcrumb"
|
||||
[target]="documentList">
|
||||
</adf-dropdown-breadcrumb>
|
||||
|
||||
<div class="app-content">
|
||||
<adf-document-list #documentList currentFolderId="-my-">
|
||||
</adf-document-list>
|
||||
</div>
|
||||
</main>
|
@@ -1,21 +0,0 @@
|
||||
app-breadcrumb-demo {
|
||||
.app-breadcrumb-container-restricted {
|
||||
width: 800px;
|
||||
max-width: 800px;
|
||||
border: 1px solid lightgray;
|
||||
}
|
||||
|
||||
.app-content {
|
||||
margin: 10px 0;
|
||||
}
|
||||
|
||||
.app-full-content-toolbar .app-toolbar-title .app-breadcrumb {
|
||||
width: 0;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 600px) {
|
||||
.app-files-breadcrumb {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
@@ -1,28 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, ViewEncapsulation } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-breadcrumb-demo',
|
||||
templateUrl: './breadcrumb-demo.component.html',
|
||||
styleUrls: [`./breadcrumb-demo.component.scss`],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class BreadcrumbDemoComponent {
|
||||
|
||||
}
|
@@ -1,42 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { BreadcrumbDemoComponent } from './breadcrumb-demo.component';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: BreadcrumbDemoComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes),
|
||||
ContentModule.forChild()
|
||||
],
|
||||
declarations: [BreadcrumbDemoComponent],
|
||||
exports: [BreadcrumbDemoComponent]
|
||||
})
|
||||
export class AppBreadcrumbModule {}
|
@@ -1,5 +1,5 @@
|
||||
<mat-tab-group class="app-cloud-layout-tab-body">
|
||||
<mat-tab label="{{'PS_CLOUD_TAB.APPS_TAB' | translate}}">
|
||||
<mat-tab label="App">
|
||||
<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="270" [stepOver]="780">
|
||||
<adf-sidenav-layout-header>
|
||||
<ng-template>
|
||||
@@ -8,18 +8,18 @@
|
||||
</adf-sidenav-layout-header>
|
||||
<adf-sidenav-layout-navigation>
|
||||
<ng-template>
|
||||
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
|
||||
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="CREATE">
|
||||
<mat-icon adf-sidebar-menu-title-icon>arrow_drop_down</mat-icon>
|
||||
<div adf-sidebar-menu-options>
|
||||
<button mat-menu-item data-automation-id="btn-start-task" (click)="onStartTask()">
|
||||
<mat-icon>assessment</mat-icon>
|
||||
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
|
||||
<span>New Task</span>
|
||||
</button>
|
||||
</div>
|
||||
<div adf-sidebar-menu-options>
|
||||
<button mat-menu-item data-automation-id="btn-start-process" (click)="onStartProcess()">
|
||||
<mat-icon>assessment</mat-icon>
|
||||
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_PROCESS' | translate}}</span>
|
||||
<span>New Process</span>
|
||||
</button>
|
||||
</div>
|
||||
</adf-sidebar-action-menu>
|
||||
@@ -33,7 +33,7 @@
|
||||
</adf-sidenav-layout-content>
|
||||
</adf-sidenav-layout>
|
||||
</mat-tab>
|
||||
<mat-tab label="{{'PS_CLOUD_TAB.SETTINGS_TAB' | translate}}">
|
||||
<mat-tab label="Settings">
|
||||
<app-cloud-settings></app-cloud-settings>
|
||||
</mat-tab>
|
||||
</mat-tab-group>
|
||||
|
@@ -1,20 +1,20 @@
|
||||
<mat-tab-group class="app-cloud-layout-tab-body">
|
||||
<mat-tab label="{{'PS_CLOUD_TAB.APPS_TAB' | translate}}">
|
||||
<mat-tab label="App">
|
||||
<adf-sidenav-layout [sidenavMin]="70" [sidenavMax]="270" [stepOver]="780">
|
||||
<adf-sidenav-layout-navigation>
|
||||
<ng-template>
|
||||
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.CREATE' | translate}}">
|
||||
<adf-sidebar-action-menu [expanded]="true" [width]="205" title="CREATE">
|
||||
<mat-icon adf-sidebar-menu-title-icon>arrow_drop_down</mat-icon>
|
||||
<div adf-sidebar-menu-options>
|
||||
<button mat-menu-item data-automation-id="btn-start-task" (click)="onStartTask()">
|
||||
<mat-icon>assessment</mat-icon>
|
||||
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_TASK' | translate}}</span>
|
||||
<span>New Task</span>
|
||||
</button>
|
||||
</div>
|
||||
<div adf-sidebar-menu-options>
|
||||
<button mat-menu-item data-automation-id="btn-start-process" (click)="onStartProcess()">
|
||||
<mat-icon>assessment</mat-icon>
|
||||
<span>{{'ADF_SIDEBAR_ACTION_MENU.BUTTON.NEW_PROCESS' | translate}}</span>
|
||||
<span>New Process</span>
|
||||
</button>
|
||||
</div>
|
||||
</adf-sidebar-action-menu>
|
||||
@@ -28,7 +28,7 @@
|
||||
</adf-sidenav-layout-content>
|
||||
</adf-sidenav-layout>
|
||||
</mat-tab>
|
||||
<mat-tab label="{{'PS_CLOUD_TAB.SETTINGS_TAB' | translate}}">
|
||||
<mat-tab label="Settings">
|
||||
<app-cloud-settings></app-cloud-settings>
|
||||
</mat-tab>
|
||||
</mat-tab-group>
|
||||
|
@@ -1,41 +1,33 @@
|
||||
<mat-card class="app-section">
|
||||
<mat-card-title>
|
||||
{{ 'APP_LAYOUT.PEOPLE_CLOUD' | translate}}
|
||||
</mat-card-title>
|
||||
<mat-card-title>People Cloud Component</mat-card-title>
|
||||
|
||||
<mat-card-content>
|
||||
<br>
|
||||
<mat-radio-group (change)="onChangePeopleMode($event)">
|
||||
<mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">{{
|
||||
'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
|
||||
<mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-multiple-mode" value="multiple">{{
|
||||
'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
|
||||
<mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-people-single-mode" value="single">Single Selection</mat-radio-button>
|
||||
<mat-radio-button class="app-people-multiple-mode" data-automation-id="app-people-multiple-mode" value="multiple">Multiple Selection</mat-radio-button>
|
||||
</mat-radio-group>
|
||||
<div class="app-people-control-options">
|
||||
<mat-form-field *ngIf="isPeopleAppNameSelected()" class="app-preselect-value">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }}</mat-label>
|
||||
<mat-label>Application Name</mat-label>
|
||||
<input matInput (input)="setPeopleAppName($any($event).target?.value)" data-automation-id="app-people-app-input" />
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-preselect-value">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
|
||||
<input matInput
|
||||
(input)="setPeopleRoles($any($event).target?.value)"
|
||||
data-automation-id="app-people-roles-input"/>
|
||||
<mat-label>Roles: ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
|
||||
<input matInput (input)="setPeopleRoles($any($event).target?.value)" data-automation-id="app-people-roles-input"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-preselect-value">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.GROUPS_RESTRICTION' | translate }} ["hr", "sales"]</mat-label>
|
||||
<mat-label>Groups Restriction ["hr", "sales"]</mat-label>
|
||||
<input matInput
|
||||
(input)="setPeopleGroupsRestriction($any($event).target?.value)"
|
||||
data-automation-id="app-people-groups-restriction-input"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-preselect-value-full">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.PRESELECTED_VALUE' | translate }} {{ defaultPeoplePlaceholder }}</mat-label>
|
||||
<mat-label>Preselect: {{ defaultPeoplePlaceholder }}</mat-label>
|
||||
<input matInput (input)="setPeoplePreselectValue($any($event).target?.value)" data-automation-id="app-people-preselect-input" />
|
||||
</mat-form-field>
|
||||
<mat-checkbox class="app-preselect-value" (change)="onChangePeopleValidation($event)">{{
|
||||
'PEOPLE_GROUPS_CLOUD.PRESELECT_VALIDATION' | translate }}</mat-checkbox>
|
||||
<mat-checkbox data-automation-id="app-people-readonly" value="{{ peopleReadonly }}" (change)="onChangePeopleReadonly($event)">{{
|
||||
'PEOPLE_GROUPS_CLOUD.READONLY_MODE' | translate }}</mat-checkbox>
|
||||
<mat-checkbox class="app-preselect-value" (change)="onChangePeopleValidation($event)">Preselect validation</mat-checkbox>
|
||||
<mat-checkbox data-automation-id="app-people-readonly" value="{{ peopleReadonly }}" (change)="onChangePeopleReadonly($event)">Read-only Mode</mat-checkbox>
|
||||
</div>
|
||||
<div>
|
||||
<adf-cloud-people
|
||||
@@ -51,7 +43,7 @@
|
||||
</div>
|
||||
|
||||
<div class="app-people-list" *ngIf="peopleMode === 'multiple'">
|
||||
<h4>{{ 'PEOPLE_GROUPS_CLOUD.ALL_PRESELECTED_USERS' | translate }}</h4>
|
||||
<h4>All Preselected Users</h4>
|
||||
<mat-list role="list">
|
||||
<mat-list-item *ngFor="let item of preSelectUsers" role="listitem">
|
||||
<mat-icon mat-list-icon>person</mat-icon>
|
||||
@@ -60,7 +52,7 @@
|
||||
</mat-list>
|
||||
|
||||
<div *ngIf="invalidUsers.length > 0">
|
||||
<h4>{{ 'PEOPLE_GROUPS_CLOUD.INVALID_USERS' | translate }} <mat-icon>warning</mat-icon> </h4>
|
||||
<h4>Invalid Users <mat-icon>warning</mat-icon> </h4>
|
||||
<mat-list role="list">
|
||||
<mat-list-item *ngFor="let invalidUser of invalidUsers" role="listitem">
|
||||
<mat-icon mat-list-icon>person</mat-icon>
|
||||
@@ -73,45 +65,33 @@
|
||||
</mat-card>
|
||||
|
||||
<mat-card class="app-section">
|
||||
<mat-card-title>
|
||||
{{ 'APP_LAYOUT.GROUPS_CLOUD' | translate}}
|
||||
</mat-card-title>
|
||||
<mat-card-title>Groups Cloud Component</mat-card-title>
|
||||
|
||||
<mat-card-content>
|
||||
<br>
|
||||
<mat-radio-group (change)="onChangeGroupsMode($event)">
|
||||
<mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">{{
|
||||
'PEOPLE_GROUPS_CLOUD.SINGLE' | translate }}</mat-radio-button>
|
||||
<mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-multiple-mode" value="multiple">{{
|
||||
'PEOPLE_GROUPS_CLOUD.MULTI' | translate }}</mat-radio-button>
|
||||
<mat-radio-button [checked]="true" class="app-people-single-mode" data-automation-id="app-group-single-mode" value="single">Single Selection</mat-radio-button>
|
||||
<mat-radio-button class="app-people-multiple-mode" data-automation-id="app-group-multiple-mode" value="multiple">Multiple Selection</mat-radio-button>
|
||||
</mat-radio-group>
|
||||
<div class="app-groups-control-options">
|
||||
<mat-form-field *ngIf="isGroupAppNameSelected()" class="app-preselect-value">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.APP_NAME' | translate }}</mat-label>
|
||||
<input matInput
|
||||
(input)="setGroupAppName($any($event).target?.value)"
|
||||
data-automation-id="app-group-app-input"/>
|
||||
<mat-label>Application Name</mat-label>
|
||||
<input matInput (input)="setGroupAppName($any($event).target?.value)" data-automation-id="app-group-app-input"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-preselect-value">
|
||||
<mat-label>{{ 'PEOPLE_GROUPS_CLOUD.ROLE' | translate }} ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
|
||||
<input matInput
|
||||
(input)="setGroupRoles($any($event).target?.value)"
|
||||
data-automation-id="app-group-roles-input"/>
|
||||
<mat-label>Roles: ["ACTIVITI_ADMIN", "ACTIVITI_USER"]</mat-label>
|
||||
<input matInput (input)="setGroupRoles($any($event).target?.value)" data-automation-id="app-group-roles-input"/>
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-preselect-value-full">
|
||||
<mat-label>Preselect: {{ defaultGroupPlaceholder }}</mat-label>
|
||||
<input matInput
|
||||
(input)="setGroupsPreselectValue($any($event).target?.value)"
|
||||
data-automation-id="app-group-preselect-input" />
|
||||
<input matInput (input)="setGroupsPreselectValue($any($event).target?.value)" data-automation-id="app-group-preselect-input" />
|
||||
</mat-form-field>
|
||||
<mat-checkbox class="app-preselect-value" (change)="onChangeGroupValidation($event)">
|
||||
{{ 'PEOPLE_GROUPS_CLOUD.PRESELECT_VALIDATION' | translate }}
|
||||
</mat-checkbox>
|
||||
<mat-checkbox class="app-preselect-value" (change)="onChangeGroupValidation($event)">Preselect validation</mat-checkbox>
|
||||
<mat-checkbox
|
||||
data-automation-id="app-group-readonly"
|
||||
value="{{ groupReadonly }}"
|
||||
(change)="onChangeGroupReadonly($event)">
|
||||
{{ 'PEOPLE_GROUPS_CLOUD.READONLY_MODE' | translate }}
|
||||
Read-only Mode
|
||||
</mat-checkbox>
|
||||
</div>
|
||||
<div>
|
||||
@@ -126,7 +106,7 @@
|
||||
</div>
|
||||
|
||||
<div class="app-group-list" *ngIf="groupMode === 'multiple'">
|
||||
<h4>{{ 'PEOPLE_GROUPS_CLOUD.ALL_PRESELECTED_GROUPS' | translate }}</h4>
|
||||
<h4>All Preselected Groups</h4>
|
||||
<mat-list role="list">
|
||||
<mat-list-item *ngFor="let item of preSelectGroup" role="listitem">
|
||||
<mat-icon mat-list-icon>group</mat-icon>
|
||||
@@ -135,7 +115,7 @@
|
||||
</mat-list>
|
||||
|
||||
<div *ngIf="invalidGroups.length > 0">
|
||||
<h4>{{ 'PEOPLE_GROUPS_CLOUD.INVALID_GROUPS' | translate }} <mat-icon>warning</mat-icon> </h4>
|
||||
<h4>Invalid Groups <mat-icon>warning</mat-icon> </h4>
|
||||
<mat-list role="list">
|
||||
<mat-list-item *ngFor="let invalidGroup of invalidGroups" role="listitem">
|
||||
<mat-icon mat-list-icon>group</mat-icon>
|
||||
|
@@ -46,25 +46,25 @@
|
||||
</adf-pagination>
|
||||
<div *ngIf="testingMode">
|
||||
<div *ngIf="multiselect">
|
||||
{{ 'SETTINGS_CLOUD.SELECTED_ROWS' | translate }}:
|
||||
Selected Rows:
|
||||
<ul>
|
||||
<li *ngFor="let row of selectedRows">{{ row.id }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div *ngIf="actionMenu">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}:</span>
|
||||
<span>Action Menu:</span>
|
||||
<br>
|
||||
<div *ngIf="selectedAction">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.PROCESS_ID' | translate }}: {{ selectedAction.id }}</span><br>
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedAction.actionType }}</span>
|
||||
<span>Process Instance ID: {{ selectedAction.id }}</span><br>
|
||||
<span>Action Type: {{ selectedAction.actionType }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="contextMenu">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}:</span>
|
||||
<span>Context Menu:</span>
|
||||
<br>
|
||||
<div *ngIf="selectedContextAction">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.PROCESS_ID' | translate }}: {{ selectedContextAction.id }}</span><br>
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedContextAction.actionType }}</span>
|
||||
<span>Process Instance ID: {{ selectedContextAction.id }}</span><br>
|
||||
<span>Action Type}: {{ selectedContextAction.actionType }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -1,25 +1,23 @@
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="multiselect" (change)="toggleMultiselect()" data-automation-id="multiSelection">
|
||||
{{ 'SETTINGS_CLOUD.MULTISELECTION' | translate }}
|
||||
<mat-slide-toggle [checked]="multiselect" (change)="toggleMultiselect()" data-automation-id="multiSelection">
|
||||
Multiselection
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="actionMenu" (change)="toggleActionMenu()" data-automation-id="actionmenu">
|
||||
{{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}
|
||||
<mat-slide-toggle [checked]="actionMenu" (change)="toggleActionMenu()" data-automation-id="actionmenu">
|
||||
Action Menu
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="contextMenu" (change)="toggleContextMenu()" data-automation-id="contextmenu">
|
||||
{{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}
|
||||
<mat-slide-toggle [checked]="contextMenu" (change)="toggleContextMenu()" data-automation-id="contextmenu">
|
||||
Context Menu
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="testingMode" (change)="toggleTestingMode()" data-automation-id="testingMode">
|
||||
{{ 'SETTINGS_CLOUD.TESTING_MODE' | translate }}
|
||||
<mat-slide-toggle [checked]="testingMode" (change)="toggleTestingMode()" data-automation-id="testingMode">
|
||||
Testing Mode
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="taskDetailsRedirection" (change)="toggleTaskDetailsRedirection()" data-automation-id="taskDetailsRedirection">
|
||||
{{ 'SETTINGS_CLOUD.TASK_DETAILS_REDIRECTION' | translate }}
|
||||
<mat-slide-toggle [checked]="taskDetailsRedirection" (change)="toggleTaskDetailsRedirection()" data-automation-id="taskDetailsRedirection">
|
||||
Display task details on task click
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [color]="'primary'" [checked]="processDetailsRedirection" (change)="toggleProcessDetailsRedirection()" data-automation-id="processDetailsRedirection">
|
||||
{{ 'SETTINGS_CLOUD.PROCESS_DETAILS_REDIRECTION' | translate }}
|
||||
<mat-slide-toggle [checked]="processDetailsRedirection" (change)="toggleProcessDetailsRedirection()" data-automation-id="processDetailsRedirection">
|
||||
Display process details on process click
|
||||
</mat-slide-toggle>
|
||||
<mat-form-field data-automation-id="selectionMode">
|
||||
<mat-label>
|
||||
{{ 'SETTINGS_CLOUD.SELECTION_MODE' | translate }}
|
||||
</mat-label>
|
||||
<mat-label>Selection Mode</mat-label>
|
||||
<mat-select [(ngModel)]="selectionMode" (selectionChange)="onSelectionModeChange()">
|
||||
<mat-option *ngFor="let option of selectionModeOptions" [value]="option.value">
|
||||
{{ option.title }}
|
||||
@@ -28,38 +26,28 @@
|
||||
</mat-form-field>
|
||||
<mat-card *ngIf="actionMenu || contextMenu">
|
||||
<mat-card-header>
|
||||
<mat-card-title>{{ 'SETTINGS_CLOUD.ACTION.ACTION_TITLE' | translate }}</mat-card-title>
|
||||
<mat-card-title>Add Action</mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<form class="app-cloud-settings-form" [formGroup]="actionMenuForm">
|
||||
<mat-form-field>
|
||||
<input matInput formControlName="key" placeholder="{{ 'SETTINGS_CLOUD.ACTION.KEY' | translate }}">
|
||||
<input matInput formControlName="key" placeholder="Key">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput formControlName="title" placeholder="{{ 'SETTINGS_CLOUD.ACTION.TITLE' | translate }}">
|
||||
<input matInput formControlName="title" placeholder="Title">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput formControlName="icon" placeholder="{{ 'SETTINGS_CLOUD.ACTION.ICON' | translate }}">
|
||||
<input matInput formControlName="icon" placeholder="Icon">
|
||||
</mat-form-field>
|
||||
<mat-checkbox formControlName="visible">
|
||||
{{ 'SETTINGS_CLOUD.ACTION.ACTION_VISIBLE' | translate }}
|
||||
</mat-checkbox>
|
||||
<mat-checkbox formControlName="disabled">
|
||||
{{ 'SETTINGS_CLOUD.ACTION.ACTION_DISABLE' | translate }}
|
||||
</mat-checkbox>
|
||||
<button mat-raised-button (click)="addAction()">
|
||||
{{ 'SETTINGS_CLOUD.ACTION.ADD_BUTTON' | translate }}
|
||||
</button>
|
||||
<mat-checkbox formControlName="visible">Visible</mat-checkbox>
|
||||
<mat-checkbox formControlName="disabled">Disable</mat-checkbox>
|
||||
<button mat-raised-button (click)="addAction()">Add</button>
|
||||
</form>
|
||||
<div *ngIf="actions.length > 0">
|
||||
<mat-chip-list>
|
||||
<mat-chip *ngFor="let action of actions" [removable]="true">
|
||||
{{action.title}}
|
||||
<mat-icon
|
||||
matChipRemove
|
||||
(click)="removeAction(action)">
|
||||
cancel
|
||||
</mat-icon>
|
||||
<mat-icon matChipRemove (click)="removeAction(action)">cancel</mat-icon>
|
||||
</mat-chip>
|
||||
</mat-chip-list>
|
||||
</div>
|
||||
|
@@ -1,7 +1,7 @@
|
||||
<h2>{{ 'APP_LAYOUT.TASK_HEADER_CLOUD.COMPONENT_NAME' | translate }}</h2>
|
||||
<h2>Task Header Cloud</h2>
|
||||
|
||||
<mat-form-field class="app-appName-input">
|
||||
{{ 'APP_LAYOUT.TASK_HEADER_CLOUD.APP_NAME_INPUT' | translate }}
|
||||
App name
|
||||
<input matInput
|
||||
[type]="'text'"
|
||||
[formControl]="appNameFormControl"
|
||||
@@ -9,7 +9,7 @@
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="app-taskId-input">
|
||||
{{ 'APP_LAYOUT.TASK_HEADER_CLOUD.TASK_ID_INPUT' | translate }}
|
||||
Task id
|
||||
<input matInput
|
||||
[type]="'text'"
|
||||
[formControl]="taskIdFormControl"
|
||||
|
@@ -46,25 +46,25 @@
|
||||
</adf-pagination>
|
||||
<div *ngIf="testingMode">
|
||||
<div *ngIf="multiselect">
|
||||
{{ 'SETTINGS_CLOUD.SELECTED_ROWS' | translate }}:
|
||||
Selected Rows:
|
||||
<ul>
|
||||
<li *ngFor="let row of selectedRows" [attr.data-automation-id]="row.id">{{ row.name }}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div *ngIf="actionMenu">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.ACTION_MENU' | translate }}:</span>
|
||||
<span>Action Menu:</span>
|
||||
<br>
|
||||
<div *ngIf="selectedAction">
|
||||
<span [attr.data-automation-id]="selectedAction.id">{{ 'SETTINGS_CLOUD.ACTION.TASK_ID' | translate }}: {{ selectedAction.id }}</span><br>
|
||||
<span [attr.data-automation-id]="selectedAction.actionType">{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedAction.actionType }}</span>
|
||||
<span [attr.data-automation-id]="selectedAction.id">Task ID: {{ selectedAction.id }}</span><br>
|
||||
<span [attr.data-automation-id]="selectedAction.actionType">Action Type: {{ selectedAction.actionType }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngIf="contextMenu">
|
||||
<span>{{ 'SETTINGS_CLOUD.ACTION.CONTEX_MENU' | translate }}:</span>
|
||||
<span>Context Menu:</span>
|
||||
<br>
|
||||
<div *ngIf="selectedContextAction">
|
||||
<span [attr.data-automation-id]="selectedContextAction.id">{{ 'SETTINGS_CLOUD.ACTION.TASK_ID' | translate }}: {{ selectedContextAction.id }}</span><br>
|
||||
<span [attr.data-automation-id]="selectedContextAction.actionType">{{ 'SETTINGS_CLOUD.ACTION.ACTION_TYPE' | translate }}: {{ selectedContextAction.actionType }}</span>
|
||||
<span [attr.data-automation-id]="selectedContextAction.id">Task ID: {{ selectedContextAction.id }}</span><br>
|
||||
<span [attr.data-automation-id]="selectedContextAction.actionType">Action Type: {{ selectedContextAction.actionType }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -1,29 +0,0 @@
|
||||
<mat-accordion>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Confirm Dialog Default Behaviour
|
||||
</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<button mat-raised-button (click)="openConfirmDefaultDialog()">Open Default Dialog</button>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Confirm Dialog Custom Template
|
||||
</mat-panel-title>
|
||||
</mat-expansion-panel-header>
|
||||
<button mat-raised-button (click)="openConfirmCustomDialog()">Open Custom Dialog</button>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Confirm Dialog Third Option
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
Provide extra button in the action section
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<button mat-raised-button (click)="openConfirmCustomActionDialog()">Open Custom Dialog</button>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
@@ -1,68 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { MatDialog } from '@angular/material/dialog';
|
||||
import { ConfirmDialogComponent } from '@alfresco/adf-content-services';
|
||||
|
||||
@Component({
|
||||
selector: 'app-confirm-dialog-example',
|
||||
templateUrl: './confirm-dialog-example.component.html'
|
||||
})
|
||||
export class ConfirmDialogExampleComponent {
|
||||
|
||||
constructor(private dialog: MatDialog) { }
|
||||
|
||||
openConfirmDefaultDialog() {
|
||||
this.dialog.open(ConfirmDialogComponent, {
|
||||
data: {
|
||||
title: 'Upload',
|
||||
message: `This is the default message`
|
||||
},
|
||||
minWidth: '250px'
|
||||
});
|
||||
}
|
||||
|
||||
openConfirmCustomDialog() {
|
||||
this.dialog.open(ConfirmDialogComponent, {
|
||||
data: {
|
||||
title: 'Upload',
|
||||
message: `This is the default message`,
|
||||
htmlContent: '<div> <p>A</p> <p>Custom</p> <p>Content</p> </div>'
|
||||
},
|
||||
minWidth: '250px'
|
||||
});
|
||||
}
|
||||
|
||||
openConfirmCustomActionDialog() {
|
||||
const thirdOptionLabel = 'Yes. Don\'t Show it again';
|
||||
const dialog = this.dialog.open(ConfirmDialogComponent, {
|
||||
data: {
|
||||
title: 'Upload',
|
||||
thirdOptionLabel,
|
||||
message: `This is the default message`
|
||||
},
|
||||
minWidth: '250px'
|
||||
});
|
||||
dialog.afterClosed().subscribe((status) => {
|
||||
// do the third option label operation
|
||||
if ( status === thirdOptionLabel) {
|
||||
// console.log('third option clicked');
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
@@ -1,250 +0,0 @@
|
||||
<main>
|
||||
<h1>Object picker</h1>
|
||||
|
||||
<mat-accordion>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Plain picker</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
dropdownHideMyFiles: {{dropdownHideMyFiles}}
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Hide My files</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
My Files site will be hided from dropdown
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[currentFolderId]="'-root-'"
|
||||
[dropdownHideMyFiles]="true">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Custom Site List</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Adding a custom site list
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<div>
|
||||
<mat-list>
|
||||
<h3 mat-subheader>Add Site</h3>
|
||||
<form class="app-content-node-selector-demo-example-form">
|
||||
<mat-form-field>
|
||||
<label>Site Guid</label>
|
||||
<input matInput [(ngModel)]="customSideGuid" [ngModelOptions]="{standalone: true}">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field>
|
||||
<label>Site Title</label>
|
||||
<input matInput [(ngModel)]="customSideTitle" [ngModelOptions]="{standalone: true}">
|
||||
</mat-form-field>
|
||||
</form>
|
||||
<button mat-button color="primary" (click)="onClickAddSite()">Add</button>
|
||||
<button mat-button color="primary" (click)="onClickResetSite()">Reset</button>
|
||||
|
||||
<mat-divider></mat-divider>
|
||||
<h3 mat-subheader>Custom Sites Added</h3>
|
||||
<mat-list-item *ngFor="let customSite of customSites.list.entries">
|
||||
<mat-icon mat-list-icon>shopping_basket</mat-icon>
|
||||
<h4 mat-line>{{customSite.entry.title}}</h4>
|
||||
<p mat-line> {{customSite.entry.guid}} </p>
|
||||
</mat-list-item>
|
||||
</mat-list>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[currentFolderId]="'-root-'"
|
||||
[dropdownSiteList]="customSites">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Row Filtering</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Will automatically filter the row on the list
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showFiles" (click)="recreateRowFilterFunction()">
|
||||
Show Files
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showFolders" (click)="recreateRowFilterFunction()">
|
||||
Slide Folders
|
||||
</mat-slide-toggle>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[rowFilter]="rowFilterFunction"
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Exclude Site Content</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
The exclude site content is filtered out from the list
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<div>
|
||||
<label>Case when the excludeSiteContent is set as : <b>{{ excludeSiteContentList.join(', ') }}</b></label>
|
||||
</div>
|
||||
<div>
|
||||
<label>Navigate into a site having the top content along the 'documentLibrary' to see that such items are not displayed.</label>
|
||||
</div>
|
||||
<br />
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showFiles" (click)="recreateRowFilterFunction()">
|
||||
Show Files
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showFolders" (click)="recreateRowFilterFunction()">
|
||||
Show Folders
|
||||
</mat-slide-toggle>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[rowFilter]="rowFilterFunction"
|
||||
[excludeSiteContent]="excludeSiteContentList"
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Custom Image Resolving</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
A function to manage the way folder/file icons and thumbnails are resolved
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<mat-slide-toggle color="primary" (click)="recreateImageResolverFunction()">
|
||||
Add Custom Images Resolver
|
||||
</mat-slide-toggle>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[imageResolver]="customImageResolver"
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Set Page Size</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Number of items shown per page in the list. actual page {{actualPageSize}}
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[currentFolderId]="'-root-'"
|
||||
[pageSize]="actualPageSize"
|
||||
>
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>Is Valid Selection Function </h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Function used to decide if the selected node has permission to be selected
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<label>Only folder starting with the letter 'a' or 'A' are valid selections</label>
|
||||
<label>Actual Selection is : {{validSelection}}</label>
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
(select)="onNodeSelect($event)"
|
||||
[isSelectionValid]="customIsValidFunction"
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>BreadCrumb Transform Function </h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Transformation to be performed on the chosen/folder node before building the breadcrumb UI
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<label>Folder starting with letter 'd' or 'D' won't be displayed in the breadcrumb dropdown</label>
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[breadcrumbTransform]="customBreadcrumbFunction"
|
||||
[currentFolderId]="'-root-'">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
<h2>shows files</h2>
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
<label class="app-content-node-selector-demo-basic-label">
|
||||
Shows files in search result
|
||||
</label>
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<div class="app-content-node-selector-demo-basic-table">
|
||||
<adf-content-node-selector-panel
|
||||
[currentFolderId]="'-root-'"
|
||||
[showFilesInResult]="true">
|
||||
</adf-content-node-selector-panel>
|
||||
</div>
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
||||
</main>
|
@@ -1,26 +0,0 @@
|
||||
.app-content-node-selector-demo {
|
||||
&-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-content: center;
|
||||
align-self: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-basic-table {
|
||||
height: 400px;
|
||||
width: 700px;
|
||||
}
|
||||
|
||||
&-basic-label {
|
||||
display: flex;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
&-example-form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
@@ -1,116 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, ViewEncapsulation } from '@angular/core';
|
||||
import { SitePaging, SiteEntry, MinimalNodeEntryEntity, Node } from '@alfresco/js-api';
|
||||
import { ContentNodeDialogService, ShareDataRow, RowFilter } from '@alfresco/adf-content-services';
|
||||
import { ThumbnailService } from '@alfresco/adf-core';
|
||||
|
||||
@Component({
|
||||
templateUrl: './content-node-selector.component.html',
|
||||
styleUrls: [`./content-node-selector.component.scss`],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class ContentNodeSelectorComponent {
|
||||
|
||||
constructor(private thumbnailService: ThumbnailService) {
|
||||
}
|
||||
|
||||
dropdownHideMyFiles = false;
|
||||
showFiles = false;
|
||||
showFolders = false;
|
||||
enableImageResolver = false;
|
||||
validSelection = false;
|
||||
|
||||
customSideGuid = '';
|
||||
customSideTitle = '';
|
||||
actualPageSize = 2;
|
||||
|
||||
rowFilterFunction: RowFilter = null;
|
||||
excludeSiteContentList: string[] = ContentNodeDialogService.nonDocumentSiteContent;
|
||||
customImageResolver: any = null;
|
||||
|
||||
defaultSites: SiteEntry[] = [
|
||||
new SiteEntry({ entry: { title: 'MINE', guid: '-my-' } }),
|
||||
new SiteEntry({ entry: { title: 'ROOTY', guid: '-root-' } })];
|
||||
|
||||
customSites: SitePaging = new SitePaging({
|
||||
list: {
|
||||
entries: [
|
||||
{ entry: { title: 'MINE', guid: '-my-' } },
|
||||
{ entry: { title: 'ROOTY', guid: '-root-' } }],
|
||||
pagination: {}
|
||||
}
|
||||
});
|
||||
|
||||
onClickAddSite() {
|
||||
const newSiteEntry: SiteEntry = new SiteEntry({ entry: { title: this.customSideTitle, guid: this.customSideGuid } });
|
||||
this.customSites.list.entries.push(newSiteEntry);
|
||||
this.customSideGuid = '';
|
||||
this.customSideTitle = '';
|
||||
}
|
||||
|
||||
onClickResetSite() {
|
||||
this.customSites.list.entries = this.defaultSites;
|
||||
this.customSideGuid = '';
|
||||
this.customSideTitle = '';
|
||||
}
|
||||
|
||||
recreateRowFilterFunction() {
|
||||
this.rowFilterFunction = this.rowFilteringExample.bind(this);
|
||||
}
|
||||
|
||||
recreateImageResolverFunction() {
|
||||
this.enableImageResolver = !this.enableImageResolver;
|
||||
if (this.enableImageResolver) {
|
||||
this.customImageResolver = this.customImageResolverExample.bind(this);
|
||||
} else {
|
||||
this.customImageResolver = null;
|
||||
}
|
||||
}
|
||||
|
||||
rowFilteringExample(row: ShareDataRow) {
|
||||
let showNode = true;
|
||||
const node: MinimalNodeEntryEntity = row.node.entry;
|
||||
if (this.showFiles) {
|
||||
showNode = node.isFile;
|
||||
}
|
||||
if (this.showFolders) {
|
||||
showNode = node.isFolder;
|
||||
}
|
||||
return showNode;
|
||||
}
|
||||
|
||||
customImageResolverExample() {
|
||||
return this.thumbnailService.getMimeTypeIcon('video/quicktime');
|
||||
}
|
||||
|
||||
onNodeSelect(selection: Node[]) {
|
||||
this.validSelection = !!selection;
|
||||
}
|
||||
|
||||
customIsValidFunction(entry: MinimalNodeEntryEntity): boolean {
|
||||
return entry.name.startsWith('a') || entry.name.startsWith('A');
|
||||
}
|
||||
|
||||
customBreadcrumbFunction(node: MinimalNodeEntryEntity) {
|
||||
if (node && node.path && node.path.elements) {
|
||||
node.path.elements = node.path.elements.filter((element) => !element.name.toLocaleLowerCase().startsWith('d') ? element : null );
|
||||
}
|
||||
return node;
|
||||
}
|
||||
}
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { ContentNodeSelectorComponent } from './content-node-selector.component';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: ContentNodeSelectorComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
RouterModule.forChild(routes),
|
||||
CoreModule,
|
||||
ContentModule.forChild()
|
||||
],
|
||||
declarations: [ContentNodeSelectorComponent]
|
||||
})
|
||||
export class AppContentNodeSelectorModule {}
|
@@ -1,24 +0,0 @@
|
||||
|
||||
<div style="height: 310px; overflow-y: auto;" data-automation-id="datatable">
|
||||
<adf-datatable
|
||||
#dataTable
|
||||
[data]="data">
|
||||
</adf-datatable>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Paste clipboard:
|
||||
<input data-automation-id="paste clipboard input">
|
||||
</div>
|
||||
|
||||
<div style="height: 310px; overflow-y: auto;" data-automation-id="copyClipboard-datatable">
|
||||
<adf-datatable
|
||||
[data]="dataForCopy">
|
||||
<data-columns>
|
||||
<data-column key="id" title="Id" [copyContent]="true"></data-column>
|
||||
<data-column key="name" title="Name" class="app-full-width name-column" [copyContent]="false"></data-column>
|
||||
<data-column key="createdBy" title="Created By"></data-column>
|
||||
<data-column key="json" type="json" title="Json" [copyContent]="true"></data-column>
|
||||
</data-columns>
|
||||
</adf-datatable>
|
||||
</div>
|
@@ -1,133 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, Input } from '@angular/core';
|
||||
import { DataColumn, DataRow, ObjectDataTableAdapter } from '@alfresco/adf-core';
|
||||
|
||||
export class FilteredDataAdapter extends ObjectDataTableAdapter {
|
||||
|
||||
filterValue = '';
|
||||
filterKey = 'name';
|
||||
|
||||
getRows(): Array<DataRow> {
|
||||
let rows = super.getRows();
|
||||
const filter = (this.filterValue || '').trim().toLowerCase();
|
||||
|
||||
if (this.filterKey && filter) {
|
||||
rows = rows.filter((row) => {
|
||||
const value = row.getValue(this.filterKey);
|
||||
if (value !== undefined && value !== null) {
|
||||
const stringValue: string = value.toString().trim().toLowerCase();
|
||||
return stringValue.startsWith(filter);
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
return rows;
|
||||
}
|
||||
|
||||
constructor(data?: any[], schema?: DataColumn[]) {
|
||||
super(data, schema);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-datatable',
|
||||
templateUrl: './datatable.component.html'
|
||||
})
|
||||
export class DataTableComponent {
|
||||
|
||||
@Input()
|
||||
selectionMode = 'single';
|
||||
|
||||
dataForCopy = new FilteredDataAdapter(
|
||||
[
|
||||
{
|
||||
id: 1,
|
||||
name: 'First',
|
||||
createdBy: 'Created one',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Second',
|
||||
createdBy: 'Created two',
|
||||
json: {
|
||||
id: 4
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Third',
|
||||
createdBy: 'Created three',
|
||||
json: {
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4)
|
||||
}
|
||||
}
|
||||
]
|
||||
);
|
||||
data = new FilteredDataAdapter(
|
||||
[
|
||||
{
|
||||
id: 1,
|
||||
name: 'Name 1',
|
||||
createdBy: 'Created One',
|
||||
icon: 'material-icons://folder_open',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Name 2',
|
||||
createdBy: 'Created Two',
|
||||
icon: 'material-icons://accessibility',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Name 3',
|
||||
createdBy: 'Created Three',
|
||||
icon: 'material-icons://alarm',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdBy: 'Created Four',
|
||||
icon: 'material-icons://alarm',
|
||||
json: {
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4),
|
||||
createdBy: {
|
||||
name: 'Felipe',
|
||||
lastname: 'Melo'
|
||||
},
|
||||
icon: 'material-icons://alarm'
|
||||
}
|
||||
}
|
||||
],
|
||||
[
|
||||
{ type: 'image', key: 'icon', title: '', srTitle: 'Thumbnail' },
|
||||
{ type: 'text', key: 'id', title: 'Id', sortable: true , cssClass: '', copyContent: true },
|
||||
{ type: 'text', key: 'name', title: 'Name', cssClass: 'adf-ellipsis-cell', sortable: true, copyContent: false },
|
||||
{ type: 'text', key: 'createdBy', title: 'Created By', sortable: true, cssClass: ''},
|
||||
{ type: 'json', key: 'json', title: 'Json', cssClass: 'adf-expand-cell-2', copyContent: true}
|
||||
]
|
||||
);
|
||||
}
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { DataTableComponent } from './datatable.component';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: DataTableComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes),
|
||||
ContentModule.forChild()
|
||||
],
|
||||
declarations: [DataTableComponent]
|
||||
})
|
||||
export class AppDataTableCopyModule {}
|
@@ -1,90 +0,0 @@
|
||||
<mat-form-field>
|
||||
<input id="adf-datatable-filter-input" matInput placeholder="Name filter" [(ngModel)]="data.filterValue">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-sticky-header"
|
||||
[color]="'primary'"
|
||||
(change)="toggleStickyHeader()"
|
||||
[checked]="stickyHeader">
|
||||
Sticky header
|
||||
</mat-slide-toggle>
|
||||
|
||||
<div data-automation-id="datatable" class="adf-datatable-demo-app">
|
||||
<adf-datatable
|
||||
#dataTable
|
||||
[data]="data"
|
||||
[stickyHeader]="stickyHeader"
|
||||
[selectionMode]="selectionMode"
|
||||
[multiselect]="multiselect"
|
||||
[actions]="true"
|
||||
[resolverFn]="resolver"
|
||||
rowStyleClass="custom-row-style"
|
||||
[showMainDatatableActions]="true"
|
||||
(showRowActionsMenu)="onShowRowActionsMenu($event)"
|
||||
(executeRowAction)="onExecuteRowAction($event)">
|
||||
<!-- HTML column definition demo -->
|
||||
<!--
|
||||
<data-columns>
|
||||
<data-column type="image" key="icon" [sortable]="false"></data-column>
|
||||
<data-column key="id" title="Id"></data-column>
|
||||
<data-column key="createdOn" title="Created"></data-column>
|
||||
<data-column key="name" title="Name" class="adf-full-width name-column"></data-column>
|
||||
<data-column type="text" key="createdBy.name" title="Created By"></data-column>
|
||||
<data-column type="text" key="users" title="Users"></data-column>
|
||||
<data-column key="status" title="Status">
|
||||
<ng-template let-value="value">{{value | json }}</ng-template>
|
||||
<adf-data-column-header>
|
||||
<ng-template>STATUS</ng-template>
|
||||
</adf-data-column-header>
|
||||
</data-column>
|
||||
</data-columns>
|
||||
-->
|
||||
|
||||
<adf-main-menu-datatable-template>
|
||||
<ng-template let-mainMenuTrigger>
|
||||
<adf-datatable-column-selector
|
||||
[columns]="data.getColumns()"
|
||||
[mainMenuTrigger]="mainMenuTrigger"
|
||||
(submitColumnsVisibility)="onColumnsVisibilityChange($event)">
|
||||
</adf-datatable-column-selector>
|
||||
</ng-template>
|
||||
</adf-main-menu-datatable-template>
|
||||
|
||||
</adf-datatable>
|
||||
|
||||
<ng-template #customColumnHeaderTemplate>
|
||||
<div>
|
||||
<span class="adf-datatable-demo-app-custom-user-header">
|
||||
{{ 'DATATABLE.CUSTOM_COLUMN_HEADER'| translate }}
|
||||
</span>
|
||||
</div>
|
||||
</ng-template>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
Selected items: {{ dataTable.selection?.length }}
|
||||
</div>
|
||||
|
||||
<div data-automation-id="multiselect">
|
||||
<mat-checkbox [(ngModel)]="multiselect">{{ 'DATATABLE.MULTISELECT'| translate }}</mat-checkbox>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p>{{ 'DATATABLE.MULTISELECT_DESCRIPTION'| translate }}</p>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Selection Mode" [(ngModel)]="selectionMode" name="food" data-automation-id="datatable-selection-mode">
|
||||
<mat-option *ngFor="let mode of selectionModes" [value]="mode.value">
|
||||
{{mode.viewValue}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div class="adf-datatable-demo-app-actions">
|
||||
<button mat-raised-button (click)="reset()">{{ 'DATATABLE.RESET_DEFAULT'| translate }}</button>
|
||||
<button mat-raised-button (click)="addRow()">{{ 'DATATABLE.ADD_ROW'| translate }}</button>
|
||||
<button mat-raised-button (click)="replaceRows()">{{ 'DATATABLE.REPLACE_ROWS'| translate }}</button>
|
||||
<button mat-raised-button (click)="replaceColumns()">{{ 'DATATABLE.REPLACE_COLUMNS'| translate }}</button>
|
||||
<button mat-raised-button (click)="showCustomHeaderColumn()">{{ 'DATATABLE.USE_CUSTOM_COLUMN_HEADER'| translate }}</button>
|
||||
</div>
|
@@ -1,13 +0,0 @@
|
||||
.adf-datatable-demo-app {
|
||||
height: 310px;
|
||||
overflow-y: auto;
|
||||
|
||||
&-actions {
|
||||
display: flex;
|
||||
column-gap: 4px;
|
||||
}
|
||||
|
||||
&-custom-user-header {
|
||||
color: var(--theme-warn-color);
|
||||
}
|
||||
}
|
@@ -1,341 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, Input, ViewChild } from '@angular/core';
|
||||
import {
|
||||
DataCellEvent,
|
||||
DataColumn,
|
||||
DataRow,
|
||||
DataRowActionEvent,
|
||||
DataSorting,
|
||||
ObjectDataColumn,
|
||||
ObjectDataRow,
|
||||
ObjectDataTableAdapter
|
||||
} from '@alfresco/adf-core';
|
||||
|
||||
export class FilteredDataAdapter extends ObjectDataTableAdapter {
|
||||
|
||||
filterValue = '';
|
||||
filterKey = 'name';
|
||||
|
||||
getRows(): Array<DataRow> {
|
||||
let rows = super.getRows();
|
||||
const filter = (this.filterValue || '').trim().toLowerCase();
|
||||
|
||||
if (this.filterKey && filter) {
|
||||
rows = rows.filter((row) => {
|
||||
const value = row.getValue(this.filterKey);
|
||||
if (value !== undefined && value !== null) {
|
||||
const stringValue: string = value.toString().trim().toLowerCase();
|
||||
return stringValue.startsWith(filter);
|
||||
}
|
||||
return false;
|
||||
});
|
||||
}
|
||||
return rows;
|
||||
}
|
||||
|
||||
constructor(data?: any[], schema?: DataColumn[]) {
|
||||
super(data, schema);
|
||||
}
|
||||
}
|
||||
|
||||
@Component({
|
||||
selector: 'app-datatable',
|
||||
templateUrl: './datatable.component.html',
|
||||
styleUrls: ['./datatable.component.scss']
|
||||
})
|
||||
export class DataTableComponent {
|
||||
|
||||
@Input()
|
||||
selectionMode = 'single';
|
||||
|
||||
@ViewChild('customColumnHeaderTemplate') customColumnHeaderTemplate;
|
||||
|
||||
multiselect = false;
|
||||
data: FilteredDataAdapter;
|
||||
stickyHeader = false;
|
||||
|
||||
selectionModes = [
|
||||
{ value: 'none', viewValue: 'None' },
|
||||
{ value: 'single', viewValue: 'Single' },
|
||||
{ value: 'multiple', viewValue: 'Multiple' }
|
||||
];
|
||||
|
||||
private imageUrl = 'http://placehold.it/140x100';
|
||||
private createdBy: any = {
|
||||
name: 'Administrator',
|
||||
email: 'admin@alfresco.com'
|
||||
};
|
||||
|
||||
constructor() {
|
||||
this.reset();
|
||||
}
|
||||
|
||||
resolver(row: DataRow, col: DataColumn): any {
|
||||
const value = row.getValue(col.key);
|
||||
if (col.key === 'users') {
|
||||
return (value || []).map(user => `${user.firstName} ${user.lastName}`).toString();
|
||||
}
|
||||
|
||||
if (col.key === 'status') {
|
||||
const users = row.getValue('users');
|
||||
return (value || []).map((status, index) => ({ name: `${users[index].firstName} ${users[index].lastName}`, status }));
|
||||
}
|
||||
|
||||
return value;
|
||||
}
|
||||
|
||||
/* spellchecker: disable */
|
||||
reset() {
|
||||
this.data = new FilteredDataAdapter(
|
||||
[
|
||||
{
|
||||
id: 1,
|
||||
name: `Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
|
||||
Excepteur sint occaecat cupidatat non proident,
|
||||
sunt in culpa qui officia deserunt mollit anim id est laborum.`,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 1),
|
||||
createdBy: this.createdBy,
|
||||
icon: 'material-icons://folder_open',
|
||||
json: null,
|
||||
users: [
|
||||
{
|
||||
firstName: 'Super',
|
||||
lastName: 'Man'
|
||||
},
|
||||
{
|
||||
firstName: 'Iron',
|
||||
lastName: 'Man'
|
||||
}
|
||||
],
|
||||
status: [
|
||||
'I am here to save the world.. By world means AMERICA',
|
||||
'That nobody is John Wick…'
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Name 2',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 2),
|
||||
createdBy: this.createdBy,
|
||||
icon: 'material-icons://accessibility',
|
||||
json: null,
|
||||
users: [
|
||||
{
|
||||
firstName: 'Mister',
|
||||
lastName: 'Bean'
|
||||
},
|
||||
{
|
||||
firstName: 'Doctor',
|
||||
lastName: 'Strange'
|
||||
}
|
||||
],
|
||||
status: [
|
||||
'I am here to save the world.. By world means AMERICA',
|
||||
'That nobody is John Wick…'
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Name 3',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 3),
|
||||
createdBy: this.createdBy,
|
||||
icon: 'material-icons://alarm',
|
||||
json: null,
|
||||
users: [
|
||||
{
|
||||
firstName: 'Thunder',
|
||||
lastName: 'Thor'
|
||||
},
|
||||
{
|
||||
firstName: 'Marvel',
|
||||
lastName: 'Avenger'
|
||||
}
|
||||
],
|
||||
status: [
|
||||
'I am here to save the world.. By world means AMERICA',
|
||||
'That nobody is John Wick…'
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4),
|
||||
createdBy: this.createdBy,
|
||||
icon: 'material-icons://alarm',
|
||||
json: {
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4),
|
||||
createdBy: {
|
||||
name: 'Felipe',
|
||||
lastName: 'Melo'
|
||||
},
|
||||
icon: 'material-icons://alarm'
|
||||
},
|
||||
users: [
|
||||
{
|
||||
firstName: 'Spider',
|
||||
lastName: 'Man'
|
||||
},
|
||||
{
|
||||
firstName: '17',
|
||||
lastName: 'Again'
|
||||
}
|
||||
],
|
||||
status: [
|
||||
'I am here to save the world.. By world means AMERICA',
|
||||
'That nobody is John Wick…'
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
name: 'I am using custom resolver',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4),
|
||||
createdBy: this.createdBy,
|
||||
icon: 'material-icons://person_outline',
|
||||
users: [
|
||||
{
|
||||
firstName: 'Captain',
|
||||
lastName: 'America'
|
||||
},
|
||||
{
|
||||
firstName: 'John',
|
||||
lastName: 'Wick'
|
||||
}
|
||||
],
|
||||
status: [
|
||||
'I am here to save the world.. By world means AMERICA',
|
||||
'That nobody is John Wick…'
|
||||
]
|
||||
}
|
||||
],
|
||||
[
|
||||
{ type: 'image', key: 'icon', title: '', srTitle: 'Thumbnail' },
|
||||
{ type: 'text', key: 'id', title: 'Id', sortable: true , cssClass: '', draggable: true},
|
||||
{ type: 'date', key: 'createdOn', title: 'Created On', sortable: true, cssClass: 'adf-ellipsis-cell adf-expand-cell-2', draggable: true },
|
||||
{ type: 'text', key: 'name', title: 'Name', cssClass: 'adf-ellipsis-cell', sortable: true, draggable: true },
|
||||
{ type: 'text', key: 'createdBy.name', title: 'Created By', sortable: true, cssClass: '', draggable: true},
|
||||
{ type: 'json', key: 'json', title: 'Json', cssClass: 'adf-expand-cell-2', draggable: true},
|
||||
{ type: 'text', key: 'users', title: 'Users', cssClass: 'adf-expand-cell-2', draggable: true},
|
||||
{ type: 'json', key: 'status', title: 'Status', cssClass: 'adf-expand-cell-2', draggable: true}
|
||||
]
|
||||
);
|
||||
|
||||
this.data.setSorting(new DataSorting('id', 'asc'));
|
||||
}
|
||||
/* spellchecker: enable */
|
||||
|
||||
addRow() {
|
||||
const id = this.data.getRows().length + 1;
|
||||
const row = new ObjectDataRow({
|
||||
id,
|
||||
name: 'Name ' + id,
|
||||
createdOn: new Date(),
|
||||
icon: 'material-icons://extension',
|
||||
createdBy: this.createdBy
|
||||
});
|
||||
this.data.getRows().push(row);
|
||||
this.data.sort();
|
||||
}
|
||||
|
||||
replaceRows() {
|
||||
const objects = [
|
||||
{
|
||||
id: 10,
|
||||
name: 'Name 10',
|
||||
createdBy: this.createdBy,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 5),
|
||||
icon: 'material-icons://face'
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
name: 'Name 11',
|
||||
createdBy: this.createdBy,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 6),
|
||||
icon: 'material-icons://language'
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
name: 'Name 12',
|
||||
createdBy: this.createdBy,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 7),
|
||||
icon: 'material-icons://pets'
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
name: 'Image 13',
|
||||
createdBy: this.createdBy,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 8),
|
||||
icon: this.imageUrl
|
||||
}
|
||||
];
|
||||
const rows = objects.map((obj) => new ObjectDataRow(obj));
|
||||
this.data.setRows(rows);
|
||||
}
|
||||
|
||||
replaceColumns() {
|
||||
const schema = [
|
||||
{ type: 'text', key: 'id', title: 'Id', sortable: true },
|
||||
{ type: 'text', key: 'name', title: 'Name', sortable: true, cssClass: 'full-width name-column' }
|
||||
];
|
||||
const columns = schema.map((col) => new ObjectDataColumn(col));
|
||||
this.data.setColumns(columns);
|
||||
}
|
||||
|
||||
showCustomHeaderColumn() {
|
||||
const columns = this.data.getColumns().map(column => {
|
||||
if (column.title === 'Users') {
|
||||
return {
|
||||
...column,
|
||||
header: this.customColumnHeaderTemplate
|
||||
};
|
||||
}
|
||||
|
||||
return column;
|
||||
});
|
||||
|
||||
this.data.setColumns(columns);
|
||||
}
|
||||
|
||||
onShowRowActionsMenu(event: DataCellEvent) {
|
||||
const myAction = {
|
||||
title: 'Hello'
|
||||
// you custom metadata needed for onExecuteRowAction
|
||||
};
|
||||
event.value.actions = [
|
||||
myAction
|
||||
];
|
||||
}
|
||||
|
||||
onColumnsVisibilityChange(columns: DataColumn[]): void {
|
||||
this.data.setColumns(columns);
|
||||
}
|
||||
|
||||
onExecuteRowAction(event: DataRowActionEvent) {
|
||||
const args = event.value;
|
||||
window.alert(`My custom action: ${args.action.title}`);
|
||||
}
|
||||
|
||||
toggleStickyHeader() {
|
||||
this.stickyHeader = !this.stickyHeader;
|
||||
}
|
||||
}
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { DataTableComponent } from './datatable.component';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: DataTableComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes),
|
||||
ContentModule.forChild()
|
||||
],
|
||||
declarations: [DataTableComponent]
|
||||
})
|
||||
export class AppDataTableModule {}
|
@@ -1,8 +0,0 @@
|
||||
<h1>DataTable Drag and Drop Demo</h1>
|
||||
<div data-automation-id="datatable"
|
||||
(header-dragover)="onDragOver($event)"
|
||||
(header-drop)="onDrop($any($event))"
|
||||
(cell-dragover)="onDragOver($event)"
|
||||
(cell-drop)="onDrop($any($event))">
|
||||
<adf-datatable [data]="data"></adf-datatable>
|
||||
</div>
|
@@ -1,103 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
/* cspell:disable */
|
||||
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { ObjectDataTableAdapter, DataSorting, NotificationService, DataTableDropEvent } from '@alfresco/adf-core';
|
||||
|
||||
const createdBy = {
|
||||
name: 'Administrator',
|
||||
email: 'admin@alfresco.com'
|
||||
};
|
||||
|
||||
@Component({
|
||||
selector: 'app-datatable-dnd',
|
||||
templateUrl: './datatable-dnd.component.html'
|
||||
})
|
||||
export class DataTableDnDComponent implements OnInit {
|
||||
|
||||
data: ObjectDataTableAdapter;
|
||||
|
||||
constructor(private notificationService: NotificationService) {
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.data = new ObjectDataTableAdapter(
|
||||
[
|
||||
{
|
||||
id: 1,
|
||||
name: `Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
|
||||
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
|
||||
Excepteur sint occaecat cupidatat non proident,
|
||||
sunt in culpa qui officia deserunt mollit anim id est laborum.`,
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 1),
|
||||
createdBy,
|
||||
icon: 'material-icons://folder_open',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'Name 2',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 2),
|
||||
createdBy,
|
||||
icon: 'material-icons://accessibility',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
name: 'Name 3',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 3),
|
||||
createdBy,
|
||||
icon: 'material-icons://alarm',
|
||||
json: null
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
name: 'Image 8',
|
||||
createdOn: new Date(2016, 6, 2, 15, 8, 4),
|
||||
createdBy,
|
||||
icon: 'material-icons://alarm'
|
||||
}
|
||||
],
|
||||
[
|
||||
{ type: 'image', key: 'icon', title: '', srTitle: 'Thumbnail' },
|
||||
{ type: 'text', key: 'id', title: 'Id', sortable: true , cssClass: '' },
|
||||
{ type: 'text', key: 'createdOn', title: 'Created On', sortable: true, cssClass: 'adf-ellipsis-cell adf-expand-cell-2' },
|
||||
{ type: 'text', key: 'name', title: 'Name', cssClass: 'adf-ellipsis-cell', sortable: true },
|
||||
{ type: 'text', key: 'createdBy.name', title: 'Created By', sortable: true, cssClass: ''}
|
||||
]
|
||||
);
|
||||
|
||||
this.data.setSorting(new DataSorting('id', 'asc'));
|
||||
}
|
||||
|
||||
onDragOver(event: Event) {
|
||||
event.preventDefault();
|
||||
}
|
||||
|
||||
onDrop(event: DataTableDropEvent) {
|
||||
event.preventDefault();
|
||||
|
||||
const { column, target } = event.detail;
|
||||
const message = `Dropped data on [ ${column.key} ] ${target}`;
|
||||
|
||||
this.notificationService.openSnackMessage(message);
|
||||
}
|
||||
}
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
import { DataTableDnDComponent } from './datatable-dnd.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: DataTableDnDComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
RouterModule.forChild(routes),
|
||||
CoreModule,
|
||||
ContentModule.forChild()
|
||||
],
|
||||
declarations: [DataTableDnDComponent]
|
||||
})
|
||||
export class AppDataTableDndModule {}
|
@@ -1,46 +0,0 @@
|
||||
<adf-document-list
|
||||
currentFolderId="-my-"
|
||||
[navigate]="false">
|
||||
<data-columns>
|
||||
<ng-container *ngFor="let column of columns; trackBy: trackById">
|
||||
<ng-container
|
||||
*ngIf="
|
||||
column.template && !(column.desktopOnly && isSmallScreen)
|
||||
"
|
||||
>
|
||||
<data-column
|
||||
[key]="column.key"
|
||||
[title]="column.title"
|
||||
[type]="column.type"
|
||||
[format]="column.format"
|
||||
[class]="column.class"
|
||||
[sortable]="column.sortable"
|
||||
>
|
||||
<ng-template let-context>
|
||||
<adf-dynamic-column
|
||||
[id]="column.template"
|
||||
[context]="context"
|
||||
>
|
||||
</adf-dynamic-column>
|
||||
</ng-template>
|
||||
</data-column>
|
||||
</ng-container>
|
||||
|
||||
<ng-container
|
||||
*ngIf="
|
||||
!column.template && !(column.desktopOnly && isSmallScreen)
|
||||
"
|
||||
>
|
||||
<data-column
|
||||
[key]="column.key"
|
||||
[title]="column.title"
|
||||
[type]="column.type"
|
||||
[format]="column.format"
|
||||
[class]="column.class"
|
||||
[sortable]="column.sortable"
|
||||
>
|
||||
</data-column>
|
||||
</ng-container>
|
||||
</ng-container>
|
||||
</data-columns>
|
||||
</adf-document-list>
|
@@ -1,61 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||
import { AppExtensionService, DocumentListPresetRef } from '@alfresco/adf-extensions';
|
||||
import { BreakpointObserver, Breakpoints } from '@angular/cdk/layout';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
selector: 'app-extension-presets',
|
||||
templateUrl: './extension-presets.component.html'
|
||||
})
|
||||
export class ExtensionPresetsComponent implements OnInit, OnDestroy {
|
||||
onDestroy$ = new Subject<boolean>();
|
||||
|
||||
columns: DocumentListPresetRef[] = [];
|
||||
isSmallScreen = false;
|
||||
|
||||
constructor(
|
||||
private extensions: AppExtensionService,
|
||||
private breakpointObserver: BreakpointObserver
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.columns = this.extensions.getDocumentListPreset('files');
|
||||
|
||||
this.breakpointObserver
|
||||
.observe([
|
||||
Breakpoints.HandsetPortrait,
|
||||
Breakpoints.HandsetLandscape
|
||||
])
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe((result) => {
|
||||
this.isSmallScreen = result.matches;
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.onDestroy$.next(true);
|
||||
this.onDestroy$.complete();
|
||||
}
|
||||
|
||||
trackById(_: number, obj: DocumentListPresetRef): string {
|
||||
return obj.id;
|
||||
}
|
||||
}
|
@@ -1,53 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { ContentModule } from '@alfresco/adf-content-services';
|
||||
import { ExtensionPresetsComponent } from './extension-presets.component';
|
||||
import { ExtensionsModule, ExtensionService } from '@alfresco/adf-extensions';
|
||||
import { NameColumnComponent } from './name-column/name-column.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: ExtensionPresetsComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes),
|
||||
ContentModule.forChild(),
|
||||
ExtensionsModule
|
||||
],
|
||||
declarations: [
|
||||
ExtensionPresetsComponent,
|
||||
NameColumnComponent
|
||||
]
|
||||
})
|
||||
export class ExtensionPresetsModule {
|
||||
constructor(extensionService: ExtensionService) {
|
||||
extensionService.setComponents({
|
||||
'app.columns.name': NameColumnComponent
|
||||
});
|
||||
}
|
||||
}
|
@@ -1,99 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import {
|
||||
Component,
|
||||
Input,
|
||||
OnInit,
|
||||
ChangeDetectionStrategy,
|
||||
ViewEncapsulation,
|
||||
ElementRef,
|
||||
OnDestroy
|
||||
} from '@angular/core';
|
||||
import { NodeEntry, Node } from '@alfresco/js-api';
|
||||
import { BehaviorSubject, Subject } from 'rxjs';
|
||||
import { NodesApiService } from '@alfresco/adf-content-services';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
selector: 'app-name-column',
|
||||
template: `
|
||||
<span class="app-datatable-cell-value" title="{{ node | adfNodeNameTooltip }}" (click)="onClick()">
|
||||
{{ displayText$ | async }}
|
||||
</span>
|
||||
`,
|
||||
changeDetection: ChangeDetectionStrategy.OnPush,
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: { class: 'adf-datatable-content-cell adf-datatable-link adf-name-column' }
|
||||
})
|
||||
export class NameColumnComponent implements OnInit, OnDestroy {
|
||||
@Input()
|
||||
context: any;
|
||||
|
||||
@Input()
|
||||
key = 'name';
|
||||
|
||||
displayText$ = new BehaviorSubject<string>('');
|
||||
node: NodeEntry;
|
||||
|
||||
private onDestroy$ = new Subject<boolean>();
|
||||
|
||||
constructor(private element: ElementRef, private nodesApiService: NodesApiService) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.updateValue();
|
||||
|
||||
this.nodesApiService.nodeUpdated
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe((node: Node) => {
|
||||
const row = this.context.row;
|
||||
if (row) {
|
||||
const { entry } = row.node;
|
||||
|
||||
if (entry === node) {
|
||||
row.node = { entry };
|
||||
this.updateValue();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
protected updateValue() {
|
||||
this.node = this.context.row.node;
|
||||
|
||||
if (this.node && this.node.entry) {
|
||||
const displayText = this.context.row.getValue(this.key);
|
||||
this.displayText$.next(displayText || this.node.entry.id);
|
||||
}
|
||||
}
|
||||
|
||||
onClick() {
|
||||
this.element.nativeElement.dispatchEvent(
|
||||
new CustomEvent('name-click', {
|
||||
bubbles: true,
|
||||
detail: {
|
||||
node: this.node
|
||||
}
|
||||
})
|
||||
);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.onDestroy$.next(true);
|
||||
this.onDestroy$.complete();
|
||||
}
|
||||
}
|
@@ -1,7 +1,5 @@
|
||||
<adf-error-content [errorCode]="errorCode">
|
||||
<div adf-error-content-actions>
|
||||
<button mat-raised-button (click)="onReturnButton()">
|
||||
{{ 'ERROR_CONTENT.RETURN_BUTTON.TEXT' | translate }}
|
||||
</button>
|
||||
<button mat-raised-button (click)="onReturnButton()">Back to home</button>
|
||||
</div>
|
||||
</adf-error-content>
|
||||
|
@@ -68,17 +68,14 @@
|
||||
|
||||
|
||||
<ng-template let-node="node" #sidebarRightTemplate>
|
||||
<adf-info-drawer [title]="'APP.INFO_DRAWER.TITLE' | translate">
|
||||
<adf-info-drawer title="Details">
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.COMMENTS">
|
||||
<adf-node-comments
|
||||
[nodeId]="nodeId"
|
||||
[readOnly]="!isCommentEnabled"
|
||||
>
|
||||
<adf-info-drawer-tab label="Comments">
|
||||
<adf-node-comments [nodeId]="nodeId" [readOnly]="!isCommentEnabled">
|
||||
</adf-node-comments>
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.PROPERTIES">
|
||||
<adf-info-drawer-tab label="Properties">
|
||||
<adf-content-metadata-card *ngIf="isPreset" [node]="node"
|
||||
[multi]="multi"
|
||||
[preset]="customPreset"
|
||||
@@ -97,7 +94,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-default-properties"
|
||||
[color]="'primary'"
|
||||
(change)="toggleDisplayProperties()"
|
||||
[checked]="displayDefaultProperties">
|
||||
Display Default Properties
|
||||
@@ -107,7 +103,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-empty"
|
||||
[color]="'primary'"
|
||||
(change)="toggleEmptyMetadata()"
|
||||
[checked]="displayEmptyMetadata">
|
||||
Display Empty Metadata
|
||||
@@ -117,7 +112,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-multi"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMulti()"
|
||||
[checked]="multi">
|
||||
Multi accordion
|
||||
@@ -127,7 +121,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-metadata-readonly"
|
||||
[color]="'primary'"
|
||||
(change)="toggleReadOnly()"
|
||||
[checked]="isReadOnly">
|
||||
Read Only
|
||||
@@ -137,7 +130,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-preset"
|
||||
[color]="'primary'"
|
||||
(change)="togglePreset()"
|
||||
[checked]="isPreset">
|
||||
Custom preset
|
||||
@@ -147,35 +139,24 @@
|
||||
<p class="toggle">
|
||||
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Display Aspect"
|
||||
[(ngModel)]="desiredAspect">
|
||||
<input matInput placeholder="Display Aspect" [(ngModel)]="desiredAspect">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button (click)="applyAspect()" color="primary">
|
||||
Apply Aspect
|
||||
</button>
|
||||
<button mat-raised-button (click)="applyAspect()">Apply Aspect</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<ng-container *ngIf="isPreset">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Custom Preset"
|
||||
[(ngModel)]="customPreset"
|
||||
data-automation-id="adf-text-custom-preset">
|
||||
<input matInput placeholder="Custom Preset" [(ngModel)]="customPreset" data-automation-id="adf-text-custom-preset">
|
||||
</mat-form-field>
|
||||
|
||||
<button mat-raised-button id="adf-metadata-aplly" (click)="applyCustomPreset()" color="primary">
|
||||
Apply
|
||||
</button>
|
||||
|
||||
<button mat-raised-button id="adf-metadata-aplly" (click)="applyCustomPreset()">Apply</button>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
</adf-info-drawer-tab>
|
||||
|
||||
<adf-info-drawer-tab label="APP.INFO_DRAWER.VERSIONS">
|
||||
<adf-info-drawer-tab label="Versions">
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<adf-version-manager [node]="node"
|
||||
@@ -196,7 +177,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-fileurl"
|
||||
[color]="'primary'"
|
||||
(change)="toggleFileUrl()"
|
||||
[checked]="fileUrlSwitch">
|
||||
Url File
|
||||
@@ -217,7 +197,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowToolbar()"
|
||||
[checked]="showToolbar">
|
||||
Show Toolbar
|
||||
@@ -227,7 +206,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-goback"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowGoBack()"
|
||||
[checked]="allowGoBack">
|
||||
Allow GoBack
|
||||
@@ -237,7 +215,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-openwith"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenWith()"
|
||||
[checked]="openWith">
|
||||
Open With
|
||||
@@ -247,7 +224,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactions"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOpenMoreActions()"
|
||||
[checked]="moreActions">
|
||||
More Actions
|
||||
@@ -257,7 +233,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-moreactionsmenu"
|
||||
[color]="'primary'"
|
||||
(change)="toggleMoreActionsMenu()"
|
||||
[checked]="moreActionsMenu">
|
||||
More Actions Menu
|
||||
@@ -267,7 +242,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-download"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowDownload()"
|
||||
[checked]="allowDownload">
|
||||
Allow Download
|
||||
@@ -277,7 +251,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-print"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowPrint()"
|
||||
[checked]="allowPrint">
|
||||
Allow Print
|
||||
@@ -287,7 +260,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowsidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowRightSidebar()"
|
||||
[checked]="allowRightSidebar">
|
||||
Allow Right Sidebar
|
||||
@@ -297,7 +269,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-switch-allowLeftSidebar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleAllowLeftSidebar()"
|
||||
[checked]="allowLeftSidebar">
|
||||
Allow Left Sidebar
|
||||
@@ -307,7 +278,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-custom-toolbar"
|
||||
[color]="'primary'"
|
||||
(change)="toggleToolbar()"
|
||||
[checked]="customToolbar">
|
||||
Custom Toolbar
|
||||
@@ -317,7 +287,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-tab-with-icon"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIcon()"
|
||||
[checked]="showTabWithIcon">
|
||||
Show tab with icon
|
||||
@@ -327,7 +296,6 @@
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-icon-and-label-tab"
|
||||
[color]="'primary'"
|
||||
(change)="toggleShowTabWithIconAndLabel()"
|
||||
[checked]="showTabWithIconAndLabel">
|
||||
Show tab with icon and label
|
||||
@@ -335,15 +303,13 @@
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()"
|
||||
color="primary">
|
||||
<button mat-raised-button id="adf-switch-showrightsidebar" (click)="toggleShowRightSidebar()">
|
||||
Toggle Right Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
||||
<p class="toggle">
|
||||
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()"
|
||||
color="primary">
|
||||
<button mat-raised-button id="adf-switch-showleftsidebar" (click)="hideLeftSidebar()">
|
||||
Hide Left Sidebar
|
||||
</button>
|
||||
</p>
|
||||
|
@@ -11,7 +11,7 @@
|
||||
<adf-toolbar-divider></adf-toolbar-divider>
|
||||
<button mat-icon-button
|
||||
[disabled]="!hasSelection(customSourcesDocumentList.selection)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.DOWNLOAD' | translate }}"
|
||||
title="Download"
|
||||
[adfNodeDownload]="customSourcesDocumentList.selection">
|
||||
<mat-icon>get_app</mat-icon>
|
||||
</button>
|
||||
|
@@ -24,14 +24,9 @@
|
||||
</div>
|
||||
<adf-toolbar *ngIf="!disableDragArea" class="app-files-toolbar">
|
||||
<adf-toolbar-title>
|
||||
<adf-breadcrumb
|
||||
class="app-files-breadcrumb"
|
||||
root="APP.PERSONAL-FILES"
|
||||
[target]="documentList">
|
||||
<adf-breadcrumb root="Personal Files" [target]="documentList">
|
||||
</adf-breadcrumb>
|
||||
<adf-dropdown-breadcrumb
|
||||
class="app-files-breadcrumb"
|
||||
[target]="documentList">
|
||||
<adf-dropdown-breadcrumb [target]="documentList">
|
||||
</adf-dropdown-breadcrumb>
|
||||
</adf-toolbar-title>
|
||||
|
||||
@@ -41,7 +36,7 @@
|
||||
<button
|
||||
mat-icon-button
|
||||
data-automation-id="document-list-grid-view"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.TOGGLE_DISPLAY_MODE' | translate }}"
|
||||
title="Toggle display mode"
|
||||
(click)="toggleGalleryView()">
|
||||
<mat-icon>list</mat-icon>
|
||||
</button>
|
||||
@@ -49,7 +44,7 @@
|
||||
data-automation-id="create-new-folder"
|
||||
mat-icon-button
|
||||
[disabled]="!canCreateContent(documentList.folderNode)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}"
|
||||
title="New folder"
|
||||
(error)="openSnackMessageError($event)"
|
||||
(success)="documentList.reload()"
|
||||
[adf-create-folder]="currentFolderId">
|
||||
@@ -57,7 +52,7 @@
|
||||
</button>
|
||||
<button
|
||||
mat-icon-button
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.CREATE_LIBRARY' | translate }}"
|
||||
title="Create Library}"
|
||||
data-automation-id="create-new-library"
|
||||
(click)="createLibrary()">
|
||||
<mat-icon>library_add</mat-icon>
|
||||
@@ -66,7 +61,7 @@
|
||||
data-automation-id="edit-folder"
|
||||
mat-icon-button
|
||||
[disabled]="!canEditFolder(documentList.selection)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}"
|
||||
title="Edit folder"
|
||||
(error)="openSnackMessageError($event)"
|
||||
[adf-edit-folder]="documentList.selection[0]?.entry"
|
||||
(success)="documentList.reload()">
|
||||
@@ -74,7 +69,7 @@
|
||||
</button>
|
||||
<button mat-icon-button
|
||||
[disabled]="!hasSelection(documentList.selection)"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.DOWNLOAD' | translate }}"
|
||||
title="Download"
|
||||
[adfNodeDownload]="documentList.selection">
|
||||
<mat-icon>get_app</mat-icon>
|
||||
</button>
|
||||
@@ -83,7 +78,7 @@
|
||||
adf-check-allowable-operation="delete"
|
||||
[permanent]="true"
|
||||
[adf-nodes]="documentList.selection"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}"
|
||||
title="Delete"
|
||||
(delete)="onDeleteActionSuccess($event)"
|
||||
[adf-delete]="documentList.selection">
|
||||
<mat-icon>delete</mat-icon>
|
||||
@@ -94,7 +89,7 @@
|
||||
[disabled]="!documentList.selection.length"
|
||||
#favorite="adfFavorite"
|
||||
[adf-node-favorite]="documentList.selection"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.FAVORITES' | translate }}">
|
||||
title="Add to favorites">
|
||||
<mat-icon>{{ favorite.hasFavorites() ? 'star' :'star_border' }}</mat-icon>
|
||||
</button>
|
||||
<button mat-icon-button
|
||||
@@ -102,17 +97,13 @@
|
||||
[baseShareUrl]="baseShareUrl"
|
||||
#shareRef="adfShare"
|
||||
[adf-share]="documentList.selection[0]"
|
||||
[title]="(shareRef.isShared
|
||||
? 'DOCUMENT_LIST.TOOLBAR.SHARE_EDIT'
|
||||
: 'DOCUMENT_LIST.TOOLBAR.SHARE') | translate">
|
||||
<mat-icon>
|
||||
share
|
||||
</mat-icon>
|
||||
[title]="(shareRef.isShared ? 'Edit settings' : 'Share')">
|
||||
<mat-icon>share</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<button mat-icon-button (click)="showVersions = !showVersions" class="app-show-versions-button"
|
||||
title="{{ 'DOCUMENT_LIST.TOOLBAR.TOGGLE_METADATA' | translate }}">
|
||||
title="Toggle metadata">
|
||||
<mat-icon>{{ showVersions ? 'chevron_right' : 'chevron_left' }}</mat-icon>
|
||||
</button>
|
||||
|
||||
@@ -125,25 +116,25 @@
|
||||
<button mat-menu-item (click)="toggleGalleryView()">
|
||||
<mat-icon *ngIf="displayMode === 'list'">view_comfy</mat-icon>
|
||||
<mat-icon *ngIf="displayMode === 'gallery'">list</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.CARDVIEW' | translate }}</span>
|
||||
<span>Card view mode</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
(error)="openSnackMessageError($event)"
|
||||
[adf-create-folder]="currentFolderId">
|
||||
<mat-icon>create_new_folder</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.NEW_FOLDER' | translate }}</span>
|
||||
<span>New folder</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
(click)="createLibrary()">
|
||||
<mat-icon>library_add</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.CREATE_LIBRARY' | translate }}</span>
|
||||
<span>Create Library</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
[disabled]="!canEditFolder(documentList.selection)"
|
||||
(error)="openSnackMessageError($event)"
|
||||
[adf-edit-folder]="documentList.selection[0]?.entry">
|
||||
<mat-icon>create</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.EDIT_FOLDER' | translate }}</span>
|
||||
<span>Edit folder</span>
|
||||
</button>
|
||||
<button mat-menu-item
|
||||
adf-check-allowable-operation="delete"
|
||||
@@ -151,7 +142,7 @@
|
||||
(delete)="onDeleteActionSuccess($event)"
|
||||
[adf-delete]="documentList.selection">
|
||||
<mat-icon>delete</mat-icon>
|
||||
<span>{{ 'DOCUMENT_LIST.TOOLBAR.DELETE' | translate }}</span>
|
||||
<span>Delete</span>
|
||||
</button>
|
||||
</mat-menu>
|
||||
</adf-toolbar>
|
||||
@@ -204,7 +195,7 @@
|
||||
key="name"
|
||||
sortingKey="name"
|
||||
class="app-ellipsis-cell"
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.DISPLAY_NAME' | translate}}"
|
||||
title="Display name"
|
||||
[formatTooltip]="getNodeNameTooltip">
|
||||
<ng-template let-context>
|
||||
<adf-name-column key="name" [context]="context"></adf-name-column>
|
||||
@@ -214,13 +205,13 @@
|
||||
*ngIf="showNameColumn && !hyperlinkNavigation"
|
||||
key="name"
|
||||
sortingKey="name"
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.DISPLAY_NAME' | translate}}"
|
||||
title="Display name"
|
||||
[formatTooltip]="getNodeNameTooltip"
|
||||
class="app-ellipsis-cell adf-expand-cell-5">
|
||||
</data-column>
|
||||
<data-column
|
||||
key="content.sizeInBytes"
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.SIZE' | translate}}"
|
||||
title="Size"
|
||||
type="fileSize"
|
||||
sortingKey="sizeInBytes"
|
||||
class="app-desktop-only adf-ellipsis-cell">
|
||||
@@ -238,13 +229,13 @@
|
||||
|
||||
<data-column
|
||||
class="app-full-width adf-ellipsis-cell adf-desktop-only"
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.NODE_ID' | translate}}"
|
||||
title="Node id"
|
||||
[sortable]="false"
|
||||
key="id">
|
||||
</data-column>
|
||||
|
||||
<data-column
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.IS_LOCKED' | translate}}"
|
||||
title="Lock"
|
||||
key="lock"
|
||||
[focus]="false"
|
||||
[sortable]="false"
|
||||
@@ -257,13 +248,13 @@
|
||||
</ng-template>
|
||||
</data-column>
|
||||
<data-column
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.CREATED_BY' | translate}}"
|
||||
title="Created by"
|
||||
key="createdByUser.displayName"
|
||||
sortingKey="createdByUser"
|
||||
class="app-desktop-only adf-ellipsis-cell">
|
||||
</data-column>
|
||||
<data-column
|
||||
title="{{'DOCUMENT_LIST.COLUMNS.CREATED' | translate}}"
|
||||
title="Created"
|
||||
key="createdAt"
|
||||
sortingKey="createdAt"
|
||||
type="date"
|
||||
@@ -276,12 +267,12 @@
|
||||
<content-actions>
|
||||
<content-action
|
||||
icon="get_app"
|
||||
title="DOCUMENT_LIST.ACTIONS.DOWNLOAD"
|
||||
title="Download"
|
||||
handler="download">
|
||||
</content-action>
|
||||
<content-action
|
||||
icon="content_copy"
|
||||
title="DOCUMENT_LIST.ACTIONS.FOLDER.COPY"
|
||||
title="Copy"
|
||||
permission="copy"
|
||||
[disableWithNoPermission]="true"
|
||||
(error)="onContentActionError($event)"
|
||||
@@ -290,7 +281,7 @@
|
||||
</content-action>
|
||||
<content-action
|
||||
icon="redo"
|
||||
title="DOCUMENT_LIST.ACTIONS.FOLDER.MOVE"
|
||||
title="Move"
|
||||
permission="update"
|
||||
[disableWithNoPermission]="true"
|
||||
(error)="onContentActionError($event)"
|
||||
@@ -301,19 +292,19 @@
|
||||
icon="delete"
|
||||
permission="delete"
|
||||
[disableWithNoPermission]="true"
|
||||
title="DOCUMENT_LIST.ACTIONS.FOLDER.DELETE"
|
||||
title="Delete"
|
||||
(permissionEvent)="handlePermissionError($event)"
|
||||
(success)="onDeleteActionSuccess($event)"
|
||||
handler="delete">
|
||||
</content-action>
|
||||
<content-action
|
||||
icon="info"
|
||||
title="DOCUMENT_LIST.ACTIONS.METADATA"
|
||||
title="Info"
|
||||
(execute)="onManageMetadata($event)">
|
||||
</content-action>
|
||||
<content-action
|
||||
icon="supervisor_account"
|
||||
title="DOCUMENT_LIST.ACTIONS.PERMISSION"
|
||||
title="Permission"
|
||||
permission="copy"
|
||||
(error)="onContentActionError($event)"
|
||||
(execute)="onPermissionRequested($event)">
|
||||
@@ -322,7 +313,7 @@
|
||||
<content-action
|
||||
icon="storage"
|
||||
target="document"
|
||||
title="DOCUMENT_LIST.ACTIONS.VERSIONS"
|
||||
title="Manage versions"
|
||||
(execute)="onManageVersions($event)">
|
||||
</content-action>
|
||||
<content-action
|
||||
@@ -330,12 +321,12 @@
|
||||
icon="lock"
|
||||
permission="lock"
|
||||
handler="lock"
|
||||
title="DOCUMENT_LIST.ACTIONS.LOCK">
|
||||
title="Lock">
|
||||
</content-action>
|
||||
<content-action
|
||||
icon="beach_access"
|
||||
target="document"
|
||||
title="DOCUMENT_LIST.ACTIONS.ASPECTS"
|
||||
title="Update Aspects"
|
||||
(execute)="onAspectUpdate($event)">
|
||||
</content-action>
|
||||
</content-actions>
|
||||
@@ -382,13 +373,13 @@
|
||||
<ng-template #choose_document_template>
|
||||
<div class="app-manage-versions-empty">
|
||||
<mat-icon class="app-manage-versions-empty-icon">face</mat-icon>
|
||||
{{'VERSION.CHOOSE_FILE' | translate}}
|
||||
Select a file to see its versions
|
||||
</div>
|
||||
</ng-template>
|
||||
<ng-template #no_permission_to_versions>
|
||||
<div class="app-manage-versions-no-permission">
|
||||
<mat-icon class="app-manage-versions-no-permission-icon">warning</mat-icon>
|
||||
{{'VERSION.NO_PERMISSION' | translate}}
|
||||
You don't have permission to manage versions of this content
|
||||
</div>
|
||||
</ng-template>
|
||||
</adf-info-drawer-tab>
|
||||
@@ -399,7 +390,6 @@
|
||||
</div>
|
||||
|
||||
<div *ngIf="showSettingsPanel" class="app-content-service-settings">
|
||||
|
||||
<p>Current folder ID: {{ documentList.currentFolderId }}</p>
|
||||
|
||||
<div class="app-p-10">
|
||||
@@ -413,7 +403,7 @@
|
||||
|
||||
<div class="app-container">
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showNameColumn">
|
||||
<mat-slide-toggle [(ngModel)]="showNameColumn">
|
||||
Show Name Column
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
@@ -425,102 +415,97 @@
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle data-automation-id="multiSelectToggle" [color]="'primary'" [(ngModel)]="multiselect">
|
||||
{{'DOCUMENT_LIST.MULTISELECT_CHECKBOXES' | translate}}
|
||||
<mat-slide-toggle data-automation-id="multiSelectToggle" [(ngModel)]="multiselect">
|
||||
Multiselect (with checkboxes)
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-multiple-upload-switch" [color]="'primary'" [(ngModel)]="multipleFileUpload" >
|
||||
{{'DOCUMENT_LIST.MULTIPLE_FILE_UPLOAD' | translate}}
|
||||
<mat-slide-toggle id="adf-multiple-upload-switch" [(ngModel)]="multipleFileUpload" >
|
||||
Multiple File Upload
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-folder-upload-switch" [color]="'primary'" [(ngModel)]="folderUpload">
|
||||
{{'DOCUMENT_LIST.FOLDER_UPLOAD' | translate}}
|
||||
<mat-slide-toggle id="adf-folder-upload-switch" [(ngModel)]="folderUpload">
|
||||
Folder upload
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-extension-filter-upload-switch" [color]="'primary'"
|
||||
[(ngModel)]="acceptedFilesTypeShow">
|
||||
{{'DOCUMENT_LIST.CUSTOM_FILTER' | translate}}
|
||||
<mat-slide-toggle id="adf-extension-filter-upload-switch" [(ngModel)]="acceptedFilesTypeShow">
|
||||
Custom extensions filter
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-max-size-filter-upload-switch" [color]="'primary'" [(ngModel)]="maxSizeShow">
|
||||
{{'DOCUMENT_LIST.MAX_SIZE' | translate}}
|
||||
<mat-slide-toggle id="adf-max-size-filter-upload-switch" [(ngModel)]="maxSizeShow">
|
||||
Max size filter
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-thumbnails-upload-switch" [color]="'primary'" (click)="toggleThumbnails()">
|
||||
{{'DOCUMENT_LIST.THUMBNAILS' | translate}}
|
||||
<mat-slide-toggle id="adf-thumbnails-upload-switch" (click)="toggleThumbnails()">
|
||||
Enable Thumbnails
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-document-list-enable-drop-files" [color]="'primary'" [checked]="allowDropFiles"
|
||||
(change)="toggleAllowDropFiles()">
|
||||
{{'DOCUMENT_LIST.ALLOW_DROP_FILES' | translate}}
|
||||
<mat-slide-toggle id="adf-document-list-enable-drop-files" [checked]="allowDropFiles" (change)="toggleAllowDropFiles()">
|
||||
Enable Drop Files in a folder or a file
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-version-upload-switch" [color]="'primary'" [(ngModel)]="versioning">
|
||||
{{'DOCUMENT_LIST.ENABLE_VERSIONING' | translate}}
|
||||
<mat-slide-toggle id="adf-version-upload-switch" [(ngModel)]="versioning">
|
||||
Enable versioning
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" (click)="onInfiniteScrolling()">
|
||||
{{'DOCUMENT_LIST.ENABLE_INFINITE_SCROLL' | translate}}
|
||||
<mat-slide-toggle (click)="onInfiniteScrolling()">
|
||||
Enable Infinite Scrolling
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showVersionComments">
|
||||
{{'APP.ADF_VERSION_MANAGER.SHOW_COMMENTS' | translate}}
|
||||
<mat-slide-toggle [(ngModel)]="showVersionComments">
|
||||
Show comments on versions
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="allowVersionDownload">
|
||||
{{'APP.ADF_VERSION_MANAGER.ALLOW_DOWNLOAD' | translate}}
|
||||
<mat-slide-toggle [(ngModel)]="allowVersionDownload">
|
||||
Enable version download
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="warnOnMultipleUploads">
|
||||
{{'APP.WARN-MULTIPLE-UPLOADS' | translate}}
|
||||
<mat-slide-toggle [(ngModel)]="warnOnMultipleUploads">
|
||||
Display warning for multiple uploads
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="enableMediumTimeFormat" id="enableMediumTimeFormat">
|
||||
{{'APP.MEDIUM-TIME-FORMAT' | translate}}
|
||||
<mat-slide-toggle [(ngModel)]="enableMediumTimeFormat" id="enableMediumTimeFormat">
|
||||
Enable medium time format for document list
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle
|
||||
color="primary" [(ngModel)]="displayEmptyMetadata" id="displayEmptyMetadata">
|
||||
<mat-slide-toggle [(ngModel)]="displayEmptyMetadata" id="displayEmptyMetadata">
|
||||
Display Empty Metadata
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle
|
||||
color="primary" [(ngModel)]="stickyHeader" id="stickyHeader">
|
||||
<mat-slide-toggle [(ngModel)]="stickyHeader" id="stickyHeader">
|
||||
Sticky Header
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle
|
||||
color="primary" [(ngModel)]="enableDownloadPrompt" id="enableDownloadPrompt" (change)="onEnableDownloadPrompt()">
|
||||
<mat-slide-toggle [(ngModel)]="enableDownloadPrompt" id="enableDownloadPrompt" (change)="onEnableDownloadPrompt()">
|
||||
Enable Download Prompt
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
@@ -531,8 +516,7 @@
|
||||
</section>
|
||||
|
||||
<section *ngIf="enableDownloadPrompt">
|
||||
<mat-slide-toggle
|
||||
color="primary" [(ngModel)]="enableDownloadPromptReminder" id="enableDownloadPromptReminders" (change)="onEnableDownloadPromptReminderChange()">
|
||||
<mat-slide-toggle [(ngModel)]="enableDownloadPromptReminder" id="enableDownloadPromptReminders" (change)="onEnableDownloadPromptReminderChange()">
|
||||
Enable Download Prompt Reminders
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
@@ -543,8 +527,7 @@
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle
|
||||
color="primary" [(ngModel)]="enableFileAutoDownload" id="enableFileAutoDownload" (change)="onEnableFileAutoDownloadChange()">
|
||||
<mat-slide-toggle [(ngModel)]="enableFileAutoDownload" id="enableFileAutoDownload" (change)="onEnableFileAutoDownloadChange()">
|
||||
Enable FileAutoDownload
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
@@ -604,15 +587,13 @@
|
||||
</div>
|
||||
<section>
|
||||
<mat-checkbox id="adf-disable-upload" [(ngModel)]="enableUpload">
|
||||
{{'DOCUMENT_LIST.DESCRIPTION_UPLOAD' | translate}}
|
||||
Enable upload
|
||||
</mat-checkbox>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="app-p-10">
|
||||
<p>
|
||||
{{'DOCUMENT_LIST.MULTISELECT_DESCRIPTION' | translate}}
|
||||
</p>
|
||||
<p>Use Cmd (Mac) or Ctrl (Windows) to toggle selection of multiple items</p>
|
||||
<mat-form-field>
|
||||
<mat-select placeholder="Selection Mode" [(ngModel)]="selectionMode" name="food">
|
||||
<mat-option *ngFor="let mode of selectionModes" [value]="mode.value">
|
||||
|
@@ -1,9 +0,0 @@
|
||||
<app-files-component [sortingMode]="'server'"
|
||||
[showRecentFiles]="false"
|
||||
[showSitePicker]="true"
|
||||
[showSettingsPanel]="false"
|
||||
[navigationRoute]="navigationRoute"
|
||||
[currentFolderId]="currentFolderId"
|
||||
[headerFilters]="true"
|
||||
[paramValues]="queryParams">
|
||||
</app-files-component>
|
@@ -1,46 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, Optional } from '@angular/core';
|
||||
import { ActivatedRoute, Params } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'app-filtered-search-component',
|
||||
templateUrl: './filtered-search.component.html'
|
||||
})
|
||||
export class FilteredSearchComponent {
|
||||
|
||||
navigationRoute = '/filtered-search';
|
||||
currentFolderId = '-my-';
|
||||
|
||||
queryParams = null;
|
||||
|
||||
constructor(@Optional() private route: ActivatedRoute) {
|
||||
|
||||
if (this.route) {
|
||||
this.route.params.forEach((params: Params) => {
|
||||
if (params['id'] && this.currentFolderId !== params['id']) {
|
||||
this.currentFolderId = params['id'];
|
||||
}
|
||||
});
|
||||
|
||||
this.route.queryParamMap.subscribe((queryMap: Params) => {
|
||||
this.queryParams = queryMap.params;
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
@@ -1,8 +1,10 @@
|
||||
<header mat-dialog-title>{{'METADATA.DIALOG.TITLE' | translate}}</header>
|
||||
<header mat-dialog-title>Metadata</header>
|
||||
<section mat-dialog-content>
|
||||
<adf-content-metadata-card [node]="contentEntry"
|
||||
[displayEmpty]="displayEmptyMetadata"></adf-content-metadata-card>
|
||||
<adf-content-metadata-card
|
||||
[node]="contentEntry"
|
||||
[displayEmpty]="displayEmptyMetadata">
|
||||
</adf-content-metadata-card>
|
||||
</section>
|
||||
<footer mat-dialog-actions class="adf-metadata-dialog-actions">
|
||||
<button mat-button (click)="close()">{{'METADATA.DIALOG.CLOSE' | translate}}</button>
|
||||
<footer mat-dialog-actions>
|
||||
<button mat-button (click)="close()">Close</button>
|
||||
</footer>
|
||||
|
@@ -1,6 +0,0 @@
|
||||
.adf-metadata-dialog-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: center flex-end;
|
||||
align-items: center;
|
||||
}
|
@@ -1,26 +1,26 @@
|
||||
<header mat-dialog-title>{{'VERSION.DIALOG.TITLE' | translate}}</header>
|
||||
<header mat-dialog-title>Manage Versions</header>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-version-manager-switch-readonly" color="primary" [(ngModel)]="readOnly">
|
||||
{{'APP.ADF_VERSION_MANAGER.READ_ONLY' | translate}}
|
||||
<mat-slide-toggle id="adf-version-manager-switch-readonly" [(ngModel)]="readOnly">
|
||||
Read-only
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-version-manager-switch-download" color="primary" [(ngModel)]="allowDownload">
|
||||
{{'APP.ADF_VERSION_MANAGER.ALLOW_DOWNLOAD' | translate}}
|
||||
<mat-slide-toggle id="adf-version-manager-switch-download" [(ngModel)]="allowDownload">
|
||||
Enable version download
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-version-manager-switch-comments" color="primary" [(ngModel)]="showComments">
|
||||
{{'APP.ADF_VERSION_MANAGER.COMMENTS' | translate}}
|
||||
<mat-slide-toggle id="adf-version-manager-switch-comments" [(ngModel)]="showComments">
|
||||
Show comments
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
<section *ngIf="newFileVersion">
|
||||
<mat-slide-toggle id="adf-version-manager-switch-comparison" color="primary" [(ngModel)]="showVersionComparison">
|
||||
{{'APP.ADF_VERSION_MANAGER.VERSION_COMPARISON' | translate}}
|
||||
<mat-slide-toggle id="adf-version-manager-switch-comparison" [(ngModel)]="showVersionComparison">
|
||||
Show version comparison
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
@@ -40,6 +40,6 @@
|
||||
<adf-version-list [node]="contentEntry" [showActions]="false"></adf-version-list>
|
||||
</section>
|
||||
|
||||
<footer mat-dialog-actions class="adf-version-manager-dialog-actions">
|
||||
<button mat-button (click)="close()">{{'VERSION.DIALOG.CLOSE' | translate}}</button>
|
||||
<footer mat-dialog-actions>
|
||||
<button mat-button (click)="close()">Close</button>
|
||||
</footer>
|
||||
|
@@ -1,6 +0,0 @@
|
||||
.adf-version-manager-dialog-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: center flex-end;
|
||||
align-items: center;
|
||||
}
|
@@ -4,10 +4,8 @@
|
||||
<adf-form #adfForm [form]="form" [data]="restoredData" [showValidationIcon]="showValidationIcon">
|
||||
</adf-form>
|
||||
</div>
|
||||
<button mat-button (click)="store()" color="primary">{{'FORM-LIST.STORE' | translate }}</button>
|
||||
<button mat-button (click)="restore()" color="primary">{{'FORM-LIST.RESTORE' | translate }}</button>
|
||||
<button mat-button (click)="store()">Store</button>
|
||||
<button mat-button (click)="restore()">Restore</button>
|
||||
<section class="app-form-list-margin">
|
||||
<mat-slide-toggle color="primary" [(ngModel)]="showValidationIcon">
|
||||
Show Validation Icon
|
||||
</mat-slide-toggle>
|
||||
<mat-slide-toggle [(ngModel)]="showValidationIcon">Show Validation Icon</mat-slide-toggle>
|
||||
</section>
|
||||
|
@@ -2,33 +2,23 @@
|
||||
<mat-accordion>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
{{'FORM-LOADING.FORM_DATA' | translate}}
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
{{'FORM-LOADING.FORM_DATA_MESSAGE' | translate}}
|
||||
</mat-panel-description>
|
||||
<mat-panel-title>Form Data</mat-panel-title>
|
||||
<mat-panel-description>Enter values to populate the form</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
<mat-list>
|
||||
<mat-list-item>
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
placeholder="{{'FORM-LOADING.TYPEAHEAD_PLACEHOLDER' | translate}}"
|
||||
[(ngModel)]="typeaheadFieldValue">
|
||||
<input matInput placeholder="Typeahead" [(ngModel)]="typeaheadFieldValue">
|
||||
</mat-form-field>
|
||||
</mat-list-item>
|
||||
<mat-list-item>
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
placeholder="{{'FORM-LOADING.SELECT_PLACEHOLDER' | translate}}"
|
||||
[(ngModel)]="selectFieldValue">
|
||||
<input matInput placeholder="DropDown" [(ngModel)]="selectFieldValue">
|
||||
</mat-form-field>
|
||||
</mat-list-item>
|
||||
<mat-list-item>
|
||||
<mat-form-field>
|
||||
<input matInput
|
||||
placeholder="{{'FORM-LOADING.RADIO_PLACEHOLDER' | translate}}"
|
||||
[(ngModel)]="radioButtonFieldValue">
|
||||
<input matInput placeholder="Radio Button" [(ngModel)]="radioButtonFieldValue">
|
||||
</mat-form-field>
|
||||
</mat-list-item>
|
||||
</mat-list>
|
||||
|
@@ -1,73 +0,0 @@
|
||||
<div class="app-content app-header-data">
|
||||
<h1>Header data</h1>
|
||||
<mat-card>
|
||||
<div>
|
||||
<mat-checkbox [(ngModel)]="checkbox" (change)="hideButton()">Show menu button</mat-checkbox>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Choose header color</label>
|
||||
<select (change)="changeColor($any($event).target.value)">
|
||||
<option value="primary">Primary</option>
|
||||
<option value="accent">Accent</option>
|
||||
<option value="warn">Warn</option>
|
||||
</select>
|
||||
OR
|
||||
<input type="text" name="color" (keyup.enter)="changeColor($any($event).target.value)"
|
||||
placeholder="hex color code">
|
||||
<p>*Choose only one value at a time: either hex code or theme color.</p>
|
||||
<p>*press enter for submitting new hex color</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Change title</label>
|
||||
<input type="text" name="title" (keyup.enter)="submitTitle($any($event).target.value)"
|
||||
placeholder="{{ 'APP_LAYOUT.APP_NAME' | translate}}">
|
||||
<p>*press enter for submitting new title</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Change header text color</label>
|
||||
<input type="text" name="headerColor" (keyup.enter)="submitHeaderTextColor($any($event).target.value)"
|
||||
placeholder="{{ 'APP_LAYOUT.HEADER_TEXT_COLOR' | translate}}">
|
||||
<p>*press enter for submitting new color text</p>
|
||||
<p>*hex color</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Change logo</label>
|
||||
<input type="text" placeholder="URL path" (keyup.enter)="submitLogo($any($event).target.value)">
|
||||
<p>*press enter for submitting new logo</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Change logo link</label>
|
||||
<input type="url" placeholder="Redirect URL" (keyup.enter)="submitRedirectUrl($any($event).target.value)">
|
||||
<p>*Input JSON friendly array or explicit string. E.g. ["/test", 33, "user", 11] or "/test"</p>
|
||||
<p>*press enter for submitting new link on logo</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Change logo tooltip</label>
|
||||
<input type="text" placeholder="Tooltip text" (keyup.enter)="submitTooltip($any($event).target.value)">
|
||||
<p>*press enter for submitting new tooltip</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label>Sidebar Position </label>
|
||||
|
||||
<mat-radio-group [(ngModel)]="position" (change)="changePosition()">
|
||||
<mat-radio-button value="start">Start</mat-radio-button>
|
||||
<mat-radio-button value="end">End</mat-radio-button>
|
||||
</mat-radio-group>
|
||||
</div>
|
||||
<br>
|
||||
<br>
|
||||
<section>
|
||||
<mat-slide-toggle id="adf-hide-sidenav" [color]="'primary'" (click)="changeSidenavVisibility()">
|
||||
Hide Sidebar
|
||||
</mat-slide-toggle>
|
||||
</section>
|
||||
|
||||
</mat-card>
|
||||
</div>
|
@@ -1,31 +0,0 @@
|
||||
.app-content {
|
||||
padding: 10px;
|
||||
|
||||
.mat-card {
|
||||
padding: 16px 24px;
|
||||
max-width: 100% !important;
|
||||
max-height: 100% !important;
|
||||
|
||||
div {
|
||||
padding: 0;
|
||||
margin-bottom: 30px;
|
||||
|
||||
label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.mat-form-field,
|
||||
input,
|
||||
select {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
p {
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
@@ -1,88 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { ThemePalette } from '@angular/material/core';
|
||||
import { HeaderDataService } from './header-data.service';
|
||||
|
||||
@Component({
|
||||
templateUrl: './header-data.component.html',
|
||||
styleUrls: ['./header-data.component.scss']
|
||||
})
|
||||
export class HeaderDataComponent {
|
||||
checkbox = true;
|
||||
position: 'start' | 'end' = 'start';
|
||||
hideSidenavToggle = false;
|
||||
colorsHashesTests = [
|
||||
/#[a-z0-9]{3}/i,
|
||||
/#[a-z0-9]{4}/i,
|
||||
/#[a-z0-9]{6}/i
|
||||
];
|
||||
|
||||
constructor(private headerService: HeaderDataService) {
|
||||
}
|
||||
|
||||
hideButton() {
|
||||
this.headerService.hideMenuButton();
|
||||
}
|
||||
|
||||
changeColor(color: ThemePalette) {
|
||||
this.headerService.changeColor(color);
|
||||
}
|
||||
|
||||
submitTitle(title: string) {
|
||||
if (title) {
|
||||
this.headerService.changeTitle(title);
|
||||
}
|
||||
}
|
||||
|
||||
submitHeaderTextColor(color: string): void {
|
||||
const isColorHashValid = this.colorsHashesTests.some(colorTest => colorTest.test(color));
|
||||
|
||||
if (isColorHashValid || !color) {
|
||||
this.headerService.changeHeaderTextColor(color);
|
||||
}
|
||||
}
|
||||
|
||||
submitLogo(logoPath: string) {
|
||||
if (logoPath) {
|
||||
this.headerService.changeLogo(logoPath);
|
||||
}
|
||||
}
|
||||
|
||||
submitRedirectUrl(value: string) {
|
||||
const redirectUrl = JSON.parse(value);
|
||||
if (redirectUrl) {
|
||||
this.headerService.changeRedirectUrl(redirectUrl);
|
||||
}
|
||||
}
|
||||
|
||||
submitTooltip(tooltip: string) {
|
||||
if (tooltip) {
|
||||
this.headerService.changeTooltip(tooltip);
|
||||
}
|
||||
}
|
||||
|
||||
changePosition() {
|
||||
this.headerService.changePosition(this.position);
|
||||
}
|
||||
|
||||
changeSidenavVisibility() {
|
||||
this.hideSidenavToggle = !this.hideSidenavToggle;
|
||||
this.headerService.changeSidenavVisibility(this.hideSidenavToggle);
|
||||
}
|
||||
}
|
@@ -1,39 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { HeaderDataComponent } from './header-data.component';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: HeaderDataComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
RouterModule.forChild(routes),
|
||||
CoreModule
|
||||
],
|
||||
declarations: [HeaderDataComponent]
|
||||
})
|
||||
export class AppHeaderDataModule {}
|
@@ -1,75 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Injectable, Output, EventEmitter } from '@angular/core';
|
||||
import { ThemePalette } from '@angular/material/core';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
// eslint-disable-next-line @angular-eslint/directive-class-suffix
|
||||
export class HeaderDataService {
|
||||
|
||||
show = true;
|
||||
|
||||
@Output() hideMenu = new EventEmitter<boolean>();
|
||||
@Output() color = new EventEmitter<ThemePalette>();
|
||||
@Output() headerTextColor = new EventEmitter<string>();
|
||||
@Output() title = new EventEmitter<string>();
|
||||
@Output() logo = new EventEmitter<string>();
|
||||
@Output() redirectUrl = new EventEmitter<string | any[]>();
|
||||
@Output() tooltip = new EventEmitter<string>();
|
||||
@Output() position = new EventEmitter<'start' | 'end'>();
|
||||
@Output() hideSidenav = new EventEmitter<boolean>();
|
||||
|
||||
hideMenuButton() {
|
||||
this.show = !this.show;
|
||||
this.hideMenu.emit(this.show);
|
||||
}
|
||||
|
||||
changeColor(color: ThemePalette) {
|
||||
this.color.emit(color);
|
||||
}
|
||||
|
||||
changeTitle(title: string) {
|
||||
this.title.emit(title);
|
||||
}
|
||||
|
||||
changeLogo(logoPath: string) {
|
||||
this.logo.emit(logoPath);
|
||||
}
|
||||
|
||||
changeHeaderTextColor(color: string): void {
|
||||
this.headerTextColor.emit(color);
|
||||
}
|
||||
|
||||
changeRedirectUrl(redirectUrl: string | any[]) {
|
||||
this.redirectUrl.emit(redirectUrl);
|
||||
}
|
||||
|
||||
changeTooltip(tooltip: string) {
|
||||
this.tooltip.emit(tooltip);
|
||||
}
|
||||
|
||||
changePosition(position: 'start' | 'end') {
|
||||
this.position.emit(position);
|
||||
}
|
||||
|
||||
changeSidenavVisibility(hideSidenav: boolean) {
|
||||
this.hideSidenav.emit(hideSidenav);
|
||||
}
|
||||
}
|
@@ -1,12 +1,8 @@
|
||||
<header class="app-home-background">
|
||||
<div class="app-home-section ad">
|
||||
<div class="app-home-headline">
|
||||
<h1 class="mat-h1">ADF</h1>
|
||||
<h2>{{ 'APP.HOME.TITLE' | translate}}</h2>
|
||||
</div>
|
||||
|
||||
<div class="app-home-start">
|
||||
<a mat-raised-button color="primary" class="app-home-docs-button" href="https://github.com/Alfresco/alfresco-ng2-components/tree/master/docs">{{ 'APP.HOME.DOCUMENTATION' | translate}}</a>
|
||||
</div>
|
||||
<div class="app-home-background">
|
||||
<div class="app-home-headline">
|
||||
<h1>ADF</h1>
|
||||
<h2>Angular components for Alfresco</h2>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<a mat-raised-button href="https://github.com/Alfresco/alfresco-ng2-components/tree/master/docs">Documentation</a>
|
||||
</div>
|
||||
|
@@ -1,35 +1,19 @@
|
||||
:host {
|
||||
app-home-view {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.app-home-header-background {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.app-home-section {
|
||||
text-align: center;
|
||||
padding-top: 60px;
|
||||
}
|
||||
|
||||
.app-home-headline {
|
||||
h1 {
|
||||
font-size: 56px;
|
||||
font-weight: 300;
|
||||
line-height: 56px;
|
||||
margin: 15px 5px;
|
||||
}
|
||||
.app-home-headline {
|
||||
h1 {
|
||||
font-size: 56px;
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
line-height: 28px;
|
||||
margin: 15px 0 25px;
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.app-home-docs-button {
|
||||
margin: 30px;
|
||||
}
|
||||
|
@@ -15,11 +15,12 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { Component, ViewEncapsulation } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-home-view',
|
||||
templateUrl: './home.component.html',
|
||||
styleUrls: ['./home.component.scss']
|
||||
styleUrls: ['./home.component.scss'],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class HomeComponent {}
|
||||
|
@@ -1,59 +0,0 @@
|
||||
<h1>Icons</h1>
|
||||
|
||||
<h2>Ligatures</h2>
|
||||
<small>
|
||||
See more details here:
|
||||
<a href="https://material.angular.io/components/icon/overview#font-icons-with-ligatures">Font icons with ligatures</a>
|
||||
</small>
|
||||
|
||||
<div>
|
||||
<div><strong>Markup:</strong></div>
|
||||
<pre>
|
||||
<adf-icon value="folder"></adf-icon></pre>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div><strong>Result:</strong></div>
|
||||
<adf-icon value="folder"></adf-icon>
|
||||
</div>
|
||||
|
||||
<h2>Named icons</h2>
|
||||
<small>
|
||||
See more details here:
|
||||
<a href="https://material.angular.io/components/icon/overview#named-icons">Named icons</a>
|
||||
</small>
|
||||
|
||||
<div>
|
||||
<div><strong>Code:</strong></div>
|
||||
<pre>
|
||||
matIconRegistry.addSvgIconInNamespace(
|
||||
'adf',
|
||||
'move_file',
|
||||
this.sanitizer.bypassSecurityTrustResourceUrl(
|
||||
'./assets/images/adf-move-file-24px.svg'
|
||||
)
|
||||
);</pre>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div><strong>Markup:</strong></div>
|
||||
<pre>
|
||||
<adf-icon value="adf:move_file"></adf-icon></pre>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div><strong>Result:</strong></div>
|
||||
<adf-icon value="adf:move_file"></adf-icon>
|
||||
</div>
|
||||
|
||||
<h2>ADF Thumbnail Service</h2>
|
||||
<div>
|
||||
<div><strong>Markup:</strong></div>
|
||||
<pre>
|
||||
<adf-icon value="adf:folder"></adf-icon></pre>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<div><strong>Result:</strong></div>
|
||||
<adf-icon value="adf:folder"></adf-icon>
|
||||
</div>
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { MatIconRegistry } from '@angular/material/icon';
|
||||
import { DomSanitizer } from '@angular/platform-browser';
|
||||
|
||||
@Component({
|
||||
selector: 'app-icons-demo',
|
||||
templateUrl: './icons.component.html'
|
||||
})
|
||||
export class IconsComponent implements OnInit {
|
||||
constructor(
|
||||
private matIconRegistry: MatIconRegistry,
|
||||
private sanitizer: DomSanitizer
|
||||
) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.matIconRegistry.addSvgIconInNamespace(
|
||||
'adf',
|
||||
'move_file',
|
||||
this.sanitizer.bypassSecurityTrustResourceUrl(
|
||||
'./assets/images/adf-move-file-24px.svg'
|
||||
)
|
||||
);
|
||||
}
|
||||
}
|
@@ -1,39 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { IconsComponent } from './icons.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: IconsComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes)
|
||||
],
|
||||
declarations: [IconsComponent]
|
||||
})
|
||||
export class AppIconsModule {}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Text from lazy component resources"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Text ze zdrojů s opožděnými součástmi"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Tekst fra dovne komponentressourcer"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Text aus Lazy-Komponentenressourcen"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Text from lazy component resources"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Texto de recursos de componentes lazy"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Teksti lazy-komponenttiresursseista"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Texte des ressources du composant lazy"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Testo risorse componenti lazy"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Lazy コンポーネントリソースのテキスト"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Tekst fra ressursene med lazy komponent"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Tekst van vertraagde componentresources"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Tekst dotyczący elementów zasobów z opóźnieniem"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Texto de recursos de componente lento"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Текст из ресурсов отложенного компонента"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "Text från lata komponentresurser"
|
||||
}
|
||||
}
|
@@ -1,5 +0,0 @@
|
||||
{
|
||||
"LAZY": {
|
||||
"TEXT": "来自惰性组件资源的文本"
|
||||
}
|
||||
}
|
@@ -1,66 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { ObjectDataTableAdapter, AuthenticationService } from '@alfresco/adf-core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-lazy-component',
|
||||
template: `
|
||||
<adf-datatable [data]="data"></adf-datatable>
|
||||
|
||||
<ul>
|
||||
<li>Global i18n: {{ 'APP_LAYOUT.DATATABLE_LAZY' | translate }}</li>
|
||||
<li>Local i18n (work in progress): {{ 'LAZY.TEXT' | translate }}</li>
|
||||
<li>isLoggedIn: {{ isLoggedIn }}</li>
|
||||
</ul>
|
||||
`
|
||||
})
|
||||
export class LazyLoadingComponent {
|
||||
|
||||
data: ObjectDataTableAdapter;
|
||||
|
||||
get isLoggedIn(): boolean {
|
||||
return this.auth.isLoggedIn();
|
||||
}
|
||||
|
||||
constructor(private auth: AuthenticationService) {
|
||||
this.data = new ObjectDataTableAdapter(
|
||||
// data
|
||||
[
|
||||
{id: 1, name: 'Name 1'},
|
||||
{id: 2, name: 'Name 2'}
|
||||
],
|
||||
// schema
|
||||
[
|
||||
{
|
||||
type: 'text',
|
||||
key: 'id',
|
||||
title: 'Id',
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
type: 'text',
|
||||
key: 'name',
|
||||
title: 'Name',
|
||||
cssClass: 'full-width',
|
||||
sortable: true
|
||||
}
|
||||
]
|
||||
);
|
||||
}
|
||||
}
|
@@ -1,33 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
|
||||
import { LazyLoadingRoutes } from './lazy-loading.routes';
|
||||
import { LazyLoadingComponent } from './lazy-loading.component';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CoreModule,
|
||||
LazyLoadingRoutes
|
||||
],
|
||||
declarations: [
|
||||
LazyLoadingComponent
|
||||
]
|
||||
})
|
||||
export class LazyLoadingModule {}
|
@@ -1,38 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { LazyLoadingComponent } from './lazy-loading.component';
|
||||
|
||||
export const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: LazyLoadingComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forChild(routes)
|
||||
],
|
||||
exports: [
|
||||
RouterModule
|
||||
]
|
||||
})
|
||||
export class LazyLoadingRoutes {
|
||||
}
|
@@ -1,27 +0,0 @@
|
||||
.log-list-type {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.log-list-text {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.log-card {
|
||||
min-width: 200px;
|
||||
z-index: 1;
|
||||
height: 20%;
|
||||
width: 40%;
|
||||
position: fixed;
|
||||
top: 4em;
|
||||
right: 1em;
|
||||
opacity: 0.9;
|
||||
overflow: scroll;
|
||||
}
|
||||
|
||||
.log-ERROR {
|
||||
color: var(--theme-warn-color);
|
||||
}
|
||||
|
||||
.log-WARN {
|
||||
color: var(--theme-accent-color);
|
||||
}
|
@@ -1,12 +0,0 @@
|
||||
<mat-card class="log-card" *ngIf="show">
|
||||
<mat-card-header>
|
||||
<mat-card-title><h2>Log Service</h2></mat-card-title>
|
||||
</mat-card-header>
|
||||
<mat-card-content class="log-container">
|
||||
|
||||
<div *ngIf="logsData">
|
||||
<adf-datatable [data]="logsData"></adf-datatable>
|
||||
</div>
|
||||
|
||||
</mat-card-content>
|
||||
</mat-card>
|
@@ -1,79 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, HostListener, OnDestroy, OnInit } from '@angular/core';
|
||||
import { LogService, ObjectDataTableAdapter } from '@alfresco/adf-core';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
selector: 'app-log',
|
||||
templateUrl: './log.component.html',
|
||||
styleUrls: ['./log.component.css']
|
||||
})
|
||||
export class LogComponent implements OnInit, OnDestroy {
|
||||
logs: any[] = [];
|
||||
show = false;
|
||||
ctrlLKey = 12;
|
||||
logsData: ObjectDataTableAdapter;
|
||||
|
||||
private onDestroy$ = new Subject<boolean>();
|
||||
|
||||
constructor(public logService: LogService) {}
|
||||
|
||||
ngOnInit() {
|
||||
this.logService.onMessage
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(message => {
|
||||
let contentMessage = '';
|
||||
try {
|
||||
contentMessage = JSON.stringify(message.text);
|
||||
} catch (error) {
|
||||
return;
|
||||
}
|
||||
this.logs.push({ type: message.type, text: contentMessage });
|
||||
this.logsData = new ObjectDataTableAdapter(this.logs, [
|
||||
{
|
||||
type: 'text',
|
||||
key: 'type',
|
||||
title: 'Log level',
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
type: 'text',
|
||||
key: 'text',
|
||||
title: 'Message',
|
||||
sortable: false
|
||||
}
|
||||
]);
|
||||
});
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.onDestroy$.next(true);
|
||||
this.onDestroy$.complete();
|
||||
}
|
||||
|
||||
@HostListener('document:keypress', ['$event'])
|
||||
handleKeyboardEvent(event: KeyboardEvent) {
|
||||
const key = event.keyCode;
|
||||
|
||||
if (key === this.ctrlLKey) {
|
||||
this.show = !this.show;
|
||||
}
|
||||
}
|
||||
}
|
@@ -1,116 +1,10 @@
|
||||
<!--BPM, ECN AND CSRF TOGGLE-->
|
||||
|
||||
<div class="app-settings">
|
||||
<p class="app-toggle">
|
||||
<mat-slide-toggle
|
||||
id="switch3"
|
||||
color="primary"
|
||||
(change)="toggleCSRF()"
|
||||
[checked]="!disableCsrf">
|
||||
CSRF
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p class="app-toggle">
|
||||
<mat-slide-toggle
|
||||
id="switch4"
|
||||
color="primary"
|
||||
(change)="toggleFooter()"
|
||||
[checked]="showFooter">
|
||||
{{ 'LOGIN.LOGIN_FOOTER'| translate }}
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p class="app-toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-show-rememberme"
|
||||
color="primary"
|
||||
(change)="toggleRememberMe()"
|
||||
[checked]="showRememberMe">
|
||||
{{ 'LOGIN.SHOW_REMEMBERME'| translate }}
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p class="app-toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-show-successRoute"
|
||||
color="primary"
|
||||
(change)="toggleSuccessRoute()"
|
||||
[checked]="customSuccessRoute">
|
||||
{{ 'LOGIN.SHOW_SUCCESS_ROUTE'| translate }}
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p class="app-toggle">
|
||||
<ng-container *ngIf="customSuccessRoute">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Custom success route"
|
||||
[(ngModel)]="customSuccessRouteURI"
|
||||
data-automation-id="adf-success-route">
|
||||
</mat-form-field>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
<p class="app-toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-toggle-logo"
|
||||
color="primary"
|
||||
(change)="toggleLogo()"
|
||||
[checked]="customLogoImage">
|
||||
{{ 'LOGIN.CUSTOM_LOGO'| translate }}
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p class="app-toggle">
|
||||
<ng-container *ngIf="customLogoImage">
|
||||
<mat-form-field floatPlaceholder="float">
|
||||
<input matInput
|
||||
placeholder="Custom success Logo URL"
|
||||
[(ngModel)]="customLogoImageURL"
|
||||
data-automation-id="adf-url-logo">
|
||||
</mat-form-field>
|
||||
</ng-container>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
|
||||
<!--SETTING BUTTON-->
|
||||
|
||||
<a mat-fab class="app-setting-button" data-automation-id="settings" href="" routerLink="/settings" color="accent">
|
||||
<a mat-fab class="app-setting-button" data-automation-id="settings" href="" routerLink="/settings">
|
||||
<mat-icon>settings</mat-icon>
|
||||
</a>
|
||||
|
||||
<adf-login
|
||||
[successRoute]="customSuccessRouteURI"
|
||||
[logoImageUrl]="customLogoImageURL"
|
||||
[showLoginActions]="showFooter"
|
||||
[showRememberMe]="showFooter && showRememberMe"
|
||||
copyrightText="{{ 'application.copyright' | adfAppConfig }}"
|
||||
(success)="onLogin()"
|
||||
(error)="onError($event)">
|
||||
<div class="app-mobile-settings">
|
||||
<p>
|
||||
<mat-slide-toggle
|
||||
id="switch3-mobile"
|
||||
color="primary"
|
||||
(change)="toggleCSRF()"
|
||||
[checked]="!disableCsrf">
|
||||
CSRF
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<p>
|
||||
<mat-slide-toggle
|
||||
id="switch4-mobile"
|
||||
color="primary"
|
||||
(change)="toggleFooter()"
|
||||
[checked]="showFooter">
|
||||
{{ 'LOGIN.LOGIN_FOOTER'| translate }}
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
<button
|
||||
type="button"
|
||||
mat-raised-button
|
||||
color="accent"
|
||||
class="app-mobile-setting-button"
|
||||
routerLink="/settings"
|
||||
data-automation-id="settings">{{ 'APP_LAYOUT.SETTINGS'| translate }}
|
||||
</button>
|
||||
|
||||
</div>
|
||||
[successRoute]="'/home'"
|
||||
[showLoginActions]="false"
|
||||
[showRememberMe]="false"
|
||||
copyrightText="{{ 'application.copyright' | adfAppConfig }}">
|
||||
</adf-login>
|
||||
|
@@ -1,52 +1,6 @@
|
||||
.app-setting-button.mat-fab.mat-accent {
|
||||
.app-setting-button.mat-fab {
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 10px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.app-settings {
|
||||
border-radius: 8px;
|
||||
position: absolute;
|
||||
background-color: papayawhip;
|
||||
color: cadetblue;
|
||||
left: 10px;
|
||||
top: 10px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.app-toggle {
|
||||
width: auto;
|
||||
margin: 5px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.app-mobile-settings,
|
||||
.app-mobile-setting-button {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 959px) {
|
||||
.app-settings,
|
||||
.app-setting-button.mat-fab.mat-accent {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.app-mobile-settings,
|
||||
.app-mobile-setting-button {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.app-mobile-setting-button {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.app-mobile-settings {
|
||||
padding-bottom: 20px;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
.app-settings ::ng-deep .mat-slide-toggle-thumb-container {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
@@ -16,8 +16,6 @@
|
||||
*/
|
||||
|
||||
import { Component, ViewEncapsulation } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
import { LogService } from '@alfresco/adf-core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-login',
|
||||
@@ -26,51 +24,4 @@ import { LogService } from '@alfresco/adf-core';
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class LoginComponent {
|
||||
|
||||
customSuccessRouteURI = '/home';
|
||||
customLogoImageURL = './assets/images/alfresco-logo.svg';
|
||||
|
||||
disableCsrf = false;
|
||||
showFooter = true;
|
||||
showRememberMe = true;
|
||||
customSuccessRoute = false;
|
||||
customLogoImage = false;
|
||||
|
||||
constructor(private router: Router,
|
||||
private logService: LogService) {
|
||||
}
|
||||
|
||||
onLogin() {
|
||||
this.router.navigate(['/home']);
|
||||
}
|
||||
|
||||
onError(err: any) {
|
||||
this.logService.error(err);
|
||||
}
|
||||
|
||||
toggleCSRF() {
|
||||
this.disableCsrf = !this.disableCsrf;
|
||||
}
|
||||
|
||||
toggleFooter() {
|
||||
this.showFooter = !this.showFooter;
|
||||
}
|
||||
|
||||
toggleRememberMe() {
|
||||
this.showRememberMe = !this.showRememberMe;
|
||||
}
|
||||
|
||||
toggleSuccessRoute() {
|
||||
this.customSuccessRoute = !this.customSuccessRoute;
|
||||
if (!this.customSuccessRoute) {
|
||||
this.customSuccessRouteURI = null;
|
||||
}
|
||||
}
|
||||
|
||||
toggleLogo() {
|
||||
this.customLogoImage = !this.customLogoImage;
|
||||
if (!this.customLogoImage) {
|
||||
this.customLogoImageURL = null;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@@ -1,17 +1,15 @@
|
||||
<header class="app-logout-background">
|
||||
<div class="app-logout-section" data-automation-id="adf-logout-section">
|
||||
<div class="app-logout-headline">
|
||||
<h1 class="mat-h1">{{ 'APP.LOGOUT.TITLE' | translate}}</h1>
|
||||
<h2 class="mat-h2">{{ 'APP.LOGOUT.SUB_TITLE' | translate}}</h2>
|
||||
<h1 class="mat-h1">Logout Page</h1>
|
||||
<h2 class="mat-h2">You are now logged out</h2>
|
||||
</div>
|
||||
|
||||
<div class="app-logout-login">
|
||||
<a mat-raised-button color="primary" class="app-logout-docs-button"
|
||||
href="#/login">{{ 'APP.LOGOUT.LOGIN' | translate}}</a>
|
||||
<a mat-raised-button class="app-logout-docs-button" href="#/login">Login}</a>
|
||||
</div>
|
||||
<div class="app-logout-home">
|
||||
<a mat-raised-button color="primary" class="app-logout-docs-button"
|
||||
href="/">{{ 'APP.LOGOUT.HOME' | translate}}</a>
|
||||
<a mat-raised-button class="app-logout-docs-button" href="/">Home</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
@@ -1,89 +0,0 @@
|
||||
<div class="app-main-content">
|
||||
<h1>Notification Service</h1>
|
||||
|
||||
<ul>
|
||||
<li>Try setting custom message with unicode characters, for example: <strong>I ♥️ ADF</strong></li>
|
||||
<li>Try setting custom i18n resource key, for example: <strong>APP_LAYOUT.NOTIFICATIONS</strong></li>
|
||||
<li>Try setting a decorative icon, for example <strong>info</strong> or <strong>folder</strong></li>
|
||||
<li>Try toggling the action button. Clicking the action within SnackBar should update the label under the toggle button.</li>
|
||||
<li>All elements support <em>data-automation-id</em> attributes and can be automated.</li>
|
||||
</ul>
|
||||
|
||||
<div>
|
||||
<mat-label class="adf-label">Message:</mat-label>
|
||||
<mat-form-field>
|
||||
<input
|
||||
matInput
|
||||
placeholder="Message"
|
||||
[(ngModel)]="message"
|
||||
data-automation-id="notification-message">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-label class="adf-label">Decorative icon:</mat-label>
|
||||
<mat-form-field>
|
||||
<input
|
||||
matInput
|
||||
placeholder="Decorative Icon"
|
||||
[(ngModel)]="decorativeIcon"
|
||||
data-automation-id="notification-icon">
|
||||
</mat-form-field>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<mat-slide-toggle
|
||||
[(ngModel)]="withAction"
|
||||
data-automation-id="notification-action-toggle">
|
||||
With action
|
||||
</mat-slide-toggle>
|
||||
</div>
|
||||
|
||||
<div data-automation-id="notification-action-output" *ngIf="actionOutput">
|
||||
{{ actionOutput }}
|
||||
</div>
|
||||
|
||||
<h2>Custom Configuration</h2>
|
||||
|
||||
<form [formGroup]="configForm">
|
||||
<mat-form-field>
|
||||
<mat-select formControlName="direction" placeholder="Direction" data-automation-id="notification-direction">
|
||||
<mat-option *ngFor="let direction of directions" [value]="direction.value">
|
||||
{{ direction.title }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<input matInput type="number" formControlName="duration" [value]="defaultDuration" placeholder="Duration" data-automation-id="notification-duration">
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select formControlName="horizontalPosition" placeholder="Horizontal Position" data-automation-id="notification-horizontal-position">
|
||||
<mat-option *ngFor="let horizontalPosition of horizontalPositions" [value]="horizontalPosition.value">
|
||||
{{ horizontalPosition.title }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<mat-form-field>
|
||||
<mat-select formControlName="verticalPosition" placeholder="Vertical Position" data-automation-id="notification-vertical-position">
|
||||
<mat-option *ngFor="let verticalPosition of verticalPositions" [value]="verticalPosition.value">{{ verticalPosition.title }}</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<button mat-icon-button (click)="sendCustomConfig()" data-automation-id="notification-custom-config-button">
|
||||
<mat-icon>send</mat-icon>
|
||||
</button>
|
||||
<button mat-raised-button (click)="dismissSnackBar()" data-automation-id="notification-custom-dismiss-button" color="primary">
|
||||
</button>
|
||||
</form>
|
||||
<div>
|
||||
<h3>SnackBar Config</h3>
|
||||
<p *ngIf="snackBarConfigObject" data-automation-id="notification-custom-object">
|
||||
{{snackBarConfigObject}}
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3>Quick Messages</h3>
|
||||
<button mat-button color="primary" (click)="quickInfo()">Info</button>
|
||||
<button mat-button color="warn" (click)="quickError()">Error</button>
|
||||
<button mat-button color="accent" (click)="quickWarning()">Warning</button>
|
||||
</div>
|
||||
</div>
|
@@ -1,7 +0,0 @@
|
||||
.app-main-content {
|
||||
padding: 10px;
|
||||
|
||||
.adf-label {
|
||||
margin-right: 12px;
|
||||
}
|
||||
}
|
@@ -1,145 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, OnInit, OnDestroy } from '@angular/core';
|
||||
import { NotificationService } from '@alfresco/adf-core';
|
||||
import { MatSnackBarConfig } from '@angular/material/snack-bar';
|
||||
import { UntypedFormBuilder, UntypedFormGroup, UntypedFormControl } from '@angular/forms';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
|
||||
@Component({
|
||||
templateUrl: './notifications.component.html',
|
||||
styleUrls: ['./notifications.component.scss']
|
||||
})
|
||||
export class NotificationsComponent implements OnInit, OnDestroy {
|
||||
|
||||
message = 'I ♥️ ADF';
|
||||
decorativeIcon = '';
|
||||
withAction = false;
|
||||
actionOutput = '';
|
||||
snackBarConfigObject = '';
|
||||
|
||||
configForm: UntypedFormGroup;
|
||||
|
||||
snackBarConfig: MatSnackBarConfig = new MatSnackBarConfig();
|
||||
|
||||
directions = [
|
||||
{ value: 'ltr', title: 'Left to right' },
|
||||
{ value: 'rtl', title: 'Right to left' }
|
||||
];
|
||||
|
||||
horizontalPositions = [
|
||||
{ value: 'start', title: 'Start' },
|
||||
{ value: 'center', title: 'Center' },
|
||||
{ value: 'end', title: 'End' },
|
||||
{ value: 'left', title: 'Left' },
|
||||
{ value: 'right', title: 'Right' }
|
||||
];
|
||||
|
||||
verticalPositions = [
|
||||
{ value: 'top', title: 'Top' },
|
||||
{ value: 'bottom', title: 'Bottom' }
|
||||
];
|
||||
|
||||
defaultDuration = 20000;
|
||||
|
||||
private onDestroy$ = new Subject<boolean>();
|
||||
|
||||
constructor(private notificationService: NotificationService,
|
||||
private formBuilder: UntypedFormBuilder) {
|
||||
this.snackBarConfig.duration = this.defaultDuration;
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
this.configForm = this.formBuilder.group({
|
||||
direction: new UntypedFormControl(''),
|
||||
horizontalPosition: new UntypedFormControl(''),
|
||||
verticalPosition: new UntypedFormControl(''),
|
||||
duration: new UntypedFormControl('')
|
||||
});
|
||||
|
||||
this.configForm.valueChanges
|
||||
.pipe(takeUntil(this.onDestroy$))
|
||||
.subscribe(configFormValues =>
|
||||
this.setSnackBarConfig(configFormValues)
|
||||
);
|
||||
}
|
||||
|
||||
ngOnDestroy() {
|
||||
this.onDestroy$.next(true);
|
||||
this.onDestroy$.complete();
|
||||
}
|
||||
|
||||
setSnackBarConfig(configFormValues: any) {
|
||||
|
||||
if (configFormValues.announcementMessage) {
|
||||
this.snackBarConfig.announcementMessage = configFormValues.announcementMessage;
|
||||
}
|
||||
if (configFormValues.direction) {
|
||||
this.snackBarConfig.direction = configFormValues.direction;
|
||||
|
||||
}
|
||||
if (configFormValues.duration) {
|
||||
this.snackBarConfig.duration = configFormValues.duration;
|
||||
|
||||
}
|
||||
if (configFormValues.horizontalPosition) {
|
||||
this.snackBarConfig.horizontalPosition = configFormValues.horizontalPosition;
|
||||
}
|
||||
if (configFormValues.verticalPosition) {
|
||||
this.snackBarConfig.verticalPosition = configFormValues.verticalPosition;
|
||||
}
|
||||
}
|
||||
|
||||
sendCustomConfig() {
|
||||
this.actionOutput = '';
|
||||
this.snackBarConfigObject = `{"direction": "${this.snackBarConfig.direction}",
|
||||
"duration": "${this.snackBarConfig.duration}",
|
||||
"horizontalPosition": "${ this.snackBarConfig.horizontalPosition}",
|
||||
"verticalPosition": "${ this.snackBarConfig.verticalPosition}"}`;
|
||||
|
||||
this.snackBarConfig.data = { decorativeIcon: this.decorativeIcon };
|
||||
|
||||
if (this.message) {
|
||||
if (this.withAction) {
|
||||
this.notificationService
|
||||
.openSnackMessageAction(this.message, 'Some action', this.snackBarConfig)
|
||||
.onAction()
|
||||
.subscribe(() => this.actionOutput = 'Action clicked');
|
||||
} else {
|
||||
this.notificationService.openSnackMessage(this.message, this.snackBarConfig);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
dismissSnackBar() {
|
||||
this.notificationService.dismissSnackMessageAction();
|
||||
}
|
||||
|
||||
quickError() {
|
||||
this.notificationService.showError(this.message, 'Fix');
|
||||
}
|
||||
|
||||
quickInfo() {
|
||||
this.notificationService.showInfo(this.message, 'Agree');
|
||||
}
|
||||
|
||||
quickWarning() {
|
||||
this.notificationService.showWarning(this.message, 'Undo');
|
||||
}
|
||||
}
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { NotificationsComponent } from './notifications.component';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CoreModule } from '@alfresco/adf-core';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: NotificationsComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
CoreModule,
|
||||
RouterModule.forChild(routes),
|
||||
MatButtonModule
|
||||
],
|
||||
declarations: [NotificationsComponent]
|
||||
})
|
||||
export class AppNotificationsModule {}
|
@@ -1,22 +0,0 @@
|
||||
<h1>Overlay Viewer</h1>
|
||||
|
||||
<p class="toggle">
|
||||
<mat-slide-toggle
|
||||
id="adf-viewer-overlay"
|
||||
[color]="'primary'"
|
||||
(change)="toggleOverlay()"
|
||||
[checked]="isOverlay">
|
||||
Overlay
|
||||
</mat-slide-toggle>
|
||||
</p>
|
||||
|
||||
<adf-document-list
|
||||
currentFolderId="-my-"
|
||||
(preview)="showPreview($event)">
|
||||
</adf-document-list>
|
||||
|
||||
<adf-alfresco-viewer
|
||||
[(showViewer)]="showViewer"
|
||||
[overlayMode]="isOverlay"
|
||||
[nodeId]="nodeId">
|
||||
</adf-alfresco-viewer>
|
@@ -1,41 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component, Input } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
templateUrl: './overlay-viewer.component.html'
|
||||
})
|
||||
export class OverlayViewerComponent {
|
||||
|
||||
@Input()
|
||||
showViewer = false;
|
||||
|
||||
nodeId: string;
|
||||
isOverlay = true;
|
||||
|
||||
toggleOverlay() {
|
||||
this.isOverlay = !this.isOverlay;
|
||||
}
|
||||
|
||||
showPreview(event) {
|
||||
if (event.value.entry.isFile) {
|
||||
this.nodeId = event.value.entry.id;
|
||||
this.showViewer = true;
|
||||
}
|
||||
}
|
||||
}
|
@@ -1,109 +0,0 @@
|
||||
<h2>ADF Pipes</h2>
|
||||
|
||||
<mat-accordion>
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Localized dates
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
adfLocalizedDate
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Format" [(ngModel)]="format">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<mat-select placeholder="Locale dropdown" [(ngModel)]="locale">
|
||||
<mat-option *ngFor="let language of languages" [value]="language.key">
|
||||
{{language.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<h3>AdfLocalizedDate Pipe - Default</h3>
|
||||
<div>{{ today | adfLocalizedDate }} </div>
|
||||
<br>
|
||||
<h3>AdfLocalizedDate Pipe - Custom format</h3>
|
||||
<div>{{ today | adfLocalizedDate : format }} </div>
|
||||
<br>
|
||||
<h3>AdfLocalizedDate Pipe - Custom format and locale</h3>
|
||||
<div>{{ today | adfLocalizedDate : format : locale }} </div>
|
||||
</mat-expansion-panel>
|
||||
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Time ago
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
adfTimeAgo
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Format" [(ngModel)]="format">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<mat-select placeholder="Locale dropdown" [(ngModel)]="locale">
|
||||
<mat-option *ngFor="let language of languages" [value]="language.key">
|
||||
{{language.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
<h3>AdfTimeAgo Pipe - Default</h3>
|
||||
<div>{{ today | adfTimeAgo }} </div>
|
||||
<br>
|
||||
<h3>AdfTimeAgo Pipe - Custom locale</h3>
|
||||
<div>{{ today | adfTimeAgo : locale}} </div>
|
||||
</mat-expansion-panel>
|
||||
|
||||
<mat-expansion-panel>
|
||||
<mat-expansion-panel-header>
|
||||
<mat-panel-title>
|
||||
Decimal numbers
|
||||
</mat-panel-title>
|
||||
<mat-panel-description>
|
||||
adfDecimalNumber
|
||||
</mat-panel-description>
|
||||
</mat-expansion-panel-header>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Number" [(ngModel)]="numberValue">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Min Integer Digits" [(ngModel)]="decimalValues.minIntegerDigits">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Min Fraction Digits" [(ngModel)]="decimalValues.minFractionDigits">
|
||||
</mat-form-field>
|
||||
<mat-form-field class="app-input-field">
|
||||
<input matInput placeholder="Max Fraction Digits" [(ngModel)]="decimalValues.maxFractionDigits">
|
||||
</mat-form-field>
|
||||
|
||||
<mat-form-field class="app-input-field">
|
||||
<mat-select placeholder="Locale dropdown" [(ngModel)]="locale">
|
||||
<mat-option *ngFor="let language of languages" [value]="language.key">
|
||||
{{language.label}}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
||||
<h3>AdfDecimalNumber Pipe - Default</h3>
|
||||
<div>{{ numberValue | adfDecimalNumber }} </div>
|
||||
<br>
|
||||
<h3>AdfDecimalNumber Pipe - Custom digits config</h3>
|
||||
<div>{{ numberValue | adfDecimalNumber : decimalValues }} </div>
|
||||
<br>
|
||||
<h3>AdfDecimalNumber Pipe - Custom locale</h3>
|
||||
<div>{{ numberValue | adfDecimalNumber : null : locale }} </div>
|
||||
<br>
|
||||
<h3>AdfDecimalNumber Pipe - Custom digits config and locale</h3>
|
||||
<div>{{ numberValue | adfDecimalNumber : decimalValues : locale }} </div>
|
||||
<br>
|
||||
|
||||
</mat-expansion-panel>
|
||||
</mat-accordion>
|
@@ -1,7 +0,0 @@
|
||||
h2 {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.app-input-field {
|
||||
margin: 20px;
|
||||
}
|
@@ -1,42 +0,0 @@
|
||||
/*!
|
||||
* @license
|
||||
* Copyright © 2005-2023 Hyland Software, Inc. and its affiliates. All rights reserved.
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* http://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
|
||||
import { Component } from '@angular/core';
|
||||
import { AppConfigService } from '@alfresco/adf-core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-pipes-page',
|
||||
templateUrl: './pipes.component.html',
|
||||
styleUrls: ['./pipes.component.scss']
|
||||
})
|
||||
export class PipesComponent {
|
||||
|
||||
today = new Date();
|
||||
locale: string;
|
||||
format: string;
|
||||
numberValue = 12345.56;
|
||||
decimalValues = {
|
||||
minIntegerDigits: undefined,
|
||||
minFractionDigits: undefined,
|
||||
maxFractionDigits: undefined
|
||||
};
|
||||
languages: any[];
|
||||
|
||||
constructor(private appConfig: AppConfigService) {
|
||||
this.languages = this.appConfig.get('languages', []);
|
||||
}
|
||||
}
|
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user