mirror of https://github.com/doccano/doccano.git
Hironsan
5 years ago
5 changed files with 249 additions and 2 deletions
Split View
Diff Options
-
3frontend/api/db/docs.json
-
3frontend/api/routes/docs.js
-
65frontend/components/containers/Seq2seqContainer.vue
-
109frontend/components/organisms/Seq2seqBox.vue
-
71frontend/pages/projects/_id/seq2seq/index.vue
@ -0,0 +1,65 @@ |
|||
<template> |
|||
<div> |
|||
<v-card |
|||
v-if="currentDoc" |
|||
class="title mb-5" |
|||
> |
|||
<v-card-text> |
|||
{{ currentDoc.text }} |
|||
</v-card-text> |
|||
</v-card> |
|||
<seq2seq-box |
|||
v-if="currentDoc" |
|||
:text="currentDoc.text" |
|||
:annotations="currentDoc.annotations" |
|||
:delete-annotation="_deleteAnnotation" |
|||
:update-annotation="_updateAnnotation" |
|||
:create-annotation="_createAnnotation" |
|||
/> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { mapActions, mapGetters } from 'vuex' |
|||
import Seq2seqBox from '~/components/organisms/Seq2seqBox' |
|||
|
|||
export default { |
|||
components: { |
|||
Seq2seqBox |
|||
}, |
|||
|
|||
computed: { |
|||
...mapGetters('documents', ['currentDoc']) |
|||
}, |
|||
|
|||
created() { |
|||
this.getDocumentList() |
|||
}, |
|||
|
|||
methods: { |
|||
...mapActions('documents', ['getDocumentList', 'deleteAnnotation', 'updateAnnotation', 'addAnnotation']), |
|||
_deleteAnnotation(annotationId) { |
|||
const payload = { |
|||
annotationId, |
|||
projectId: this.$route.params.id |
|||
} |
|||
this.deleteAnnotation(payload) |
|||
}, |
|||
_updateAnnotation(annotationId, text) { |
|||
const payload = { |
|||
annotationId, |
|||
text: text, |
|||
projectId: this.$route.params.id |
|||
} |
|||
this.updateAnnotation(payload) |
|||
}, |
|||
_createAnnotation(text) { |
|||
const payload = { |
|||
text, |
|||
projectId: this.$route.params.id |
|||
} |
|||
this.addAnnotation(payload) |
|||
} |
|||
} |
|||
} |
|||
</script> |
@ -0,0 +1,109 @@ |
|||
<template> |
|||
<v-card> |
|||
<v-data-table |
|||
:headers="headers" |
|||
:items="annotations" |
|||
item-key="id" |
|||
hide-default-header |
|||
hide-default-footer |
|||
disable-pagination |
|||
class="elevation-1" |
|||
@input="update" |
|||
> |
|||
<template v-slot:top> |
|||
<v-text-field |
|||
v-model="newText" |
|||
prepend-inner-icon="mdi-pencil" |
|||
label="New text" |
|||
autofocus |
|||
single-line |
|||
hide-details |
|||
filled |
|||
@keyup.enter="create" |
|||
/> |
|||
</template> |
|||
<template v-slot:item.text="{ item }"> |
|||
<v-edit-dialog> |
|||
{{ item.text }} |
|||
<template v-slot:input> |
|||
<v-textarea |
|||
:value="item.text" |
|||
label="Edit" |
|||
autofocus |
|||
@change="update(item.id, $event)" |
|||
/> |
|||
</template> |
|||
</v-edit-dialog> |
|||
</template> |
|||
<template v-slot:item.action="{ item }"> |
|||
<v-icon |
|||
small |
|||
@click="deleteAnnotation(item.id)" |
|||
> |
|||
delete |
|||
</v-icon> |
|||
</template> |
|||
</v-data-table> |
|||
</v-card> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
annotations: { |
|||
type: Array, |
|||
default: () => ([]), |
|||
required: true |
|||
}, |
|||
deleteAnnotation: { |
|||
type: Function, |
|||
default: () => ([]), |
|||
required: true |
|||
}, |
|||
updateAnnotation: { |
|||
type: Function, |
|||
default: () => ([]), |
|||
required: true |
|||
}, |
|||
createAnnotation: { |
|||
type: Function, |
|||
default: () => ([]), |
|||
required: true |
|||
} |
|||
}, |
|||
|
|||
data() { |
|||
return { |
|||
newText: '', |
|||
headers: [ |
|||
{ |
|||
text: 'Text', |
|||
align: 'left', |
|||
value: 'text' |
|||
}, |
|||
{ |
|||
text: 'Actions', |
|||
align: 'right', |
|||
value: 'action' |
|||
} |
|||
] |
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
update(annotationId, text) { |
|||
if (text.length > 0) { |
|||
this.updateAnnotation(annotationId, text) |
|||
} else { |
|||
this.deleteAnnotation(annotationId) |
|||
} |
|||
}, |
|||
create() { |
|||
if (this.newText.length > 0) { |
|||
this.createAnnotation(this.newText) |
|||
this.newText = '' |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
@ -0,0 +1,71 @@ |
|||
<template> |
|||
<div> |
|||
<side-bar-labeling |
|||
:labels="labels" |
|||
:progress="progress" |
|||
:metadata="metadata" |
|||
/> |
|||
<v-content> |
|||
<v-container fluid fill-height> |
|||
<v-layout justify-center> |
|||
<v-flex> |
|||
<seq2seq-container /> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-content> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import Seq2seqContainer from '~/components/containers/Seq2seqContainer' |
|||
import SideBarLabeling from '~/components/organisms/SideBarLabeling' |
|||
|
|||
export default { |
|||
layout: 'annotation', |
|||
components: { |
|||
Seq2seqContainer, |
|||
SideBarLabeling |
|||
}, |
|||
data: () => ({ |
|||
progress: 30, |
|||
metadata: '{"wikiPageId":2}', |
|||
search: '', |
|||
labels: [ |
|||
{ |
|||
id: 1, |
|||
name: 'Location', |
|||
color: '#E91E63', |
|||
shortcut: 'l' |
|||
}, |
|||
{ |
|||
id: 2, |
|||
name: 'Organization', |
|||
color: '#03A9F4', |
|||
shortcut: 'o' |
|||
}, |
|||
{ |
|||
id: 3, |
|||
name: 'Person', |
|||
color: '#009688', |
|||
shortcut: 'p' |
|||
}, |
|||
{ |
|||
id: 4, |
|||
name: 'Date', |
|||
color: '#FF6F00', |
|||
shortcut: 'd' |
|||
}, |
|||
{ |
|||
id: 5, |
|||
name: 'Other', |
|||
color: '#333333', |
|||
shortcut: 't' |
|||
} |
|||
] |
|||
}) |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
</style> |
Write
Preview
Loading…
Cancel
Save