Implement done state for due dates

Signed-off-by: Julius Härtl <jus@bitgrid.net>

lib/Controller/CardController.php

@@ -94,8 +94,8 @@ class CardController extends Controller {
 	 * @param $deletedAt
 	 * @return \OCP\AppFramework\Db\Entity
 	 */
-	public function update($id, $title, $stackId, $type, $order, $description, $duedate, $deletedAt) {
-		return $this->cardService->update($id, $title, $stackId, $type, $order, $description, $this->userId, $duedate, $deletedAt);
+	public function update($id, $title, $stackId, $type, $order, $description, $duedate, $deletedAt, $dueDone) {
+		return $this->cardService->update($id, $title, $stackId, $type, $order, $description, $this->userId, $duedate, $deletedAt, null, $dueDone);
 	}
 
 	/**

lib/Db/Card.php

@@ -36,17 +36,19 @@ class Card extends RelationalEntity {
 	protected $lastModified;
 	protected $lastEditor;
 	protected $createdAt;
-	protected $labels;
-	protected $assignedUsers;
-	protected $attachments;
-	protected $attachmentCount;
 	protected $owner;
 	protected $order;
 	protected $archived = false;
 	protected $duedate;
 	protected $notified = false;
 	protected $deletedAt = 0;
+	protected $dueDone = false;
+
+	protected $labels;
+	protected $assignedUsers;
 	protected $commentsUnread = 0;
+	protected $attachments;
+	protected $attachmentCount = 0;
 
 	private $databaseType = 'sqlite';
 
@@ -64,6 +66,8 @@ class Card extends RelationalEntity {
 		$this->addType('archived', 'boolean');
 		$this->addType('notified', 'boolean');
 		$this->addType('deletedAt', 'integer');
+		$this->addType('dueDone', 'boolean');
+
 		$this->addRelation('labels');
 		$this->addRelation('assignedUsers');
 		$this->addRelation('attachments');

lib/Migration/Version10200Date20201104190344.php

@@ -0,0 +1,54 @@
+<?php
+
+declare(strict_types=1);
+
+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 Version10200Date20201104190344 extends SimpleMigrationStep {
+
+	/**
+	 * @param IOutput $output
+	 * @param Closure $schemaClosure The `\Closure` returns a `ISchemaWrapper`
+	 * @param array $options
+	 */
+	public function preSchemaChange(IOutput $output, Closure $schemaClosure, array $options): void {
+	}
+
+	/**
+	 * @param IOutput $output
+	 * @param Closure $schemaClosure The `\Closure` returns a `ISchemaWrapper`
+	 * @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('due_done')) {
+			$table->addColumn('due_done', 'boolean', [
+				'notnull' => false,
+				'default' => false
+			]);
+		}
+
+		return $schema;
+	}
+
+	/**
+	 * @param IOutput $output
+	 * @param Closure $schemaClosure The `\Closure` returns a `ISchemaWrapper`
+	 * @param array $options
+	 */
+	public function postSchemaChange(IOutput $output, Closure $schemaClosure, array $options): void {
+	}
+}

lib/Service/CardService.php

@@ -261,7 +261,7 @@ class CardService {
 	 * @throws \OCP\AppFramework\Db\MultipleObjectsReturnedException
 	 * @throws BadRequestException
 	 */
-	public function update($id, $title, $stackId, $type, $order = 0, $description = '', $owner, $duedate = null, $deletedAt = null, $archived = null) {
+	public function update($id, $title, $stackId, $type, $order = 0, $description = '', $owner, $duedate = null, ?int $deletedAt = null, ?bool $archived = null, ?bool $dueDone = null) {
 		if (is_numeric($id) === false) {
 			throw new BadRequestException('card id must be a number');
 		}
@@ -320,6 +320,9 @@ class CardService {
 		if ($archived !== null) {
 			$card->setArchived($archived);
 		}
+		if ($dueDone !== null) {
+			$card->setDueDone($dueDone);
+		}
 
 
 		// Trigger update events before setting description as it is handled separately
@@ -590,7 +593,7 @@ class CardService {
 	 */
 	public function findAllWithDue($userId) {
 		$cards = $this->cardMapper->findAllWithDue($userId);
-		
+
 		return $cards;
 	}
 
@@ -602,7 +605,7 @@ class CardService {
 	 */
 	public function findAssignedCards($userId) {
 		$cards = $this->cardMapper->findAssignedCards($userId);
-		
+
 		return $cards;
 	}
 }

src/components/cards/CardMenu.vue

@@ -24,22 +24,43 @@
 	<div v-if="card">
 		<div @click.stop.prevent>
 			<Actions v-if="canEdit && !isArchived">
-				<ActionButton v-if="showArchived === false && !isCurrentUserAssigned" icon="icon-user" @click="assignCardToMe()">
+				<ActionButton v-if="showArchived === false && !isCurrentUserAssigned"
+					icon="icon-user"
+					:close-after-click="true"
+					@click="assignCardToMe()">
 					{{ t('deck', 'Assign to me') }}
 				</ActionButton>
-				<ActionButton v-if="showArchived === false && isCurrentUserAssigned" icon="icon-user" @click="unassignCardFromMe()">
+				<ActionButton v-if="showArchived === false && isCurrentUserAssigned"
+					icon="icon-user"
+					:close-after-click="true"
+					@click="unassignCardFromMe()">
 					{{ t('deck', 'Unassign myself') }}
 				</ActionButton>
-				<ActionButton icon="icon-external" @click.stop="modalShow=true">
+				<ActionButton v-if="showArchived === false && card.duedate && !card.dueDone"
+					icon="icon-checkmark"
+					:close-after-click="true"
+					@click="toggleDoneState(true)">
+					{{ t('deck', 'Mark card as done') }}
+				</ActionButton>
+				<ActionButton v-if="showArchived === false && card.duedate && card.dueDone"
+					icon="icon-checkmark"
+					:close-after-click="true"
+					@click="toggleDoneState(false)">
+					{{ t('deck', 'Mark card as pending') }}
+				</ActionButton>
+				<ActionButton icon="icon-external" :close-after-click="true" @click.stop="modalShow=true">
 					{{ t('deck', 'Move card') }}
 				</ActionButton>
-				<ActionButton icon="icon-settings-dark" @click="openCard">
+				<ActionButton icon="icon-settings-dark" :close-after-click="true" @click="openCard">
 					{{ t('deck', 'Card details') }}
 				</ActionButton>
-				<ActionButton icon="icon-archive" @click="archiveUnarchiveCard()">
+				<ActionButton icon="icon-archive" :close-after-click="true" @click="archiveUnarchiveCard()">
 					{{ showArchived ? t('deck', 'Unarchive card') : t('deck', 'Archive card') }}
 				</ActionButton>
-				<ActionButton v-if="showArchived === false" icon="icon-delete" @click="deleteCard()">
+				<ActionButton v-if="showArchived === false"
+					icon="icon-delete"
+					:close-after-click="true"
+					@click="deleteCard()">
 					{{ t('deck', 'Delete card') }}
 				</ActionButton>
 			</Actions>
@@ -154,6 +175,9 @@ export default {
 				},
 			})
 		},
+		toggleDoneState(state) {
+			this.$store.dispatch('updateCardDueDone', { ...this.card, dueDone: state })
+		},
 		moveCard() {
 			this.copiedCard = Object.assign({}, this.card)
 			this.copiedCard.stackId = this.selectedStack.id

src/components/cards/badges/DueDate.vue

@@ -23,8 +23,8 @@
 <template>
 	<div v-if="card" class="duedate">
 		<transition name="zoom">
-			<div v-if="card.duedate" :class="dueIcon">
-				<span>{{ relativeDate }}</span>
+			<div v-if="card.duedate" v-tooltip="card.dueDone ? relativeDate : null" :class="dueIcon">
+				<span v-if="!card.dueDone">{{ relativeDate }}</span>
 			</div>
 		</transition>
 	</div>
@@ -45,15 +45,15 @@ export default {
 		dueIcon() {
 			const days = Math.floor(moment(this.card.duedate).diff(this.$root.time, 'seconds') / 60 / 60 / 24)
 			if (days < 0) {
-				return 'icon-calendar due icon overdue'
+				return `due icon ${!this.card.dueDone ? 'icon-calendar overdue' : 'icon-checkmark'}`
 			}
 			if (days === 0) {
-				return 'icon-calendar-dark due icon now'
+				return `due icon ${!this.card.dueDone ? 'icon-calendar-dark now' : 'icon-checkmark'}`
 			}
 			if (days === 1) {
-				return 'icon-calendar-dark due icon next'
+				return `due icon ${!this.card.dueDone ? 'con-calendar-dark next' : 'icon-checkmark'}`
 			}
-			return 'icon-calendar-dark due icon'
+			return `due icon ${!this.card.dueDone ? 'icon-calendar-dark' : 'icon-checkmark'}`
 		},
 		relativeDate() {
 			const diff = moment(this.$root.time).diff(this.card.duedate, 'seconds')
@@ -88,6 +88,10 @@ export default {
 			background-size: contain;
 		}
 
+		&.icon-checkmark {
+			width: 20px;
+		}
+
 		&.overdue {
 			background-color: var(--color-error);
 			color: var(--color-primary-text);

src/store/card.js

@@ -236,5 +236,9 @@ export default {
 			const updatedCard = await apiClient.updateCard(card)
 			commit('updateCardProperty', { property: 'duedate', card: updatedCard })
 		},
+		async updateCardDueDone({ commit }, card) {
+			const updatedCard = await apiClient.updateCard(card)
+			commit('updateCardProperty', { property: 'dueDone', card: updatedCard })
+		},
 	},
 }