@@ -203,11 +203,7 @@
|
||||
<tr mat-row *matRowDef="let row; columns: getColumnsForTab(tab)" class="feed-row"></tr>
|
||||
</table>
|
||||
|
||||
<mat-paginator
|
||||
[pageSize]="10"
|
||||
[pageSizeOptions]="[5, 10, 25, 50]"
|
||||
showFirstLastButtons
|
||||
></mat-paginator>
|
||||
<mat-paginator [pageSize]="10" [pageSizeOptions]="[5, 10, 25, 50]" showFirstLastButtons></mat-paginator>
|
||||
</div>
|
||||
</div>
|
||||
</mat-tab>
|
||||
@@ -255,7 +251,11 @@
|
||||
<div class="op-toolbar">
|
||||
<mat-form-field class="op-search-field" appearance="outline">
|
||||
<mat-label>Search work items...</mat-label>
|
||||
<input matInput (input)="filterWorkPackages($any($event.target).value)" placeholder="Search by subject, status, or type" />
|
||||
<input
|
||||
matInput
|
||||
(input)="filterWorkPackages($any($event.target).value)"
|
||||
placeholder="Search by subject, status, or type"
|
||||
/>
|
||||
<fa-icon matSuffix icon="search" class="search-icon"></fa-icon>
|
||||
</mat-form-field>
|
||||
<button mat-stroked-button color="primary" (click)="loadWorkPackages()" matTooltip="Refresh work items">
|
||||
@@ -275,13 +275,19 @@
|
||||
<span class="op-status-chip" [style.background-color]="getStatusColor(wp.status)">
|
||||
{{ wp.status }}
|
||||
</span>
|
||||
<span class="op-priority-chip" [style.border-color]="getPriorityColor(wp.priority)" [style.color]="getPriorityColor(wp.priority)">
|
||||
<span
|
||||
class="op-priority-chip"
|
||||
[style.border-color]="getPriorityColor(wp.priority)"
|
||||
[style.color]="getPriorityColor(wp.priority)"
|
||||
>
|
||||
{{ wp.priority }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="op-card-info">
|
||||
<span *ngIf="wp.assignee"><fa-icon icon="user" class="op-info-icon"></fa-icon> {{ wp.assignee }}</span>
|
||||
<span *ngIf="wp.dueDate"><fa-icon icon="calendar-alt" class="op-info-icon"></fa-icon> {{ formatOpDate(wp.dueDate) }}</span>
|
||||
<span *ngIf="wp.dueDate"
|
||||
><fa-icon icon="calendar-alt" class="op-info-icon"></fa-icon> {{ formatOpDate(wp.dueDate) }}</span
|
||||
>
|
||||
<span><fa-icon icon="folder" class="op-info-icon"></fa-icon> {{ wp.project }}</span>
|
||||
</div>
|
||||
<div *ngIf="wp.percentageDone !== undefined && wp.percentageDone > 0" class="op-progress">
|
||||
@@ -289,17 +295,29 @@
|
||||
<span class="op-progress-label">{{ wp.percentageDone }}%</span>
|
||||
</div>
|
||||
<div class="op-card-actions">
|
||||
<button mat-button color="primary" (click)="openInOpenProject(wp); $event.stopPropagation()" matTooltip="Open in OpenProject">
|
||||
<button
|
||||
mat-button
|
||||
color="primary"
|
||||
(click)="openInOpenProject(wp); $event.stopPropagation()"
|
||||
matTooltip="Open in OpenProject"
|
||||
>
|
||||
<fa-icon icon="external-link-alt" class="mr-05"></fa-icon> Open in OpenProject
|
||||
</button>
|
||||
<button mat-button color="accent" (click)="viewWorkPackageDetails(wp.id); $event.stopPropagation()" matTooltip="Fetch full details via API">
|
||||
<button
|
||||
mat-button
|
||||
color="accent"
|
||||
(click)="viewWorkPackageDetails(wp.id); $event.stopPropagation()"
|
||||
matTooltip="Fetch full details via API"
|
||||
>
|
||||
<fa-icon icon="info-circle" class="mr-05"></fa-icon> Fetch Details
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="results-info">Showing {{ opFilteredWorkPackages.length }} of {{ opWorkPackages.length }} work items</div>
|
||||
<div class="results-info">
|
||||
Showing {{ opFilteredWorkPackages.length }} of {{ opWorkPackages.length }} work items
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Work Package Detail Panel -->
|
||||
@@ -327,7 +345,11 @@
|
||||
</div>
|
||||
<div class="op-detail-row">
|
||||
<span class="op-detail-label">Priority</span>
|
||||
<span class="op-priority-chip" [style.border-color]="getPriorityColor(opSelectedWorkPackage.priority)" [style.color]="getPriorityColor(opSelectedWorkPackage.priority)">
|
||||
<span
|
||||
class="op-priority-chip"
|
||||
[style.border-color]="getPriorityColor(opSelectedWorkPackage.priority)"
|
||||
[style.color]="getPriorityColor(opSelectedWorkPackage.priority)"
|
||||
>
|
||||
{{ opSelectedWorkPackage.priority }}
|
||||
</span>
|
||||
</div>
|
||||
@@ -354,7 +376,10 @@
|
||||
<div *ngIf="opSelectedWorkPackage.percentageDone !== undefined" class="op-detail-row">
|
||||
<span class="op-detail-label">Progress</span>
|
||||
<div class="op-detail-progress">
|
||||
<mat-progress-bar mode="determinate" [value]="opSelectedWorkPackage.percentageDone"></mat-progress-bar>
|
||||
<mat-progress-bar
|
||||
mode="determinate"
|
||||
[value]="opSelectedWorkPackage.percentageDone"
|
||||
></mat-progress-bar>
|
||||
<span>{{ opSelectedWorkPackage.percentageDone }}%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -423,7 +423,9 @@
|
||||
border-radius: 10px;
|
||||
padding: 16px;
|
||||
cursor: pointer;
|
||||
transition: box-shadow 0.2s, border-color 0.2s;
|
||||
transition:
|
||||
box-shadow 0.2s,
|
||||
border-color 0.2s;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 4px 12px rgb(0 0 0 / 10%);
|
||||
|
||||
@@ -280,7 +280,10 @@ export class RbiCircularsComponent implements OnInit, AfterViewInit {
|
||||
}
|
||||
const q = query.toLowerCase();
|
||||
this.opFilteredWorkPackages = this.opWorkPackages.filter(
|
||||
(wp) => wp.subject?.toLowerCase().includes(q) || wp.status?.toLowerCase().includes(q) || wp.type?.toLowerCase().includes(q)
|
||||
(wp) =>
|
||||
wp.subject?.toLowerCase().includes(q) ||
|
||||
wp.status?.toLowerCase().includes(q) ||
|
||||
wp.type?.toLowerCase().includes(q)
|
||||
);
|
||||
}
|
||||
|
||||
@@ -303,7 +306,9 @@ export class RbiCircularsComponent implements OnInit, AfterViewInit {
|
||||
formatOpDate(dateStr: string): string {
|
||||
if (!dateStr) return '—';
|
||||
const d = new Date(dateStr);
|
||||
return isNaN(d.getTime()) ? '—' : d.toLocaleDateString('en-IN', { day: '2-digit', month: 'short', year: 'numeric' });
|
||||
return isNaN(d.getTime())
|
||||
? '—'
|
||||
: d.toLocaleDateString('en-IN', { day: '2-digit', month: 'short', year: 'numeric' });
|
||||
}
|
||||
|
||||
private buildTabs() {
|
||||
|
||||
Reference in New Issue
Block a user