add the supporting to machine translation

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) {
+        translate($event) {
-            this.mnx_navToLink((directory.path))
+            LabApi.translate_text(this.input_text)
+                .then((response) => {
+                    this.translated_text = response.data
+                })
+                .catch((error) => {
+                    this.mnx_backendErrorHandler(error)
+                })
             }
         },
         data() {
             return {
-            input_text: null
+                input_text: null,
+                translated_text: null
+            }
         }
     }
-}
 </script>
   
 <style scoped lang="scss">

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'

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 }

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'