TheDude
/
openproject
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[chore] add helper section for files tab

Browse Source 
- added to wp single view at split and show routes
pull/10411/head
Eric Schubert 3 years ago
parent 266a471483
commit c2c0ad46ea
No known key found for this signature in database
GPG Key ID: 1D346C019BD4BAA2
8 changed files with 158 additions and 121 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 3
      .editorconfig
  2. 1
      config/locales/js-en.yml
  3. 14
      frontend/src/app/features/work-packages/components/wp-single-view/wp-single-view.component.ts
  4. 42
      frontend/src/app/features/work-packages/components/wp-single-view/wp-single-view.html
  5. 2
      frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.component.ts
  6. 124
      frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html
  7. 84
      frontend/src/app/features/work-packages/routing/wp-split-view/wp-split-view.html
  8. 9
      frontend/src/global_styles/content/_attributes_group.sass

3
.editorconfig
Unescape View File

@ -291,9 +291,6 @@ ij_javascript_while_on_new_line = false
ij_javascript_wrap_comments = false
[{*.sht,*.html,*.shtm,*.shtml,*.htm,*.ng}]
indent_size = 2
tab_width = 2
ij_continuation_indent_size = 2
ij_html_add_new_line_before_tags = body,div,p,form,h1,h2,h3
ij_html_align_attributes = true
ij_html_align_text = false

1
config/locales/js-en.yml
Unescape View File

@ -1073,6 +1073,7 @@ en:
relations: Relations
watchers: Watchers
files: Files
files_tab_migration_help: 'You can now attach files to work packages via the new tab:'
time_relative:
days: "days"
weeks: "weeks"

14
frontend/src/app/features/work-packages/components/wp-single-view/wp-single-view.component.ts
Unescape View File

