ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2025-04-17 23:46:03 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

added message data

Browse Source
This commit is contained in:
AndzejsP 2023-06-15 17:45:26 +03:00
parent 56d5b9cdfd
commit f78ea416ba
1 changed files with 73 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
web/src/components/Message.vue
View File

@ -11,13 +11,19 @@
<div class="flex flex-col w-full flex-grow-0 ">
<div class="flex flex-row flex-grow items-start ">
<!-- SENDER NAME -->
<div class="flex ">
<p class="drop-shadow-sm text-lg text-opacity-95 font-bold grow ">{{ message.sender }}</p>
<button @click="toggleModel" class="expand-button">{{ expanded ? ' - ' : ' + ' }}</button>
<div class="flex flex-col mb-2">
<div class="drop-shadow-sm text-lg text-opacity-95 font-bold grow ">{{ message.sender }}
<!-- <button @click="toggleModel" class="expand-button">{{ expanded ? ' - ' : ' + ' }}</button>
<p v-if="expanded" class="drop-shadow-sm text-lg text-opacity-95 font-bold grow">
{{ message.model }}
</p>
</div>
</p> -->
</div>
<div class="text-sm text-gray-400 font-thin" v-if="message.created_at">
{{ created_at }}
</div>
</div>
<div class="flex-grow ">
</div>
@ -84,16 +90,24 @@
</div>
</div>
<div class="overflow-x-auto w-full " >
<div class="overflow-x-auto w-full ">
<!-- MESSAGE CONTENT -->
<MarkdownRenderer ref="mdRender" v-if="!editMsgMode" :markdown-text="message.content" >
<MarkdownRenderer ref="mdRender" v-if="!editMsgMode" :markdown-text="message.content">
</MarkdownRenderer>
<textarea v-if="editMsgMode" ref="mdTextarea" :rows="4"
class="block p-2.5 w-full text-sm text-gray-900 bg-gray-50 rounded-lg border border-gray-300 focus:ring-blue-500 focus:border-blue-500 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
:style="{ minHeight: mdRenderHeight + `px` }" placeholder="Enter message here..."
v-model="new_message_content"></textarea>
</div>
<!-- FOOTER -->
<div class="text-sm text-gray-400 mt-2">
<div class="flex flex-row items-center gap-2">
<p v-if="message.binding">Binding: <span class="font-semibold">{{ message.binding }}</span></p>
<p v-if="message.model">Model: <span class="font-semibold">{{ message.model }}</span></p>
<p v-if="message.seed">Seed: <span class="font-semibold">{{ message.seed }}</span></p>
</div>
</div>
</div>
@ -104,14 +118,15 @@
</div>
</template>
<style>
.expand-button {
margin-left: 10px; /* Add space between sender and expand button */
margin-right: 10px; /* Add space between sender and expand button */
background: none;
border: none;
padding: 0;
cursor: pointer;
margin-left: 10px;
/* Add space between sender and expand button */
margin-right: 10px;
/* Add space between sender and expand button */
background: none;
border: none;
padding: 0;
cursor: pointer;
}
</style>
<script>
@ -201,6 +216,47 @@ export default {
defaultImg(event) {
event.target.src = botImgPlaceholder
},
parseDate(tdate) {
let system_date = new Date(Date.parse(tdate));
let user_date = new Date();
let diff = Math.floor((user_date - system_date) / 1000);
if (diff <= 1) {
return "just now";
}
if (diff < 20) {
return diff + " seconds ago";
}
if (diff < 40) {
return "half a minute ago";
}
if (diff < 60) {
return "less than a minute ago";
}
if (diff <= 90) {
return "one minute ago";
}
if (diff <= 3540) {
return Math.round(diff / 60) + " minutes ago";
}
if (diff <= 5400) {
return "1 hour ago";
}
if (diff <= 86400) {
return Math.round(diff / 3600) + " hours ago";
}
if (diff <= 129600) {
return "1 day ago";
}
if (diff < 604800) {
return Math.round(diff / 86400) + " days ago";
}
if (diff <= 777600) {
return "1 week ago";
}
return tdate;
}
}, watch: {
showConfirmation() {
@ -230,7 +286,10 @@ export default {
},
computed: {
created_at() {
return this.parseDate(this.message.created_at)
}
}