119 lines
7.7 KiB
HTML
119 lines
7.7 KiB
HTML
<div class="ui-g">
|
|
<div class="ui-g-12">
|
|
<div class="card clearfix">
|
|
<p-accordion styleClass="agm-accordion" [style]="{'display':'block', 'margin-bottom':'0.75rem'}">
|
|
<p-accordionTab i18n-header="@@searchJobs" header="Search Jobs" [transitionOptions]="'250ms'" [selected]="searchAccordionOpen"
|
|
(selectedChange)="searchAccordionOpen = $event; onAccordionToggle($event)">
|
|
<agm-dynamic-filter [filterDefinitions]="jobFilterDefinitions" [locale]="locale" [defaultFilters]="defaultDynamicFilters" stateKey="job-list-filters" (filtersSubmit)="onFiltersSubmit($event)"></agm-dynamic-filter>
|
|
</p-accordionTab>
|
|
</p-accordion>
|
|
<p-table #dt [value]="filteredJobs" [columns]="cols" selectionMode="single" (firstChange)="restoreTableFirst()"
|
|
(onPage)="onPageChange($event)" (onFilter)="restoreTableFirst()" (onRowSelect)="onRowSelect($event)"
|
|
(onRowUnselect)="onRowSelect($event)" [paginator]="true" [rows]="rows1Page[0]" [pageLinks]="5"
|
|
[rowsPerPageOptions]="rows1Page" [alwaysShowPaginator]="true" [(selection)]="currentJob" stateStorage="session"
|
|
stateKey="jtb-ops" dataKey="_id" mutable="false" [responsive]="true" [resetPageOnSort]="false">
|
|
<ng-template pTemplate="caption">
|
|
<div class="ui-g ui-g-nopad">
|
|
<div class="ui-g-6 ui-g-nopad" style="text-align: left">
|
|
<span class="table-caption-1" style="line-height: 1.35em;" i18n="@@jobList">Job List</span>
|
|
</div>
|
|
<ng-container *ngTemplateOutlet="dropdowns"></ng-container>
|
|
</div>
|
|
</ng-template>
|
|
<ng-template pTemplate="header" let-columns>
|
|
<tr>
|
|
<th *ngFor="let col of columns" [pSortableColumn]="col.field" [width]="col.width">
|
|
<ng-container>
|
|
{{col.header}}
|
|
<p-sortIcon [field]="col.field"></p-sortIcon>
|
|
</ng-container>
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<th *ngFor="let col of columns" [ngSwitch]="col.filtered" class="ui-fluid">
|
|
<div class="input-with-icon" *ngSwitchCase="true">
|
|
<i class="ui-icon-search"></i>
|
|
<input pInputText type="text" (input)="dt.filter($event.target.value, col.field, col.filterMatchMode)"
|
|
[value]="dt.filters[col.field]?.value">
|
|
</div>
|
|
<p-dropdown #cl *ngIf="col.field === 'client.name' && !filterClientLocked" name="clients" [options]="clients" optionLabel="label"
|
|
[ngModel]="currClient" filter="true" [emptyFilterMessage]="globals.emptyFilterMsg"></p-dropdown>
|
|
<span *ngIf="col.field === 'client.name' && filterClientLocked">{{ currClient.label }}</span>
|
|
<p-dropdown *ngIf="col.field === 'status'" [options]="status" [ngModel]="statusFilter"
|
|
(onChange)="handleStatusFilter($event.value)"></p-dropdown>
|
|
<p-calendar *ngIf="col.field === 'startDate'" [(ngModel)]="startDateFilter" [locale]="locale"
|
|
[dateFormat]="locale.dateFormat" [showButtonBar]="true" [showIcon]="true" appendTo="body"
|
|
(onSelect)="onDateFilter($event, 'startDate')" (onClearClick)="onDateFilter(null, 'startDate')"
|
|
[style]="{'width':'100%'}" i18n-placeholder="@@filterDate" placeholder="Filter..."></p-calendar>
|
|
<p-calendar *ngIf="col.field === 'endDate'" [(ngModel)]="endDateFilter" [locale]="locale"
|
|
[dateFormat]="locale.dateFormat" [showButtonBar]="true" [showIcon]="true" appendTo="body"
|
|
(onSelect)="onDateFilter($event, 'endDate')" (onClearClick)="onDateFilter(null, 'endDate')"
|
|
[style]="{'width':'100%'}" i18n-placeholder="@@filterDate" placeholder="Filter..."></p-calendar>
|
|
<span *ngSwitchDefault></span>
|
|
</th>
|
|
</tr>
|
|
</ng-template>
|
|
<ng-template pTemplate="body" let-job>
|
|
<tr [pSelectableRow]="job">
|
|
<td *ngIf="!isClientUser"><span class="ui-column-title">{{cols[0].header}}</span>{{ job.client?.name }}</td>
|
|
<td class="table-col-center"><span class="ui-column-title">{{cols[1].header}}</span>{{job._id}}</td>
|
|
<td class="table-col-center"><span class="ui-column-title">{{cols[2].header}}</span>{{job.orderNumber}}</td>
|
|
<td><span class="ui-column-title">{{cols[3].header}}</span>{{job.name}}</td>
|
|
<td class="table-col-center"><span class="ui-column-title">{{cols[4].header}}</span>{{job.startDate |
|
|
date:'shortDate'}}</td>
|
|
<td class="table-col-center"><span class="ui-column-title">{{cols[5].header}}</span>{{job.endDate |
|
|
date:'shortDate'}}</td>
|
|
<td class="table-col-center">
|
|
<span class="ui-column-title">{{cols[5].header}}</span>
|
|
{{ job.status | jobStatus }}
|
|
<span *ngIf="job.status >= 2 && showStatusPlus" innerHTML="{{ getUsers(job.by) }}"></span>
|
|
</td>
|
|
</tr>
|
|
</ng-template>
|
|
<ng-template pTemplate="paginatorleft" let-state>
|
|
{{ state.totalRecords | i18nPlural: totalJobs }}
|
|
</ng-template>
|
|
</p-table>
|
|
<div class="ui-widget-header ui-helper-clearfix toolbar">
|
|
<span class="ui-g ui-g-10 ui-sm-12 no-pad">
|
|
<!-- Note: !acre checks if subscription package loaded (not acre limits, packages have unlimited acres) -->
|
|
<button type="button" pButton icon="ui-icon-plus" *ngIf="canWrite"
|
|
[disabled]="currClient.value === null || !acre" (click)="newJob()" i18n-label="@@new" label="New"></button>
|
|
<button type="button" *ngIf="canWrite" [disabled]="!canEdit() || currClient.value === null || !acre" pButton
|
|
icon="ui-icon-control-point-duplicate" (click)="duplicateJob()" i18n-label="@@duplicate"
|
|
label="Duplicate"></button>
|
|
<button type="button" [disabled]="!canEdit()" pButton icon="ui-icon-edit" (click)="editJob()"
|
|
i18n-label="@@detail" label="Detail"></button>
|
|
<button type="button" [disabled]="!canEdit()" pButton icon="ui-icon-map" (click)="editJobMap()"
|
|
i18n-label="@@map" label="Map"></button>
|
|
<button type="button" [disabled]="!canEdit()" *ngIf="canWrite" pButton icon="ui-icon-trash"
|
|
(click)="deleteJob()" i18n-label="@@delete" label="Delete"></button>
|
|
<button type="button" [disabled]="!canCreateInvoice()" *ngIf="canWriteInvoice" pButton icon="ui-icon-add"
|
|
(click)="createInvoice()" i18n-label="@@createInvoice" label="Create Invoice"></button>
|
|
</span>
|
|
<span class="ui-g-2 ui-sm-12 no-pad" *ngIf="!isClientUser">
|
|
<button pButton type="button" class="amber-btn" icon="ui-icon-arrow-back" (click)="gotoClients()"
|
|
style="float:right" i18n-label="@@clientList" label="Client List"></button>
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<ng-template #dropdowns>
|
|
<div class="ui-g ui-g-6 ui-sm-12 ui-g-nopad cache-ttl-caption-controls">
|
|
<div class="ui-g-12 inline-flex-end">
|
|
<input pInputText type="number" min="0" step="1" placeholder="Cache TTL" [(ngModel)]="cacheTtlSeconds"
|
|
(blur)="updateCacheTtl()" style="width: 3.5rem; margin-right: 6px;">
|
|
<span class="cache-ttl-help" tabindex="0">
|
|
<span class="cache-ttl-help-icon">?</span>
|
|
<span class="cache-ttl-help-text">Controls how long results stay cached after you return to this page. Value is in seconds.</span>
|
|
</span>
|
|
<p-dropdown [options]="reloadOps" [style]="dropdownStyle" [(ngModel)]="reloadBy"
|
|
(onChange)="reloadChanged($event.value)">
|
|
</p-dropdown>
|
|
<button pButton type="button" style="margin-left:6px" icon="ui-icon-refresh" class="ui-button-secondary"
|
|
(click)="reloadJobs()"></button>
|
|
</div>
|
|
</div>
|
|
</ng-template> |