Skip to content

Commit

Permalink
primeng: fix PO issue
Browse files Browse the repository at this point in the history 
* Uses the same color, logo and input size for public and professional headers.
* Uniformize the title tags in the detailed views.
* Fixes the user menu links.

Co-Authored-by: Johnny Mariéthoz <[email protected]>
Co-Authored-by: Bertrand Zuchuat <[email protected]>

Signed-off-by: Johnny Mariéthoz <[email protected]>
  • Loading branch information
@jma
jma committed Feb 12, 2025
1 parent ace640b commit 0a53d04
Show file tree
Hide file tree
Showing 27 changed files with 194 additions and 220 deletions.
32 changes: 5 additions & 27 deletions projects/admin/src/app/acquisition/api/acq-order-api.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,9 +18,9 @@
import { HttpClient } from '@angular/common/http';
import { inject, Injectable } from '@angular/core';
import { IPreview } from '@app/admin/shared/preview-email/IPreviewInterface';
import { ApiService, Record, RecordService, RecordUiService } from '@rero/ng-core';
import { Record, RecordService, RecordUiService } from '@rero/ng-core';
import { BaseApi } from '@rero/shared';
import { BehaviorSubject, Observable, Subject } from 'rxjs';
import { Observable, Subject } from 'rxjs';
import { map } from 'rxjs/operators';
import { Notification } from '../../classes/notification';
import {
Expand All @@ -40,7 +40,6 @@ export class AcqOrderApiService extends BaseApi {
private httpClient: HttpClient = inject(HttpClient);
private recordService: RecordService = inject(RecordService);
private recordUiService: RecordUiService = inject(RecordUiService);
private apiService: ApiService = inject(ApiService);

// SERVICES ATTRIBUTES ======================================================
/** Default values */
Expand All @@ -59,9 +58,6 @@ export class AcqOrderApiService extends BaseApi {
notes: []
};

/** History of an acquisition order */
private _acqOrderHistory: AcqOrderHistoryVersionResponseInterface[] = [];
public acqOrderHistorySubject: BehaviorSubject<AcqOrderHistoryVersionResponseInterface[]> = new BehaviorSubject(this._acqOrderHistory);

/** Subject emitted when an order line is deleted. The order line pid will be emitted */
private _deletedOrderLineSubject$: Subject<IAcqOrderLine> = new Subject();
Expand Down Expand Up @@ -104,27 +100,9 @@ export class AcqOrderApiService extends BaseApi {
}

getOrderHistory(orderPid: string) {
// check if orderPid is already present into the previously loaded history items.
// If YES :: not needed to reload the history, just update the `current` attribute of history items
const orderRef = new URL(this.apiService.getRefEndpoint('acq_orders', orderPid));
const idx = this._acqOrderHistory.findIndex(item => item.$ref === orderRef.toString());
if (idx !== -1) {
if (!this._acqOrderHistory[idx].current) {
this._acqOrderHistory.map(version => version.current = false);
this._acqOrderHistory[idx].current = true;
this.acqOrderHistorySubject.next(this._acqOrderHistory);
}
} else {
// If NO :: Load the acquisition order history
const apiUrl = `/api/acq_order/${orderPid}/history`;
this.httpClient
.get<AcqOrderHistoryVersionResponseInterface[]>(apiUrl)
.subscribe(versions => {
versions.map(version => version.current = version.$ref === orderRef.toString());
this._acqOrderHistory = versions;
this.acqOrderHistorySubject.next(this._acqOrderHistory);
});
}
const apiUrl = `/api/acq_order/${orderPid}/history`;
return this.httpClient
.get<AcqOrderHistoryVersionResponseInterface[]>(apiUrl);
}

// ORDER LINES RELATED METHODS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Expand Down
2 changes: 1 addition & 1 deletion ...app/acquisition/components/account/account-detail-view/account-detail-view.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
-->
@if (organisation && esRecord$ | async; as account) {
<!-- ROLLOVER INFO -->
@if (account.is_active) {
@if (!account.is_active) {
<p-messages
[value]="[{ severity: 'warn', detail: 'Fiscal year closed' | translate }]"
[closable]="false"
Expand Down
1 change: 0 additions & 1 deletion projects/admin/src/app/acquisition/components/account/account-list/account-list.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -113,7 +113,6 @@ export class AccountListComponent implements OnInit {
// COMPONENT FUNCTIONS ========================================================
/** Operations to do when an account is deleted */
accountDelete(node): void {
console.log(node);
this.acqAccountApiService
.delete(node.node.data.pid)
.pipe(
Expand Down
4 changes: 2 additions & 2 deletions ...min/src/app/acquisition/components/order/order-brief-view/order-brief-view.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
-->
@if (order) {
<article class="grid align-items-top">
<div class="col-9">
<div class="col-12 lg:col-9">
<h5><a [routerLink]="[detailUrl.link]">{{ order.reference }}</a></h5>
<ng-container *ngVar="order.notes | notesFilter: [noteType.STAFF_NOTE] as notes">
@if (notes.length > 0) {
Expand All @@ -44,7 +44,7 @@ <h5><a [routerLink]="[detailUrl.link]">{{ order.reference }}</a></h5>
]
</span>
</div>
<div class="col-3 flex flex-column gap-1">
<div class="col-12 lg:col-3 flex flex-column gap-1">
@if (displayProvisionalAccountingData) {
<div class="flex">
<label class="w-8 text-center surface-border border-1 p-2 surface-100 border-round-left font-bold">{{ order.account_statement.provisional.total_amount | currency : order.currency }}</label>
Expand Down
121 changes: 57 additions & 64 deletions ...n/src/app/acquisition/components/order/order-detail-view/order-detail-view.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,29 +20,30 @@
<div [ngClass]="{ 'opacity-50': !order.is_current_budget }">
<!-- ROLLOVER INFO -->
@if (!order.is_current_budget) {
<p-messages
[value]="[{ severity: 'warn', detail: 'Fiscal year closed' | translate }]"
[closable]="false"
[enableService]="false"
showTransitionOptions="0ms"
/>
<p-messages
[value]="[{ severity: 'warn', detail: 'Fiscal year closed' | translate }]"
[closable]="false"
[enableService]="false"
showTransitionOptions="0ms"
/>
}

<!-- Place order button -->
<div class="flex gap-2 justify-content-between flex-wrap">
<h1>{{ order.reference }}</h1>
@if (order?.is_current_budget && order?.pid) { @if (recordPermissions &&
recordPermissions.update.can && order.status === acqOrderStatus.PENDING) {
<section class="flex justify-content-end">
<p-button
(onClick)="placeOrderDialog()"
severity="primary"
[disabled]="!canPlaceOrder"
icon="fa fa-shopping-cart"
[label]="'Place order' | translate"
/>
</section>
} }
@if (order?.is_current_budget && order?.pid) {
@if (recordPermissions && recordPermissions.update.can && order.status === acqOrderStatus.PENDING) {
<section class="flex justify-content-end">
<p-button
(onClick)="placeOrderDialog()"
severity="primary"
[disabled]="!canPlaceOrder"
icon="fa fa-shopping-cart"
[label]="'Place order' | translate"
/>
</section>
}
}
</div>
<!-- ORDER SUMMARY -->
<admin-order-summary [order]="order">
Expand All @@ -61,72 +62,64 @@ <h1>{{ order.reference }}</h1>
</admin-order-summary>

<p-tabView [activeIndex]="tabActiveIndex" (activeIndexChange)="addTabToUrl($event)">
<p-tabPanel [header]="'Order' | translate" #orderPanel>
<p-tabPanel #orderPanel [header]="'Order' | translate">
<!--- TODO: change this for the next primeng version (19)-->
@if(orderPanel.selected) {
<div class="flex flex-column gap-2">
<!-- ORDER LINES -->
@if (isPermissionsLoaded) {
<admin-order-lines
[order]="order"
[recordPermissions]="recordPermissions"
/>
}
<!-- ORDER NOTES -->
@if (order.notes && order.notes.length > 0) {
<p-panel>
<ng-template pTemplate="header">
<div class="flex gap-2 align-items-center">
<shared-open-close-button (status)="notesCollapsed = $event" />
<h5 class="m-0">
{{
order.notes.length
| i18nPlural : { "=1": "Note", other: "Notes" }
| translate
}}&nbsp;
<p-badge [value]="order.notes.length" />
</h5>
</div>
</ng-template>
@if(order.notes && order.notes.length > 0) {
<p-panel>
<ng-template pTemplate="header">
<div class="flex gap-2 align-items-center">
<shared-open-close-button (status)="notesCollapsed = $event" />
<h5 class="m-0">
{{
order.notes.length
| i18nPlural : { "=1": "Note", other: "Notes" }
| translate
}}&nbsp;
<p-badge [value]="order.notes.length" />
</h5>
</div>
</ng-template>

@if (!notesCollapsed) {
<admin-notes [notes]="order.notes" />
}
</p-panel>
@if (!notesCollapsed) {
<admin-notes [notes]="order.notes" />
}
</p-panel>
}
</div>
}
</p-tabPanel>
<p-tabPanel
id="receipt"
[header]="'Reception' | translate"
[disabled]="!canViewReceipts"
[disabled]="disabledReceipts"
#receiptPanel
>
@if (receiptPanel.selected && isPermissionsLoaded) {
<admin-receipt-list
class="row"
[order]="order"
[recordPermissions]="recordPermissions"
/>
@if (receiptPanel.selected) {
<admin-receipt-list
[order]="order"
/>
}
</p-tabPanel>
@if (historyVersions && historyVersions.length > 1) {
<p-tabPanel [header]="'History' | translate">
<p-timeline [value]="historyVersions">
<ng-template pTemplate="marker" let-event>
<div
[class.p-timeline-event-marker-current]="event.active"
class="p-timeline-event-marker"
></div>
</ng-template>
<ng-template pTemplate="content" let-event>
<a [routerLink]="['/records', 'acq_orders', 'detail', event.pid]">{{
event.label
}}</a>
<small>{{ event.description }}</small>
</ng-template>
</p-timeline>
</p-tabPanel>
<p-tabPanel [header]="'History' | translate">
<p-timeline [value]="historyVersions">
<ng-template pTemplate="opposite" let-event>
<a [routerLink]="['/records', 'acq_orders', 'detail', event.pid]">{{
event.label
}}</a>
</ng-template>
<ng-template pTemplate="content" let-event>
<small>{{ event.description }}</small>
</ng-template>
</p-timeline>
</p-tabPanel>
}
</p-tabView>
</div>
Expand Down
80 changes: 43 additions & 37 deletions ...min/src/app/acquisition/components/order/order-detail-view/order-detail-view.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,26 +17,30 @@
*/
import { APP_BASE_HREF, Location, ViewportScroller } from '@angular/common';
import { Component, inject, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute, Router, UrlSegment } from '@angular/router';
import { ActivatedRoute } from '@angular/router';
import { AcqOrderApiService } from '@app/admin/acquisition/api/acq-order-api.service';
import { AcqReceiptApiService } from '@app/admin/acquisition/api/acq-receipt-api.service';
import { RecordPermissions } from '@app/admin/classes/permissions';
import { RecordPermissionService } from '@app/admin/service/record-permission.service';
import { CurrentLibraryPermissionValidator } from '@app/admin/utils/permissions';
import { TranslateService } from '@ngx-translate/core';
import { extractIdOnRef } from '@rero/ng-core';
import { DetailRecord } from '@rero/ng-core/lib/record/detail/view/detail-record';
import { DialogService, DynamicDialogRef } from 'primeng/dynamicdialog';
import { Observable, Subscription } from 'rxjs';
import { map } from 'rxjs/operators';
import { AcqOrderHistoryVersion, AcqOrderHistoryVersionResponseInterface, AcqOrderStatus, IAcqOrder } from '../../../classes/order';
import { forkJoin, Observable, Subscription } from 'rxjs';
import { map, switchMap, tap } from 'rxjs/operators';
import {
AcqOrderHistoryVersion,
AcqOrderStatus,
IAcqOrder
} from '../../../classes/order';
import { OrderEmailFormComponent } from '../order-email-form/order-email-form.component';

@Component({
selector: 'admin-acquisition-order-detail-view',
templateUrl: './order-detail-view.component.html'
templateUrl: './order-detail-view.component.html',
})
export class OrderDetailViewComponent implements DetailRecord, OnInit, OnDestroy {

private dialogService: DialogService = inject(DialogService);
private scroller: ViewportScroller = inject(ViewportScroller);
private recordPermissionService: RecordPermissionService = inject(RecordPermissionService);
Expand All @@ -46,7 +50,7 @@ export class OrderDetailViewComponent implements DetailRecord, OnInit, OnDestroy
private route: ActivatedRoute = inject(ActivatedRoute);
private location: Location = inject(Location);
private baseHref = inject(APP_BASE_HREF);

private acqReceiptApiService: AcqReceiptApiService = inject(AcqReceiptApiService);

// COMPONENT ATTRIBUTES =====================================================
/** Observable resolving record data */
Expand All @@ -61,8 +65,7 @@ export class OrderDetailViewComponent implements DetailRecord, OnInit, OnDestroy
acqOrderStatus = AcqOrderStatus;
/** order permissions */
recordPermissions?: RecordPermissions;
/** Is permissions loaded */
isPermissionsLoaded = false;

/** history versions of this order */
historyVersions: AcqOrderHistoryVersion[] = [];

Expand All @@ -80,44 +83,47 @@ export class OrderDetailViewComponent implements DetailRecord, OnInit, OnDestroy
}

/** Is this order could manage reception */
get canViewReceipts(): boolean {
return this.order.status !== AcqOrderStatus.PENDING;
get disabledReceipts(): boolean {
return [AcqOrderStatus.PENDING, AcqOrderStatus.CANCELLED].some((status) => status === this.order.status);
}

addTabToUrl(event) {
this.location.replaceState(location.pathname.replace(this.baseHref, ""), `tab=${event}`);
this.location.replaceState(location.pathname.replace(this.baseHref, ''), `tab=${event}`);
}

/** OnInit hook */
ngOnInit(): void {
this.tabActiveIndex = +this.route.snapshot.queryParamMap.get('tab') || 0;
this.subscriptions.add(this.record$.subscribe(
(record: any) => {
this.order = record.metadata;
if (this.order.is_current_budget) {
this.subscriptions.add(this.recordPermissionService.getPermission('acq_orders', this.order.pid)
.pipe(map((permissions) => this.permissionValidator.validate(permissions, this.order.library.pid)))
.subscribe((permissions) => {
this.recordPermissions = permissions;
this.isPermissionsLoaded = true;
}));
} else {
this.isPermissionsLoaded = true;
}

// Ask for order history
this.acqOrderService.getOrderHistory(this.order.pid);
}
));
this.subscriptions.add(this.acqOrderService.acqOrderHistorySubject.subscribe(
(versions: AcqOrderHistoryVersionResponseInterface[]) => {
this.historyVersions = versions.map(version => new AcqOrderHistoryVersion(version));
}));
this.subscriptions.add(
this.record$.pipe(
tap((record: any) => this.order = record.metadata),
switchMap(() => {
const obs = [
// history
this.acqOrderService.getOrderHistory(this.order.pid).pipe(
map((versions) => this.historyVersions = versions.map((version) => new AcqOrderHistoryVersion(version)))
),
// permissions
this.recordPermissionService.getPermission('acq_orders', this.order.pid).pipe(
map((permissions) => this.permissionValidator.validate(permissions, this.order.library.pid)),
map((permissions) => this.recordPermissions = permissions)
)
];
return forkJoin(obs);
}),
switchMap(() =>
// reload order if an order line has been deleted
this.acqReceiptApiService.deletedReceiptSubject$
),
switchMap(() => this.acqOrderService.getOrder(this.order.pid, 1)),
tap(order => this.order = order)
).subscribe()
);
}

/** OnDestroy hook */
ngOnDestroy(): void {
this.subscriptions.unsubscribe();
this.subscriptions.unsubscribe();
}

// COMPONENT FUNCTIONS =======================================================
Expand All @@ -141,8 +147,8 @@ export class OrderDetailViewComponent implements DetailRecord, OnInit, OnDestroy
width: '60vw',
dismissableMask: true,
data: {
order: this.order
}
order: this.order,
},
});
this.modalRef.onClose.subscribe((order?: IAcqOrder) => {
if (order && this.order.pid === order.pid) {
Expand Down
Loading

0 comments on commit 0a53d04

Please sign in to comment.