Commit 5514347e authored by Arthur.Pautrel's avatar Arthur.Pautrel
Browse files

Fixes and display on homeview

parent 07b95206
......@@ -6,6 +6,10 @@
padding: 15px;
}
.addItemFields {
margin-top: 22px;
}
#submitButton {
background-color: #41B883;
border-color: #41B883;
......
......@@ -4,7 +4,6 @@ var category = {
async create({ name, desc, imageUrl }) {
const dataCategory = JSON.stringify({ name, desc, imageUrl });
const result = await axios.post('http://localhost:3001/category/create', dataCategory, {withCredentials: true, headers: {"Content-type": "application/json",} });
console.log(result);
return result;
},
async all() {
......
......@@ -9,6 +9,11 @@ var price = {
async all() {
const result = await axios.get('http://localhost:3001/price/all', {withCredentials: true, headers: {"Content-type": "application/json",} });
return result;
},
async delete({ id }) {
const dataCategory = JSON.stringify({ id });
const result = await axios.delete('http://localhost:3001/price/delete', dataCategory, {withCredentials: true, headers: {"Content-type": "application/json",} });
return result;
}
}
......
......@@ -45,7 +45,7 @@ export default {
<form @submit="onSubmit" method="post">
<div class="flex flex-row py-2 px-2 space-x-2 bg-gray-100">
<div>
<input v-model="name" type="text" placeholder="Name" required />
<input class="addItemFields" v-model="name" type="text" placeholder="Name" required />
</div>
<div>
<label for="category">Choose a category:</label>
......@@ -66,6 +66,7 @@ export default {
</div>
<div>
<input
class="addItemFields"
v-model="desc"
required
type="text"
......@@ -90,9 +91,9 @@ export default {
<tr v-for="item in items" :key="item.name">
<td>{{ item.name }}</td>
<div v-for="category of categories" :key="category._id">
<template v-for="category of categories" :key="category._id">
<td class="box" v-if="category._id == item.category">{{ category.name }}</td>
</div>
</template>
<td>{{ item.desc }}</td>
</tr>
</table>
......
......@@ -70,6 +70,9 @@ export default {
this.price = this.source = this.selectedProduct = "";
},
},
// computed: {
// },
async mounted() {
const resCategories = await categoryApi.all();
this.categories = resCategories.data.data;
......@@ -79,9 +82,6 @@ export default {
this.products = resProducts.data.data;
const resPrices = await priceApi.all();
this.prices = resPrices.data.data;
console.log(this.products)
console.log(this.prices)
},
};
</script>
......@@ -96,7 +96,7 @@ export default {
<form @submit="onCreateProduct" method="post">
<div class="flex flex-row py-2 px-2 space-x-1 bg-gray-100">
<div>
<input required v-model="title" type="text" placeholder="Title" />
<input class="addItemFields" required v-model="title" type="text" placeholder="Title" />
</div>
<div>
<label for="item">Choose an item:</label>
......@@ -113,6 +113,7 @@ export default {
</div>
<div>
<input
class="addItemFields"
required
v-model="imageUrl"
type="text"
......@@ -121,6 +122,7 @@ export default {
</div>
<div>
<input
class="addItemFields"
required
v-model="desc"
type="text"
......@@ -154,17 +156,14 @@ export default {
<td>
<ul>
<li v-for="price in prices" :key="price._id">
<!-- <div v-for="price in prices" :key="price._id"> -->
<!-- {{ product._id }} -->
<span v-if="product._id == price.product">{{ price.price }}$</span>
<span v-if="product._id == price.product">({{ price.source }})</span>
<!-- </div> -->
<span v-if="product._id == price.product">{{ price.price }}$</span>
<span v-if="product._id == price.product">({{ price.source }})</span>
</li>
</ul>
</td>
<div v-for="item of items" :key="item._id">
<template v-for="item of items" :key="item._id">
<td class="box" v-if="item._id == product.item">{{ item.name }}</td>
</div>
</template>
<td>{{ product.imageUrl }}</td>
<td>{{ product.desc }}</td>
<td>
......
<script >
import categoryApi from "@/libs/apis/category";
import productApi from "@/libs/apis/product";
import priceApi from "@/libs/apis/price";
export default {
components: {},
data() {
return {
categories: [],
products: [],
prices: [],
categoryClickedId: [],
itemClickedId: ''
};
......@@ -14,13 +16,15 @@ export default {
async mounted() {
const resCategories = await categoryApi.categorizedItems();
const resProducts = await productApi.all();
const resPrices = await priceApi.all();
this.categories = resCategories.data;
this.products = resProducts.data.data;
this.prices = resPrices.data.data;
},
methods: {
categoryClicked: function (idCategory) {
if (this.categorySelected(idCategory)) {
this.categoryClickedId.pop(idCategory);
this.categoryClickedId.splice(this.categoryClickedId.indexOf(idCategory),1);
} else {
this.categoryClickedId.push(idCategory);
}
......@@ -75,11 +79,11 @@ export default {
<div class="right">
<tr v-for="product in products" :key="product._id">
<ul v-if="this.itemClickedId == product.item._id">
<div class="border">
<ul v-if="this.itemClickedId == product.item">
<div class="border" id="productsStore">
<li>Name : {{ product.title }}</li>
<ul v-for="price in product.prices" :key="price._id">
<li>{{price.price}}$ in {{price.source}}</li>
<ul v-for="price in prices" :key="price._id">
<li v-if="price.product == product._id">{{price.price}}$ in {{price.source}}</li>
</ul>
</div>
</ul>
......@@ -96,4 +100,8 @@ export default {
display: flex;
}
#productsStore {
margin: 4px;
}
</style>
\ No newline at end of file
Supports Markdown
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