Added ability to mark card as done

Closes #534

Signed-off-by: Thanos Kamber <thanos.kamber@gmail.com>

appinfo/routes.php

@@ -61,6 +61,8 @@ return [
 		['name' => 'card#reorder', 'url' => '/cards/{cardId}/reorder', 'verb' => 'PUT'],
 		['name' => 'card#archive', 'url' => '/cards/{cardId}/archive', 'verb' => 'PUT'],
 		['name' => 'card#unarchive', 'url' => '/cards/{cardId}/unarchive', 'verb' => 'PUT'],
+		['name' => 'card#done', 'url' => '/cards/{cardId}/done', 'verb' => 'PUT'],
+		['name' => 'card#undone', 'url' => '/cards/{cardId}/undone', 'verb' => 'PUT'],
 		['name' => 'card#assignLabel', 'url' => '/cards/{cardId}/label/{labelId}', 'verb' => 'POST'],
 		['name' => 'card#removeLabel', 'url' => '/cards/{cardId}/label/{labelId}', 'verb' => 'DELETE'],
 		['name' => 'card#assignUser', 'url' => '/cards/{cardId}/assign', 'verb' => 'POST'],

docs/API.md

@@ -601,6 +601,7 @@ The board list endpoint supports setting an `If-Modified-Since` header to limit
    "owner":"admin",
    "order":999,
    "archived":false,
+   "done":false,
    "duedate": "2019-12-24T19:29:30+00:00",
    "deletedAt":0,
    "commentsUnread":0,
@@ -628,8 +629,11 @@ The board list endpoint supports setting an `If-Modified-Since` header to limit
 | title     | String | The title of the card, maximum length is limited to 255 characters |
 | description | String    | The markdown description of the card                 |
 | type        | String    | Type of the card (for later use) use 'plain' for now |
+| owner       | String    | The user that owns the card                          |
 | order       | Integer   | Order for sorting the stacks                         |
 | duedate     | timestamp | The ISO-8601 formatted duedate of the card or null   |
+| archived    | bool      | Whether the card is archived or not                  |
+| done        | bool      | Whether the card is marked as done or not            |
 
 
 ```
@@ -637,8 +641,11 @@ The board list endpoint supports setting an `If-Modified-Since` header to limit
    "title": "Test card",
    "description": "A card description",
    "type": "plain",
+   "owner": "admin",
    "order": 999,
    "duedate": "2019-12-24T19:29:30+00:00",
+   "archived": false,
+   "done": false,
 }
 ```
 

docs/User_documentation_en.md

@@ -12,11 +12,12 @@ Overall, Deck is easy to use. You can create boards, add users, share the Deck,
 1. [Create my first board](#1-create-my-first-board)
 2. [Create stacks and cards](#2-create-stacks-and-cards)
 3. [Handle cards options](#3-handle-cards-options)
-4. [Archive old tasks](#4-archive-old-tasks)
-5. [Manage your board](#5-manage-your-board)
-6. [Import boards](#6-import-boards)
-7. [Search](#7-search)
-8. [New owner for the deck entities](#8-new-owner-for-the-deck-entities)
+4. [Mark task as done](#4-mark-as-done)
+5. [Archive old tasks](#5-archive-old-tasks)
+6. [Manage your board](#6-manage-your-board)
+7. [Import boards](#7-import-boards)
+8. [Search](#8-search)
+9. [New owner for the deck entities](#9-new-owner-for-the-deck-entities)
 
 ### 1. Create my first board
 In this example, we're going to create a board and share it with an other nextcloud user.
@@ -53,12 +54,18 @@ And even :
 
 ![Gif for puting infos on tasks 2](resources/gifs/EN_put_infos_2.gif)
 
-### 4. Archive old tasks
-Once finished or obsolete, a task could be archived. The tasks is not deleted, it's just archived, and you can retrieve it later
+### 4. Mark as done
+Once a task has been completed, you can mark it as done. This will prevent it from becoming overdue and hide it from the upcoming cards.
+You can mark it as not done at any time.
 
-![Gif for puting infos on tasks 2](resources/gifs/EN_archive.gif)
+![Gif for marking a card as done](resources/gifs/EN_done.gif)
 
-### 5. Manage your board
+### 5. Archive old tasks
+Once obsolete, a task could be archived. The task is not deleted, it's just archived, and you can retrieve it later
+
+![Gif for archiving a task](resources/gifs/EN_archive.gif)
+
+### 6. Manage your board
 You can manage the settings of your Deck once you are inside it, by clicking on the small wheel at the top right.
 Once in this menu, you have access to several things:
 
@@ -72,7 +79,7 @@ The **sharing tab** allows you to add users or even groups to your boards.
 **Deleted objects** allows you to return previously deleted stacks or cards.  
 The **Timeline** allows you to see everything that happened in your boards. Everything!
 
-### 6. Import boards
+### 7. Import boards
 
 Importing can be done using the API or the `occ` `deck:import` command.
 
@@ -138,7 +145,7 @@ Example configuration file:
 }
 ```
 
-### 7. Search
+### 8. Search
 
 Deck provides a global search either through the unified search in the Nextcloud header or with the inline search next to the board controls.
 This search allows advanced filtering of cards across all board of the logged in user.
@@ -161,7 +168,7 @@ Other text tokens will be used to perform a case-insensitive search on the card
 
 In addition, quotes can be used to pass a query with spaces, e.g. `"Exact match with spaces"` or `title:"My card"`.
 
-### 8. New owner for the deck entities
+### 9. New owner for the deck entities
 You can transfer ownership of boards, cards, etc to a new user, using `occ` command `deck:transfer-ownership`
 
 ```bash

lib/Activity/ActivityManager.php

@@ -91,6 +91,8 @@ class ActivityManager {
 	public const SUBJECT_CARD_UPDATE_DUEDATE = 'card_update_duedate';
 	public const SUBJECT_CARD_UPDATE_ARCHIVE = 'card_update_archive';
 	public const SUBJECT_CARD_UPDATE_UNARCHIVE = 'card_update_unarchive';
+	public const SUBJECT_CARD_UPDATE_DONE = 'card_update_done';
+	public const SUBJECT_CARD_UPDATE_UNDONE = 'card_update_undone';
 	public const SUBJECT_CARD_UPDATE_STACKID = 'card_update_stackId';
 	public const SUBJECT_CARD_USER_ASSIGN = 'card_user_assign';
 	public const SUBJECT_CARD_USER_UNASSIGN = 'card_user_unassign';
@@ -198,6 +200,12 @@ class ActivityManager {
 			case self::SUBJECT_CARD_UPDATE_UNARCHIVE:
 				$subject = $ownActivity ? $l->t('You have unarchived card {card} in list {stack} on board {board}') : $l->t('{user} has unarchived card {card} in list {stack} on board {board}');
 				break;
+			case self::SUBJECT_CARD_UPDATE_DONE:
+				$subject = $ownActivity ? $l->t('You have marked the card {card} as done in list {stack} on board {board}') : $l->t('{user} has marked card {card} as done in list {stack} on board {board}');
+				break;
+			case self::SUBJECT_CARD_UPDATE_UNDONE:
+				$subject = $ownActivity ? $l->t('You have marked the card {card} as undone in list {stack} on board {board}') : $l->t('{user} has marked the card {card} as undone in list {stack} on board {board}');
+				break;
 			case self::SUBJECT_CARD_UPDATE_DUEDATE:
 				if (!isset($subjectParams['after'])) {
 					$subject = $ownActivity ? $l->t('You have removed the due date of card {card}') : $l->t('{user} has removed the due date of card {card}');
@@ -357,6 +365,8 @@ class ActivityManager {
 			case self::SUBJECT_CARD_DELETE:
 			case self::SUBJECT_CARD_UPDATE_ARCHIVE:
 			case self::SUBJECT_CARD_UPDATE_UNARCHIVE:
+			case self::SUBJECT_CARD_UPDATE_DONE:
+			case self::SUBJECT_CARD_UPDATE_UNDONE:
 			case self::SUBJECT_CARD_UPDATE_TITLE:
 			case self::SUBJECT_CARD_UPDATE_DESCRIPTION:
 			case self::SUBJECT_CARD_UPDATE_DUEDATE:

lib/Controller/CardApiController.php

@@ -104,8 +104,8 @@ class CardApiController extends ApiController {
 	 *
 	 * Update a card
 	 */
-	public function update($title, $type, $owner, $description = '', $order = 0, $duedate = null, $archived = null) {
-		$card = $this->cardService->update($this->request->getParam('cardId'), $title, $this->request->getParam('stackId'), $type, $owner, $description, $order, $duedate, 0, $archived);
+	public function update($title, $type, $owner, $description = '', $order = 0, $duedate = null, $archived = null, ?bool $done = null) {
+		$card = $this->cardService->update($this->request->getParam('cardId'), $title, $this->request->getParam('stackId'), $type, $owner, $description, $order, $duedate, 0, $archived, $done);
 		return new DataResponse($card, HTTP::STATUS_OK);
 	}
 

lib/Controller/CardController.php

@@ -143,6 +143,24 @@ class CardController extends Controller {
 		return $this->cardService->unarchive($cardId);
 	}
 
+	/**
+	 * @NoAdminRequired
+	 * @param $cardId
+	 * @return \OCP\AppFramework\Db\Entity
+	 */
+	public function done(int $cardId) {
+		return $this->cardService->done($cardId);
+	}
+
+	/**
+	 * @NoAdminRequired
+	 * @param $cardId
+	 * @return \OCP\AppFramework\Db\Entity
+	 */
+	public function undone(int $cardId) {
+		return $this->cardService->undone($cardId);
+	}
+
 	/**
 	 * @NoAdminRequired
 	 * @param $cardId

lib/Db/Card.php

@@ -83,6 +83,7 @@ class Card extends RelationalEntity {
 	protected $owner;
 	protected $order;
 	protected $archived = false;
+	protected $done = false;
 	protected $duedate;
 	protected $notified = false;
 	protected $deletedAt = 0;
@@ -106,6 +107,7 @@ class Card extends RelationalEntity {
 		$this->addType('lastModified', 'integer');
 		$this->addType('createdAt', 'integer');
 		$this->addType('archived', 'boolean');
+		$this->addType('done', 'boolean');
 		$this->addType('notified', 'boolean');
 		$this->addType('deletedAt', 'integer');
 		$this->addType('duedate', 'datetime');

lib/Db/CardMapper.php

@@ -263,6 +263,7 @@ class CardMapper extends QBMapper implements IPermissionMapper {
 			->where($qb->expr()->in('s.board_id', $qb->createNamedParameter($boardIds, IQueryBuilder::PARAM_INT_ARRAY)))
 			->andWhere($qb->expr()->isNotNull('c.duedate'))
 			->andWhere($qb->expr()->eq('c.archived', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
+			->andWhere($qb->expr()->eq('c.done', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
 			->andWhere($qb->expr()->eq('c.deleted_at', $qb->createNamedParameter(0, IQueryBuilder::PARAM_INT)))
 			->andWhere($qb->expr()->eq('s.deleted_at', $qb->createNamedParameter(0, IQueryBuilder::PARAM_INT)))
 			->andWhere($qb->expr()->eq('b.archived', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
@@ -284,6 +285,7 @@ class CardMapper extends QBMapper implements IPermissionMapper {
 			)
 			// Filter out archived/deleted cards and board
 			->andWhere($qb->expr()->eq('c.archived', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
+			->andWhere($qb->expr()->eq('c.done', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
 			->andWhere($qb->expr()->eq('c.deleted_at', $qb->createNamedParameter(0, IQueryBuilder::PARAM_INT)))
 			->andWhere($qb->expr()->eq('s.deleted_at', $qb->createNamedParameter(0, IQueryBuilder::PARAM_INT)))
 			->andWhere($qb->expr()->eq('b.archived', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
@@ -298,6 +300,7 @@ class CardMapper extends QBMapper implements IPermissionMapper {
 			->where($qb->expr()->lt('duedate', $qb->createFunction('NOW()')))
 			->andWhere($qb->expr()->eq('notified', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
 			->andWhere($qb->expr()->eq('archived', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
+			->andWhere($qb->expr()->eq('done', $qb->createNamedParameter(false, IQueryBuilder::PARAM_BOOL)))
 			->andWhere($qb->expr()->eq('deleted_at', $qb->createNamedParameter(0, IQueryBuilder::PARAM_INT)));
 		return $this->findEntities($qb);
 	}

lib/Migration/Version1011Date20230901010840.php

@@ -0,0 +1,60 @@
+<?php
+
+declare(strict_types=1);
+
+/**
+ * @copyright Copyright (c) 2023 Thanos kamber <thanos.kamber@gmail.com>
+ *
+ * @author Thanos kamber <thanos.kamber@gmail.com>
+ *
+ * @license GNU AGPL version 3 or any later version
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as
+ * published by the Free Software Foundation, either version 3 of the
+ * License, or (at your option) any later version.
+ *
+ * This program is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ *
+ */
+
+namespace OCA\Deck\Migration;
+
+use Closure;
+use OCP\DB\ISchemaWrapper;
+use OCP\Migration\IOutput;
+use OCP\Migration\SimpleMigrationStep;
+
+/**
+ * Auto-generated migration step: Please modify to your needs!
+ */
+class Version1011Date20230901010840 extends SimpleMigrationStep {
+	/**
+	 * @param IOutput $output
+	 * @param Closure $schemaClosure
+	 * @param array $options
+	 * @return null|ISchemaWrapper
+	 */
+	public function changeSchema(IOutput $output, Closure $schemaClosure, array $options): ?ISchemaWrapper {
+		/** @var ISchemaWrapper $schema */
+		$schema = $schemaClosure();
+
+		$table = $schema->getTable('deck_cards');
+		if (!$table->hasColumn('done')) {
+			$table->addColumn('done', 'boolean', [
+				'default' => false,
+				'notnull' => true,
+			]);
+
+			return $schema;
+		}
+
+		return null;
+	}
+}

lib/Service/CardService.php

@@ -284,6 +284,9 @@ class CardService {
 	 * @param $description
 	 * @param $order
 	 * @param $duedate
+	 * @param $deletedAt
+	 * @param $archived
+	 * @param $done
 	 * @return \OCP\AppFramework\Db\Entity
 	 * @throws StatusException
 	 * @throws \OCA\Deck\NoPermissionException
@@ -291,7 +294,7 @@ class CardService {
 	 * @throws \OCP\AppFramework\Db\MultipleObjectsReturnedException
 	 * @throws BadRequestException
 	 */
-	public function update($id, $title, $stackId, $type, $owner, $description = '', $order = 0, $duedate = null, $deletedAt = null, $archived = null) {
+	public function update($id, $title, $stackId, $type, $owner, $description = '', $order = 0, $duedate = null, $deletedAt = null, $archived = null, ?bool $done = null) {
 		$this->cardServiceValidator->check(compact('id', 'title', 'stackId', 'type', 'owner', 'order'));
 
 		$this->permissionService->checkPermission($this->cardMapper, $id, Acl::PERMISSION_EDIT);
@@ -341,6 +344,9 @@ class CardService {
 		if ($archived !== null) {
 			$card->setArchived($archived);
 		}
+		if ($done !== null) {
+			$card->setDone($done);
+		}
 
 
 		// Trigger update events before setting description as it is handled separately
@@ -511,6 +517,57 @@ class CardService {
 		return $newCard;
 	}
 
+	/**
+	 * @param $id
+	 * @return \OCA\Deck\Db\Card
+	 * @throws StatusException
+	 * @throws \OCA\Deck\NoPermissionException
+	 * @throws \OCP\AppFramework\Db\DoesNotExistException
+	 * @throws \OCP\AppFramework\Db\MultipleObjectsReturnedException
+	 * @throws BadRequestException
+	 */
+	public function done(int $id): Card {
+		$this->permissionService->checkPermission($this->cardMapper, $id, Acl::PERMISSION_EDIT);
+		if ($this->boardService->isArchived($this->cardMapper, $id)) {
+			throw new StatusException('Operation not allowed. This board is archived.');
+		}
+		$card = $this->cardMapper->find($id);
+		$card->setDone(true);
+		$newCard = $this->cardMapper->update($card);
+		$this->notificationHelper->markDuedateAsRead($card);
+		$this->activityManager->triggerEvent(ActivityManager::DECK_OBJECT_CARD, $newCard, ActivityManager::SUBJECT_CARD_UPDATE_DONE);
+		$this->changeHelper->cardChanged($id, false);
+
+		$this->eventDispatcher->dispatchTyped(new CardUpdatedEvent($card));
+
+		return $newCard;
+	}
+
+	/**
+	 * @param $id
+	 * @return \OCA\Deck\Db\Card
+	 * @throws StatusException
+	 * @throws \OCA\Deck\NoPermissionException
+	 * @throws \OCP\AppFramework\Db\DoesNotExistException
+	 * @throws \OCP\AppFramework\Db\MultipleObjectsReturnedException
+	 * @throws BadRequestException
+	 */
+	public function undone(int $id): Card {
+		$this->permissionService->checkPermission($this->cardMapper, $id, Acl::PERMISSION_EDIT);
+		if ($this->boardService->isArchived($this->cardMapper, $id)) {
+			throw new StatusException('Operation not allowed. This board is archived.');
+		}
+		$card = $this->cardMapper->find($id);
+		$card->setDone(false);
+		$newCard = $this->cardMapper->update($card);
+		$this->activityManager->triggerEvent(ActivityManager::DECK_OBJECT_CARD, $newCard, ActivityManager::SUBJECT_CARD_UPDATE_UNDONE);
+		$this->changeHelper->cardChanged($id, false);
+
+		$this->eventDispatcher->dispatchTyped(new CardUpdatedEvent($card));
+
+		return $newCard;
+	}
+
 	/**
 	 * @param $cardId
 	 * @param $labelId

src/components/card/CardSidebarTabDetails.vue

@@ -22,6 +22,31 @@
 
 <template>
 	<div v-if="copiedCard">
+		<div class="section-wrapper">
+			<div class="section-details">
+				<div class="button-group">
+					<NcButton v-if="!card.done" type="secondary" @click="changeCardDoneStatus()">
+						<template #icon>
+							<CheckIcon :size="20" />
+						</template>
+						{{ t('deck', 'Mark as Done') }}
+					</NcButton>
+					<NcButton v-if="card.done" type="tertiary" @click="changeCardDoneStatus()">
+						<template #icon>
+							<ClearIcon :size="20" />
+						</template>
+						{{ t('deck', 'Mark as not Done') }}
+					</NcButton>
+					<NcButton type="tertiary" @click="archiveUnarchiveCard()">
+						<template #icon>
+							<ArchiveIcon :size="20" />
+						</template>
+						{{ card.archived ? t('deck', 'Unarchive card') : t('deck', 'Archive card') }}
+					</NcButton>
+				</div>
+			</div>
+		</div>
+
 		<TagSelector :card="card"
 			:labels="currentBoard.labels"
 			:disabled="!canEdit"
@@ -35,7 +60,21 @@
 			@select="assignUserToCard"
 			@remove="removeUserFromCard" />
 
-		<DueDateSelector :card="card" :can-edit="canEdit" @change="updateCardDue" />
+		<div v-if="card.done">
+			<div class="done">
+				<div v-if="!card.duedate && card.done" class="no-due">
+					{{ t('deck', 'No due date') }}
+				</div>
+				<div v-if="card.done" class="done-label">
+					{{ t('deck', 'Done') }}
+				</div>
+			</div>
+		</div>
+
+		<DueDateSelector v-else
+			:card="card"
+			:can-edit="canEdit && !saving"
+			@change="updateCardDue" />
 
 		<div v-if="projectsEnabled" class="section-wrapper">
 			<CollectionList v-if="card.id"
@@ -55,6 +94,10 @@
 <script>
 import { mapState, mapGetters } from 'vuex'
 import moment from '@nextcloud/moment'
+import ArchiveIcon from 'vue-material-design-icons/Archive.vue'
+import CheckIcon from 'vue-material-design-icons/Check.vue'
+import ClearIcon from 'vue-material-design-icons/Close.vue'
+import { NcButton } from '@nextcloud/vue'
 import { loadState } from '@nextcloud/initial-state'
 
 import { CollectionList } from 'nextcloud-vue-collections'
@@ -75,6 +118,10 @@ export default {
 		TagSelector,
 		Description,
 		CollectionList,
+		NcButton,
+		ArchiveIcon,
+		CheckIcon,
+		ClearIcon,
 	},
 	mixins: [Color],
 	props: {
@@ -121,6 +168,12 @@ export default {
 			this.$store.dispatch('updateCardDesc', { ...this.card, description: newDesc })
 			this.copiedCard.description = newDesc
 		},
+		changeCardDoneStatus() {
+			this.$store.dispatch('changeCardDoneStatus', { ...this.card, done: !this.card.done })
+		},
+		archiveUnarchiveCard() {
+			this.$store.dispatch('archiveUnarchiveCard', { ...this.card, archived: !this.card.archived })
+		},
 		async initialize() {
 			if (!this.card) {
 				return
@@ -218,12 +271,60 @@ export default {
 		display: flex;
 		flex-wrap: wrap;
 
-		button.action-item--single {
-			margin-top: -3px;
+		.remove-due-button{
+			margin-top: -2px;
+			margin-left: 6px;
 		}
 	}
 }
 
+.button-group {
+	width: 100%;
+	display: flex;
+
+	button {
+		width: 100%;
+	}
+}
+
+.done{
+	display: flex;
+	margin-left: 40px;
+
+	.no-due, .done-label{
+		line-height: 30px;
+		align-items: baseline;
+		flex-shrink: 1;
+		z-index: 2;
+		margin: 13px 5px 5px;
+		font-size: 100%;
+	}
+
+	.no-due{
+		padding: 3px;
+		color: var(--color-main-text);
+	}
+
+	.done-label {
+		font-size: 90%;
+		padding: 3px 20px;
+
+		color: var(--color-primary-text);
+		background-color: var(--color-success);
+		border-radius: 15px;
+	}
+}
+
+.tag {
+	flex-grow: 0;
+	flex-shrink: 1;
+	overflow: hidden;
+	padding: 0px 5px;
+	border-radius: 15px;
+	font-size: 85%;
+	margin-right: 3px;
+}
+
 .avatarLabel {
 	padding: 6px
 }

src/components/cards/CardItem.vue

@@ -64,7 +64,8 @@
 					<input type="submit" value="" class="icon-confirm">
 				</form>
 
-				<DueDate v-if="!editing" :card="card" />
+				<DueDate v-if="!editing && !card.done" :card="card" />
+				<Done v-else-if="!editing && card.done" :card="card" />
 
 				<CardMenu v-if="!editing && compactMode" :card="card" class="right" />
 			</div>
@@ -94,12 +95,13 @@ import Color from '../../mixins/color.js'
 import labelStyle from '../../mixins/labelStyle.js'
 import AttachmentDragAndDrop from '../AttachmentDragAndDrop.vue'
 import CardMenu from './CardMenu.vue'
+import Done from './badges/Done.vue'
 import DueDate from './badges/DueDate.vue'
 import CardCover from './CardCover.vue'
 
 export default {
 	name: 'CardItem',
-	components: { CardBadges, AttachmentDragAndDrop, CardMenu, DueDate, CardCover },
+	components: { CardBadges, AttachmentDragAndDrop, CardMenu, DueDate, CardCover, Done },
 	directives: {
 		ClickOutside,
 	},

src/components/cards/CardMenu.vue

@@ -36,6 +36,9 @@
 					@click="unassignCardFromMe()">
 					{{ t('deck', 'Unassign myself') }}
 				</NcActionButton>
+				<NcActionButton icon="icon-checkmark" :close-after-click="true" @click="changeCardDoneStatus()">
+					{{ card.done ? t('deck', 'Mark as not done') : t('deck', 'Mark as done') }}
+				</NcActionButton>
 				<NcActionButton icon="icon-external" :close-after-click="true" @click="modalShow=true">
 					{{ t('deck', 'Move card') }}
 				</NcActionButton>
@@ -157,6 +160,9 @@ export default {
 			this.$store.dispatch('deleteCard', this.card)
 			showUndo(t('deck', 'Card deleted'), () => this.$store.dispatch('cardUndoDelete', this.card))
 		},
+		changeCardDoneStatus() {
+			this.$store.dispatch('changeCardDoneStatus', { ...this.card, done: !this.card.done })
+		},
 		archiveUnarchiveCard() {
 			this.$store.dispatch('archiveUnarchiveCard', { ...this.card, archived: !this.card.archived })
 		},

src/components/cards/badges/Done.vue

@@ -0,0 +1,68 @@
+<!--
+  - @copyright Copyright (c) 2022 Thanos Kamber <thanos.kamber@gmail.com>
+  -
+  - @author Thanos Kamber <thanos.kamber@gmail.com>
+  -
+  - @license GNU AGPL version 3 or any later version
+  -
+  - This program is free software: you can redistribute it and/or modify
+  - it under the terms of the GNU Affero General Public License as
+  - published by the Free Software Foundation, either version 3 of the
+  - License, or (at your option) any later version.
+  -
+  - This program is distributed in the hope that it will be useful,
+  - but WITHOUT ANY WARRANTY; without even the implied warranty of
+  - MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+  - GNU Affero General Public License for more details.
+  -
+  - You should have received a copy of the GNU Affero General Public License
+  - along with this program. If not, see <http://www.gnu.org/licenses/>.
+  -
+  -->
+
+<template>
+	<div v-if="card" class="done">
+		<transition name="zoom">
+			<div class="icon-check-circle">
+				<CheckCircle :size="20" />
+			</div>
+		</transition>
+	</div>
+</template>
+
+<script>
+import CheckCircle from 'vue-material-design-icons/CheckCircle.vue'
+
+export default {
+	name: 'Done',
+	components: {
+		CheckCircle,
+	},
+	props: {
+		card: {
+			type: Object,
+			default: null,
+		},
+	},
+}
+</script>
+
+<style lang="scss" scoped>
+	.icon-check-circle {
+		color: var(--color-success);
+		margin: 14px;
+	}
+
+	@media print {
+		.icon-check-circle {
+			span {
+				display: none;
+			}
+
+			&::before {
+				color: var(--color-text-lighter);
+				content: 'Done';
+			}
+		}
+	}
+</style>

src/services/CardApi.js

@@ -165,6 +165,36 @@ export class CardApi {
 			})
 	}
 
+	markCardAsDone(card) {
+		return axios.put(this.url(`/cards/${card.id}/done`))
+			.then(
+				(response) => {
+					return Promise.resolve(response.data)
+				},
+				(err) => {
+					return Promise.reject(err)
+				},
+			)
+			.catch((err) => {
+				return Promise.reject(err)
+			})
+	}
+
+	markCardAsUndone(card) {
+		return axios.put(this.url(`/cards/${card.id}/undone`))
+			.then(
+				(response) => {
+					return Promise.resolve(response.data)
+				},
+				(err) => {
+					return Promise.reject(err)
+				},
+			)
+			.catch((err) => {
+				return Promise.reject(err)
+			})
+	}
+
 	assignLabelToCard(data) {
 		return axios.post(this.url(`/cards/${data.card.id}/label/${data.labelId}`))
 			.then(

src/store/card.js

@@ -334,6 +334,15 @@ export default {
 			const updatedCard = await apiClient[call](card)
 			commit('updateCard', updatedCard)
 		},
+		async changeCardDoneStatus({ commit }, card) {
+			let call = 'markCardAsDone'
+			if (card.done === false) {
+				call = 'markCardAsUndone'
+			}
+
+			const updatedCard = await apiClient[call](card)
+			commit('updateCardProperty', { property: 'done', card: updatedCard })
+		},
 		async assignCardToUser({ commit }, { card, assignee }) {
 			const user = await apiClient.assignUser(card.id, assignee.userId, assignee.type)
 			commit('assignCardToUser', user)

tests/unit/Db/CardTest.php

@@ -41,6 +41,7 @@ class CardTest extends TestCase {
 		$card->setOwner("admin");
 		$card->setOrder(12);
 		$card->setArchived(false);
+		$card->setDone(false);
 		// TODO: relation shared labels acl
 		return $card;
 	}
@@ -87,6 +88,7 @@ class CardTest extends TestCase {
 			'commentsCount' => 0,
 			'lastEditor' => null,
 			'ETag' => $card->getETag(),
+			'done' => false,
 		], (new CardDetails($card))->jsonSerialize());
 	}
 	public function testJsonSerializeLabels() {
@@ -114,6 +116,7 @@ class CardTest extends TestCase {
 			'commentsCount' => 0,
 			'lastEditor' => null,
 			'ETag' => $card->getETag(),
+			'done' => false,
 		], (new CardDetails($card))->jsonSerialize());
 	}
 
@@ -143,6 +146,7 @@ class CardTest extends TestCase {
 			'commentsCount' => 0,
 			'lastEditor' => null,
 			'ETag' => $card->getETag(),
+			'done' => false,
 		], (new CardDetails($card))->jsonSerialize());
 	}
 }