From ac22742a7bd2d9fcd15d4dfce626f730ce076933 Mon Sep 17 00:00:00 2001
From: Hironsan <light.tree.1.13@gmail.com>
Date: Mon, 25 Nov 2019 11:36:11 +0900
Subject: [PATCH] Enable to use shortkeys in text classification and fix #453

---
 .../annotation/TextClassification.vue         | 29 ++++++++++++++++---
 1 file changed, 25 insertions(+), 4 deletions(-)

diff --git a/frontend/components/containers/annotation/TextClassification.vue b/frontend/components/containers/annotation/TextClassification.vue
index 27815d7c..34bacdb7 100644
--- a/frontend/components/containers/annotation/TextClassification.vue
+++ b/frontend/components/containers/annotation/TextClassification.vue
@@ -1,23 +1,28 @@
 <template>
-  <v-card>
+  <v-card
+    v-if="currentDoc && items"
+    v-shortkey="multiKeys"
+    @shortkey="addOrRemoveLabel"
+  >
     <v-card-title>
       <multi-class-classification
-        v-if="currentDoc"
         :labels="items"
         :annotations="currentDoc.annotations"
         :add-label="addLabel"
         :delete-label="removeLabel"
       />
     </v-card-title>
-    <v-card-text v-if="currentDoc" class="title">
+    <v-card-text class="title">
       {{ currentDoc.text }}
     </v-card-text>
   </v-card>
 </template>
 
 <script>
+import Vue from 'vue'
 import { mapActions, mapGetters, mapState } from 'vuex'
 import MultiClassClassification from '@/components/organisms/annotation/MultiClassClassification'
+Vue.use(require('vue-shortkey'))
 
 export default {
   components: {
@@ -26,7 +31,14 @@ export default {
 
   computed: {
     ...mapState('labels', ['items']),
-    ...mapGetters('documents', ['currentDoc'])
+    ...mapGetters('documents', ['currentDoc']),
+    multiKeys() {
+      const multiKeys = {}
+      for (const item of this.items) {
+        multiKeys[item.id] = [item.suffix_key]
+      }
+      return multiKeys
+    }
   },
 
   created() {
@@ -59,6 +71,15 @@ export default {
         projectId: this.$route.params.id
       }
       this.addAnnotation(payload)
+    },
+    addOrRemoveLabel(event) {
+      const label = this.items.find(item => item.id === parseInt(event.srcKey, 10))
+      const annotation = this.currentDoc.annotations.find(item => item.label === label.id)
+      if (annotation) {
+        this.removeLabel(annotation.id)
+      } else {
+        this.addLabel(label.id)
+      }
     }
   }
 }