lnbits-exts/nostrmarket
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

order list

Browse source
This commit is contained in:
Tiago Vasconcelos 2023-03-10 12:03:46 +00:00
parent e9f37f4a6b
commit 310cf50d5c
2 changed files with 125 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

114
static/components/chat-dialog/chat-dialog.html
View file

@ -8,8 +8,14 @@
> >
<q-card> <q-card>
<q-bar> <q-bar>
<q-icon name="chat" /> <q-btn dense flat icon="chat" label="Chat" @click="isChat = true" />
<div>Chat Box</div> <q-btn
dense
flat
icon="receipt_long"
label="Orders"
@click="isChat = false"
/>
<q-space></q-space> <q-space></q-space>
@ -17,52 +23,64 @@
<q-tooltip content-class="bg-white text-primary">Close</q-tooltip> <q-tooltip content-class="bg-white text-primary">Close</q-tooltip>
</q-btn> </q-btn>
</q-bar> </q-bar>
<div v-if="isChat">
<q-card-section <q-card-section
class="q-ml-auto" class="q-ml-auto"
style=" style="
width: 100%; width: 100%;
max-width: 720px; max-width: 720px;
height: calc(100vh - 120px); height: calc(100vh - 120px);
overflow-y: scroll; overflow-y: scroll;
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;
" "
> >
<q-chat-message <q-chat-message
:key="index" :key="index"
v-for="(message, index) in sortedMessages" v-for="(message, index) in sortedMessages"
:name="message.sender" :name="message.sender"
:text="[message.msg]" :text="[message.msg]"
:sent="message.sender == 'Me'" :sent="message.sender == 'Me'"
:bg-color="message.sender == 'Me' ? 'white' : 'light-green-2'" :bg-color="message.sender == 'Me' ? 'white' : 'light-green-2'"
:stamp="message.timestamp" :stamp="message.timestamp"
size="6" size="6"
/> />
</q-card-section> </q-card-section>
<q-card-actions> <q-card-actions>
<q-form @submit="sendMessage" class="full-width chat-input"> <q-form @submit="sendMessage" class="full-width chat-input">
<q-input <q-input
ref="newMessage" ref="newMessage"
v-model="newMessage" v-model="newMessage"
placeholder="Message" placeholder="Message"
class="full-width" class="full-width"
dense dense
outlined outlined
> >
<template> <template>
<q-btn <q-btn
round round
dense dense
flat flat
type="submit" type="submit"
icon="send" icon="send"
color="primary" color="primary"
/> />
</template> </template>
</q-input> </q-input>
</q-form> </q-form>
</q-card-actions> </q-card-actions>
</div>
<div v-else>
<q-card-section style="height: calc(100vh - 120px)">
<q-table
title="Orders"
:data="ordersList"
:columns="ordersTable.columns"
:pagination.sync="ordersTable.pagination"
row-key="id"
/>
</q-card-section>
</div>
<q-inner-loading :showing="loading"> <q-inner-loading :showing="loading">
<q-spinner-cube size="50px" color="primary" /> <q-spinner-cube size="50px" color="primary" />
</q-inner-loading> </q-inner-loading>

67
static/components/chat-dialog/chat-dialog.js
View file

@ -9,15 +9,64 @@ async function chatDialog(path) {
data: function () { data: function () {
return { return {
dialog: false, dialog: false,
isChat: false,
loading: false, loading: false,
pool: null, pool: null,
nostrMessages: [], nostrMessages: [],
newMessage: '' newMessage: '',
ordersTable: {
columns: [
{
name: 'id',
align: 'left',
label: 'ID',
field: 'id'
},
{
name: 'paid',
align: 'left',
label: 'Paid',
field: 'paid',
sortable: true
},
{
name: 'shipped',
align: 'left',
label: 'Shipped',
field: 'shipped',
sortable: true
},
{
name: 'invoice',
align: 'left',
label: 'Invoice',
field: row =>
row.payment_options &&
row.payment_options.find(p => p.type == 'ln').link
}
],
pagination: {
rowsPerPage: 10
}
}
} }
}, },
computed: { computed: {
sortedMessages() { sortedMessages() {
return this.nostrMessages.sort((a, b) => b.created_at - a.created_at) return this.nostrMessages.sort((a, b) => b.created_at - a.created_at)
},
ordersList() {
let orders = this.nostrMessages
.sort((a, b) => b.created_at - a.created_at)
.filter(o => isJson(o.msg))
.reduce((acc, cur) => {
const obj = JSON.parse(cur.msg)
const key = obj.id
const curGroup = acc[key] ?? {}
return {...acc, [key]: {...curGroup, ...obj}}
}, {})
console.log(orders)
return Object.values(orders)
} }
}, },
methods: { methods: {
@ -67,13 +116,15 @@ async function chatDialog(path) {
event.content event.content
) )
} }
messagesMap.set(event.id, { if (plaintext) {
created_at: event.created_at, messagesMap.set(event.id, {
msg: plaintext, created_at: event.created_at,
timestamp: timeFromNow(event.created_at * 1000), msg: plaintext,
sender: `${mine ? 'Me' : 'Merchant'}` timestamp: timeFromNow(event.created_at * 1000),
}) sender: `${mine ? 'Me' : 'Merchant'}`
this.nostrMessages = Array.from(messagesMap.values()) })
this.nostrMessages = Array.from(messagesMap.values())
}
} catch { } catch {
console.error('Unable to decrypt message!') console.error('Unable to decrypt message!')
} }