From 6ce0776dafc99e7a7a2ab5a1c7dedf5d9ffcfacc Mon Sep 17 00:00:00 2001
From: AndzejsP <andzejs.poprockis@gmail.com>
Date: Thu, 22 Jun 2023 13:29:42 +0300
Subject: [PATCH] added pers settigns

---
 web/src/components/PersonalityEntry.vue | 34 +++++++++++----------
 web/src/views/SettingsView.vue          | 39 ++++++++++++++++++++++---
 2 files changed, 53 insertions(+), 20 deletions(-)

diff --git a/web/src/components/PersonalityEntry.vue b/web/src/components/PersonalityEntry.vue
index 25ba252e..a8a789c5 100644
--- a/web/src/components/PersonalityEntry.vue
+++ b/web/src/components/PersonalityEntry.vue
@@ -1,12 +1,13 @@
 <template>
   <div
     class=" items-start p-4 hover:bg-primary-light rounded-lg mb-2 shadow-lg border-2 cursor-pointer  active:scale-95 duration-75 select-none"
-    @click.stop="toggleSelected" :class="selected ? ' border-primary-light' : 'border-transparent'">
+    @click.stop="toggleSelected" :class="selected ? 'border-primary-light' : 'border-transparent'">
 
 
     <div class="flex flex-row items-center  flex-shrink-0 gap-3">
       <img ref="imgElement" :src="getImgUrl()" @error="defaultImg($event)"
-        class="w-10 h-10 rounded-full object-fill text-red-700">
+        class="w-10 h-10 rounded-full object-fill text-red-700" >
+        <!-- :class="personality.installed ? 'grayscale-0':'grayscale'" -->
       <h3 class="font-bold font-large text-lg line-clamp-3">
         {{ personality.name }}
       </h3>
@@ -14,24 +15,20 @@
         <!-- EMPTY SPACE FILLER -->
       </div>
       <!-- ADVANCED OPTIONS - NOT IMPLEMENTED -->
-      <div class="flex-none">
-
-        <!-- CHECKBOX MOUNTED  -->
+      <div class="flex items-center">
+        <button v-if="personality.has_scripts" type="button" title="Settings"
+            class="hover:text-secondary duration-75 active:scale-90 font-medium rounded-lg text-sm p-2 text-center inline-flex items-center " @click.stop="toggleSettings">
+            <i data-feather="sliders" class="w-5"></i>
+            <span class="sr-only">Settings</span>
+          </button>
+        <!-- BUTTON MOUNTED  -->
         <button type="button" @click.stop="toggleMounted"
           class="inline-flex items-center px-5 py-2.5 text-sm font-medium text-center text-white bg-blue-700 rounded-lg hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800" :class="isMounted ? ' bg-red-700 rounded-lg hover:bg-red-800 focus:ring-red-300 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-800':''">
           {{isMounted ? 'Unmount':'Mount'}}
-          <!-- <span
-            class="inline-flex items-center justify-center w-4 h-4 ml-2 text-xs font-semibold text-blue-800 bg-blue-200 rounded-full">
-            <input disabled id="default-checkbox" type="checkbox" v-model="isMounted" 
-              class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
-          </span> -->
+
         </button>
 
-        <!-- <div class="flex items-center mb-4" @click.stop title="Click to mount/unmount">
-          <input id="default-checkbox" type="checkbox" v-model="isMounted" @change.stop="toggleMounted"
-            class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600">
-          <label for="default-checkbox" class="ml-2 text-sm font-medium">Mounted</label>
-        </div> -->
+
       </div>
 
 
@@ -78,7 +75,9 @@ export default {
     onSelected: Function,
     selected: Boolean,
     onMounted: Function,
-    full_path:String
+    full_path:String,
+    onSettings:Function
+
 
   },
   data() {
@@ -113,6 +112,9 @@ export default {
     toggleMounted() {
       this.onMounted(this)
     },
+    toggleSettings() {
+      this.onSettings(this)
+    },
 
   }
 };
diff --git a/web/src/views/SettingsView.vue b/web/src/views/SettingsView.vue
index 1e02b26b..e343034d 100644
--- a/web/src/views/SettingsView.vue
+++ b/web/src/views/SettingsView.vue
@@ -545,7 +545,8 @@
                                         :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)"
-                                        :on-selected="onPersonalitySelected" :on-mounted="onPersonalityMounted" />
+                                        :on-selected="onPersonalitySelected" :on-mounted="onPersonalityMounted"
+                                        :on-settings="onSettingsPersonality" />
                                 </TransitionGroup>
                             </div>
                         </div>
@@ -892,6 +893,7 @@ export default {
             isModelSelected: false,
             diskUsage: {},
             ramUsage: {},
+            vramUsage: {},
             mountedPersArr: [],
             isMounted: false, // Needed to wait for $refs to be rendered
             bUrl: bUrl, // for personality images
@@ -1197,9 +1199,37 @@ export default {
 
             const newItem = { name: "babagaga", value: ['lol', 'asdasd', 'hhhhhh'], type: 'list', help: 'smelly ' }
             arr2.push(newItem)
-           // this.$refs.universalForm.showForm(arr2, "Baba booey form", "Go for torps", "go home").then(res => {
-           //     console.log('finished', res)
-           // }) // disabled to not break UI just add endpoint or anything
+            // this.$refs.universalForm.showForm(arr2, "Baba booey form", "Go for torps", "go home").then(res => {
+            //     console.log('finished', res)
+            // }) // disabled to not break UI just add endpoint or anything
+        },
+        onSettingsPersonality(persEntry) {
+            try {
+                axios.post('/get_personality_settings',
+                {
+                    language: persEntry.personality.language,
+                    category: persEntry.personality.category,
+                    folder: persEntry.personality.folder
+                }).then(res => {
+
+                    if (res) {
+
+                        console.log('pers sett', res)
+                        if(res.data){
+                            this.$refs.universalForm.showForm(res.data, "Personality settings - "+persEntry.personality.name, "Save changes", "Cancel").then(res => {
+                                this.$refs.toast.showToast("Personality settings updated successfully!", 4, true)
+                            
+                                //console.log('finished', res)
+                        })
+                        }
+
+                    }
+                })
+
+            } catch (error) {
+                this.$refs.toast.showToast("Could not open personality settings. Endpoint error: "+error.message, 4, false)
+            }
+            
         },
         // messagebox ok stuff
         onMessageBoxOk() {
@@ -1770,6 +1800,7 @@ export default {
         this.isLoading = false
         this.diskUsage = await this.api_get_req("disk_usage")
         this.ramUsage = await this.api_get_req("ram_usage")
+        this.vramUsage = await this.api_get_req("vram_usage")
         this.getMountedPersonalities()
         this.isMounted = true