mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-26 17:24:56 +00:00
[ADF-1760] Process Info Drawer - The keys must be localized (#2502)
* Made all the keys localised for process header * Added style for adf-info-drawer according to zeplin specification
This commit is contained in:
parent
4e558cb162
commit
b7e00caee1
@ -93,7 +93,7 @@ describe('ProcessInstanceHeaderComponent', () => {
|
||||
component.ngOnChanges({});
|
||||
fixture.detectChanges();
|
||||
let valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-dateitem-dueDate"]');
|
||||
expect(valueEl.innerText).toBe('No date');
|
||||
expect(valueEl.innerText).toBe('PROCESS_PROPERTIES.DUE_DATE_DEFAULT');
|
||||
});
|
||||
|
||||
it('should display process category', () => {
|
||||
@ -109,7 +109,7 @@ describe('ProcessInstanceHeaderComponent', () => {
|
||||
component.ngOnChanges({});
|
||||
fixture.detectChanges();
|
||||
let valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-category"]');
|
||||
expect(valueEl.innerText).toBe('No category');
|
||||
expect(valueEl.innerText).toBe('PROCESS_PROPERTIES.CATEGORY_DEFAULT');
|
||||
});
|
||||
|
||||
it('should display created date', () => {
|
||||
@ -149,6 +149,6 @@ describe('ProcessInstanceHeaderComponent', () => {
|
||||
component.ngOnChanges({});
|
||||
fixture.detectChanges();
|
||||
let valueEl = fixture.nativeElement.querySelector('[data-automation-id="card-textitem-value-description"]');
|
||||
expect(valueEl.innerText).toBe('No description');
|
||||
expect(valueEl.innerText).toBe('PROCESS_PROPERTIES.DESCRIPTION_DEFAULT');
|
||||
});
|
||||
});
|
||||
|
@ -38,19 +38,52 @@ export class ProcessInstanceHeaderComponent implements OnChanges {
|
||||
refreshData() {
|
||||
if (this.processInstance) {
|
||||
this.properties = [
|
||||
new CardViewTextItemModel({label: 'Status:', value: this.getProcessStatus(), key: 'status'}),
|
||||
new CardViewDateItemModel({label: 'Due Date:', value: this.processInstance.ended, format: 'MMM DD YYYY', key: 'dueDate', default: 'No date'}),
|
||||
new CardViewTextItemModel({label: 'Category:', value: this.processInstance.processDefinitionCategory, key: 'category', default: 'No category'}),
|
||||
new CardViewTextItemModel(
|
||||
{
|
||||
label: 'Created By:',
|
||||
label: 'PROCESS_PROPERTIES.STATUS',
|
||||
value: this.getProcessStatus(),
|
||||
key: 'status'
|
||||
}),
|
||||
new CardViewDateItemModel(
|
||||
{
|
||||
label: 'PROCESS_PROPERTIES.DUE_DATE',
|
||||
value: this.processInstance.ended,
|
||||
format: 'MMM DD YYYY',
|
||||
key: 'dueDate',
|
||||
default: 'PROCESS_PROPERTIES.DUE_DATE_DEFAULT'
|
||||
}),
|
||||
new CardViewTextItemModel(
|
||||
{
|
||||
label: 'PROCESS_PROPERTIES.CATEGORY',
|
||||
value: this.processInstance.processDefinitionCategory,
|
||||
key: 'category',
|
||||
default: 'PROCESS_PROPERTIES.CATEGORY_DEFAULT'
|
||||
}),
|
||||
new CardViewTextItemModel(
|
||||
{
|
||||
label: 'PROCESS_PROPERTIES.CREATED_BY',
|
||||
value: this.getStartedByFullName(),
|
||||
key: 'assignee',
|
||||
default: 'No assignee'
|
||||
default: 'PROCESS_PROPERTIES.CREATED_BY_DEFAULT'
|
||||
}),
|
||||
new CardViewDateItemModel({label: 'Created:', value: this.processInstance.started, format: 'MMM DD YYYY', key: 'created'}),
|
||||
new CardViewTextItemModel({label: 'Id:', value: this.processInstance.id, key: 'id'}),
|
||||
new CardViewTextItemModel({label: 'Description:', value: this.processInstance.processDefinitionDescription, key: 'description', default: 'No description'})
|
||||
new CardViewDateItemModel(
|
||||
{
|
||||
label: 'PROCESS_PROPERTIES.CREATED',
|
||||
value: this.processInstance.started,
|
||||
format: 'MMM DD YYYY',
|
||||
key: 'created'
|
||||
}),
|
||||
new CardViewTextItemModel(
|
||||
{label: 'PROCESS_PROPERTIES.ID',
|
||||
value: this.processInstance.id,
|
||||
key: 'id'
|
||||
}),
|
||||
new CardViewTextItemModel(
|
||||
{label: 'PROCESS_PROPERTIES.DESCRIPTION',
|
||||
value: this.processInstance.processDefinitionDescription,
|
||||
key: 'description',
|
||||
default: 'PROCESS_PROPERTIES.DESCRIPTION_DEFAULT'
|
||||
})
|
||||
];
|
||||
}
|
||||
}
|
||||
|
@ -12,6 +12,19 @@
|
||||
"NONE": "No process instance filter selected."
|
||||
}
|
||||
},
|
||||
"PROCESS_PROPERTIES": {
|
||||
"STATUS": "Status",
|
||||
"DUE_DATE": "Due Date",
|
||||
"DUE_DATE_DEFAULT": "No date",
|
||||
"CATEGORY": "Category",
|
||||
"CATEGORY_DEFAULT": "No category",
|
||||
"CREATED_BY": "Created By",
|
||||
"CREATED_BY_DEFAULT": "No assignee",
|
||||
"CREATED": "Created",
|
||||
"DESCRIPTION": "Description",
|
||||
"DESCRIPTION_DEFAULT": "No description",
|
||||
"ID": "Id"
|
||||
},
|
||||
"DETAILS": {
|
||||
"LABELS": {
|
||||
"STARTED_BY": "Started by",
|
||||
|
@ -1,25 +1,51 @@
|
||||
@mixin mat-info-drawer-theme($theme) {
|
||||
$background: map-get($theme, background);
|
||||
$primary: map-get($theme, primary);
|
||||
|
||||
.adf {
|
||||
&-info-drawer-layout {
|
||||
width: 350px;
|
||||
width: 385px;
|
||||
display: block;
|
||||
padding: 8px 0;
|
||||
background-color: mat-color($background, dialog);
|
||||
background-color: #fafafa;
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.27);
|
||||
|
||||
& .mat-tab-label {
|
||||
font-family: Muli;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
color: mat-color($primary);
|
||||
}
|
||||
|
||||
&-header {
|
||||
padding: 8px 24px 24px 24px;
|
||||
padding: 13px 0px 0px 23px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 20px;
|
||||
margin-bottom: 40px;
|
||||
|
||||
&-buttons {
|
||||
mat-icon {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
&-title {
|
||||
width: 197px;
|
||||
height: 32px;
|
||||
opacity: 0.54;
|
||||
font-family: Helvetica;
|
||||
font-size: 20px;
|
||||
line-height: 1.6;
|
||||
letter-spacing: -0.5px;
|
||||
text-align: left;
|
||||
color: #000000;
|
||||
|
||||
& > div {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-content {
|
||||
|
Loading…
x
Reference in New Issue
Block a user