From 78daddbbbee1b67bbf3960e3d4d08d0757547207 Mon Sep 17 00:00:00 2001
From: "Adam T. Carpenter" <atc@53hor.net>
Date: Sat, 12 Sep 2020 17:26:25 -0400
Subject: Working product name updating; working mock Dichroism API.
---
.../src/components/admin/ProductEditCard.vue | 59 +++++++++++++++-------
.../src/components/admin/ProductEditList.vue | 2 +-
2 files changed, 41 insertions(+), 20 deletions(-)
(limited to 'iridescence/src/components')
diff --git a/iridescence/src/components/admin/ProductEditCard.vue b/iridescence/src/components/admin/ProductEditCard.vue
index db4ab77..e7fef5e 100644
--- a/iridescence/src/components/admin/ProductEditCard.vue
+++ b/iridescence/src/components/admin/ProductEditCard.vue
@@ -1,14 +1,21 @@
<template>
<div id="productEditCard">
<nav class="panel">
- <p class="panel-heading">{{ oldProduct.id }}: {{ oldProduct.name }}</p>
+ <p class="panel-heading">
+ {{ currentProduct.id }}: {{ currentProduct.name }}
+ </p>
<div class="panel-block">
- <input class="input" type="text" v-model="newProduct.name" />
+ <input
+ class="input"
+ type="text"
+ placeholder="product name"
+ v-model="newProduct.name"
+ />
</div>
<a class="panel-block">
mojs
</a>
- <div class="panel-block" v-if="productChanged">
+ <div class="panel-block" v-if="newProductChanged">
<button
class="button is-link is-outlined is-fullwidth"
@click="saveProduct"
@@ -26,32 +33,46 @@ export default {
data: function() {
return {
newProduct: {
- id: this.oldProduct.id,
- name: this.oldProduct.name,
- quantity: this.oldProduct.quantity,
- cents: this.oldProduct.cents,
- imgPath: this.oldProduct.imgPath,
- description: this.oldProduct.description,
- categories: this.oldProduct.categories
+ id: this.currentProduct.id,
+ name: this.currentProduct.name,
+ quantity: this.currentProduct.quantity,
+ cents: this.currentProduct.cents,
+ imgPath: this.currentProduct.imgPath,
+ description: this.currentProduct.description,
+ featured: this.currentProduct.featured,
+ categories: this.currentProduct.categories.slice(0)
}
};
},
props: {
- oldProduct: {
+ currentProduct: {
type: Object,
required: true
}
},
+ watch: {
+ currentProduct() {
+ this.newProduct.id = this.currentProduct.id;
+ this.newProduct.name = this.currentProduct.name;
+ this.newProduct.quantity = this.currentProduct.quantity;
+ this.newProduct.cents = this.currentProduct.cents;
+ this.newProduct.imgPath = this.currentProduct.imgPath;
+ this.newProduct.description = this.currentProduct.description;
+ this.newProduct.featured = this.currentProduct.featured;
+ this.newProduct.categories = this.currentProduct.categories.slice(0);
+ }
+ },
computed: {
- productChanged() {
+ newProductChanged() {
+ // TODO: check categories!
return (
- this.newProduct.id != this.oldProduct.id ||
- this.newProduct.name != this.oldProduct.name ||
- this.newProduct.quantity != this.oldProduct.quantity ||
- this.newProduct.cents != this.oldProduct.cents ||
- this.newProduct.imgPath != this.oldProduct.imgPath ||
- this.newProduct.description != this.oldProduct.description ||
- this.newProduct.categories != this.oldProduct.categories
+ this.newProduct.id != this.currentProduct.id ||
+ this.newProduct.name != this.currentProduct.name ||
+ this.newProduct.quantity != this.currentProduct.quantity ||
+ this.newProduct.cents != this.currentProduct.cents ||
+ this.newProduct.imgPath != this.currentProduct.imgPath ||
+ this.newProduct.description != this.currentProduct.description ||
+ this.newProduct.featured != this.currentProduct.featured
);
}
},
diff --git a/iridescence/src/components/admin/ProductEditList.vue b/iridescence/src/components/admin/ProductEditList.vue
index 46016c2..128e7bb 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:old-product="product"></ProductEditCard>
+ <ProductEditCard v-bind:current-product="product"></ProductEditCard>
</div>
</div>
</div>
--
cgit v1.2.3