krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-16 06:07:21 +01:00
Code Issues Packages Projects Releases Wiki Activity

WIP(teams): stylish and functional multi assign checkboxes

Browse Source
This commit is contained in:
SabreCat
2022-02-08 16:47:43 -06:00
parent 82d3545c08
commit 7e73c336dd
4 changed files with 91 additions and 232 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
website/client/src/components/group-plans/taskInformation.vue
View File

@@ -128,7 +128,6 @@
import Vue from 'vue';
import cloneDeep from 'lodash/cloneDeep';
import findIndex from 'lodash/findIndex';
import groupBy from 'lodash/groupBy';
import moment from 'moment';
import taskDefaults from '@/../../common/script/libs/taskDefaults';
import TaskColumn from '../tasks/column';
@@ -279,23 +278,10 @@ export default {
groupId: this.searchId,
});
const groupedApprovals = await this.loadApprovals();
tasks.forEach(task => {
if (
groupedApprovals[task._id]
&& groupedApprovals[task._id].length > 0
) task.approvals = groupedApprovals[task._id];
this.tasksByType[task.type].push(task);
});
},
async loadApprovals () {
const approvalRequests = await this.$store.dispatch('tasks:getGroupApprovals', {
groupId: this.searchId,
});
return groupBy(approvalRequests, 'group.taskId');
},
editTask (task) {
this.taskFormPurpose = 'edit';
this.editingTask = cloneDeep(task);

86
website/client/src/components/tasks/approvalFooter.vue
View File

@@ -8,14 +8,26 @@
<div
v-for="completion in completionsList"
:key="completion.userId"
class="completion-row"
class="d-flex completion-row"
>
<div class="control">
<div
class="inner d-flex justify-content-center align-items-center p-auto"
:class="{interactive: iconClass(completion) !== 'lock'}"
@click="iconClass(completion) !== 'lock' ? needsWork(completion) : null"
>
<div
class="icon"
:class="iconClass(completion)"
v-html="icons[iconClass(completion)]"
>
</div>
</div>
</div>
<div
class="px-3 py-2"
class="px-3 py-2 info"
>
<div>
<span v-if="completion.completed">✅</span>
<span v-else>❎</span>
<strong> @{{ completion.userName }} </strong>
</div>
<div
@@ -77,22 +89,61 @@
color: $blue-10;
}
}
.completion-row {
height: 3rem;
background-color: $gray-700;
font-size: 12px;
&:not(:last-of-type) {
border-bottom: 1px solid $gray-500;
.control {
background-color: $gray-200;
border-top: 1px solid $gray-100;
width: 44px;
height: 48px;
padding: 9px 6px;
.inner {
width: 28px;
height: 28px;
padding: 6px;
border-radius: 2px;
background-color: rgba($white, 0.5);
cursor: default;
&.interactive {
cursor: pointer;
&:hover {
background-color: rgba($white, 0.75);
}
}
.icon {
color: $gray-10;
&.lock {
width: 10px;
}
&.check {
margin-left: 2px;
width: 12px;
}
}
}
}
.green-10 {
color: $green-10;
.info {
width: 100%;
border-top: 1px solid $gray-600;
}
}
.gray-100 {
color: $gray-100;
}
.green-10 {
color: $green-10;
}
</style>
<script>
@@ -101,12 +152,18 @@ import keys from 'lodash/keys';
import moment from 'moment';
import reduce from 'lodash/reduce';
import { mapState } from '@/libs/store';
import checkIcon from '@/assets/svg/check.svg';
import lockIcon from '@/assets/svg/lock.svg';
export default {
props: ['task', 'group'],
data () {
return {
showStatus: false,
icons: Object.freeze({
check: checkIcon,
lock: lockIcon,
}),
};
},
computed: {
@@ -173,5 +230,18 @@ export default {
return this.$t('error');
},
},
methods: {
iconClass (completion) {
if ((this.userIsAssigned || this.userIsManager) && completion.completed) return 'check';
return 'lock';
},
needsWork (completion) {
this.$store.dispatch('tasks:needsWork', {
taskId: this.task._id,
userId: completion.userId,
});
this.task.group.assignedUsers[completion.userId].completed = false;
},
},
};
</script>

3
website/client/src/components/tasks/taskModal.vue
View File

@@ -669,9 +669,6 @@
}
input, textarea {
&:not(:host-context(.tags-popup)) {
border: none;
}
transition-property: border-color, box-shadow, color, background;
background-color: rgba(255, 255, 255, 0.5);
&:focus:not(:disabled), &:active:not(:disabled), &:hover:not(:disabled) {

220
website/server/controllers/api-v3/tasks/groups.js
View File

@@ -12,13 +12,12 @@ import {
canNotEditTasks,
createTasks,
getTasks,
scoreTasks,
} from '../../../libs/tasks';
import {
moveTask,
} from '../../../libs/tasks/utils';
import { handleSharedCompletion } from '../../../libs/groupTasks';
import apiError from '../../../libs/apiError';
import logger from '../../../libs/logger';
const requiredGroupFields = '_id leader tasksOrder name';
// @TODO: abstract to task lib
@@ -299,111 +298,6 @@ api.unassignTask = {
},
};
/**
* @api {post} /api/v3/tasks/:taskId/approve/:userId Approve a user's task
* @apiDescription Approves a user assigned to a group task
* @apiVersion 3.0.0
* @apiName ApproveTask
* @apiGroup Task
*
* @apiParam (Path) {UUID} taskId The id of the task that is the original group task
* @apiParam (Path) {UUID} userId The id of the user that will be approved
*
* @apiSuccess task The approved task
*/
api.approveTask = {
method: 'POST',
url: '/tasks/:taskId/approve/:userId',
middlewares: [authWithHeaders()],
async handler (req, res) {
req.checkParams('taskId', apiError('taskIdRequired')).notEmpty().isUUID();
req.checkParams('userId', res.t('userIdRequired')).notEmpty().isUUID();
const reqValidationErrors = req.validationErrors();
if (reqValidationErrors) throw reqValidationErrors;
const { user } = res.locals;
const assignedUserId = req.params.userId;
const assignedUser = await User.findById(assignedUserId).exec();
const { taskId } = req.params;
const task = await Tasks.Task.findOne({
'group.taskId': taskId,
userId: assignedUserId,
}).exec();
if (!task) {
throw new NotFound(res.t('messageTaskNotFound'));
}
const fields = requiredGroupFields.concat(' managers');
const group = await Group.getGroup({ user, groupId: task.group.id, fields });
if (!group) throw new NotFound(res.t('groupNotFound'));
if (canNotEditTasks(group, user)) throw new NotAuthorized(res.t('onlyGroupLeaderCanEditTasks'));
if (task.group.approval.approved === true) throw new NotAuthorized(res.t('canOnlyApproveTaskOnce'));
if (!task.group.approval.requested) {
throw new NotAuthorized(res.t('taskApprovalWasNotRequested'));
}
task.group.approval.dateApproved = new Date();
task.group.approval.approvingUser = user._id;
task.group.approval.approved = true;
// Get Managers
const managerIds = Object.keys(group.managers);
managerIds.push(group.leader);
const managers = await User.find({ _id: managerIds }, 'notifications').exec(); // Use this method so we can get access to notifications
// Get task direction
const firstManagerNotifications = managers[0].notifications;
const firstNotificationIndex = firstManagerNotifications.findIndex(notification => notification && notification.data && notification.data.taskId === task._id && notification.type === 'GROUP_TASK_APPROVAL');
let direction = 'up';
if (firstManagerNotifications[firstNotificationIndex]) {
direction = firstManagerNotifications[firstNotificationIndex].direction || direction;
}
// Remove old notifications
const approvalPromises = [];
managers.forEach(manager => {
const notificationIndex = manager.notifications.findIndex(notification => notification && notification.data && notification.data.taskId === task._id && notification.type === 'GROUP_TASK_APPROVAL');
if (notificationIndex !== -1) {
manager.notifications.splice(notificationIndex, 1);
approvalPromises.push(manager.save());
}
});
// Add new notifications to user
assignedUser.addNotification('GROUP_TASK_APPROVED', {
message: res.t('yourTaskHasBeenApproved', { taskText: task.text }),
groupId: group._id,
task,
direction,
});
approvalPromises.push(task.save());
approvalPromises.push(assignedUser.save());
await Promise.all(approvalPromises);
res.respond(200, task);
// Wrapping everything in a try/catch block because if an error occurs
// using `await` it MUST NOT bubble up because the request has already been handled
try {
const groupTask = await Tasks.Task.findOne({
_id: task.group.taskId,
}).exec();
if (groupTask) {
await handleSharedCompletion(groupTask, task);
}
} catch (e) {
logger.error('Error handling group task', e);
}
},
};
/**
* @api {post} /api/v3/tasks/:taskId/needs-work/:userId Require more work for a group task
* @apiDescription Mark an assigned group task as needing more work before it can be approved
@@ -435,122 +329,34 @@ api.taskNeedsWork = {
const [assignedUser, task] = await Promise.all([
User.findById(assignedUserId).exec(),
await Tasks.Task.findOne({
'group.taskId': taskId,
userId: assignedUserId,
_id: taskId,
}).exec(),
]);
if (!task) {
throw new NotFound(res.t('messageTaskNotFound'));
}
if (['daily', 'todo'].indexOf(task.type) === -1) {
throw new BadRequest('Cannot roll back use of Habits or Rewards.');
}
if (!task.group.assignedUsers || !task.group.assignedUsers[assignedUserId]) {
throw new BadRequest('User not assigned to this task.');
}
if (!task.group.assignedUsers[assignedUserId].completed) {
throw new BadRequest('Task not completed by this user.');
}
const fields = requiredGroupFields.concat(' managers');
const group = await Group.getGroup({ user, groupId: task.group.id, fields });
if (!group) throw new NotFound(res.t('groupNotFound'));
if (canNotEditTasks(group, user)) throw new NotAuthorized(res.t('onlyGroupLeaderCanEditTasks'));
if (task.group.approval.approved === true) throw new NotAuthorized(res.t('canOnlyApproveTaskOnce'));
if (!task.group.approval.requested) {
throw new NotAuthorized(res.t('taskApprovalWasNotRequested'));
}
// Get Managers
const managerIds = Object.keys(group.managers);
managerIds.push(group.leader);
const managers = await User.find({ _id: managerIds }, 'notifications').exec(); // Use this method so we can get access to notifications
const promises = [];
// Remove old notifications
managers.forEach(manager => {
const notificationIndex = manager.notifications.findIndex(notification => notification && notification.data && notification.data.taskId === task._id && notification.type === 'GROUP_TASK_APPROVAL');
if (notificationIndex !== -1) {
manager.notifications.splice(notificationIndex, 1);
promises.push(manager.save());
}
});
task.group.approval.requested = false;
task.group.approval.requestedDate = undefined;
const taskText = task.text;
const managerName = user.profile.name;
const message = res.t('taskNeedsWork', { taskText, managerName }, assignedUser.preferences.language);
assignedUser.addNotification('GROUP_TASK_NEEDS_WORK', {
message,
task: {
id: task._id,
text: taskText,
},
group: {
id: group._id,
name: group.name,
},
manager: {
id: user._id,
name: managerName,
},
});
await Promise.all([...promises, assignedUser.save(), task.save()]);
await scoreTasks(assignedUser, [{ id: task._id, direction: 'down' }], req, res);
await Promise.all([assignedUser.save(), task.save()]);
res.respond(200, task);
},
};
/**
* @api {get} /api/v3/approvals/group/:groupId Get a group's approvals
* @apiVersion 3.0.0
* @apiName GetGroupApprovals
* @apiGroup Task
*
* @apiParam (Path) {UUID} groupId The id of the group from which to retrieve the approvals
*
* @apiSuccess {Array} data An array of tasks
*/
api.getGroupApprovals = {
method: 'GET',
url: '/approvals/group/:groupId',
middlewares: [authWithHeaders()],
async handler (req, res) {
req.checkParams('groupId', apiError('groupIdRequired')).notEmpty().isUUID();
const validationErrors = req.validationErrors();
if (validationErrors) throw validationErrors;
const { user } = res.locals;
const { groupId } = req.params;
const fields = requiredGroupFields.concat(' managers');
const group = await Group.getGroup({ user, groupId, fields });
if (!group) throw new NotFound(res.t('groupNotFound'));
let approvals;
if (canNotEditTasks(group, user)) {
approvals = await Tasks.Task.find({
'group.id': groupId,
'group.approval.approved': { $ne: true },
'group.approval.requested': true,
'group.assignedUsers': user._id,
userId: user._id,
}, 'userId group text')
.populate('userId', 'profile')
.exec();
} else {
approvals = await Tasks.Task.find({
'group.id': groupId,
'group.approval.approved': { $ne: true },
'group.approval.requested': true,
}, 'userId group text')
.populate('userId', 'profile')
.exec();
}
res.respond(200, approvals);
},
};
export default api;