mirror of https://github.com/doccano/doccano.git
4 changed files with 0 additions and 336 deletions
Unified View
Diff Options
-
63frontend/components/containers/members/MemberAdditionButton.vue
-
37frontend/components/containers/members/MemberDeletionButton.vue
-
127frontend/components/containers/members/MemberList.vue
-
109frontend/components/organisms/members/MemberAdditionForm.vue
@ -1,63 +0,0 @@ |
|||||
<template> |
|
||||
<base-modal |
|
||||
:is-create="true" |
|
||||
:text="$t('generic.add')" |
|
||||
> |
|
||||
<template v-slot="slotProps"> |
|
||||
<member-addition-form |
|
||||
:add-member="addMember" |
|
||||
:items="items" |
|
||||
:roles="getTranslatedRoles(roles, $t('members.roles'))" |
|
||||
@close="slotProps.close" |
|
||||
@search-user="searchUser" |
|
||||
/> |
|
||||
</template> |
|
||||
</base-modal> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { mapActions, mapGetters } from 'vuex' |
|
||||
import BaseModal from '@/components/molecules/BaseModal' |
|
||||
import MemberAdditionForm from '@/components/organisms/members/MemberAdditionForm' |
|
||||
import UserService from '@/services/user.service' |
|
||||
import { translatedRoles } from '~/plugins/utils' |
|
||||
|
|
||||
export default { |
|
||||
components: { |
|
||||
BaseModal, |
|
||||
MemberAdditionForm |
|
||||
}, |
|
||||
|
|
||||
data() { |
|
||||
return { |
|
||||
items: [] |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapGetters('roles', ['roles']) |
|
||||
}, |
|
||||
|
|
||||
created() { |
|
||||
this.getRoleList() |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
...mapActions('members', ['addMember']), |
|
||||
...mapActions('roles', ['getRoleList']), |
|
||||
|
|
||||
searchUser(username) { |
|
||||
UserService.getUserList(username) |
|
||||
.then((response) => { |
|
||||
this.items = response.data |
|
||||
}) |
|
||||
.catch((error) => { |
|
||||
alert(error) |
|
||||
}) |
|
||||
}, |
|
||||
getTranslatedRoles(roles, mappings) { |
|
||||
return translatedRoles(roles, mappings) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
@ -1,37 +0,0 @@ |
|||||
<template> |
|
||||
<confirm-dialog |
|
||||
:disabled="!isMemberSelected" |
|
||||
:items="selected" |
|
||||
:title="$t('members.removeMember')" |
|
||||
:message="$t('members.removePrompt')" |
|
||||
:button-true-text="$t('generic.yes')" |
|
||||
:button-false-text="$t('generic.cancel')" |
|
||||
item-key="username" |
|
||||
@ok="handleRemoveMember()" |
|
||||
/> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { mapState, mapGetters, mapActions } from 'vuex' |
|
||||
import ConfirmDialog from '@/components/organisms/utils/ConfirmDialog' |
|
||||
|
|
||||
export default { |
|
||||
components: { |
|
||||
ConfirmDialog |
|
||||
}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapState('members', ['selected']), |
|
||||
...mapGetters('members', ['isMemberSelected']) |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
...mapActions('members', ['removeMember']), |
|
||||
|
|
||||
handleRemoveMember() { |
|
||||
const projectId = this.$route.params.id |
|
||||
this.removeMember(projectId) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
@ -1,127 +0,0 @@ |
|||||
<template> |
|
||||
<v-data-table |
|
||||
:value="selected" |
|
||||
:headers="headers" |
|
||||
:items="items" |
|
||||
:search="search" |
|
||||
:loading="loading" |
|
||||
:loading-text="$t('generic.loading')" |
|
||||
:no-data-text="$t('vuetify.noDataAvailable')" |
|
||||
:footer-props="{ |
|
||||
'showFirstLastPage': true, |
|
||||
'items-per-page-options': [5, 10, 15, $t('generic.all')], |
|
||||
'items-per-page-text': $t('vuetify.itemsPerPageText'), |
|
||||
'page-text': $t('dataset.pageText') |
|
||||
}" |
|
||||
item-key="id" |
|
||||
show-select |
|
||||
@input="updateSelected" |
|
||||
> |
|
||||
<template v-slot:top> |
|
||||
<v-text-field |
|
||||
v-model="search" |
|
||||
prepend-inner-icon="search" |
|
||||
:label="$t('generic.search')" |
|
||||
single-line |
|
||||
hide-details |
|
||||
filled |
|
||||
/> |
|
||||
</template> |
|
||||
<template v-slot:item.rolename="{ item }"> |
|
||||
<v-edit-dialog |
|
||||
:return-value.sync="item" |
|
||||
large |
|
||||
@save="updateRole({ id: item.id })" |
|
||||
> |
|
||||
<div>{{ translateRole(item.rolename, $t('members.roles')) }}</div> |
|
||||
<template v-slot:input> |
|
||||
<div class="mt-4 title"> |
|
||||
{{ $t('members.updateRole') }} |
|
||||
</div> |
|
||||
</template> |
|
||||
<template v-slot:input> |
|
||||
<v-select |
|
||||
:value="getRole(item)" |
|
||||
:items="roles" |
|
||||
:rules="roleRules($t('rules.roleRules'))" |
|
||||
item-text="name" |
|
||||
item-value="id" |
|
||||
:label="$t('members.role')" |
|
||||
return-object |
|
||||
@input="setNewRole" |
|
||||
/> |
|
||||
</template> |
|
||||
</v-edit-dialog> |
|
||||
</template> |
|
||||
</v-data-table> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { mapState, mapActions, mapMutations, mapGetters } from 'vuex' |
|
||||
import { roleRules } from '@/rules/index' |
|
||||
import { translateRole } from '~/plugins/utils' |
|
||||
|
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
headers: [ |
|
||||
{ |
|
||||
text: this.$t('generic.name'), |
|
||||
align: 'left', |
|
||||
sortable: false, |
|
||||
value: 'username' |
|
||||
}, |
|
||||
{ |
|
||||
text: this.$t('members.role'), |
|
||||
value: 'rolename' |
|
||||
} |
|
||||
], |
|
||||
search: '', |
|
||||
newRole: null, |
|
||||
roleRules |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
computed: { |
|
||||
...mapState('members', ['items', 'selected', 'loading']), |
|
||||
...mapGetters('roles', ['roles']) |
|
||||
}, |
|
||||
|
|
||||
created() { |
|
||||
this.getMemberList({ |
|
||||
projectId: this.$route.params.id |
|
||||
}) |
|
||||
this.getRoleList() |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
...mapActions('members', ['getMemberList', 'updateMemberRole']), |
|
||||
...mapMutations('members', ['updateSelected']), |
|
||||
...mapActions('roles', ['getRoleList']), |
|
||||
|
|
||||
getRole(item) { |
|
||||
return { |
|
||||
id: item.role, |
|
||||
userId: item.user, |
|
||||
mappingId: item.id |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
setNewRole(value) { |
|
||||
this.newRole = value |
|
||||
}, |
|
||||
|
|
||||
updateRole(payload) { |
|
||||
this.updateMemberRole({ |
|
||||
projectId: this.$route.params.id, |
|
||||
id: payload.id, |
|
||||
role: this.newRole.id |
|
||||
}) |
|
||||
}, |
|
||||
|
|
||||
translateRole(role, mappings) { |
|
||||
return translateRole(role, mappings) |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
@ -1,109 +0,0 @@ |
|||||
<template> |
|
||||
<base-card |
|
||||
:disabled="!valid" |
|
||||
:title="$t('members.addMember')" |
|
||||
:agree-text="$t('generic.add')" |
|
||||
:cancel-text="$t('generic.cancel')" |
|
||||
@agree="create" |
|
||||
@cancel="cancel" |
|
||||
> |
|
||||
<template #content> |
|
||||
<v-form |
|
||||
ref="form" |
|
||||
v-model="valid" |
|
||||
> |
|
||||
<v-autocomplete |
|
||||
v-model="selectedUser" |
|
||||
:items="items" |
|
||||
:loading="isLoading" |
|
||||
:search-input.sync="username" |
|
||||
color="white" |
|
||||
hide-no-data |
|
||||
hide-selected |
|
||||
item-text="username" |
|
||||
:label="$t('members.userSearchAPIs')" |
|
||||
:placeholder="$t('members.userSearchPrompt')" |
|
||||
prepend-icon="mdi-account" |
|
||||
return-object |
|
||||
/> |
|
||||
<v-select |
|
||||
v-model="role" |
|
||||
:items="roles" |
|
||||
:rules="roleRules($t('rules.roleRules'))" |
|
||||
item-text="translatedName" |
|
||||
item-value="id" |
|
||||
:label="$t('members.role')" |
|
||||
return-object |
|
||||
prepend-icon="mdi-account-card-details-outline" |
|
||||
/> |
|
||||
</v-form> |
|
||||
</template> |
|
||||
</base-card> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import BaseCard from '@/components/molecules/BaseCard' |
|
||||
import { roleRules } from '@/rules/index' |
|
||||
|
|
||||
export default { |
|
||||
components: { |
|
||||
BaseCard |
|
||||
}, |
|
||||
props: { |
|
||||
addMember: { |
|
||||
type: Function, |
|
||||
default: () => {}, |
|
||||
required: true |
|
||||
}, |
|
||||
items: { |
|
||||
type: Array, |
|
||||
default: () => {}, |
|
||||
required: true |
|
||||
}, |
|
||||
roles: { |
|
||||
type: Array, |
|
||||
default: () => {}, |
|
||||
required: true |
|
||||
} |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
valid: false, |
|
||||
username: '', |
|
||||
role: null, |
|
||||
isLoading: false, |
|
||||
selectedUser: null, |
|
||||
roleRules |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
watch: { |
|
||||
username(val) { |
|
||||
this.$emit('search-user', val) |
|
||||
} |
|
||||
}, |
|
||||
|
|
||||
methods: { |
|
||||
cancel() { |
|
||||
this.$emit('close') |
|
||||
}, |
|
||||
validate() { |
|
||||
return this.$refs.form.validate() |
|
||||
}, |
|
||||
reset() { |
|
||||
this.$refs.form.reset() |
|
||||
}, |
|
||||
create() { |
|
||||
if (this.validate()) { |
|
||||
this.addMember({ |
|
||||
userId: this.selectedUser.id, |
|
||||
projectId: this.$route.params.id, |
|
||||
role: this.role.id |
|
||||
}) |
|
||||
this.reset() |
|
||||
this.cancel() |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
Write
Preview
Loading…
Cancel
Save