1
1
<template >
2
- <v-card >
2
+ <v-card
3
+ v-if =" currentDoc && items"
4
+ v-shortkey =" multiKeys"
5
+ @shortkey =" addOrRemoveLabel"
6
+ >
3
7
<v-card-title >
4
8
<multi-class-classification
5
- v-if =" currentDoc"
6
9
:labels =" items"
7
10
:annotations =" currentDoc.annotations"
8
11
:add-label =" addLabel"
9
12
:delete-label =" removeLabel"
10
13
/>
11
14
</v-card-title >
12
- <v-card-text v-if = " currentDoc " class =" title" >
15
+ <v-card-text class =" title" >
13
16
{{ currentDoc.text }}
14
17
</v-card-text >
15
18
</v-card >
16
19
</template >
17
20
18
21
<script >
22
+ import Vue from ' vue'
19
23
import { mapActions , mapGetters , mapState } from ' vuex'
20
24
import MultiClassClassification from ' @/components/organisms/annotation/MultiClassClassification'
25
+ Vue .use (require (' vue-shortkey' ))
21
26
22
27
export default {
23
28
components: {
@@ -26,7 +31,14 @@ export default {
26
31
27
32
computed: {
28
33
... mapState (' labels' , [' items' ]),
29
- ... mapGetters (' documents' , [' currentDoc' ])
34
+ ... mapGetters (' documents' , [' currentDoc' ]),
35
+ multiKeys () {
36
+ const multiKeys = {}
37
+ for (const item of this .items ) {
38
+ multiKeys[item .id ] = [item .suffix_key ]
39
+ }
40
+ return multiKeys
41
+ }
30
42
},
31
43
32
44
created () {
@@ -59,6 +71,15 @@ export default {
59
71
projectId: this .$route .params .id
60
72
}
61
73
this .addAnnotation (payload)
74
+ },
75
+ addOrRemoveLabel (event ) {
76
+ const label = this .items .find (item => item .id === parseInt (event .srcKey , 10 ))
77
+ const annotation = this .currentDoc .annotations .find (item => item .label === label .id )
78
+ if (annotation) {
79
+ this .removeLabel (annotation .id )
80
+ } else {
81
+ this .addLabel (label .id )
82
+ }
62
83
}
63
84
}
64
85
}
0 commit comments