Skip to content

Commit

Permalink
Percentage added index.vue
Browse files Browse the repository at this point in the history
  • Loading branch information
@GarvitSinghal47
GarvitSinghal47 committed Jan 20, 2024
1 parent 384f087 commit 1b21ae9
Show file tree
Hide file tree
Showing 3 changed files with 81 additions and 98 deletions.
94 changes: 2 additions & 92 deletions kolibri/plugins/device/assets/src/views/ManageTasksPage/TaskPanel.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,6 +94,7 @@
import bytesForHumans from 'kolibri.utils.bytesForHumans';
import { TaskStatuses, TaskTypes } from 'kolibri.utils.syncTaskUtils';
import commonDeviceStrings from '../commonDeviceStrings';
const typeToTrMap = {
[TaskTypes.REMOTECONTENTIMPORT]: 'importChannelPartial',
Expand Down Expand Up @@ -130,7 +131,7 @@
export default {
name: 'TaskPanel',
mixins: [commonCoreStrings],
mixins: [commonCoreStrings, commonDeviceStrings],
setup() {
const { windowIsSmall } = useKResponsiveWindow();
return {
Expand All @@ -142,44 +143,8 @@
type: Object,
required: true,
},
appBarTitle: {
type: String,
required: true,
},
},
computed: {
dynamicTitle() {
const channelName = this.task.extra_metadata.channel_name || this.$tr('unknownChannelName');
if (this.task.status === TaskStatuses.RUNNING || this.task.status === TaskStatuses.QUEUED) {
if (
this.task.type === TaskTypes.REMOTECONTENTIMPORT ||
this.task.type === TaskTypes.DISKCONTENTIMPORT
) {
return this.$tr('importChannelWhole', { channelName: channelName });
} else if (
this.task.type === TaskTypes.DELETECHANNEL ||
this.task.type === TaskTypes.DELETECONTENT
) {
return this.$tr('deleteChannelWhole', { channelName: channelName }) + channelName;
}
} else if (this.task.status === TaskStatuses.CANCELED) {
return this.$tr('statusCanceled') + ' - ' + channelName;
} else if (this.task.status === TaskStatuses.FAILED) {
return this.$tr('statusFailed');
} else if (this.task.status === TaskStatuses.COMPLETED) {
return this.$tr('statusComplete') + ' - ' + channelName;
} else if (this.task.status === TaskStatuses.CANCELING) {
return this.$tr('statusCanceling') + ' - ' + channelName;
}
return this.appBarTitle;
},
formattedPercentage() {
return this.taskPercentage !== null
? this.$formatNumber(this.taskPercentage, { style: 'percent' })
: '';
},
buttonLabel() {
if (this.taskIsClearable) {
return this.coreString('clearAction');
Expand Down Expand Up @@ -292,38 +257,8 @@
});
},
},
watch: {
taskPercentage: {
immediate: true,
handler(newPercentage) {
if (newPercentage !== null) {
this.emitUpdatedTitle();
}
},
},
'task.status': {
immediate: true,
handler(newStatus) {
if (
newStatus === TaskStatuses.CANCELED ||
newStatus === TaskStatuses.CANCELING ||
newStatus === TaskStatuses.FAILED ||
newStatus === TaskStatuses.COMPLETED
) {
this.emitUpdatedTitle();
}
},
},
},
methods: {
emitUpdatedTitle() {
const title = this.taskIsRunning
? `${this.formattedPercentage} - ${this.dynamicTitle}`
: this.dynamicTitle;
this.$emit('update-title', title);
},
handleClick() {
if (this.taskIsCompleted || this.taskIsFailed) {
this.$emit('clickclear');
Expand All @@ -346,31 +281,6 @@
message: 'Exported size: ({bytesText})',
context: 'Indicates the number of resources and their size.',
},
statusInProgress: {
message: 'In-progress',
context: 'Label indicating that a task is in progress.',
},
statusInQueue: {
message: 'Waiting',
context: 'Label indicating that a task is queued.\n',
},
statusComplete: {
message: 'Finished',
context: 'Label indicating that the *task* was completed successfully.',
},
statusFailed: {
message: 'Failed',
context: 'Label indicating that a task failed, i.e. it has not been completed.',
},
statusCanceled: {
message: 'Canceled',
context: 'Refers to a canceled task in the task manager section.',
},
statusCanceling: {
message: 'Canceling',
context: 'Refers to a task being canceled in the task manager section.',
},
importChannelWhole: {
message: `Import '{channelName}'`,
context:
Expand Down
61 changes: 55 additions & 6 deletions kolibri/plugins/device/assets/src/views/ManageTasksPage/index.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -123,10 +123,9 @@
},
},
watch: {
managedTasks(val) {
if (val.length > 0) {
this.loading = false;
}
managedTasks: {
handler: 'updateManagedTasks',
deep: true,
},
},
mounted() {
Expand All @@ -138,8 +137,58 @@
}
},
methods: {
updateAppBarTitle(updatedTitle) {
this.pageTitle = updatedTitle;
formattedPercentage(val) {
return this.$formatNumber(val, { style: 'percent' });
},
formattedNumber(val) {
return this.$formatNumber(val);
},
updateManagedTasks(val) {
if (val.length > 0) {
this.loading = false;
}
// Additional logic or updates related to managedTasks
this.updateAppBarTitle();
},
updateAppBarTitle() {
const inProgressTasks = this.managedTasks.filter(task => task.status === 'RUNNING');
const failedTasks = this.managedTasks.filter(task => task.status === 'FAILED');
const canceledTasks = this.managedTasks.filter(task => task.status === 'CANCELED');
const totalTasks = this.managedTasks.length;
const completedTasks = this.managedTasks.filter(task => task.status === 'COMPLETED');
if (failedTasks.length === 1) {
this.pageTitle = `${this.deviceString('statusFailed')} - ${
failedTasks[0].extra_metadata.channel_name
} `;
} else if (failedTasks.length > 1) {
this.pageTitle = `${this.formattedNumber(failedTasks.length)} - ${this.deviceString(
'statusFailed'
)}`;
} else if (totalTasks === 1 && inProgressTasks.length === 1) {
const inProgressTask = inProgressTasks[0];
this.pageTitle = `${this.formattedPercentage(inProgressTask.percentage)} - ${
inProgressTask.extra_metadata.channel_name
} `;
} else if (totalTasks > 1 && inProgressTasks.length >= 1) {
const averageProgress =
inProgressTasks.reduce((sum, task) => sum + task.percentage, 0) /
inProgressTasks.length;
if (averageProgress === 1) {
this.pageTitle = this.deviceString('statusComplete');
} else {
this.pageTitle = `${this.formattedPercentage(averageProgress)} - ${this.deviceString(
'statusInProgress'
)}`;
}
} else if (totalTasks > 0 && completedTasks.length === totalTasks) {
this.pageTitle = this.deviceString('statusComplete');
} else if (canceledTasks.length > 0) {
this.pageTitle = this.deviceString('statusCanceled');
} else {
this.pageTitle = this.$tr('appBarTitle');
}
},
handleClickClear(task) {
TaskResource.clear(task.id).catch(() => {
Expand Down
24 changes: 24 additions & 0 deletions kolibri/plugins/device/assets/src/views/commonDeviceStrings.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,30 @@ const deviceStrings = createTranslator('CommonDeviceStrings', {
message: 'Newly downloaded resources will be added to the primary storage location',
context: 'Label for primary storage location.',
},
statusInProgress: {
message: 'In-progress',
context: 'Label indicating that a task is in progress.',
},
statusInQueue: {
message: 'Waiting',
context: 'Label indicating that a task is queued.\n',
},
statusComplete: {
message: 'Finished',
context: 'Label indicating that the *task* was completed successfully.',
},
statusFailed: {
message: 'Failed',
context: 'Label indicating that a task failed, i.e. it has not been completed.',
},
statusCanceled: {
message: 'Canceled',
context: 'Refers to a canceled task in the task manager section.',
},
statusCanceling: {
message: 'Canceling',
context: 'Refers to a task being canceled in the task manager section.',
},
});

/**
Expand Down

0 comments on commit 1b21ae9

Please sign in to comment.