Skip to content

K
kiaisoft_tuananh_nuxt
Commit 2f43d5a6 authored by Le Dinh Trung's avatar Le Dinh Trung
Browse files
Options

Merge branch 'hotfix/fix-all' into 'dev' 

Hotfix/fix all

See merge request !9
parents 6ac57a0f 66e7f51a
Expand all Show whitespace changes
Inline Side-by-side
Showing with 892 additions and 695 deletions
components/nav.vue
View file @ 2f43d5a6
......@@ -12,10 +12,10 @@
<b-collapse id="nav-collapse" is-nav>
<b-navbar-nav>
<b-nav-item href="/home/users">USER</b-nav-item>
<b-nav-item href="/home/categories">CATEGORY</b-nav-item>
<b-nav-item href="/home/products">PRODUCT</b-nav-item>
<b-nav-item href="/home/posts">POST</b-nav-item>
<b-nav-item href="/users">USER</b-nav-item>
<b-nav-item href="/categories">CATEGORY</b-nav-item>
<b-nav-item href="/products">PRODUCT</b-nav-item>
<b-nav-item href="/posts">POST</b-nav-item>
</b-navbar-nav>
<!-- Right aligned nav items -->
......@@ -35,7 +35,7 @@
</template>
<script>
export default {
name: "nav",
name: "Nav",
};
</script>
<script>
......@@ -66,7 +66,7 @@ export default {
this.$auth.$storage.setUniversal("loggedIn", "false");
this.$auth.$storage.setUniversal("token", "");
this.$auth.$storage.setUniversal("userName", "");
this.$router.push("/");
this.$router.push("/login");
},
},
};
......
components/sidebar.vue
View file @ 2f43d5a6
......@@ -23,7 +23,7 @@
</template>
<script>
export default {
name: "sidebar",
name: "SideBar",
};
</script>
<script>
......
layouts/admin.vue
View file @ 2f43d5a6
......@@ -3,11 +3,11 @@
<Nav />
<nuxt />
</div>
</template>
<script>
import Nav from "@/components/Nav";
import SideBar from "@/components/SideBar";
export default {
components: { Nav },
......
middleware/web.js
View file @ 2f43d5a6
export default ({ redirect }) => {
// console.log('[LOG]: middleware is running ...')
if (localStorage.getItem("token")=="") {
return redirect('/')
return redirect('/login')
}
};
\ No newline at end of file
nuxt.config.js
View file @ 2f43d5a6
......@@ -45,6 +45,7 @@ export default {
'@nuxtjs/axios',
'@nuxtjs/auth-next',
'@nuxtjs/toast',
'@pinia/nuxt',
],
bootstrapVue: {
......@@ -52,12 +53,23 @@ export default {
},
axios: {
baseURL: process.env.API_URL || ' http://127.0.0.1:8000/api/',
debug: process.env.DEBUG || false,
proxyHeaders: false,
baseURL: 'http://127.0.0.1:8000/api/',
debug: false,
proxyHeaders: true,
credentials: false,
},
// publicRuntimeConfig: {
// axios: {
// browserBaseURL: process.env.BROWSER_BASE_URL
// }
// },
// privateRuntimeConfig: {
// axios: {
// baseURL: process.env.BASE_URL
// }
// },
auth: {
},
......
package-lock.json
View file @ 2f43d5a6
This diff is collapsed.
pages/about.vue
View file @ 2f43d5a6
<template>
<div>
<div>
<h1 style="text-align: center">ABOUT</h1>
</div>
</div>
</template>
\ No newline at end of file
pages/home/categories.vue → pages/categories/index.vue
View file @ 2f43d5a6
......@@ -5,10 +5,10 @@
<b-icon icon="house-fill" scale="1.25" shift-v="1.25" aria-hidden="true"></b-icon>
Home
</b-breadcrumb-item>
<b-breadcrumb-item href="/home/categories">Category</b-breadcrumb-item>
<b-breadcrumb-item href="/categories">Category</b-breadcrumb-item>
</b-breadcrumb>
<div style="float: right">
<b-button v-b-modal.modal-create >New Category</b-button></div>
<b-button v-b-modal.modal-create class="text-white">New Category</b-button></div>
<!-- create modal -->
<b-modal id="modal-create" title="Create Category" class="modal fade" >
<p class="my-4">
......@@ -192,7 +192,7 @@
<script>
import Nav from "@/components/Nav";
import axios from "axios";
import { BootstrapVue, BootstrapVueIcons } from 'bootstrap-vue'
import { BootstrapVue, BootstrapVueIcons } from 'bootstrap-vue';
export default {
layout: 'admin',
......@@ -234,7 +234,7 @@ export default {
name: "",
id: "",
ordering: "",
status: "",
parent_id: "",
created_at: "",
updated_at: "",
},
......@@ -250,76 +250,76 @@ export default {
},
computed: {
formTitle() {
return this.editedIndex === -1 ? "New Item" : "Edit Item";
return this.editedIndex === -1 ? "New Item" : "Edit Item"
},
},
watch: {
dialog(val) {
val || this.close();
val || this.close()
},
dialogDelete(val) {
val || this.closeDelete();
val || this.closeDelete()
},
},
created() {
this.initialize();
this.getCategories();
this.initialize()
this.getCategories()
},
methods: {
initialize() {
this.users = [];
this.categories= [];
this.users = []
this.categories= []
},
editItem(item) {
this.editedIndex = this.categories.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialog = true;
this.editedIndex = this.categories.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialog = true
},
deleteItem(item) {
this.editedIndex = this.categories.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialogDelete = true;
this.editedIndex = this.categories.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialogDelete = true
},
deleteItemConfirm() {
this.categories.splice(this.editedIndex, 1);
this.closeDelete();
this.categories.splice(this.editedIndex, 1)
this.closeDelete()
},
close() {
this.dialog = false;
this.dialog = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
closeDelete() {
this.dialogDelete = false;
this.dialogDelete = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
save() {
if (this.editedIndex > -1) {
Object.assign(this.categories[this.editedIndex], this.editedItem);
Object.assign(this.categories[this.editedIndex], this.editedItem)
} else {
this.categories.push(this.editedItem);
this.categories.push(this.editedItem)
}
this.close();
this.close()
},
getCategories() {
axios
.get("http://127.0.0.1:8000/api/categories/")
this.$axios
.get("/categories/")
.then((response) => (this.categories = response.data.data))
.catch(function (error) {
console.log(error);
});
console.log(error)
})
},
createCategory() {
const set = new Set([this.image]);
const image = Array.from(set);
const self = this;
axios
.post('http://127.0.0.1:8000/api/categories/',{
const set = new Set([this.image])
const image = Array.from(set)
const self = this
this.$axios
.post('/categories/',{
name: this.name,
ordering: this.ordering,
parent_id: this.parent_id,
......@@ -335,35 +335,39 @@ export default {
self.$toast.success('Category created successfully!', {
duration: 3000
})
this.editedItem = response.data.data
console.log(this.editedItem)
this.categories.push(this.editedItem)
})
.catch(errors => {
this.$bvModal.hide('modal-create')
console.log(errors.response.data.message);
this.message = errors.response.data.message;
console.log(errors.response.data.message)
this.message = errors.response.data.message
self.$toast.error('something went wrong while trying create!',{
duration: 3000
});
});
})
})
},
fileSelected(event){
console.log(event)
const file = event.target.files[0];
this.url = URL.createObjectURL(file);
this.image = file;
const file = event.target.files[0]
this.url = URL.createObjectURL(file)
this.image = file
console.log(file)
console.log(this.image)
},
deleteCategory(ID,index) {
this.editedIndex = this.categories.indexOf(index);
const self = this
this.editedIndex = this.categories.indexOf(index)
if(confirm("Do you really want to delete?")){
try{
axios
.delete(`http://127.0.0.1:8000/api/categories/${ID}`)
this.$axios
.delete(`/categories/${ID}`)
.then(response => {
this.categories.splice(this.editedIndex, 1);
this.categories.splice(this.editedIndex, 1)
self.$toast.success('Category deleted successfully!',{
duration: 3000
});
})
})
} catch(error){
console.log(error)
......@@ -374,25 +378,26 @@ export default {
console.log(this.categories.indexOf(item))
},
editCategory(item) {
this.$bvModal.show('modal-edit');
this.eID = item.id;
this.eName= item.name,
this.eOrdering= item.ordering,
this.eParentId= item.parent_id,
this.eImage= item.images,
console.log(this?.eID);
console.log(item);
this.$bvModal.show('modal-edit')
this.eID = item.id
this.eName= item.name
this.eOrdering= item.ordering
this.eParentId= item.parent_id
this.eImage= item.images
this.editedIndex = this.categories.indexOf(item)
console.log(this?.eID)
console.log(item)
},
updateCategory(userID) {
const set = new Set([this.eImage]);
const image = Array.from(set);
const set = new Set([this.eImage])
const image = Array.from(set)
const self = this
console.log(this.eName);
console.log(this.eOrdering);
console.log(this?.eID);
console.log(this.eName)
console.log(this.eOrdering)
console.log(this?.eID)
try{
axios
.post(`http://127.0.0.1:8000/api/categories/update/${this?.eID}`,{
this.$axios
.post(`categories/update/${this?.eID}`,{
name: this.eName,
ordering: this.eOrdering,
parent_id: this.eParentId,
......@@ -405,8 +410,11 @@ export default {
.then(response => {
self.$toast.success('User updated successfully!',{
duration: 3000
});
console.log(response);
})
console.log(response)
this.editedItem = response.data.data
this.$bvModal.hide('modal-edit')
Object.assign(this.categories[this.editedIndex], this.editedItem)
})
} catch(error){
console.log(error)
......
pages/index.vue → pages/login.vue
View file @ 2f43d5a6
......@@ -115,7 +115,7 @@ export default {
this.$toast.error("Username or Password not valid", {
duration: 2000,
});
this.$router.push("/");
this.$router.push("/login");
}
},
checkForm: function (e) {
......
pages/home/posts.vue → pages/posts/index.vue
View file @ 2f43d5a6
......@@ -10,7 +10,7 @@
></b-icon>
Home
</b-breadcrumb-item>
<b-breadcrumb-item href="/home/posts">Post</b-breadcrumb-item>
<b-breadcrumb-item href="/posts">Post</b-breadcrumb-item>
</b-breadcrumb>
<div style="float: right">
<b-button class="text-white" v-b-modal.modal-create>New Post</b-button>
......@@ -117,7 +117,7 @@
type="text"
class="form-control mb-2"
placeholder="Description"
v-model="sUserID"
v-model="sUserId"
size="sm"
disabled
/>
......@@ -279,7 +279,7 @@ export default {
},
{ text: "Category ID", value: "category_id" },
{ text: "content", value: "content", sortable: false },
{ text: "user_id", value: "user_id" },
{ text: "author", value: "user_id" },
{ text: "status", value: "status" },
{ text: "Actions", value: "actions", sortable: false },
],
......@@ -301,12 +301,11 @@ export default {
message: [],
editedIndex: -1,
editedItem: {
name: "",
id: "",
ordering: "",
title: "",
category_id: "",
content: "",
user_id: "",
status: "",
created_at: "",
updated_at: "",
},
defaultItem: {
name: "",
......@@ -316,26 +315,26 @@ export default {
created_at: "",
updated_at: "",
},
};
}
},
computed: {
formTitle() {
return this.editedIndex === -1 ? "New Item" : "Edit Item";
return this.editedIndex === -1 ? "New Item" : "Edit Item"
},
nameState() {
return this.name.length > 2 ? true : false;
return this.name.length > 2 ? true : false
},
},
watch: {
dialog(val) {
val || this.close();
val || this.close()
},
dialogDelete(val) {
val || this.closeDelete();
val || this.closeDelete()
},
},
created() {
this.initialize(), this.getposts(), this.getCategories();
this.initialize(), this.getposts(), this.getCategories()
},
methods: {
initialize() {
......@@ -350,62 +349,61 @@ export default {
this.sImages = null
},
editItem(item) {
this.editedIndex = this.posts.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialog = true;
this.editedIndex = this.posts.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialog = true
},
deleteItem(item) {
this.editedIndex = this.posts.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialogDelete = true;
this.editedIndex = this.posts.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialogDelete = true
},
deleteItemConfirm() {
this.posts.splice(this.editedIndex, 1);
this.closeDelete();
this.posts.splice(this.editedIndex, 1)
this.closeDelete()
},
close() {
this.dialog = false;
this.dialog = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
closeDelete() {
this.dialogDelete = false;
this.dialogDelete = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
save() {
if (this.editedIndex > -1) {
Object.assign(this.posts[this.editedIndex], this.editedItem);
Object.assign(this.posts[this.editedIndex], this.editedItem)
} else {
this.posts.push(this.editedItem);
this.posts.push(this.editedItem)
}
this.close();
this.close()
},
getCategories() {
axios
.get("http://127.0.0.1:8000/api/categories/")
this.$axios
.get("/categories/")
.then((response) => (this.categories = response.data.data))
.catch(function (error) {
console.log(error);
});
console.log(error)
})
},
getposts() {
axios
.get("http://127.0.0.1:8000/api/posts/")
this.$axios
.get("/posts/")
.then((response) => (this.posts = response.data.data))
.catch(function (error) {
console.log(error);
});
console.log(error)
})
},
createPost() {
const self = this;
axios
.post(
"http://127.0.0.1:8000/api/posts/",
const self = this
this.$axios
.post("/posts/",
{
title: this.title,
category_id: this.category_id,
......@@ -422,78 +420,80 @@ export default {
}
)
.then((response) => {
this.$bvModal.hide("modal-create");
this.$bvModal.hide("modal-create")
self.$toast.success("Post created successfully!", {
duration: 3000,
});
})
this.editedItem = response.data.data
console.log(this.editedItem)
this.posts.push(this.editedItem)
})
.catch((errors) => {
this.$bvModal.hide("modal-create");
console.log(errors.response.data.message);
this.message = errors.response.data.message;
this.$bvModal.hide("modal-create")
console.log(errors.response.data.message)
this.message = errors.response.data.message
self.$toast.error("something went wrong while trying create!", {
duration: 3000,
});
});
})
})
},
deletePost(ID, index) {
const self = this;
this.editedIndex = this.posts.indexOf(index);
const self = this
this.editedIndex = this.posts.indexOf(index)
if (confirm("Do you really want to delete?")) {
axios
.delete(`http://127.0.0.1:8000/api/posts/${ID}`)
this.$axios
.delete(`/posts/${ID}`)
.then((response) => {
this.posts.splice(this.editedIndex, 1);
this.posts.splice(this.editedIndex, 1)
self.$toast.success("Post deleted successfully!", {
duration: 3000,
});
})
})
.catch((error) => {
console.log(error);
console.log(error)
self.$toast.error("Error!", {
duration: 3000,
});
});
})
})
}
},
async showPost(item) {
const ID = item.id;
const ID = item.id
try {
const resp = await fetch(`http://127.0.0.1:8000/api/posts/${ID}`, {
const resp = await this.$axios.get(`/posts/${ID}`, {
method: "GET",
headers: {
"Content-Type": "multipart/form-data",
Authorization: this.$auth.$storage.getUniversal("token"),
},
}).then((response) => {
return response.json();
});
this.sTitle = resp.data.title;
this.sContent = resp.data.content;
this.sCategoryId = resp.data.category_id;
this.sUserId = resp.data.user_id;
this.sStatus = resp.data.status;
this.sImages = resp.data.images;
})
console.log(resp.data)
this.sTitle = resp.data.data.title
this.sContent = resp.data.data.content
this.sCategoryId = resp.data.data.category_id
this.sUserId = resp.data.data.user_id
this.sStatus = resp.data.data.status
this.sImages = resp.data.data.images
} catch (error) {
console.log(error);
console.log(error)
}
this.$bvModal.show("modal-show");
this.$bvModal.show("modal-show")
},
editPost(item) {
this.$bvModal.show("modal-edit");
this.eId = item.id;
this.eTitle = item.title;
this.eCategoryId = item.category_id;
this.eContent = item.content;
this.eStatus = item.status;
this.eUserId = item.user_id;
// this.eImages = item.images
this.$bvModal.show("modal-edit")
this.eId = item.id
this.eTitle = item.title
this.eCategoryId = item.category_id
this.eContent = item.content
this.eStatus = item.status
this.eUserId = item.user_id
this.editedIndex = this.posts.indexOf(item)
},
updatePost() {
const self = this;
axios
const self = this
this.$axios
.post(
`http://127.0.0.1:8000/api/posts/update/${this?.eId}`,
`/posts/update/${this?.eId}`,
{
title: this.eTitle,
category_id: this.eCategoryId,
......@@ -510,19 +510,22 @@ export default {
}
)
.then((response) => {
this.$bvModal.hide("modal-edit");
this.$bvModal.hide("modal-edit")
self.$toast.success("Post updated successfully!", {
duration: 3000,
});
console.log(response);
})
console.log(response)
this.editedItem = response.data.data
this.$bvModal.hide('modal-edit')
Object.assign(this.posts[this.editedIndex], this.editedItem)
})
.catch((error) => {
console.log(error);
this.$bvModal.hide("modal-edit");
console.log(error)
this.$bvModal.hide("modal-edit")
self.$toast.error("something went wrong while trying create!", {
duration: 3000,
});
});
})
})
},
},
};
......
pages/home/products.vue → pages/products/index.vue
View file @ 2f43d5a6
......@@ -5,7 +5,7 @@
<b-icon icon="house-fill" scale="1.25" shift-v="1.25" aria-hidden="true"></b-icon>
Home
</b-breadcrumb-item>
<b-breadcrumb-item href="/home/products">Product</b-breadcrumb-item>
<b-breadcrumb-item href="/products">Product</b-breadcrumb-item>
</b-breadcrumb>
<div style="float: right">
<b-button class="text-white" v-b-modal.modal-create >New Product</b-button></div>
......@@ -393,11 +393,10 @@ export default {
editedIndex: -1,
editedItem: {
name: "",
id: "",
ordering: "",
status: "",
created_at: "",
updated_at: "",
category_id: "",
price: "",
description: "",
stock: "",
},
defaultItem: {
name: "",
......@@ -448,7 +447,7 @@ export default {
quantity: "",
},
];
]
},
editItem(item) {
this.editedIndex = this.products.indexOf(item)
......@@ -456,12 +455,12 @@ export default {
this.dialog = true
},
deleteItem(item) {
this.editedIndex = this.products.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialogDelete = true;
this.editedIndex = this.products.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialogDelete = true
},
deleteItemConfirm() {
this.products.splice(this.editedIndex, 1);
this.products.splice(this.editedIndex, 1)
this.closeDelete()
},
close() {
......@@ -469,45 +468,45 @@ export default {
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
});
})
},
closeDelete() {
this.dialogDelete = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
});
})
},
save() {
if (this.editedIndex > -1) {
Object.assign(this.products[this.editedIndex], this.editedItem);
Object.assign(this.products[this.editedIndex], this.editedItem)
} else {
this.products.push(this.editedItem);
this.products.push(this.editedItem)
}
this.close()
},
getCategories() {
axios
.get("http://127.0.0.1:8000/api/categories/")
this.$axios
.get("/categories/")
.then((response) => (this.categories = response.data.data))
.catch(function (error) {
console.log(error)
});
})
},
getProducts() {
axios
.get("http://127.0.0.1:8000/api/products/")
this.$axios
.get("/products/")
.then((response) => (this.products = response.data.data))
.catch(function (error) {
console.log(error)
});
})
},
createProduct() {
const self = this;
const self = this
// const set = new Set([this.images]);
// const images = Array.from(set);
axios
.post('http://127.0.0.1:8000/api/products/',{
this.$axios
.post('/products/',{
name: this.name,
price: this.price,
category_id: this.category_id,
......@@ -525,28 +524,31 @@ export default {
self.$toast.success('Product created successfully!', {
duration: 3000
})
this.editedItem = response.data.data
console.log(this.editedItem)
this.products.push(this.editedItem)
})
.catch(errors => {
this.$bvModal.hide('modal-create')
console.log(errors.response.data.message)
this.message = errors.response.data.message;
this.message = errors.response.data.message
self.$toast.error('something went wrong while trying create!',{
duration: 3000
})
})
},
deleteProduct(ID,index) {
const self = this;
this.editedIndex = this.products.indexOf(index);
const self = this
this.editedIndex = this.products.indexOf(index)
if(confirm("Do you really want to delete?")){
try{
axios
.delete(`http://127.0.0.1:8000/api/products/${ID}`)
this.$axios
.delete(`/products/${ID}`)
.then(response => {
this.products.splice(this.editedIndex, 1);
this.products.splice(this.editedIndex, 1)
self.$toast.success('Category deleted successfully!',{
duration: 3000
});
})
})
} catch(error){
console.log(error)
......@@ -556,24 +558,20 @@ export default {
async showProduct(item) {
const ID = item.id
try {
const resp = await fetch(`http://127.0.0.1:8000/api/products/${ID}`, {
const resp = await this.$axios.get(`/products/${ID}`, {
method: "GET",
headers: {
"Content-Type": "multipart/form-data",
"Authorization": this.$auth.$storage.getUniversal("token")
}
}).then((response) => {
return response.json()
});
this.sName = resp.data.name
this.sPrice = resp.data.price
this.sCategoryId = resp.data.category_id
this.sDescription = resp.data.description
this.sStock = resp.data.stock
this.sVariants = resp.data.variants
this.sImages = resp.data.images
console.log(this.sVariants)
console.log(this.sImages)
Authorization: this.$auth.$storage.getUniversal("token"),
},
})
this.sName = resp.data.data.name
this.sPrice = resp.data.data.price
this.sCategoryId = resp.data.data.category_id
this.sDescription = resp.data.data.description
this.sStock = resp.data.data.stock
this.sVariants = resp.data.data.variants
this.sImages = resp.data.data.images
} catch (error) {
console.log(error)
}
......@@ -588,12 +586,13 @@ export default {
this.eStock = item.stock
this.eDescription = item.description
this.eVariants = item.variants
this.editedIndex = this.products.indexOf(item)
},
updateProduct(ID) {
const self = this
try{
axios
.post(`http://127.0.0.1:8000/api/products/update/${this?.eId}`,{
this.$axios
.post(`/products/update/${this?.eId}`,{
name: this.eName,
price: this.ePrice,
category_id: this.eCategoryId,
......@@ -609,8 +608,11 @@ export default {
.then(response => {
self.$toast.success('User updated successfully!',{
duration: 3000
});
})
console.log(response)
this.editedItem = response.data.data
this.$bvModal.hide('modal-edit')
Object.assign(this.products[this.editedIndex], this.editedItem)
})
} catch(error){
console.log(error)
......@@ -621,14 +623,14 @@ export default {
color: "",
size: "",
quantity: "",
});
})
},
addMoreVariant() {
this.eVariants.push({
color: "",
size: "",
quantity: "",
});
})
},
remove(index) {
this.variants.splice(index, 1)
......
pages/register.vue
View file @ 2f43d5a6
......@@ -31,7 +31,6 @@
v-model="email"
required
/>
<label>Password :</label>
<input
type="password"
......
pages/user/index.vue deleted 100644 → 0
View file @ 6ac57a0f
<template>
<div>content</div>
</template>
<script>
export default {
layout: "default",
};
</script>
<style>
</style>
\ No newline at end of file
pages/home/users.vue → pages/users/index.vue
View file @ 2f43d5a6
......@@ -10,7 +10,7 @@
<b-breadcrumb-item href="/home/users">User</b-breadcrumb-item>
</b-breadcrumb>
<div style="float: right">
<b-button v-b-modal.modal-login >New User</b-button>
<b-button v-b-modal.modal-login class="text-white">New User</b-button>
<!-- modal create user -->
<b-modal id="modal-login" title="Create User" class="modal fade" >
<Notification :message="error" v-if="error" />
......@@ -100,23 +100,12 @@
<v-spacer></v-spacer>
<v-dialog v-model="dialog" max-width="500px">
<template v-slot:activator="{ on, attrs }">
<!-- <v-btn
color="primary"
dark
class="mb-2"
v-bind="attrs"
v-on="on"
v-on:click="getUser"
>
New User
</v-btn> -->
<!-- modal create user -->
</template>
<v-card>
<v-card-title>
<span class="text-h5">{{ formTitle }}</span>
</v-card-title>
<v-card-text>
<v-container>
<v-row>
......@@ -153,7 +142,6 @@
</v-row>
</v-container>
</v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn color="blue darken-1" text @click="close">
......@@ -183,7 +171,7 @@
</v-toolbar>
</template>
<template v-slot:item.actions="{ item }">
<v-icon small class="mr-2" @click=" editUser(item);" :id ="item.id"> mdi-pencil </v-icon>
<v-icon small class="mr-2" @click=" editUser(item)" :id ="item.id"> mdi-pencil </v-icon>
<v-icon small @click="deleteUser(item.id, item)" :id ="item.id"> mdi-delete </v-icon>
</template>
<template v-slot:no-data>
......@@ -196,7 +184,6 @@
import Nav from "@/components/Nav";
import axios from "axios";
export default {
layout: "admin",
components: { Nav },
......@@ -250,20 +237,20 @@ export default {
},
computed: {
formTitle() {
return this.editedIndex === -1 ? "New Item" : "Edit Item";
return this.editedIndex === -1 ? "New Item" : "Edit Item"
},
},
watch: {
dialog(val) {
val || this.close();
val || this.close()
},
dialogDelete(val) {
val || this.closeDelete();
val || this.closeDelete()
},
},
created() {
this.initialize();
this.getUsers();
this.initialize()
this.getUsers()
},
methods: {
initialize() {
......@@ -271,53 +258,53 @@ export default {
this.editedItem = {}
},
editItem(item) {
this.editedIndex = this.users.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialog = true;
this.editedIndex = this.users.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialog = true
},
deleteItem(item) {
this.editedIndex = this.users.indexOf(item);
this.editedItem = Object.assign({}, item);
this.dialogDelete = true;
this.editedIndex = this.users.indexOf(item)
this.editedItem = Object.assign({}, item)
this.dialogDelete = true
},
deleteItemConfirm() {
this.users.splice(this.editedIndex, 1);
this.closeDelete();
this.users.splice(this.editedIndex, 1)
this.closeDelete()
},
close() {
this.dialog = false;
this.dialog = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
closeDelete() {
this.dialogDelete = false;
this.dialogDelete = false
this.$nextTick(() => {
this.editedItem = Object.assign({}, this.defaultItem);
this.editedIndex = -1;
});
this.editedItem = Object.assign({}, this.defaultItem)
this.editedIndex = -1
})
},
save() {
if (this.editedIndex > -1) {
Object.assign(this.users[this.editedIndex], this.editedItem);
Object.assign(this.users[this.editedIndex], this.editedItem)
} else {
this.users.push(this.editedItem);
this.users.push(this.editedItem)
}
this.close();
this.close()
},
getUsers() {
axios
.get("http://127.0.0.1:8000/api/users/")
this.$axios
.get('/users/')
.then((response) => (this.users = response.data.data.data))
.catch(function (error) {
console.log(error);
});
console.log(error)
})
},
createUser() {
const self = this
axios
.post('http://127.0.0.1:8000/api/users/',{
this.$axios
.post('/users/',{
headers: {
'Content-Type': 'application/json'
},
......@@ -330,36 +317,34 @@ export default {
this.$bvModal.hide('modal-login')
self.$toast.success('User created successfully!',{
duration: 3000
});
})
console.log(response)
this.editedItem = response.data.data
console.log(this.editedItem)
this.users.push(this.editedItem)
})
.catch(errors => {
this.$bvModal.hide('modal-login')
console.log(errors.response.data.message);
this.message = errors.response.data.message;
console.log(errors.response.data.message)
this.message = errors.response.data.message
self.$toast.error('something went wrong while trying create!',{
duration: 3000
});
});
})
})
},
deleteUser(userID, index) {
const self = this
this.editedIndex = this.users.indexOf(index);
this.editedIndex = this.users.indexOf(index)
if(confirm("Do you really want to delete?")){
try{
axios
.delete(`http://127.0.0.1:8000/api/users/${userID}`)
this.$axios
.delete(`/users/${userID}`)
.then(response => {
console.log(response.data)
this.users.splice(this.editedIndex, 1);
this.users.splice(this.editedIndex, 1)
self.$toast.success('User deleted successfully!',{
duration: 3000
});
})
})
} catch(error){
console.log(error)
......@@ -367,29 +352,28 @@ export default {
}
},
editUser(user) {
this.$bvModal.show('modal-edit');
this.eID = user.id;
this.eEmail = user.email;
this.eName = user.name;
this.editedIndex = this.users.indexOf(user);
console.log(this?.eID);
this.$bvModal.show('modal-edit')
this.eID = user.id
this.eEmail = user.email
this.eName = user.name
this.editedIndex = this.users.indexOf(user)
console.log(this?.eID)
},
updateUser(userID) {
const self = this
console.log(this.eName);
console.log(this.eEmail);
console.log(this?.eID);
console.log(this.eName)
console.log(this.eEmail)
console.log(this?.eID)
try{
axios
.put(`http://127.0.0.1:8000/api/users/${this?.eID}`,{
this.$axios
.put(`/users/${this?.eID}`,{
email: this.eEmail,
password: this.ePassword,
name:this.eName,} )
.then(response => {
self.$toast.success('User updated successfully!',{
duration: 3000
});
})
console.log(response)
this.editedItem = response.data.data
this.$bvModal.hide('modal-edit')
......
plugins/axios.js
View file @ 2f43d5a6
export default ({ $axios}) => {
$axios.onRequest(config => {
config.headers.common['Content-Type'] = 'multipart/form-data';
});
export default function ({ $axios }, inject) {
const api = $axios.create({
headers: {
common: {
Accept: 'application/json, text/plain, */*'
}
}
})
// Set baseURL to something different
api.setBaseURL('http://127.0.0.1:8000/api/')
// Inject to context as $api
inject('api', api)
}
\ No newline at end of file
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