summaryrefslogtreecommitdiff
path: root/iridescence/src/components/admin
diff options
context:
space:
mode:
Diffstat (limited to 'iridescence/src/components/admin')
-rw-r--r--iridescence/src/components/admin/NewProduct.vue12
-rw-r--r--iridescence/src/components/admin/ProductEditCard.vue73
-rw-r--r--iridescence/src/components/admin/ProductEditList.vue2
3 files changed, 44 insertions, 43 deletions
diff --git a/iridescence/src/components/admin/NewProduct.vue b/iridescence/src/components/admin/NewProduct.vue
index 511ae9c..48eb165 100644
--- a/iridescence/src/components/admin/NewProduct.vue
+++ b/iridescence/src/components/admin/NewProduct.vue
@@ -1,6 +1,6 @@
<template>
<div id="addNewProduct">
- <button class="button is-primary" @click="toggleModal">
+ <button class="button is-primary is-medium" @click="toggleModal">
+ Add New
</button>
<transition
@@ -17,9 +17,7 @@
<button class="delete" @click="toggleModal"></button>
</header>
<section class="modal-card-body">
- <ProductEditCard
- v-bind:current-product="newProduct"
- ></ProductEditCard>
+ <ProductEditCard v-bind:parent-product="template"></ProductEditCard>
</section>
<footer class="modal-card-foot"></footer>
</div>
@@ -29,8 +27,8 @@
</template>
<script>
-import Product from "../../models/product";
-import ProductEditCard from "./ProductEditCard";
+import Product from "@/models/product";
+import ProductEditCard from "@/components/admin/ProductEditCard";
export default {
name: "NewProduct",
@@ -40,7 +38,7 @@ export default {
data: function() {
return {
modalEnabled: false,
- newProduct: new Product(),
+ template: new Product({}),
addAnother: false
};
},
diff --git a/iridescence/src/components/admin/ProductEditCard.vue b/iridescence/src/components/admin/ProductEditCard.vue
index 350f8df..a8117ce 100644
--- a/iridescence/src/components/admin/ProductEditCard.vue
+++ b/iridescence/src/components/admin/ProductEditCard.vue
@@ -2,7 +2,7 @@
<div id="productEditCard">
<div class="card">
<div class="card-header">
- <p class="card-header-title" v-if="currentProduct.id > 0">
+ <p class="card-header-title" v-if="currentProduct.id">
{{ currentProduct.id }}: {{ currentProduct.name }}
</p>
</div>
@@ -74,7 +74,7 @@
type="file"
name="image"
accept=".jpg,.jpeg,.JPG,.JPEG"
- @change="previewFiles"
+ @change="changePhotoSet"
/>
<span class="file-cta">
<span class="file-label has-text-centered">
@@ -82,7 +82,7 @@
</span>
</span>
<span class="file-name">
- {{ newProduct.photo_set }}
+ {{ filename }}
</span>
</label>
</div>
@@ -107,7 +107,12 @@
enter-active-class="animate__animated animate__fadeIn"
leave-active-class="animate__animated animate__fadeOut"
>
- <div class="card-footer" v-if="isDifferent && isValid">
+ <div
+ class="card-footer"
+ v-if="
+ newProduct.isValidPost() || newProduct.isValidPatch(currentProduct)
+ "
+ >
<div class="card-footer-item">
<button class="button is-primary is-fullwidth" @click="saveProduct">
Save
@@ -120,7 +125,8 @@
</template>
<script>
-import Product from "../../models/product";
+import Product from "@/models/product";
+import ProductDiff from "@/models/product_diff";
const dollarRe = /^\$?(\d+)\.(\d{2})/gm;
@@ -128,28 +134,18 @@ export default {
name: "ProductEditCard",
data: function() {
return {
- newProduct: new Product(this.currentProduct)
+ currentProduct: new Product(this.parentProduct),
+ newProduct: new ProductDiff(this.currentProduct),
+ filename: ""
};
},
props: {
- currentProduct: {
+ parentProduct: {
type: Product,
required: true
}
},
- watch: {
- currentProduct() {
- // TODO: necessary?
- this.newProduct = new Product(this.currentProduct);
- }
- },
computed: {
- isDifferent() {
- return this.newProduct.isDifferent(this.currentProduct);
- },
- isValid() {
- return this.newProduct.isValid();
- },
newProductQuantity: {
get: function() {
return this.newProduct.quantity;
@@ -165,7 +161,7 @@ export default {
return (this.newProduct.cents / 100).toFixed(2);
},
set: function(val) {
- let groups = dollarRe.exec(val);
+ const groups = dollarRe.exec(val);
if (groups && groups[1] && groups[2]) {
this.newProduct.cents = 100 * groups[1] + 1 * groups[2];
}
@@ -174,12 +170,24 @@ export default {
},
methods: {
saveProduct() {
- if (this.newProduct.id == 0) {
- // new product
- this.$store.dispatch("createProduct", this.newProduct);
- } else {
+ if (this.newProduct.id) {
// update existing
- this.$store.dispatch("updateProduct", this.newProduct);
+ const updatedProduct = this.$store.dispatch(
+ "updateProduct",
+ this.newProduct
+ );
+ if (updatedProduct) {
+ this.currentProduct = updatedProduct;
+ }
+ } else {
+ // new product
+ const newProduct = this.$store.dispatch(
+ "createProduct",
+ this.newProduct
+ );
+ if (newProduct) {
+ this.currentProduct = newProduct;
+ }
}
},
incrementQuantity(amount) {
@@ -187,21 +195,16 @@ export default {
this.newProduct.quantity += amount;
}
},
- async previewFiles(event) {
- let file = event.target.files[0];
+ changePhotoSet(event) {
+ const file = event.target.files[0];
if (!file) {
return;
}
- const fd = new FormData();
- fd.append(file.name, file);
-
- const response = await fetch("http://localhost:8000/photos", {
- method: "POST",
- body: fd
+ this.$store.dispatch("createPhotoSet", file).then(r => {
+ this.filename = file.name;
+ this.newProduct.photo_set = r[0].id;
});
-
- console.log(response);
}
}
};
diff --git a/iridescence/src/components/admin/ProductEditList.vue b/iridescence/src/components/admin/ProductEditList.vue
index 556f1c3..24a276e 100644
--- a/iridescence/src/components/admin/ProductEditList.vue
+++ b/iridescence/src/components/admin/ProductEditList.vue
@@ -6,7 +6,7 @@
v-for="product in products"
:key="product.id"
>
- <ProductEditCard v-bind:current-product="product"></ProductEditCard>
+ <ProductEditCard v-bind:parent-product="product"></ProductEditCard>
</div>
</div>
</div>