ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2025-01-31 08:25:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

added custom model visibility in the list

Browse Source
This commit is contained in:
AndzejsP 2023-05-24 13:20:04 +03:00
parent e2cfdfd73e
commit 6067c9be08
2 changed files with 83 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

108
web/src/components/ModelEntry.vue
View File

@ -1,62 +1,69 @@
<template> <template>
<div class="flex items-center p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer" @click.stop="toggleSelected" :class="selected?' border-primary-light':'border-transparent'"> <div class="flex items-center p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer"
@click.stop="toggleSelected" :class="selected ? ' border-primary-light' : 'border-transparent'">
<div class="flex-shrink-0"> <div class="flex-shrink-0">
<i :class="`fas ${icon} text-xl`"></i> <i :class="`fas ${icon} text-xl`"></i>
</div> </div>
<div class="flex-1"> <div v-if="model.isCustomModel">
<h3 class="font-bold font-large text-lg"> <h3 class="font-bold font-large text-lg">
{{ title }} {{ title }}
</h3> </h3>
<div class="flex flex-shrink-0">
<b>Manual download:&nbsp;</b> </div>
<a :href="path" @click.stop <div class="flex-1" v-if="!model.isCustomModel">
class="flex hover:text-secondary duration-75 active:scale-90" <h3 class="font-bold font-large text-lg">
title="Download this manually (faster) and put it in the models/<your backend> folder then refresh"> {{ title }}
<i data-feather="link" class="w-5 p-1"></i> </h3>
{{ title }}
</a> <div class="flex flex-shrink-0">
</div> <b>Manual download:&nbsp;</b>
<div class="flex flex-shrink-0"> <a :href="path" @click.stop class="flex hover:text-secondary duration-75 active:scale-90"
<b>License:&nbsp;</b> title="Download this manually (faster) and put it in the models/<your backend> folder then refresh">
<i data-feather="link" class="w-5 p-1"></i>
{{ title }}
</a>
</div>
<div class="flex flex-shrink-0">
<b>License:&nbsp;</b>
{{ license }} {{ license }}
</div>
<div class="flex flex-shrink-0">
<b>Owner:&nbsp;</b>
<a :href="owner_link" target="_blank" @click.stop class="flex hover:text-secondary duration-75 active:scale-90"
title="Owner's profile">
<i data-feather="link" class="w-5 p-1"></i>
{{ owner }}
</a>
</div>
<b>Description:&nbsp;</b><br>
<p class="opacity-80">{{ description }}</p>
</div> </div>
<div class="flex flex-shrink-0"> <div class="flex-shrink-0" v-if="!model.isCustomModel">
<b>Owner:&nbsp;</b> <button class="px-4 py-2 rounded-md text-white font-bold transition-colors duration-300"
<a :href="owner_link" target="_blank" @click.stop :class="[isInstalled ? 'bg-red-500 hover:bg-red-600' : 'bg-green-500 hover:bg-green-600']"
class="flex hover:text-secondary duration-75 active:scale-90" :disabled="installing || uninstalling" @click.stop="toggleInstall">
title="Owner's profile"> <template v-if="installing">
<i data-feather="link" class="w-5 p-1"></i> <div class="flex items-center space-x-2">
{{ owner }} <div class="h-2 w-20 bg-gray-300 rounded">
</a> <div :style="{ width: progress + '%' }" class="h-full bg-red-500 rounded"></div>
</div> </div>
<b>Description:&nbsp;</b><br> <span>Installing...{{ Math.floor(progress) }}%</span>
<p class="opacity-80">{{ description }}</p>
</div>
<div class="flex-shrink-0">
<button class="px-4 py-2 rounded-md text-white font-bold transition-colors duration-300"
:class="[isInstalled ? 'bg-red-500 hover:bg-red-600' : 'bg-green-500 hover:bg-green-600']"
:disabled="installing || uninstalling" @click.stop="toggleInstall">
<template v-if="installing">
<div class="flex items-center space-x-2">
<div class="h-2 w-20 bg-gray-300 rounded">
<div :style="{ width: progress + '%' }" class="h-full bg-red-500 rounded"></div>
</div> </div>
<span>Installing...{{ Math.floor(progress) }}%</span> </template>
</div> <template v-else-if="uninstalling">
</template> <div class="flex items-center space-x-2">
<template v-else-if="uninstalling"> <div class="h-2 w-20 bg-gray-300 rounded">
<div class="flex items-center space-x-2"> <div :style="{ width: progress + '%' }" class="h-full bg-green-500"></div>
<div class="h-2 w-20 bg-gray-300 rounded"> </div>
<div :style="{ width: progress + '%' }" class="h-full bg-green-500"></div> <span>Uninstalling...</span>
</div> </div>
<span>Uninstalling...</span> </template>
</div> <template v-else>
</template> {{ isInstalled ? 'Uninstall' : 'Install' }}
<template v-else> </template>
{{ isInstalled ? 'Uninstall' : 'Install' }} </button>
</template> </div>
</button>
</div>
</div> </div>
</template> </template>
@ -76,7 +83,8 @@ export default {
onInstall: Function, onInstall: Function,
onUninstall: Function, onUninstall: Function,
onSelected: Function, onSelected: Function,
selected: Boolean selected: Boolean,
model: Object
}, },
data() { data() {
return { return {
@ -104,7 +112,7 @@ export default {
} }
}, },
toggleSelected(){ toggleSelected() {
this.onSelected(this) this.onSelected(this)
}, },
handleSelection() { handleSelection() {

26
web/src/views/SettingsView.vue
View File

@ -131,7 +131,7 @@
:path="model.path" :owner="model.owner" :owner_link="model.owner_link" :license="model.license" :path="model.path" :owner="model.owner" :owner_link="model.owner_link" :license="model.license"
:description="model.description" :is-installed="model.isInstalled" :on-install="onInstall" :description="model.description" :is-installed="model.isInstalled" :on-install="onInstall"
:on-uninstall="onUninstall" :on-selected="onSelected" :on-uninstall="onUninstall" :on-selected="onSelected"
:selected="model.title === configFile.model" /> :selected="model.title === configFile.model" :model="model" />
</div> </div>
</div> </div>
<!-- EXPAND / COLLAPSE BUTTON --> <!-- EXPAND / COLLAPSE BUTTON -->
@ -490,6 +490,30 @@ export default {
//console.log(`Models list recovered successfuly: ${JSON.stringify(response.data)}`) //console.log(`Models list recovered successfuly: ${JSON.stringify(response.data)}`)
console.log(" models",response.data.length) console.log(" models",response.data.length)
this.models = response.data; this.models = response.data;
this.fetchCustomModels()
})
.catch(error => {
console.log(error);
});
},
fetchCustomModels() {
console.log("Fetching Custom models")
axios.get('/list_models')
.then(response => {
// Returns array of model filenames which are = to title of models zoo entry
for (let i = 0; i < response.data.length; i++) {
const customModel = response.data[i]
const index = this.models.findIndex(x => x.title == customModel)
console.log("model-ccc", customModel, index)
if (index==-1){
let newModelEntry = {}
newModelEntry.title = customModel
newModelEntry.isCustomModel = true
this.models.push(newModelEntry)
}
}
}) })
.catch(error => { .catch(error => {
console.log(error); console.log(error);