cat-documents-ng 0.2.84 → 0.2.86
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/cat-documents-ng.mjs +204 -171
- package/fesm2022/cat-documents-ng.mjs.map +1 -1
- package/lib/document/components/document-search/document-search.component.d.ts +0 -4
- package/lib/document/components/document-upload/document-upload.component.d.ts +16 -8
- package/lib/document/services/document-upload-business.service.d.ts +3 -7
- package/lib/document/services/document-upload.service.d.ts +42 -9
- package/lib/document/state/document.query.d.ts +0 -5
- package/package.json +1 -1
- package/public-api.d.ts +0 -1
- package/lib/document/models/uploaded-file-response.model.d.ts +0 -7
|
@@ -13,15 +13,15 @@ import * as i3 from 'primeng/api';
|
|
|
13
13
|
import { ConfirmationService, MessageService } from 'primeng/api';
|
|
14
14
|
import * as i4 from 'primeng/button';
|
|
15
15
|
import { ButtonModule } from 'primeng/button';
|
|
16
|
-
import * as
|
|
16
|
+
import * as i10 from 'primeng/fileupload';
|
|
17
17
|
import { FileUploadModule } from 'primeng/fileupload';
|
|
18
|
-
import * as
|
|
18
|
+
import * as i11 from 'primeng/progressbar';
|
|
19
19
|
import { ProgressBarModule } from 'primeng/progressbar';
|
|
20
|
-
import * as
|
|
20
|
+
import * as i12 from 'primeng/radiobutton';
|
|
21
21
|
import { RadioButtonModule } from 'primeng/radiobutton';
|
|
22
22
|
import * as i3$1 from '@angular/forms';
|
|
23
23
|
import { FormsModule } from '@angular/forms';
|
|
24
|
-
import * as
|
|
24
|
+
import * as i14 from 'primeng/dropdown';
|
|
25
25
|
import { DropdownModule } from 'primeng/dropdown';
|
|
26
26
|
import * as i4$1 from 'primeng/sidebar';
|
|
27
27
|
import { SidebarModule } from 'primeng/sidebar';
|
|
@@ -48,7 +48,7 @@ import * as i7$2 from 'primeng/badge';
|
|
|
48
48
|
import { BadgeModule } from 'primeng/badge';
|
|
49
49
|
import * as i8$1 from 'primeng/menu';
|
|
50
50
|
import { MenuModule } from 'primeng/menu';
|
|
51
|
-
import * as i9
|
|
51
|
+
import * as i9 from 'primeng/card';
|
|
52
52
|
import { CardModule } from 'primeng/card';
|
|
53
53
|
import { ListboxModule } from 'primeng/listbox';
|
|
54
54
|
import { TimelineModule } from 'primeng/timeline';
|
|
@@ -1299,7 +1299,7 @@ class DocumentService {
|
|
|
1299
1299
|
* @returns {Observable<any>} Observable that emits the newly created document.
|
|
1300
1300
|
*/
|
|
1301
1301
|
create(entity) {
|
|
1302
|
-
const headers = { 'Authorization': 'Bearer
|
|
1302
|
+
const headers = { 'Authorization': 'Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d' };
|
|
1303
1303
|
return this.http.post(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD_FILE}`, entity, { headers }).pipe(tap((newEntity) => this.documentStore.add(newEntity)));
|
|
1304
1304
|
}
|
|
1305
1305
|
/**
|
|
@@ -1390,13 +1390,6 @@ class DocumentQuery extends QueryEntity {
|
|
|
1390
1390
|
selectDocumentCategories() {
|
|
1391
1391
|
return this.select((state) => state.documentCategories);
|
|
1392
1392
|
}
|
|
1393
|
-
/**
|
|
1394
|
-
* Gets the current document categories value (synchronous).
|
|
1395
|
-
* @returns {DocumentCategory[]} The current document categories.
|
|
1396
|
-
*/
|
|
1397
|
-
getDocumentCategories() {
|
|
1398
|
-
return this.getValue().documentCategories;
|
|
1399
|
-
}
|
|
1400
1393
|
// New query methods for selection state
|
|
1401
1394
|
/**
|
|
1402
1395
|
* Selects the currently selected menu item.
|
|
@@ -1711,7 +1704,7 @@ class DocumentHttpService {
|
|
|
1711
1704
|
* @returns {Observable<any>} Observable that emits the transformed data for dropdown options.
|
|
1712
1705
|
*/
|
|
1713
1706
|
getDocumentCatagories(contextId) {
|
|
1714
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1707
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1715
1708
|
return this.http.get(`${this.apiUrl}${URLS.DOCUMENTS_CATAGORIES}/${contextId}`, { headers }).pipe(tap((response) => {
|
|
1716
1709
|
// Store only the categories array, not the entire response
|
|
1717
1710
|
if (response && response.categories) {
|
|
@@ -1770,7 +1763,7 @@ class DocumentHttpService {
|
|
|
1770
1763
|
* @returns {Observable<DocumentModel>} An observable that emits the updated DocumentModel.
|
|
1771
1764
|
*/
|
|
1772
1765
|
updateDocumentName(documentId, payload) {
|
|
1773
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1766
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1774
1767
|
return this.http.put(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD}/${documentId}`, payload, { headers }).pipe(catchError((error) => {
|
|
1775
1768
|
return throwError(() => new Error(error));
|
|
1776
1769
|
}));
|
|
@@ -1783,7 +1776,7 @@ class DocumentHttpService {
|
|
|
1783
1776
|
getUserListByContextId(contextId) {
|
|
1784
1777
|
if (!contextId)
|
|
1785
1778
|
return EMPTY;
|
|
1786
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1779
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1787
1780
|
return this.http.get(`${this.apiUrl}${URLS.USERLIST}${contextId}`, { headers }).pipe(tap((userList) => {
|
|
1788
1781
|
this.documentStore.setUserList(userList);
|
|
1789
1782
|
}), catchError((error) => {
|
|
@@ -1809,7 +1802,7 @@ class DocumentHttpService {
|
|
|
1809
1802
|
if (categoryId) {
|
|
1810
1803
|
params = params.set(SHARED.CATEGORY, categoryId);
|
|
1811
1804
|
}
|
|
1812
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1805
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1813
1806
|
return this.http.get(url, { params, headers }).pipe(tap((statusData) => {
|
|
1814
1807
|
this.documentStore.setStatusData(statusData);
|
|
1815
1808
|
}), catchError((error) => {
|
|
@@ -1840,7 +1833,7 @@ class DocumentHttpService {
|
|
|
1840
1833
|
if (searchKey) {
|
|
1841
1834
|
params = params.set(SHARED.SEARCH_KEY, searchKey);
|
|
1842
1835
|
}
|
|
1843
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1836
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1844
1837
|
return this.http.get(`${this.apiUrl}${URLS.GETALL}/${contextId}`, { params, headers }).pipe(tap((response) => {
|
|
1845
1838
|
if (response.documents) {
|
|
1846
1839
|
this.documentStore.setDocumentList(response.documents);
|
|
@@ -1853,7 +1846,7 @@ class DocumentHttpService {
|
|
|
1853
1846
|
if (!documentId) {
|
|
1854
1847
|
return of([]);
|
|
1855
1848
|
}
|
|
1856
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1849
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1857
1850
|
return this.http.get(`${this.apiUrl}${URLS.DOCUMENT_HISTORY}${documentId}`, { headers });
|
|
1858
1851
|
}
|
|
1859
1852
|
/**
|
|
@@ -1864,7 +1857,7 @@ class DocumentHttpService {
|
|
|
1864
1857
|
getCategoriesBySource(source) {
|
|
1865
1858
|
if (!source)
|
|
1866
1859
|
return EMPTY;
|
|
1867
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1860
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1868
1861
|
return this.http.get(`${this.apiUrl}${URLS.GET_CATEGORIES_BY_SOURCE}${source}`, { headers }).pipe(catchError((error) => {
|
|
1869
1862
|
return throwError(() => new Error(error));
|
|
1870
1863
|
}));
|
|
@@ -1877,7 +1870,7 @@ class DocumentHttpService {
|
|
|
1877
1870
|
getDocumentTypesByCategory(categoryId) {
|
|
1878
1871
|
if (!categoryId)
|
|
1879
1872
|
return EMPTY;
|
|
1880
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1873
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1881
1874
|
return this.http.get(`${this.apiUrl}${URLS.GET_DOCUMENT_TYPES_BY_CATEGORY}${categoryId}`, { headers }).pipe(catchError((error) => {
|
|
1882
1875
|
return throwError(() => new Error(error));
|
|
1883
1876
|
}));
|
|
@@ -1888,7 +1881,7 @@ class DocumentHttpService {
|
|
|
1888
1881
|
* @returns {Observable<any>} Observable that emits the upload response.
|
|
1889
1882
|
*/
|
|
1890
1883
|
uploadFile(formData) {
|
|
1891
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1884
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1892
1885
|
return this.http.post(`${this.apiUrl}${URLS.DOCUMENT_UPLOAD_FILE}`, formData, { headers }).pipe(catchError((error) => {
|
|
1893
1886
|
return throwError(() => new Error(error));
|
|
1894
1887
|
}));
|
|
@@ -1899,7 +1892,7 @@ class DocumentHttpService {
|
|
|
1899
1892
|
* @returns {Observable<any>} Observable that emits the save response.
|
|
1900
1893
|
*/
|
|
1901
1894
|
saveDocumentUpload(payload) {
|
|
1902
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1895
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1903
1896
|
return this.http.post(`${this.apiUrl}${URLS.SAVE_DOCUMENT_UPLOAD}`, payload, { headers }).pipe(catchError((error) => {
|
|
1904
1897
|
return throwError(() => new Error(error));
|
|
1905
1898
|
}));
|
|
@@ -1915,7 +1908,7 @@ class DocumentHttpService {
|
|
|
1915
1908
|
const payload = {
|
|
1916
1909
|
statusUpdateDescription: statusUpdateDescription
|
|
1917
1910
|
};
|
|
1918
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1911
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1919
1912
|
return this.http.put(`${this.apiUrl}${URLS.UPDATE_DOCUMENT_STATUS}${documentId}/${status}`, payload, { headers }).pipe(tap((response) => {
|
|
1920
1913
|
if (response && response.status) {
|
|
1921
1914
|
const normalizedStatus = this.normalizeStatus(response.status);
|
|
@@ -1949,7 +1942,7 @@ class DocumentHttpService {
|
|
|
1949
1942
|
* @returns {Observable<any>} Observable that emits the delete response
|
|
1950
1943
|
*/
|
|
1951
1944
|
deleteDocument(documentId, contextId) {
|
|
1952
|
-
let headers = new HttpHeaders({ Authorization: `Bearer
|
|
1945
|
+
let headers = new HttpHeaders({ Authorization: `Bearer 514330f0-41d4-4c03-8d2e-f248a1340e8d` });
|
|
1953
1946
|
return this.http.delete(`${this.apiUrl}${URLS.DELETE_DOCUMENT}${documentId}`, { headers }).pipe(tap(() => {
|
|
1954
1947
|
this.getDocumentCatagories(contextId).subscribe();
|
|
1955
1948
|
this.getUserListByContextId(contextId).subscribe();
|
|
@@ -2261,6 +2254,10 @@ class DocumentUploadService {
|
|
|
2261
2254
|
documentService;
|
|
2262
2255
|
documentUploadStore;
|
|
2263
2256
|
messageService;
|
|
2257
|
+
/**
|
|
2258
|
+
* Event emitter for upload completion
|
|
2259
|
+
*/
|
|
2260
|
+
uploadCompleted = new EventEmitter();
|
|
2264
2261
|
/**
|
|
2265
2262
|
* The file to upload.
|
|
2266
2263
|
* @type {*}
|
|
@@ -2293,6 +2290,123 @@ class DocumentUploadService {
|
|
|
2293
2290
|
this.documentUploadStore = documentUploadStore;
|
|
2294
2291
|
this.messageService = messageService;
|
|
2295
2292
|
}
|
|
2293
|
+
/**
|
|
2294
|
+
* Prepares the files for upload by creating a FormData object.
|
|
2295
|
+
* This method appends each file to the FormData for submission.
|
|
2296
|
+
* @returns {Promise<any>} Promise that resolves when upload completes
|
|
2297
|
+
*/
|
|
2298
|
+
handleTemplatedUpload(file, contextId) {
|
|
2299
|
+
return new Promise((resolve, reject) => {
|
|
2300
|
+
let formsData = this.handleCreateFormData(file, contextId);
|
|
2301
|
+
if (!formsData) {
|
|
2302
|
+
const error = new Error('Failed to create form data');
|
|
2303
|
+
this.messageService.add({ severity: SHARED.SEVERITY, summary: SHARED.UPLOAD_ERROR_SUMMERY, detail: SHARED.UPLOAD_ERROR_DETAILS });
|
|
2304
|
+
reject(error);
|
|
2305
|
+
return;
|
|
2306
|
+
}
|
|
2307
|
+
// Update progress to show upload starting
|
|
2308
|
+
this.documentUploadStore.setMessage([{
|
|
2309
|
+
severity: 'info',
|
|
2310
|
+
detail: 'Uploading document...'
|
|
2311
|
+
}]);
|
|
2312
|
+
this.documentService.create(formsData)
|
|
2313
|
+
.subscribe({
|
|
2314
|
+
/**
|
|
2315
|
+
* Handles the successful upload event.
|
|
2316
|
+
* Updates the list of uploaded files and emits the file ID.
|
|
2317
|
+
* @returns {void}
|
|
2318
|
+
*/
|
|
2319
|
+
next: (event) => {
|
|
2320
|
+
this.documentUploadStore.setUploadedDocumentFiles(event);
|
|
2321
|
+
this.documentUploadStore.setMessage([{
|
|
2322
|
+
severity: SHARED.SUCCESS_SEVERITY,
|
|
2323
|
+
detail: SHARED.UPLOAD_SUCCESS
|
|
2324
|
+
}]);
|
|
2325
|
+
// Emit upload completion event with file and response
|
|
2326
|
+
this.uploadCompleted.emit({ file: file, response: event });
|
|
2327
|
+
resolve(event);
|
|
2328
|
+
},
|
|
2329
|
+
/**
|
|
2330
|
+
* Handles the error event during file upload.
|
|
2331
|
+
* Updates the progress of the file to indicate failure.
|
|
2332
|
+
* @param {any} error - The error object returned by the upload service.
|
|
2333
|
+
*/
|
|
2334
|
+
error: (error) => {
|
|
2335
|
+
this.messageService.add({ severity: SHARED.SEVERITY, summary: SHARED.UPLOAD_SUMMERY, detail: error?.message });
|
|
2336
|
+
reject(error);
|
|
2337
|
+
},
|
|
2338
|
+
});
|
|
2339
|
+
});
|
|
2340
|
+
}
|
|
2341
|
+
/**
|
|
2342
|
+
* Uploads multiple files sequentially using promises
|
|
2343
|
+
* @param files - Array of files to upload
|
|
2344
|
+
* @param contextId - The context ID for upload
|
|
2345
|
+
* @returns {Promise<any[]>} Promise that resolves with all upload responses
|
|
2346
|
+
*/
|
|
2347
|
+
async uploadFilesSequentially(files, contextId) {
|
|
2348
|
+
const results = [];
|
|
2349
|
+
for (const file of files) {
|
|
2350
|
+
try {
|
|
2351
|
+
const result = await this.handleTemplatedUpload(file, contextId);
|
|
2352
|
+
results.push(result);
|
|
2353
|
+
}
|
|
2354
|
+
catch (error) {
|
|
2355
|
+
console.error(`Failed to upload file ${file.name}:`, error);
|
|
2356
|
+
// Continue with next file even if one fails
|
|
2357
|
+
results.push({ error: true, fileName: file.name, errorMessage: error });
|
|
2358
|
+
}
|
|
2359
|
+
}
|
|
2360
|
+
return results;
|
|
2361
|
+
}
|
|
2362
|
+
/**
|
|
2363
|
+
* Alternative method to upload files sequentially with progress tracking
|
|
2364
|
+
* @param files - Array of files to upload
|
|
2365
|
+
* @param contextId - The context ID for upload
|
|
2366
|
+
* @param onProgress - Optional callback for progress updates
|
|
2367
|
+
* @returns {Promise<any[]>} Promise that resolves with all upload responses
|
|
2368
|
+
*/
|
|
2369
|
+
async uploadFilesSequentiallyWithProgress(files, contextId, onProgress) {
|
|
2370
|
+
const results = [];
|
|
2371
|
+
for (let i = 0; i < files.length; i++) {
|
|
2372
|
+
const file = files[i];
|
|
2373
|
+
// Call progress callback if provided
|
|
2374
|
+
if (onProgress) {
|
|
2375
|
+
onProgress(file, i, files.length);
|
|
2376
|
+
}
|
|
2377
|
+
try {
|
|
2378
|
+
const result = await this.handleTemplatedUpload(file, contextId);
|
|
2379
|
+
results.push(result);
|
|
2380
|
+
}
|
|
2381
|
+
catch (error) {
|
|
2382
|
+
console.error(`Failed to upload file ${file.name}:`, error);
|
|
2383
|
+
// Continue with next file even if one fails
|
|
2384
|
+
results.push({ error: true, fileName: file.name, errorMessage: error });
|
|
2385
|
+
}
|
|
2386
|
+
}
|
|
2387
|
+
return results;
|
|
2388
|
+
}
|
|
2389
|
+
/**
|
|
2390
|
+
* Get the file and contextId
|
|
2391
|
+
* @param file - The file to upload.
|
|
2392
|
+
* @param contextId - The contextId to upload.
|
|
2393
|
+
*/
|
|
2394
|
+
getUploadFileData(file, contextId) {
|
|
2395
|
+
if (file && contextId) {
|
|
2396
|
+
this.uploadedFile = file;
|
|
2397
|
+
this.contextId = contextId;
|
|
2398
|
+
}
|
|
2399
|
+
}
|
|
2400
|
+
/**
|
|
2401
|
+
* Get the document name and document type id
|
|
2402
|
+
* @param documentName - The document name to upload.
|
|
2403
|
+
* @param documentTypeId - The document type id to upload.
|
|
2404
|
+
*/
|
|
2405
|
+
getDocumentNameAndType(documentTypeId) {
|
|
2406
|
+
if (documentTypeId && documentTypeId !== SHARED.EMPTY) {
|
|
2407
|
+
this.docTypeId = documentTypeId;
|
|
2408
|
+
}
|
|
2409
|
+
}
|
|
2296
2410
|
/**
|
|
2297
2411
|
* Handle the creation of formdata.
|
|
2298
2412
|
* @returns {*} - The formdata object.
|
|
@@ -2301,40 +2415,13 @@ class DocumentUploadService {
|
|
|
2301
2415
|
if (uploadedFile) {
|
|
2302
2416
|
let formData = new FormData();
|
|
2303
2417
|
formData.append(SHARED.FILE, uploadedFile, uploadedFile.name);
|
|
2304
|
-
formData.append(SHARED.CONTEXT_ID,
|
|
2418
|
+
formData.append(SHARED.CONTEXT_ID, this.contextId);
|
|
2305
2419
|
return formData;
|
|
2306
2420
|
}
|
|
2307
2421
|
else {
|
|
2308
2422
|
return null;
|
|
2309
2423
|
}
|
|
2310
2424
|
}
|
|
2311
|
-
/**
|
|
2312
|
-
* Upload a file and return the response.
|
|
2313
|
-
* @param {File} file - The file to upload
|
|
2314
|
-
* @param {string} contextId - The context ID for the upload
|
|
2315
|
-
* @returns {Promise<UploadedFileResponse>} - Promise that resolves with the upload response
|
|
2316
|
-
*/
|
|
2317
|
-
async uploadFile(file, contextId) {
|
|
2318
|
-
const formData = this.handleCreateFormData(file, contextId);
|
|
2319
|
-
if (!formData) {
|
|
2320
|
-
throw new Error('Failed to create form data');
|
|
2321
|
-
}
|
|
2322
|
-
return new Promise((resolve, reject) => {
|
|
2323
|
-
this.documentService.create(formData).subscribe({
|
|
2324
|
-
next: (response) => {
|
|
2325
|
-
if (response) {
|
|
2326
|
-
resolve(response);
|
|
2327
|
-
}
|
|
2328
|
-
else {
|
|
2329
|
-
reject(new Error('No response received'));
|
|
2330
|
-
}
|
|
2331
|
-
},
|
|
2332
|
-
error: (error) => {
|
|
2333
|
-
reject(error);
|
|
2334
|
-
}
|
|
2335
|
-
});
|
|
2336
|
-
});
|
|
2337
|
-
}
|
|
2338
2425
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadService, deps: [{ token: DocumentService }, { token: DocumentStore }, { token: i3.MessageService }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
2339
2426
|
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadService, providedIn: 'root' });
|
|
2340
2427
|
}
|
|
@@ -2543,8 +2630,7 @@ class DocumentUploadBusinessService {
|
|
|
2543
2630
|
fileSize: file.file.size,
|
|
2544
2631
|
url: file.url,
|
|
2545
2632
|
contentType: file.contentType,
|
|
2546
|
-
|
|
2547
|
-
uploadedFileId: file.uploadResponse?.id || file.uploadResponse?.fileName
|
|
2633
|
+
uploadedFileId: file.uploadResponse?.fileId || file.uploadResponse?.id || file.uploadResponse?.fileName
|
|
2548
2634
|
}))
|
|
2549
2635
|
};
|
|
2550
2636
|
// For Applicant type, include the applicant ID
|
|
@@ -2783,7 +2869,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
2783
2869
|
* categories, document types, and applicant selection.
|
|
2784
2870
|
*/
|
|
2785
2871
|
class DocumentUploadComponent {
|
|
2786
|
-
|
|
2872
|
+
documentUpload;
|
|
2873
|
+
uploadService;
|
|
2787
2874
|
config;
|
|
2788
2875
|
fileFormatService;
|
|
2789
2876
|
messageService;
|
|
@@ -2845,8 +2932,9 @@ class DocumentUploadComponent {
|
|
|
2845
2932
|
* @param formService - Service for form validation and handling
|
|
2846
2933
|
* @param dataService - Service for data loading operations
|
|
2847
2934
|
*/
|
|
2848
|
-
constructor(
|
|
2849
|
-
this.
|
|
2935
|
+
constructor(documentUpload, uploadService, config, fileFormatService, messageService, cdr, businessService, formService, dataService) {
|
|
2936
|
+
this.documentUpload = documentUpload;
|
|
2937
|
+
this.uploadService = uploadService;
|
|
2850
2938
|
this.config = config;
|
|
2851
2939
|
this.fileFormatService = fileFormatService;
|
|
2852
2940
|
this.messageService = messageService;
|
|
@@ -2889,57 +2977,38 @@ class DocumentUploadComponent {
|
|
|
2889
2977
|
onApplicantSelectionChange() { this.validateAndEmit(); }
|
|
2890
2978
|
/**
|
|
2891
2979
|
* Handles file selection from the file upload component.
|
|
2892
|
-
* Processes
|
|
2980
|
+
* Processes each selected file for templated upload sequentially.
|
|
2893
2981
|
* @param event - Event containing the selected files
|
|
2894
2982
|
*/
|
|
2895
2983
|
async onSelectedFiles(event) {
|
|
2896
|
-
|
|
2984
|
+
// Process files sequentially instead of in parallel
|
|
2985
|
+
await this.processFilesSequentially(event.currentFiles);
|
|
2986
|
+
this.fileUploader.clear();
|
|
2987
|
+
}
|
|
2988
|
+
/**
|
|
2989
|
+
* Processes files sequentially for upload
|
|
2990
|
+
* @param files - Array of files to process
|
|
2991
|
+
*/
|
|
2992
|
+
async processFilesSequentially(files) {
|
|
2993
|
+
// Validate context ID before processing any files
|
|
2994
|
+
if (!this.formService.validateContextId(this.contextId, 'Context ID is required for upload.')) {
|
|
2897
2995
|
return;
|
|
2898
|
-
try {
|
|
2899
|
-
// Create upload promises for all files
|
|
2900
|
-
const uploadPromises = event.currentFiles.map(file => this.handleTemplatedUpload(file));
|
|
2901
|
-
// Execute all uploads in parallel
|
|
2902
|
-
const results = await Promise.allSettled(uploadPromises);
|
|
2903
|
-
// Process results and handle any failures
|
|
2904
|
-
let successCount = 0;
|
|
2905
|
-
let failureCount = 0;
|
|
2906
|
-
results.forEach((result, index) => {
|
|
2907
|
-
const file = event.currentFiles[index];
|
|
2908
|
-
if (result.status === 'fulfilled') {
|
|
2909
|
-
successCount++;
|
|
2910
|
-
}
|
|
2911
|
-
else {
|
|
2912
|
-
failureCount++;
|
|
2913
|
-
console.error(`Failed to upload file ${index + 1}/${event.currentFiles.length}: ${file.name}`, result.reason);
|
|
2914
|
-
}
|
|
2915
|
-
});
|
|
2916
|
-
// Show summary message if there were failures
|
|
2917
|
-
if (failureCount > 0) {
|
|
2918
|
-
this.messageService.add({
|
|
2919
|
-
severity: 'warn',
|
|
2920
|
-
summary: 'Upload Summary',
|
|
2921
|
-
detail: `${successCount} file(s) uploaded successfully, ${failureCount} file(s) failed.`
|
|
2922
|
-
});
|
|
2923
|
-
}
|
|
2924
|
-
else if (successCount > 0) {
|
|
2925
|
-
this.messageService.add({
|
|
2926
|
-
severity: 'success',
|
|
2927
|
-
summary: 'Upload Complete',
|
|
2928
|
-
detail: `All ${successCount} file(s) uploaded successfully.`
|
|
2929
|
-
});
|
|
2930
|
-
}
|
|
2931
|
-
}
|
|
2932
|
-
catch (error) {
|
|
2933
|
-
console.error('Unexpected error during file uploads:', error);
|
|
2934
|
-
this.messageService.add({
|
|
2935
|
-
severity: 'error',
|
|
2936
|
-
summary: 'Upload Error',
|
|
2937
|
-
detail: 'An unexpected error occurred during file uploads.'
|
|
2938
|
-
});
|
|
2939
|
-
}
|
|
2940
|
-
finally {
|
|
2941
|
-
this.fileUploader.clear();
|
|
2942
2996
|
}
|
|
2997
|
+
// Use the service method with progress tracking
|
|
2998
|
+
await this.documentUpload.uploadFilesSequentiallyWithProgress(files, this.contextId, (currentFile, currentIndex, totalFiles) => {
|
|
2999
|
+
// Set up progress tracking and upload listener for the current file
|
|
3000
|
+
this.fileProgress.set(currentFile, SHARED.UPLOAD_PROGRESS_10);
|
|
3001
|
+
this.setupFileUploadListener(currentFile);
|
|
3002
|
+
// Create uploaded file object
|
|
3003
|
+
const formattedSize = this.businessService.formatFileSize(currentFile.size, this.config);
|
|
3004
|
+
const uploadedFile = this.businessService.createUploadedFile(currentFile, formattedSize);
|
|
3005
|
+
uploadedFile.progress = SHARED.UPLOAD_PROGRESS_10;
|
|
3006
|
+
this.uploadedFiles.push(uploadedFile);
|
|
3007
|
+
// Validate form after adding file
|
|
3008
|
+
this.validateForm();
|
|
3009
|
+
// Update UI to show which file is currently being processed
|
|
3010
|
+
this.cdr.detectChanges();
|
|
3011
|
+
});
|
|
2943
3012
|
}
|
|
2944
3013
|
/**
|
|
2945
3014
|
* Loads the list of applicants for the current context.
|
|
@@ -2989,44 +3058,6 @@ class DocumentUploadComponent {
|
|
|
2989
3058
|
this.isSaving = true;
|
|
2990
3059
|
this.saveDocumentMetadata();
|
|
2991
3060
|
}
|
|
2992
|
-
/**
|
|
2993
|
-
* Handles templated upload for a single file.
|
|
2994
|
-
* @param file - The file to be uploaded
|
|
2995
|
-
*/
|
|
2996
|
-
async handleTemplatedUpload(file) {
|
|
2997
|
-
if (!this.formService.validateContextId(this.contextId, 'Context ID is required for upload.'))
|
|
2998
|
-
return;
|
|
2999
|
-
// Add file with initial state
|
|
3000
|
-
const fileIndex = this.uploadedFiles.length;
|
|
3001
|
-
this.uploadedFiles.push({
|
|
3002
|
-
file,
|
|
3003
|
-
formattedSize: this.businessService.formatFileSize(file.size, this.config),
|
|
3004
|
-
progress: SHARED.UPLOAD_PROGRESS_10,
|
|
3005
|
-
uploadResponse: { fileName: file.name, contentType: file.type, url: '', size: this.businessService.formatFileSize(file.size, this.config) },
|
|
3006
|
-
url: undefined,
|
|
3007
|
-
});
|
|
3008
|
-
this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_10);
|
|
3009
|
-
try {
|
|
3010
|
-
const response = await this.documentUploadService.uploadFile(file, this.contextId);
|
|
3011
|
-
// Update file with completed state
|
|
3012
|
-
this.uploadedFiles[fileIndex] = {
|
|
3013
|
-
...this.uploadedFiles[fileIndex],
|
|
3014
|
-
progress: SHARED.UPLOAD_PROGRESS_100,
|
|
3015
|
-
uploadResponse: response,
|
|
3016
|
-
url: response.url,
|
|
3017
|
-
contentType: response.contentType,
|
|
3018
|
-
fileName: response.fileName,
|
|
3019
|
-
size: response.size
|
|
3020
|
-
};
|
|
3021
|
-
this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_100);
|
|
3022
|
-
this.validateForm();
|
|
3023
|
-
this.onFormValidationChange.emit();
|
|
3024
|
-
}
|
|
3025
|
-
catch (error) {
|
|
3026
|
-
this.fileProgress.set(file, -1);
|
|
3027
|
-
console.error('Upload failed:', error);
|
|
3028
|
-
}
|
|
3029
|
-
}
|
|
3030
3061
|
/**
|
|
3031
3062
|
* Removes a document from the uploaded files list.
|
|
3032
3063
|
* Updates progress tracking and validates form.
|
|
@@ -3206,6 +3237,27 @@ class DocumentUploadComponent {
|
|
|
3206
3237
|
error: (error) => this.handleUploadError(error)
|
|
3207
3238
|
});
|
|
3208
3239
|
}
|
|
3240
|
+
/**
|
|
3241
|
+
* Sets up a listener for file upload completion.
|
|
3242
|
+
* Updates progress tracking and emits validation change when upload completes.
|
|
3243
|
+
* @param file - The file to monitor for upload completion
|
|
3244
|
+
*/
|
|
3245
|
+
setupFileUploadListener(file) {
|
|
3246
|
+
this.documentUpload.uploadCompleted.pipe(takeUntil(this.destroy$)).subscribe(({ file: uploadedFile, response }) => {
|
|
3247
|
+
if (uploadedFile === file) {
|
|
3248
|
+
this.fileProgress.set(file, SHARED.UPLOAD_PROGRESS_100);
|
|
3249
|
+
const uploadedFileObj = this.uploadedFiles.find(uf => uf.file === file);
|
|
3250
|
+
if (uploadedFileObj) {
|
|
3251
|
+
uploadedFileObj.uploadResponse = response;
|
|
3252
|
+
uploadedFileObj.progress = SHARED.UPLOAD_PROGRESS_100;
|
|
3253
|
+
uploadedFileObj.url = response?.url;
|
|
3254
|
+
uploadedFileObj.contentType = response?.contentType;
|
|
3255
|
+
}
|
|
3256
|
+
this.cdr.detectChanges();
|
|
3257
|
+
this.onFormValidationChange.emit();
|
|
3258
|
+
}
|
|
3259
|
+
});
|
|
3260
|
+
}
|
|
3209
3261
|
/**
|
|
3210
3262
|
* Handles errors during data loading operations.
|
|
3211
3263
|
* Resets loading state and can be extended for error logging.
|
|
@@ -3246,13 +3298,13 @@ class DocumentUploadComponent {
|
|
|
3246
3298
|
this.businessService.destroy();
|
|
3247
3299
|
this.dataService.destroy();
|
|
3248
3300
|
}
|
|
3249
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, deps: [{ token: DocumentUploadService }, { token: i3.PrimeNGConfig }, { token: FileFormatService }, { token: i3.MessageService }, { token: i0.ChangeDetectorRef }, { token: DocumentUploadBusinessService }, { token: DocumentUploadFormService }, { token: DocumentUploadDataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3250
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentUploadComponent, isStandalone: false, selector: "lib-document-upload", inputs: { contextId: "contextId" }, outputs: { onFormValidationChange: "onFormValidationChange", onUploadSuccess: "onUploadSuccess" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUploader"], descendants: true }], ngImport: i0, template: "<div class=\"document-upload-container\">\n <!-- Assignment Section -->\n <div class=\"assignment-section\">\n <h4>Assign to Applicant(s) or Application</h4>\n <div class=\"radio-group\">\n <div class=\"radio-item\">\n <p-radioButton \n name=\"assignmentType\" \n value=\"Applicant\" \n [(ngModel)]=\"selectedAssignmentType\"\n (onClick)=\"onAssignmentTypeChange()\"\n [inputId]=\"'applicant'\"\n ></p-radioButton>\n <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\n </div>\n <div class=\"radio-item\">\n <p-radioButton \n name=\"assignmentType\" \n value=\"Application\" \n [(ngModel)]=\"selectedAssignmentType\"\n (onClick)=\"onAssignmentTypeChange()\"\n [inputId]=\"'application'\"\n ></p-radioButton>\n <label [for]=\"'application'\" class=\"radio-label\">Application</label>\n </div>\n </div>\n </div>\n\n <!-- Applicant Selection (only shown when Applicant is selected) -->\n <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\n <h4>Select Applicant(s)</h4>\n <div class=\"grid\">\n <div \n *ngFor=\"let applicant of filteredApplicantList\" \n class=\"applicant-item col-12 md:col-6\"\n >\n <p-radioButton \n name=\"selectedApplicant\"\n [value]=\"applicant._id\"\n [(ngModel)]=\"selectedApplicant\"\n [inputId]=\"'applicant-' + applicant._id\"\n (onClick)=\"onApplicantSelectionChange()\"\n ></p-radioButton>\n <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\n {{ applicant.name }}\n </label>\n </div>\n </div>\n </div>\n\n <!-- Category Selection -->\n <div class=\"category-section\">\n <h4>Category</h4>\n <p-dropdown\n [options]=\"categoryOptions\"\n [(ngModel)]=\"selectedCategory\"\n placeholder=\"Select Category type\"\n optionLabel=\"label\"\n optionValue=\"_id\"\n (onChange)=\"onCategoryChange()\"\n [disabled]=\"!categoryOptions.length\"\n class=\"w-full\"\n ></p-dropdown>\n </div>\n\n <!-- Document Type Selection -->\n <div class=\"document-type-section\">\n <h4>Document Type</h4>\n <p-dropdown\n [options]=\"documentTypeOptions\"\n [(ngModel)]=\"selectedDocumentType\"\n placeholder=\"Select Document type\"\n optionLabel=\"label\"\n optionValue=\"_id\"\n (onChange)=\"onDocumentTypeChange()\"\n [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\n class=\"w-full\"\n ></p-dropdown>\n </div>\n\n <!-- File Upload Section -->\n <div class=\"file-upload-section\">\n <h4>Upload Documents</h4>\n <div class=\"grid\">\n <div class=\"col-12 md:col-12\">\n <p-fileUpload \n #fileUploader \n [multiple]=\"true\" \n auto=\"true\" \n accept=\"image/png,application/pdf\" \n maxFileSize=\"26214400\"\n (onSelect)=\"onSelectedFiles($event)\"\n >\n <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\n <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n <div class=\"flex gap-2\">\n <p-button \n (onClick)=\"choose($event, chooseCallback)\" \n icon=\"pi pi-images\" \n [rounded]=\"true\"\n [outlined]=\"true\" \n />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\n let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n <div class=\"col-12 md:col-12 p-0\">\n <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\n <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\n class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\n <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\n <div class=\"documentImage\">\n <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\n class=\"object-contain\" />\n </div>\n <div class=\"flex w-full flex-column mt-2 ml-2\">\n <div class=\"flex justify-content-between\">\n <div style=\"font-weight: bold;font-size: 14px\">\n {{ uploadedFile.file.name }}\n </div>\n <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\n </div>\n <div class=\"flex justify-content-between mt-1\">\n <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \n {{ uploadedFile.formattedSize }}\n </div>\n <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \n {{ uploadedFile.progress }} % \n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-12 p-0\">\n <p-progressBar \n [value]=\"uploadedFile.progress\" \n [showValue]=\"false\" \n styleClass=\"h-1/2rem md:ml-auto relative\"\n [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress && uploadedFile.progress > 100 }\"\n >\n </p-progressBar>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\n <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\n (click)=\"triggerFileUpload()\">\n <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\n <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\n </div>\n </ng-template>\n <ng-template pTemplate=\"file\"> </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.upload-status{margin-bottom:1rem;padding:.75rem;background-color:#f8f9fa;border-radius:.5rem;border-left:4px solid #0F8BFD}.upload-status .status-message{display:flex;align-items:center;font-size:.9rem;color:#495057}.upload-status .status-message .pi{font-size:1rem}.upload-status .status-message .pi.pi-spinner{color:#0f8bfd}.upload-status .status-message .pi.pi-check-circle{color:#28a745}.upload-status .status-message .pi.pi-clock{color:#ffc107}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-progressbar.error-progress-bar .p-progressbar-value{background-color:#dc3545!important}:host ::ng-deep .p-progressbar.success-progress-bar .p-progressbar-value{background-color:#28a745!important}:host ::ng-deep .p-progressbar.exceeded-progress-bar .p-progressbar-value{background-color:#ffc107!important}.applicant-list{display:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i9.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "component", type: i10.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i11.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i13.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3301
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, deps: [{ token: DocumentUploadService }, { token: DocumentService }, { token: i3.PrimeNGConfig }, { token: FileFormatService }, { token: i3.MessageService }, { token: i0.ChangeDetectorRef }, { token: DocumentUploadBusinessService }, { token: DocumentUploadFormService }, { token: DocumentUploadDataService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3302
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentUploadComponent, isStandalone: false, selector: "lib-document-upload", inputs: { contextId: "contextId" }, outputs: { onFormValidationChange: "onFormValidationChange", onUploadSuccess: "onUploadSuccess" }, viewQueries: [{ propertyName: "fileUploader", first: true, predicate: ["fileUploader"], descendants: true }], ngImport: i0, template: "<div class=\"document-upload-container\">\r\n <!-- Assignment Section -->\r\n <div class=\"assignment-section\">\r\n <h4>Assign to Applicant(s) or Application</h4>\r\n <div class=\"radio-group\">\r\n <div class=\"radio-item\">\r\n <p-radioButton \r\n name=\"assignmentType\" \r\n value=\"Applicant\" \r\n [(ngModel)]=\"selectedAssignmentType\"\r\n (onClick)=\"onAssignmentTypeChange()\"\r\n [inputId]=\"'applicant'\"\r\n ></p-radioButton>\r\n <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\r\n </div>\r\n <div class=\"radio-item\">\r\n <p-radioButton \r\n name=\"assignmentType\" \r\n value=\"Application\" \r\n [(ngModel)]=\"selectedAssignmentType\"\r\n (onClick)=\"onAssignmentTypeChange()\"\r\n [inputId]=\"'application'\"\r\n ></p-radioButton>\r\n <label [for]=\"'application'\" class=\"radio-label\">Application</label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Applicant Selection (only shown when Applicant is selected) -->\r\n <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\r\n <h4>Select Applicant(s)</h4>\r\n <div class=\"grid\">\r\n <div \r\n *ngFor=\"let applicant of filteredApplicantList\" \r\n class=\"applicant-item col-12 md:col-6\"\r\n >\r\n <p-radioButton \r\n name=\"selectedApplicant\"\r\n [value]=\"applicant._id\"\r\n [(ngModel)]=\"selectedApplicant\"\r\n [inputId]=\"'applicant-' + applicant._id\"\r\n (onClick)=\"onApplicantSelectionChange()\"\r\n ></p-radioButton>\r\n <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\r\n {{ applicant.name }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Category Selection -->\r\n <div class=\"category-section\">\r\n <h4>Category</h4>\r\n <p-dropdown\r\n [options]=\"categoryOptions\"\r\n [(ngModel)]=\"selectedCategory\"\r\n placeholder=\"Select Category type\"\r\n optionLabel=\"label\"\r\n optionValue=\"_id\"\r\n (onChange)=\"onCategoryChange()\"\r\n [disabled]=\"!categoryOptions.length\"\r\n class=\"w-full\"\r\n ></p-dropdown>\r\n </div>\r\n\r\n <!-- Document Type Selection -->\r\n <div class=\"document-type-section\">\r\n <h4>Document Type</h4>\r\n <p-dropdown\r\n [options]=\"documentTypeOptions\"\r\n [(ngModel)]=\"selectedDocumentType\"\r\n placeholder=\"Select Document type\"\r\n optionLabel=\"label\"\r\n optionValue=\"_id\"\r\n (onChange)=\"onDocumentTypeChange()\"\r\n [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\r\n class=\"w-full\"\r\n ></p-dropdown>\r\n </div>\r\n\r\n <!-- File Upload Section -->\r\n <div class=\"file-upload-section\">\r\n <h4>Upload Documents</h4>\r\n <div class=\"grid\">\r\n <div class=\"col-12 md:col-12\">\r\n <p-fileUpload \r\n #fileUploader \r\n [multiple]=\"true\" \r\n auto=\"true\" \r\n accept=\"image/png,application/pdf\" \r\n maxFileSize=\"26214400\"\r\n (onSelect)=\"onSelectedFiles($event)\"\r\n >\r\n <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\r\n <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\r\n <div class=\"flex gap-2\">\r\n <p-button \r\n (onClick)=\"choose($event, chooseCallback)\" \r\n icon=\"pi pi-images\" \r\n [rounded]=\"true\"\r\n [outlined]=\"true\" \r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\r\n let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\r\n <div class=\"col-12 md:col-12 p-0\">\r\n <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\r\n <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\r\n class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\r\n <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\r\n <div class=\"documentImage\">\r\n <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\r\n class=\"object-contain\" />\r\n </div>\r\n <div class=\"flex w-full flex-column mt-2 ml-2\">\r\n <div class=\"flex justify-content-between\">\r\n <div style=\"font-weight: bold;font-size: 14px\">\r\n {{ uploadedFile.file.name }}\r\n </div>\r\n <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\r\n </div>\r\n <div class=\"flex justify-content-between mt-1\">\r\n <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \r\n {{ uploadedFile.formattedSize }}\r\n </div>\r\n <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \r\n {{ uploadedFile.progress }} % \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-12 p-0\">\r\n <p-progressBar \r\n [value]=\"uploadedFile.progress\" \r\n [showValue]=\"false\" \r\n styleClass=\"h-1/2rem md:ml-auto relative\"\r\n [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress > 100 }\"\r\n >\r\n </p-progressBar>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\r\n <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\r\n (click)=\"triggerFileUpload()\">\r\n <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\r\n <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"file\"> </ng-template>\r\n </p-fileUpload>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}.applicant-list{display:none}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i4.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "raised", "rounded", "text", "plain", "severity", "outlined", "link", "tabindex", "size", "style", "styleClass", "badgeClass", "ariaLabel", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i10.FileUpload, selector: "p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "component", type: i11.ProgressBar, selector: "p-progressBar", inputs: ["value", "showValue", "styleClass", "style", "unit", "mode", "color"] }, { kind: "component", type: i12.RadioButton, selector: "p-radioButton", inputs: ["value", "formControlName", "name", "disabled", "label", "variant", "tabindex", "inputId", "ariaLabelledBy", "ariaLabel", "style", "styleClass", "labelStyleClass", "autofocus"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i14.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "autoShowPanelOnPrintableCharacterKeyDown", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
3251
3303
|
}
|
|
3252
3304
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentUploadComponent, decorators: [{
|
|
3253
3305
|
type: Component,
|
|
3254
|
-
args: [{ selector: 'lib-document-upload', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"document-upload-container\">\n <!-- Assignment Section -->\n <div class=\"assignment-section\">\n <h4>Assign to Applicant(s) or Application</h4>\n <div class=\"radio-group\">\n <div class=\"radio-item\">\n <p-radioButton \n name=\"assignmentType\" \n value=\"Applicant\" \n [(ngModel)]=\"selectedAssignmentType\"\n (onClick)=\"onAssignmentTypeChange()\"\n [inputId]=\"'applicant'\"\n ></p-radioButton>\n <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\n </div>\n <div class=\"radio-item\">\n <p-radioButton \n name=\"assignmentType\" \n value=\"Application\" \n [(ngModel)]=\"selectedAssignmentType\"\n (onClick)=\"onAssignmentTypeChange()\"\n [inputId]=\"'application'\"\n ></p-radioButton>\n <label [for]=\"'application'\" class=\"radio-label\">Application</label>\n </div>\n </div>\n </div>\n\n <!-- Applicant Selection (only shown when Applicant is selected) -->\n <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\n <h4>Select Applicant(s)</h4>\n <div class=\"grid\">\n <div \n *ngFor=\"let applicant of filteredApplicantList\" \n class=\"applicant-item col-12 md:col-6\"\n >\n <p-radioButton \n name=\"selectedApplicant\"\n [value]=\"applicant._id\"\n [(ngModel)]=\"selectedApplicant\"\n [inputId]=\"'applicant-' + applicant._id\"\n (onClick)=\"onApplicantSelectionChange()\"\n ></p-radioButton>\n <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\n {{ applicant.name }}\n </label>\n </div>\n </div>\n </div>\n\n <!-- Category Selection -->\n <div class=\"category-section\">\n <h4>Category</h4>\n <p-dropdown\n [options]=\"categoryOptions\"\n [(ngModel)]=\"selectedCategory\"\n placeholder=\"Select Category type\"\n optionLabel=\"label\"\n optionValue=\"_id\"\n (onChange)=\"onCategoryChange()\"\n [disabled]=\"!categoryOptions.length\"\n class=\"w-full\"\n ></p-dropdown>\n </div>\n\n <!-- Document Type Selection -->\n <div class=\"document-type-section\">\n <h4>Document Type</h4>\n <p-dropdown\n [options]=\"documentTypeOptions\"\n [(ngModel)]=\"selectedDocumentType\"\n placeholder=\"Select Document type\"\n optionLabel=\"label\"\n optionValue=\"_id\"\n (onChange)=\"onDocumentTypeChange()\"\n [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\n class=\"w-full\"\n ></p-dropdown>\n </div>\n\n <!-- File Upload Section -->\n <div class=\"file-upload-section\">\n <h4>Upload Documents</h4>\n <div class=\"grid\">\n <div class=\"col-12 md:col-12\">\n <p-fileUpload \n #fileUploader \n [multiple]=\"true\" \n auto=\"true\" \n accept=\"image/png,application/pdf\" \n maxFileSize=\"26214400\"\n (onSelect)=\"onSelectedFiles($event)\"\n >\n <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\n <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\n <div class=\"flex gap-2\">\n <p-button \n (onClick)=\"choose($event, chooseCallback)\" \n icon=\"pi pi-images\" \n [rounded]=\"true\"\n [outlined]=\"true\" \n />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\n let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\n <div class=\"col-12 md:col-12 p-0\">\n <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\n <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\n class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\n <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\n <div class=\"documentImage\">\n <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\n class=\"object-contain\" />\n </div>\n <div class=\"flex w-full flex-column mt-2 ml-2\">\n <div class=\"flex justify-content-between\">\n <div style=\"font-weight: bold;font-size: 14px\">\n {{ uploadedFile.file.name }}\n </div>\n <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\n </div>\n <div class=\"flex justify-content-between mt-1\">\n <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \n {{ uploadedFile.formattedSize }}\n </div>\n <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \n {{ uploadedFile.progress }} % \n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12 md:col-12 p-0\">\n <p-progressBar \n [value]=\"uploadedFile.progress\" \n [showValue]=\"false\" \n styleClass=\"h-1/2rem md:ml-auto relative\"\n [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress && uploadedFile.progress > 100 }\"\n >\n </p-progressBar>\n </div>\n </div>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\n <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\n (click)=\"triggerFileUpload()\">\n <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\n <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\n </div>\n </ng-template>\n <ng-template pTemplate=\"file\"> </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.upload-status{margin-bottom:1rem;padding:.75rem;background-color:#f8f9fa;border-radius:.5rem;border-left:4px solid #0F8BFD}.upload-status .status-message{display:flex;align-items:center;font-size:.9rem;color:#495057}.upload-status .status-message .pi{font-size:1rem}.upload-status .status-message .pi.pi-spinner{color:#0f8bfd}.upload-status .status-message .pi.pi-check-circle{color:#28a745}.upload-status .status-message .pi.pi-clock{color:#ffc107}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-progressbar.error-progress-bar .p-progressbar-value{background-color:#dc3545!important}:host ::ng-deep .p-progressbar.success-progress-bar .p-progressbar-value{background-color:#28a745!important}:host ::ng-deep .p-progressbar.exceeded-progress-bar .p-progressbar-value{background-color:#ffc107!important}.applicant-list{display:none}\n"] }]
|
|
3255
|
-
}], ctorParameters: () => [{ type: DocumentUploadService }, { type: i3.PrimeNGConfig }, { type: FileFormatService }, { type: i3.MessageService }, { type: i0.ChangeDetectorRef }, { type: DocumentUploadBusinessService }, { type: DocumentUploadFormService }, { type: DocumentUploadDataService }], propDecorators: { contextId: [{
|
|
3306
|
+
args: [{ selector: 'lib-document-upload', standalone: false, encapsulation: ViewEncapsulation.None, template: "<div class=\"document-upload-container\">\r\n <!-- Assignment Section -->\r\n <div class=\"assignment-section\">\r\n <h4>Assign to Applicant(s) or Application</h4>\r\n <div class=\"radio-group\">\r\n <div class=\"radio-item\">\r\n <p-radioButton \r\n name=\"assignmentType\" \r\n value=\"Applicant\" \r\n [(ngModel)]=\"selectedAssignmentType\"\r\n (onClick)=\"onAssignmentTypeChange()\"\r\n [inputId]=\"'applicant'\"\r\n ></p-radioButton>\r\n <label [for]=\"'applicant'\" class=\"radio-label\">Applicant(s)</label>\r\n </div>\r\n <div class=\"radio-item\">\r\n <p-radioButton \r\n name=\"assignmentType\" \r\n value=\"Application\" \r\n [(ngModel)]=\"selectedAssignmentType\"\r\n (onClick)=\"onAssignmentTypeChange()\"\r\n [inputId]=\"'application'\"\r\n ></p-radioButton>\r\n <label [for]=\"'application'\" class=\"radio-label\">Application</label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Applicant Selection (only shown when Applicant is selected) -->\r\n <div class=\"applicant-section\" *ngIf=\"selectedAssignmentType === 'Applicant'\">\r\n <h4>Select Applicant(s)</h4>\r\n <div class=\"grid\">\r\n <div \r\n *ngFor=\"let applicant of filteredApplicantList\" \r\n class=\"applicant-item col-12 md:col-6\"\r\n >\r\n <p-radioButton \r\n name=\"selectedApplicant\"\r\n [value]=\"applicant._id\"\r\n [(ngModel)]=\"selectedApplicant\"\r\n [inputId]=\"'applicant-' + applicant._id\"\r\n (onClick)=\"onApplicantSelectionChange()\"\r\n ></p-radioButton>\r\n <label [for]=\"'applicant-' + applicant._id\" class=\"applicant-label\">\r\n {{ applicant.name }}\r\n </label>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Category Selection -->\r\n <div class=\"category-section\">\r\n <h4>Category</h4>\r\n <p-dropdown\r\n [options]=\"categoryOptions\"\r\n [(ngModel)]=\"selectedCategory\"\r\n placeholder=\"Select Category type\"\r\n optionLabel=\"label\"\r\n optionValue=\"_id\"\r\n (onChange)=\"onCategoryChange()\"\r\n [disabled]=\"!categoryOptions.length\"\r\n class=\"w-full\"\r\n ></p-dropdown>\r\n </div>\r\n\r\n <!-- Document Type Selection -->\r\n <div class=\"document-type-section\">\r\n <h4>Document Type</h4>\r\n <p-dropdown\r\n [options]=\"documentTypeOptions\"\r\n [(ngModel)]=\"selectedDocumentType\"\r\n placeholder=\"Select Document type\"\r\n optionLabel=\"label\"\r\n optionValue=\"_id\"\r\n (onChange)=\"onDocumentTypeChange()\"\r\n [disabled]=\"!documentTypeOptions.length || !selectedCategory\"\r\n class=\"w-full\"\r\n ></p-dropdown>\r\n </div>\r\n\r\n <!-- File Upload Section -->\r\n <div class=\"file-upload-section\">\r\n <h4>Upload Documents</h4>\r\n <div class=\"grid\">\r\n <div class=\"col-12 md:col-12\">\r\n <p-fileUpload \r\n #fileUploader \r\n [multiple]=\"true\" \r\n auto=\"true\" \r\n accept=\"image/png,application/pdf\" \r\n maxFileSize=\"26214400\"\r\n (onSelect)=\"onSelectedFiles($event)\"\r\n >\r\n <ng-template pTemplate=\"header\" let-chooseCallback=\"chooseCallback\" let-clearCallback=\"clearCallback\">\r\n <div class=\"docHeader p-2 flex flex-wrap justify-content-between align-items-center flex-1 gap-2\">\r\n <div class=\"flex gap-2\">\r\n <p-button \r\n (onClick)=\"choose($event, chooseCallback)\" \r\n icon=\"pi pi-images\" \r\n [rounded]=\"true\"\r\n [outlined]=\"true\" \r\n />\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-removeFileCallback=\"removeFileCallback\"\r\n let-removeUploadedFileCallback=\"removeUploadedFileCallback\">\r\n <div class=\"col-12 md:col-12 p-0\">\r\n <div class=\"col-12 md:col-12 p-0\" *ngIf=\"uploadedFiles.length > 0\">\r\n <div *ngFor=\"let uploadedFile of uploadedFiles; let i = index\"\r\n class=\"m-0 flex flex-column align-items-center gap-1 mt-3\">\r\n <div class=\"col-12 md:col-12 p-0 flex documentInfo\">\r\n <div class=\"documentImage\">\r\n <img src=\"../../../../assets/images/document.png\" [alt]=\"uploadedFile.file.name\" width=\"45\" height=\"50\"\r\n class=\"object-contain\" />\r\n </div>\r\n <div class=\"flex w-full flex-column mt-2 ml-2\">\r\n <div class=\"flex justify-content-between\">\r\n <div style=\"font-weight: bold;font-size: 14px\">\r\n {{ uploadedFile.file.name }}\r\n </div>\r\n <i class=\"pi pi-times cursor-pointer\" (click)=\"handleDocumentRemove(uploadedFile.file,i)\"></i>\r\n </div>\r\n <div class=\"flex justify-content-between mt-1\">\r\n <div style=\"color: #676B89; font-size: 12px; color: green;\" class=\"pi pi-verified\"> \r\n {{ uploadedFile.formattedSize }}\r\n </div>\r\n <div class=\"white-space-nowrap\" style=\"color: #0F8BFD; font-family: 14px;\"> \r\n {{ uploadedFile.progress }} % \r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"col-12 md:col-12 p-0\">\r\n <p-progressBar \r\n [value]=\"uploadedFile.progress\" \r\n [showValue]=\"false\" \r\n styleClass=\"h-1/2rem md:ml-auto relative\"\r\n [ngClass]=\"{ 'exceeded-progress-bar': uploadedFile.progress > 100 }\"\r\n >\r\n </p-progressBar>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"empty\" let-chooseCallback=\"chooseCallback\">\r\n <div *ngIf=\"!uploadedFiles.length\" class=\"flex align-items-center justify-content-center flex-column\"\r\n (click)=\"triggerFileUpload()\">\r\n <i class=\"pi pi-cloud-upload border-2 border-circle p-5 text-8xl text-400 border-400\"></i>\r\n <p class=\"mt-4 mb-0\">Drag and drop files here to upload.</p>\r\n </div>\r\n </ng-template>\r\n <ng-template pTemplate=\"file\"> </ng-template>\r\n </p-fileUpload>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".flex{display:flex}.items-center{align-items:center}.justify-center{justify-content:center}.flex-col{flex-direction:column}.text-muted-color{color:#6c757d}.p-fileupload-buttonbar{padding:0}.p-fileupload-content{background-color:#0f8bfd1a}.p-fileupload .p-fileupload-content{padding:1rem}.docHeader .p-button-icon{padding:.5rem}.document-upload-container{padding:1rem;max-height:90vh}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1.5rem}.assignment-section h4,.applicant-section h4,.category-section h4,.document-type-section h4,.file-upload-section h4{margin:0 0 .75rem;font-size:1rem;font-weight:600;color:#212529}.radio-group{display:flex;gap:.75rem}.radio-item{display:flex;align-items:center;gap:.5rem;cursor:pointer;transition:all .2s ease}.radio-item:has(.p-radiobutton-box.p-highlight) .radio-label{color:#0f8bfd;font-weight:600}.radio-label{font-size:.9rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;transition:color .2s ease}::ng-deep .p-dropdown{width:100%}::ng-deep .p-dropdown .p-dropdown-label{font-size:.9rem;color:#495057}::ng-deep .p-dropdown .p-dropdown-trigger{color:#6c757d}::ng-deep .p-dropdown:not(.p-disabled):hover{border-color:#0f8bfd}::ng-deep .p-dropdown:not(.p-disabled).p-focus{border-color:#0f8bfd;box-shadow:0 0 0 2px #0f8bfd33}::ng-deep .p-radiobutton .p-radiobutton-box{border-color:#ced4da;border-radius:4px;width:18px;height:18px}::ng-deep .p-radiobutton .p-radiobutton-box:hover{border-color:#0f8bfd}::ng-deep .p-radiobutton .p-radiobutton-box.p-highlight{border-color:#0f8bfd;background-color:transparent}::ng-deep .p-radiobutton .p-radiobutton-icon{background-color:#0f8bfd;width:8px;height:8px;border-radius:2px}.applicant-section .grid{margin:0;padding:0}.applicant-section .applicant-item{display:flex;align-items:center;gap:.75rem;border-radius:.5rem;background-color:#fff;transition:all .2s ease;cursor:pointer;margin-bottom:.75rem}.applicant-section .applicant-item:has(.p-radiobutton-box.p-highlight) .applicant-label{color:#0f8bfd;font-weight:600}.applicant-section .applicant-label{font-size:.95rem;color:#495057;cursor:pointer;-webkit-user-select:none;user-select:none;flex:1;font-weight:500;margin:0;transition:color .2s ease}@media (max-width: 768px){.applicant-section .applicant-item{margin-bottom:.5rem;padding:.75rem;min-height:50px}.applicant-section .applicant-label{font-size:.9rem}.document-upload-container{padding:.75rem}.assignment-section,.applicant-section,.category-section,.document-type-section,.file-upload-section{margin-bottom:1rem}}.category-section .p-dropdown,.document-type-section .p-dropdown{width:100%!important;min-width:100%!important}.category-section .p-dropdown-panel,.document-type-section .p-dropdown-panel{width:100%!important}:host ::ng-deep .p-dropdown{width:100%!important}:host ::ng-deep .p-dropdown-panel{width:100%!important}.applicant-list{display:none}\n"] }]
|
|
3307
|
+
}], ctorParameters: () => [{ type: DocumentUploadService }, { type: DocumentService }, { type: i3.PrimeNGConfig }, { type: FileFormatService }, { type: i3.MessageService }, { type: i0.ChangeDetectorRef }, { type: DocumentUploadBusinessService }, { type: DocumentUploadFormService }, { type: DocumentUploadDataService }], propDecorators: { contextId: [{
|
|
3256
3308
|
type: Input
|
|
3257
3309
|
}], fileUploader: [{
|
|
3258
3310
|
type: ViewChild,
|
|
@@ -3423,19 +3475,7 @@ class UserListService {
|
|
|
3423
3475
|
this.documentQuery = documentQuery;
|
|
3424
3476
|
}
|
|
3425
3477
|
getInitials(name) {
|
|
3426
|
-
|
|
3427
|
-
return SHARED.EMPTY;
|
|
3428
|
-
}
|
|
3429
|
-
const words = name.trim().split(SHARED.EMPTY_SPACE).filter(word => word.length > SHARED.INITIAL_COUNT);
|
|
3430
|
-
if (words.length === 1) {
|
|
3431
|
-
return words[0].substring(0, 2).toUpperCase();
|
|
3432
|
-
}
|
|
3433
|
-
else if (words.length >= 2) {
|
|
3434
|
-
const firstWord = words[0];
|
|
3435
|
-
const lastWord = words[words.length - 1];
|
|
3436
|
-
return (firstWord.charAt(0) + lastWord.charAt(0)).toUpperCase();
|
|
3437
|
-
}
|
|
3438
|
-
return SHARED.EMPTY;
|
|
3478
|
+
return name.substring(0, 2).toUpperCase();
|
|
3439
3479
|
}
|
|
3440
3480
|
getColorByIndex(index) {
|
|
3441
3481
|
const colors = SHARED.COLORS;
|
|
@@ -3641,7 +3681,7 @@ class UserListComponent {
|
|
|
3641
3681
|
this.categoriesSubscription.unsubscribe();
|
|
3642
3682
|
}
|
|
3643
3683
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UserListComponent, deps: [{ token: DocumentHelperService }, { token: DocumentStore }, { token: DocumentQuery }, { token: UserListService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3644
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UserListComponent, isStandalone: false, selector: "lib-user-list", inputs: { userList: "userList", categories: "categories" }, outputs: { userSelected: "userSelected" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n <div class=\"user-cards\">\r\n <div \r\n *ngFor=\"let user of filteredUserData\" \r\n class=\"user-card\"\r\n [class.selected]=\"selectedUser === user.name\"\r\n [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n (click)=\"onUserSelect(user.name, user._id)\"\r\n >\r\n @if(user.name === \"Application Docs\"){\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n </div>\r\n }@else {\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\">{{ user.initials }}</span>\r\n </div>\r\n }\r\n <div class=\"user-info\">\r\n <div class=\"username\">{{ user.name }}</div>\r\n <div class=\"document-counts\">\r\n
|
|
3684
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: UserListComponent, isStandalone: false, selector: "lib-user-list", inputs: { userList: "userList", categories: "categories" }, outputs: { userSelected: "userSelected" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n <div class=\"user-cards\">\r\n <div \r\n *ngFor=\"let user of filteredUserData\" \r\n class=\"user-card\"\r\n [class.selected]=\"selectedUser === user.name\"\r\n [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n (click)=\"onUserSelect(user.name, user._id)\"\r\n >\r\n @if(user.name === \"Application Docs\"){\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n </div>\r\n }@else {\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\">{{ user.initials }}</span>\r\n </div>\r\n }\r\n <div class=\"user-info\">\r\n <div class=\"username\">{{ user.name }}</div>\r\n <div class=\"document-counts\">\r\n {{ user.approved }} approved / {{ user.pending }} pending\r\n </div>\r\n </div>\r\n <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n <i class=\"ri-check-line\"></i>\r\n </div>\r\n </div>\r\n \r\n <!-- Show message when filtered list is empty -->\r\n <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n <p>No users available for this category.</p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], animations: [
|
|
3645
3685
|
trigger('slideInFromTop', [
|
|
3646
3686
|
state('void', style({
|
|
3647
3687
|
opacity: 0,
|
|
@@ -3699,7 +3739,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImpo
|
|
|
3699
3739
|
animate('200ms ease-in-out')
|
|
3700
3740
|
])
|
|
3701
3741
|
])
|
|
3702
|
-
], template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n <div class=\"user-cards\">\r\n <div \r\n *ngFor=\"let user of filteredUserData\" \r\n class=\"user-card\"\r\n [class.selected]=\"selectedUser === user.name\"\r\n [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n (click)=\"onUserSelect(user.name, user._id)\"\r\n >\r\n @if(user.name === \"Application Docs\"){\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n </div>\r\n }@else {\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\">{{ user.initials }}</span>\r\n </div>\r\n }\r\n <div class=\"user-info\">\r\n <div class=\"username\">{{ user.name }}</div>\r\n <div class=\"document-counts\">\r\n
|
|
3742
|
+
], template: "<div class=\"user-list-container\" [@slideInFromTop]>\r\n <div class=\"user-cards\">\r\n <div \r\n *ngFor=\"let user of filteredUserData\" \r\n class=\"user-card\"\r\n [class.selected]=\"selectedUser === user.name\"\r\n [style.border-color]=\"selectedUser === user.name ? '#f97316' : 'transparent'\"\r\n (click)=\"onUserSelect(user.name, user._id)\"\r\n >\r\n @if(user.name === \"Application Docs\"){\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\"><i class=\"pi pi-user\"></i></span>\r\n </div>\r\n }@else {\r\n <div class=\"user-avatar\" [ngClass]=\"'avatar-' + user.color\">\r\n <span class=\"initials\">{{ user.initials }}</span>\r\n </div>\r\n }\r\n <div class=\"user-info\">\r\n <div class=\"username\">{{ user.name }}</div>\r\n <div class=\"document-counts\">\r\n {{ user.approved }} approved / {{ user.pending }} pending\r\n </div>\r\n </div>\r\n <div class=\"selection-indicator\" *ngIf=\"selectedUser === user.name\" [@fadeIn]>\r\n <i class=\"ri-check-line\"></i>\r\n </div>\r\n </div>\r\n \r\n <!-- Show message when filtered list is empty -->\r\n <div *ngIf=\"filteredUserData.length === 0 && shouldShowContainer\" class=\"no-users-message\" [@slideInFromTop]>\r\n <p>No users available for this category.</p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: [".user-list-container{padding:1rem}.user-cards{display:flex;flex-wrap:wrap;gap:1rem;transition:all .3s ease-in-out}.user-card{display:flex;align-items:center;gap:.75rem;padding:1rem;border:2px solid transparent;border-radius:8px;cursor:pointer;transition:all .2s ease;background:#fff;box-shadow:0 2px 4px #0000001a;min-width:284px;max-width:284px;height:80px;position:relative;flex-shrink:0}.user-card:hover{box-shadow:0 4px 8px #00000026}.user-card.selected{background-color:#f8fafc;box-shadow:0 4px 8px #00000026;border-width:2px}.user-avatar{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:#fff;font-size:14px;flex-shrink:0}.avatar-orange{background-color:#f97316}.avatar-blue{background-color:#3b82f6}.avatar-green{background-color:#10b981}.avatar-grey{background-color:#6b7280}.avatar-purple{background-color:#8b5cf6}.user-info{flex:1;min-width:0;overflow:hidden}.username{font-weight:600;color:#1f2937;margin-bottom:.25rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.document-counts{font-size:.875rem;color:#6b7280;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.selection-indicator{position:absolute;top:8px;right:8px;width:20px;height:20px;background-color:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;flex-shrink:0}.no-users-message{display:flex;justify-content:center;align-items:center;padding:2rem;background:#f8fafc;border-radius:8px;border:2px dashed #d1d5db;margin:1rem 0}.no-users-message p{color:#6b7280;font-size:.875rem;font-weight:500;margin:0;text-align:center}\n"] }]
|
|
3703
3743
|
}], ctorParameters: () => [{ type: DocumentHelperService }, { type: DocumentStore }, { type: DocumentQuery }, { type: UserListService }, { type: i0.ChangeDetectorRef }], propDecorators: { userList: [{
|
|
3704
3744
|
type: Input
|
|
3705
3745
|
}], categories: [{
|
|
@@ -3850,19 +3890,12 @@ class DocumentSearchComponent {
|
|
|
3850
3890
|
this.searchTerm = SHARED.EMPTY;
|
|
3851
3891
|
this.documentHelperService.setSearchKey(null);
|
|
3852
3892
|
}
|
|
3853
|
-
/**
|
|
3854
|
-
* Clears all filters including search, menu item, user, and status selections
|
|
3855
|
-
*/
|
|
3856
|
-
onClearAllFilters() {
|
|
3857
|
-
this.searchTerm = SHARED.EMPTY;
|
|
3858
|
-
this.documentHelperService.clearSelectionState();
|
|
3859
|
-
}
|
|
3860
3893
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentSearchComponent, deps: [{ token: DocumentHelperService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3861
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentSearchComponent, isStandalone: false, selector: "document-search", inputs: { contextId: "contextId" }, outputs: { onActionClick: "onActionClick" }, ngImport: i0, template: "<div class=\"search-container\">\r\n <div class=\"search-input-wrapper\">\r\n <i class=\"pi pi-search search-icon\"></i>\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchInputChange($event)\"\r\n class=\"search-input\"\r\n placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n [attr.aria-label]=\"'Search documents'\"\r\n />\r\n <button \r\n *ngIf=\"searchTerm\"\r\n type=\"button\"\r\n class=\"clear-button\"\r\n (click)=\"onClearSearch()\"\r\n [attr.aria-label]=\"'Clear search'\"\r\n >\r\n <i class=\"pi pi-times\"></i>\r\n </button>\r\n </div>\r\n\r\n <button \r\n type=\"button\"\r\n class=\"
|
|
3894
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: DocumentSearchComponent, isStandalone: false, selector: "document-search", inputs: { contextId: "contextId" }, outputs: { onActionClick: "onActionClick" }, ngImport: i0, template: "<div class=\"search-container\">\r\n <div class=\"search-input-wrapper\">\r\n <i class=\"pi pi-search search-icon\"></i>\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchInputChange($event)\"\r\n class=\"search-input\"\r\n placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n [attr.aria-label]=\"'Search documents'\"\r\n />\r\n <button \r\n *ngIf=\"searchTerm\"\r\n type=\"button\"\r\n class=\"clear-button\"\r\n (click)=\"onClearSearch()\"\r\n [attr.aria-label]=\"'Clear search'\"\r\n >\r\n <i class=\"pi pi-times\"></i>\r\n </button>\r\n </div>\r\n \r\n <button \r\n type=\"button\"\r\n class=\"action-button\"\r\n (click)=\"onActionClick.emit()\"\r\n [attr.aria-label]=\"'Open actions menu'\"\r\n >\r\n Actions\r\n </button>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:space-between;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:40%}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.action-button{width:100%;justify-content:center}}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
|
|
3862
3895
|
}
|
|
3863
3896
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentSearchComponent, decorators: [{
|
|
3864
3897
|
type: Component,
|
|
3865
|
-
args: [{ selector: 'document-search', standalone: false, template: "<div class=\"search-container\">\r\n <div class=\"search-input-wrapper\">\r\n <i class=\"pi pi-search search-icon\"></i>\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchInputChange($event)\"\r\n class=\"search-input\"\r\n placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n [attr.aria-label]=\"'Search documents'\"\r\n />\r\n <button \r\n *ngIf=\"searchTerm\"\r\n type=\"button\"\r\n class=\"clear-button\"\r\n (click)=\"onClearSearch()\"\r\n [attr.aria-label]=\"'Clear search'\"\r\n >\r\n <i class=\"pi pi-times\"></i>\r\n </button>\r\n </div>\r\n\r\n <button \r\n type=\"button\"\r\n class=\"
|
|
3898
|
+
args: [{ selector: 'document-search', standalone: false, template: "<div class=\"search-container\">\r\n <div class=\"search-input-wrapper\">\r\n <i class=\"pi pi-search search-icon\"></i>\r\n <input \r\n type=\"text\" \r\n [(ngModel)]=\"searchTerm\"\r\n (ngModelChange)=\"onSearchInputChange($event)\"\r\n class=\"search-input\"\r\n placeholder=\"Search by document name, category, type, status or applicant name...\"\r\n [attr.aria-label]=\"'Search documents'\"\r\n />\r\n <button \r\n *ngIf=\"searchTerm\"\r\n type=\"button\"\r\n class=\"clear-button\"\r\n (click)=\"onClearSearch()\"\r\n [attr.aria-label]=\"'Clear search'\"\r\n >\r\n <i class=\"pi pi-times\"></i>\r\n </button>\r\n </div>\r\n \r\n <button \r\n type=\"button\"\r\n class=\"action-button\"\r\n (click)=\"onActionClick.emit()\"\r\n [attr.aria-label]=\"'Open actions menu'\"\r\n >\r\n Actions\r\n </button>\r\n</div> ", styles: [".search-container{display:flex;align-items:center;gap:1rem;width:100%;justify-content:space-between;padding:10px}.search-input-wrapper{position:relative;flex:1;display:flex;align-items:center;max-width:40%}.search-icon{position:absolute;left:12px;color:#6c757d;z-index:1}.search-input{width:100%;padding:12px 40px;border:1px solid #dee2e6;border-radius:8px;font-size:14px;outline:none;transition:border-color .2s ease,box-shadow .2s ease}.search-input:focus{border-color:#0f8bfd;box-shadow:0 0 0 3px #0f8bfd1a}.search-input::placeholder{color:#6c757d}.clear-button{position:absolute;right:12px;background:none;border:none;color:#6c757d;cursor:pointer;padding:4px;border-radius:4px;transition:background-color .2s ease,color .2s ease}.clear-button:hover{background-color:#f8f9fa;color:#495057}.action-button{background-color:#0f8bfd;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease,transform .1s ease;white-space:nowrap}.action-button:hover{background-color:#0d7ae6;transform:translateY(-1px)}.action-button:active{transform:translateY(0)}.action-button:focus{outline:none;box-shadow:0 0 0 3px #0f8bfd4d}@media (max-width: 768px){.search-container{flex-direction:column;gap:.75rem}.search-input-wrapper{max-width:100%}.action-button{width:100%;justify-content:center}}\n"] }]
|
|
3866
3899
|
}], ctorParameters: () => [{ type: DocumentHelperService }], propDecorators: { contextId: [{
|
|
3867
3900
|
type: Input
|
|
3868
3901
|
}], onActionClick: [{
|
|
@@ -6128,7 +6161,7 @@ class DocumentsMenuComponent {
|
|
|
6128
6161
|
return this.selectedMenuItemId;
|
|
6129
6162
|
}
|
|
6130
6163
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentsMenuComponent, deps: [{ token: DocumentStore }, { token: DocumentQuery }, { token: DocumentMenuService }, { token: DocumentHelperService }], target: i0.ɵɵFactoryTarget.Component });
|
|
6131
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DocumentsMenuComponent, isStandalone: false, selector: "lib-documents-menu", inputs: { catagories: "catagories", applicationNumber: "applicationNumber", contextId: "contextId" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"document-sidebar-container h-full\">\r\n <p-card class=\"widget-menu-wrapper h-full\">\r\n @if(applicationNumber){\r\n <div class=\"flex align-items-center justify-content-between widget-menu-header-wrapper\">\r\n <p class=\"mb-0 application-title-wrapper\">ID - {{applicationNumber}}</p>\r\n <div class=\"expand-icon-wrapper\">\r\n <i class=\"ri-arrow-left-s-line text-primary flex align-items-center justify-content-center w-full h-full\"></i>\r\n </div>\r\n </div>\r\n }\r\n\r\n <div class=\"widget-menu-container\" >\r\n <div class=\"widget-menu-wrapper h-ful l custom-scroll\">\r\n <p-menu [model]=\"categories\" styleClass=\"w-full md:w-15rem\">\r\n <ng-template pTemplate=\"submenuheader\" let-item>\r\n <span [style]=\"{\r\n color : '#9EA0B3'\r\n }\">{{ item.label === 'Application' ? 'Application Documents' : item.label }}</span>\r\n </ng-template>\r\n <ng-template pTemplate=\"item\" let-item>\r\n <a pRipple \r\n class=\"flex align-items-center p-menuitem-link\"\r\n [class.selected-menu-item]=\"selectedMenuItemId === item._id\"\r\n (click)=\"onMenuItemClick($event, item)\">\r\n <span [class]=\"item.icon\" class=\"text-xl\"></span>\r\n <span class=\"ml-2\">{{ item.label }}</span>\r\n <p-badge *ngIf=\"item.menuData?.shouldShowBadge\" \r\n class=\"ml-auto\" \r\n [severity]=\"item.menuData?.badgeSeverity\" \r\n [value]=\"item.menuData?.badgeValue\" />\r\n </a>\r\n </ng-template>\r\n </p-menu>\r\n </div>\r\n </div>\r\n </p-card>\r\n</div>\r\n\r\n ", styles: [".expand-icon-wrapper{border:1px solid var(--primary-color);height:24px;width:24px;border-radius:50%;background:var(--blue-bg-light)}::ng-deep .p-badge.p-badge-success{background-color:#dcfce7;color:#16a34a;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-danger{background-color:#fee2e2;color:#dc2626;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-warning{background-color:#fef3c7;color:#d97706;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-menu .p-menuitem>.p-menuitem-content .p-menuitem-link{color:#1f2937}@media screen and (min-width: 768px){::ng-deep .md\\:w-15rem{width:100%!important}}::ng-deep .p-menu .p-menuitem:not(p-highlight):not(p-disabled)>.p-menuitem-content:hover{color:#06f!important;border:none!important}::ng-deep .p-menu{border:none}::ng-deep .custom-scroll{scrollbar-gutter:inherit}::ng-deep .selected-menu-item{background-color:#0066ff1a!important;color:var(--primary-color)!important;border:1px solid rgba(68,72,109,.1)!important;border-radius:10px!important}::ng-deep .selected-menu-item .text-xl{color:var(--primary-color)!important}::ng-deep .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important}::ng-deep .p-menuitem-link:not(.selected-menu-item) .text-xl{color:var(--text-color)!important}::ng-deep .p-panelmenu .p-panelmenu-content{border:none!important}.application-title-wrapper{color:#9ea0b3;font-weight:500}.widget-menu-wrapper{margin-top:8px}.widget-menu-header-wrapper{padding:4px 4px 4px 16px}.widget-menu-container{height:calc(100% - 38px)}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}::ng-deep .document-sidebar-container .p-card{height:100%;box-shadow:none}::ng-deep .document-sidebar-container .p-card .p-card-content{height:100%;padding:0!important}::ng-deep .document-sidebar-container .p-card .p-card-body{height:100%;width:100%;padding:12px 8px;border-radius:10px;border:1px solid #e5e7eb}::ng-deep .document-sidebar-container .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content{border:none;color:var(--text-color);font-weight:400!important;background-color:var(--surface-0)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action{color:var(--text-color);font-weight:400!important;position:relative;padding:12px}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{position:absolute;right:0;top:16px;margin-right:7px;transform:rotate(90deg)!important;transition:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .company-action-wrapper:not(.p-disabled).p-highlight .p-panelmenu-header-content{margin:12px 0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content{background-color:transparent!important;border-radius:10px;padding:12px;border-bottom:0!important;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{transform:rotate(180deg)!important;transition:none!important;top:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link{background-color:#fff!important;color:var(--text-color);padding:12px 6px!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);box-shadow:none!important;background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem.p-focus>.p-menuitem-content{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-focus)>.p-menuitem-content .p-menuitem-link{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important;color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-icon{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-text{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:1px solid rgba(68,72,109,.1)!important;border-top:0!important;border-bottom-left-radius:10px;border-bottom-right-radius:10px}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator{border-top:1px solid rgba(68,72,109,.1)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}.no-documents-message{padding:12px 16px;text-align:center}.no-documents-message .text-muted{color:#9ea0b3;font-size:14px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7$2.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }, { kind: "component", type: i8$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i9$1.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }] });
|
|
6164
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.14", type: DocumentsMenuComponent, isStandalone: false, selector: "lib-documents-menu", inputs: { catagories: "catagories", applicationNumber: "applicationNumber", contextId: "contextId" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"document-sidebar-container h-full\">\r\n <p-card class=\"widget-menu-wrapper h-full\">\r\n @if(applicationNumber){\r\n <div class=\"flex align-items-center justify-content-between widget-menu-header-wrapper\">\r\n <p class=\"mb-0 application-title-wrapper\">ID - {{applicationNumber}}</p>\r\n <div class=\"expand-icon-wrapper\">\r\n <i class=\"ri-arrow-left-s-line text-primary flex align-items-center justify-content-center w-full h-full\"></i>\r\n </div>\r\n </div>\r\n }\r\n\r\n <div class=\"widget-menu-container\" >\r\n <div class=\"widget-menu-wrapper h-ful l custom-scroll\">\r\n <p-menu [model]=\"categories\" styleClass=\"w-full md:w-15rem\">\r\n <ng-template pTemplate=\"submenuheader\" let-item>\r\n <span [style]=\"{\r\n color : '#9EA0B3'\r\n }\">{{ item.label === 'Application' ? 'Application Documents' : item.label }}</span>\r\n </ng-template>\r\n <ng-template pTemplate=\"item\" let-item>\r\n <a pRipple \r\n class=\"flex align-items-center p-menuitem-link\"\r\n [class.selected-menu-item]=\"selectedMenuItemId === item._id\"\r\n (click)=\"onMenuItemClick($event, item)\">\r\n <span [class]=\"item.icon\" class=\"text-xl\"></span>\r\n <span class=\"ml-2\">{{ item.label }}</span>\r\n <p-badge *ngIf=\"item.menuData?.shouldShowBadge\" \r\n class=\"ml-auto\" \r\n [severity]=\"item.menuData?.badgeSeverity\" \r\n [value]=\"item.menuData?.badgeValue\" />\r\n </a>\r\n </ng-template>\r\n </p-menu>\r\n </div>\r\n </div>\r\n </p-card>\r\n</div>\r\n\r\n ", styles: [".expand-icon-wrapper{border:1px solid var(--primary-color);height:24px;width:24px;border-radius:50%;background:var(--blue-bg-light)}::ng-deep .p-badge.p-badge-success{background-color:#dcfce7;color:#16a34a;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-danger{background-color:#fee2e2;color:#dc2626;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-badge.p-badge-warning{background-color:#fef3c7;color:#d97706;font-family:inherit;font-size:12px;font-weight:400;font-style:inherit}::ng-deep .p-menu .p-menuitem>.p-menuitem-content .p-menuitem-link{color:#1f2937}@media screen and (min-width: 768px){::ng-deep .md\\:w-15rem{width:100%!important}}::ng-deep .p-menu .p-menuitem:not(p-highlight):not(p-disabled)>.p-menuitem-content:hover{color:#06f!important;border:none!important}::ng-deep .p-menu{border:none}::ng-deep .custom-scroll{scrollbar-gutter:inherit}::ng-deep .selected-menu-item{background-color:#0066ff1a!important;color:var(--primary-color)!important;border:1px solid rgba(68,72,109,.1)!important;border-radius:10px!important}::ng-deep .selected-menu-item .text-xl{color:var(--primary-color)!important}::ng-deep .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important}::ng-deep .p-menuitem-link:not(.selected-menu-item) .text-xl{color:var(--text-color)!important}::ng-deep .p-panelmenu .p-panelmenu-content{border:none!important}.application-title-wrapper{color:#9ea0b3;font-weight:500}.widget-menu-wrapper{margin-top:8px}.widget-menu-header-wrapper{padding:4px 4px 4px 16px}.widget-menu-container{height:calc(100% - 38px)}.custom-scroll{overflow-y:hidden;scrollbar-gutter:stable}.custom-scroll:hover{overflow-y:auto}::ng-deep .document-sidebar-container .p-card{height:100%;box-shadow:none}::ng-deep .document-sidebar-container .p-card .p-card-content{height:100%;padding:0!important}::ng-deep .document-sidebar-container .p-card .p-card-body{height:100%;width:100%;padding:12px 8px;border-radius:10px;border:1px solid #e5e7eb}::ng-deep .document-sidebar-container .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content{border:none;color:var(--text-color);font-weight:400!important;background-color:var(--surface-0)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action{color:var(--text-color);font-weight:400!important;position:relative;padding:12px}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{position:absolute;right:0;top:16px;margin-right:7px;transform:rotate(90deg)!important;transition:none!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-panelmenu-header-action .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-header .p-panelmenu-header-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .company-action-wrapper:not(.p-disabled).p-highlight .p-panelmenu-header-content{margin:12px 0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content{background-color:transparent!important;border-radius:10px;padding:12px;border-bottom:0!important;border-bottom-left-radius:0!important;border-bottom-right-radius:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .no-highlight.p-panelmenu-header:not(.p-disabled).p-highlight .p-panelmenu-header-content .p-panelmenu-header-action .p-icon-wrapper{transform:rotate(180deg)!important;transition:none!important;top:0!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link{background-color:#fff!important;color:var(--text-color);padding:12px 6px!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link .p-menuitem-text{max-width:75%;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal;word-break:break-all}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active{border:1px solid rgba(68,72,109,.1);border-radius:10px;padding:12px;color:var(--primary-color);box-shadow:none!important;background-color:#0066ff1a!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-icon{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link-active .p-menuitem-text{color:var(--primary-color)}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem.p-focus>.p-menuitem-content{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem:not(.p-focus)>.p-menuitem-content .p-menuitem-link{background-color:#fff!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item){background-color:#fff!important;border:none!important;border-radius:0!important;color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-icon{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu .p-panelmenu-content .p-menuitem>.p-menuitem-content .p-menuitem-link:not(.selected-menu-item) .p-menuitem-text{color:var(--text-color)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .p-panelmenu-expanded .p-panelmenu-content{border:1px solid rgba(68,72,109,.1)!important;border-top:0!important;border-bottom-left-radius:10px;border-bottom-right-radius:10px}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator{border-top:1px solid rgba(68,72,109,.1)!important}::ng-deep .widget-menu-wrapper .p-panelmenu-panel .widget-separator .p-panelmenu-header-content .p-panelmenu-header-action{padding:0!important}.no-documents-message{padding:12px 16px;text-align:center}.no-documents-message .text-muted{color:#9ea0b3;font-size:14px;font-style:italic}\n"], dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i7$2.Badge, selector: "p-badge", inputs: ["styleClass", "style", "badgeSize", "severity", "value", "badgeDisabled", "size"] }, { kind: "component", type: i8$1.Menu, selector: "p-menu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "ariaLabel", "ariaLabelledBy", "id", "tabindex"], outputs: ["onShow", "onHide", "onBlur", "onFocus"] }, { kind: "component", type: i9.Card, selector: "p-card", inputs: ["header", "subheader", "style", "styleClass"] }] });
|
|
6132
6165
|
}
|
|
6133
6166
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: DocumentsMenuComponent, decorators: [{
|
|
6134
6167
|
type: Component,
|