From cc194be0d62ac5caece500277d10621a84cb52ca Mon Sep 17 00:00:00 2001
From: Zhigang Wang <zhigangw@hotmail.com>
Date: Fri, 14 Jun 2024 13:22:15 -0700
Subject: [PATCH] add the supporting to machine translation

---
 frontend/src/pages/lab/translation/Home.vue | 27 ++++++++++++++-------
 frontend/src/utils/backend/index.js         |  1 +
 frontend/src/utils/backend/lab.js           | 16 ++++++++++++
 frontend/src/utils/index.js                 |  3 ++-
 4 files changed, 37 insertions(+), 10 deletions(-)
 create mode 100644 frontend/src/utils/backend/lab.js

diff --git a/frontend/src/pages/lab/translation/Home.vue b/frontend/src/pages/lab/translation/Home.vue
index a8248e1..39129f8 100644
--- a/frontend/src/pages/lab/translation/Home.vue
+++ b/frontend/src/pages/lab/translation/Home.vue
@@ -1,9 +1,11 @@
 <template>
     <div class="input_containter">
-        <input type="text" v-model="input_text">
+        <input type="text" v-model="input_text" @keyup.enter="translate($event)">
+        <p>{{ translated_text }}</p>
     </div>
 </template>
 <script>
+import { LabApi } from '../../../utils/index'
 export default {
     name: 'TranslationHome',
     components: {},
@@ -11,16 +13,23 @@ export default {
     mounted() {
     },
     methods: {
-        translate(text) {
-            this.mnx_navToLink((directory.path))
-        }
-    },
-    data() {
-        return {
-            input_text: null
+        translate($event) {
+            LabApi.translate_text(this.input_text)
+                .then((response) => {
+                    this.translated_text = response.data
+                })
+                .catch((error) => {
+                    this.mnx_backendErrorHandler(error)
+                })
+            }
+        },
+        data() {
+            return {
+                input_text: null,
+                translated_text: null
+            }
         }
     }
-}
 </script>
   
 <style scoped lang="scss">
diff --git a/frontend/src/utils/backend/index.js b/frontend/src/utils/backend/index.js
index 496acf5..2cbf39b 100644
--- a/frontend/src/utils/backend/index.js
+++ b/frontend/src/utils/backend/index.js
@@ -6,3 +6,4 @@ export { ProviderHubApi } from './providerHub'
 export { MessageHubApi } from './messageHub'
 export { HistoryApi } from './history'
 export { ContentApi } from './content'
+export { LabApi } from './lab'
\ No newline at end of file
diff --git a/frontend/src/utils/backend/lab.js b/frontend/src/utils/backend/lab.js
new file mode 100644
index 0000000..bcdb720
--- /dev/null
+++ b/frontend/src/utils/backend/lab.js
@@ -0,0 +1,16 @@
+import { backendAxios } from './axios'
+import { userUtils } from '../store/index'
+class LabApi {
+    static translate_text(input_text) {
+        let jwt = userUtils.getJwtToken()
+        const request = backendAxios.post('/api/lab/translate_text',
+            {
+                input_text: input_text
+            },
+            {
+                headers: { Authorization: `Bearer ${jwt}` }
+            })
+        return request
+    }
+}
+export { LabApi }
diff --git a/frontend/src/utils/index.js b/frontend/src/utils/index.js
index b4eecd6..a6c7d79 100644
--- a/frontend/src/utils/index.js
+++ b/frontend/src/utils/index.js
@@ -6,7 +6,8 @@ export {
   ProviderHubApi,
   MessageHubApi,
   HistoryApi,
-  ContentApi
+  ContentApi,
+  LabApi
 } from './backend/index'
 
 export { userUtils, userProfileUtils, requestIssueUtils, requestHubUtils } from './store/index'