Auto Actions front-end behaviors complete
This commit is contained in:
parent
b3ddb51619
commit
5a35d71131
@ -2,9 +2,9 @@
|
||||
use MyCLabs\Enum\Enum;
|
||||
|
||||
class ActionTrigger extends Enum {
|
||||
const MOVE_TO_COLUMN = 1;
|
||||
const MOVED_TO_COLUMN = 1;
|
||||
const ASSIGNED_TO_USER = 2;
|
||||
const SET_TO_CATEGORY = 3;
|
||||
const ADDED_TO_CATEGORY = 3;
|
||||
const POINTS_CHANGED = 4;
|
||||
}
|
||||
|
||||
|
@ -4,8 +4,10 @@ use MyCLabs\Enum\Enum;
|
||||
class ActionType extends Enum {
|
||||
const SET_COLOR = 1;
|
||||
const SET_CATEGORY = 2;
|
||||
const SET_ASSIGNEE = 3;
|
||||
const CLEAR_DUE_DATE = 4;
|
||||
const USE_BASE_COLOR = 5;
|
||||
const ADD_CATEGORY = 3;
|
||||
const CLEAR_ALL_CATEGORIES = 4;
|
||||
const SET_ASSIGNEE = 5;
|
||||
const CLEAR_DUE_DATE = 6;
|
||||
const ALTER_COLOR_BY_POINTS= 7;
|
||||
}
|
||||
|
||||
|
@ -55,25 +55,29 @@
|
||||
<tbody>
|
||||
<tr class="borderless">
|
||||
<td>
|
||||
<select [(ngModel)]="newAction.board_id">
|
||||
<option value="null">Select Board...</option>
|
||||
<select [(ngModel)]="newAction.board_id"
|
||||
(change)="updateTriggerSources()">
|
||||
<option [ngValue]="null">Select Board...</option>
|
||||
<option *ngFor="let board of boards"
|
||||
[value]="board.id">
|
||||
[ngValue]="board.id">
|
||||
{{ board.name }}
|
||||
</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select [disabled]="newAction.board_id === null"
|
||||
[ngModel]="newAction.trigger"
|
||||
[(ngModel)]="newAction.trigger"
|
||||
(change)="updateTriggerSources()">
|
||||
<option *ngFor="let trigger of triggers"
|
||||
[value]="trigger[0]">{{ trigger[1] }}</option>
|
||||
[ngValue]="trigger[0]">{{ trigger[1] }}</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select [disabled]="newAction.board_id === null">
|
||||
<option>Set item color</option>
|
||||
<select [disabled]="newAction.board_id === null"
|
||||
[(ngModel)]="newAction.type"
|
||||
(change)="updateActionSources()">
|
||||
<option *ngFor="let type of types"
|
||||
[ngValue]="type[0]">{{ type[1] }}</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
@ -82,21 +86,33 @@
|
||||
<td>
|
||||
<select [disabled]="newAction.board_id === null"
|
||||
*ngIf="triggerSources.length"
|
||||
[(ngModel)]="newAction.source_id">
|
||||
[(ngModel)]="newAction.source_id"
|
||||
(change)="checkAddDisabled()">
|
||||
<option *ngFor="let source of triggerSources"
|
||||
[value]="source[0]">{{ source[1] }}</option>
|
||||
[ngValue]="source[0]">{{ source[1] }}</option>
|
||||
</select>
|
||||
</td>
|
||||
<td>
|
||||
<select [disabled]="newAction.board_id === null">
|
||||
<option>Select Color</option>
|
||||
<select [disabled]="newAction.board_id === null"
|
||||
[(ngModel)]="newAction.change_to"
|
||||
(change)="checkAddDisabled()"
|
||||
*ngIf="newAction.type === 2 ||
|
||||
newAction.type === 3 ||
|
||||
newAction.type === 5">
|
||||
<option *ngFor="let source of actionSources"
|
||||
[ngValue]="source[0]">{{ source[1] }}</option>
|
||||
</select>
|
||||
<input type="color" name="change-to-color"
|
||||
[disabled]="newAction.board_id === null"
|
||||
*ngIf="newAction.type == 1"
|
||||
[(ngModel)]="newAction.change_to"
|
||||
(change)="checkAddDisabled()">
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<button class="right">
|
||||
<button class="right" [disabled]="isAddDisabled">
|
||||
<i class="icon icon-plus"></i>
|
||||
Add Action
|
||||
</button>
|
||||
|
@ -22,6 +22,7 @@ import { SettingsService } from '../settings.service';
|
||||
export class AutoActions {
|
||||
private noActionsMessage: string;
|
||||
private MODAL_CONFIRM_ID: string;
|
||||
|
||||
private activeUser: User;
|
||||
private actionToRemove: AutoAction;
|
||||
private newAction: AutoAction;
|
||||
@ -32,9 +33,12 @@ export class AutoActions {
|
||||
private triggers: Array<Array<any>>;
|
||||
private triggerSources: Array<Array<any>>;
|
||||
private types: Array<Array<any>>;
|
||||
private typesList: Array<Array<any>>;
|
||||
private actionSources: Array<Array<any>>;
|
||||
|
||||
private loading = true;
|
||||
private firstRun = true;
|
||||
private isAddDisabled = true;
|
||||
private saving = false;
|
||||
|
||||
constructor(private auth: AuthService,
|
||||
@ -47,19 +51,21 @@ export class AutoActions {
|
||||
this.MODAL_CONFIRM_ID = 'action-remove-confirm';
|
||||
|
||||
this.triggers = [
|
||||
[ ActionTrigger.MoveToColumn, 'Item moves to column' ],
|
||||
[ ActionTrigger.MovedToColumn, 'Item moved to column' ],
|
||||
[ ActionTrigger.AssignedToUser, 'Item assigned to user' ],
|
||||
[ ActionTrigger.SetToCategory, 'Item set to category' ],
|
||||
[ ActionTrigger.AddedToCategory, 'Item added to category' ],
|
||||
[ ActionTrigger.PointsChanged, 'Item points change' ]
|
||||
];
|
||||
this.updateTriggerSources();
|
||||
this.types = [
|
||||
this.typesList = [
|
||||
[ ActionType.SetColor, 'Set item color'],
|
||||
[ ActionType.SetCategory, 'Set item category' ],
|
||||
[ ActionType.AddCategory, 'Add item category' ],
|
||||
[ ActionType.ClearAllCategories, 'Clear item categories' ],
|
||||
[ ActionType.SetAssignee, 'Set item assignee' ],
|
||||
[ ActionType.ClearDueDate, 'Clear item due date' ],
|
||||
[ ActionType.UseBaseColor, 'Dim item color by points' ]
|
||||
[ ActionType.ClearDueDate, 'Clear item due date' ]
|
||||
];
|
||||
this.types = this.typesList;
|
||||
|
||||
auth.userChanged
|
||||
.subscribe(activeUser => {
|
||||
@ -86,29 +92,91 @@ export class AutoActions {
|
||||
|
||||
updateTriggerSources(): void {
|
||||
this.triggerSources = [];
|
||||
this.newAction.source_id = null;
|
||||
|
||||
this.types = this.typesList;
|
||||
|
||||
switch (this.newAction.trigger) {
|
||||
case ActionTrigger.MoveToColumn:
|
||||
this.triggerSources = [ [ null, 'Select Column' ] ];
|
||||
|
||||
for (let i = 0; i < this.boards.length; ++i) {
|
||||
if (this.boards[i].id !== +this.newAction.board_id) {
|
||||
continue;
|
||||
}
|
||||
|
||||
this.boards[i].columns.forEach(column => {
|
||||
this.triggerSources.push([ column.id, column.name ]);
|
||||
});
|
||||
}
|
||||
case ActionTrigger.MovedToColumn:
|
||||
this.buildSourcesArray('triggerSources',
|
||||
'Column', 'columns');
|
||||
break;
|
||||
case ActionTrigger.AssignedToUser:
|
||||
this.buildSourcesArray('triggerSources',
|
||||
'User', 'users', 'username');
|
||||
break;
|
||||
case ActionTrigger.SetToCategory:
|
||||
case ActionTrigger.AddedToCategory:
|
||||
this.buildSourcesArray('triggerSources',
|
||||
'Category', 'categories');
|
||||
break;
|
||||
case ActionTrigger.PointsChanged:
|
||||
// Leave it empty
|
||||
// Leave triggerSources empty
|
||||
this.types = [
|
||||
[ ActionType.AlterColorByPoints, 'Alter color by points' ]
|
||||
];
|
||||
break;
|
||||
}
|
||||
|
||||
this.newAction.type = this.types ?
|
||||
this.types[0][0] : ActionType.SetColor;
|
||||
|
||||
this.checkAddDisabled();
|
||||
}
|
||||
|
||||
updateActionSources(): void {
|
||||
this.actionSources = [];
|
||||
this.newAction.change_to = null;
|
||||
|
||||
switch (this.newAction.type) {
|
||||
case ActionType.SetCategory:
|
||||
case ActionType.AddCategory:
|
||||
this.buildSourcesArray('actionSources',
|
||||
'Category', 'categories');
|
||||
break;
|
||||
case ActionType.SetAssignee:
|
||||
this.buildSourcesArray('actionSources',
|
||||
'Assignee', 'users', 'username');
|
||||
break;
|
||||
case ActionType.SetColor:
|
||||
this.newAction.change_to = '#000000';
|
||||
break;
|
||||
}
|
||||
|
||||
this.checkAddDisabled();
|
||||
}
|
||||
|
||||
checkAddDisabled(): void {
|
||||
this.isAddDisabled = false;
|
||||
|
||||
if (this.newAction.board_id !== null) {
|
||||
if (this.newAction.source_id === null) {
|
||||
this.isAddDisabled =
|
||||
(this.newAction.trigger !== ActionTrigger.PointsChanged);
|
||||
}
|
||||
|
||||
if (!this.isAddDisabled && this.newAction.change_to === null) {
|
||||
this.isAddDisabled =
|
||||
(this.newAction.type !== ActionType.ClearAllCategories &&
|
||||
this.newAction.type !== ActionType.ClearDueDate);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
private buildSourcesArray(sourceArray: string,
|
||||
name: string,
|
||||
arrayName: string,
|
||||
prop: string = 'name'): void {
|
||||
this[sourceArray] = [ [ null, 'Select ' + name ] ];
|
||||
|
||||
for (let i = 0; i < this.boards.length; ++i) {
|
||||
if (this.boards[i].id !== this.newAction.board_id) {
|
||||
continue;
|
||||
}
|
||||
|
||||
this.boards[i][arrayName].forEach((item: any) => {
|
||||
this[sourceArray].push([ item.id, item[prop] ]);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private removeAutoAction(): void {
|
||||
@ -160,7 +228,7 @@ export class AutoActions {
|
||||
this.noActionsMessage = 'There are no current automatic actions. ' +
|
||||
'Use the Add Action form below to add one.';
|
||||
|
||||
if (+activeUser.security_level === 3) {
|
||||
if (activeUser.security_level === 3) {
|
||||
this.noActionsMessage = 'There are no automatic actions. ' +
|
||||
'Contact an admin user to create one.';
|
||||
}
|
||||
|
@ -1,20 +1,22 @@
|
||||
export enum ActionTrigger {
|
||||
MoveToColumn = 1,
|
||||
MovedToColumn = 1,
|
||||
AssignedToUser,
|
||||
SetToCategory,
|
||||
AddedToCategory,
|
||||
PointsChanged
|
||||
}
|
||||
|
||||
export enum ActionType {
|
||||
SetColor = 1,
|
||||
SetCategory,
|
||||
AddCategory,
|
||||
ClearAllCategories,
|
||||
SetAssignee,
|
||||
ClearDueDate,
|
||||
UseBaseColor
|
||||
AlterColorByPoints
|
||||
}
|
||||
|
||||
export class AutoAction {
|
||||
constructor(public trigger: ActionTrigger = ActionTrigger.MoveToColumn,
|
||||
constructor(public trigger: ActionTrigger = ActionTrigger.MovedToColumn,
|
||||
public source_id: number = null, // tslint:disable-line
|
||||
public type: ActionType = ActionType.SetColor,
|
||||
public change_to: string = null, // tslint:disable-line
|
||||
|
Reference in New Issue
Block a user