commit
97592c431a
|
@ -12,29 +12,60 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Route, RouterModule, Routes } from '@angular/router';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
|
||||
import { conditionalRoutes } from '@/app/app-routing.module';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { CoreSharedModule } from '@/core/shared.module';
|
||||
|
||||
export const AddonBadgesIssueRoute: Route = {
|
||||
path: 'issue',
|
||||
loadChildren: () => import('./pages/issued-badge/issued-badge.module').then( m => m.AddonBadgesIssuedBadgePageModule),
|
||||
};
|
||||
import { AddonBadgesIssuedBadgePage } from './pages/issued-badge/issued-badge';
|
||||
import { AddonBadgesUserBadgesPage } from './pages/user-badges/user-badges';
|
||||
|
||||
const routes: Routes = [
|
||||
const mobileRoutes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
redirectTo: 'user',
|
||||
pathMatch: 'full',
|
||||
component: AddonBadgesUserBadgesPage,
|
||||
},
|
||||
AddonBadgesIssueRoute,
|
||||
{
|
||||
path: 'user',
|
||||
loadChildren: () => import('./pages/user-badges/user-badges.module').then( m => m.AddonBadgesUserBadgesPageModule),
|
||||
path: ':badgeHash',
|
||||
component: AddonBadgesIssuedBadgePage,
|
||||
},
|
||||
];
|
||||
|
||||
const tabletRoutes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: AddonBadgesUserBadgesPage,
|
||||
children: [
|
||||
{
|
||||
path: ':badgeHash',
|
||||
component: AddonBadgesIssuedBadgePage,
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const routes: Routes = [
|
||||
...conditionalRoutes(mobileRoutes, () => CoreScreen.instance.isMobile),
|
||||
...conditionalRoutes(tabletRoutes, () => CoreScreen.instance.isTablet),
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
imports: [
|
||||
RouterModule.forChild(routes),
|
||||
CommonModule,
|
||||
IonicModule,
|
||||
TranslateModule.forChild(),
|
||||
CoreSharedModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonBadgesUserBadgesPage,
|
||||
AddonBadgesIssuedBadgePage,
|
||||
],
|
||||
})
|
||||
export class AddonBadgesLazyModule {}
|
||||
|
|
|
@ -1,44 +0,0 @@
|
|||
// (C) Copyright 2015 Moodle Pty Ltd.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { CoreSharedModule } from '@/core/shared.module';
|
||||
import { AddonBadgesIssuedBadgePage } from './issued-badge.page';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: AddonBadgesIssuedBadgePage,
|
||||
},
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forChild(routes),
|
||||
CommonModule,
|
||||
IonicModule,
|
||||
TranslateModule.forChild(),
|
||||
CoreSharedModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonBadgesIssuedBadgePage,
|
||||
],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AddonBadgesIssuedBadgePageModule {}
|
|
@ -8,17 +8,17 @@
|
|||
</ion-header>
|
||||
<ion-content>
|
||||
<core-split-view>
|
||||
<ion-refresher slot="fixed" [disabled]="!badgesLoaded" (ionRefresh)="refreshBadges($event)">
|
||||
<ion-refresher slot="fixed" [disabled]="!badges.loaded" (ionRefresh)="refreshBadges($event.target)">
|
||||
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
|
||||
</ion-refresher>
|
||||
<core-loading [hideUntil]="badgesLoaded">
|
||||
<core-empty-box *ngIf="!badges || badges.length == 0" icon="fas-trophy"
|
||||
<core-loading [hideUntil]="badges.loaded">
|
||||
<core-empty-box *ngIf="badges.empty" icon="fas-trophy"
|
||||
[message]="'addon.badges.nobadges' | translate">
|
||||
</core-empty-box>
|
||||
|
||||
<ion-list *ngIf="badges && badges.length" class="ion-no-margin">
|
||||
<ion-item class="ion-text-wrap" *ngFor="let badge of badges" [title]="badge.name"
|
||||
(click)="loadIssuedBadge(badge.uniquehash)" [class.core-selected-item]="badge.uniquehash == badgeHash">
|
||||
<ion-list *ngIf="!badges.empty" class="ion-no-margin">
|
||||
<ion-item class="ion-text-wrap" *ngFor="let badge of badges.items" [title]="badge.name"
|
||||
(click)="badges.select(badge)" [class.core-selected-item]="badges.isSelected(badge)">
|
||||
<ion-avatar slot="start">
|
||||
<img [src]="badge.badgeurl" [alt]="badge.name" core-external-content>
|
||||
</ion-avatar>
|
||||
|
|
|
@ -1,63 +0,0 @@
|
|||
// (C) Copyright 2015 Moodle Pty Ltd.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { NgModule } from '@angular/core';
|
||||
import { IonicModule } from '@ionic/angular';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { conditionalRoutes } from '@/app/app-routing.module';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
|
||||
import { CoreSharedModule } from '@/core/shared.module';
|
||||
import { AddonBadgesUserBadgesPage } from './user-badges.page';
|
||||
import { AddonBadgesIssueRoute } from '@addons/badges/badges-lazy.module';
|
||||
|
||||
const mobileRoutes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: AddonBadgesUserBadgesPage,
|
||||
},
|
||||
AddonBadgesIssueRoute,
|
||||
];
|
||||
|
||||
const tabletRoutes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
component: AddonBadgesUserBadgesPage,
|
||||
children: [
|
||||
AddonBadgesIssueRoute,
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const routes: Routes = [
|
||||
...conditionalRoutes(mobileRoutes, () => CoreScreen.instance.isMobile),
|
||||
...conditionalRoutes(tabletRoutes, () => CoreScreen.instance.isTablet),
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
RouterModule.forChild(routes),
|
||||
CommonModule,
|
||||
IonicModule,
|
||||
TranslateModule.forChild(),
|
||||
CoreSharedModule,
|
||||
],
|
||||
declarations: [
|
||||
AddonBadgesUserBadgesPage,
|
||||
],
|
||||
exports: [RouterModule],
|
||||
})
|
||||
export class AddonBadgesUserBadgesPageModule {}
|
|
@ -1,106 +0,0 @@
|
|||
// (C) Copyright 2015 Moodle Pty Ltd.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { IonRefresher } from '@ionic/angular';
|
||||
import { AddonBadges, AddonBadgesUserBadge } from '../../services/badges';
|
||||
import { CoreTimeUtils } from '@services/utils/time';
|
||||
import { CoreDomUtils } from '@services/utils/dom';
|
||||
import { CoreSites } from '@services/sites';
|
||||
import { CoreUtils } from '@services/utils/utils';
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
|
||||
/**
|
||||
* Page that displays the list of calendar events.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'page-addon-badges-user-badges',
|
||||
templateUrl: 'user-badges.html',
|
||||
})
|
||||
export class AddonBadgesUserBadgesPage implements OnInit {
|
||||
|
||||
courseId = 0;
|
||||
userId!: number;
|
||||
|
||||
badgesLoaded = false;
|
||||
badges: AddonBadgesUserBadge[] = [];
|
||||
currentTime = 0;
|
||||
badgeHash!: string;
|
||||
|
||||
/**
|
||||
* View loaded.
|
||||
*/
|
||||
ngOnInit(): void {
|
||||
|
||||
this.courseId = CoreNavigator.instance.getRouteNumberParam('courseId') || this.courseId; // Use 0 for site badges.
|
||||
this.userId = CoreNavigator.instance.getRouteNumberParam('userId') || CoreSites.instance.getCurrentSite()!.getUserId();
|
||||
|
||||
this.fetchBadges().finally(() => {
|
||||
if (!this.badgeHash && CoreScreen.instance.isTablet && this.badges.length > 0) {
|
||||
// Take first and load it.
|
||||
this.loadIssuedBadge(this.badges[0].uniquehash);
|
||||
}
|
||||
this.badgesLoaded = true;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch all the badges required for the view.
|
||||
*
|
||||
* @return Promise resolved when done.
|
||||
*/
|
||||
async fetchBadges(): Promise<void> {
|
||||
this.currentTime = CoreTimeUtils.instance.timestamp();
|
||||
|
||||
try {
|
||||
this.badges = await AddonBadges.instance.getUserBadges(this.courseId, this.userId);
|
||||
} catch (message) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(message, 'Error getting badges data.');
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the badges.
|
||||
*
|
||||
* @param refresher Refresher.
|
||||
*/
|
||||
async refreshBadges(refresher?: CustomEvent<IonRefresher>): Promise<void> {
|
||||
await CoreUtils.instance.ignoreErrors(Promise.all([
|
||||
AddonBadges.instance.invalidateUserBadges(this.courseId, this.userId),
|
||||
]));
|
||||
|
||||
await CoreUtils.instance.ignoreErrors(Promise.all([
|
||||
this.fetchBadges(),
|
||||
]));
|
||||
|
||||
refresher?.detail.complete();
|
||||
}
|
||||
|
||||
/**
|
||||
* Navigate to a particular badge.
|
||||
*
|
||||
* @param badgeHash Badge to load.
|
||||
*/
|
||||
loadIssuedBadge(badgeHash: string): void {
|
||||
this.badgeHash = badgeHash;
|
||||
const params = { courseId: this.courseId, userId: this.userId, badgeHash: badgeHash };
|
||||
|
||||
const splitViewLoaded = CoreNavigator.instance.isCurrentPathInTablet('**/badges/user/issue');
|
||||
const path = (splitViewLoaded ? '../' : '') + 'issue';
|
||||
|
||||
CoreNavigator.instance.navigate(path, { params });
|
||||
}
|
||||
|
||||
}
|
|
@ -0,0 +1,142 @@
|
|||
// (C) Copyright 2015 Moodle Pty Ltd.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { AfterViewInit, Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { IonRefresher } from '@ionic/angular';
|
||||
import { AddonBadges, AddonBadgesUserBadge } from '../../services/badges';
|
||||
import { CoreTimeUtils } from '@services/utils/time';
|
||||
import { CoreDomUtils } from '@services/utils/dom';
|
||||
import { CoreSites } from '@services/sites';
|
||||
import { CoreUtils } from '@services/utils/utils';
|
||||
import { CorePageItemsListManager } from '@classes/page-items-list-manager';
|
||||
import { ActivatedRoute, ActivatedRouteSnapshot, Params } from '@angular/router';
|
||||
import { CoreSplitViewComponent } from '@components/split-view/split-view';
|
||||
import { CoreObject } from '@singletons/object';
|
||||
|
||||
/**
|
||||
* Page that displays the list of calendar events.
|
||||
*/
|
||||
@Component({
|
||||
selector: 'page-addon-badges-user-badges',
|
||||
templateUrl: 'user-badges.html',
|
||||
})
|
||||
export class AddonBadgesUserBadgesPage implements AfterViewInit, OnDestroy {
|
||||
|
||||
currentTime = 0;
|
||||
badges: AddonBadgesUserBadgesManager;
|
||||
|
||||
@ViewChild(CoreSplitViewComponent) splitView!: CoreSplitViewComponent;
|
||||
|
||||
constructor(route: ActivatedRoute) {
|
||||
const courseId = parseInt(route.snapshot.queryParams.courseId ?? 0); // Use 0 for site badges.
|
||||
const userId = parseInt(route.snapshot.queryParams.userId ?? CoreSites.instance.getCurrentSiteUserId());
|
||||
|
||||
this.badges = new AddonBadgesUserBadgesManager(AddonBadgesUserBadgesPage, courseId, userId);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
async ngAfterViewInit(): Promise<void> {
|
||||
await this.fetchInitialBadges();
|
||||
|
||||
this.badges.watchSplitViewOutlet(this.splitView);
|
||||
this.badges.start();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.badges.destroy();
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh the badges.
|
||||
*
|
||||
* @param refresher Refresher.
|
||||
*/
|
||||
async refreshBadges(refresher?: IonRefresher): Promise<void> {
|
||||
await CoreUtils.instance.ignoreErrors(AddonBadges.instance.invalidateUserBadges(this.badges.courseId, this.badges.userId));
|
||||
await CoreUtils.instance.ignoreErrors(this.fetchBadges());
|
||||
|
||||
refresher?.complete();
|
||||
}
|
||||
|
||||
/**
|
||||
* Obtain the initial list of badges.
|
||||
*/
|
||||
private async fetchInitialBadges(): Promise<void> {
|
||||
this.currentTime = CoreTimeUtils.instance.timestamp();
|
||||
|
||||
try {
|
||||
await this.fetchBadges();
|
||||
} catch (message) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(message, 'Error loading badges');
|
||||
|
||||
this.badges.setItems([]);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the list of badges.
|
||||
*/
|
||||
private async fetchBadges(): Promise<void> {
|
||||
const badges = await AddonBadges.instance.getUserBadges(this.badges.courseId, this.badges.userId);
|
||||
|
||||
this.badges.setItems(badges);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Helper class to manage badges.
|
||||
*/
|
||||
class AddonBadgesUserBadgesManager extends CorePageItemsListManager<AddonBadgesUserBadge> {
|
||||
|
||||
courseId: number;
|
||||
userId: number;
|
||||
|
||||
constructor(pageComponent: unknown, courseId: number, userId: number) {
|
||||
super(pageComponent);
|
||||
|
||||
this.courseId = courseId;
|
||||
this.userId = userId;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemPath(badge: AddonBadgesUserBadge): string {
|
||||
return badge.uniquehash;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemQueryParams(): Params {
|
||||
return CoreObject.withoutEmpty({
|
||||
courseId: this.courseId,
|
||||
userId: this.userId,
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getSelectedItemPath(route: ActivatedRouteSnapshot): string | null {
|
||||
return route.params.badgeHash ?? null;
|
||||
}
|
||||
|
||||
}
|
|
@ -43,13 +43,7 @@ export class AddonBadgesBadgeLinkHandlerService extends CoreContentLinksHandlerB
|
|||
|
||||
return [{
|
||||
action: (siteId: string): void => {
|
||||
CoreNavigator.instance.navigateToSitePath(
|
||||
'/badges/issue',
|
||||
{
|
||||
siteId,
|
||||
params: { courseId: 0, badgeHash: params.hash },
|
||||
},
|
||||
);
|
||||
CoreNavigator.instance.navigateToSitePath(`/badges/${params.hash}`, { siteId });
|
||||
},
|
||||
}];
|
||||
}
|
||||
|
|
|
@ -37,7 +37,7 @@ export class AddonBadgesMyBadgesLinkHandlerService extends CoreContentLinksHandl
|
|||
getActions(): CoreContentLinksAction[] {
|
||||
return [{
|
||||
action: (siteId: string): void => {
|
||||
CoreNavigator.instance.navigateToSitePath('/badges/user', { siteId });
|
||||
CoreNavigator.instance.navigateToSitePath('/badges', { siteId });
|
||||
},
|
||||
}];
|
||||
}
|
||||
|
|
|
@ -59,9 +59,8 @@ export class AddonBadgesPushClickHandlerService implements CorePushNotifications
|
|||
|
||||
if (data.hash) {
|
||||
// We have the hash, open the badge directly.
|
||||
await CoreNavigator.instance.navigateToSitePath('/badges/issue', {
|
||||
await CoreNavigator.instance.navigateToSitePath(`/badges/${data.hash}`, {
|
||||
siteId: notification.site,
|
||||
params: { courseId: 0, badgeHash: data.hash },
|
||||
});
|
||||
|
||||
return;
|
||||
|
@ -76,7 +75,7 @@ export class AddonBadgesPushClickHandlerService implements CorePushNotifications
|
|||
),
|
||||
);
|
||||
|
||||
await CoreNavigator.instance.navigateToSitePath('/badges/user', { siteId: notification.site });
|
||||
await CoreNavigator.instance.navigateToSitePath('/badges', { siteId: notification.site });
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -18,6 +18,7 @@ import { CoreUserProfile } from '@features/user/services/user';
|
|||
import { CoreUserDelegateService, CoreUserProfileHandler, CoreUserProfileHandlerData } from '@features/user/services/user-delegate';
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import { makeSingleton } from '@singletons';
|
||||
import { CoreObject } from '@singletons/object';
|
||||
import { AddonBadges } from '../badges';
|
||||
|
||||
/**
|
||||
|
@ -72,10 +73,9 @@ export class AddonBadgesUserHandlerService implements CoreUserProfileHandler {
|
|||
action: (event, user, courseId): void => {
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
CoreNavigator.instance.navigateToSitePath(
|
||||
'/badges/user',
|
||||
{ params: { courseId: courseId || 0, userId: user.id } },
|
||||
);
|
||||
CoreNavigator.instance.navigateToSitePath('/badges', {
|
||||
params: CoreObject.withoutEmpty({ courseId, userId: user.id }),
|
||||
});
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -0,0 +1,202 @@
|
|||
// (C) Copyright 2015 Moodle Pty Ltd.
|
||||
//
|
||||
// Licensed under the Apache License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License.
|
||||
// You may obtain a copy of the License at
|
||||
//
|
||||
// http://www.apache.org/licenses/LICENSE-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { ActivatedRouteSnapshot, Params } from '@angular/router';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { CoreSplitViewComponent } from '@components/split-view/split-view';
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { CoreUtils } from '@services/utils/utils';
|
||||
|
||||
/**
|
||||
* Helper class to manage the state and routing of a list of items in a page, for example on pages using a split view.
|
||||
*/
|
||||
export abstract class CorePageItemsListManager<Item> {
|
||||
|
||||
protected itemsList: Item[] | null = null;
|
||||
protected itemsMap: Record<string, Item> | null = null;
|
||||
protected selectedItem: Item | null = null;
|
||||
protected pageComponent: unknown;
|
||||
protected splitView?: CoreSplitViewComponent;
|
||||
protected splitViewOutletSubscription?: Subscription;
|
||||
|
||||
constructor(pageComponent: unknown) {
|
||||
this.pageComponent = pageComponent;
|
||||
}
|
||||
|
||||
get items(): Item[] {
|
||||
return this.itemsList || [];
|
||||
}
|
||||
|
||||
get loaded(): boolean {
|
||||
return this.itemsMap !== null;
|
||||
}
|
||||
|
||||
get empty(): boolean {
|
||||
return this.itemsList === null || this.itemsList.length === 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Process page started operations.
|
||||
*/
|
||||
async start(): Promise<void> {
|
||||
// Calculate current selected item.
|
||||
const route = CoreNavigator.instance.getCurrentRoute({ pageComponent: this.pageComponent });
|
||||
if (route !== null && route.firstChild) {
|
||||
this.updateSelectedItem(route.firstChild.snapshot);
|
||||
}
|
||||
|
||||
// Select default item if none is selected on a non-mobile layout.
|
||||
if (!CoreScreen.instance.isMobile && this.selectedItem === null) {
|
||||
const defaultItem = this.getDefaultItem();
|
||||
|
||||
if (defaultItem) {
|
||||
this.select(defaultItem);
|
||||
}
|
||||
}
|
||||
|
||||
// Log activity.
|
||||
await CoreUtils.instance.ignoreErrors(this.logActivity());
|
||||
}
|
||||
|
||||
/**
|
||||
* Process page destroyed operations.
|
||||
*/
|
||||
destroy(): void {
|
||||
this.splitViewOutletSubscription?.unsubscribe();
|
||||
}
|
||||
|
||||
/**
|
||||
* Watch a split view outlet to keep track of the selected item.
|
||||
*
|
||||
* @param splitView Split view component.
|
||||
*/
|
||||
watchSplitViewOutlet(splitView: CoreSplitViewComponent): void {
|
||||
this.splitView = splitView;
|
||||
this.splitViewOutletSubscription = splitView.outletRouteObservable.subscribe(route => this.updateSelectedItem(route));
|
||||
|
||||
this.updateSelectedItem(splitView.outletRoute);
|
||||
}
|
||||
|
||||
// @todo Implement watchResize.
|
||||
|
||||
/**
|
||||
* Check whether the given item is selected or not.
|
||||
*
|
||||
* @param item Item.
|
||||
* @return Whether the given item is selected.
|
||||
*/
|
||||
isSelected(item: Item): boolean {
|
||||
return this.selectedItem === item;
|
||||
}
|
||||
|
||||
/**
|
||||
* Select an item.
|
||||
*
|
||||
* @param item Item.
|
||||
*/
|
||||
async select(item: Item): Promise<void> {
|
||||
// Get current route in the page.
|
||||
const route = CoreNavigator.instance.getCurrentRoute({ pageComponent: this.pageComponent });
|
||||
|
||||
if (route === null) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If this item is already selected, do nothing.
|
||||
const itemPath = this.getItemPath(item);
|
||||
|
||||
if (route.firstChild?.routeConfig?.path === itemPath) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Navigate to item.
|
||||
const path = route.firstChild ? `../${itemPath}` : itemPath;
|
||||
const params = this.getItemQueryParams(item);
|
||||
|
||||
await CoreNavigator.instance.navigate(path, { params });
|
||||
}
|
||||
|
||||
/**
|
||||
* Set the list of items.
|
||||
*
|
||||
* @param items Items.
|
||||
*/
|
||||
setItems(items: Item[]): void {
|
||||
this.itemsList = items.slice(0);
|
||||
this.itemsMap = items.reduce((map, item) => {
|
||||
map[this.getItemPath(item)] = item;
|
||||
|
||||
return map;
|
||||
}, {});
|
||||
|
||||
this.updateSelectedItem(this.splitView?.outletRoute);
|
||||
}
|
||||
|
||||
/**
|
||||
* Log activity when the page starts.
|
||||
*/
|
||||
protected async logActivity(): Promise<void> {
|
||||
//
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the selected item given the current route.
|
||||
*
|
||||
* @param route Current route.
|
||||
*/
|
||||
protected updateSelectedItem(route?: ActivatedRouteSnapshot | null): void {
|
||||
const selectedItemPath = route ? this.getSelectedItemPath(route) : null;
|
||||
|
||||
this.selectedItem = selectedItemPath
|
||||
? this.itemsMap?.[selectedItemPath] ?? null
|
||||
: null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the item that should be selected by default.
|
||||
*/
|
||||
protected getDefaultItem(): Item | null {
|
||||
return this.itemsList?.[0] || null;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the query parameters to use when navigating to an item page.
|
||||
*
|
||||
* @param item Item.
|
||||
* @return Query parameters to use when navigating to the item page.
|
||||
*/
|
||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
||||
protected getItemQueryParams(item: Item): Params {
|
||||
return {};
|
||||
}
|
||||
|
||||
/**
|
||||
* Get the path to use when navigating to an item page.
|
||||
*
|
||||
* @param item Item.
|
||||
* @return Path to use when navigating to the item page.
|
||||
*/
|
||||
protected abstract getItemPath(item: Item): string;
|
||||
|
||||
/**
|
||||
* Get the path of the selected item given the current route.
|
||||
*
|
||||
* @param route Current route.
|
||||
* @return Path of the selected item in the given route.
|
||||
*/
|
||||
protected abstract getSelectedItemPath(route: ActivatedRouteSnapshot): string | null;
|
||||
|
||||
}
|
|
@ -13,9 +13,10 @@
|
|||
// limitations under the License.
|
||||
|
||||
import { AfterViewInit, Component, ElementRef, HostBinding, Input, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { ActivatedRouteSnapshot } from '@angular/router';
|
||||
import { IonRouterOutlet } from '@ionic/angular';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { BehaviorSubject, Observable, Subscription } from 'rxjs';
|
||||
|
||||
enum CoreSplitViewMode {
|
||||
MenuOnly = 'menu-only', // Hides content.
|
||||
|
@ -35,18 +36,33 @@ export class CoreSplitViewComponent implements AfterViewInit, OnDestroy {
|
|||
@Input() placeholderText = 'core.emptysplit';
|
||||
isNested = false;
|
||||
|
||||
private outletRouteSubject: BehaviorSubject<ActivatedRouteSnapshot | null> = new BehaviorSubject(null);
|
||||
private subscriptions?: Subscription[];
|
||||
|
||||
constructor(private element: ElementRef<HTMLElement>) {}
|
||||
|
||||
get outletRoute(): ActivatedRouteSnapshot | null {
|
||||
return this.outletRouteSubject.value;
|
||||
}
|
||||
|
||||
get outletRouteObservable(): Observable<ActivatedRouteSnapshot | null> {
|
||||
return this.outletRouteSubject.asObservable();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngAfterViewInit(): void {
|
||||
this.isNested = !!this.element.nativeElement.parentElement?.closest('core-split-view');
|
||||
this.subscriptions = [
|
||||
this.outlet.activateEvents.subscribe(() => this.updateClasses()),
|
||||
this.outlet.deactivateEvents.subscribe(() => this.updateClasses()),
|
||||
this.outlet.activateEvents.subscribe(() => {
|
||||
this.updateClasses();
|
||||
this.outletRouteSubject.next(this.outlet.activatedRoute.snapshot);
|
||||
}),
|
||||
this.outlet.deactivateEvents.subscribe(() => {
|
||||
this.updateClasses();
|
||||
this.outletRouteSubject.next(null);
|
||||
}),
|
||||
CoreScreen.instance.layoutObservable.subscribe(() => this.updateClasses()),
|
||||
];
|
||||
|
||||
|
|
|
@ -8,18 +8,18 @@
|
|||
</ion-header>
|
||||
<ion-content>
|
||||
<core-split-view>
|
||||
<ion-refresher slot="fixed" [disabled]="!gradesTableLoaded" (ionRefresh)="refreshGradesTable($event.target)">
|
||||
<ion-refresher slot="fixed" [disabled]="!grades.loaded" (ionRefresh)="refreshGrades($event.target)">
|
||||
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
|
||||
</ion-refresher>
|
||||
<core-loading [hideUntil]="gradesTableLoaded" class="safe-area-page">
|
||||
<core-empty-box *ngIf="!gradesTable" icon="stats" [message]="'core.grades.nogradesreturned' | translate">
|
||||
<core-loading [hideUntil]="grades.loaded" class="safe-area-page">
|
||||
<core-empty-box *ngIf="grades.empty" icon="stats" [message]="'core.grades.nogradesreturned' | translate">
|
||||
</core-empty-box>
|
||||
<div *ngIf="gradesTable" class="core-grades-container">
|
||||
<div *ngIf="!grades.empty" class="core-grades-container">
|
||||
<table cellspacing="0" cellpadding="0" class="core-grades-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th
|
||||
*ngFor="let column of gradesTable.columns"
|
||||
*ngFor="let column of grades.columns"
|
||||
id="{{column.name}}"
|
||||
class="ion-text-start"
|
||||
[class.ion-hide-md-down]="column.hiddenPhone"
|
||||
|
@ -31,8 +31,8 @@
|
|||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
*ngFor="let row of gradesTable.rows"
|
||||
(click)="row.itemtype != 'category' && gotoGrade(row.id)"
|
||||
*ngFor="let row of grades.rows"
|
||||
(click)="row.itemtype != 'category' && grades.select(row)"
|
||||
[class]="row.rowclass"
|
||||
[ngClass]='{"core-grades-grade-clickable": row.itemtype != "category"}'
|
||||
>
|
||||
|
@ -45,14 +45,14 @@
|
|||
<th
|
||||
class="core-grades-table-gradeitem ion-text-start"
|
||||
[class.column-itemname]="row.itemtype == 'category'"
|
||||
[class.core-selected-item]="activeGradeId == row.id"
|
||||
[class.core-selected-item]="grades.isSelected(row)"
|
||||
[attr.colspan]="row.colspan"
|
||||
>
|
||||
<ion-icon *ngIf="row.icon" name="{{row.icon}}" slot="start"></ion-icon>
|
||||
<img *ngIf="row.image" [src]="row.image" slot="start" />
|
||||
<span [innerHTML]="row.gradeitem"></span>
|
||||
</th>
|
||||
<ng-container *ngFor="let column of gradesTable.columns">
|
||||
<ng-container *ngFor="let column of grades.columns">
|
||||
<td
|
||||
*ngIf="column.name != 'gradeitem' && row[column.name] != undefined"
|
||||
[class]="'ion-text-start core-grades-table-' + column.name"
|
||||
|
|
|
@ -12,20 +12,24 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
import { Component, OnDestroy, OnInit, ViewChild } from '@angular/core';
|
||||
import { ActivatedRoute, ActivatedRouteSnapshot, Params } from '@angular/router';
|
||||
import { AfterViewInit, Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { IonRefresher } from '@ionic/angular';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { CoreDomUtils } from '@services/utils/dom';
|
||||
import { CoreGrades } from '@features/grades/services/grades';
|
||||
import { CoreGradesFormattedTable, CoreGradesHelper } from '@features/grades/services/grades-helper';
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import {
|
||||
CoreGradesFormattedTable,
|
||||
CoreGradesFormattedTableColumn,
|
||||
CoreGradesFormattedTableRow,
|
||||
CoreGradesFormattedTableRowFilled,
|
||||
CoreGradesHelper,
|
||||
} from '@features/grades/services/grades-helper';
|
||||
import { CoreSites } from '@services/sites';
|
||||
import { CoreUtils } from '@services/utils/utils';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { CoreSplitViewComponent } from '@components/split-view/split-view';
|
||||
import { CoreObject } from '@singletons/object';
|
||||
import { CorePageItemsListManager } from '@classes/page-items-list-manager';
|
||||
|
||||
/**
|
||||
* Page that displays a course grades.
|
||||
|
@ -35,116 +39,147 @@ import { CoreObject } from '@singletons/object';
|
|||
templateUrl: 'course.html',
|
||||
styleUrls: ['course.scss'],
|
||||
})
|
||||
export class CoreGradesCoursePage implements OnInit, OnDestroy {
|
||||
export class CoreGradesCoursePage implements AfterViewInit, OnDestroy {
|
||||
|
||||
courseId: number;
|
||||
userId: number;
|
||||
gradesTable?: CoreGradesFormattedTable;
|
||||
gradesTableLoaded = false;
|
||||
activeGradeId?: number;
|
||||
layoutSubscription?: Subscription;
|
||||
grades: CoreGradesCourseManager;
|
||||
|
||||
@ViewChild(CoreSplitViewComponent) splitView?: CoreSplitViewComponent;
|
||||
@ViewChild(CoreSplitViewComponent) splitView!: CoreSplitViewComponent;
|
||||
|
||||
constructor(private route: ActivatedRoute) {
|
||||
this.courseId = route.snapshot.params.courseId;
|
||||
this.userId = route.snapshot.queryParams.userId ?? CoreSites.instance.getCurrentSiteUserId();
|
||||
constructor(route: ActivatedRoute) {
|
||||
const courseId = parseInt(route.snapshot.params.courseId);
|
||||
const userId = parseInt(route.snapshot.queryParams.userId ?? CoreSites.instance.getCurrentSiteUserId());
|
||||
|
||||
this.grades = new CoreGradesCourseManager(CoreGradesCoursePage, courseId, userId);
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
async ngOnInit(): Promise<void> {
|
||||
this.layoutSubscription = CoreScreen.instance.layoutObservable.subscribe(() => this.updateActiveGrade());
|
||||
async ngAfterViewInit(): Promise<void> {
|
||||
await this.fetchInitialGrades();
|
||||
|
||||
await this.fetchGradesTable();
|
||||
|
||||
// Add log in Moodle.
|
||||
await CoreUtils.instance.ignoreErrors(CoreGrades.instance.logCourseGradesView(this.courseId, this.userId));
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ionViewWillEnter(): void {
|
||||
this.updateActiveGrade();
|
||||
this.grades.watchSplitViewOutlet(this.splitView);
|
||||
this.grades.start();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.layoutSubscription?.unsubscribe();
|
||||
this.grades.destroy();
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch all the data required for the view.
|
||||
*/
|
||||
async fetchGradesTable(): Promise<void> {
|
||||
try {
|
||||
const table = await CoreGrades.instance.getCourseGradesTable(this.courseId, this.userId);
|
||||
|
||||
this.gradesTable = CoreGradesHelper.instance.formatGradesTable(table);
|
||||
} catch (error) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(error, 'Error loading grades');
|
||||
|
||||
this.gradesTable = { rows: [], columns: [] };
|
||||
} finally {
|
||||
this.gradesTableLoaded = true;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh data.
|
||||
* Refresh grades.
|
||||
*
|
||||
* @param refresher Refresher.
|
||||
*/
|
||||
async refreshGradesTable(refresher: IonRefresher): Promise<void> {
|
||||
await CoreUtils.instance.ignoreErrors(CoreGrades.instance.invalidateCourseGradesData(this.courseId, this.userId));
|
||||
await CoreUtils.instance.ignoreErrors(this.fetchGradesTable());
|
||||
async refreshGrades(refresher: IonRefresher): Promise<void> {
|
||||
const { courseId, userId } = this.grades;
|
||||
|
||||
refresher.complete();
|
||||
await CoreUtils.instance.ignoreErrors(CoreGrades.instance.invalidateCourseGradesData(courseId, userId));
|
||||
await CoreUtils.instance.ignoreErrors(this.fetchGrades());
|
||||
|
||||
refresher?.complete();
|
||||
}
|
||||
|
||||
/**
|
||||
* Navigate to the grade of the selected item.
|
||||
*
|
||||
* @param gradeId Grade item ID where to navigate.
|
||||
* Obtain the initial table of grades.
|
||||
*/
|
||||
async gotoGrade(gradeId: number): Promise<void> {
|
||||
const path = this.activeGradeId ? `../${gradeId}` : gradeId.toString();
|
||||
private async fetchInitialGrades(): Promise<void> {
|
||||
try {
|
||||
await this.fetchGrades();
|
||||
} catch (error) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(error, 'Error loading course');
|
||||
|
||||
await CoreNavigator.instance.navigate(path, {
|
||||
params: CoreObject.withoutEmpty({ userId: this.userId }),
|
||||
});
|
||||
|
||||
this.updateActiveGrade(gradeId);
|
||||
this.grades.setTable({ columns: [], rows: [] });
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update active grade.
|
||||
*
|
||||
* @param activeGradeId Active grade id.
|
||||
* Update the table of grades.
|
||||
*/
|
||||
private updateActiveGrade(activeGradeId?: number): void {
|
||||
if (CoreScreen.instance.isMobile || this.splitView?.isNested) {
|
||||
delete this.activeGradeId;
|
||||
private async fetchGrades(): Promise<void> {
|
||||
const table = await CoreGrades.instance.getCourseGradesTable(this.grades.courseId!, this.grades.userId);
|
||||
const formattedTable = await CoreGradesHelper.instance.formatGradesTable(table);
|
||||
|
||||
return;
|
||||
this.grades.setTable(formattedTable);
|
||||
}
|
||||
|
||||
this.activeGradeId = activeGradeId ?? this.guessActiveGrade();
|
||||
}
|
||||
|
||||
/**
|
||||
* Guess active grade looking at the current route.
|
||||
*
|
||||
* @return Active grade id.
|
||||
* Helper to manage the table of grades.
|
||||
*/
|
||||
private guessActiveGrade(): number | undefined {
|
||||
const gradeId = parseInt(this.route.snapshot?.firstChild?.params.gradeId);
|
||||
class CoreGradesCourseManager extends CorePageItemsListManager<CoreGradesFormattedTableRowFilled> {
|
||||
|
||||
return isNaN(gradeId) ? undefined : gradeId;
|
||||
courseId: number;
|
||||
userId: number;
|
||||
columns?: CoreGradesFormattedTableColumn[];
|
||||
rows?: CoreGradesFormattedTableRow[];
|
||||
|
||||
constructor(pageComponent: unknown, courseId: number, userId: number) {
|
||||
super(pageComponent);
|
||||
|
||||
this.courseId = courseId;
|
||||
this.userId = userId;
|
||||
}
|
||||
|
||||
/**
|
||||
* Set grades table.
|
||||
*
|
||||
* @param table Grades table.
|
||||
*/
|
||||
setTable(table: CoreGradesFormattedTable): void {
|
||||
this.columns = table.columns;
|
||||
this.rows = table.rows;
|
||||
|
||||
this.setItems(table.rows.filter(this.isFilledRow));
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getDefaultItem(): CoreGradesFormattedTableRowFilled | null {
|
||||
return null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemPath(row: CoreGradesFormattedTableRowFilled): string {
|
||||
return row.id.toString();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemQueryParams(): Params {
|
||||
return CoreObject.withoutEmpty({ userId: this.userId });
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getSelectedItemPath(route: ActivatedRouteSnapshot): string | null {
|
||||
return route.params.gradeId ?? null;
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async logActivity(): Promise<void> {
|
||||
await CoreGrades.instance.logCourseGradesView(this.courseId!, this.userId!);
|
||||
}
|
||||
|
||||
/**
|
||||
* Check whether the given row is filled or not.
|
||||
*
|
||||
* @param row Grades table row.
|
||||
* @return Whether the given row is filled or not.
|
||||
*/
|
||||
private isFilledRow(row: CoreGradesFormattedTableRow): row is CoreGradesFormattedTableRowFilled {
|
||||
return 'id' in row;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -8,34 +8,34 @@
|
|||
</ion-header>
|
||||
<ion-content>
|
||||
<core-split-view>
|
||||
<ion-refresher slot="fixed" [disabled]="!gradesLoaded" (ionRefresh)="refreshGrades($event.target)">
|
||||
<ion-refresher slot="fixed" [disabled]="!courses.loaded" (ionRefresh)="refreshCourses($event.target)">
|
||||
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
|
||||
</ion-refresher>
|
||||
<core-loading [hideUntil]="gradesLoaded">
|
||||
<core-loading [hideUntil]="courses.loaded">
|
||||
<core-empty-box
|
||||
*ngIf="grades && grades.length == 0"
|
||||
*ngIf="courses.empty"
|
||||
icon="stats"
|
||||
[message]="'core.grades.nogradesreturned' | translate"
|
||||
></core-empty-box>
|
||||
|
||||
<ion-list *ngIf="grades && grades.length > 0">
|
||||
<ion-list *ngIf="!courses.empty">
|
||||
<ion-item
|
||||
*ngFor="let grade of grades"
|
||||
[title]="grade.courseFullName"
|
||||
[class.core-selected-item]="grade.courseid === this.activeCourseId"
|
||||
*ngFor="let course of courses.items"
|
||||
[title]="course.courseFullName"
|
||||
[class.core-selected-item]="courses.isSelected(course)"
|
||||
class="ion-text-wrap"
|
||||
button
|
||||
detail
|
||||
(click)="openCourse(grade.courseid)"
|
||||
(click)="courses.select(course)"
|
||||
>
|
||||
<ion-label>
|
||||
<core-format-text
|
||||
[text]="grade.courseFullName"
|
||||
[contextInstanceId]="grade.courseid"
|
||||
[text]="course.courseFullName"
|
||||
[contextInstanceId]="course.courseid"
|
||||
contextLevel="course"
|
||||
></core-format-text>
|
||||
</ion-label>
|
||||
<ion-badge slot="end" color="light">{{grade.grade}}</ion-badge>
|
||||
<ion-badge slot="end" color="light">{{course.grade}}</ion-badge>
|
||||
</ion-item>
|
||||
</ion-list>
|
||||
</core-loading>
|
||||
|
|
|
@ -12,17 +12,16 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import { IonRefresher } from '@ionic/angular';
|
||||
import { Subscription } from 'rxjs';
|
||||
import { AfterViewInit, Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { ActivatedRouteSnapshot } from '@angular/router';
|
||||
import { CorePageItemsListManager } from '@classes/page-items-list-manager';
|
||||
|
||||
import { CoreDomUtils } from '@services/utils/dom';
|
||||
import { CoreSplitViewComponent } from '@components/split-view/split-view';
|
||||
import { CoreGrades } from '@features/grades/services/grades';
|
||||
import { CoreGradesHelper, CoreGradesGradeOverviewWithCourseData } from '@features/grades/services/grades-helper';
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { CoreGradesGradeOverviewWithCourseData, CoreGradesHelper } from '@features/grades/services/grades-helper';
|
||||
import { IonRefresher } from '@ionic/angular';
|
||||
import { CoreDomUtils } from '@services/utils/dom';
|
||||
import { CoreUtils } from '@services/utils/utils';
|
||||
import { ActivatedRoute } from '@angular/router';
|
||||
|
||||
/**
|
||||
* Page that displays courses grades (main menu option).
|
||||
|
@ -31,113 +30,92 @@ import { ActivatedRoute } from '@angular/router';
|
|||
selector: 'page-core-grades-courses',
|
||||
templateUrl: 'courses.html',
|
||||
})
|
||||
export class CoreGradesCoursesPage implements OnInit, OnDestroy {
|
||||
export class CoreGradesCoursesPage implements OnDestroy, AfterViewInit {
|
||||
|
||||
grades?: CoreGradesGradeOverviewWithCourseData[];
|
||||
gradesLoaded = false;
|
||||
activeCourseId?: number;
|
||||
layoutSubscription?: Subscription;
|
||||
courses: CoreGradesCoursesManager = new CoreGradesCoursesManager(CoreGradesCoursesPage);
|
||||
|
||||
constructor(private route: ActivatedRoute) {}
|
||||
@ViewChild(CoreSplitViewComponent) splitView!: CoreSplitViewComponent;
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
async ngOnInit(): Promise<void> {
|
||||
this.layoutSubscription = CoreScreen.instance.layoutObservable.subscribe(() => this.updateActiveCourse());
|
||||
this.updateActiveCourse();
|
||||
async ngAfterViewInit(): Promise<void> {
|
||||
await this.fetchInitialCourses();
|
||||
|
||||
await this.fetchGrades();
|
||||
|
||||
if (!CoreScreen.instance.isMobile && !this.activeCourseId && this.grades && this.grades.length > 0) {
|
||||
this.openCourse(this.grades[0].courseid);
|
||||
}
|
||||
|
||||
// Add log in Moodle.
|
||||
await CoreUtils.instance.ignoreErrors(CoreGrades.instance.logCoursesGradesView());
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ionViewWillEnter(): void {
|
||||
this.updateActiveCourse();
|
||||
this.courses.watchSplitViewOutlet(this.splitView);
|
||||
this.courses.start();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.layoutSubscription?.unsubscribe();
|
||||
this.courses.destroy();
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch all the data required for the view.
|
||||
*/
|
||||
async fetchGrades(): Promise<void> {
|
||||
try {
|
||||
const grades = await CoreGrades.instance.getCoursesGrades();
|
||||
const gradesWithCourseData = await CoreGradesHelper.instance.getGradesCourseData(grades);
|
||||
|
||||
this.grades = gradesWithCourseData;
|
||||
} catch (error) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(error, 'Error loading grades');
|
||||
|
||||
this.grades = [];
|
||||
} finally {
|
||||
this.gradesLoaded = true;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Refresh data.
|
||||
* Refresh courses.
|
||||
*
|
||||
* @param refresher Refresher.
|
||||
*/
|
||||
async refreshGrades(refresher: IonRefresher): Promise<void> {
|
||||
async refreshCourses(refresher: IonRefresher): Promise<void> {
|
||||
await CoreUtils.instance.ignoreErrors(CoreGrades.instance.invalidateCoursesGradesData());
|
||||
await CoreUtils.instance.ignoreErrors(this.fetchGrades());
|
||||
await CoreUtils.instance.ignoreErrors(this.fetchCourses());
|
||||
|
||||
refresher.complete();
|
||||
refresher?.complete();
|
||||
}
|
||||
|
||||
/**
|
||||
* Navigate to the grades of the selected course.
|
||||
*
|
||||
* @param courseId Course Id where to navigate.
|
||||
* Obtain the initial list of courses.
|
||||
*/
|
||||
async openCourse(courseId: number): Promise<void> {
|
||||
const path = this.activeCourseId ? `../${courseId}` : courseId.toString();
|
||||
private async fetchInitialCourses(): Promise<void> {
|
||||
try {
|
||||
await this.fetchCourses();
|
||||
} catch (error) {
|
||||
CoreDomUtils.instance.showErrorModalDefault(error, 'Error loading courses');
|
||||
|
||||
await CoreNavigator.instance.navigate(path);
|
||||
|
||||
this.updateActiveCourse(courseId);
|
||||
this.courses.setItems([]);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update active course.
|
||||
*
|
||||
* @param activeCourseId Active course id.
|
||||
* Update the list of courses.
|
||||
*/
|
||||
private updateActiveCourse(activeCourseId?: number): void {
|
||||
if (CoreScreen.instance.isMobile) {
|
||||
delete this.activeCourseId;
|
||||
private async fetchCourses(): Promise<void> {
|
||||
const grades = await CoreGrades.instance.getCoursesGrades();
|
||||
const courses = await CoreGradesHelper.instance.getGradesCourseData(grades);
|
||||
|
||||
return;
|
||||
this.courses.setItems(courses);
|
||||
}
|
||||
|
||||
this.activeCourseId = activeCourseId ?? this.guessActiveCourse();
|
||||
}
|
||||
|
||||
/**
|
||||
* Guess active course looking at the current route.
|
||||
*
|
||||
* @return Active course id.
|
||||
* Helper class to manage courses.
|
||||
*/
|
||||
private guessActiveCourse(): number | undefined {
|
||||
const courseId = parseInt(this.route.snapshot?.firstChild?.params.courseId);
|
||||
class CoreGradesCoursesManager extends CorePageItemsListManager<CoreGradesGradeOverviewWithCourseData> {
|
||||
|
||||
return isNaN(courseId) ? undefined : courseId;
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemPath(courseGrade: CoreGradesGradeOverviewWithCourseData): string {
|
||||
return courseGrade.courseid.toString();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getSelectedItemPath(route: ActivatedRouteSnapshot): string | null {
|
||||
const courseId = parseInt(route?.params.courseId);
|
||||
|
||||
return isNaN(courseId) ? null : courseId.toString();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected async logActivity(): Promise<void> {
|
||||
await CoreGrades.instance.logCoursesGradesView();
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -38,9 +38,9 @@ export class CoreGradesGradePage implements OnInit {
|
|||
gradeLoaded = false;
|
||||
|
||||
constructor(route: ActivatedRoute) {
|
||||
this.courseId = route.snapshot.params.courseId ?? route.snapshot.parent?.params.courseId;
|
||||
this.gradeId = route.snapshot.params.gradeId;
|
||||
this.userId = route.snapshot.queryParams.userId ?? CoreSites.instance.getCurrentSiteUserId();
|
||||
this.courseId = parseInt(route.snapshot.params.courseId ?? route.snapshot.parent?.params.courseId);
|
||||
this.gradeId = parseInt(route.snapshot.params.gradeId);
|
||||
this.userId = parseInt(route.snapshot.queryParams.userId ?? CoreSites.instance.getCurrentSiteUserId());
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
@ -144,9 +144,9 @@ export class CoreGradesHelperProvider {
|
|||
*/
|
||||
formatGradesTable(table: CoreGradesTable): CoreGradesFormattedTable {
|
||||
const maxDepth = table.maxdepth;
|
||||
const formatted: CoreGradesFormattedTable = {
|
||||
columns: [],
|
||||
rows: [],
|
||||
const formatted = {
|
||||
columns: [] as any[],
|
||||
rows: [] as any[],
|
||||
};
|
||||
|
||||
// Columns, in order.
|
||||
|
@ -673,9 +673,21 @@ export class CoreGradesHelper extends makeSingleton(CoreGradesHelperProvider) {}
|
|||
export type CoreGradesFormattedRow = any;
|
||||
export type CoreGradesFormattedRowForTable = any;
|
||||
export type CoreGradesFormattedItem = any;
|
||||
export type CoreGradesFormattedTableColumn = any;
|
||||
export type CoreGradesFormattedTableRow = CoreGradesFormattedTableRowFilled | CoreGradesFormattedTableRowEmpty;
|
||||
export type CoreGradesFormattedTable = {
|
||||
columns: any[];
|
||||
rows: any[];
|
||||
columns: CoreGradesFormattedTableColumn[];
|
||||
rows: CoreGradesFormattedTableRow[];
|
||||
};
|
||||
export type CoreGradesFormattedTableRowFilled = {
|
||||
// @todo complete types.
|
||||
id: number;
|
||||
itemtype: 'category' | 'leader';
|
||||
grade: unknown;
|
||||
percentage: unknown;
|
||||
};
|
||||
type CoreGradesFormattedTableRowEmpty ={
|
||||
//
|
||||
};
|
||||
|
||||
/**
|
||||
|
|
|
@ -11,11 +11,11 @@
|
|||
<core-split-view>
|
||||
<ion-list>
|
||||
<ion-item
|
||||
*ngFor="let section of sections"
|
||||
[class.core-selected-item]="section.name === activeSection"
|
||||
*ngFor="let section of sections.items"
|
||||
[class.core-selected-item]="sections.isSelected(section)"
|
||||
button
|
||||
detail
|
||||
(click)="openSection(section)"
|
||||
(click)="sections.select(section)"
|
||||
>
|
||||
<ion-icon [name]="section.icon" slot="start"></ion-icon>
|
||||
<ion-label>{{ 'core.settings.' + section.name | translate }}</ion-label>
|
||||
|
|
|
@ -12,83 +12,57 @@
|
|||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
|
||||
import { Component, OnDestroy, OnInit } from '@angular/core';
|
||||
import { Subscription } from 'rxjs';
|
||||
|
||||
import { CoreNavigator } from '@services/navigator';
|
||||
import { CoreScreen } from '@services/screen';
|
||||
import { AfterViewInit, Component, OnDestroy, ViewChild } from '@angular/core';
|
||||
import { CoreSettingsConstants, CoreSettingsSection } from '@features/settings/constants';
|
||||
import { CorePageItemsListManager } from '@classes/page-items-list-manager';
|
||||
import { ActivatedRouteSnapshot } from '@angular/router';
|
||||
import { CoreSplitViewComponent } from '@components/split-view/split-view';
|
||||
|
||||
@Component({
|
||||
selector: 'page-core-settings-index',
|
||||
templateUrl: 'index.html',
|
||||
})
|
||||
export class CoreSettingsIndexPage implements OnInit, OnDestroy {
|
||||
export class CoreSettingsIndexPage implements AfterViewInit, OnDestroy {
|
||||
|
||||
sections = CoreSettingsConstants.SECTIONS;
|
||||
activeSection?: string;
|
||||
layoutSubscription?: Subscription;
|
||||
sections: CoreSettingsSectionsManager = new CoreSettingsSectionsManager(CoreSettingsIndexPage);
|
||||
|
||||
@ViewChild(CoreSplitViewComponent) splitView!: CoreSplitViewComponent;
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnInit(): void {
|
||||
this.layoutSubscription = CoreScreen.instance.layoutObservable.subscribe(() => this.updateActiveSection());
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ionViewWillEnter(): void {
|
||||
this.updateActiveSection();
|
||||
ngAfterViewInit(): void {
|
||||
this.sections.setItems(CoreSettingsConstants.SECTIONS);
|
||||
this.sections.watchSplitViewOutlet(this.splitView);
|
||||
this.sections.start();
|
||||
}
|
||||
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
ngOnDestroy(): void {
|
||||
this.layoutSubscription?.unsubscribe();
|
||||
this.sections.destroy();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Open a section page.
|
||||
*
|
||||
* @param section Section to open.
|
||||
* Helper class to manage sections.
|
||||
*/
|
||||
openSection(section: CoreSettingsSection): void {
|
||||
const path = this.activeSection ? `../${section.path}` : section.path;
|
||||
class CoreSettingsSectionsManager extends CorePageItemsListManager<CoreSettingsSection> {
|
||||
|
||||
CoreNavigator.instance.navigate(path);
|
||||
|
||||
this.updateActiveSection(section.name);
|
||||
/**
|
||||
* @inheritdoc
|
||||
*/
|
||||
protected getItemPath(section: CoreSettingsSection): string {
|
||||
return section.path;
|
||||
}
|
||||
|
||||
/**
|
||||
* Update active section.
|
||||
*
|
||||
* @param activeSection Active section.
|
||||
* @inheritdoc
|
||||
*/
|
||||
private updateActiveSection(activeSection?: string): void {
|
||||
if (CoreScreen.instance.isMobile) {
|
||||
delete this.activeSection;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
this.activeSection = activeSection ?? this.guessActiveSection();
|
||||
}
|
||||
|
||||
/**
|
||||
* Guess active section looking at the current route.
|
||||
*
|
||||
* @return Active section.
|
||||
*/
|
||||
private guessActiveSection(): string | undefined {
|
||||
const activeSection = this.sections.find(
|
||||
section => CoreNavigator.instance.isCurrent(`**/settings/${section.path}`),
|
||||
);
|
||||
|
||||
return activeSection?.name;
|
||||
protected getSelectedItemPath(route: ActivatedRouteSnapshot): string | null {
|
||||
return route.parent?.routeConfig?.path ?? null;
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
@ -50,6 +50,14 @@ export type CoreNavigationOptions = {
|
|||
reset?: boolean;
|
||||
};
|
||||
|
||||
/**
|
||||
* Options for CoreNavigatorService#getCurrentRoute method.
|
||||
*/
|
||||
type GetCurrentRouteOptions = Partial<{
|
||||
parentRoute: ActivatedRoute;
|
||||
pageComponent: unknown;
|
||||
}>;
|
||||
|
||||
/**
|
||||
* Service to provide some helper functions regarding navigation.
|
||||
*/
|
||||
|
@ -310,13 +318,26 @@ export class CoreNavigatorService {
|
|||
/**
|
||||
* Get current activated route.
|
||||
*
|
||||
* @param route Parent route.
|
||||
* @param options
|
||||
* - parent: Parent route, if this isn't provided the current active route will be used.
|
||||
* - pageComponent: Page component of the route to find, if this isn't provided the deepest route in the hierarchy
|
||||
* will be returned.
|
||||
* @return Current activated route.
|
||||
*/
|
||||
protected getCurrentRoute(route?: ActivatedRoute): ActivatedRoute {
|
||||
route = route ?? Router.instance.routerState.root;
|
||||
getCurrentRoute(): ActivatedRoute;
|
||||
getCurrentRoute(options: GetCurrentRouteOptions): ActivatedRoute | null;
|
||||
getCurrentRoute({ parentRoute, pageComponent }: GetCurrentRouteOptions = {}): ActivatedRoute | null {
|
||||
parentRoute = parentRoute ?? Router.instance.routerState.root;
|
||||
|
||||
return route.firstChild ? this.getCurrentRoute(route.firstChild) : route;
|
||||
if (pageComponent && parentRoute.component === pageComponent) {
|
||||
return parentRoute;
|
||||
}
|
||||
|
||||
if (parentRoute.firstChild) {
|
||||
return this.getCurrentRoute({ parentRoute: parentRoute.firstChild, pageComponent });
|
||||
}
|
||||
|
||||
return pageComponent ? null : parentRoute;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
Loading…
Reference in New Issue