mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-27 07:42:27 +00:00
more fixes
This commit is contained in:
AndzejsP
parent
5b0757113d
commit
cce5d3a1a1
@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class=" bottom-0 justify-center text-center p-0 w-96">
|
||||
<div class="absolute bottom-0 w-96 justify-center text-center p-4">
|
||||
<div v-if="loading" class="flex items-center justify-center w-full">
|
||||
<div class="flex flex-row p-2 rounded-t-lg ">
|
||||
|
||||
@ -13,11 +13,11 @@
|
||||
<form>
|
||||
<label for="chat" class="sr-only">Send message</label>
|
||||
<div class="px-3 py-3 rounded-lg bg-bg-light-tone-panel dark:bg-bg-dark-tone-panel shadow-lg ">
|
||||
<!-- FILES -->
|
||||
<div class="">
|
||||
|
||||
<div class="flex flex-col gap-2">
|
||||
<!-- FILES -->
|
||||
<div v-if="fileList.length > 0" class="flex flex-col max-h-64 ">
|
||||
<TransitionGroup name="list" tag="div"
|
||||
class="flex flex-col flex-grow overflow-y-scroll mb-2 gap-1 scrollbar-thin scrollbar-track-bg-light-tone-panel scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary">
|
||||
<TransitionGroup name="list" tag="div" class="flex flex-col flex-grow overflow-y-scroll ">
|
||||
<div v-for="file in fileList" :key="file.name">
|
||||
<div class=" cursor-pointer pb-1 flex ">
|
||||
|
||||
@ -59,10 +59,11 @@
|
||||
</TransitionGroup>
|
||||
|
||||
</div>
|
||||
|
||||
<div v-if="fileList.length > 0" class="flex items-center bg-red-600">
|
||||
<!-- ADDITIONAL OPTIONS IF NEEDED -->
|
||||
</div>
|
||||
<!-- CHAT BOX -->
|
||||
<div class="flex flex-row flex-grow items-center gap-2 ">
|
||||
|
||||
|
||||
<textarea id="chat" rows="1" v-model="message"
|
||||
class="block min-h-11 no-scrollbar p-2.5 w-full text-sm text-gray-900 bg-bg-light rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-bg-dark dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
|
||||
placeholder="Send message..." @keydown.enter.exact="submitOnEnter($event)"></textarea>
|
||||
@ -142,7 +143,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
message: "",
|
||||
fileList: []
|
||||
fileList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
@ -152,6 +153,7 @@ export default {
|
||||
})
|
||||
return filesize(size)
|
||||
},
|
||||
|
||||
removeItem(file) {
|
||||
this.fileList = this.fileList.filter((item) => item != file)
|
||||
// console.log(this.fileList)
|
||||
@ -189,7 +191,11 @@ export default {
|
||||
nextTick(() => {
|
||||
feather.replace()
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
mounted() {
|
||||
nextTick(() => {
|
||||
|
||||
@ -164,11 +164,11 @@
|
||||
</div>
|
||||
|
||||
<div id="messages-list"
|
||||
class=" flex-grow overflow-y-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary"
|
||||
class=" z-0 flex flex-col flex-grow overflow-y-auto scrollbar-thin scrollbar-track-bg-light-tone scrollbar-thumb-bg-light-tone-panel hover:scrollbar-thumb-primary dark:scrollbar-track-bg-dark-tone dark:scrollbar-thumb-bg-dark-tone-panel dark:hover:scrollbar-thumb-primary active:scrollbar-thumb-secondary"
|
||||
:class="isDragOverChat ? 'pointer-events-none' : ''">
|
||||
|
||||
<!-- CHAT AREA -->
|
||||
<div class=" container pt-4 pb-10 ">
|
||||
<div class=" container pt-4 pb-10 mb-16">
|
||||
<TransitionGroup v-if="discussionArr.length > 0" name="list">
|
||||
<Message v-for="(msg, index) in discussionArr" :key="msg.id" :message="msg" :id="'msg-' + msg.id"
|
||||
ref="messages" @copy="copyToClipBoard" @delete="deleteMessage" @rankUp="rankUpMessage"
|
||||
@ -181,13 +181,15 @@
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div
|
||||
class="sticky bottom-0 container flex flex-row items-center justify-center bg-transparent p-4 pt-10 bg-gradient-to-t from-bg-light dark:from-bg-dark from-5% via-bg-light dark:via-bg-dark via-10% to-transparent to-100%">
|
||||
<ChatBox ref="chatBox" v-if="currentDiscussion.id" @messageSentEvent="sendMsg" :loading="isGenerating"
|
||||
@stopGenerating="stopGenerating" />
|
||||
</div>
|
||||
<!-- CAN ADD FOOTER PANEL HERE -->
|
||||
class="absolute w-full bottom-0 bg-transparent p-10 pt-16 bg-gradient-to-t from-bg-light dark:from-bg-dark from-5% via-bg-light dark:via-bg-dark via-10% to-transparent to-100%">
|
||||
|
||||
</div>
|
||||
<div class=" bottom-0 container flex flex-row items-center justify-center ">
|
||||
<ChatBox ref="chatBox" v-if="currentDiscussion.id" @messageSentEvent="sendMsg" :loading="isGenerating"
|
||||
@stopGenerating="stopGenerating" />
|
||||
</div>
|
||||
<!-- CAN ADD FOOTER PANEL HERE -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -295,13 +297,7 @@ export default {
|
||||
this.discussionArr = res.data.filter((item) => item.type == 0)
|
||||
|
||||
}
|
||||
// nextTick(() => {
|
||||
|
||||
// const msgList = document.getElementById('messages-list')
|
||||
|
||||
// this.scrollBottom(msgList)
|
||||
|
||||
// })
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error.message, 'load_discussion')
|
||||
@ -536,7 +532,7 @@ export default {
|
||||
}
|
||||
)
|
||||
} else {
|
||||
console.log("Error: scrollBottom")
|
||||
console.log("Error: scrollTop")
|
||||
}
|
||||
|
||||
},
|
||||
@ -591,12 +587,12 @@ export default {
|
||||
//type: msgObj.type
|
||||
}
|
||||
this.discussionArr.push(responseMessage)
|
||||
nextTick(() => {
|
||||
const msgList = document.getElementById('messages-list')
|
||||
// nextTick(() => {
|
||||
// const msgList = document.getElementById('messages-list')
|
||||
|
||||
this.scrollBottom(msgList)
|
||||
// this.scrollBottom(msgList)
|
||||
|
||||
})
|
||||
// })
|
||||
|
||||
if (this.currentDiscussion.title === '' || this.currentDiscussion.title === null) {
|
||||
if (msgObj.type == "input_message_infos") {
|
||||
@ -660,10 +656,11 @@ export default {
|
||||
if (messageItem) {
|
||||
messageItem.content = msgObj.data
|
||||
}
|
||||
nextTick(() => {
|
||||
const msgList = document.getElementById('messages-list')
|
||||
this.scrollBottom(msgList)
|
||||
})
|
||||
// // Disables as per request
|
||||
// nextTick(() => {
|
||||
// const msgList = document.getElementById('messages-list')
|
||||
// this.scrollBottom(msgList)
|
||||
// })
|
||||
}
|
||||
|
||||
},
|
||||
@ -1068,11 +1065,11 @@ export default {
|
||||
setFileListChat(files) {
|
||||
this.fileList = files
|
||||
this.$refs.chatBox.fileList = this.fileList
|
||||
//console.log('dropppp', this.fileList)
|
||||
|
||||
this.isDragOverChat = false
|
||||
},
|
||||
setDropZoneChat() {
|
||||
console.log('ssss')
|
||||
|
||||
this.isDragOverChat = true
|
||||
this.$refs.dragdropChat.show = true
|
||||
|
||||
@ -1143,8 +1140,7 @@ export default {
|
||||
const msgList = document.getElementById('messages-list')
|
||||
|
||||
this.scrollBottom(msgList)
|
||||
//this.setDropZoneChat()
|
||||
//this.setDropZoneDiscussion()
|
||||
|
||||
})
|
||||
}
|
||||
},
|
||||
|
||||
Loading…
Reference in New Issue
Block a user