Cap-shared NPM

cap-shared Library Installation

Install cap-shared library

Run npm install cap-shared

Import cap-shared library assets

Edit your angular.json file and add the following lines to your build assets: { "glob": "*/", "input": "./node_modules/cap-shared/src/assets/", "output": "/cap-shared/" }

Import cap-shared localization resources

In your app.module.ts add cap-shared/i18n path to the MultiTranslateHttpLoader param:

export function HttpLoaderFactory(httpClient: HttpClient) { return new MultiTranslateHttpLoader(httpClient, { prefix: './assets/i18n/', suffix: '.json' }, { prefix: './cap-shared/i18n/', suffix: '.json' } ); }

Use cap-shared assets

Reference cap-shared assets using their path in dist folder (e.g. "/cap-shared/faq/en-faq.json")

Manage Attachment

Use css in page.scss .modal-dialog-attachment-container .modal-dialog { -webkit-transform: none; transform: none; z-index: 1000; max-width: 1110px !important; overflow: auto; background-color: #fff; margin: 0 auto; border-radius: 4px; top: 50px; }

.modal-dialog-attachment-container { top: 0; }

Configuration Setting:

=>result = [] contain data from backend this.configuration = new AttachmentConfiguration(); this.configuration.header = { label: 'app.attachmentTooltipPlaceholder', value: 'DCN001' }; this.configuration.data = []; result.forEach(item => { let optional: Array = []; optional.push({ key: 'workItemId', value: item.workItemId }); optional.push({ key: 'modifyDate', value: item.modifyDate }); this.configuration.data.push({ attachmentId: item.attachmentId, fileName: item.fileName, description: '', createdDate: item.uploadDate, size: this.AttachmentDataService.formatBytes(item.fileSize, 0), optional: optional }); }); this.configuration.gridConfig = { pageSize: 10, pageHeight: 500, gridColumns: { label: 'app.workItemName', value: 'workItemId', isExternal: true }, { label: 'app.modifyDate', value: 'modifyDate', isExternal: true }, { label: 'app.fileName', value: 'fileName' }, { label: 'app.description', value: 'description' }, { label: 'app.size', value: 'size' } };

this.configuration.actions = [
  AttachmentAction.Delete,
  AttachmentAction.Download,
  AttachmentAction.Preview,
  AttachmentAction.Edit,
  AttachmentAction.Replace
];
this.configuration.viewMode = {
  type: ViewType.Edit,
  mode: ViewMode.Detail,
  displayType: DisplayType.Both
};