Let BCF list container inherit from the list view to avoid unnecessary multiple loading. Also move the resizer directly to the WP grid.

pull/8143/head
Henriette Dinger 5 years ago
parent d4c97b5197
commit ef2a3eadff
  1. 3
      app/assets/stylesheets/layout/work_packages/_table_embedded.sass
  2. 9
      frontend/src/app/components/wp-grid/wp-grid.component.ts
  3. 3
      frontend/src/app/components/wp-table/embedded/wp-embedded-table.component.ts
  4. 9
      frontend/src/app/components/wp-table/embedded/wp-embedded-table.html
  5. 7
      frontend/src/app/modules/bim/ifc_models/bcf/list-container/bcf-list-container.component.html
  6. 99
      frontend/src/app/modules/bim/ifc_models/bcf/list-container/bcf-list-container.component.ts
  7. 1
      frontend/src/app/modules/work_packages/openproject-work-packages.module.ts
  8. 9
      frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.html
  9. 3
      frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.sass
  10. 11
      frontend/src/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.ts

@ -70,9 +70,6 @@ $table-timeline--compact-row-height: 28px
.wp-cards-container.-horizontal
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr))
&.-with-resizer
padding-left: 10px
&.-compact-tables
.wp-table--row
border-bottom: none !important

@ -52,6 +52,12 @@ import {WorkPackageTableConfiguration} from "core-components/wp-table/wp-table-c
[showInfoButton]="true"
[shrinkOnMobile]="true">
</wp-card-view>
<div *ngIf="showResizer"
class="hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="resizerClass"
[localStorageKey]="resizerStorageKey"></wp-resizer>
</div>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
providers: [
@ -61,6 +67,9 @@ import {WorkPackageTableConfiguration} from "core-components/wp-table/wp-table-c
})
export class WorkPackagesGridComponent {
@Input() public configuration:WorkPackageTableConfiguration;
@Input() public showResizer:boolean = false;
@Input() public resizerClass:string = '';
@Input() public resizerStorageKey:string = '';
public canDragOutOf:() => boolean;
public dragInto:boolean;

@ -22,9 +22,6 @@ export class WorkPackageEmbeddedTableComponent extends WorkPackageEmbeddedBaseCo
@Input('queryProps') public queryProps:any = {};
@Input() public tableActions:OpTableActionFactory[] = [];
@Input() public externalHeight:boolean = false;
@Input() public showResizer:boolean = false;
@Input() public resizerClass:string = '';
@Input() public resizerStorageKey:string = '';
/** Inform about loading errors */
@Output() public onError = new EventEmitter<string>();

@ -19,17 +19,10 @@
class="work-packages-split-view--tabletimeline-content"></wp-table>
<!-- GRID representation of the WP -->
<div class="work-packages-embedded-view--grid-view"
[ngClass]="{ '-with-resizer': showResizer }" >
<div class="work-packages-embedded-view--grid-view" >
<wp-grid *ngIf="configuration.isCardView"
[configuration]="configuration">
</wp-grid>
<div *ngIf="showResizer"
class="hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="resizerClass"
[localStorageKey]="resizerStorageKey"></wp-resizer>
</div>
</div>
<!-- Footer -->

@ -1,7 +0,0 @@
<wp-embedded-table [queryProps]="queryProps"
[configuration]="configuration"
[externalHeight]="true"
[showResizer]="true"
resizerClass="work-packages-partitioned-page--content-right"
resizerStorageKey="openProject-splitViewFlexBasis">
</wp-embedded-table>

@ -1,89 +1,34 @@
import {ChangeDetectionStrategy, ChangeDetectorRef, Component, Injector, OnDestroy, OnInit} from "@angular/core";
import {I18nService} from "core-app/modules/common/i18n/i18n.service";
import {PathHelperService} from "core-app/modules/common/path-helper/path-helper.service";
import {CurrentProjectService} from "core-components/projects/current-project.service";
import {WorkPackageTableConfigurationObject} from "core-components/wp-table/wp-table-configuration";
import {StateService} from '@uirouter/core';
import {GonService} from "core-app/modules/common/gon/gon.service";
import {QueryParamListenerService} from "core-components/wp-query/query-param-listener.service";
import {InjectField} from "core-app/helpers/angular/inject-field.decorator";
import {WorkPackagesListService} from "core-components/wp-list/wp-list.service";
import {UrlParamsHelperService} from "core-components/wp-query/url-params-helper";
import {ChangeDetectionStrategy, Component, OnInit} from "@angular/core";
import {WorkPackageViewHandlerToken} from "core-app/modules/work_packages/routing/wp-view-base/event-handling/event-handler-registry";
import {BcfCardViewHandlerRegistry} from "core-app/modules/bim/ifc_models/ifc-base-view/event-handler/bcf-card-view-handler-registry";
import {UntilDestroyedMixin} from "core-app/helpers/angular/until-destroyed.mixin";
import {WorkPackageListViewComponent} from "core-app/modules/work_packages/routing/wp-list-view/wp-list-view.component";
import {QueryResource} from "core-app/modules/hal/resources/query-resource";
import {HalResourceNotificationService} from "core-app/modules/hal/services/hal-resource-notification.service";
import {WorkPackageNotificationService} from "core-app/modules/work_packages/notifications/work-package-notification.service";
import {DragAndDropService} from "core-app/modules/common/drag-and-drop/drag-and-drop.service";
import {CausedUpdatesService} from "core-app/modules/boards/board/caused-updates/caused-updates.service";
import {bimSplitViewIdentifier, BimViewService} from "core-app/modules/bim/ifc_models/pages/viewer/bim-view.service";
import {InjectField} from "core-app/helpers/angular/inject-field.decorator";
@Component({
templateUrl: './bcf-list-container.component.html',
templateUrl: '/app/modules/work_packages/routing/wp-list-view/wp-list-view.component.html',
styleUrls: ['../../../../../../app/modules/work_packages/routing/wp-list-view/wp-list-view.component.sass'],
providers: [
{ provide: WorkPackageViewHandlerToken, useValue: BcfCardViewHandlerRegistry }
{ provide: WorkPackageViewHandlerToken, useValue: BcfCardViewHandlerRegistry },
{ provide: HalResourceNotificationService, useClass: WorkPackageNotificationService },
DragAndDropService,
CausedUpdatesService
],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class BcfListContainerComponent extends UntilDestroyedMixin implements OnInit, OnDestroy {
@InjectField() public queryParamListener:QueryParamListenerService;
@InjectField() public wpListService:WorkPackagesListService;
@InjectField() public urlParamsHelper:UrlParamsHelperService;
public queryProps:{ [key:string]:any };
public configuration:WorkPackageTableConfigurationObject = {
actionsColumnEnabled: false,
columnMenuEnabled: false,
contextMenuEnabled: false,
inlineCreateEnabled: false,
withFilters: false,
showFilterButton: false,
isCardView: true
};
constructor(readonly state:StateService,
readonly i18n:I18nService,
readonly paths:PathHelperService,
readonly currentProject:CurrentProjectService,
readonly gon:GonService,
readonly injector:Injector,
readonly cdRef:ChangeDetectorRef) {
super();
}
ngOnInit():void {
this.refresh();
this.queryParamListener
.observe$
.pipe(
this.untilDestroyed()
).subscribe((queryProps) => {
this.refresh(this.urlParamsHelper.buildV3GetQueryFromJsonParams(queryProps));
});
}
ngOnDestroy():void {
super.ngOnDestroy();
this.queryParamListener.removeQueryChangeListener();
}
private defaultQueryProps() {
let filters = [];
filters.push({
status: {
operator: 'o',
values: []
}
});
return {
'columns[]': ['id', 'subject'],
filters: JSON.stringify(filters),
sortBy: JSON.stringify([['updatedAt', 'desc']]),
showHierarchies: false
};
export class BcfListContainerComponent extends WorkPackageListViewComponent implements OnInit {
protected shouldShowAsListView(query:QueryResource):boolean {
return false;
}
public refresh(queryProps:{ [key:string]:any }|undefined = undefined) {
this.wpListService.loadCurrentQueryFromParams(this.currentProject.identifier!);
this.queryProps = queryProps || this.state.params.query_props || this.defaultQueryProps();
this.cdRef.detectChanges();
protected showResizerInCardView():boolean {
// TODO
//return this.bimView.currentViewerState() !== bimSplitViewIdentifier;
return true;
}
}

@ -405,6 +405,7 @@ import {WorkPackageCreateComponent} from "core-components/wp-new/wp-create.compo
WorkPackageSubjectComponent,
WorkPackageWatchersCountComponent,
WorkPackageRelationsCountComponent,
WorkPackagesGridComponent,
// Modals
WpTableConfigurationModalComponent,

@ -9,8 +9,13 @@
<!-- GRID representation of the WP -->
<div *ngIf="!showListView"
class="work-packages--card-view-container">
<wp-grid [configuration]="wpTableConfiguration"></wp-grid>
class="work-packages--card-view-container"
[ngClass]="{ '-with-resizer': showResizerInCardView() }" >
<wp-grid [configuration]="wpTableConfiguration"
[showResizer]="showResizerInCardView()"
resizerClass="work-packages-partitioned-page--content-right"
resizerStorageKey="openProject-splitViewFlexBasis">
</wp-grid>
</div>
<!-- Footer -->

@ -11,6 +11,9 @@
padding-bottom: 5px
@include styled-scroll-bar
&.-with-resizer
padding-left: 10px
@media screen and (max-width: 659px)
// Ensure the WP cards span the complete width on mobile
// --> Move scrollbar out of visible area

@ -43,6 +43,7 @@ import {DeviceService} from "core-app/modules/common/browser/device.service";
import {CurrentProjectService} from "core-components/projects/current-project.service";
import {WorkPackageViewFiltersService} from "core-app/modules/work_packages/routing/wp-view-base/view-services/wp-view-filters.service";
import {UntilDestroyedMixin} from "core-app/helpers/angular/until-destroyed.mixin";
import {QueryResource} from "core-app/modules/hal/resources/query-resource";
@Component({
selector: 'wp-list-view',
@ -96,7 +97,7 @@ export class WorkPackageListViewComponent extends UntilDestroyedMixin implements
this.untilDestroyed()
).subscribe((query) => {
// Update the visible representation
this.showListView = !(this.deviceService.isMobile || this.wpDisplayRepresentation.valueFromQuery(query) === wpDisplayCardRepresentation);
this.showListView = this.shouldShowAsListView(query);
this.cdRef.detectChanges();
});
}
@ -113,4 +114,12 @@ export class WorkPackageListViewComponent extends UntilDestroyedMixin implements
});
}
protected shouldShowAsListView(query:QueryResource):boolean {
return !(this.deviceService.isMobile || this.wpDisplayRepresentation.valueFromQuery(query) === wpDisplayCardRepresentation);
}
protected showResizerInCardView():boolean {
return false;
}
}

Loading…
Cancel
Save