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

feat: improve DMs for structured messages

Browse source
This commit is contained in:
Vlad Stan 2023-07-03 17:17:08 +03:00
parent 2b84ebc83b
commit 13b19b672e
2 changed files with 60 additions and 71 deletions
Download patch file Download diff file Expand all files Collapse all files

112
static/components/direct-messages/direct-messages.html
View file

@ -6,19 +6,11 @@
<h6 class="text-subtitle1 q-my-none">Messages</h6>
</div>
<div class="col-4">
<q-badge v-if="unreadMessages" color="green"
><span v-text="unreadMessages"></span>&nbsp; new</q-badge
>
<q-badge v-if="unreadMessages" color="green"><span v-text="unreadMessages"></span>&nbsp; new</q-badge>
</div>
<div class="col-6">
<q-btn
v-if="activePublicKey"
@click="showClientOrders"
unelevated
outline
class="float-right"
>Client Orders</q-btn
>
<q-btn v-if="activePublicKey" @click="showClientOrders" unelevated outline class="float-right">Client
Orders</q-btn>
</div>
</div>
</q-card-section>
@ -28,26 +20,17 @@
<q-card-section>
<div class="row">
<div class="col-10">
<q-select
v-model="activePublicKey"
:options="customers.map(c => ({label: buildCustomerLabel(c), value: c.public_key}))"
label="Select Customer"
emit-value
@input="selectActiveCustomer()"
>
</q-select>
<q-select v-model="activePublicKey"
:options="customers.map(c => ({label: buildCustomerLabel(c), value: c.public_key}))" label="Select Customer"
emit-value @input="selectActiveCustomer()">
</q-select>
</div>
<div class="col-2">
<q-btn
label="Add"
color="green"
class="float-right q-mt-md"
@click="showAddPublicKey = true"
>
<q-tooltip>
Add a public key to chat with
</q-tooltip>
</q-btn>
<q-btn label="Add" color="green" class="float-right q-mt-md" @click="showAddPublicKey = true">
<q-tooltip>
Add a public key to chat with
</q-tooltip>
</q-btn>
</div>
</div>
@ -56,36 +39,36 @@
<div class="chat-container" ref="chatCard">
<div class="chat-box">
<div class="chat-messages" style="height: 45vh">
<q-chat-message
v-for="(dm, index) in messages"
:key="index"
:name="dm.incoming ? 'customer': 'me'"
:text="[dm.message]"
:sent="!dm.incoming"
:bg-color="dm.incoming ? 'white' : 'light-green-2'"
:class="'chat-mesage-index-'+index"
/>
<q-chat-message v-for="(dm, index) in messagesAsJson" :key="index" :name="dm.incoming ? 'customer': 'me'"
:text="dm.isJson ? [] : [dm.message]" :sent="!dm.incoming"
:bg-color="dm.incoming ? 'white' : 'light-green-2'" :class="'chat-mesage-index-'+index">
<div v-if="dm.isJson">
<div v-if="dm.message.type === 0">
<strong>New order:</strong>
<span v-text="dm.message.id"></span>
</div>
<div v-else-if="dm.message.type === 1">
<strong>Invoice sent for order: </strong>
<span v-text="dm.message.id"></span>
</div>
<div v-else-if="dm.message.type === 2">
<q-badge v-if="dm.message.paid" color="green">Paid </q-badge>
<q-badge v-if="dm.message.shipped" color="green">Shipped </q-badge>
<span v-text="dm.message.message"></span><br>
<span v-text="dm.message.id"></span>
</div>
<div v-else>
<span v-text="JSON.stringify(dm.message)"></span>
</div>
</div>
</q-chat-message>
</div>
</div>
<q-card-section>
<q-form @submit="sendDirectMesage" class="full-width chat-input">
<q-input
ref="newMessage"
v-model="newMessage"
placeholder="Message"
class="full-width"
dense
outlined
>
<q-input ref="newMessage" v-model="newMessage" placeholder="Message" class="full-width" dense outlined>
<template>
<q-btn
round
dense
flat
type="submit"
icon="send"
color="primary"
/>
<q-btn round dense flat type="submit" icon="send" color="primary" />
</template>
</q-input>
</q-form>
@ -97,26 +80,13 @@
<q-dialog v-model="showAddPublicKey" position="top">
<q-card class="q-pa-lg q-pt-xl" style="width: 500px">
<q-form @submit="addPublicKey" class="q-gutter-md">
<q-input
filled
dense
v-model.trim="newPublicKey"
label="Public Key (hex or nsec)"
></q-input>
<q-input filled dense v-model.trim="newPublicKey" label="Public Key (hex or nsec)"></q-input>
<div class="row q-mt-lg">
<q-btn
unelevated
color="primary"
:disable="!newPublicKey"
type="submit"
>Add</q-btn
>
<q-btn v-close-popup flat color="grey" class="q-ml-auto"
>Cancel</q-btn
>
<q-btn unelevated color="primary" :disable="!newPublicKey" type="submit">Add</q-btn>
<q-btn v-close-popup flat color="grey" class="q-ml-auto">Cancel</q-btn>
</div>
</q-form>
</q-card>
</q-dialog>
</div>
</div>
</div>