feat: basic orders
This commit is contained in:
parent
aed65dd65e
commit
bce0b342d0
4 changed files with 106 additions and 37 deletions
|
|
@ -1,10 +1,12 @@
|
|||
<div>
|
||||
<q-card v-if="!orders?.length" bordered class="q-mb-md">
|
||||
<q-card v-if="!merchantOrders?.length" bordered class="q-mb-md">
|
||||
<q-card-section>
|
||||
<strong>No products in cart!</strong>
|
||||
</q-card-section>
|
||||
</q-card>
|
||||
<div v-for="merchant in orders">
|
||||
<div v-for="merchant in merchantOrders">
|
||||
|
||||
|
||||
|
||||
<q-card bordered class="q-mb-md">
|
||||
<q-item>
|
||||
|
|
@ -19,7 +21,7 @@
|
|||
<q-item-label>
|
||||
<strong>
|
||||
<!-- <span v-text="cart.products[0]?.stallName"></span> -->
|
||||
Todo: stall name
|
||||
Todo: merchant name
|
||||
</strong>
|
||||
</q-item-label>
|
||||
<q-item-label caption>
|
||||
|
|
@ -37,26 +39,37 @@
|
|||
|
||||
<q-card-section class="col-12">
|
||||
<q-list class="q-mt-md">
|
||||
<q-item v-for="order in merchant.orders" :key="order.id">
|
||||
<div v-for="order in merchant.orders" :key="order.id" class="q-mb-md">
|
||||
<q-expansion-item>
|
||||
|
||||
<template v-slot:header>
|
||||
<q-item-section class="q-mt-sm">
|
||||
<q-item-label><strong> <span v-text="stallNameForOrder(order)"></span> </strong></q-item-label>
|
||||
<q-item-label>
|
||||
<div class="text-caption text-grey ellipsis-2-lines">
|
||||
<p>xxxx</p>
|
||||
</div>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section side>
|
||||
<div>
|
||||
<q-badge :color="order.paid ? 'green' : 'gray'"><span
|
||||
v-text="order.paid ? 'Paid' : 'Not Paid'"></span></q-badge>
|
||||
<q-badge :color="order.shipped ? 'green' : 'gray'"><span
|
||||
v-text="order.paid ? 'Shipped' : 'Not Shipped'"></span></q-badge>
|
||||
</div>
|
||||
</q-item-section>
|
||||
</template>
|
||||
<q-card-section class="q-pa-none">
|
||||
<q-separator></q-separator>
|
||||
xxxx
|
||||
</q-card-section>
|
||||
|
||||
|
||||
<q-item-section class="q-mt-sm">
|
||||
<q-item-label>products</q-item-label>
|
||||
<q-item-label>
|
||||
<div class="text-caption text-grey ellipsis-2-lines">
|
||||
<p>xxxx</p>
|
||||
</div>
|
||||
</q-item-label>
|
||||
</q-item-section>
|
||||
|
||||
<q-item-section side>
|
||||
<div>
|
||||
<q-btn flat dense round icon="delete" />
|
||||
</div>
|
||||
</q-item-section>
|
||||
|
||||
</q-item>
|
||||
|
||||
</q-expansion-item>
|
||||
<q-separator></q-separator>
|
||||
</div>
|
||||
</q-list>
|
||||
</q-card-section>
|
||||
</q-card-section>
|
||||
|
|
|
|||
|
|
@ -5,16 +5,32 @@ async function customerOrders(path) {
|
|||
name: 'orders',
|
||||
template,
|
||||
|
||||
props: ['orders'],
|
||||
props: ['orders', 'products', 'stalls'],
|
||||
data: function () {
|
||||
return {}
|
||||
},
|
||||
computed: {},
|
||||
computed: {
|
||||
merchantOrders: function () {
|
||||
return Object.keys(this.orders).map(pubkey => ({ pubkey, orders: this.orders[pubkey] }))
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
stallNameForOrder: function (order) {
|
||||
console.log('### stallNameForOrder', order)
|
||||
const productId = order.items[0]?.product_id
|
||||
if (!productId) return 'Stall Name'
|
||||
const product = this.products.find(p => p.id === productId)
|
||||
if (!product) return 'Stall Name'
|
||||
const stall = this.stalls.find(s => s.id === product.stall_id)
|
||||
if (!stall) return 'Stall Name'
|
||||
return stall.name
|
||||
}
|
||||
|
||||
},
|
||||
created() {
|
||||
console.log('### orders', this.orders)
|
||||
console.log('### products', this.products)
|
||||
console.log('### stall', this.stalls)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -76,6 +76,8 @@ const market = async () => {
|
|||
events: [],
|
||||
stalls: [],
|
||||
products: [],
|
||||
orders: {},
|
||||
|
||||
profiles: new Map(),
|
||||
searchText: null,
|
||||
inputPubkey: null,
|
||||
|
|
@ -102,14 +104,38 @@ const market = async () => {
|
|||
}
|
||||
},
|
||||
computed: {
|
||||
allOrders() {
|
||||
const prefix = 'nostrmarket.orders.'
|
||||
const orderKeys = this.$q.localStorage.getAllKeys().filter(k => k.startsWith(prefix))
|
||||
// allOrders() {
|
||||
// console.log('### allOrders compute')
|
||||
// const prefix = 'nostrmarket.orders.'
|
||||
|
||||
return orderKeys.map((key) => ({
|
||||
pubkey: key.substring(prefix.length),
|
||||
orders: this.$q.localStorage.getItem(key)
|
||||
}), {})
|
||||
// return Object.keys(this.orders).map((key) => ({
|
||||
// pubkey: key.substring(prefix.length),
|
||||
// orders: this.orders[key]
|
||||
// }), {})
|
||||
// },
|
||||
orderedProducts: function () {
|
||||
const allItems = Object.keys(this.orders)
|
||||
.map(pubkey => this.orders[pubkey]
|
||||
.map(o => o.items)
|
||||
.flat()
|
||||
.map(i => i.product_id)
|
||||
.flat())
|
||||
.flat()
|
||||
const uniqueProductIds = [...new Set(allItems)];
|
||||
return this.products.filter(p => uniqueProductIds.indexOf(p.id) !== -1)
|
||||
},
|
||||
orderedStalls: function () {
|
||||
const allItems = Object.keys(this.orders)
|
||||
.map(pubkey => this.orders[pubkey]
|
||||
.map(o => o.items)
|
||||
.flat()
|
||||
.map(i => i.product_id)
|
||||
.flat())
|
||||
.flat()
|
||||
const uniqueProductIds = [...new Set(allItems)];
|
||||
const uniqueStallIds = this.products.filter(p => uniqueProductIds.indexOf(p.id) !== -1).map(p => p.stall_id)
|
||||
|
||||
return this.stalls.filter(s => uniqueStallIds.indexOf(s.id) !== -1)
|
||||
},
|
||||
filterProducts() {
|
||||
let products = this.products
|
||||
|
|
@ -160,6 +186,14 @@ const market = async () => {
|
|||
|
||||
this.account = this.$q.localStorage.getItem('nostrmarket.account') || null
|
||||
|
||||
const prefix = 'nostrmarket.orders.'
|
||||
const orderKeys = this.$q.localStorage.getAllKeys().filter(k => k.startsWith(prefix))
|
||||
orderKeys.forEach(k => {
|
||||
const pubkey = k.substring(prefix.length)
|
||||
this.orders[pubkey] = this.$q.localStorage.getItem(k)
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
//console.log("UUID", crypto.randomUUID())
|
||||
|
|
@ -405,6 +439,7 @@ const market = async () => {
|
|||
return obj
|
||||
})
|
||||
.filter(f => f)
|
||||
console.log('### products', this.products)
|
||||
},
|
||||
async initNostr() {
|
||||
this.$q.loading.show()
|
||||
|
|
@ -796,10 +831,11 @@ const market = async () => {
|
|||
|
||||
persistOrderUpdate(pubkey, orderUpdate) {
|
||||
console.log('### persistOrderUpdate', pubkey, orderUpdate)
|
||||
const orders = this.$q.localStorage.getItem(`nostrmarket.orders.${pubkey}`) || []
|
||||
let orders = this.$q.localStorage.getItem(`nostrmarket.orders.${pubkey}`) || []
|
||||
let order = orders.find(o => o.id === orderUpdate.id)
|
||||
if (!order) {
|
||||
orders.push({ ...orderUpdate, messages: orderUpdate.message ? [orderUpdate.message] : [] })
|
||||
orders.unshift({ ...orderUpdate, messages: orderUpdate.message ? [orderUpdate.message] : [] })
|
||||
this.orders[pubkey] = orders
|
||||
this.$q.localStorage.set(`nostrmarket.orders.${pubkey}`, orders)
|
||||
return
|
||||
}
|
||||
|
|
@ -815,7 +851,10 @@ const market = async () => {
|
|||
order.shipped = orderUpdate.shipped
|
||||
}
|
||||
|
||||
this.$q.localStorage.set(`nostrmarket.orders.${pubkey}`, [order].concat(orders.filter(o => o.id !== order.id)))
|
||||
|
||||
orders = [order].concat(orders.filter(o => o.id !== order.id))
|
||||
this.orders[pubkey] = orders
|
||||
this.$q.localStorage.set(`nostrmarket.orders.${pubkey}`, orders)
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -218,7 +218,8 @@
|
|||
<shopping-cart-checkout v-else-if="activePage === 'shopping-cart-checkout'" :cart="checkoutCart"
|
||||
:stall="checkoutStall" :customer-pubkey="account?.pubkey" @login-required="openAccountDialog"
|
||||
@place-order="placeOrder"></shopping-cart-checkout>
|
||||
<customer-orders v-else-if="activePage === 'customer-orders'" :orders="allOrders"></customer-orders>
|
||||
<customer-orders v-else-if="activePage === 'customer-orders'" :orders="orders" :products="products"
|
||||
:stalls="stalls"></customer-orders>
|
||||
<customer-stall v-else-if=" !isLoading && activeStall" :stall="stalls.find(stall => stall.id == activeStall)"
|
||||
:products="filterProducts" :stall-products="products.filter(p => p.stall_id == activeStall)"
|
||||
:product-detail="activeProduct" :relays="relays" :account="account" :pool="pool" :styles="config?.opts ?? {}"
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue