Improved team search and team managing #18
|
@ -128,6 +128,7 @@
|
|||
return {
|
||||
user: auth.user,
|
||||
namespaces: [],
|
||||
namespaceService: NamespaceService,
|
||||
mobileMenuActive: false,
|
||||
fullpage: false,
|
||||
currentDate: new Date(),
|
||||
|
@ -149,6 +150,7 @@
|
|||
},
|
||||
created() {
|
||||
if (this.user.authenticated) {
|
||||
this.namespaceService = new NamespaceService()
|
||||
this.loadNamespaces()
|
||||
}
|
||||
},
|
||||
|
@ -164,8 +166,7 @@
|
|||
return 'https://www.gravatar.com/avatar/' + this.user.infos.avatar + '?s=50'
|
||||
},
|
||||
loadNamespaces() {
|
||||
let namespaceService = new NamespaceService()
|
||||
namespaceService.getAll()
|
||||
this.namespaceService.getAll()
|
||||
.then(r => {
|
||||
this.$set(this, 'namespaces', r)
|
||||
})
|
||||
|
|
|
@ -9,11 +9,23 @@
|
|||
<div class="card-content content teams-list">
|
||||
<form @submit.prevent="addTeam()" class="add-team-form" v-if="userIsAdmin">
|
||||
<div class="field is-grouped">
|
||||
<p class="control has-icons-left is-expanded" v-bind:class="{ 'is-loading': this.teamService.loading}">
|
||||
<input class="input" v-bind:class="{ 'disabled': this.teamService.loading}" v-model.number="teamStuffModel.teamID" type="text" placeholder="Add a new team...">
|
||||
<span class="icon is-small is-left">
|
||||
<icon icon="users"/>
|
||||
</span>
|
||||
<p class="control is-expanded" v-bind:class="{ 'is-loading': this.teamService.loading}">
|
||||
<multiselect
|
||||
v-model="team"
|
||||
:options="foundTeams"
|
||||
:multiple="false"
|
||||
:searchable="true"
|
||||
:loading="teamStuffService.loading"
|
||||
:internal-search="true"
|
||||
@search-change="findTeams"
|
||||
placeholder="Type to search a team"
|
||||
label="name"
|
||||
track-by="id">
|
||||
<template slot="clear" slot-scope="props">
|
||||
<div class="multiselect__clear" v-if="team.id !== 0" @mousedown.prevent.stop="clearAll(props.search)"></div>
|
||||
</template>
|
||||
<span slot="noResult">Oops! No teams found. Consider changing the search query.</span>
|
||||
</multiselect>
|
||||
</p>
|
||||
<p class="control">
|
||||
<button type="submit" class="button is-success">
|
||||
|
@ -88,10 +100,15 @@
|
|||
<script>
|
||||
import auth from '../../auth'
|
||||
import message from '../../message'
|
||||
import multiselect from 'vue-multiselect'
|
||||
import 'vue-multiselect/dist/vue-multiselect.min.css'
|
||||
|
||||
import TeamNamespaceService from '../../services/teamNamespace'
|
||||
import TeamNamespaceModel from '../../models/teamNamespace'
|
||||
import TeamListModel from '../../models/teamList'
|
||||
import TeamListService from '../../services/teamList'
|
||||
import TeamService from '../../services/team'
|
||||
import TeamModel from '../../models/team'
|
||||
|
||||
export default {
|
||||
name: 'team',
|
||||
|
@ -102,8 +119,12 @@
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
teamService: Object, // This team service is either a teamNamespaceService or a teamListService, depending on the type we are using
|
||||
teamStuffService: Object, // This team service is either a teamNamespaceService or a teamListService, depending on the type we are using
|
||||
teamStuffModel: Object,
|
||||
teamService: TeamService,
|
||||
|
||||
team: TeamModel,
|
||||
foundTeams: [],
|
||||
|
||||
currentUser: auth.user.infos,
|
||||
typeString: '',
|
||||
|
@ -113,14 +134,20 @@
|
|||
teamToDelete: 0,
|
||||
}
|
||||
},
|
||||
components: {
|
||||
multiselect
|
||||
},
|
||||
created() {
|
||||
this.teamService = new TeamService()
|
||||
this.team = new TeamModel()
|
||||
|
||||
if (this.type === 'list') {
|
||||
this.typeString = `list`
|
||||
this.teamService = new TeamListService()
|
||||
this.teamStuffService = new TeamListService()
|
||||
this.teamStuffModel = new TeamListModel({listID: this.id})
|
||||
} else if (this.type === 'namespace') {
|
||||
this.typeString = `namespace`
|
||||
this.teamService = new TeamNamespaceService()
|
||||
this.teamStuffService = new TeamNamespaceService()
|
||||
this.teamStuffModel = new TeamNamespaceModel({namespaceID: this.id})
|
||||
} else {
|
||||
throw new Error('Unknown type: ' + this.type)
|
||||
|
@ -130,7 +157,7 @@
|
|||
},
|
||||
methods: {
|
||||
loadTeams() {
|
||||
this.teamService.getAll(this.teamStuffModel)
|
||||
this.teamStuffService.getAll(this.teamStuffModel)
|
||||
.then(r => {
|
||||
this.$set(this, 'listTeams', r)
|
||||
})
|
||||
|
@ -139,7 +166,7 @@
|
|||
})
|
||||
},
|
||||
deleteTeam() {
|
||||
this.teamService.delete(this.teamStuffModel)
|
||||
this.teamStuffService.delete(this.teamStuffModel)
|
||||
.then(() => {
|
||||
this.showTeamDeleteModal = false;
|
||||
message.success({message: 'The team was successfully deleted from the ' + this.typeString + '.'}, this)
|
||||
|
@ -159,7 +186,9 @@
|
|||
this.teamStuffModel.right = 2
|
||||
}
|
||||
|
||||
this.teamService.create(this.teamStuffModel)
|
||||
this.teamStuffModel.teamID = this.team.id
|
||||
|
||||
this.teamStuffService.create(this.teamStuffModel)
|
||||
.then(() => {
|
||||
// FIXME: this should add the team to the list instead of loading it again
|
||||
this.loadTeams()
|
||||
|
@ -176,7 +205,7 @@
|
|||
this.teamStuffModel.right = 2
|
||||
}
|
||||
|
||||
this.teamService.update(this.teamStuffModel)
|
||||
this.teamStuffService.update(this.teamStuffModel)
|
||||
.then(() => {
|
||||
// FIXME: this should update the team in the list instead of loading it again
|
||||
this.loadTeams()
|
||||
|
@ -185,7 +214,27 @@
|
|||
.catch(e => {
|
||||
message.error(e, this)
|
||||
})
|
||||
}
|
||||
},
|
||||
findTeams(query) {
|
||||
if(query === '') {
|
||||
this.$set(this, 'foundTeams', [])
|
||||
return
|
||||
}
|
||||
|
||||
this.teamService.getAll({}, {s: query})
|
||||
.then(response => {
|
||||
this.$set(this, 'foundTeams', response)
|
||||
})
|
||||
.catch(e => {
|
||||
message.error(e, this)
|
||||
})
|
||||
},
|
||||
clearAll () {
|
||||
this.$set(this, 'foundTeams', [])
|
||||
},
|
||||
limitText (count) {
|
||||
return `and ${count} others`
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
<div class="card-content content users-list">
|
||||
<form @submit.prevent="addUser()" class="add-user-form" v-if="userIsAdmin">
|
||||
<div class="field is-grouped">
|
||||
<p class="control is-expanded" v-bind:class="{ 'is-loading': userStuffService.loading}">
|
||||
<p class="control is-expanded" v-bind:class="{ 'is-loading': userService.loading}">
|
||||
<multiselect
|
||||
v-model="user"
|
||||
:options="foundUsers"
|
||||
|
|
2
todo.md
2
todo.md
|
@ -107,7 +107,7 @@
|
|||
* [x] Fix the first request afer login being made with an old token
|
||||
* [ ] Team sharing
|
||||
* [ ] Refactor team sharing to not make a new request every time something was changed
|
||||
* [ ] Team sharing should be able to search for a team instead of its ID, like it's the case with users
|
||||
* [x] Team sharing should be able to search for a team instead of its ID, like it's the case with users
|
||||
* [ ] Dropdown for rights
|
||||
|
||||
## Waiting for backend
|
||||
|
|
Reference in New Issue
Block a user