Skip to content

K
kiaisoft_tuananh_nuxt
Commit 802a43ba authored by TTS Kieu Tuan Anh's avatar TTS Kieu Tuan Anh
Browse files
Options

add dialog delete

parent 0c71bd4b
Hide whitespace changes
Inline Side-by-side
Showing with 112 additions and 75 deletions
pages/categories/index.vue
View file @ 802a43ba
...@@ -292,7 +292,7 @@ ...@@ -292,7 +292,7 @@
<v-icon :id="item.id" small @click="dialog2 = true; editCategory(item)"> <v-icon :id="item.id" small @click="dialog2 = true; editCategory(item)">
mdi-pencil mdi-pencil
</v-icon> </v-icon>
<v-icon :id="item.id" small @click="dialogDelete = true;getID(item)"> <v-icon :id="item.id" small @click="dialogDelete = true; getID(item)">
mdi-delete mdi-delete
</v-icon> </v-icon>
<v-icon :id="item.id" small @click="dialog3 = true; showCategory(item)"> <v-icon :id="item.id" small @click="dialog3 = true; showCategory(item)">
......
pages/users/index.vue
View file @ 802a43ba
...@@ -11,11 +11,7 @@ ...@@ -11,11 +11,7 @@
</v-breadcrumbs> </v-breadcrumbs>
</div> </div>
<!-- modal-create --> <!-- modal-create -->
<v-dialog <v-dialog v-model="dialog2" persistent max-width="600px">
v-model="dialog2"
persistent
max-width="600px"
>
<v-card> <v-card>
<v-card-title> <v-card-title>
<span class="text-h5">User Edit</span> <span class="text-h5">User Edit</span>
...@@ -23,23 +19,11 @@ ...@@ -23,23 +19,11 @@
<v-card-text> <v-card-text>
<v-container> <v-container>
<v-row> <v-row>
<v-col <v-col cols="12" sm="6" md="4">
cols="12" <v-text-field v-model="eName" label="Legal name*" required />
sm="6"
md="4"
>
<v-text-field
v-model="eName"
label="Legal name*"
required
/>
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<v-text-field <v-text-field v-model="eEmail" label="Email*" required />
v-model="eEmail"
label="Email*"
required
/>
</v-col> </v-col>
<v-col cols="12"> <v-col cols="12">
<v-text-field <v-text-field
...@@ -55,39 +39,68 @@ ...@@ -55,39 +39,68 @@
</v-card-text> </v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer /> <v-spacer />
<v-btn color="blue darken-1" text @click="dialog2 = false">
Close
</v-btn>
<v-btn <v-btn
color="blue darken-1" color="blue darken-1"
text text
@click="dialog2 = false" type="submit"
@click="
dialog2 = false;
updateUser();
"
> >
Close Save
</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
<!-- modal-delete -->
<v-dialog v-model="dialogDelete" max-width="500px">
<v-card>
<v-card-title class="text-h5">
Are you sure you want to delete this item?
</v-card-title>
<v-card-actions>
<v-spacer />
<v-btn color="blue darken-1" text @click="closeDelete">
Cancel
</v-btn> </v-btn>
<v-btn <v-btn
color="blue darken-1" color="blue darken-1"
text text
type="submit" @click="
@click="dialog2 = false; updateUser();" deleteUser();
dialogDelete = false;
"
> >
Save OK
</v-btn> </v-btn>
<v-spacer />
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</v-dialog> </v-dialog>
<v-data-table :headers="headers" :items="users" sort-by="calories" class="elevation-1"> <v-data-table
:headers="headers"
:items="users"
sort-by="calories"
class="elevation-1"
>
<template #top> <template #top>
<v-toolbar flat> <v-toolbar flat>
<v-toolbar-title>User Manage</v-toolbar-title> <v-toolbar-title>User Manage</v-toolbar-title>
<v-divider class="mx-4" inset vertical /> <v-divider class="mx-4" inset vertical />
<v-spacer /> <v-spacer />
<v-toolbar-title style="float: right"> <v-toolbar-title style="float: right">
<v-dialog v-model="dialog1" persistent max-width="600px" @submit.prevent="createUser"> <v-dialog
v-model="dialog1"
persistent
max-width="600px"
@submit.prevent="createUser"
>
<template #activator="{ on, attrs }"> <template #activator="{ on, attrs }">
<v-btn <v-btn color="primary" dark v-bind="attrs" v-on="on">
color="primary"
dark
v-bind="attrs"
v-on="on"
>
New USER New USER
</v-btn> </v-btn>
</template> </template>
...@@ -98,11 +111,7 @@ ...@@ -98,11 +111,7 @@
<v-card-text> <v-card-text>
<v-container> <v-container>
<v-row> <v-row>
<v-col <v-col cols="12" sm="6" md="4">
cols="12"
sm="6"
md="4"
>
<v-text-field <v-text-field
v-model="name" v-model="name"
label="Legal name*" label="Legal name*"
...@@ -130,18 +139,17 @@ ...@@ -130,18 +139,17 @@
</v-card-text> </v-card-text>
<v-card-actions> <v-card-actions>
<v-spacer /> <v-spacer />
<v-btn <v-btn color="blue darken-1" text @click="dialog1 = false">
color="blue darken-1"
text
@click="dialog1 = false"
>
Close Close
</v-btn> </v-btn>
<v-btn <v-btn
color="blue darken-1" color="blue darken-1"
text text
type="submit" type="submit"
@click="dialog1 = false; createUser();" @click="
dialog1 = false;
createUser();
"
> >
Save Save
</v-btn> </v-btn>
...@@ -158,10 +166,25 @@ ...@@ -158,10 +166,25 @@
<span>{{ formatDate(item.updated_at) }}</span> <span>{{ formatDate(item.updated_at) }}</span>
</template> </template>
<template #[`item.actions`]="{ item }"> <template #[`item.actions`]="{ item }">
<v-icon :id="item.id" small class="mr-2" @click="dialog2 = true; editUser(item);"> <v-icon
:id="item.id"
small
class="mr-2"
@click="
dialog2 = true;
editUser(item)
"
>
mdi-pencil mdi-pencil
</v-icon> </v-icon>
<v-icon :id="item.id" small @click="deleteUser(item.id, item)"> <v-icon
:id="item.id"
small
@click="
dialogDelete = true;
getID(item)
"
>
mdi-delete mdi-delete
</v-icon> </v-icon>
</template> </template>
...@@ -302,7 +325,9 @@ export default { ...@@ -302,7 +325,9 @@ export default {
.get('/users/', { .get('/users/', {
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
Authorization: `Bearer ${this.$auth.$storage.getUniversal('token')}` Authorization: `Bearer ${this.$auth.$storage.getUniversal(
'token'
)}`
} }
}) })
.then(response => (this.users = response.data.data.data)) .then(response => (this.users = response.data.data.data))
...@@ -313,16 +338,21 @@ export default { ...@@ -313,16 +338,21 @@ export default {
createUser () { createUser () {
const self = this const self = this
this.$axios this.$axios
.post('/users/', { .post(
email: this.email, '/users/',
password: this.password, {
name: this.name email: this.email,
}, { password: this.password,
headers: { name: this.name
'Content-Type': 'application/json', },
Authorization: `Bearer ${this.$auth.$storage.getUniversal('token')}` {
headers: {
'Content-Type': 'application/json',
Authorization: `Bearer ${this.$auth.$storage.getUniversal(
'token'
)}`
}
} }
}
) )
.then((response) => { .then((response) => {
self.$toast.success('User created successfully!', { self.$toast.success('User created successfully!', {
...@@ -342,23 +372,23 @@ export default { ...@@ -342,23 +372,23 @@ export default {
}) })
}) })
}, },
deleteUser (userID, index) { deleteUser () {
const self = this const self = this
this.editedIndex = this.users.indexOf(index) const currentPostIndex = this.editedIndex
if (confirm('Do you really want to delete?')) { try {
try { this.$axios.delete(`/users/${this.eID}`, {
this.$axios headers: {
.delete(`/users/${userID}`) Authorization: `Bearer ${this.$auth.$storage.getUniversal('token')}`
.then((response) => { }
console.log(response.data) }).then((response) => {
this.users.splice(this.editedIndex, 1) console.log(response.data)
self.$toast.success('User deleted successfully!', { this.users.splice(currentPostIndex, 1)
duration: 3000 self.$toast.success('User deleted successfully!', {
}) duration: 3000
}) })
} catch (error) { })
console.log(error) } catch (error) {
} console.log(error)
} }
}, },
editUser (user) { editUser (user) {
...@@ -374,7 +404,8 @@ export default { ...@@ -374,7 +404,8 @@ export default {
console.log(this.eEmail) console.log(this.eEmail)
console.log(this?.eID) console.log(this?.eID)
this.$axios this.$axios
.put(`/users/${this?.eID}`, .put(
`/users/${this?.eID}`,
{ {
email: this.eEmail, email: this.eEmail,
password: this.ePassword, password: this.ePassword,
...@@ -383,7 +414,9 @@ export default { ...@@ -383,7 +414,9 @@ export default {
{ {
headers: { headers: {
'Content-Type': 'application/json', 'Content-Type': 'application/json',
Authorization: `Bearer ${this.$auth.$storage.getUniversal('token')}` Authorization: `Bearer ${this.$auth.$storage.getUniversal(
'token'
)}`
} }
} }
) )
...@@ -401,6 +434,10 @@ export default { ...@@ -401,6 +434,10 @@ export default {
duration: 3000 duration: 3000
}) })
}) })
},
getID (item) {
this.eID = item.id
this.editedIndex = this.users.indexOf(item)
} }
} }
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment