mirror of
https://github.com/ParisNeo/lollms-webui.git
synced 2024-12-19 20:37:51 +00:00
upgraded ui
This commit is contained in:
Saifeddine ALOUI
parent
1d319c9c7c
commit
7401c201b0
@ -1,5 +1,5 @@
|
||||
# =================== Lord Of Large Language Multimodal Systems Configuration file ===========================
|
||||
version: 131
|
||||
version: 132
|
||||
binding_name: null
|
||||
model_name: null
|
||||
model_variant: null
|
||||
@ -233,6 +233,7 @@ activate_mistralai_emulator: true
|
||||
use_smart_routing: false
|
||||
smart_routing_router_model : ""
|
||||
smart_routing_models_by_power : []
|
||||
restore_model_after_smart_routing : false
|
||||
|
||||
|
||||
# elastic search service
|
||||
|
||||
@ -1 +1 @@
|
||||
Subproject commit 53edc1e8ceb20b565267feefb6f626bd6748ade7
|
||||
Subproject commit 3ddec9895d34cd66e25b09cdb15cd03e651c6a22
|
||||
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 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"></script>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>LoLLMS WebUI</title>
|
||||
<script type="module" crossorigin src="/assets/index-24edfee9.js"></script>
|
||||
<link rel="stylesheet" href="/assets/index-dc10c3a5.css">
|
||||
<script type="module" crossorigin src="/assets/index-484e4067.js"></script>
|
||||
<link rel="stylesheet" href="/assets/index-b52b9629.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
@ -1,115 +1,138 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="flex mb-2">
|
||||
<input
|
||||
type="text"
|
||||
v-model="newItem"
|
||||
:placeholder="placeholder"
|
||||
@keyup.enter="addItem"
|
||||
class="flex-grow mr-2 px-2 py-1 border border-gray-300 rounded dark:bg-gray-600"
|
||||
>
|
||||
<button @click="addItem" class="bg-blue-500 text-white px-4 py-1 rounded hover:bg-blue-600">Add</button>
|
||||
</div>
|
||||
<ul class="list-disc list-inside" v-if="modelValue.length > 0">
|
||||
<li
|
||||
v-for="(item, index) in modelValue"
|
||||
:key="index"
|
||||
class="flex items-center mb-1 relative"
|
||||
:class="{ 'bg-gray-200': draggingIndex === index }"
|
||||
>
|
||||
<span class="flex-grow">{{ item }}</span>
|
||||
<div>
|
||||
<div class="flex mb-4">
|
||||
<input
|
||||
type="text"
|
||||
v-model="newItem"
|
||||
:placeholder="placeholder"
|
||||
@keyup.enter="addItem"
|
||||
class="flex-grow mr-4 px-4 py-2 border border-gray-300 rounded dark:bg-gray-600 text-lg"
|
||||
>
|
||||
<button @click="addItem" class="bg-blue-500 text-white px-6 py-2 rounded hover:bg-blue-600 text-lg">Add</button>
|
||||
</div>
|
||||
<ul class="list-none" v-if="modelValue.length > 0">
|
||||
<li
|
||||
v-for="(item, index) in modelValue"
|
||||
:key="index"
|
||||
class="flex items-center mb-2 relative"
|
||||
:class="{ 'bg-gray-200': draggingIndex === index }"
|
||||
>
|
||||
<span class="flex-grow text-xl">{{ item }}</span>
|
||||
<div class="flex items-center">
|
||||
<button
|
||||
@click="removeItem(index)"
|
||||
class="text-red-500 hover:text-red-700 ml-2"
|
||||
class="text-red-500 hover:text-red-700 p-2"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</button>
|
||||
<div
|
||||
v-if="draggingIndex === index"
|
||||
class="absolute top-0 left-0 w-full h-full bg-gray-200 opacity-50 cursor-move"
|
||||
@mousedown="startDragging(index)"
|
||||
@mousemove="dragItem(index)"
|
||||
@mouseup="stopDragging"
|
||||
></div>
|
||||
<div
|
||||
v-if="draggingIndex !== index && index > draggingIndex"
|
||||
class="absolute top-0 left-0 w-full h-full bg-gray-200 opacity-50 cursor-move"
|
||||
@mousedown="startDragging(index)"
|
||||
@mousemove="dragItem(index)"
|
||||
@mouseup="stopDragging"
|
||||
></div>
|
||||
<div
|
||||
v-if="draggingIndex !== index && index < draggingIndex"
|
||||
class="absolute top-0 left-0 w-full h-full bg-gray-200 opacity-50 cursor-move"
|
||||
@mousedown="startDragging(index)"
|
||||
@mousemove="dragItem(index)"
|
||||
@mouseup="stopDragging"
|
||||
></div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="mt-2" v-if="modelValue.length > 0">
|
||||
<button @click="removeAll" class="bg-red-500 text-white px-4 py-1 rounded hover:bg-red-600">Remove All</button>
|
||||
</div>
|
||||
<button
|
||||
v-if="index > 0"
|
||||
@click="moveUp(index)"
|
||||
class="bg-gray-300 hover:bg-gray-400 p-2 rounded mr-2"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M14.707 12.707a1 1 0 01-1.414 0L10 9.414l-3.293 3.293a1 1 0 01-1.414-1.414l4-4a1 1 0 011.414 0l4 4a1 1 0 010 1.414z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</button>
|
||||
<button
|
||||
v-if="index < modelValue.length - 1"
|
||||
@click="moveDown(index)"
|
||||
class="bg-gray-300 hover:bg-gray-400 p-2 rounded"
|
||||
>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
v-if="draggingIndex === index"
|
||||
class="absolute top-0 left-0 w-full h-full bg-gray-200 opacity-50 cursor-move"
|
||||
@mousedown="startDragging(index)"
|
||||
@mousemove="dragItem(index)"
|
||||
@mouseup="stopDragging"
|
||||
></div>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="mt-4" v-if="modelValue.length > 0">
|
||||
<button @click="removeAll" class="bg-red-500 text-white px-6 py-2 rounded hover:bg-red-600 text-lg">Remove All</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'StringListManager',
|
||||
props: {
|
||||
modelValue: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: 'Enter an item',
|
||||
},
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// Script remains unchanged
|
||||
export default {
|
||||
name: 'StringListManager',
|
||||
props: {
|
||||
modelValue: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
emits: ['update:modelValue', 'change'],
|
||||
data() {
|
||||
return {
|
||||
newItem: '',
|
||||
draggingIndex: null,
|
||||
};
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: 'Enter an item',
|
||||
},
|
||||
methods: {
|
||||
addItem() {
|
||||
if (this.newItem.trim()) {
|
||||
const updatedList = [...this.modelValue, this.newItem.trim()];
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
this.newItem = '';
|
||||
}
|
||||
},
|
||||
removeItem(index) {
|
||||
const updatedList = this.modelValue.filter((_, i) => i !== index);
|
||||
},
|
||||
emits: ['update:modelValue', 'change'],
|
||||
data() {
|
||||
return {
|
||||
newItem: '',
|
||||
draggingIndex: null,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
addItem() {
|
||||
if (this.newItem.trim()) {
|
||||
const updatedList = [...this.modelValue, this.newItem.trim()];
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
},
|
||||
removeAll() {
|
||||
this.$emit('update:modelValue', []);
|
||||
this.$emit('change');
|
||||
},
|
||||
startDragging(index) {
|
||||
this.draggingIndex = index;
|
||||
},
|
||||
dragItem(index) {
|
||||
if (this.draggingIndex !== null) {
|
||||
const updatedList = [...this.modelValue];
|
||||
const draggedItem = updatedList.splice(this.draggingIndex, 1)[0];
|
||||
updatedList.splice(index, 0, draggedItem);
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
}
|
||||
},
|
||||
stopDragging() {
|
||||
this.draggingIndex = null;
|
||||
},
|
||||
this.newItem = '';
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
removeItem(index) {
|
||||
const updatedList = this.modelValue.filter((_, i) => i !== index);
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
},
|
||||
removeAll() {
|
||||
this.$emit('update:modelValue', []);
|
||||
this.$emit('change');
|
||||
},
|
||||
startDragging(index) {
|
||||
this.draggingIndex = index;
|
||||
},
|
||||
dragItem(index) {
|
||||
if (this.draggingIndex !== null) {
|
||||
const updatedList = [...this.modelValue];
|
||||
const draggedItem = updatedList.splice(this.draggingIndex, 1)[0];
|
||||
updatedList.splice(index, 0, draggedItem);
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
}
|
||||
},
|
||||
stopDragging() {
|
||||
this.draggingIndex = null;
|
||||
},
|
||||
moveUp(index) {
|
||||
if (index > 0) {
|
||||
const updatedList = [...this.modelValue];
|
||||
const itemToMove = updatedList.splice(index, 1)[0];
|
||||
updatedList.splice(index - 1, 0, itemToMove);
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
}
|
||||
},
|
||||
moveDown(index) {
|
||||
if (index < this.modelValue.length - 1) {
|
||||
const updatedList = [...this.modelValue];
|
||||
const itemToMove = updatedList.splice(index, 1)[0];
|
||||
updatedList.splice(index + 1, 0, itemToMove);
|
||||
this.$emit('update:modelValue', updatedList);
|
||||
this.$emit('change');
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
@ -241,6 +241,22 @@
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="min-width: 200px;">
|
||||
<!-- ? Label for the checkbox to enable/disable smart routing -->
|
||||
<label for="restore_model_after_smart_routing" class="text-sm font-bold" style="margin-right: 1rem;">Restore model after smart routing:</label>
|
||||
</td>
|
||||
<td style="width: 100%;">
|
||||
<!-- ? Checkbox input to toggle smart routing on/off -->
|
||||
<input
|
||||
type="checkbox"
|
||||
id="restore_model_after_smart_routing"
|
||||
v-model="configFile.restore_model_after_smart_routing"
|
||||
@change="settingsChanged=true"
|
||||
class="mt-1 px-2 py-1 border border-gray-300 rounded dark:bg-gray-600"
|
||||
>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="min-width: 200px;">
|
||||
<!-- ? Label for the input field to specify the router model -->
|
||||
|
||||
Loading…
Reference in New Issue
Block a user