mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-19 20:37:51 +00:00
enhanced
This commit is contained in:
parent
2c39a0cfc5
commit
6900bf2a47
@ -1 +1 @@
|
|||||||
Subproject commit 328b960a0de2097e13654ac752253e9541521ddd
|
Subproject commit 21245434942a8342a1e27fac2474925e8afd816a
|
@ -891,6 +891,8 @@ class LOLLMSWebUI(LOLLMSElfServer):
|
|||||||
client.discussion.current_message.finished_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
|
client.discussion.current_message.finished_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
|
||||||
client.discussion.current_message.nb_tokens = self.nb_received_tokens
|
client.discussion.current_message.nb_tokens = self.nb_received_tokens
|
||||||
mtdt = json.dumps(metadata, indent=4) if metadata is not None and type(metadata)== list else metadata
|
mtdt = json.dumps(metadata, indent=4) if metadata is not None and type(metadata)== list else metadata
|
||||||
|
|
||||||
|
|
||||||
if self.nb_received_tokens==1:
|
if self.nb_received_tokens==1:
|
||||||
client.discussion.current_message.started_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
|
client.discussion.current_message.started_generating_at=datetime.now().strftime('%Y-%m-%d %H:%M:%S')
|
||||||
|
|
||||||
@ -899,7 +901,7 @@ class LOLLMSWebUI(LOLLMSElfServer):
|
|||||||
"sender": self.personality.name,
|
"sender": self.personality.name,
|
||||||
'id':client.discussion.current_message.id,
|
'id':client.discussion.current_message.id,
|
||||||
'content': "✍ warming up ...",
|
'content': "✍ warming up ...",
|
||||||
'ui': ui,
|
'ui': client.discussion.current_message.ui if ui is None else ui,
|
||||||
'discussion_id':client.discussion.discussion_id,
|
'discussion_id':client.discussion.discussion_id,
|
||||||
'message_type': MSG_TYPE.MSG_TYPE_STEP_END.value,
|
'message_type': MSG_TYPE.MSG_TYPE_STEP_END.value,
|
||||||
'created_at':client.discussion.current_message.created_at,
|
'created_at':client.discussion.current_message.created_at,
|
||||||
@ -917,7 +919,7 @@ class LOLLMSWebUI(LOLLMSElfServer):
|
|||||||
"sender": self.personality.name,
|
"sender": self.personality.name,
|
||||||
'id':client.discussion.current_message.id,
|
'id':client.discussion.current_message.id,
|
||||||
'content': chunk,
|
'content': chunk,
|
||||||
'ui': ui,
|
'ui': client.discussion.current_message.ui if ui is None else ui,
|
||||||
'discussion_id':client.discussion.discussion_id,
|
'discussion_id':client.discussion.discussion_id,
|
||||||
'message_type': msg_type.value if msg_type is not None else MSG_TYPE.MSG_TYPE_CHUNK.value if self.nb_received_tokens>1 else MSG_TYPE.MSG_TYPE_FULL.value,
|
'message_type': msg_type.value if msg_type is not None else MSG_TYPE.MSG_TYPE_CHUNK.value if self.nb_received_tokens>1 else MSG_TYPE.MSG_TYPE_FULL.value,
|
||||||
'created_at':client.discussion.current_message.created_at,
|
'created_at':client.discussion.current_message.created_at,
|
||||||
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
4
web/dist/index.html
vendored
4
web/dist/index.html
vendored
@ -6,8 +6,8 @@
|
|||||||
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
<title>LoLLMS WebUI - Welcome</title>
|
<title>LoLLMS WebUI - Welcome</title>
|
||||||
<script type="module" crossorigin src="/assets/index-3f1ec744.js"></script>
|
<script type="module" crossorigin src="/assets/index-332e0297.js"></script>
|
||||||
<link rel="stylesheet" href="/assets/index-9ddd7a4e.css">
|
<link rel="stylesheet" href="/assets/index-49793894.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="app"></div>
|
<div id="app"></div>
|
||||||
|
@ -1,38 +1,43 @@
|
|||||||
<template>
|
<template>
|
||||||
<div :id="`ui_${componentKey}`" class="w-full h-auto 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" v-html="evaluatedCode" :key="componentKey">
|
<div class="w-full h-auto 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"
|
||||||
|
ref="ui">
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
code: {
|
ui: {
|
||||||
type: String,
|
type: String,
|
||||||
required: true,
|
required: true,
|
||||||
default: "",
|
default: "",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
evaluatedCode: '', // Store the evaluated code
|
|
||||||
componentKey: 0,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
watch: {
|
||||||
code: {
|
ui(newVal, oldVal) {
|
||||||
handler(newCode) {
|
console.log(`ui changed from ${oldVal} to ${newVal}`);
|
||||||
console.log("Code changed");
|
// Add your custom logic here
|
||||||
this.evaluateScriptTags(newCode);
|
this.$nextTick(() => {
|
||||||
this.componentKey++;
|
this.evaluateScriptTags();
|
||||||
},
|
});
|
||||||
immediate: true, // Trigger the handler immediately when the component is mounted
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.evaluateScriptTags();
|
||||||
|
});
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
evaluateScriptTags(code) {
|
evaluateScriptTags() {
|
||||||
|
console.log("evaluateScriptTags")
|
||||||
// Create a temporary div element to execute scripts
|
// Create a temporary div element to execute scripts
|
||||||
const tempDiv = document.createElement('div');
|
const tempDiv = document.createElement('div');
|
||||||
tempDiv.innerHTML = code;
|
tempDiv.innerHTML = this.ui;
|
||||||
|
|
||||||
// Get all script elements within the div
|
// Get all script elements within the div
|
||||||
const scriptElements = tempDiv.querySelectorAll('script');
|
const scriptElements = tempDiv.querySelectorAll('script');
|
||||||
@ -45,13 +50,10 @@ export default {
|
|||||||
document.body.removeChild(newScript);
|
document.body.removeChild(newScript);
|
||||||
});
|
});
|
||||||
|
|
||||||
// Set the evaluated code to the modified HTML
|
// Set the evaluated ui to the modified HTML
|
||||||
this.evaluatedCode = tempDiv.innerHTML;
|
this.$refs.ui.innerHTML = tempDiv.innerHTML;
|
||||||
|
console.log("this.$refs.ui.innerHTML")
|
||||||
// Force a re-render by updating the component key
|
console.log(this.$refs.ui.innerHTML)
|
||||||
this.$nextTick(() => {
|
|
||||||
this.componentKey++;
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
@ -213,8 +213,10 @@
|
|||||||
<JsonViewer :jsonFormText="metadata.title" :jsonData="metadata.content" />
|
<JsonViewer :jsonFormText="metadata.title" :jsonData="metadata.content" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="message.ui !== null">
|
||||||
<DynamicUIRenderer class="w-full" :key="'ui-' + ui_componentKey" :code="message.ui"></DynamicUIRenderer>
|
<DynamicUIRenderer ref="ui" class="w-full" :ui="message.ui"></DynamicUIRenderer>
|
||||||
|
</div>
|
||||||
|
|
||||||
<audio controls v-if="audio_url!=null" :key="audio_url">
|
<audio controls v-if="audio_url!=null" :key="audio_url">
|
||||||
<source :src="audio_url" type="audio/wav" ref="audio_player" >
|
<source :src="audio_url" type="audio/wav" ref="audio_player" >
|
||||||
Your browser does not support the audio element.
|
Your browser does not support the audio element.
|
||||||
|
@ -570,15 +570,11 @@ export default {
|
|||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
extractHtml() {
|
extractHtml() {
|
||||||
console.log("Extracting html")
|
|
||||||
if (this.discussionArr.length > 0) {
|
if (this.discussionArr.length > 0) {
|
||||||
const lastMessage = this.discussionArr[this.discussionArr.length - 1].content;
|
const lastMessage = this.discussionArr[this.discussionArr.length - 1].content;
|
||||||
const startTag = '```html';
|
const startTag = '```html';
|
||||||
const endTag = '```';
|
const endTag = '```';
|
||||||
console.log("lastMessage")
|
|
||||||
console.log(lastMessage)
|
|
||||||
let startIndex = lastMessage.indexOf(startTag);
|
let startIndex = lastMessage.indexOf(startTag);
|
||||||
console.log(startIndex)
|
|
||||||
if (startIndex === -1) {
|
if (startIndex === -1) {
|
||||||
this.lastMessageHtml = this.defaultMessageHtml;
|
this.lastMessageHtml = this.defaultMessageHtml;
|
||||||
this.renderIsolatedContent();
|
this.renderIsolatedContent();
|
||||||
@ -587,7 +583,6 @@ export default {
|
|||||||
|
|
||||||
startIndex += startTag.length;
|
startIndex += startTag.length;
|
||||||
let endIndex = lastMessage.indexOf(endTag, startIndex);
|
let endIndex = lastMessage.indexOf(endTag, startIndex);
|
||||||
console.log(endIndex)
|
|
||||||
|
|
||||||
if (endIndex === -1) {
|
if (endIndex === -1) {
|
||||||
this.lastMessageHtml = lastMessage.slice(startIndex).trim();
|
this.lastMessageHtml = lastMessage.slice(startIndex).trim();
|
||||||
@ -597,8 +592,6 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.lastMessageHtml = this.defaultMessageHtml;
|
this.lastMessageHtml = this.defaultMessageHtml;
|
||||||
}
|
}
|
||||||
console.log("this.lastMessageHtml")
|
|
||||||
console.log(this.lastMessageHtml)
|
|
||||||
this.renderIsolatedContent()
|
this.renderIsolatedContent()
|
||||||
},
|
},
|
||||||
renderIsolatedContent() {
|
renderIsolatedContent() {
|
||||||
@ -606,8 +599,6 @@ export default {
|
|||||||
iframe.style.border = 'none';
|
iframe.style.border = 'none';
|
||||||
iframe.style.width = '100%';
|
iframe.style.width = '100%';
|
||||||
iframe.style.height = '100%'; // Adjust as needed
|
iframe.style.height = '100%'; // Adjust as needed
|
||||||
console.log("this.$refs.isolatedContent")
|
|
||||||
console.log(this.$refs.isolatedContent)
|
|
||||||
if (this.$refs.isolatedContent){
|
if (this.$refs.isolatedContent){
|
||||||
this.$refs.isolatedContent.innerHTML = '';
|
this.$refs.isolatedContent.innerHTML = '';
|
||||||
this.$refs.isolatedContent.appendChild(iframe);
|
this.$refs.isolatedContent.appendChild(iframe);
|
||||||
@ -1556,8 +1547,7 @@ export default {
|
|||||||
messageItem.metadata = msgObj.metadata
|
messageItem.metadata = msgObj.metadata
|
||||||
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_UI) {
|
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_UI) {
|
||||||
console.log("UI message")
|
console.log("UI message")
|
||||||
messageItem.ui = msgObj.ui
|
messageItem.ui = msgObj.ui
|
||||||
console.log(messageItem.ui)
|
|
||||||
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_EXCEPTION) {
|
} else if (msgObj.message_type == this.msgTypes.MSG_TYPE_EXCEPTION) {
|
||||||
this.$store.state.toast.showToast(msgObj.content, 5, false)
|
this.$store.state.toast.showToast(msgObj.content, 5, false)
|
||||||
}
|
}
|
||||||
|
@ -2828,7 +2828,27 @@
|
|||||||
<i data-feather="help-circle" class="w-5 h-5 "></i>
|
<i data-feather="help-circle" class="w-5 h-5 "></i>
|
||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td style="min-width: 200px;">
|
||||||
|
<label for="comfyui_model" class="text-sm font-bold" style="margin-right: 1rem;">Available models (only if local):</label>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<div class="flex flex-row">
|
||||||
|
<select
|
||||||
|
id="comfyui_model"
|
||||||
|
required
|
||||||
|
v-model="configFile.comfyui_model"
|
||||||
|
@change="settingsChanged=true"
|
||||||
|
class="w-full mt-1 px-2 py-1 border border-gray-300 rounded dark:bg-gray-600"
|
||||||
|
>
|
||||||
|
<option v-for="(comfyui_model, index) in comfyui_models" :key="comfyui_model" :value="comfyui_model">
|
||||||
|
{{ comfyui_model }}
|
||||||
|
</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
<tr>
|
<tr>
|
||||||
<td style="min-width: 200px;">
|
<td style="min-width: 200px;">
|
||||||
<label for="comfyui_model" class="text-sm font-bold" style="margin-right: 1rem;">Enable comfyui model:</label>
|
<label for="comfyui_model" class="text-sm font-bold" style="margin-right: 1rem;">Enable comfyui model:</label>
|
||||||
@ -4102,6 +4122,8 @@ export default {
|
|||||||
{ label: 'Sort by Maker', value: 3 },
|
{ label: 'Sort by Maker', value: 3 },
|
||||||
{ label: 'Sort by Quantizer', value: 4 },
|
{ label: 'Sort by Quantizer', value: 4 },
|
||||||
],
|
],
|
||||||
|
// Comfyui models
|
||||||
|
comfyui_models:[],
|
||||||
show_only_installed_models:false,
|
show_only_installed_models:false,
|
||||||
// Local model reference path
|
// Local model reference path
|
||||||
reference_path:"",
|
reference_path:"",
|
||||||
@ -6144,6 +6166,18 @@ export default {
|
|||||||
console.log("Couldin't list output devices")
|
console.log("Couldin't list output devices")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
try{
|
||||||
|
console.log("Getting comfyui models")
|
||||||
|
const res = await axios.get("/list_comfyui_models")
|
||||||
|
console.log("res is ",res)
|
||||||
|
if(res.data.status){
|
||||||
|
this.comfyui_models= res.data.models
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
catch{
|
||||||
|
console.log("Couldin't list output devices")
|
||||||
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
activated() {
|
activated() {
|
||||||
|
@ -1 +1 @@
|
|||||||
Subproject commit 784d8463363a608844c28d872b0a56d3fb1743f7
|
Subproject commit d9a98a2b7d8fd3ce473fc5a68383eb7b13e3b598
|
Loading…
Reference in New Issue
Block a user