ExternalVendorCode/lollms-webui
1
0
Fork 0
mirror of https://github.com/ParisNeo/lollms-webui.git synced 2024-12-19 12:27:52 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixed personality selector

Browse Source
This commit is contained in:
AndzejsP 2023-06-14 13:39:13 +03:00
parent 3aabf4d3bc
commit 276848884c
2 changed files with 82 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
web/src/components/PersonalityEntry.vue
View File

@ -78,6 +78,7 @@ export default {
onSelected: Function, onSelected: Function,
selected: Boolean, selected: Boolean,
onMounted: Function, onMounted: Function,
full_path:String
}, },
data() { data() {

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

@ -338,10 +338,10 @@
<div class="group "> <div class="group ">
<button @click.stop="onPersonalitySelected(item)"> <button @click.stop="onPersonalitySelected(item)">
<img :src="item.$refs.imgElement.src" <img :src="bUrl + item.avatar" @error="personalityImgPlacehodler"
class="w-8 h-8 rounded-full object-fill text-red-700 border-2 active:scale-90 group-hover:border-secondary " class="w-8 h-8 rounded-full object-fill text-red-700 border-2 active:scale-90 group-hover:border-secondary "
:class="item.selected ? 'border-secondary':'border-transparent z-0'" :class="configFile.active_personality_id == configFile.personalities.indexOf(item.full_path) ? 'border-secondary':'border-transparent z-0'"
:title="item.personality.name" :title="item.name"
> >
</button> </button>
<button @click.stop="onPersonalityMounted(item)"> <button @click.stop="onPersonalityMounted(item)">
@ -418,7 +418,7 @@
:class="pzl_collapsed ? '' : 'max-h-96'"> :class="pzl_collapsed ? '' : 'max-h-96'">
<TransitionGroup name="bounce"> <TransitionGroup name="bounce">
<personality-entry ref="personalitiesZoo" v-for="(pers, index) in personalitiesFiltered" <personality-entry ref="personalitiesZoo" v-for="(pers, index) in personalitiesFiltered"
:key="'index-' + index + '-' + pers.name" :personality="pers" :key="'index-' + index + '-' + pers.name" :personality="pers" :full_path="pers.full_path"
:selected="configFile.active_personality_id == configFile.personalities.findIndex(item => item === pers.full_path) " :selected="configFile.active_personality_id == configFile.personalities.findIndex(item => item === pers.full_path) "
:on-selected="onPersonalitySelected" :on-mounted="onPersonalityMounted" /> :on-selected="onPersonalitySelected" :on-mounted="onPersonalityMounted" />
</TransitionGroup> </TransitionGroup>
@ -691,6 +691,7 @@ import defaultModelImgPlaceholder from "../assets/default_model.png"
import defaultPersonalityImgPlaceholder from "../assets/logo.svg" import defaultPersonalityImgPlaceholder from "../assets/logo.svg"
import AddModelDialog from "@/components/AddModelDialog.vue"; import AddModelDialog from "@/components/AddModelDialog.vue";
const bUrl = import.meta.env.VITE_GPT4ALL_API_BASEURL
axios.defaults.baseURL = import.meta.env.VITE_GPT4ALL_API_BASEURL axios.defaults.baseURL = import.meta.env.VITE_GPT4ALL_API_BASEURL
export default { export default {
components: { components: {
@ -746,8 +747,8 @@ export default {
diskUsage: {}, diskUsage: {},
ramUsage: {}, ramUsage: {},
mountedPersArr: [], mountedPersArr: [],
isMounted: false // Needed to wait for $refs to be rendered isMounted: false, // Needed to wait for $refs to be rendered
bUrl:bUrl // for personality images
} }
}, },
@ -789,6 +790,7 @@ export default {
.then(response => { .then(response => {
this.models = response.data; this.models = response.data;
this.models.sort((a, b) => a.title.localeCompare(b.title))
this.fetchCustomModels() this.fetchCustomModels()
}) })
.catch(error => { .catch(error => {
@ -821,12 +823,12 @@ export default {
}); });
}, },
async onPersonalitySelected(pers) { async onPersonalitySelected(pers) {
console.log('on pers', pers)
// eslint-disable-next-line no-unused-vars // eslint-disable-next-line no-unused-vars
if (this.isLoading) { if (this.isLoading) {
this.$refs.toast.showToast("Loading... please wait", 4, false) this.$refs.toast.showToast("Loading... please wait", 4, false)
} }
if (pers.personality) { if (pers) {
if(pers.selected){ if(pers.selected){
this.$refs.toast.showToast("Personality already selected", 4, true) this.$refs.toast.showToast("Personality already selected", 4, true)
@ -841,7 +843,7 @@ export default {
const res= await this.select_personality(pers) const res= await this.select_personality(pers)
if(res.status){ if(res.status){
this.$refs.toast.showToast("Selected personality:\n" + pers.personality.name, 4, true) this.$refs.toast.showToast("Selected personality:\n" + pers.name, 4, true)
} }
@ -1035,15 +1037,23 @@ export default {
refresh() { refresh() {
// No need to refresh all lists because they never change during using application.
// On settings change only config file chnages. this.api_get_req("list_models").then(response => {
// this.modelsArr = response
//this.api_get_req("list_bindings").then(response => { this.bindingsArr = response }) this.modelsArr.sort()
this.api_get_req("list_models").then(response => { this.modelsArr = response }) })
//this.api_get_req("list_personalities_languages").then(response => { this.persLangArr = response })
this.api_get_req("list_personalities_categories").then(response => { this.persCatgArr = response }) this.api_get_req("list_personalities_categories").then(response => {
//this.api_get_req("list_languages").then(response => { this.langArr = response }) this.persCatgArr = response
this.persCatgArr.sort()
})
this.api_get_req("get_config").then(response => { this.api_get_req("get_config").then(response => {
this.getPersonalitiesArr().then(()=>{
this.getMountedPersonalities()
})
console.log("Received config") console.log("Received config")
this.configFile = response this.configFile = response
@ -1058,26 +1068,30 @@ export default {
} }
}); });
}) })
this.api_get_req("get_current_personality_path_infos").then(response => { this.api_get_req("get_current_personality_path_infos").then(response => {
this.configFile.personality_language = response["personality_language"] this.configFile.personality_language = response["personality_language"]
this.configFile.personality_category = response["personality_category"] this.configFile.personality_category = response["personality_category"]
this.configFile.personality_folder = response["personality_name"] this.configFile.personality_folder = response["personality_name"]
console.log("received infos") console.log("received infos")
}); });
this.api_get_req("list_personalities").then(response => { this.api_get_req("list_personalities").then(response => {
this.persArr = response this.persArr = response
this.persArr.sort()
console.log(`Listed personalities:\n${response}`) console.log(`Listed personalities:\n${response}`)
}) })
this.api_get_req("disk_usage").then(response => { this.api_get_req("disk_usage").then(response => {
this.diskUsage = response this.diskUsage = response
}) })
this.api_get_req("ram_usage").then(response => { this.api_get_req("ram_usage").then(response => {
this.ramUsage = response this.ramUsage = response
}) })
//console.log('ram',this.ramUsage)
this.getPersonalitiesArr()
this.fetchModels(); this.fetchModels();
this.getMountedPersonalities()
}, },
// Accordeon stuff // Accordeon stuff
toggleAccordion() { toggleAccordion() {
@ -1251,7 +1265,7 @@ export default {
const personalitiesArray = catdictionary[catkey]; const personalitiesArray = catdictionary[catkey];
const modPersArr = personalitiesArray.map((item) => { const modPersArr = personalitiesArray.map((item) => {
const isMounted = config.personalities.includes(langkey + '/' + catkey + '/' + item.name) const isMounted = config.personalities.includes(langkey + '/' + catkey + '/' + item.folder)
// if (isMounted) { // if (isMounted) {
// console.log(item) // console.log(item)
// } // }
@ -1259,7 +1273,7 @@ export default {
newItem = item newItem = item
newItem.category = catkey // add new props to items newItem.category = catkey // add new props to items
newItem.language = langkey // add new props to items newItem.language = langkey // add new props to items
newItem.full_path = langkey + '/' + catkey + '/' + item.name // add new props to items newItem.full_path = langkey + '/' + catkey + '/' + item.folder // add new props to items
newItem.isMounted = isMounted // add new props to items newItem.isMounted = isMounted // add new props to items
return newItem return newItem
}) })
@ -1273,13 +1287,10 @@ export default {
} }
} }
// console.log(this.configFile)
// console.log(this.configFile.personality_category) this.personalities.sort((a, b) => a.name.localeCompare(b.name))
// console.log(this.configFile.personality_language)
// console.log("Personalities")
//console.log(this.personalities)
this.personalitiesFiltered = this.personalities.filter((item) => item.category === this.configFile.personality_category && item.language === this.configFile.personality_language) this.personalitiesFiltered = this.personalities.filter((item) => item.category === this.configFile.personality_category && item.language === this.configFile.personality_language)
//console.log(`Personalities filtered ${this.personalitiesFiltered}`) this.personalitiesFiltered.sort()
this.isLoading = false this.isLoading = false
@ -1290,7 +1301,6 @@ export default {
async mount_personality(pers) { async mount_personality(pers) {
if (!pers) { return { 'status': false, 'error': 'no personality - mount_personality' } } if (!pers) { return { 'status': false, 'error': 'no personality - mount_personality' } }
try { try {
const obj = { const obj = {
language: pers.language, language: pers.language,
@ -1315,7 +1325,7 @@ export default {
}, },
async unmount_personality(pers) { async unmount_personality(pers) {
if (!pers) { return { 'status': false, 'jig': 'no personality - unmount_personality' } } if (!pers) { return { 'status': false, 'error': 'no personality - unmount_personality' } }
const obj = { const obj = {
language: pers.language, language: pers.language,
@ -1339,9 +1349,9 @@ export default {
}, },
async select_personality(pers) { async select_personality(pers) {
if (!pers) { return { 'status': false, 'jig': 'no personality - select_personality' } } if (!pers) { return { 'status': false, 'error': 'no personality - select_personality' } }
console.log('select pers',pers) console.log('select pers',pers)
const id = this.configFile.personalities.findIndex(item=> item === pers.personality.full_path) const id = this.configFile.personalities.findIndex(item=> item === pers.full_path)
const obj = { const obj = {
id: id id: id
@ -1379,7 +1389,7 @@ export default {
this.$refs.toast.showToast("Personality mounted", 4, true) this.$refs.toast.showToast("Personality mounted", 4, true)
pers.isMounted = true pers.isMounted = true
const res2 = await this.select_personality(pers) const res2 = await this.select_personality(pers.personality)
if (res2.status) { if (res2.status) {
this.$refs.toast.showToast("Selected personality:\n" + pers.personality.name, 4, true) this.$refs.toast.showToast("Selected personality:\n" + pers.personality.name, 4, true)
@ -1406,9 +1416,9 @@ export default {
const lastPers = this.mountedPersArr[this.mountedPersArr.length-1] const lastPers = this.mountedPersArr[this.mountedPersArr.length-1]
console.log(lastPers, this.mountedPersArr.length) console.log(lastPers, this.mountedPersArr.length)
const res2 = await this.select_personality(lastPers) const res2 = await this.select_personality(lastPers.personality)
if (res2.status) { if (res2.status) {
this.$refs.toast.showToast("Selected personality:\n" + lastPers.personality.name, 4, true) this.$refs.toast.showToast("Selected personality:\n" + lastPers.name, 4, true)
} }
@ -1426,11 +1436,11 @@ export default {
for (let i = 0; i < this.configFile.personalities.length; i++) { for (let i = 0; i < this.configFile.personalities.length; i++) {
const full_path_item = this.configFile.personalities[i] const full_path_item = this.configFile.personalities[i]
//console.log('perrs listo',this.personalities)
const index = this.$refs.personalitiesZoo.findIndex(item => item.personality.full_path == full_path_item) const index = this.personalities.findIndex(item => item.full_path == full_path_item)
if (index) { if (index) {
const pers = this.$refs.personalitiesZoo[index] const pers = this.personalities[index]
if (pers) { if (pers) {
mountedPersArr.push(pers) mountedPersArr.push(pers)
@ -1442,14 +1452,14 @@ export default {
this.mountedPersArr = [] this.mountedPersArr = []
this.mountedPersArr = mountedPersArr this.mountedPersArr = mountedPersArr
//this.mountedPersArr = mountedPersArr //this.mountedPersArr = mountedPersArr
console.log('getMountedPersonalities', mountedPersArr.length) console.log('getMountedPersonalities', mountedPersArr)
}, },
onPersonalityMounted(persItem) { onPersonalityMounted(persItem) {
console.log('on sel ', persItem)
if (this.configFile.personalities.includes(persItem.full_path)) {
if (this.configFile.personalities.includes(persItem.personality.full_path)) {
//this.$refs.toast.showToast("Personality already mounted", 4, false) //this.$refs.toast.showToast("Personality already mounted", 4, false)
//return //return
//persItem.ismounted = false //persItem.ismounted = false
@ -1467,7 +1477,10 @@ export default {
} }
} },
personalityImgPlacehodler(event) {
event.target.src = defaultPersonalityImgPlaceholder
},
}, async mounted() { }, async mounted() {
@ -1476,6 +1489,7 @@ export default {
feather.replace() feather.replace()
}) })
this.configFile = await this.api_get_req("get_config") this.configFile = await this.api_get_req("get_config")
let personality_path_infos = await this.api_get_req("get_current_personality_path_infos") let personality_path_infos = await this.api_get_req("get_current_personality_path_infos")
this.configFile.personality_language = personality_path_infos["personality_language"] this.configFile.personality_language = personality_path_infos["personality_language"]
@ -1488,14 +1502,28 @@ export default {
} }
this.fetchModels(); this.fetchModels();
this.bindingsArr = await this.api_get_req("list_bindings") this.bindingsArr = await this.api_get_req("list_bindings")
this.modelsArr = await this.api_get_req("list_models") this.modelsArr = await this.api_get_req("list_models")
this.persLangArr = await this.api_get_req("list_personalities_languages") this.persLangArr = await this.api_get_req("list_personalities_languages")
this.persCatgArr = await this.api_get_req("list_personalities_categories") this.persCatgArr = await this.api_get_req("list_personalities_categories")
this.persArr = await this.api_get_req("list_personalities") this.persArr = await this.api_get_req("list_personalities")
this.langArr = await this.api_get_req("list_languages") this.langArr = await this.api_get_req("list_languages")
this.bindingsArr.sort((a, b) => a.name.localeCompare(b.name))
this.modelsArr.sort()
this.persLangArr.sort()
this.persCatgArr.sort()
this.persArr.sort()
this.langArr.sort()
await this.getPersonalitiesArr() await this.getPersonalitiesArr()
this.bindings = await this.api_get_req("list_bindings") this.bindings = await this.api_get_req("list_bindings")
this.bindings.sort((a, b) => a.name.localeCompare(b.name))
this.isLoading = false this.isLoading = false
this.diskUsage = await this.api_get_req("disk_usage") this.diskUsage = await this.api_get_req("disk_usage")
this.ramUsage = await this.api_get_req("ram_usage") this.ramUsage = await this.api_get_req("ram_usage")
@ -1555,17 +1583,17 @@ export default {
return defaultModelImgPlaceholder return defaultModelImgPlaceholder
} }
}, },
imgPersonality() { // imgPersonality() {
if (!this.isMounted) { // if (!this.isMounted) {
return // return
} // }
try { // try {
return this.$refs.personalitiesZoo[this.$refs.personalitiesZoo.findIndex(item => item.personality.folder == this.configFile.personality_folder)].$refs.imgElement.src // return this.$refs.personalitiesZoo[this.$refs.personalitiesZoo.findIndex(item => item.personality.folder == this.configFile.personality_folder)].$refs.imgElement.src
} // }
catch (error) { // catch (error) {
return defaultPersonalityImgPlaceholder // return defaultPersonalityImgPlaceholder
} // }
}, // },
}, },