-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(badges): new badges and manual add
- Loading branch information
1 parent
9b1c656
commit a3688fc
Showing
19 changed files
with
1,260 additions
and
32 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
45 changes: 45 additions & 0 deletions
45
front-end/src/app/tabs/configurations/badges/giveBadges.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
<ion-header> | ||
<ion-toolbar color="ideaToolbar"> | ||
<ion-buttons slot="start"> | ||
<ion-button [title]="'COMMON.CLOSE' | translate" (click)="close()"> | ||
<ion-icon icon="close-circle-outline" slot="icon-only"></ion-icon> | ||
</ion-button> | ||
</ion-buttons> | ||
<ion-title>{{ 'CONFIGURATIONS.GIVE_A_BADGE' | translate }}</ion-title> | ||
</ion-toolbar> | ||
</ion-header> | ||
<ion-content> | ||
<ion-list class="aList"> | ||
<ion-item> | ||
<ion-label position="stacked">{{ 'CONFIGURATIONS.USER_ID' | translate }}</ion-label> | ||
<ion-input [(ngModel)]="userId" [readonly]="!!badges"></ion-input> | ||
<ion-button | ||
slot="end" | ||
class="ion-margin-top" | ||
*ngIf="!badges" | ||
[disabled]="!userId" | ||
(click)="getUserBadges(userId)" | ||
> | ||
<ion-icon icon="search" slot="icon-only"></ion-icon> | ||
</ion-button> | ||
<ion-button slot="end" class="ion-margin-top" fill="clear" color="medium" *ngIf="badges" (click)="badges = null"> | ||
<ion-icon icon="arrow-undo" slot="icon-only"></ion-icon> | ||
</ion-button> | ||
</ion-item> | ||
<ion-grid class="ion-margin-top badgesGrid" *ngIf="badges"> | ||
<ion-row class="ion-justify-content-center ion-align-items-center"> | ||
<ion-col class="ion-text-center" *ngFor="let badge of badges"> | ||
<ion-img [src]="_badges.getBadgeImage(badge)" (click)="_badges.openBadgeDetails(badge)"></ion-img> | ||
<ion-button fill="clear" color="danger" (click)="removeBadgeFromUser(userId, badge)"> | ||
<ion-icon slot="icon-only" icon="trash"></ion-icon> | ||
</ion-button> | ||
</ion-col> | ||
<ion-col class="ion-text-center"> | ||
<ion-button shape="round" (click)="addBadgeToUser(userId)"> | ||
<ion-icon slot="icon-only" icon="add"></ion-icon> | ||
</ion-button> | ||
</ion-col> | ||
</ion-row> | ||
</ion-grid> | ||
</ion-list> | ||
</ion-content> |
7 changes: 7 additions & 0 deletions
7
front-end/src/app/tabs/configurations/badges/giveBadges.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
ion-grid.badgesGrid { | ||
ion-img { | ||
margin: 0 auto; | ||
width: 100px; | ||
height: 100px; | ||
} | ||
} |
95 changes: 95 additions & 0 deletions
95
front-end/src/app/tabs/configurations/badges/giveBadges.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,95 @@ | ||
import { Component } from '@angular/core'; | ||
import { AlertController, ModalController } from '@ionic/angular'; | ||
import { IDEALoadingService, IDEAMessageService, IDEATranslationsService } from '@idea-ionic/common'; | ||
|
||
import { AppService } from '@app/app.service'; | ||
import { BadgesService } from '../../profile/badges/badges.service'; | ||
|
||
import { Badges, UserBadge } from '@models/userBadge.model'; | ||
|
||
@Component({ | ||
selector: 'app-give-badges', | ||
templateUrl: 'giveBadges.component.html', | ||
styleUrls: ['giveBadges.component.scss'] | ||
}) | ||
export class GiveBadgesComponent { | ||
userId: string; | ||
badges: UserBadge[]; | ||
|
||
constructor( | ||
private modalCtrl: ModalController, | ||
private alertCtrl: AlertController, | ||
private loading: IDEALoadingService, | ||
private message: IDEAMessageService, | ||
private t: IDEATranslationsService, | ||
public _badges: BadgesService, | ||
public app: AppService | ||
) {} | ||
|
||
async getUserBadges(userId: string): Promise<void> { | ||
if (!userId) return; | ||
this.badges = null; | ||
try { | ||
await this.loading.show(); | ||
this.badges = await this._badges.getList({ userId, force: true }); | ||
} catch (error) { | ||
this.message.error('COMMON.SOMETHING_WENT_WRONG'); | ||
} finally { | ||
this.loading.hide(); | ||
} | ||
} | ||
|
||
async removeBadgeFromUser(userId: string, userBadge: UserBadge): Promise<void> { | ||
const doRemove = async (): Promise<void> => { | ||
try { | ||
await this.loading.show(); | ||
await this._badges.removeBadgeFromUser(userId, userBadge.badge); | ||
this.badges.splice(this.badges.indexOf(userBadge), 1); | ||
this.message.success('COMMON.OPERATION_COMPLETED'); | ||
} catch (error) { | ||
this.message.error('COMMON.OPERATION_FAILED'); | ||
} finally { | ||
this.loading.hide(); | ||
} | ||
}; | ||
|
||
const header = this.t._('COMMON.ARE_YOU_SURE'); | ||
const buttons = [{ text: this.t._('COMMON.CANCEL') }, { text: this.t._('COMMON.CONFIRM'), handler: doRemove }]; | ||
const alert = await this.alertCtrl.create({ header, buttons }); | ||
await alert.present(); | ||
} | ||
|
||
async addBadgeToUser(userId: string): Promise<void> { | ||
const header = this.t._('CONFIGURATIONS.GIVE_A_BADGE'); | ||
const subHeader = userId; | ||
const inputs: any[] = Object.values(Badges).map(badge => ({ | ||
type: 'radio', | ||
value: badge, | ||
label: this.t._('PROFILE.BADGES.'.concat(badge)) | ||
})); | ||
|
||
const doAdd = async (badge: Badges): Promise<void> => { | ||
try { | ||
await this.loading.show(); | ||
await this._badges.addBadgeToUser(userId, badge); | ||
this.badges.unshift(new UserBadge({ userId, badge })); | ||
this.message.success('COMMON.OPERATION_COMPLETED'); | ||
} catch (error) { | ||
this.message.error('COMMON.OPERATION_FAILED'); | ||
} finally { | ||
this.loading.hide(); | ||
} | ||
}; | ||
const buttons = [ | ||
{ text: this.t._('COMMON.CANCEL'), role: 'cancel' }, | ||
{ text: this.t._('COMMON.CONFIRM'), handler: doAdd } | ||
]; | ||
|
||
const alert = await this.alertCtrl.create({ header, subHeader, inputs, buttons }); | ||
alert.present(); | ||
} | ||
|
||
close(): void { | ||
this.modalCtrl.dismiss(); | ||
} | ||
} |
Oops, something went wrong.