fix: direct message focus

This commit is contained in:
Vlad Stan 2023-03-08 14:28:43 +02:00
parent bfea056747
commit 9bf416072f
3 changed files with 15 additions and 1 deletions

View file

@ -22,10 +22,12 @@
<q-chat-message <q-chat-message
v-for="(dm, index) in messages" v-for="(dm, index) in messages"
:key="index" :key="index"
:name="dm.incoming ? 'customer': 'me'" :name="dm.incoming ? 'customer': 'me'"
:text="[dm.message]" :text="[dm.message]"
:sent="!dm.incoming" :sent="!dm.incoming"
:bg-color="dm.incoming ? 'white' : 'light-green-2'" :bg-color="dm.incoming ? 'white' : 'light-green-2'"
:class="'chat-mesage-index-'+index"
/> />
</div> </div>
</div> </div>

View file

@ -30,6 +30,8 @@ async function directMessages(path) {
'### this.messages', '### this.messages',
this.messages.map(m => m.message) this.messages.map(m => m.message)
) )
this.focusOnChatBox(this.messages.length - 1)
} catch (error) { } catch (error) {
LNbits.utils.notifyApiError(error) LNbits.utils.notifyApiError(error)
} }
@ -48,9 +50,18 @@ async function directMessages(path) {
this.messages = this.messages.concat([data]) this.messages = this.messages.concat([data])
console.log('### this.messages', this.messages) console.log('### this.messages', this.messages)
this.newMessage = '' this.newMessage = ''
this.focusOnChatBox(this.messages.length - 1)
} catch (error) { } catch (error) {
LNbits.utils.notifyApiError(error) LNbits.utils.notifyApiError(error)
} }
},
focusOnChatBox: function(index) {
setTimeout(() => {
const lastChatBox = document.getElementsByClassName(`chat-mesage-index-${index}`);
if (lastChatBox && lastChatBox[0]) {
lastChatBox[0].scrollIntoView()
}
}, 100)
} }
}, },
created: async function () { created: async function () {

View file

@ -166,6 +166,7 @@
margin-left: auto; margin-left: auto;
width: 100%; width: 100%;
} }
</style> </style>
<!-- todo: serve locally --> <!-- todo: serve locally -->