@ -35,6 +35,7 @@ import {
Input,
OnInit,
} from '@angular/core';
import { StateService } from '@uirouter/core';
import { I18nService } from 'core-app/core/i18n/i18n.service';
import { PathHelperService } from 'core-app/core/path-helper/path-helper.service';
import { distinctUntilChanged, map } from 'rxjs/operators';
@ -114,6 +115,10 @@ export class WorkPackageSingleViewComponent extends UntilDestroyedMixin implemen
attachments: {
label: this.I18n.t('js.label_attachments'),
},
files: {
label: this.I18n.t('js.work_packages.tabs.files'),
migration_help: this.I18n.t('js.work_packages.tabs.files_tab_migration_help'),
},
project: {
required: this.I18n.t('js.project.required_outside_context'),
context: this.I18n.t('js.project.context'),
@ -131,6 +136,8 @@ export class WorkPackageSingleViewComponent extends UntilDestroyedMixin implemen
public isNewResource:boolean;
public uiSelfRef:string;
protected firstTimeFocused = false;
$element:JQuery;
@ -138,6 +145,7 @@ export class WorkPackageSingleViewComponent extends UntilDestroyedMixin implemen
constructor(readonly I18n:I18nService,
protected currentProject:CurrentProjectService,
protected PathHelper:PathHelperService,
protected $state:StateService,
protected states:States,
protected halEditing:HalResourceEditingService,
protected halResourceService:HalResourceService,
@ -151,11 +159,13 @@ export class WorkPackageSingleViewComponent extends UntilDestroyedMixin implemen
super();
}
public ngOnInit() {
public ngOnInit():void {
this.$element = jQuery(this.elementRef.nativeElement as HTMLElement);
this.isNewResource = isNewResource(this.workPackage);
this.uiSelfRef = this.$state.$current.name;
const change = this.halEditing.changeFor<WorkPackageResource, WorkPackageChangeset>(this.workPackage);
this.resourceContextChange.next(this.contextFrom(change.projectedResource));
this.refresh(change);
@ -368,7 +378,7 @@ export class WorkPackageSingleViewComponent extends UntilDestroyedMixin implemen
private contextFrom(workPackage:WorkPackageResource):ResourceContextChange {
const schema = this.schema(workPackage);
let schemaHref:string|null = null;
let schemaHref:string|null;
const projectHref:string|null = workPackage.project && workPackage.project.href;
if (schema.baseSchema) {

42
frontend/src/app/features/work-packages/components/wp-single-view/wp-single-view.html
Unescape View File

@ -5,8 +5,8 @@
<div class="wp-new--subject-wrapper"
*ngIf="isNewResource">
<editable-attribute-field [resource]="workPackage"
[wrapperClasses]="'-no-label'"
[fieldName]="'subject'"></editable-attribute-field>
[wrapperClasses]="'-no-label'"
[fieldName]="'subject'"></editable-attribute-field>
</div>
<div class="wp-info-wrapper">
@ -25,11 +25,13 @@
because otherwise the browser would add a second space after it -->
<span>&nbsp;</span>
<op-user-link class="user-link"
[user]="workPackage.author"></op-user-link>.
[user]="workPackage.author"></op-user-link>
.
<span [textContent]="text.infoRow.lastUpdatedOn"></span>
<span>&nbsp;</span>
<op-date-time [dateTimeValue]="workPackage.updatedAt"></op-date-time>.
</div>
<op-date-time [dateTimeValue]="workPackage.updatedAt"></op-date-time>
.
</div>
<wp-custom-actions [workPackage]="workPackage" class="custom-actions"></wp-custom-actions>
</div>
@ -53,7 +55,7 @@
</div>
<div class="attributes-key-value--value-container">
<editable-attribute-field [resource]="workPackage"
[fieldName]="descriptor.name"></editable-attribute-field>
[fieldName]="descriptor.name"></editable-attribute-field>
</div>
</div>
</div>
@ -84,9 +86,9 @@
<div class="attributes-group description-group">
<div class="single-attribute work-packages--details--description">
<editable-attribute-field [fieldName]="'description'"
[resource]="workPackage"
[isDropTarget]="true"
[wrapperClasses]="'-no-label'">
[resource]="workPackage"
[isDropTarget]="true"
[wrapperClasses]="'-no-label'">
</editable-attribute-field>
</div>
</div>
@ -102,7 +104,7 @@
<ndc-dynamic [ndcDynamicComponent]="attributeGroupComponent(group)"
[ndcDynamicInputs]="{ workPackage: workPackage,
group: group,
query: group.query }" >
query: group.query }">
</ndc-dynamic>
</ng-container>
@ -140,3 +142,23 @@
</ndc-dynamic>
</div>
</div>
<div class="work-packages--files attributes-group" *ngIf="!isNewResource">
<div class="work-packages--files-container">
<div class="attributes-group--header">
<div class="attributes-group--header-container">
<h3 class="attributes-group--header-text" [textContent]="text.files.label"></h3>
</div>
</div>
<div class="attributes-group--icon-indented-text">
<op-icon icon-classes="icon-info1"></op-icon>
<span [textContent]="text.files.migration_help"></span>
<a
[textContent]="text.files.label"
[uiSref]="uiSelfRef"
[uiParams]="{ workPackageId: workPackage.id, tabIdentifier: 'files' }"
></a>
</div>
</div>
</div>

2
frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.component.ts
Unescape View File

@ -29,7 +29,7 @@
import { WorkPackageResource } from 'core-app/features/hal/resources/work-package-resource';
import { StateService } from '@uirouter/core';
import { Component, Injector, OnInit } from '@angular/core';
import { Observable, of } from 'rxjs';
import { of } from 'rxjs';
import { WorkPackageViewSelectionService } from 'core-app/features/work-packages/routing/wp-view-base/view-services/wp-view-selection.service';
import { WorkPackageSingleViewBase } from 'core-app/features/work-packages/routing/wp-view-base/work-package-single-view.base';
import { HalResourceNotificationService } from 'core-app/features/hal/services/hal-resource-notification.service';

124
frontend/src/app/features/work-packages/routing/wp-full-view/wp-full-view.html
Unescape View File

@ -3,78 +3,78 @@
*ngIf="workPackage"
class="work-packages--show-view">
<wp-breadcrumb [workPackage]="workPackage"></wp-breadcrumb>
<wp-breadcrumb [workPackage]="workPackage"></wp-breadcrumb>
<div class="toolbar-container">
<div id="toolbar">
<div class="wp-show--header-container">
<div class="toolbar-container">
<div id="toolbar">
<div class="wp-show--header-container">
<op-back-button
linkClass="work-packages-back-button op-back-button_mobile-full-width"
>
</op-back-button>
<op-back-button
linkClass="work-packages-back-button op-back-button_mobile-full-width"
>
</op-back-button>
<div class="subject-header">
<wp-subject></wp-subject>
</div>
<div class="subject-header">
<wp-subject></wp-subject>
</div>
<ul id="toolbar-items" class="toolbar-items hide-when-print">
<li class="toolbar-item hidden-for-mobile">
<wp-create-button
[allowed]="['work_package.addChild', 'work_package.copy']"
[stateName$]="stateName$">
</wp-create-button>
</li>
<li class="toolbar-item" *ngIf="displayWatchButton">
<wp-watcher-button [workPackage]="workPackage"
[showText]="false">
</wp-watcher-button>
</li>
<li class="toolbar-item hidden-for-mobile">
<zen-mode-toggle-button>
</zen-mode-toggle-button>
</li>
<li class="toolbar-item action_menu_main" id="action-show-more-dropdown-menu">
<button class="button dropdown-relative toolbar-icon"
[attr.title]="text.full_view.button_more"
wpSingleContextMenu
[wpSingleContextMenu-workPackage]="workPackage">
<op-icon icon-classes="button--icon icon-show-more"></op-icon>
</button>
</li>
</ul>
</div>
<ul id="toolbar-items" class="toolbar-items hide-when-print">
<li class="toolbar-item hidden-for-mobile">
<wp-create-button
[allowed]="['work_package.addChild', 'work_package.copy']"
[stateName$]="stateName$">
</wp-create-button>
</li>
<li class="toolbar-item" *ngIf="displayWatchButton">
<wp-watcher-button [workPackage]="workPackage"
[showText]="false">
</wp-watcher-button>
</li>
<li class="toolbar-item hidden-for-mobile">
<zen-mode-toggle-button>
</zen-mode-toggle-button>
</li>
<li class="toolbar-item action_menu_main" id="action-show-more-dropdown-menu">
<button class="button dropdown-relative toolbar-icon"
[attr.title]="text.full_view.button_more"
wpSingleContextMenu
[wpSingleContextMenu-workPackage]="workPackage">
<op-icon icon-classes="button--icon icon-show-more"></op-icon>
</button>
</li>
</ul>
</div>
</div>
<div class="work-packages-full-view--split-container">
<div class="work-packages-full-view--split-left">
<div class="work-packages--panel-inner">
<wp-single-view [workPackage]="workPackage"></wp-single-view>
</div>
<div class="work-packages-full-view--split-container">
<div class="work-packages-full-view--split-left">
<div class="work-packages--panel-inner">
<wp-single-view [workPackage]="workPackage"></wp-single-view>
</div>
<div class="work-packages-full-view--split-right work-packages-tab-view--overflow">
<div class="work-packages--panel-inner">
<span class="hidden-for-sighted" tabindex="-1" opAutofocus [textContent]="focusAnchorLabel"></span>
<op-wp-tabs [workPackage]="workPackage" view="full"></op-wp-tabs>
<div class="work-packages-full-view--tab-breadcrumb">
<op-work-package-mark-notification-button
*ngIf="(displayNotificationsButton$ | async) && keepTab.currentTabIdentifier === 'activity'"
class="work-package--details-button"
[workPackage]="workPackage"
buttonClasses="-round button_no-margin"
data-qa-selector="mark-notification-read-button"
></op-work-package-mark-notification-button>
</div>
<div class="tabcontent"
data-notification-selector='notification-scroll-container'
ui-view>
</div>
</div>
<div class="work-packages-full-view--split-right work-packages-tab-view--overflow">
<div class="work-packages--panel-inner">
<span class="hidden-for-sighted" tabindex="-1" opAutofocus [textContent]="focusAnchorLabel"></span>
<op-wp-tabs [workPackage]="workPackage" [view]="'full'"></op-wp-tabs>
<div class="work-packages-full-view--tab-breadcrumb">
<op-work-package-mark-notification-button
*ngIf="(displayNotificationsButton$ | async) && keepTab.currentTabIdentifier === 'activity'"
class="work-package--details-button"
[workPackage]="workPackage"
buttonClasses="-round button_no-margin"
data-qa-selector="mark-notification-read-button"
></op-work-package-mark-notification-button>
</div>
<div class="work-packages-full-view--resizer hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="'work-packages-full-view--split-right'"
[localStorageKey]="'openProject-fullViewFlexBasis'"></wp-resizer>
<div class="tabcontent"
data-notification-selector='notification-scroll-container'
ui-view>
</div>
</div>
<div class="work-packages-full-view--resizer hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="'work-packages-full-view--split-right'"
[localStorageKey]="'openProject-fullViewFlexBasis'"></wp-resizer>
</div>
</div>
</div>
</div>

84
frontend/src/app/features/work-packages/routing/wp-split-view/wp-split-view.html
Unescape View File

@ -3,8 +3,8 @@
data-indicator-name="wpDetails"
*ngIf="workPackage"
>
<op-wp-tabs [workPackage]="workPackage" view="split"></op-wp-tabs>
<div class="work-packages--details-content work-packages-tab-view--overflow" *ngIf="workPackage">
<op-wp-tabs [workPackage]="workPackage" [view]="'split'"></op-wp-tabs>
<div class="work-packages--details-content work-packages-tab-view--overflow" *ngIf="workPackage">
<span
class="hidden-for-sighted"
tabindex="-1"
@ -12,51 +12,51 @@
[textContent]="focusAnchorLabel"
></span>
<edit-form
[resource]="workPackage"
class="work-packages--details-form"
>
<div class="work-packages--details-header">
<div class="work-packages--details-header-left">
<wp-breadcrumb
[workPackage]="workPackage"
class="work-packages--breadcrumb"
></wp-breadcrumb>
<edit-form
[resource]="workPackage"
class="work-packages--details-form"
>
<div class="work-packages--details-header">
<div class="work-packages--details-header-left">
<wp-breadcrumb
[workPackage]="workPackage"
class="work-packages--breadcrumb"
></wp-breadcrumb>
<div class="wp-show--header-container">
<op-back-button
*ngIf="showBackButton()"
linkClass="work-packages-back-button"
[customBackMethod]="backToList.bind(this)"
></op-back-button>
<div class="wp-show--header-container">
<op-back-button
*ngIf="showBackButton()"
linkClass="work-packages-back-button"
[customBackMethod]="backToList.bind(this)"
></op-back-button>
<wp-subject class="subject-header"></wp-subject>
</div>
<wp-subject class="subject-header"></wp-subject>
</div>
<op-work-package-mark-notification-button
*ngIf="(displayNotificationsButton$ | async) && keepTab.currentTabIdentifier === 'activity'"
class="work-packages--details-button"
[workPackage]="workPackage"
buttonClasses="-round"
data-qa-selector="mark-notification-read-button"
></op-work-package-mark-notification-button>
</div>
<div
class="work-package-details-tab"
data-notification-selector='notification-scroll-container'
ui-view
></div>
</edit-form>
</div>
<op-work-package-mark-notification-button
*ngIf="(displayNotificationsButton$ | async) && keepTab.currentTabIdentifier === 'activity'"
class="work-packages--details-button"
[workPackage]="workPackage"
buttonClasses="-round"
data-qa-selector="mark-notification-read-button"
></op-work-package-mark-notification-button>
</div>
<div
class="work-package-details-tab"
data-notification-selector='notification-scroll-container'
ui-view
></div>
</edit-form>
</div>
<div class="work-packages--details-toolbar-container" *ngIf="workPackage">
<wp-details-toolbar [workPackage]="workPackage"></wp-details-toolbar>
</div>
<div class="work-packages--details-toolbar-container" *ngIf="workPackage">
<wp-details-toolbar [workPackage]="workPackage"></wp-details-toolbar>
</div>
<div class="work-packages--details--resizer hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="'work-packages-partitioned-page--content-right'"
[localStorageKey]="'openProject-splitViewFlexBasis'"></wp-resizer>
</div>
<div class="work-packages--details--resizer hidden-for-mobile hide-when-print">
<wp-resizer [elementClass]="'work-packages-partitioned-page--content-right'"
[localStorageKey]="'openProject-splitViewFlexBasis'"></wp-resizer>
</div>
</div>

9
frontend/src/global_styles/content/_attributes_group.sass
Unescape View File

@ -33,7 +33,7 @@
.attributes-group--header
@include grid-block
margin: 0 0 0.5rem 0
margin: 0 0 0.5rem 0
border-bottom: 1px solid #ddd
align-items: flex-end
@ -61,6 +61,13 @@
.button
margin: 0 0 8px 0
.attributes-group--icon-indented-text
display: grid
margin-top: 1rem
grid-template-columns: auto auto 1fr
column-gap: 8px
// HACK. TODO: Remove H3 element rules in various places.
.attributes-group--header-text,
#content h3.attributes-group--header-text

Write Preview
Loading…
Cancel
Save