feat: show orders per stall
This commit is contained in:
parent
b446629707
commit
40c25ad085
10 changed files with 255 additions and 29 deletions
|
|
@ -1,3 +1,44 @@
|
|||
<div>
|
||||
xx1
|
||||
</div>
|
||||
<q-table
|
||||
flat
|
||||
dense
|
||||
:data="orders"
|
||||
row-key="id"
|
||||
:columns="ordersTable.columns"
|
||||
:pagination.sync="ordersTable.pagination"
|
||||
:filter="filter"
|
||||
>
|
||||
<template v-slot:body="props">
|
||||
<q-tr :props="props">
|
||||
<q-td auto-width>
|
||||
<q-btn
|
||||
size="sm"
|
||||
color="accent"
|
||||
round
|
||||
dense
|
||||
@click="props.row.expanded= !props.row.expanded"
|
||||
:icon="props.row.expanded? 'remove' : 'add'"
|
||||
/>
|
||||
</q-td>
|
||||
|
||||
<q-td key="id" :props="props"> {{toShortId(props.row.id)}} </q-td>
|
||||
<q-td key="total" :props="props"> {{props.row.total}} </q-td>
|
||||
|
||||
<q-td key="paid" :props="props"> {{props.row.paid}} </q-td>
|
||||
<q-td key="shipped" :props="props"> {{props.row.shipped}} </q-td>
|
||||
|
||||
<q-td key="pubkey" :props="props">
|
||||
{{toShortId(props.row.pubkey)}}
|
||||
</q-td>
|
||||
<q-td key="time" :props="props"> {{formatDate(props.row.time)}} </q-td>
|
||||
</q-tr>
|
||||
<q-tr v-if="props.row.expanded" :props="props">
|
||||
<q-td colspan="100%">
|
||||
<div class="row items-center q-mb-lg">
|
||||
<div class="col-12"></div>
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,18 +1,95 @@
|
|||
async function orderList(path) {
|
||||
const template = await loadTemplateAsync(path)
|
||||
Vue.component('order-list', {
|
||||
name: 'order-list',
|
||||
props: ['adminkey', 'inkey'],
|
||||
template,
|
||||
|
||||
data: function () {
|
||||
return {
|
||||
const template = await loadTemplateAsync(path)
|
||||
Vue.component('order-list', {
|
||||
name: 'order-list',
|
||||
props: ['stall-id', 'adminkey', 'inkey'],
|
||||
template,
|
||||
|
||||
data: function () {
|
||||
return {
|
||||
orders: [],
|
||||
|
||||
filter: '',
|
||||
ordersTable: {
|
||||
columns: [
|
||||
{
|
||||
name: '',
|
||||
align: 'left',
|
||||
label: '',
|
||||
field: ''
|
||||
},
|
||||
{
|
||||
name: 'id',
|
||||
align: 'left',
|
||||
label: 'ID',
|
||||
field: 'id'
|
||||
},
|
||||
{
|
||||
name: 'total',
|
||||
align: 'left',
|
||||
label: 'Total',
|
||||
field: 'total'
|
||||
},
|
||||
{
|
||||
name: 'paid',
|
||||
align: 'left',
|
||||
label: 'Paid',
|
||||
field: 'paid'
|
||||
},
|
||||
{
|
||||
name: 'shipped',
|
||||
align: 'left',
|
||||
label: 'Shipped',
|
||||
field: 'shipped'
|
||||
},
|
||||
{
|
||||
name: 'pubkey',
|
||||
align: 'left',
|
||||
label: 'Customer',
|
||||
field: 'pubkey'
|
||||
},
|
||||
{
|
||||
name: 'time',
|
||||
align: 'left',
|
||||
label: 'Date',
|
||||
field: 'time'
|
||||
}
|
||||
],
|
||||
pagination: {
|
||||
rowsPerPage: 10
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
},
|
||||
created: async function () {
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
toShortId: function (value) {
|
||||
return value.substring(0, 5) + '...' + value.substring(value.length - 5)
|
||||
},
|
||||
formatDate: function (value) {
|
||||
return Quasar.utils.date.formatDate(
|
||||
new Date(value * 1000),
|
||||
'YYYY-MM-DD HH:mm'
|
||||
)
|
||||
},
|
||||
getOrders: async function () {
|
||||
try {
|
||||
const ordersPath = this.stallId
|
||||
? `/stall/order/${this.stallId}`
|
||||
: '/order'
|
||||
const {data} = await LNbits.api.request(
|
||||
'GET',
|
||||
'/nostrmarket/api/v1' + ordersPath,
|
||||
this.inkey
|
||||
)
|
||||
this.orders = data.map(s => ({...s, expanded: false}))
|
||||
console.log('### this.orders', this.orders)
|
||||
} catch (error) {
|
||||
LNbits.utils.notifyApiError(error)
|
||||
}
|
||||
}
|
||||
},
|
||||
created: async function () {
|
||||
await this.getOrders()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -187,10 +187,10 @@
|
|||
<q-tab-panel name="orders">
|
||||
<div v-if="stall">
|
||||
<order-list
|
||||
:adminkey="adminkey"
|
||||
:inkey="inkey"
|
||||
:wallet-options="walletOptions"
|
||||
></order-list>
|
||||
:adminkey="adminkey"
|
||||
:inkey="inkey"
|
||||
:stall-id="stallId"
|
||||
></order-list>
|
||||
</div>
|
||||
</q-tab-panel>
|
||||
</q-tab-panels>
|
||||
|
|
|
|||
|
|
@ -50,7 +50,7 @@
|
|||
{{props.row.name}}</a
|
||||
>
|
||||
</q-td>
|
||||
|
||||
<q-td key="currency" :props="props"> {{props.row.currency}} </q-td>
|
||||
<q-td key="description" :props="props">
|
||||
{{props.row.config.description}}
|
||||
</q-td>
|
||||
|
|
|
|||
|
|
@ -35,6 +35,12 @@ async function stallList(path) {
|
|||
label: 'Name',
|
||||
field: 'id'
|
||||
},
|
||||
{
|
||||
name: 'currency',
|
||||
align: 'left',
|
||||
label: 'Currency',
|
||||
field: 'currency'
|
||||
},
|
||||
{
|
||||
name: 'description',
|
||||
align: 'left',
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue