diff --git a/frontend/components/comment/CommentList.vue b/frontend/components/comment/CommentList.vue index 9151bb43..6a2e18d7 100644 --- a/frontend/components/comment/CommentList.vue +++ b/frontend/components/comment/CommentList.vue @@ -20,9 +20,6 @@ - + @@ -41,6 +47,7 @@ import Vue, { PropType } from 'vue' import VueFilterDateFormat from '@vuejs-community/vue-filter-date-format' import VueFilterDateParse from '@vuejs-community/vue-filter-date-parse' import { CommentReadDTO } from '~/services/application/comment/commentData' +import { ExampleDTO } from '~/services/application/example/exampleData' Vue.use(VueFilterDateFormat) Vue.use(VueFilterDateParse) @@ -51,6 +58,11 @@ export default Vue.extend({ default: false, required: true }, + examples: { + type: Array as PropType, + default: () => [], + required: true + }, items: { type: Array as PropType, default: () => [], @@ -69,10 +81,18 @@ export default Vue.extend({ headers: [ { text: this.$t('dataset.text'), value: 'text' }, { text: this.$t('user.username'), value: 'username' }, - { text: this.$t('comments.document'), value: 'documentText' }, - { text: this.$t('comments.created_at'), value: 'createdAt' } + { text: this.$t('comments.created_at'), value: 'createdAt' }, + { text: this.$t('dataset.action'), value: 'action' }, ] } + }, + + methods: { + toLabeling(item: CommentReadDTO) { + const index = this.examples.findIndex((example: ExampleDTO) => example.id === item.example) + const page = (index + 1).toString() + this.$emit('click:labeling', { page, q: this.search }) + } } }) diff --git a/frontend/pages/projects/_id/comments/index.vue b/frontend/pages/projects/_id/comments/index.vue index 3ce919f0..3388547d 100644 --- a/frontend/pages/projects/_id/comments/index.vue +++ b/frontend/pages/projects/_id/comments/index.vue @@ -19,8 +19,10 @@ @@ -29,6 +31,8 @@ import Vue from 'vue' import CommentList from '@/components/comment/CommentList.vue' import { CommentReadDTO } from '~/services/application/comment/commentData' +import { ExampleListDTO } from '~/services/application/example/exampleData' +import { ProjectDTO } from '~/services/application/project/projectData' import FormDelete from '~/components/comment/FormDelete.vue' export default Vue.extend({ @@ -41,15 +45,20 @@ export default Vue.extend({ async fetch() { this.isLoading = true + this.project = await this.$services.project.findById(this.projectId) this.items = await this.$services.comment.listProjectComment(this.projectId) + const example = await this.$services.example.fetchOne(this.projectId,'1','','') // to fetch the count of examples + this.examples = await this.$services.example.list(this.projectId, {limit: example.count.toString()}) this.isLoading = false }, data() { return { dialogDelete: false, + project: {} as ProjectDTO, items: [] as CommentReadDTO[], selected: [] as CommentReadDTO[], + examples: {} as ExampleListDTO, isLoading: false } }, @@ -69,6 +78,15 @@ export default Vue.extend({ this.$fetch() this.dialogDelete = false this.selected = [] + }, + updateQuery(query: object) { + this.$router.push(query) + }, + movePage(query: object) { + this.updateQuery({ + path: this.localePath(this.project.pageLink), + query + }) } },