#24 Fix the issue where the translation API settings are sometimes invalid.

Fix the issue where the translation API settings are sometimes invalid.


Former-commit-id: 08b7321c98d386ef8949b00dc471ad494c853feb

javascript/main.entry.js.REMOVED.git-id

@@ -1 +1 @@
-be9da062e43cfdf0a882790514182d299979307c
+58e4046886d225c26bda2e7ed5ca55f001f3499b

javascript/main.entry.js.map.REMOVED.git-id

@@ -1 +1 @@
-d9fe9d06bca7ddbc2231c7ab25c3d4b33cefd817
+0cfa2ab51aa09e0f0e0854f046c574eb4abb9984

src/src/App.vue

@@ -18,6 +18,7 @@
         </block>
         <translate-setting ref="translateSetting" v-model:language-code="languageCode"
                            :translate-apis="translateApis" :languages="languages"
+                           @forceUpdate:translateApi="updateTranslateApiConfig"
                            v-model:translate-api="translateApi"></translate-setting>
         <select-language ref="selectLanguage" v-model:language-code="languageCode"
                          :translate-apis="translateApis"

src/src/components/translateSetting.vue

@@ -113,6 +113,7 @@ Github: Physton/sd-webui-prompt-all-in-one`,
         this.translatedText = ''
         this.loading = false
     },
+    emits: ['update:translateApi', 'forceUpdate:translateApi'],
     watch: {
         apiKey: {
             handler: function (val, oldVal) {
@@ -143,6 +144,9 @@ Github: Physton/sd-webui-prompt-all-in-one`,
         open(apiKey) {
             this.apiKey = apiKey
             this.isOpen = true
+            this.errorMessage = ''
+            this.translatedText = ''
+            this.loading = false
         },
         onTestClick() {
             if (this.loading) return
@@ -174,7 +178,9 @@ Github: Physton/sd-webui-prompt-all-in-one`,
                 configs[item.key] = item.value
             }
             this.$emit('update:translateApi', this.apiKey)
-            this.gradioAPI.setData('translate_api.' + this.apiKey, configs)
+            this.gradioAPI.setData('translate_api.' + this.apiKey, configs).then(res => {
+                if (this.apiKey === this.translateApi) this.$emit('forceUpdate:translateApi')
+            })
         },
         onCloseClick() {
             this.isOpen = false