consolidate state css colors

This commit is contained in:
Maximilian Krambach 2019-03-01 09:41:53 +01:00
parent 08e076f4a4
commit b704a3b09f
7 changed files with 20 additions and 51 deletions

View File

@ -52,15 +52,7 @@
<ng-container matColumnDef="state">
<mat-header-cell *matHeaderCellDef> <span translate>State</span> </mat-header-cell>
<mat-cell class="chip-container" *matCellDef="let motion">
<mat-basic-chip
disableRipple
[ngClass]="{
green: motion.state.css_class === 'success',
red: motion.state.css_class === 'danger',
grey: motion.state.css_class === 'default',
lightblue: motion.state.css_class === 'primary'
}"
>
<mat-basic-chip disableRipple [ngClass]="motion.stateCssColor">
{{ getStateLabel(motion) }}
</mat-basic-chip>
</mat-cell>

View File

@ -231,7 +231,7 @@
</div>
</mat-menu>
<div *ngIf="perms.isAllowed('change_state', motion)">
<mat-basic-chip [matMenuTriggerFor]="stateMenu" [ngClass]="getStateCssColor()">
<mat-basic-chip [matMenuTriggerFor]="stateMenu" [ngClass]="motion.stateCssColor">
{{ stateLabel }}
</mat-basic-chip>
<div *ngIf="motion.state && motion.state.show_state_extension_field" class="spacer-top-10">
@ -242,7 +242,7 @@
</div>
</div>
<div *ngIf="!perms.isAllowed('change_state', motion)">
<mat-basic-chip [ngClass]="getStateCssColor()"> {{ stateLabel }} </mat-basic-chip>
<mat-basic-chip [ngClass]="motion.stateCssColor"> {{ stateLabel }} </mat-basic-chip>
</div>
</div>

View File

@ -38,7 +38,7 @@ import { StatuteParagraphRepositoryService } from 'app/core/repositories/motions
import { Tag } from 'app/shared/models/core/tag';
import { UserRepositoryService } from 'app/core/repositories/users/user-repository.service';
import { ViewMotionBlock } from '../../models/view-motion-block';
import { ViewWorkflow, StateCssClassMapping } from '../../models/view-workflow';
import { ViewWorkflow } from '../../models/view-workflow';
import { ViewUser } from 'app/site/users/models/view-user';
import { ViewCategory } from '../../models/view-category';
import { ViewCreateMotion } from '../../models/view-create-motion';
@ -1448,19 +1448,6 @@ export class MotionDetailComponent extends BaseViewComponent implements OnInit,
}
}
/**
* Translate the state's css class into a color
*
* @returns a string representing a color
*/
public getStateCssColor(): string {
if (!this.motion.state) {
return '';
}
return StateCssClassMapping[this.motion.state.css_class] || '';
}
public swipe(e: TouchEvent, when: string): void {
const coord: [number, number] = [e.changedTouches[0].pageX, e.changedTouches[0].pageY];
const time = new Date().getTime();

View File

@ -78,16 +78,7 @@
</div>
<!-- state line-->
<div class="ellipsis-overflow white">
<mat-basic-chip
*ngIf="motion.state"
[ngClass]="{
green: motion.state.css_class === 'success',
red: motion.state.css_class === 'danger',
grey: motion.state.css_class === 'default',
lightblue: motion.state.css_class === 'primary'
}"
[disabled]="true"
>
<mat-basic-chip *ngIf="motion.state" [ngClass]="motion.stateCssColor" [disabled]="true">
{{ getStateLabel(motion) }}
</mat-basic-chip>
</div>

View File

@ -7,7 +7,7 @@ import { Title } from '@angular/platform-browser';
import { TranslateService } from '@ngx-translate/core';
import { BaseViewComponent } from 'app/site/base/base-view';
import { ViewWorkflow } from '../../models/view-workflow';
import { ViewWorkflow, StateCssClassMapping } from '../../models/view-workflow';
import { WorkflowRepositoryService } from 'app/core/repositories/motions/workflow-repository.service';
import { WorkflowState, MergeAmendment } from 'app/shared/models/motions/workflow-state';
import { PromptService } from 'app/core/ui-services/prompt.service';
@ -90,7 +90,7 @@ export class WorkflowDetailComponent extends BaseViewComponent implements OnInit
/**
* Determine label colors. Where they should come from is currently now know
*/
public labelColors = ['default', 'primary', 'success', 'danger'];
public labelColors = ['default', 'primary', 'success', 'danger', 'warning'];
/**
* Holds state permissions
@ -385,17 +385,6 @@ export class WorkflowDetailComponent extends BaseViewComponent implements OnInit
* @returns a string representing a color
*/
public getStateCssColor(colorLabel: string): string {
switch (colorLabel) {
case 'success':
return 'green';
case 'danger':
return 'red';
case 'default':
return 'grey';
case 'primary':
return 'lightblue';
default:
return '';
}
return StateCssClassMapping[colorLabel] || '';
}
}

View File

@ -11,7 +11,7 @@ import { ViewUser } from 'app/site/users/models/view-user';
import { ViewTag } from 'app/site/tags/models/view-tag';
import { ViewMediafile } from 'app/site/mediafiles/models/view-mediafile';
import { ViewItem } from 'app/site/agenda/models/view-item';
import { ViewWorkflow } from './view-workflow';
import { ViewWorkflow, StateCssClassMapping } from './view-workflow';
import { ViewCategory } from './view-category';
import { ViewMotionBlock } from './view-motion-block';
import { BaseViewModel } from 'app/site/base/base-view-model';
@ -327,6 +327,15 @@ export class ViewMotion extends BaseAgendaViewModel implements Searchable {
return this.personalNote && this.personalNote.note ? true : false;
}
/**
* Translate the state's css class into a color
*
* @returns a string representing a color
*/
public get stateCssColor(): string {
return StateCssClassMapping[this.state.css_class] || '';
}
/**
* This is set by the repository
*/

View File

@ -6,7 +6,8 @@ export const StateCssClassMapping = {
success: 'green',
danger: 'red',
default: 'grey',
primary: 'lightblue'
primary: 'lightblue',
warning: 'yellow'
};
/**