Skip to content
Snippets Groups Projects
Commit c04a5459 authored by thomas.blanc.2@etu.univ-amu.fr's avatar thomas.blanc.2@etu.univ-amu.fr
Browse files

Admin panel fixed (add/delete for all)

parent ac0165a1
No related branches found
No related tags found
No related merge requests found
Show whitespace changes
Inline Side-by-side
Showing
with 193 additions and 42 deletions
src/views/Admin.vue
+ 193
− 42
View file @ c04a5459
......@@ -23,25 +23,56 @@
</b-table-column>
<b-table-column label="" centered>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removeUserPrompt(props.row.id, props.row.name)" outlined/>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removePrompt(props.row.id, props.row.name, 'model')" outlined/>
</b-table-column>
</template>
</b-table>
</b-tab-item>
<b-tab-item label="Tags">
<div class="buttons">
<b-button type="is-info" @click="addNewCategoryDialog">Add Category</b-button>
</div>
<b-table :data="tagList" :loading="isLoading" striped hoverable detailed>
<template slot-scope="props">
<b-table-column field="name" label="Category" searchable sortable>
{{ props.row.name }}
</b-table-column>
<b-table-column label="" centered>
<b-button class="actionButton" icon-left="plus" type="is-info" @click="addNewTagDialog(props.row.id)">Add Tag</b-button>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removePrompt(props.row.id, props.row.name, 'category')" outlined>Remove category</b-button>
</b-table-column>
</template>
<template slot="detail" slot-scope="props">
<tr v-for="tag in props.row.tags" :key="tag.name">
<td>
&nbsp;&nbsp;&nbsp;&nbsp;{{tag.name}}
</td>
<td>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removePrompt(tag.id, tag.name, 'tag')" outlined/>
</td>
</tr>
</template>
</b-table>
</b-tab-item>
<b-tab-item label="Users">
<b-table :data="userList" :loading="isLoading" striped hoverable>
<template slot-scope="props">
<b-table-column field="username" label="Username" searchable sortable>
{{ props.row.name }}
{{ props.row.username }}
</b-table-column>
<b-table-column field="email" label="Email" searchable sortable>
{{ props.row.name }}
{{ props.row.email }}
</b-table-column>
<b-table-column label="" centered>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removeModelPrompt(props.row.id, props.row.name)" outlined/>
<b-button class="actionButton" icon-left="delete" type="is-danger" @click="removePrompt(props.row.id, props.row.username, 'user')" outlined/>
</b-table-column>
</template>
</b-table>
......@@ -57,18 +88,21 @@ export default {
data () {
return {
isLoading: true,
userList: null,
modelList: null
userList: [],
modelList: [],
tagList: []
}
},
async mounted () {
this.modelList = await this.getModelList()
this.userList = await this.getUserList()
this.tagList = await this.getTags()
this.isLoading = false
},
methods: {
async getModelList () {
const token = await localStorage.getItem('token')
const url = this.$serverurl + 'user/list'
const url = this.$serverurl + 'models/list'
try {
const response = await fetch(url, { headers: { Authorization: 'Bearer ' + token } })
return await response.json()
......@@ -78,18 +112,135 @@ export default {
},
async getUserList () {
const token = await localStorage.getItem('token')
const url = this.$serverurl + 'model/list'
const url = this.$serverurl + 'user/list'
try {
const response = await fetch(url, { headers: { Authorization: 'Bearer ' + token } })
return await response.json()
} catch (error) {
return null
}
},
async getTags () {
const url = this.$serverurl + 'models/tags'
const response = await fetch(url)
try {
return await response.json()
} catch (error) {
return null
}
},
removePrompt (id, name, mode) {
this.$buefy.dialog.confirm({
message: 'Delete ' + name + ' ?',
cancelText: 'Abort',
confirmText: 'Delete',
type: 'is-danger',
hasIcon: true,
onConfirm: async () => {
switch (mode) {
case 'user' : this.remove(id, name, 'user'); break
case 'model' : this.remove(id, name, 'models'); break
case 'tag' : this.remove(id, name, 'models/tags'); break
case 'category' : this.remove(id, name, 'models/category'); break
}
this.modelList = await this.getModelList()
this.userList = await this.getUserList()
this.tagList = await this.getTags()
}
})
},
async remove (id, name, type) {
const token = await localStorage.getItem('token')
const url = this.$serverurl + type + '?id=' + id
try {
await fetch(url, {
method: 'DELETE',
headers: {
Authorization: 'Bearer ' + token
}
})
this.$buefy.toast.open(name + ' deleted')
} catch (error) {
this.$buefy.toast.open('Delete error ' + error)
}
},
addNewTagDialog (categoryId) {
this.$buefy.dialog.prompt({
message: 'Tag',
inputAttrs: {
maxlength: 20
},
confirmText: 'Add',
onConfirm: async (value) => {
await this.addNewTag(value, categoryId)
this.tagList = await this.getTags()
}
})
},
async addNewTag (tag, categoryId) {
const url = this.$serverurl + 'models/tags'
const token = await localStorage.getItem('token')
try {
const response = await fetch(
url, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
Authorization: 'Bearer ' + token
},
body: JSON.stringify({
name: tag,
categoryId: categoryId
})
}
)
return await response.json()
} catch (error) {
return null
}
},
addNewCategoryDialog () {
this.$buefy.dialog.prompt({
message: 'Category',
inputAttrs: {
maxlength: 20
},
confirmText: 'Add',
onConfirm: async (value) => {
await this.addNewCategory(value)
this.tagList = await this.getTags()
}
})
},
async addNewCategory (name) {
const url = this.$serverurl + 'models/category'
const token = await localStorage.getItem('token')
try {
const response = await fetch(
url, {
method: 'POST',
headers: {
Accept: 'application/json',
'Content-Type': 'application/json',
Authorization: 'Bearer ' + token
},
body: JSON.stringify({
name: name
})
}
)
return await response.json()
} catch (error) {
return null
}
}
}
}
</script>
<style>
<style scoped>
.actionButton {
margin-left:8px;
}
</style>
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment